/* @import url('https://fonts.googleapis.com/css2?family=Dancing+Script&family=Mulish:wght@300;400;500;600;700;800&display=swap'); */
@import url('https://fonts.googleapis.com/css2?family=Dancing+Script&family=Poppins:wght@300;400;500;600;700&display=swap');
  /*
  font-family: 'Jost', sans-serif; */
  
*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    
     /* font-family: 'Dancing Script', cursive; */
}
:root{
    --primary-color:#6cc8c7;
    --secondary-color:#f9b2ac;
}
body{
  /* font-family: 'Mulish', sans-serif; */
  font-family: 'Poppins', sans-serif;
}

a{
  
    text-decoration: none !important;
}
/*--------------------------------------*/
/* HEADER: Position relative to help... */
/*    ... poitioning elements absolute  */
/*--------------------------------------*/
img{
    width: 100%;
}

header {
    background: var(--secondary-color);
    padding: .5em 0;
    height: 4rem;
    /* position: relative; */
    /* position: static; */
    position: fixed;width: 100%;z-index: 999;top: 0;
}

/*------------------------------------------*/
/* Allows multiple floats in same element   */
/*------------------------------------------*/

header::after {
    content: '';
    clear: both;
    display: block;
}
.btn-main{
    text-decoration: none;
    background-color: var(--primary-color);
    border-radius: 8px;
    padding: 8px 15px;
    color: #fff;
    font-weight: 600;
    font-size: 15px;
    transition: .6s ease-in-out;
}
.btn-main:hover{
    background-color: var(--secondary-color);
}
/*--------------------------------------*/
/*            Navigation                */
/*--------------------------------------*/
.site-nav {
    position: absolute;
    top: 100%;
    right: 0%;
    background:var(--secondary-color);
    height: 0px;
    overflow: hidden;
}

.site-nav-open {
    height: auto;
}

.site-nav ul {
    margin: 0;
    padding: 0;
    list-style: none;  /* Removes li bullets */
}

.site-nav li {
    border-bottom: 1px solid #d7d7d7;  /* border beneath nav li */
}

.site-nav li:last-child {     /* removes border from last nav li */
    border: none;
}

.site-nav a {  
  /* font-weight: 500;  */
  /* font-family: 'Dancing Script', cursive !important; */
    text-align: center;         /* Displays nav links as block for smaller screens */
    color: #fff;
    font-size: 17px;
    display: block;
    padding: .6rem 0;  /* padding for links */
    /* text-transform: uppercase; */
    text-decoration: none;
}
.site-nav a.active{
  color: var(--primary-color);
  font-weight: 500;
}
.site-nav a:hover,         /* hover is for computers and focus is for mobile */
.site-nav a:focus {
    background:var(--primary-color);
    color: #4d4d4d;
}


/*--------------------------------------*/
/* Acts as btn & contains hamburger     */
/*--------------------------------------*/

.menu-toggle {
  bottom: -20px;
    cursor: pointer;
    margin-left: auto;
    z-index: 99;
    margin-right: auto;
    position: absolute;
    left: 50%;
    width: 5rem;
    transform: translate(-50%, 0);
}


/*--------------------------------------*/
/*   Styles the hamburger for btn       */
/*--------------------------------------*/

.hamburger,
.hamburger::before,
.hamburger::after {
    /* content:'';
    display: block;
    background: #00b3b3;
    height: 3px;
    width: 1.75em;
    border-radius: 2px; */
    transition: all ease-in-out 500ms;
}

/*--------------------------------------*/
/* Instance of hamburger (top line)     */
/*--------------------------------------*/

.hamburger::before {
    transform: translateY(-7px);
}

/*--------------------------------------*/
/* Instance of hamburger bottom line    */
/*--------------------------------------*/

.hamburger::after {
    transform: translateY(4px);
}

/*--------------------------------------*/
/* When Nav menu is open, hamburger = X */
/*--------------------------------------*/

