:root{
    --color-red: rgba(223, 28, 1, 1);
    --color-blue: rgba(0, 33, 71, 1);
    --color-dark-grey: rgba(116, 118, 120, 1);
    --color-cool-grey: rgba(154, 155, 156, 1);
    --color-warm-grey: rgba(199, 194, 186, 1);
    --color-white: rgba(255, 255, 255, 1);
}

@media only screen and (max-width: 1112px) {
	.nav-list li a {padding: 15px 34.33px}

	.emergency-assistance-outer h2 {font-size: 21px;}
	.phone-call {font-size: 16px;}

	.simple-claims-grid p {font-size: 14.5px;}

	.What-documents-do-main .accordion-tabs img {width: 25px}
	.What-documents-do-main .accordion-tabs label {font-size: 14px;}
	.tab-content-in-left img {width: 80px; border-radius: 50%; border: 1px solid var(--color-blue);}
	.tab-content-in-right h5 {font-size: 16px;}
	.tab-content-in-right p {font-size: 14.5px;}

	.custom-button.go-back {display: none;}
	.bt-back-mobile {position: relative !important; display: block !important; float: unset; margin-left: auto; margin-right: auto; margin-top: 15px; left: 0 !important; width: 225px !important;}
	
	/* .claim-process-separtor{ display: none;} */
	.claim-process-separtor{ display: none;}
	.What-documents-do-main .tab-content{ padding-left: 10px;}
	.tab-content-in-right{padding-left: 10px;}
	.footer-top{flex-direction: column;}
	.footer-top .text-footer { align-items: baseline; margin-top: 10px; margin-bottom: 5px;}
	.add-new-claim-wrapper { justify-content: center; padding-top: 20px; width: 100%; max-width: unset; flex: 1; border: none;}
}

@media only screen and (max-width: 834px) {
	.nav-list li a {padding: 15px 22.1px; font-size: 12px;}
	.footer-gird-outer ul {font-size: 10px;}
	.footer-copyright-text p {font-size: 12px;}

	.emergency-assistance-outer h2 {font-size: 14px;}
	.emergency-assistance-outer span {font-size: 14px;}
	.phone-call {font-size: 14px;}

	.simple-claims-grid img {width: 50px;}
	.simple-claims-grid p {font-size: 10.5px;}

	.What-documents-do-inn h4 {margin-bottom: 20px;}
	.tab-click .accordion-tabs {min-height: 60px;}
	.What-documents-do-main .accordion-tabs img {width: 20px; margin-right: 15px;}
	.What-documents-do-main .accordion-tabs label {font-size: 8px; line-height: 12px;}
	.tab-content-in-left img {width: 60px; border-radius: 50%; border: 1px solid var(--color-blue);}
	.tab-content-in-right h5 {font-size: 14px; line-height: 18px;}
	.tab-content-in-right p {font-size: 12.5px; line-height: 14px;}

	.custom-button {width: 165px !important;}

	.switch-policyholder-step-1 {margin-top: 45px; margin-bottom: 0px;}

	.claim-process-separtor{ display: none;}
	.What-documents-do-main .tab-content{ padding-left: 10px;}
	.tab-content-in-right{padding-left: 10px;}
	.footer-top{flex-direction: column;}
	.footer-top .text-footer { align-items: baseline; margin-top: 10px; margin-bottom: 5px;}
	.add-new-claim-wrapper { justify-content: center; padding-top: 20px; width: 100%; max-width: unset; flex: 1;}
}

