/* Start PopUp Style */
.popup-section { padding: 3em 2em; z-index: 999999; box-sizing: border-box; position: fixed; width: 100%; min-height: 100vh; display: flex; flex-flow: row wrap; align-items: center; justify-content: center; top: 0; left: 0; font-family: "Lato", sans-serif; font-size: 1em; opacity: 0; visibility: hidden; transition: .35s ease-in-out;}

@media only screen and (min-width: 1457px) {
	.popup-section {
		font-size: 16px;
	}
}

.popup-bgcover {display:none; z-index: 99999;min-height: 100vh;position: fixed;top: 0;left: 0;width: 100%; background-color: rgba(255, 255, 255, .85);}
.popup-section::-webkit-scrollbar{display: none;}
.popup-section.popupOpen{opacity: 1; visibility: visible;}
.popup-wrap{width: 70%; background-color: #FFF; box-shadow: 9px 9px 18.9px 0 rgba(13, 65, 107, 0.21); position: relative;display: flex; flex-direction: column;}
.popup-closs {position: relative; display: flex; transition: .35s ease-in-out; width: 2.75em; height: 2.75em; cursor: pointer; top: 0; right: 0; z-index: 9;}
.popup-closs img{width: 1.5em;}
.popup-closs:after{position: absolute; content: ''; width: 1.5em; height: 1.5em; background-repeat: no-repeat; left: 50%; top: 25%; transform: translate(-50%, -50%); background-image: url(../../images/x.svg); transition: .35s ease-in-out; background-size: 100% 100%;}
.popup-content-wrap{width: 100%; padding: 1em 1em 0.5em; display: flex; gap: .94em; position: relative; z-index: 2; align-items: flex-start;}
.popup-product-main-thumb { width: 90%; display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; justify-content: center; align-items: center;}
.popup-product-main-thumb img { width: 100%; }
.popup-content-title{width: 100%;}
.popup-content-title h2{color: #003C70; font-family: "Lato", sans-serif; font-size: 2em; font-style: normal; font-weight: 700; line-height: 112.788%; letter-spacing: -0.04em; text-transform: unset; margin: 0;}
.popup-content-list{width: 41.25em; display: flex; flex-direction: column; gap: 1.5em; margin-left: auto;}
.popup-content-list h4{color: #000000; font-family: "Lato", sans-serif; font-size: 1.5em; font-style: normal; font-weight: 700; line-height: 112.788%; letter-spacing: -0.045rem; text-transform: unset; margin: 0;}
.popup-content-list ul{display: flex; flex-direction: column; gap: .8em; margin: 0;}
.popup-content-list ul li{padding-left: 2.13em; color: #4D4D4D; font-family: "Lato", sans-serif; font-size: 0.9em; font-style: normal; font-weight: 500; line-height: 112.788%; letter-spacing: 0.01em; position: relative;}

.popup-content-list ul { position: relative; list-style: none; padding: 0 0 0.5em 0; margin: 0; }
.popup-content-list ul li{width: 100%;}
.popup-content-list {
	overflow: hidden;
}

.popup-content-list li {
	transform: translateY(100%);
	opacity: 0;
	transition: transform 0.6s ease, opacity 0.6s ease;
	padding-left: 2.13em;
}

.popup-content-list li.visible {
	transform: translateY(0);
	opacity: 1;
}

/* Ensure first item is visible immediately on load */
.popup-content-list ul li:before{position: absolute; content: ''; top: 0; left: 0; width: 1.25em; height: 1.25em; background-repeat: no-repeat; background-size: 100% 100%; background-position: center center; background-image: url(../../images/checkmark.png);}
.popup-btn-wrap{display: flex; width: 40%; justify-content: right;    }
.popup-btn{color: #FFF; font-family: "Lato", sans-serif; font-size: 1em; font-style: normal; font-weight: 700; line-height: 112.788%; letter-spacing: 0.01em; background-color: #003C70; padding: 1em 1.9em; position: relative; transition: .35s ease-in-out; text-align: center; border: none;} 
.popup-thumb{width: 100%; display: flex; margin-top: -12.5em; overflow: hidden;}
.popup-thumb img{width: 100%;}
.popup-thumb img.mobi{display: none;}
.popup-thumb img.desk{display: block;}

.popup-thumb-slider {position: relative; padding-block: 0.5em 1em; flex: none; justify-content: flex-start; align-items: center; width: 100%; display: flex; position: relative; inset: 0% 0 0% 0%; overflow: hidden; }
.thumb-ticker { flex-direction: row; flex: none; align-items: center; display: flex; white-space: nowrap; will-change: transform;}
.popupOpen .thumb-ticker {animation: logo-slider 20s linear infinite; animation-delay: 2s;}
.popup-slider-thumb { width: 100%; display: flex; width: 12em; padding: 0 0.25em; padding-top: 2em;}
.popup-slider-thumb img{width: 100%;}

@keyframes logo-slider {
	from {
		transform: translateX(0%);
	}

	to {
		transform: translateX(-100%);
	}
}

.popup-thumb-slider .swiper-pagination{width: 100%; display: flex; align-items: center; justify-content: center; align-items: center; gap: .31em; position: absolute; bottom: 2em; left: 0;}
.popup-thumb-slider .swiper-pagination-bullet{width: 0.375em; height: 0.375em; border-radius: 1em; background-color: #FFFFFF; transition: .35s ease-in-out; opacity: 1; margin: 0 !important;}
.popup-thumb-slider span.swiper-pagination-bullet.swiper-pagination-bullet-active{width: 0.75em;}


/* End PopUp Style */
.popup-content-title h2{opacity:0;transform:translateY(2em);transition:opacity 0.8s ease 0s,transform 0.8s ease 0s;}
.popupOpen .popup-content-title h2{opacity:1;transform:translateY(0);}
.popup-content-list h4{opacity:0;transform:translateY(2em);transition:opacity 0.8s ease 0.2s,transform 0.8s ease 0.2s;}
.popupOpen .popup-content-list h4{opacity:1;transform:translateY(0);}
.popup-content-list ul{opacity:0;transform:translateY(2em);transition:opacity 0.8s ease,transform 0.8s ease; transition-delay:0.5s;}
.popupOpen .popup-content-list ul{opacity:1;transform:translateY(0);}
.popup-btn-wrap{opacity:0;transform:translateY(2em);transition:opacity 0.8s ease 1s,transform 0.8s ease 1s;}
.popupOpen .popup-btn-wrap{opacity:1;transform:translateY(0);}
.popup-thumb img, .popup-slider-thumb img{opacity:0;transform:translateY(3em);transition:opacity 1s ease 0.4s,transform 1s ease 0.4s; transition-delay: 1.25s;} 
.popupOpen .popup-thumb img, .popupOpen .popup-slider-thumb img{opacity:1;transform:translateY(0);}


@media only screen and (max-width: 1280px) { 
	.popup-slider-thumb{width: 10em;}	
	.popup-wrap{width: 75%;}
	.popup-btn {font-size: 0.8em}
}

/* Responsive Style  */
@media only screen and (max-width: 768px) {    
	/* Start PopUp Style */
	.popup-section{padding-inline: 1em; font-size: 2.083vw; padding-bottom: 14em;}
	.popup-closs{position: absolute; border-radius: 0; background: #003C70; border-color: #003C70;}
	.popup-closs:after{background-image: url(../../images/x-white.svg);} 
	.popup-product-main-thumb {width: 100%; max-height: 24em; overflow: hidden;}
	.popup-content-wrap{flex-direction: column; align-items: flex-start; padding: 1.5em 1.5em 1em; gap: 2em;}
	.popup-content-list{margin: 0; width: 100%}
	.popup-btn-wrap{width: 100%; margin-top: -.5em; padding: 0;}
	.popup-content-list ul { gap: .75em; }
	.popup-content-list ul li { font-size: 1.25em;}
	.popup-btn{width: 100%; font-size: 1.25em}
	.popup-thumb{margin-top: -10%;}
	.popup-thumb img.mobi{display: block;}
	.popup-thumb img.desk{display: none;}
	.popup-thumb-slider{padding-block: 1em 1.5em}
	/* End PopUp Style */    
	.popup-slider-thumb{width: 14em;}
	.popup-closs::after {top:50%;}
	.popup-product-main-thumb { width: 100%;}
	.popup-wrap{width: 100%;}
	.popup-section {position: absolute}
}

@media only screen and (max-width: 480px) {    
	.popup-section{padding-inline: 1em; font-size: 2.4vw;}
	.popup-content-list ul li { font-size: 1.5em;}
	.popup-btn{width: 100%; font-size: 1.5em}
	/* End PopUp Style */
}

@media only screen and (min-width: 769px) and (max-width: 1024px) {
	/* Start PopUp Style */
	.popup-btn-wrap { padding-left: 0; width: 40%; justify-content: center;}
	/* End PopUp Style */  
	.popup-slider-thumb{width: 8em;}
	.popup-content-title h2 {font-size:1.5em;}
	.popup-content-list ul li {font-size: 0.8em}
	.popup-btn {font-size: 0.7em}
	.popup-product-main-thumb { width: 100%; }
	.popup-wrap{width: 90%;}

}

@media only screen and (min-width: 992px) and (max-width: 1260px) {
	/* Start PopUp Style */
	.popup-slider-thumb{width: 12em}
	.popup-wrap{width: 90%;}
	/* End PopUp Style */
}

/*	Retina media query.
Overrides styles for devices with a
device-pixel-ratio of 2+, such as iPhone 4.
-----------------------------------------------    */
@media
only screen and (-webkit-min-device-pixel-ratio: 2),
only screen and (min-device-pixel-ratio: 2) {
}