.open .hamburger {
    transform: rotate(360deg);
    
}

/*--------------------------------------*/
/* Before hamburger line is invisible   */
/*--------------------------------------*/
.open .hamburger::before {
    opacity: 0;            
}

/*--------------------------------------*/
/* Animates after line to create an X   */
/*--------------------------------------*/
.open .hamburger::after {
    transform: translateY(-3px) rotate(180deg);
    background: #fff;
}

.site-nav-open {
       z-index: 999;
    width: 100%;
}
section{
    margin: 8rem 0;
}
.banner{
  
  margin-top: 4rem;
   position: relative;
    width: 100%;
   flex-direction: column;
    display: flex;
    align-items: center;
    justify-content: center;
    background-position: center;
    background-size: cover;
    /* background-attachment: fixed; */
    background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgb(255 255 255 / 25%) 60%, rgb(255 255 255 / 96%) 100%),url(../images/bg.jpg);
}
.banner .vid-container{
  width: 100%;
  height: 100%;
    position: relative;
    border: 1rem solid #fff;
}
.banner .vid-container video{
  width: 100%;
  height: 100%;
  position: absolute;
  object-fit: cover;
  z-index: 0;
}
.banner h2{
    font-weight: 700;
    color: var(--secondary-color);
    padding: 5rem 0;
    text-transform: uppercase;
}
.banner-sec{
    width: 100%;
    height:400px;
    
    background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgb(255 255 255 / 25%) 60%, rgb(255 255 255 / 96%) 100%),url(../images/ban.jpg);
   position: relative;
    background-position: center;
    background-size: cover;
    background-attachment: fixed;
    
}
.banner-sec .bnr-cnt{
    position: absolute;
    height: 100%;
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}
.banner-sec .bnr-cnt .bnr-bx{
   opacity: .9;
   color: #fff;
    padding: 2rem 4rem;
    background-color: var(--secondary-color);
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}
.banner-sec .bnr-cnt .outer-bx{
    padding: 6px;
    border: 3px solid var(--secondary-color);
    border-radius: 10px;
}

.banner img{
    width: 100%;
    object-fit: cover;
}

/*--------------------------------------*/
/*    For Device (Screens > 700px )     */
/*--------------------------------------*/
@media (min-width:700px) {

    .menu-toggle {       /* Removes hamburger menu */
        display: none;
    }
    
    .site-nav {         /* Positions site nav & removes background color */
        height: auto;
        position: relative;
        background: transparent;
        
        font-weight: 300;
        text-align: center;
    }

    .site-nav li {               /* inline-block and removes border from bottom */
        display: inline-block;
        border: none;
    }

    .site-nav a {       /* Adds spacing between Nav links */
        padding: 0;
        margin: 0 1rem;
       
    }

    .site-nav a:hover,      /* Makes link background transparent on hover */
    .site-nav a:focus {        /* Changes font color to light blue */
        background: transparent;
        
        color: var(--primary-color);
    }

    .site-nav .site-nav-icon {     /* Removes Font Awesome Icons for larger screens */
        display: none;
    }

}
.sec-hed{
  
    text-align: center;
    font-size: 20px;
    font-weight: 600;
    margin: 2em 0;
}
section.welcome .col-md-4{
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}
.round-bx{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    height: 200px;
    width: 200px;
    border-radius: 50rem;
    border: 5px solid var(--secondary-color);
    overflow: hidden;
}
.round-bx img{
    object-fit: cover;
    border-radius: 50rem;
    width: 100%;
    height: 100%;
    transition: transform .7s ease-in-out;
}
.round-bx img:hover{
    transform: rotate(720deg);
    border: 5px solid var(--primary-color);
    box-shadow: rgba(0, 0, 0, 0.15) 0px 5px 15px 0px;
}
.welcome .ice-name{
    font-weight: 500;
    font-size: 14px;
    margin: 15px 0 3px 0;
    text-align: center;
    /* font-family: 'Dancing Script', cursive !important; */
    font-size: 18px;
}
.footer .col-sm-4 p a{
  color: #fff;
}
.footer .col-sm-4 p a:hover{
  text-decoration: underline;
  color: var(--secondary-color);
}
.round-bx .ice-cat{
    font-size: 12px;
    text-align: center;

}
.trending .trend-bx{
 
    display: flex;
    align-items: center;
    flex-direction: column;
    margin-bottom: 15px;
  
}
.trending .trend-bx:hover .img-bx img{
transform: scale(1.4);
}
.trending .trend-bx .img-bx{
    
    width: 100%; 
    border: 1px solid #ccc;
    border-radius: 20px;
    overflow: hidden;
}
.trending .trend-bx .img-bx img{
    width: 100%;
    height: 100%;
    border-radius: 20px;
    object-fit: cover;
    transition: .8s ease-in-out;
}
.trending .trend-bx .p-name{
    font-weight: 600;
    font-size: 14px;
    margin-top: 15px;
}
.trending .trend-bx .p-price{
    font-size: 12px;
    font-weight: 300;
}
.trending .trend-bx .icon-bx{
display: flex;
}
.trending .trend-bx .icon-bx i{
    color:var(--primary-color);
    padding: 6px;
    font-size: 16px;
    transition: 1s ease;
}
.trending .trend-bx .icon-bx i:hover{
transform: translate3d(10px, 0, 100px);
cursor: pointer;
}