@media only screen and (max-width: 736px) {
	#page-nav {padding: 10px;}
	#page-nav label {display: inline-block; color: #15226B; font-style: normal; font-size: 2em; padding: 0px; margin: 10px 0px 15px 0px;}
	#page-nav ul {display: none; background: #0f2353; text-align: left;}
	#page-nav ul li {display: block; padding: 10px;}
	#page-nav ul li a {color: #fff;}
	#page-nav ul li:hover {background: #102556;}
	#page-nav input:checked ~ ul {display: block;}
	#hamburger{display: none;}
	.footer-gird-outer {display: none;}
	.contact-info-outer {margin-top: 0px;}
	.contact-info-inn {text-align: center;}
	.footer-copyright-text p {display: none;}
	.footer-logo {padding-bottom: 0px; text-align: center;}
	.footer-copyright-text .copyright {display: block; text-align: center; font-size: 13px;}

	.lp-banner-part {height: 250px; padding-bottom: 10px;}
	.lp-banner-inn h1 {font-size: 32px;}
	.lp-banner-inn span {font-size: 14px;}

	.logo {padding: 7.5px 0 15px;}
	.logo img { width: 150px;height: auto;}
	.footer-top .brand-footer img{width: 150px; height: auto;}
	.simple-claims-grid span{ margin-bottom: 0px; height: 75px; min-height: unset;}
	.footer-top .text-footer p, .footer-top .text-footer a { font-size: 12px; line-height: 12px; }
	.footer-top .text-footer p:nth-child(2){ margin-top: 10px;}
	
	.emergency-assistance-outer {display: block; text-align: center;}
	.emergency-assistance-outer h2 {margin-top: 10px; margin-bottom: 15px;}
	.emergency-assistance-outer h2:before {content: '24/7 ';}
	.emergency-assistance-outer span {display: none;}

	.submit-claim-content {padding-top: 30px;}
	.submit-claim-part {padding-bottom: 45px;}

	.submit-claim-content h3 {font-size: 23px; line-height: 30px; margin-bottom: 20px;}
	form.submit-claim-form {width: 100%;}

	.simple-claims-outer h3 {font-size: 18px; margin-bottom: 50px;}
	.simple-claims-grid {width: 185px; text-align: center; }
	.simple-claims-grid img.two {width: 43px;}
	.simple-claims-grid p {font-size: 11.5px; line-height: 15px;}

    .card-desktop {display: none;}
	.card-mobile {display: block;}
	.What-documents-do-main .head-body-detail {background-color: #fff;}
	.What-documents-do-main .body-detail {background-color: #eeeeee; padding: 0px 10px 0px 10px;}
	.What-documents-do-main .card-header button.btn.btn-link.collapsed.details {background-color: white; color: #373636; padding: 10px; font-size: 16px;}
	/* .What-documents-do-main .card-header button.btn.btn-link.details {background-color: white; color: #373636; border: 2px solid #eeeeee; padding: 10px; font-size: 12px; display: flex; align-items: center;} */
	/* .What-documents-do-main button.btn.btn-link.details:after {-webkit-text-stroke: 2px #001548; right: 15px;} */

	.What-documents-do-main button.btn.btn-link.details::after{
		display: none;
	}
	.What-documents-do-main button.btn.btn-link.details:after{
		width: 32px;
		height: 32px;
		border: solid 1px #E7E7E7;
		display: inline-block;
		border-radius: 50%;
		position: absolute;
		content: "";
		right: 10px!important;
		top: 50%!important;
		transform: translate(0%, -50%);
	}

	.What-documents-do-main button.btn.btn-link.details.active:after{
		content: "\f00c";
		background: var(--color-blue);
		color: #fff;
		font: normal normal normal 14px/1 FontAwesome;
		text-align: center;
		line-height: 30px;
		font-size: 20px;
		-webkit-text-stroke: 3px var(--color-blue);
		border-color: var(--color-blue);
	}

	.What-documents-do-main .card-header button.btn.btn-link.details img {margin-right: 10px;}

	.head-text {font-size: 24px;}

	.want-talk-first-inn p{ font-size: 16px; line-height: 16px; margin-top: 10px;}

	.hl-middle-part {width: 100%;}

	.submit-btn-theme {position: sticky;}

	.verification-code {border: none;}

	.switch-policyholder-step-1 {margin-top: 25px; margin-bottom: 0px;}

	.form-steps-outer {width: 100%; border: none; padding: 0px;}
	.custom-button {width: 225px !important;}

	.custom-button.go-next {left: 0; right: 0; margin-left: auto; margin-right: auto; margin-top: 15px; padding: 15px;}

	/*form*/
	/*.policyholder {display: none;}*/

	.form-detail.active {border-bottom: 1px solid #f2f2f2; margin-bottom: 15px;}

	.nav-desktop {display: none;}
	.nav-mobile {display: block;}

	.progress-bar {width: 100%; background-color: #1c327f;}
	.progress-bar p.title{margin: 0px; padding: 5px; color: white; font-size: 12px; font-weight: 700;}
	.bar {width: 16%; height: 5px; background-color: var(--color-red); text-align: right;}
	p.percent{width: 16%; color: var(--color-red); font-size: 11px; font-weight: 700; text-align: right; margin-bottom: 0px;}
	
	
	.claim-process-separtor{ display: none;}
	.footer-top{flex-direction: column;}
	.footer-top .text-footer { align-items: baseline; margin-top: 10px; margin-bottom: 5px;}

	.What-documents-do-main { padding: 25px 0px; }
	.simple-claims-part { padding: 25px 0px; }
	.want-talk-first { padding: 40px 0px; }
	.What-documents-do-main .card-header button.details.active.btn.btn-link { background-color: transparent; padding: 10px; color:#373636; font-size: 16px;}

	#GetHelpClaimModal .modal-title {font-size: 16px;}
	#GetHelpClaimModal .modal-attachments-body .claim-email-wrapper input[type=text]{font-size: 16px; width: 250px;}
	#GetHelpClaimModal .modal-attachments-body .claim-email-wrapper .btn-copy{ width: 60px!important;}
	.warning-msg{ padding: 15px 20px 17px 0px; }
	.warning-msg::before{ margin-left: 20px; margin-right: 20px; }

	.hl-middle-part.wide {width: 100%;}
	.my-claim-status-wapper {display: flex; flex-direction: column; align-items: start; padding: 20px 32px 0px 32px;}
	.my-claim-status-wapper hr { background: #ECECEC; }
	.my-claim-status-wapper .status-item { display: flex;  align-items: center; margin: 8px 0px; width: 100%;}
	.my-claim-status-wapper .status-item.active .outcome, .my-claim-status-wapper .status-item .outcome{ position: relative; flex: 1; top: unset; left: unset; display: flex; justify-content: end; align-items: center;}
	.my-claim-status-wapper .status-item.active .label, .my-claim-status-wapper .status-item .label{ position: relative;  width: auto; height: auto; top: unset; left: unset;}
	.my-claim-status-wapper .status-item .icon{ margin-right: 8px;}
	.my-claim-status-wapper .status-item.active .icon{  width: 24px; height: 24px; }
	.my-claim-status-wapper .status-item.active .icon::before{  width: 11px; height: 9px; }
	.my-claim-status-wapper .status-item.active.in-progress .icon::before{  width: 12px; height: 12px; }
	.my-claim-status-wapper .status-item.active.error .icon::before{  width: 9.6px; height: 9.6px;}
	.my-claims-item-body-section { padding-left: 32px; } 
	.my-claims-item-body-section.info { padding-left: 57px; } 
	.my-claims-item-body-section.info::before { left: 32px }
	
	/* .my-claims-list .claim-icon-base { width: 60px; } */
	/* .my-claims-list .submissionDate { display: none;} */
	.verification-code{ margin-top: 0px!important; padding: 0px 10px!important; }
	.submissionDate-mobile{ display: flex; font-size: 13px;	color: #333333; font-weight: 600; margin-bottom: 2px; font-weight: 100; opacity: 0.8;	}
}

@media only screen and (max-width: 450px) {
	.lp-banner-inn span {font-size: 16px;}

	.tab-content-in-left img {width: 50px; border-radius: 50%; border: 1px solid var(--color-blue);}

	.simple-claims-outer h3 {font-size: 18px; padding-left: 25px; padding-right: 25px;}
	.simple-claims-grid {width: 200px;} 
	.simple-claims-grid p {font-size: 14px;}

	.form-header {display: none;}
	.form-header-mobile {display: block;}
	.form-footer-mobile {display: block;}
	.form-footer-mobile span{ color: #666666; font-size: var(--font-sz-5); line-height: 16px; font-weight: 400;}
	.form-footer-mobile a.call-me{ color: #333333; font-size: 16px; line-height: 16px; font-weight: 700; margin-left: 24px; display: flex; align-items: center;}
	.form-footer-mobile a.call-me::before{ content: ''; width: 16px; height: 15.5px; background-image: url("../images/talephone-icon.png"); background-repeat: no-repeat; background-size: contain; display: flex; margin-right: 8px;}
	.form-footer-mobile a.call-me:hover{text-decoration: none; color: #333333; } 

	.What-documents-do-main .card{ margin-left: 25px; margin-right: 25px;  padding-left: 0px; padding-right: 0px;}
	.main-footer .container{ padding-left: 25px; padding-right: 25px; }
	#accordion-faq .card-body p {font-size: 14px; line-height: 18px;}

	.want-talk-first-inn p{ font-size: 14px; line-height: 16px; margin-top: 10px; padding: 10px 25px 0px 25px;}

	
}



@media only screen and (max-width: 393px) {
	.lp-banner-inn h1 {font-size: 30px;}

	.submit-claim-content h3 {font-size: 23px; margin: 0px 20px 20px 20px;}

	.simple-claims-grid {width: 180px;}

	.What-documents-do-inn h4 {font-size: 18px;}
	.What-documents-do-main .card-header button.btn.btn-link.collapsed, .What-documents-do-main .card-header button.btn.btn-link {font-size: 14px; padding: 10px;}
	.What-documents-do-main button.btn.btn-link.collapsed:after, .What-documents-do-main button.btn.btn-link:after {font-size: 20px; top: 10px; right: 15px;}
	.What-documents-do-main .card-header button.btn.btn-link.collapsed.details {background-color: white; color: #373636; padding: 10px; font-size: 14px; margin-bottom: 0px; width: 100%;}
	.What-documents-do-main .card-header button.btn.btn-link.details {background-color: white; color: #373636; border: 2px solid #eeeeee; padding: 10px; font-size: 14px; position: relative;}
	.What-documents-do-main .card-header button.btn.btn-link.details label {margin-bottom: 0px !important; max-width: 70%; position: relative; line-height: 16px;}
	
	.tab-content-in-left img {width: 40px; width: 40px; border-radius: 50%; border: 1px solid var(--color-blue);}

	/* .my-claims-list {padding: 0px;}
	.my-claims-list figure {left: 15px;}
	.my-claims-list img {width: 25px;}
	.my-claims-list h4{font-size: 13px;} */
	
}
@media only screen and (max-width: 320px) {
	.simple-claims-grid {width: 160px;}
}