@import url('https://pro.fontawesome.com/releases/v6.0.0-beta3/css/all.css');
html{font-size: 62.5%;}
body{ padding: 0px; margin: 0px; list-style: none; font: normal 1.6rem/2.4rem 'Roboto', sans-serif; color: var(--black); }
p{padding: 0px; margin: 0px;}
a{padding: 0px; margin: 0px; outline: none;}
ul{ list-style: none; padding: 0px; margin: 0px;}
label{ list-style: none; padding: 0px; margin: 0px;}
ul li{ padding: 0px; margin: 0px;}
h1,.h1, h2,.h2, h3,.h3, h4,.h4, h5,.h5, h6,.h6{padding: 0px; margin: 0px; font-family: "Playfair Display", serif;}
input[type="text"]::-webkit-placeholder { opacity: 1;  }
input[type="text"]::-moz-placeholder { opacity: 1;}
input[type="password"]::-webkit-placeholder { opacity: 1;}
input[type="password"]::-moz-placeholder { opacity: 1;}
input[type="search"]::-webkit-placeholder { opacity: 1;}
input[type="search"]::-moz-placeholder { opacity: 1;}
input[type="email"]::-webkit-placeholder { opacity: 1; }
input[type="email"]::-moz-placeholder { opacity: 1;}
input[type="tel"]::-webkit-placeholder { opacity: 1;}
input[type="tel"]::-moz-placeholder { opacity: 1;}
textarea::-moz-placeholder { opacity: 1;  }
textarea::-webkit-placeholder { opacity: 1;}
a:hover{ outline: none !important; text-decoration: none;}
a:active{ outline: none !important; text-decoration: none;}
a{ text-decoration: none !important;}
a:hover, a:focus{ text-decoration: inherit !important;}
a{-webkit-transition: all 0.3s; -moz-transition: all 0.3s; -ms-transition: all 0.3s;-o-transition: all 0.3s;transition: all 0.3s; }

/* font-family: "Roboto", sans-serif; */
/* font-family: "Playfair Display", serif; */