.site-nav ul li a img{
    width: 80px !important;
}
.about_section {
    background: -webkit-gradient(linear, left top, right top, color-stop(50%, #b6ded6), color-stop(50%, transparent));
    background: linear-gradient(to right, #b6ded6 50%, transparent 50%);
  }
  
  .about_section .row {
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center;
  }
  
  .about_section .img-box {
    position: relative;
    overflow: hidden;
    height: 100%;
  }
  
  .about_section .img-box img {
    width: 100%;
  }
  
  .about_section .detail-box p {
    color: #1f1f1f;
    margin-top: 15px;
  }
  
  .about_section .detail-box a {
    display: inline-block;
    padding: 10px 35px;
    background-color: var(--primary-color);
    color: #ffffff;
    border-radius: 0px;
    -webkit-transition: all .3s;
    transition: all .3s;
    border: 1px solid var(--primary-color);
    margin-top: 15px;
  }
  
  .about_section .detail-box a:hover {
    background-color: transparent;
    color: var(--primary-color);
  }
  
  .about_section2 {
    background: -webkit-gradient(linear, left top, right top, color-stop(50%, transparent), color-stop(50%, #ffccb1));
    background: linear-gradient(to right, transparent 50%, #ffccb1 50%);
  }
  
  .about_section2 .detail-box a {
    display: inline-block;
    padding: 10px 35px;
    background-color: #ff9e6a;
    color: #ffffff;
    border-radius: 0px;
    -webkit-transition: all .3s;
    transition: all .3s;
    border: 1px solid #ff9e6a;
    margin-top: 15px;
  }
  
  .about_section2 .detail-box a:hover {
    background-color: transparent;
    color: #ff9e6a;
  }
  .vid-banner{
    width: 100%;
    height: max-content;
    padding: 0 3rem;
    background-color: var(--secondary-color);
  }
  .vid-banner .ban-right{
   
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
  }
  .vid-banner iframe{
    width: 100%;
  }
  section.promotion{
    /* background-color: var(--secondary-color); */
  }
  /* gallery */

.gallery .gallery-container{
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr));
    gap: 1rem;
}

.gallery .gallery-container .box{
    height: 300px;
    position: relative;
    overflow: hidden;
}

.gallery .gallery-container .box img{
    height: 100%;
    width: 100%;
    object-fit: cover;
}

.gallery .gallery-container .box:hover img{
    transform: scale(1.1);
}

.gallery .gallery-container .box .icon{
    align-items: center;
    justify-content: center;
    position: absolute;
    top: 0; left: 0;
    z-index: 10;
    height: 100%;
    width: 100%;
    background: rgba(0,0,0,.7);
    display: none;
}

.gallery .gallery-container .box .icon i{
    font-size: 6rem;
    color: var(--secondary-color);
}

.gallery .gallery-container .box:hover .icon{
    display: flex;
}
/* services */
.service-item .service-img {
    position: relative;
    width: 150px;
    height: 150px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 150px;
    z-index: 1;
  }
  
  .service-item .service-img::before {
    position: absolute;
    content: "";
    top: 15px;
    right: 0;
    bottom: -15px;
    left: 0;
    background: var(--secondary-color);
    border-radius: 150px;
    z-index: -1;
  }
  
  .service-item .service-img img {
    transition: 1s;
  }
  
  .service-item:hover .service-img img {
    transform: rotate(360deg);
  }
  .owl-carousel .owl-nav {
    position: absolute;
    width: 135px;
    height: 60px;
    top: -110px;
    right: 0;
    display: flex;
    align-items: center;
    justify-content: space-between;
    z-index: 1;
  }
  
  .owl-carousel .owl-nav .owl-prev,
  .owl-carousel .owl-nav .owl-next {
    width: 60px;
    height: 60px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--secondary-color);
    background: #FFFFFF;
    border-radius: 60px;
    font-size: 30px;
  }
 .footer{
    position: relative;
    color: #fff;
    background-color: var(--primary-color);
 }
 .footer img{
    width: 100px !important;
 }
 .testimonial-carousel .owl-item img {
    width: 80px !important;
    height: 80px !important;
    border-radius: 80px;
  }
  
  .testimonial-carousel .owl-dots {
    margin-top: 25px;
    text-align: center;
  }
  
  .testimonial-carousel .owl-dot {
    position: relative;
    display: inline-block;
    margin: 0 8px;
    width: 15px;
    height: 15px;
    border-radius: 15px;
    background: var(--secondary-color);
  }
  
  .testimonial-carousel .owl-dot::after {
    position: absolute;
    content: "";
    top: -5px;
    right: -5px;
    bottom: -5px;
    left: -5px;
    border: 2px solid var(--secondary-color);
    border-radius: 20px;
  }
  
  .testimonial-carousel .owl-dot.active {
    background: #62C3E7;
  }
  .contact_section {
    position: relative;
    background: -webkit-gradient(linear, left top, right top, color-stop(50%, var(--secondary-color)), color-stop(50%, transparent));
    background: linear-gradient(to right,  var(--secondary-color) 50%, transparent 50%);
    color: #ffffff;
    padding: 1rem;
  }
  
  .contact_section .heading_container {
    margin-bottom: 25px;
  }
  
  .contact_section .form_container input {
    width: 100%;
    border: none;
    height: 50px;
    margin-bottom: 25px;
    padding-left: 25px;
    background-color: #fefefe;
    outline: none;
    color: #000000;
    border-radius: 5px;
  }
  
  .contact_section .form_container input::-webkit-input-placeholder {
    color: #222222;
  }
  
  .contact_section .form_container input:-ms-input-placeholder {
    color: #222222;
  }
  
  .contact_section .form_container input::-ms-input-placeholder {
    color: #222222;
  }
  
  .contact_section .form_container input::placeholder {
    color: #222222;
  }
  
  .contact_section .form_container input.message-box {
    height: 120px;
    border-radius: 5px;
  }
  
  .contact_section .form_container button {
    margin-top: 15px;
    border: none;
    text-transform: uppercase;
    display: inline-block;
    padding: 10px 55px;
    background-color: var(--primary-color);
    color: #ffffff;
    border-radius: 0px;
    -webkit-transition: all .3s;
    transition: all .3s;
    border: 1px solid var(--secondary-color);
  }
  
  .contact_section .form_container button:hover {
    background-color: transparent;
    color: var(--secondary-color);
  }
  
  .contact_section .map_container {
    width: 100%;
    height: 345px;
    border-radius: 25px;
    overflow: hidden;
  }
  
  .contact_section .map_container #googleMap {
    height: 100%;
    min-height: 100%;
    width: 100%;
  }
.footer .btn-social1{
  border: 1px solid #fff;
  border-radius: 8px;
  color: #fff;
  background-color: transparent;
  padding: 5px 10px;
  transition: .2s ease-in-out;
}
.footer .btn-social1:hover{
  background-color: #fff;
  color: var(--primary-color);

}
/* info section */
.info_section {
  color: #000000;
 background-color: #fff;

}



.info_section .info_contact {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  flex-direction: column;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: flex-start;
  -webkit-box-pack: justify;
      -ms-flex-pack: justify;
          justify-content: space-between;
}

.info_section .info_contact .link-box {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  color: var(--secondary-color);
  margin-bottom: 10px;
 
}

.info_section .info_contact .link-box i {
  width: 45px;
  height: 45px;
  line-height: 45px;
  border: 1px solid var(--secondary-color);
  text-align: center;
  border-radius: 5px;
  font-size: 18px;
  margin-right: 10px;
}

.info_section .info_contact .link-box:hover i {
  color: var(--primary-color);
}



.info_section .social-box {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  flex-direction: column;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
}



@media screen and (max-width:768px) {
  .info_section {
    color: #000000;
   background-color: #fff;
   padding: 1rem;
   box-shadow: 1px 2px 10px 2px #bbb;
   margin-top: 1rem;
   text-align: center ;
  }
  .trending .trend-bx .icon-bx i {
   
    padding: 2px;
    font-size: 14px;
   
}
  .banner{
    margin-top: 4rem;
  }
  
  .contact_section {
    background: linear-gradient(to bottom, var(--secondary-color) 625px, transparent 625px);
  }
  .contact_section .map_container {
    margin-top: 90px;
  }

  
  .banner .vid-container video{
    position: unset;
  }
     .about_section .detail-box a {
        margin-bottom: 10px; 
     }
    .aboutsec .detail-box{
        text-align: center;
    }
    .welcome .col-md-4{
        margin-bottom: 2rem;
    }
    .banner h1, p{
        text-align: center;
    }
    .banner .row{
        margin: 30px 0;
        flex-direction: column-reverse;
    }
    .about_section {
        background: linear-gradient(to bottom, var(--secondary-color) 50%, transparent 50%);
      }
    
      .about_section2 {
        background: linear-gradient(to bottom, var(--primary-color) 50%, transparent 50%);
      }
    
      .about_section2 .row {
        flex-direction: column-reverse;
      }
    
    .container ul li:nth-child(5){
        display: none;
    }
    header {
      
        padding: 0 0;
        
    }
    section{
      margin: 4rem 0;
    }
    
}
@media (max-width: 480px) {
    .about_section {
      background: linear-gradient(to bottom, var(--primary-color) 45%, transparent 45%);
    }
  
    .about_section2 {
      background: linear-gradient(to bottom, #ffccb1 45%, transparent 45%);
    }
    .gallery .gallery-container {
     
      grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr));
     
  }
  }
  
  @media (max-width: 420px) {
    .slider_section .detail-box h1 {
      font-size: 2rem;
    }
  
    .hero_area .hero_bg_box img {
      object-position: 20% bottom;
    }
  
    .about_section2 {
      background: linear-gradient(to bottom, #ffccb1 40%, transparent 40%);
    }
  }
  
  @media (max-width: 376px) {
    .about_section {
      background: linear-gradient(to bottom, #fcafc0 40%, transparent 40%);
    }
  
    .about_section2 {
      background: linear-gradient(to bottom, #ffccb1 35%, transparent 35%);
    }
  }
  #preloader{
    background: #63d2e3 url(../images/preloader.gif) no-repeat center center;
    height: 100vh;
    width: 100%;
    position: fixed;
    z-index: 100;
    text-align: center;
    background-size: 80%;
}