body{ font-family:'open sans'; margin:0 auto; padding:0;  color:#181617; background:   url('../images/christmas-2025/bg.png')#fff; background-size:cover; background-position:  top center}
body, p, span, div{font-family:'open sans'}
h1, h2, h3, h4, h5, h6{font-family:'Montserrat';font-display:swap;}
.ffopen{ font-family:'open sans';font-display:swap;}
.ffmont{ font-family:'Montserrat';font-display:swap;}
.f400{font-weight:400;} .f500{font-weight:500;} .f600{font-weight:600;} .f700{font-weight:700; } .f800{font-weight:800;}
.ms-madi-regular {font-family: "Ms Madi", cursive;font-weight: 400;font-style: normal;}

.glob_lr {padding-left:  4.3rem; padding-right:  4.3rem;}
.stellar_logo{ align-items: center; padding-bottom: 0; margin-bottom: 0}
.exp_text{ font-size: 12px; line-height: 1; color: #525151; margin-top: .4rem; padding-left: .938rem;}
.exp_text span{ display: block; background: linear-gradient(147deg,rgb(245,56,67) 10%,rgb(47,87,149) 68%);-webkit-background-clip: text;-webkit-text-fill-color: transparent;background-clip: text;text-fill-color: transparent; font-size: 16px; font-weight: 700; font-family:'Montserrat'; padding-bottom: .35rem}
.stellar_logo a{ padding-right: .938rem; position: relative}
.stellar_logo a:before{ width: 1px; height: 100%; background: linear-gradient(0deg,rgba(0,0,0,0) 0%,#d0d0d0 50%,rgba(0,0,0,0) 100%); position: absolute; right: 0;   top: .3rem; margin: auto; content: '';}
.offer_button a{ display: flex; align-items: center; border: dashed 1px #555;    border-radius:5px; margin-right: 1.2rem; margin-top: .3rem}  
.offer_button a figure{margin: 0; padding: 0}
.offer_button a figure{background: #fff; padding:.3rem; margin-top: -.6rem}
.offer_button a  span { font-size: 14px; text-transform: uppercase; background: linear-gradient(147deg,rgb(245,56,67) 10%,rgb(47,87,149) 68%);-webkit-background-clip: text;-webkit-text-fill-color: transparent;background-clip: text;    text-fill-color: transparent; font-weight: 700; padding-right: .4rem}
main{/*background: url('../images/bg2.png') no-repeat #F3E1C8; background-size: 100%; background-position: top center; */position: relative}
 
/*main:before{ width: 192px; height: 156px; background: url('../images/leafs-top.png') no-repeat; position: absolute; content: ''; left: 0; top: 0}
main:after{ width: 192px; height: 156px; background: url('../images/leafs-top.png') no-repeat; position: absolute; content: ''; right: 0; top: 0; transform: scaleX(-1)}*/
 
.header_sec{background: linear-gradient(179.94deg, #FFFFFF 3%, #F9BBB2 71%, #D5D7FF 116%); position: relative;}  
.hero_sec{padding-bottom: 25rem; margin-top: -3rem}
.heading_box{ display: flex; justify-content: center; align-items: center; column-gap: .5rem}
.heading_box .heading1_title{font-family:'Montserrat';font-size: 52px; font-weight: 800; font-style:italic; color: #40393C}
.heading_box .ms-madi-regular{ font-size: 82px; color: #40393C}
.heading_box .ms-madi-regular img{ bottom: -20px}
.main_heading h1{ font-size: 98px; font-weight: 900; line-height: 1; position: relative;background: linear-gradient(95.14deg, #FF3D3D 36.03%, #DB293D 100.54%);
-webkit-background-clip: text;-webkit-text-fill-color: transparent;background-clip: text;text-fill-color: transparent; margin-top: -1rem}
.snow_1{top: 8px; left: 10px;}
.snow_2{top: 8px; left: 5rem;}
.snow_3{top: 8px; right: 5rem;}
.top_sub_heading{ font-size: 44px; font-weight: 800; text-align: center; font-style: italic; color: #40393C; }


.hero_sec:before{ width: 100%; height: 470px; position: absolute; left: 0; bottom: -8rem; content: ''; background: url('../images/christmas-2025/mounten.png'); background-size: 100%; background-repeat: repeat-x; background-position: bottom}
.shanta_graphic{position: relative; top: 9px}
.header_sec:before{ width: 100%; height: 100%; position:absolute; top: 0; left: 0; margin: auto; content: ''; background: url('../images/christmas-2025/bg.png')}
 









.products_container{ background: #fff; padding: 1.5rem; margin: 2rem auto;box-shadow: 2px 20px 30.7px rgb(255 28 28 / 25%);border-radius: 15px; position: relative; z-index: 2; padding-bottom: 3.5rem; margin-bottom: 1rem}
.container_bg{background: linear-gradient(165deg, #f32e34  0%, #c7c7c7 30%); padding: 1px;  width: 100%; border-radius: 17px; max-height: 350px; position: relative; transition: max-height 0.5s ease;}

.column_container{padding: 1rem 1.5rem; background: #fff; width: 100%; border-radius: 16px; height: 100%; position: relative; overflow: hidden}

.top_wrapper{ width: 98%; background: url('../images/christmas-2025/ice-mounten.png') repeat-x bottom;   position: relative; margin: auto}

.body_sec{ margin-top: -37rem}
.products_container{margin-top: -1rem; }
.top_wrapper{ display: flex; justify-content: space-between;align-items: flex-end;  max-width:100%; margin: auto; padding: 0 8rem; z-index: 3}

.shanta_graphic{margin-left: 3rem}



.hero_header{position: relative}
.loop_stamp{position: absolute; right: -20%; top: -0%; z-index: 5}
.column_container .card_headder_heading{ font-size: 15px; color: #686868}
.column_container .card_headder_heading h3{ font-size: 18px; font-weight: 700; color: #181617; line-height: 1}
.column_container .card_body .media{background: #ffffff;border: 1px solid #FFDDD9;box-shadow: -1px 2px 5.8px rgba(0, 0, 0, 0.09);border-radius: 10px; padding: 1rem; font-size: 14px;}
.column_container .card_body .media h5{ font-size: 15px; font-weight: 700; }
.column_container .card_body .media  p{margin-bottom: 0; line-height: 1.4}
.column_container .card_body .media  s{color: #e11f26}

.products_container .col-lg-9{flex: 0 0 78%; max-width: 78%;  }
.products_container .col-lg-3{flex: 0 0 22%; max-width: 22%;  }

.expanded{ transition: max-height 0.5s ease;}


.products_container .card_body .col-md-4{padding-left: 10px; padding-right: 10px;}
.card_body .row{ row-gap:20px}
.card_body .col-md-6{ display: flex}

.column_container .blur_bg{ position: absolute; width: 100%; height: 100px; background:linear-gradient(0deg, #ffffff 0%, #ffffff00 100%); bottom: 0; z-index: 2}
.expend_btn{ position: absolute; left: 0; right: 0; bottom: -1rem; margin: auto; z-index: 3; width: max-content; background: #fff; border: solid 1px #676767; padding: 5px  35px 5px 20px; border-radius: 58px; color: #e11f26; font-weight: 500; cursor: pointer; font-size: 15px;}
.expend_btn:before{width: 8px;    height: 8px;    content: '';position: absolute;    background: #fff0;border-top: 2px solid #e11f26;
    border-left: 2px solid #e11f26;  right: 1rem; transform: rotate(223deg); top: -2px; bottom: 0; margin: auto}
.expend_btn.less:before{ transform: rotate(45deg); top: 4px}

.products_container .offer_box{  border-radius: 17px; position: sticky; top: 0;   padding-bottom: 1rem; box-shadow: 0px 1px 10.6px #F9BBB2; overflow: hidden}
.products_container .offer_box:before{ width: 65px; height: 17px; position: absolute;   right: 1rem; top: -5px;   background: url('../images/christmas-2025//cloud.png') no-repeat; content: '';   z-index: -1;  }

.save_text{ font-size: 24px; font-weight: 700; text-transform: uppercase; color: #525252}
.save_text font{ color: #f32e34 }
.offer_card{ padding: 1rem; padding-top: 0}
.offer_card .devider{ display: block; width: 100%; height: 1px; background: linear-gradient(90deg, #ffffff 0%, #EC551C 50%, #ffffff 100%); margin-top: .5rem}
.price{ display: flex; justify-content: center; align-items: center; margin-top: 1rem; column-gap: 1rem}
.price s{color: #f32e34 ; font-family:'Montserrat'; font-size: 18px; font-weight: 700}
.price .main_pric{ font-family:'Montserrat'; font-size: 32px; font-weight: 700}

.offer_card a{ background:  linear-gradient(95.14deg, #FF3D3D 36.03%, #DB293D 100.54%);; width: 100%; display: flex; align-items: center; justify-content: center; padding:.8rem 1rem; border-radius: 5px;font-family:'Montserrat'; color: #fff; font-size: 18px; font-weight: 600; margin-top: 1rem; text-decoration: none; transition: ease-in-out .3s; position: relative; overflow: hidden}
.offer_card a:hover{box-shadow:0 0 20px #ff000ac4}
.offer_box{position: relative}
.pimpkin{position: absolute; bottom: -1rem; max-width: 80px; left: 0; right: 0; margin: auto}
.card_header{ display: flex; align-items: center; justify-content: space-between}
.toggle-wrapper {display: flex;align-items: center;gap: 12px;margin-bottom: 30px;  }
.toggle {position: relative;width: 38px;height: 21px;background: linear-gradient(95.14deg, #FF3D3D 36.03%, #DB293D 100.54%);;border-radius: 50px;cursor: pointer;transition: background 0.3s ease;}
.toggle:after{content: ''; width: 42px; height: 23px; position: absolute; left: -2px; right: 0; top: 0; bottom: 0; margin: auto; background: linear-gradient(95.14deg, #FF3D3D 36.03%, #DB293D 100.54%); border-radius: 50px; opacity: .5; z-index: 0}
.toggle::before { content: ""; position: absolute; top: 2px; left: 3px; width: 17px; height: 17px; background: white; border-radius: 50%; transition: all 0.3s ease;; z-index: 1}
.toggle.active::before {transform: translateX(16px);}
.label {font-weight: bold;color: #333;user-select: none; font-size: 14px}
 
.globle_h {font-size: 32px;font-weight: 700; color:#1B1B1B}
 .counter_text li{ width:16.5%}
 .counter_text{padding-left:0}
 .price_container .cross_p:before {width: 100%;height: 1px;background: #e11f26;position: absolute;left: 0;bottom: 5px;content: '';transform-origin: bottom left;transform: rotate(345deg);} 
.counter_text{list-style:none;display:flex;justify-content:space-around;margin-bottom:0;width:100%}.counter_text li{text-align:center;margin:1rem auto}
.counter_text li .gtext{ color: #1B1B1B}
.counter_text .counter_h span{font-size:42px;font-weight:800;font-family:'Montserrat'}
.counter_text .counter_h span sup{font-size:60%;font-weight:600;position:static;vertical-align:revert}.counter_sh{font-size:14px;font-weight:700;text-transform:uppercase}.counter_text p{margin-bottom:0; color:#1B1B1B}
.counter span sup{ font-size:60%}
.counter{ text-align:center; }
.counter span {font-size: 52px;color: #e11f26;line-height: 0; font-family:'Montserrat'; font-weight: 700}
.counter p{font-weight: 600; font-family:'Montserrat'; color:#1B1B1B}

sup{font-size: 50%; font-weight: 400}

@media screen and (min-width: 1500px) {
	.container-fluid {width: 1400px !important;padding: 0;margin: auto; }
}

@media screen and (max-width:1440px){
	.top_wrapper{padding: 0 5rem}
}

@media screen and (max-width:1400px){
	.top_wrapper{padding: 0 3rem}
}

@media screen and (max-width:1280px){
	.loop_stamp{right: -10%}
		.top_wrapper{padding: 0 0rem}
}
@media screen and (max-width:1200px){
	.column_container .card_body .media h5{font-size: 14px}
	.products_container .col-lg-9 {flex: 0 0 75%;max-width: 75%;}
	.products_container .col-lg-3 {flex: 0 0 25%;max-width: 25%;}
	.hero_header{  margin-top: 3rem}
	.loop_stamp { right: 0%}
	.hero_header{text-align: left}
	
	.main_heading h1 { font-size: 80px}
	.heading_box .heading1_title{font-size: 42px}
	.heading_box .ms-madi-regular{font-size: 72px}
	.top_sub_heading{font-size: 32px}
}


@media screen and (max-width:1100px){
	.price .main_pric{font-size: 30px}
	.save_text{font-size: 20px}
	.hero_header h2{font-size: 80px}
	.hero_header .discount_text, .counter_text .counter_h span{font-size: 32px}
}

@media screen and (max-width:1024px){
	.hero_header h1.ms-madi-regular{font-size: 52px}	
	.glob_lr{padding-left: 1rem; padding-right: 1rem}
	main:before{left: -5rem}
	.hero_header{ justify-content: space-between}
	 
	
}

@media screen and (max-width:991px){
	.counter_text{flex-wrap: wrap}
	.counter_text li{width: 33%}
	.products_container .col-lg-9 {flex: 0 0 70%;max-width: 70%;}
	.products_container .col-lg-3 {flex: 0 0 30%;max-width: 30%;}
	.column_container .card_body .media{flex-direction: column; row-gap:1rem}
	.hero_header h1.ms-madi-regular{font-size: 32px}
	.hero_header h2{font-size: 50px}
	.hero_header .discount_text{font-size: 24px}
	.container_bg.expanded{max-height: 100%!important}
	.hero_header .heading_title span{font-size: 60px}
	.hero_header .heading_title { font-size: 70px}
	.hero_header .big_off{font-size: 80px}
	.hero_header .big_dis{font-size: 32px}
	.tree_christmas{max-width: 200px}
	.body_sec {margin-top: -34rem}
	.heading_box .heading1_title{font-size: 32px}
	.heading_box .ms-madi-regular{font-size: 60px}
	.main_heading h1{font-size: 62px}
	.top_sub_heading{font-size: 24px}
	.shanta_graphic{width: 150px}
}

@media screen and (max-width:767px){
	.products_container .col-lg-9 {flex: 0 0 100%;max-width: 100%;}
	.products_container .col-lg-3 {flex: 0 0 100%;max-width: 100%;}
	.card_header{align-items: flex-start}
	.column_container .card_headder_heading h3{font-size: 14px; line-height: 1.4}
	 .column_container .card_headder_heading{font-size: 13px}
	.label{font-size: 12px}
	.toggle-wrapper { column-gap: 5px}
	.card_body .col-md-6{max-width: 50%}
	.products_container .row{ row-gap:1rem}
	.products_container .offer_box{max-width: 275px; margin: 1rem auto}
	.hero_header h2{font-size: 40px}
	.hero_header .discount_text{white-space: nowrap}
	main:after{right: -5rem;top: -3rem}
	.loop_stamp {  flex: 1; width: 200px; top: -100%}
	.loop_stamp video{max-width: 100%}
	.hero_header > img{max-width: 300px}
	.loop_stamp video{max-width: max-content}
	.hero_header{text-align: center}
	.loop_stamp {        width: 120px;top: -100px;}
	.tree_christmas{ width: 150px}
	.body_sec {margin-top: -30rem}
	.shanta_graphic{margin-left: 0}
	.hero_sec {margin-top: 0}
}

@media screen and (max-width:572px){
	main:before{ display: none}
	.glob_lr{padding-left: .5rem; padding-right: .5rem}
	.stellar_logo a img{ width: 100px}
	.stellar_logo a , .exp_text{    padding-right: 10px;}
	.body_sec{margin-top: -27rem}
	.hero_header .hero_graphic1 video { bottom: -3.3rem}
	.card_body .col-md-6{ max-width: 100%}
	.container_bg {    max-height: 496px;}
	 .products_container .offer_box{max-width: 100%}
	.offer_box >img{width: 100%}
	.hero_header .hero_graphic1 video { max-width: 100px; width: 100px}
	.hero_header .discount_text{font-size: 18px;}
	.hero_header .hero_graphic2 { top: 44px}
	.hero_header h1.ms-madi-regular { font-size: 22px}
	.column_container .card_body .media{flex-direction: row}
	main{overflow: hidden}
	footer br{ display: none}
	.counter_text p{font-size: 12px}
	.globle_h{font-size: 22px}
	.card_header{flex-direction: column}
	.hero_header .hero_graphic2,.hero_header .hero_graphic1{ position: absolute; bottom: 0}
	.hero_header .hero_graphic2{ top: auto; bottom: -3rem ; right: 3rem}
	.hero_header .hero_graphic2 img{ width: 72px}
	.hero_header{position: relative}
	.hero_header .discount_text{padding-bottom: 2rem}
	.loop_stamp{ display: none}
	.hero_header > img{max-width: 100%}
	.hero_header .heading_title span{font-size: 40px}
	.hero_header .heading_title{font-size: 50px}
	.hero_header .heading_title .tag{ width: 40px;position: absolute;right: -42px;bottom: -20px;}
	.hero_header .big_off{font-size: 55px}
	.hero_header .big_dis{font-size: 24px; padding-top: 10px}
	.hero_header{margin-top: 0}
	 .heading_box .ms-madi-regular img{ display: none}
	.heading_box .ms-madi-regular{ font-size: 50px}
	.heading_box .heading1_title{font-size: 28px}
	.main_heading h1{font-size: 52px}
	.tree_christmas, .shanta_graphic { width: 110px}
	.body_sec{margin-top: -24rem}
 	.snow_1 { top:-5px; left: 0px; }
	.snow_2 { top:-2px; left: 2.5rem; }
	.snow_3 { top:-5px; right: 2rem; }
}


.snowflake {
    position: absolute;
    display: block;
    position: absolute;
	z-index: 900;
    -webkit-border-radius: 50%;
    -moz-border-radius: 50%;
    border-radius: 50%;
    -webkit-transform: translateZ(0);
    -moz-transform: translateZ(0);
    -ms-transform: translateZ(0);
    -o-transform: translateZ(0);
    transform: translateZ(0);
    -webkit-user-select: none;
    -moz-user-select: none;
    user-select: none;
    background-image: -webkit-radial-gradient(
        center,
        circle farthest-corner,
        rgba(255, 255, 255, 1) 20%,
        rgba(255, 255, 255, 0) 100%
    );
    background-image: -moz-radial-gradient(
        center,
        circle farthest-corner,
        rgba(255, 255, 255, 1) 40%,
        rgba(255, 255, 255, 0) 100%
    );
    background-image: -ms-radial-gradient(
        center,
        circle farthest-corner,
        rgba(255, 255, 255, 1) 40%,
        rgba(255, 255, 255, 0) 100%
    );
    background-image: radial-gradient(
        center,
        circle farthest-corner,
        rgba(255, 255, 255, 1) 40%,
        rgba(255, 255, 255, 0) 100%
    );
opacity: 1
	
    
}


 