:root{
    --black: #000;
    --yellow: #FF9420;
    --brand: #FF9420;
    --geadient: linear-gradient(148deg, #FFB14B 0%, #FF9420 100%);
    --dark_yellow: #906414;
    --white: #fff;
   }


@keyframes firework {
    from {
        transform: scale(0);
        opacity: 1;
   }
    to {
        transform: scale(1);
        opacity: 0;
   }
}
@keyframes dots {
    0% {
        opacity: 1;
   }
    50% {
        opacity: 0.2;
   }
}

@keyframes firework {
    from {
        transform: scale(0);
        opacity: 1;
   }
    to {
        transform: scale(1);
        opacity: 0;
   }
}
@keyframes dots {
    0% {
        opacity: 1;
   }
    50% {
        opacity: 0.2;
   }
}

@-moz-keyframes coccoc-alo-circle-anim {
    0% {
        transform: rotate(0) scale(.5) skew(1deg);
        opacity: .1
    }
    30% {
        transform: rotate(0) scale(.7) skew(1deg);
        opacity: .5
    }
    100% {
        transform: rotate(0) scale(1) skew(1deg);
        opacity: .1
    }
}

@-webkit-keyframes coccoc-alo-circle-anim {
    0% {
        transform: rotate(0) scale(.5) skew(1deg);
        opacity: .1
    }
    30% {
        transform: rotate(0) scale(.7) skew(1deg);
        opacity: .5
    }
    100% {
        transform: rotate(0) scale(1) skew(1deg);
        opacity: .1
    }
}

@-o-keyframes coccoc-alo-circle-anim {
    0% {
        transform: rotate(0) scale(.5) skew(1deg);
        opacity: .1
    }
    30% {
        transform: rotate(0) scale(.7) skew(1deg);
        opacity: .5
    }
    100% {
        transform: rotate(0) scale(1) skew(1deg);
        opacity: .1
    }
}

@keyframes coccoc-alo-circle-anim {
    0% {
        transform: rotate(0) scale(.5) skew(1deg);
        opacity: .1
    }
    30% {
        transform: rotate(0) scale(.7) skew(1deg);
        opacity: .5
    }
    100% {
        transform: rotate(0) scale(1) skew(1deg);
        opacity: .1
    }
}

@-moz-keyframes coccoc-alo-circle-fill-anim {
    0% {
        transform: rotate(0) scale(.7) skew(1deg);
        opacity: .2
    }
    50% {
        transform: rotate(0) scale(1) skew(1deg);
        opacity: .2
    }
    100% {
        transform: rotate(0) scale(.7) skew(1deg);
        opacity: .2
    }
}

@-webkit-keyframes coccoc-alo-circle-fill-anim {
    0% {
        transform: rotate(0) scale(.7) skew(1deg);
        opacity: .2
    }
    50% {
        transform: rotate(0) scale(1) skew(1deg);
        opacity: .2
    }
    100% {
        transform: rotate(0) scale(.7) skew(1deg);
        opacity: .2
    }
}

@-o-keyframes coccoc-alo-circle-fill-anim {
    0% {
        transform: rotate(0) scale(.7) skew(1deg);
        opacity: .2
    }
    50% {
        transform: rotate(0) scale(1) skew(1deg);
        opacity: .2
    }
    100% {
        transform: rotate(0) scale(.7) skew(1deg);
        opacity: .2
    }
}

@keyframes coccoc-alo-circle-fill-anim {
    0% {
        transform: rotate(0) scale(.7) skew(1deg);
        opacity: .2
    }
    50% {
        transform: rotate(0) scale(1) skew(1deg);
        opacity: .2
    }
    100% {
        transform: rotate(0) scale(.7) skew(1deg);
        opacity: .2
    }
}

@-moz-keyframes coccoc-alo-circle-img-anim {
    0% {
        transform: rotate(0) scale(1) skew(1deg)
    }
    10% {
        transform: rotate(-25deg) scale(1) skew(1deg)
    }
    20% {
        transform: rotate(25deg) scale(1) skew(1deg)
    }
    30% {
        transform: rotate(-25deg) scale(1) skew(1deg)
    }
    40% {
        transform: rotate(25deg) scale(1) skew(1deg)
    }
    50% {
        transform: rotate(0) scale(1) skew(1deg)
    }
    100% {
        transform: rotate(0) scale(1) skew(1deg)
    }
}

@-webkit-keyframes coccoc-alo-circle-img-anim {
    0% {
        transform: rotate(0) scale(1) skew(1deg)
    }
    10% {
        transform: rotate(-25deg) scale(1) skew(1deg)
    }
    20% {
        transform: rotate(25deg) scale(1) skew(1deg)
    }
    30% {
        transform: rotate(-25deg) scale(1) skew(1deg)
    }
    40% {
        transform: rotate(25deg) scale(1) skew(1deg)
    }
    50% {
        transform: rotate(0) scale(1) skew(1deg)
    }
    100% {
        transform: rotate(0) scale(1) skew(1deg)
    }
}

@-o-keyframes coccoc-alo-circle-img-anim {
    0% {
        transform: rotate(0) scale(1) skew(1deg)
    }
    10% {
        transform: rotate(-25deg) scale(1) skew(1deg)
    }
    20% {
        transform: rotate(25deg) scale(1) skew(1deg)
    }
    30% {
        transform: rotate(-25deg) scale(1) skew(1deg)
    }
    40% {
        transform: rotate(25deg) scale(1) skew(1deg)
    }
    50% {
        transform: rotate(0) scale(1) skew(1deg)
    }
    100% {
        transform: rotate(0) scale(1) skew(1deg)
    }
}

@keyframes coccoc-alo-circle-img-anim {
    0% {
        transform: rotate(0) scale(1) skew(1deg)
    }
    10% {
        transform: rotate(-25deg) scale(1) skew(1deg)
    }
    20% {
        transform: rotate(25deg) scale(1) skew(1deg)
    }
    30% {
        transform: rotate(-25deg) scale(1) skew(1deg)
    }
    40% {
        transform: rotate(25deg) scale(1) skew(1deg)
    }
    50% {
        transform: rotate(0) scale(1) skew(1deg)
    }
    100% {
        transform: rotate(0) scale(1) skew(1deg)
    }
}

@keyframes button-ripple{
    70% {
        -webkit-box-shadow: 0 0 0 var(--glow-size, 15px) currentColor;
        box-shadow: 0 0 0 var(--glow-size, 15px) currentColor;
        opacity: 0;
    }
    100% {
        -webkit-box-shadow: 0 0 0 0 currentColor;
        box-shadow: 0 0 0 0 currentColor;
        opacity: 0;
    }
}


/*top_button*/
.top_btn{background: var(--brand);  bottom: 1rem; color: var(--white); height: 4rem; opacity: 0; overflow: hidden; position: fixed; right: 1rem; width: 4rem; z-index: 9999;  text-align: center; display: inline-block; border-radius: .5rem; }
.top_btn i{font-size: 1.7rem; line-height: 4rem;}
.top_btn.show{opacity: 0.7;}
.top_btn:hover{bottom: .3rem; opacity: 1; color: var(--white);}



em{font-style: normal;}
.as_btn{display: inline-block; height: 5rem; line-height: 5rem; padding: 0 2rem; text-transform: uppercase; color: var(--white); background: var(--geadient); border-radius: .5rem; font-weight: 500; -webkit-transition-duration: 0.4s; transition-duration: 0.4s; -webkit-animation-duration: 0.4s; animation-duration: 0.4s; position: relative; overflow: hidden; z-index: 1; margin-top: 2.5rem; text-align: center;}
.as_btn::before{background-color: transparent; background-image: linear-gradient(180deg, #D49842 0%, #D49842 100%); -webkit-transition-duration: 0.4s; transition-duration: 0.4s; -webkit-animation-duration: 0.4s; animation-duration: 0.4s; content: ""; position: absolute; z-index: -1; top: 0; left: 0; width: 100%; height: 100%; opacity: 0;}
.as_btn:hover::before{opacity: 1;}
.as_btn:hover{color: var(--white);}
.ptb{padding: 6rem 0;}
.inner_ptb{padding: 3rem 0 6rem 0;}
.discount_hedaing{font-size: 5rem; line-height: 5.5rem; text-transform: capitalize; color: var(--black); font-weight: 600; text-align: center; border-top: .1rem dashed #ccc; border-bottom: .1rem dashed #ccc; padding: 1.5rem 0 2rem 0; position: relative;}
.btn_shape_img{position: absolute; bottom: -2.1rem; left: 50%; -ms-transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    transform: translateX(-50%);}
h1,h2{font-size: 3.5rem; line-height: 4rem; text-transform: capitalize; font-weight: 600; color: var(--black);}
h4{font-size: 2.5rem; line-height: 3rem; text-transform: capitalize; color: var(--black); font-weight: 600;}


.other_txt_list{display: inline-block; width: 100%;}
.other_txt_list li{width: 50%; float: left;}
.txt_list li{position: relative; color: var(--black);  margin-top: 1.5rem; padding-left: 2.2rem;}
.txt_list li::before{font-family: "Font Awesome 6 Pro"; content: "\f058"; color: var(--brand); position: absolute; left: 0; top: 0; font-size: 1.2rem;}


.shape_img{position: absolute;}
.shape_img img{max-width: 100%;}
.shape_img_1 img{max-width: 72%;}
.shape_img_1{left: 50%; bottom: 3rem; -ms-transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    transform: translateX(-50%);}
/* .shape_img_2{bottom: 0; right: 0;} */
.shape_img_3{right: 3rem; top: 3rem;}
.shape_img_2{bottom: -4.5rem; left: 26%; -ms-transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    transform: translateX(-50%);}
.shape_img_2 img{max-width: 55%;}


/*header*/
.header_sec{ width: 100%;}
.nav_top{border: none; min-height: auto; box-shadow: none; border-radius: 0px;}
.drop-nav{ position: absolute; top: 10px; right: 0px;}
.nav_top .dropdown-menu li{margin-right: 0;}
.nav_top .dropdown-menu li a{ font-size: 1.5rem; color: var(--black); font-weight: 400; padding: 1.3rem 1.5rem; display: block;}
.nav_top .dropdown-menu li a:hover{background: #1085FA; color: var(--white);}
.menu_sec li{ position: relative; text-transform: capitalize; margin-right: 2.4rem; font-weight: 500;}
.menu_sec li a{display: inline-block; color: var(--yellow); padding: 1rem .5rem; position: relative;}
.menu_sec li a::before{position: absolute; left: 0; bottom: 1.4rem; width: 100%; height: .2rem; background: var(--yellow); content: ""; transform: translateY(13px); opacity: 0;}
.nav_top img{width: 16rem;} 
.heder_top{background: #E6E6E6;} 
.heder_top .top_rt_txt{display: block; text-align: right;}
.heder_top .top_rt_txt a{color: var(--dark_yellow); display: inline-block; padding: .5rem; font-weight: 600;}
.header_menu{padding: 1rem 0;}
.drop-arw{position: absolute; right: -.8rem; top: .9rem;}   
.drop-arw::after{border: none; font-family: "Font Awesome 6 Pro"; content: "\f0d7"; color: var(--yellow); font-weight: 600;}
.heder_rt_btn{position: absolute; right: 0; top: 1.3rem;}   
.menu_sec li.active a, .menu_sec li a:hover{color: var(--brand);} 
.menu_sec li.active a::before, .menu_sec li a:hover::before{opacity: 1;}


 /*banner*/  
.bannersec{ width: 100%;}
.banner_box{padding: 25rem 0 0 0; position: relative;}
.banner_box strong{font-family: "Playfair Display", serif; font-size: 6rem; line-height: 6.5rem; text-transform: capitalize; color: var(--white); display: block;}
/* .banner_txt{border: .1rem solid #fcc960; padding: 1.55rem 2rem; position: relative;} */

.greeting_card { width: 100%; color: var(--white); position: relative;}
.greeting_card::before{position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: url(../images/txt_bg_img.jpg)no-repeat center center/cover; content: ""; opacity: .8;}
.greeting_card .front { height: 100%; width: 100%; background-color: rgba(17, 20, 38, 0.5); transition: all 1s ease-in-out;  transform-origin: center left;  transform: perspective(700) rotateY(0);  border: .2rem solid var(--yellow); display: flex; align-items: center; justify-content: center;  text-align: center; transform-style: preserve-3d;  padding: 5rem 2rem 3rem 2rem;}
.greeting_card .front .textWrapper { width: 100%; z-index: 1; position: relative; top: -20px; opacity: 1; overflow: hidden;  transition: all 0.5s; transition-timing-function: cubic-bezier(0, 0.15, 1, -2.7);}
.greeting_card .front .textWrapper h1 { font-size: 80px; margin: 0;}
.greeting_card .front .textWrapper h2 { font-size: 20px; margin: 0;}
.greeting_card .front .firework {  width: 15rem;  height: 10rem; position: absolute; border: .5rem dotted #f00;border-radius: 100%;top: 40px; left: 0; display: flex; align-items: center; justify-content: center; animation: firework 1.5s ease-in-out infinite; transition-timing-function: cubic-bezier(0, 0.15, 1, -2.7);}
.greeting_card .front .firework .circle {width: 90%; height: 90%; border-radius: 100%; border: .5rem dotted #0dc200; position: absolute;}
.greeting_card .front .firework .circle2 { width: 70%; height: 70%; border-radius: 100%; border-color: #fff719;}
.greeting_card .front .firework .circle3 { width: 50%; height: 50%; border-radius: 100%; border-color: #f00;}
.greeting_card .front .firework .circle4 { width: 30%; height: 30%; border-radius: 100%; border-color: #0dc200;}

.greeting_card .front .firework .circle5 { width: 15%; height: 15%; border-radius: 100%; border-color: #f00;}
.greeting_card .front .firework2 {  width: 11rem;  height: 11rem;  left: inherit;  top: inherit; animation-delay: 1s; bottom: 0; right: 12.8rem;}
.greeting_card .front .firework3 { width: 8rem; height: 8rem; left: inherit; top: 0;  animation-delay: 0.2s; right: 0;}
.greeting_card .front .firework4 { width: 12rem; height: 12rem; left: 10rem; top: 0; animation-delay: 0.8s;}
.greeting_card .back {  width: 100%;   height: 100%;   position: absolute;   transition: all 1s ease-in-out; transform: perspective(700) rotateY(0);  transform-origin: center left;}

.greeting_card .content .dot4 { top: 30rem; left: 10rem;}
.greeting_card .content .dot8 {left: 24rem;}
.greeting_card .content .dot9 {  top: 10rem;  left: 9rem; background-color: white;}
.greeting_card .content .dot10 {  top: 40rem; left: 23rem; background-color: white;}



/* about_sec */
/* .about_sec p{padding-top: 3rem; text-align: center;} */
.about_sec{position: relative;}
.txt_list li{position: relative; margin-top: 1.5rem;}
.txt_list b{display: block; margin-bottom: .2rem; text-transform: capitalize; color: var(--brand); font-size: 2rem;}
.coupon_info{background: var(--white); box-shadow: 0 0 20px 0px rgba(0, 0, 0, 0.2); padding: 3rem; margin-top: 5rem; position: relative; border-radius: .5rem;}


/* .coup_list{border-bottom: 1px solid #C4C4C4; padding-bottom: 2rem;} */
.coupon_info .row{margin: 0;}
.coupon_info .cumll{padding: 2rem; border: .1rem solid #E3E6EE; margin: 0px -1px -1px 0px;}


/* offer_sec */
.offer_sec .container{max-width: 100%; padding: 0;}
.offer_sec .row{margin: 0;}
.offer_sec .cumll{padding: 0;}
.offer_lt, .offer_rt , .offer_rt img{height: 100%; object-fit: cover;}
.offer_lt{padding: 5rem 3rem;}

.offer_sec .txt_list li{color: var(--white); }


/* room_sec */
.room_box{border-radius: .5rem; overflow: hidden; margin-top: 3rem; position: relative; padding: 1.5rem; background-color: #f2f4f7; position: relative;}
.room_img, .room_txt, .room_img img{height: 100%; object-fit: cover;}
.room_txt{display: flex; align-items: start; justify-content: center; flex-direction: column;}
.room_sec .container{max-width: 100%; padding: 0 8rem;}
.room_info{background: var(--white); padding: 3rem; position: relative;}
.room_box::before{position: absolute; left: 0;  top: 0%;  height: 0;  width: 100%;  content: "";  background: rgb(241, 75, 89);  background: -moz-linear-gradient(left, rgba(241, 75, 89, 1) 0%, rgba(69, 74, 180, 1) 50%, rgba(255, 162, 0, 1) 100%);  background: -webkit-linear-gradient(left, rgba(241, 75, 89, 1) 0%, rgba(69, 74, 180, 1) 50%, rgba(255, 162, 0, 1) 100%); background: linear-gradient(to right, rgba(241, 75, 89, 1) 0%, rgba(69, 74, 180, 1) 50%, rgba(255, 162, 0, 1) 100%); filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f14b59', endColorstr='#ffa200',GradientType=1 );  -webkit-transition: all 500ms ease;  -moz-transition: all 500ms ease; -ms-transition: all 500ms ease; -o-transition: all 500ms ease;  transition: all 500ms ease;}
.room_box:hover::before{height: 100%; top: 0;} 
.room_img {border-radius: .5rem; overflow: hidden; margin-right: 1rem;}
.room_sec .room_box:nth-child(even) .room_info .row{flex-direction: row-reverse;}
.room_sec .room_box:nth-child(even) .room_info .row .room_img{margin: 0 0 0 1rem;}
.room_txt_top{display: flex; align-items: center; justify-content: space-between; width: 100%;}
.price{color: var(--brand); font-weight: 600;}
.room_tct_btm_btn_list li{display: inline-block; margin-right: 2rem;}
.room_tct_btm_btn_list li:last-child{margin-right: 0;}
.room_tct_btm_btn_list li:last-child .as_btn{background: transparent; color: var(--yellow); border: .1rem solid var(--brand);}
.room_tct_btm_btn_list li:last-child .as_btn:hover{color: var(--white); background: var(--brand);}
.room_tct_btm_btn_list li:last-child .as_btn::before{display: none;}



/* call_sec */
.call_sec{position: relative; background-attachment: fixed !important;}
.call_sec::before{background-image: -webkit-gradient(linear, left bottom, right bottom, from(#e6005d), color-stop(65%, rgba(115, 0, 47, 0.35)), to(rgba(0, 0, 0, 0))); background-image: linear-gradient(7deg, #e6005d 0%, rgba(115, 0, 47, 0.35) 65%, rgba(0, 0, 0, 0) 100%);  background-image: -ms-linear-gradient(7deg, #e6005d 0%, rgba(115, 0, 47, 0.35) 65%, rgba(0, 0, 0, 0) 100%); position: absolute; left: 0; top: 0; content: ""; width: 100%; height: 100%;}
.call_info{position: relative;}
.call_info h4{color: var(--white); font-size: 4rem; font-weight: 600; display: inline-block; padding-top: 1.5rem; font-family: "Roboto", sans-serif;}
.wrapper{position: absolute; right: 0; top: 0; z-index: 2;}
.coccoc-alo-ph-circle { width: 16rem; height: 16rem; top: 2rem; left: 2rem; position: absolute; background-color: transparent;  -webkit-border-radius: 100%;  -moz-border-radius: 100%; border-radius: 100%; border: .2rem solid rgba(30, 30, 30, 0.4); opacity: .1; -webkit-animation: coccoc-alo-circle-anim 1.2s infinite ease-in-out;  -moz-animation: coccoc-alo-circle-anim 1.2s infinite ease-in-out;  -ms-animation: coccoc-alo-circle-anim 1.2s infinite ease-in-out; -o-animation: coccoc-alo-circle-anim 1.2s infinite ease-in-out; animation: coccoc-alo-circle-anim 1.2s infinite ease-in-out; -webkit-transition: all .5s; -moz-transition: all .5s; -o-transition: all .5s; transition: all .5s;}
.coccoc-alo-phone { background-color: transparent; width: 20rem; height: 20rem; cursor: pointer; z-index: 200000 !important; -webkit-backface-visibility: hidden; -webkit-transform: translateZ(0); -webkit-transition: visibility .5s; -moz-transition: visibility .5s; -o-transition: visibility .5s; transition: visibility .5s; right: 15rem; top: 3rem;}
.coccoc-alo-phone.coccoc-alo-green .coccoc-alo-ph-circle-fill {  background-color: var(--brand);  opacity: .75 !important;}
.coccoc-alo-ph-circle-fill {  width: 10rem;  height: 10rem; top: 5rem; left: 5rem; position: absolute; background-color: #000; -webkit-border-radius: 100%;  -moz-border-radius: 100%;  border-radius: 100%; border: .2rem solid transparent; opacity: .1; -webkit-animation: coccoc-alo-circle-fill-anim 2.3s infinite ease-in-out; -moz-animation: coccoc-alo-circle-fill-anim 2.3s infinite ease-in-out; -ms-animation: coccoc-alo-circle-fill-anim 2.3s infinite ease-in-out; -o-animation: coccoc-alo-circle-fill-anim 2.3s infinite ease-in-out; animation: coccoc-alo-circle-fill-anim 2.3s infinite ease-in-out; -webkit-transition: all .5s; -moz-transition: all .5s; -o-transition: all .5s; transition: all .5s;}
.coccoc-alo-ph-img-circle { width: 6rem; height: 6rem; top: 7rem; left: 7rem; position: absolute; background: rgba(30, 30, 30, 0.1) url('../images/call.png') no-repeat center center; -webkit-border-radius: 100%; -moz-border-radius: 100%; border-radius: 100%; border: .2rem solid transparent; opacity: .7; -webkit-animation: coccoc-alo-circle-img-anim 1s infinite ease-in-out; -moz-animation: coccoc-alo-circle-img-anim 1s infinite ease-in-out; -ms-animation: coccoc-alo-circle-img-anim 1s infinite ease-in-out; -o-animation: coccoc-alo-circle-img-anim 1s infinite ease-in-out; animation: coccoc-alo-circle-img-anim 1s infinite ease-in-out; background-size: 71%;}
.coccoc-alo-phone.coccoc-alo-green .coccoc-alo-ph-img-circle {background-color: var(--second_color);}
.coccoc-alo-phone.coccoc-alo-green .coccoc-alo-ph-circle { border-color: var(--brand); opacity: .5;}
.coccoc-alo-phone.coccoc-alo-green.coccoc-alo-hover .coccoc-alo-ph-circle,
.coccoc-alo-phone.coccoc-alo-green:hover .coccoc-alo-ph-circle { border-color: var(--brand); opacity: .5;}
.coccoc-alo-phone.coccoc-alo-green.coccoc-alo-hover .coccoc-alo-ph-circle-fill,
.coccoc-alo-phone.coccoc-alo-green:hover .coccoc-alo-ph-circle-fill { background-color: var(--dark_yellow); opacity: .75 !important;}
.coccoc-alo-phone.coccoc-alo-green.coccoc-alo-hover .coccoc-alo-ph-img-circle,
.coccoc-alo-phone.coccoc-alo-green:hover .coccoc-alo-ph-img-circle { background-color: var(--brand);}


/* plan_sec */
.plan_box{border-radius: .5rem; border: .1rem solid #E8E8E8; padding: 2.5rem; position: relative; transition: all 0.3s linear; margin-top: 5rem; background: var(--white)}
.number{position: absolute; top: -3rem; right: -2.7rem; display: inline-flex; justify-content: center; align-items: center; width: 5rem; height: 5rem; border-radius: 50%; border: .1rem solid #E8E8E8; font-size: 2.2rem;  font-weight: normal;  color: var(--brand);  background: var(--white);}
.plan_sec .row{margin: 0 -2rem;}
.plan_sec .cumll{padding: 0 2rem;}
.plan_sec{background-attachment: fixed !important;}


/* get_coupen_sec */
.get_coupen_sec{position: relative; background-attachment: fixed !important;}
.get_coupen_sec::before{background-color: transparent; --background-overlay: ''; background-image: linear-gradient(165deg, #181818 20%, #7242FA9E 100%); position: absolute; left: 0; top: 0; width: 100%; height: 100%; content: "";}
.get_coupen_info{position: relative;}
.play_btn{position: absolute; right: 5rem; top: 50%; -ms-transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -moz-transform: translateY(-50%);
    -o-transform: translateY(-50%);
    transform: translateY(-50%);
}
.play_btn_box{width: 9rem; height: 9rem; box-shadow: 0px 5px 30px -10px rgba(0, 0, 0, 0.25); background: var(--white); position: relative; z-index: 1; display: flex; align-items: center; justify-content: center; border-radius: 100%; font-size: 4rem; color: var(--brand) !important; -webkit-transition: all .4s ease; transition: all .4s ease; --glow-size: 40px;}
.play_btn_box::before, .play_btn_box::after{content: " "; position: absolute; top: 0; left: 0; width: 100%; height: 100%; color: var(--brand); border-radius: 50%; -webkit-box-shadow: 0 0 0 0 currentColor; box-shadow: 0 0 0 0 currentColor; -webkit-animation: button-ripple 3s infinite; animation: button-ripple 3s infinite; opacity: .6; z-index: -1; -webkit-animation-delay: .9s; animation-delay: .9s;}
.play_btn_box::after{-webkit-animation-delay: .3s; animation-delay: .3s;}

/* extra_person_sec */
.extra_person_sec{background-attachment: fixed !important;}
.person_charge_box{background: #f5faff; border-radius: .5rem; position: relative; margin-top: 2rem; display: flex; align-items: center; justify-content: space-between; transition: all 0.3s ease-in-out;}
.person_charge_box_lt{width: 70%; border-right: .2rem dashed #ccc; padding: 3rem; position: relative;}
.person_charge_box_lt::before, .person_charge_box_lt::after{content: ""; position: absolute;  right: -1.6rem;  top: -1.8rem; width: 3rem;  height: 3rem;  border-radius: 50px;  background: var(--white);}
.person_charge_box_lt::after{top: inherit; bottom: -1.8rem;}
.book_brn_rt{position: absolute; right: 0; bottom: 0;}
.book_brn_rt .as_btn{border-radius: .5rem 0 0 0;}
/* .extra_person_sec .cumll:nth-child(even) .person_charge_box{text-align: right;}
.extra_person_sec .cumll:nth-child(even) .person_charge_box .book_brn_rt{left: 0; right: inherit;}
.extra_person_sec .cumll:nth-child(even) .person_charge_box .book_brn_rt .as_btn{border-radius: 0 .5rem 0 0;} */

.cup_book_btn{width: 30%; display: flex; align-items: center; justify-content: center; font-size: 4rem; color: var(--brand);}
.cup_book_btn:hover{color: var(--black);}
.extra_person_info{margin-top: 1rem;}
.person_charge_box:hover{background: var(--brand);}
.person_charge_box:hover .person_charge_box_lt{border-right-color: var(--white);}
.person_charge_box:hover h4, .person_charge_box:hover p{color: var(--white);}
.person_charge_box:hover .cup_book_btn{color: var(--white);}


/* faq_sec */
.faq_heading{font-size: 1.8rem; text-transform: capitalize; color: var(--black); line-height: 2.8rem;  margin-right: 5rem;}
.faq_number{font-size: 2rem; color: var(--brand); font-weight: 700; line-height: 1; margin-right: 2rem;}
.faq_content .accordion-button:not(.collapsed){background: transparent;}
.faq_content .accordion-button {padding: 2rem 1.25rem;}
.faq_content .accordion-button:focus { box-shadow: inset 0 -1px 0 rgba(0,0,0,.125);}
.faq_content .accordion-button:not(.collapsed)::after {content: "\f068"; background-image: none; }
.faq_content .accordion-button::after{color: var(--brand); width: auto; height: auto; font-size: 1.8rem; background-image: none; font-family: "Font Awesome 6 Pro"; content: "\2b";}
.faq_content .accordion-body { padding: 2rem 1.5rem;}
.lt_faq{margin-right: 5rem;}
.faq_content .accordion-item , .faq_content .accordion-button{background-color: transparent;}
.rules_regulations .container{max-width: 100%; padding: 0;}
.blog_content{height: 47rem; overflow-y: auto; margin-top: 1rem;}
.blog_content .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar{background-color: var(--brand);}
.blog_content .mCS-dark.mCSB_scrollTools .mCSB_dragger:hover .mCSB_dragger_bar{background-color: rgba(0,103,54,1);}
.blog_content .mCSB_inside > .mCSB_container {margin-right: 2rem;}
.faq_sec{padding: 2rem; background: var(--white); margin: 5rem 3rem; position: relative;}
.rules_regulations{position: relative;}
.lt_img{position: absolute; left: 0; top: 0;}
.lt_img img{width: 25rem;}


/* footer_sec */
.ft_sec{background: var(--black); padding-top: 5rem;}
.ft_logo{display: block; margin-bottom: 4rem;}
.ft_logo img{width: 15rem;}
.ft_heading{color: #FF9420; font-size: 2rem; font-weight: 600; letter-spacing: 0.5px; text-transform: capitalize; line-height: 1;}
.ft_txt{padding-bottom: 3rem;}
.ft_con_list li, .ft_con_list li a{color: var(--white);}
.ft_con_list li { position: relative; margin-top: 1.8rem;  padding-left: 2.8rem;}
.ft_con_list li i { position: absolute; left: 0; top: .6rem; color: var(--brand);}
.what_icon i{color: #25d060 !important;}
.ft_link li{text-transform: capitalize; font-size: 1.5rem;}
.ft_link li a{color: var(--white); display: inline-block; padding-top: 1rem;}
.ft_txt iframe{width: 100%; height: 35rem;}
.sovial_icon_ft{display: inline-block; width: 100%; text-align: center; padding-bottom: 2rem;}
.sovial_icon_ft li{display: inline-block; font-size: 2.5rem;}
.sovial_icon_ft li a{color: var(--yellow); display: inline-block; padding-right: 1.55rem;}
.sovial_icon_ft li:last-child a{padding-right: 0;}
.ft_btn{border-top: .1rem solid var(--white); padding: 1.5rem 0; text-align: center;}
.ft_btn span{color: var(--yellow); display: block;}
.bok_ft_img img{width: 10rem;}
.bok_ft_img{display: block;}
.ft_link{padding-top: 1rem;}







canvas {
    width:100%;
    height:100%; position: absolute; left: 0; top: 0;
  }







@media (min-width: 992px) and (max-width: 9000px) 
{
.nav_top .dropdown .dropdown-menu { -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -ms-transition: all 0.3s;
    -o-transition: all 0.3s;transition: all 0.3s; max-height: 0; display: block; opacity: 0; visibility: hidden;  margin:0; border: none;  
    background:#fff !important; width: 22.5rem; padding: 0; border-radius: 0; left: 0; right: inherit; box-shadow: 0 0 40px 5px rgb(0 0 0 / 5%);}

.nav_top .dropdown:hover .dropdown-menu { max-height: 45rem;opacity: 1; visibility: visible; }

}

/* responsive */
@media only screen and (max-width: 1299px){
    .room_sec .container {padding: 0 1.5rem;}
}

@media only screen and (max-width: 1199px){
   .menu_sec{padding-right: 8rem;} 
   .nav_top img {width: 14rem;}
   .heder_rt_btn {top: .9rem;}
   .banner_box {padding: 20rem 0 0 0;}
   .number { top: -1.6rem;  right: -1.4rem;  width: 4.5rem;  height: 4.5rem; font-size: 2rem;}
   .room_txt_top { align-items: start; flex-direction: column;}
   .price{display: block; padding-top: .5rem;}
   .room_info {padding: 2rem;}
   .ft_top .cumll:nth-child(2) .ft_txt{padding-left: 2rem;}
   
}

@media only screen and (max-width: 991px){
    
    .nav_top .navbar-toggler {color: transparent; border: none; padding: 1rem; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; margin-right: -1rem;}
    .nav_top .navbar-toggler .icon-bar {display: block; width: 3rem; height: .4rem; border-radius: .3rem; background-color: var(--black); opacity: 1; -webkit-transform: matrix(1, 0, 0, 1, 0, 0); transform: matrix(1, 0, 0, 1, 0, 0); -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out;}
    .nav_top .navbar-toggler .icon-bar + .icon-bar {margin-top: .4rem;}
    .nav_top .navbar-toggler.showtoggle .icon-bar:nth-child(2){opacity: 0;  width: 0px;}
    .nav_top .navbar-toggler.showtoggle .icon-bar:nth-child(3) {-webkit-transform: matrix(1, 1, 0, 1, 0, 0); transform: matrix(1, 1, 0, 1, 0, 0); width: 25px; margin-top: -11px;}
    .nav_top .navbar-toggler.showtoggle .icon-bar:nth-child(1) {-webkit-transform: matrix(1, -1, 0, 1, 0, 0); transform: matrix(1, -1, 0, 1, 0, 0); width: 25px;}
    .nav_top .navbar-collapse.show{left: 0;}
    .nav_top .navbar-collapse{position: fixed; top: 0; left: -30.10rem; background: var(--white); z-index: 999999; width: 20.80rem; padding: 2.5rem 1rem; height: 100% !important; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; -ms-transition: all 0.3s; -o-transition: all 0.3s; transition: all 0.3s; overflow-y: auto; min-height: 100vh; border-right: .5rem solid var(--brand);}
    .menu_sec { padding-right: 0;}
    .menu_sec li a {padding: 1.5rem; display: block; width: 100%; border-bottom: .1rem dashed #ccc;}
    .heder_rt_btn{right: 4.5rem;}
    .drop-arw{display: block; padding: .5rem; right: 0;}
    .menu_sec li {margin-right: 0;}
    .banner_box strong {font-size: 4rem; line-height: 4.5rem;}
    .greeting_card .front {padding: 5rem 1rem 2rem 1rem;}
    .plan_sec .row { margin: 0 -1.5rem;}
    .plan_sec .cumll { padding: 0 1.5rem;}
    .plan_box {padding: 1.5rem;}
    .room_img, .room_txt, .room_img img , .offer_lt, .offer_rt, .offer_rt img{height: auto;}
    .room_img {margin: 0 0 2rem 0 !important;}
    .call_info {margin-right: 4rem;}
    h1, h2 {font-size: 3rem; line-height: 3.5rem;}
    .ft_txt iframe {height: 25rem;}
    .ptb{padding: 5rem 0;}
    .inner_ptb{padding: 2rem 0 5rem 0;}
}

@media only screen and (max-width: 767px){
    
    .container{max-width: 100%; padding: 0 1.5rem;}
    .plan_box { margin-top: 3rem;}
    .room_txt_top h4{font-size: 2.2rem; line-height: 2.8rem;}
    .call_info {margin-right: 10rem;}
    .play_btn_box {width: 7rem; height: 7rem; font-size: 3rem;}
    .play_btn{top: inherit; transform:inherit; bottom: 3.7rem;}
    .faq_sec{margin: 4rem 1.5rem;}
    .offer_lt {padding: 4rem 1.5rem;}
    .discount_hedaing {font-size: 4rem; line-height: 4.5rem;}
    .ptb{padding: 4rem 0;}
    .inner_ptb{padding: 1rem 0 4rem 0;}
}


@media only screen and (max-width: 575px){

    .nav_top img {width: 11rem;}
    .heder_rt_btn .as_btn{font-size: 1.4rem; padding: 0 1.5rem; height: 4.5rem; line-height: 4.5rem;}
    .heder_rt_btn {top: .5rem;}
    .banner_box {padding: 15rem 0 0 0;}
    .greeting_card .front {padding: 5rem 1rem 1rem 1rem;}
    .banner_box strong { font-size: 2.5rem; line-height: 3rem;}
    .plan_box, .room_box{margin-top: 2rem;}
    .other_txt_list li {width: 100%;}
    .room_txt_top h4 {font-size: 2rem; line-height: 2.8rem;}
    .room_tct_btm_btn_list{width: 100%;}
    .room_tct_btm_btn_list li{display: block; width: 100%; margin-right: 0;}
    .room_tct_btm_btn_list li .as_btn{width: 100%;}
    .room_tct_btm_btn_list li:last-child .as_btn{margin-top: 1.5rem;} 
    .coccoc-alo-ph-circle-fill { width: 6rem; height: 6rem;}
    .coccoc-alo-ph-img-circle { width: 4rem; height: 4rem; top: 6rem; left: 6rem;}
    .coccoc-alo-ph-circle { width: 11rem; height: 11rem; top: 2.4rem; left: 2.5rem;}
    .call_info {margin-right: 0; }
    h1, h2 {font-size: 2.5rem; line-height: 3rem;}
    .wrapper {right: 5rem; top: inherit; bottom: 0;}
    .coccoc-alo-phone {width: 10rem; height: 10rem;}
    .coupon_info {padding: 2rem; margin-top: 4rem;}
    .coup_list h4{font-size: 2rem; line-height: 2.5rem;}
    .person_charge_box_lt { width: 93%; padding: 2rem;}
    .faq_heading {font-size: 1.5rem; line-height: 2.2rem; margin-right: 1rem;}
    .faq_number {margin-right: 1.5rem;}
    .faq_sec {padding: 1rem;}
    .ft_top .cumll:nth-child(2) .ft_txt {padding-left: 0;}
    .room_info { padding: 1.5rem;}
    .inner_ptb{padding: 2rem 0 4rem 0;}
    .call_info h4{padding: 1.5rem 0;}
    
}

@media only screen and (max-width: 480px){
  
  

}