* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

img {
  max-width: 100%;
}

a,
a:hover,
a:focus,
a:visited,
a:active {
  text-decoration: none;
}

p,
ul,
li {
  padding: 0;
  margin: 0;
}
/* 
body {
  font-family: "Lato", sans-serif;
} */



/* header */
header {
  position: unset;
  left: 0;
  right: 0;
  top: 0;
  z-index: 99;
}

header .header-top {background-color: #2b2b2b; padding: 10px 0px;}
header .header-top .top-info{gap: 45px;}

header .header-top .top-info li, header .header-top .top-info li a {color: #fff; font-size: 12px; position: relative;}
header .header-top .top-info li::before {position: absolute; height: 39px; width: 1px; background-color: #fff; content: ''; right: -22px;
top: -10px;}
header .header-top .top-info li:last-child:before{display: none;}

header .headermn{background-color: #f7f0f2;}
header .headermn .navbar .navbar-brand {width: 8%;}

header .headermn .navbar .navbar-brand img {
  width: 100%;
}

header .nav-link {
  color: #000;
  font-size: 13px;
  font-weight: 500;
  transition: .5s;
  position: relative;
  padding: 0px 0px !important;
  text-transform: uppercase;
}

header .nav-link::after {
  content: '';
  background-color: #aba56b;
  width: 0%;
  height: 2px;
  position: absolute;
  bottom: -5px;
  left: 0;
  transition: .5s;
}

header .nav-link:hover::after {
  width: 100%;
}

header .nav-link:hover,
header .nav-link:focus {
  color: #aba56b;
}

header .navbar-nav {
  gap: 45px;
}

header .navbar-toggler {
  border: none;
  color: #aba56b;
  font-size: 28px;
  border-radius: 0;
}

header .navbar-toggler:focus {
  box-shadow: none;
}

header .offcanvas-title img {
  width: 34%;
}

header .navbar-nav {
  position: relative;
  align-items: center;
}

.sticky {
  left: 0;
  right: 0;
  z-index: 999;
  position: fixed !important;
  top: 0px;
  animation: slideDown .5s ease-out;
  background-color: #fff;
  box-shadow: 0 0 10px #00000021;
}

.sticky .headermn .navbar .navbar-brand {
  width: 9%;
}

@keyframes slideDown {
  from {
    transform: translateY(-100%);
  }

  to {
    transform: translateY(10);
  }
}
header{overflow: hidden;}
header .navbar .whatsapp li a {
  display: inline-block;
  padding: 10px 20px;
  background-color: transparent;
  color: #aba56b;
  border-radius: 3px;
  transition: .5s;
  border: 1px solid #aba56b;
  position: relative;
  transition: .5s;
  z-index: 1;
}

header .navbar .whatsapp li a::before {
  position: absolute;
  content: '';
  top: 0px;
  left: 0px;
  width: 0px;
  height: 100%;
  transition: .5s;
  background-color: #aba56b;
  z-index: -1;
}

header .navbar .whatsapp li a:hover:before {
  width: 100%;
}

header .navbar .whatsapp li a:hover {
  color: #ffffff;
}

/* slider */

#slider .owl-theme .owl-dots .owl-dot {display: none;}
#mobile-slider{display: none;}
#mobile-slider .owl-theme .owl-dots .owl-dot {display: none;}

/* book-a-free */

#book-a-free .inr{background-color: #fff; box-shadow: 0px 0px 10px #0000003d; padding: 30px; align-items: center;}
#book-a-free .content{text-align: center;}
#book-a-free .content h4{font-size: 23px; font-weight: 500;}
#book-a-free .content h4 span{color: #aba56b;}
#book-a-free .content .imgs img{width: 50%;}
#book-a-free .iner .icon-input{position: relative;}
#book-a-free .iner .form-control{background-color: #f8f8f8; padding: 10px 40px; box-shadow: none; border: transparent; border-radius: 0px; margin-bottom: 10px; font-size: 15px;}
#book-a-free .iner span{position: absolute; top: 9px; left: 23px; color: #aba56b;}
#book-a-free .iner .view-collection{padding: 10px 30px; background-color: #aba56b; display: block; width: 100%; color: #fff; border-radius: 0px; margin-top: 20px; border: transparent;}


/* about */

#about {padding: 50px 0px;}
#about .row {row-gap: 30px; align-items: center;}
#about .content h1 {font-size:35px;}
#about .content h2 {color: #484848; font-size: 35px; margin-bottom: 10px; font-weight: bold;}
#about .content span {color: #aba56b;}
#about .content .text {font-size: 15px; text-align: justify; color: #484848; line-height: 24px; margin-bottom: 24px;}
#about .content .text p{margin-bottom: 5px;}
#about .imgs {overflow: hidden; border-radius: 5px; text-align: end;}
#about .imgs img {transition: 9s;}
#about .imgs:hover img {transform: scale(1.2);}

/* procedure-we-offer */

#procedure-we-offer{padding: 50px 0px; background-color: #85aeb3;}
#procedure-we-offer .row{row-gap: 30px;}
#procedure-we-offer h2{text-align: center; font-size: 30px; font-weight: 500; margin-bottom: 35px;}
#procedure-we-offer .iner{background-color: #dadada; transition: .5s;}
#procedure-we-offer .iner:hover{transform: translateY(5px);}
#procedure-we-offer .iner h4{font-size: 20px; font-weight: 500; padding: 15px 0px 10px; border-bottom: 1px solid #000; text-align: center;}
#procedure-we-offer .iner .content{padding: 15px;}
#procedure-we-offer .iner .content h5{font-size: 18px; margin-bottom: 10px;}
#procedure-we-offer .iner .content .star-info li{font-size: 15px; margin-bottom: 5px;}
#procedure-we-offer .iner .content .call-info .call-btn{padding: 10px 20px; display: inline-block; background-color: #aba56b; color: #fff; border-radius: 5px;}
#procedure-we-offer .iner .content .call-info .book-btn{padding: 10px 20px; display: inline-block; background-color: #000; color: #fff; border-radius: 5px;}
#procedure-we-offer .iner .content .call-info{margin-top: 20px;}

/* video-sec */

#video-sec{padding: 40px 0px;}
#video-sec .row{row-gap: 30px;}

/* counter */

#counter {background: #aba56b; padding: 60px 0; margin-top: 50px;}
#counter h2 {text-align: center; font-size: 43px; font-weight: 600; color: #fff; margin-bottom: 60px;}
#counter .iner {text-align: center;}
#counter .iner h5 {font-size: 14px; font-weight: 600; margin-top: 20px; color: #fff;}

  /* testimonial */
#testimonial{padding: 30px 0 0px; }
#testimonial h2{color: #aba56b;}
#testimonial .row{row-gap: 20px;}
#testimonial .testimonialslider .owl-item{border: 1px solid gray; padding: 20px; height: 210px; overflow-y: scroll;}
#testimonial .owl-item h5{color: #aba56b; margin: 0px; font-size: 17px;}
#testimonial .owl-item p{font-size: 14px;}
#testimonial .iner .google{ width: 40%;}
#testimonial .iner ul li{font-size: 35px; color: #f6bb06;}
#testimonial .iner h4{margin-top: 10px;}
#testimonial .testimonialslider .star li{color: #f6bb06; font-size: 16px;}
#testimonial .testimonialslider .profile{margin-bottom: 8px;}
#testimonial .testimonialslider .profile li:first-child p{height: 40px; width: 40px; line-height: 40px; font-size: 20px; border-radius: 50%; text-align: center; background-color: #a7a7a7; color: #fff;}
#testimonial .testimonialslider .profile li span{font-size: 14px;}
#testimonial .owl-theme .owl-dots .owl-dot.active span, .owl-theme .owl-dots .owl-dot:hover span{background-color: #aba56b;}

/* gallery */

/*#gallery {*/
/*  background-color: #dbdbdb8a;;*/
/*  padding: 40px 0 40px;*/
/*  overflow: hidden;*/
/*}*/

/*#gallery .row{row-gap: 20px;}*/

/*#gallery h2 {*/
/*  font-size: 38px;*/
/*  color: #aba56b;*/
/*  font-weight: bold;*/
/*  text-align: center;*/
/*  margin-bottom: 30px;*/
/*}*/

/*#gallery h2 span {*/
/*  color: #000;*/
/*}*/

/*#gallery .img-wrapper {*/
/*  position: relative;*/
/*  margin-top: 15px;*/
/*  overflow: hidden;*/
/*  border-radius: 10px;*/
/*  box-shadow: 0 0 8px #00000033;*/
/*}*/

/*#gallery .img-wrapper img {*/
/*  width: 100%;*/
/*}*/

/*#gallery .img-overlay {*/
/*  background: rgba(0, 0, 0, 0.7);*/
/*  width: 100%;*/
/*  height: 100%;*/
/*  position: absolute;*/
/*  top: 0;*/
/*  left: 0;*/
/*  display: flex;*/
/*  justify-content: center;*/
/*  align-items: center;*/
/*  opacity: 0;*/
/*}*/

/*#gallery .img-overlay i {*/
/*  color: #fff;*/
/*  font-size: 3em;*/
/*}*/

/*#overlay {*/
/*  background: rgba(0, 0, 0, 0.7);*/
/*  width: 100%;*/
/*  height: 100%;*/
/*  position: fixed;*/
/*  top: 0;*/
/*  left: 0;*/
/*  display: flex;*/
/*  justify-content: center;*/
/*  align-items: center;*/
/*  z-index: 999;*/
/*  -webkit-user-select: none;*/
/*  -moz-user-select: none;*/
/*  -ms-user-select: none;*/
/*  user-select: none;*/
/*}*/

/*#overlay img {*/
/*  margin: 0;*/
/*  width: 80%;*/
/*  height: auto;*/
/*  -o-object-fit: contain;*/
/*  object-fit: contain;*/
/*  padding: 5%;*/
/*}*/

/*@media screen and (min-width: 768px) {*/
/*  #overlay img {*/
/*    width: 60%;*/
/*  }*/
/*}*/

/*#nextButton i {*/
/*  color: #fff;*/
/*  font-size: 2em;*/
/*  transition: opacity 0.8s;*/
/*}*/

/*#nextButton:hover {*/
/*  opacity: 1;*/
/*}*/

/*#prevButton i {*/
/*  color: #fff;*/
/*  font-size: 2em;*/
/*  transition: opacity 0.8s;*/
/*}*/

/*#prevButton:hover {*/
/*  opacity: 0.7;*/
/*}*/

/*#exitButton i {*/
/*  color: #fff;*/
/*  font-size: 2em;*/
/*  transition: opacity 0.8s;*/
/*  position: absolute;*/
/*  top: 15px;*/
/*  right: 15px;*/
/*}*/

/*#exitButton:hover {*/
/*  opacity: 0.7;*/
/*}*/

/* footer */

footer .footertop {background-color: #f8f9fa; padding: 70px 0px 20px;}
footer .row {row-gap: 25px;}
footer .footertop h3{font-size: 20px; margin-bottom: 15px;}
footer .footertop .about img {width: 164px;}
footer .footertop .about p {color: #000; font-size: 14px; width:77%; margin-top: 20px;}
footer .footertop ul {list-style: none;}
footer .footertop ul li {color: #000; font-size: 14px; margin-top: 10px;}
footer .footertop ul li a {color: #000; font-size: 14px; transition: .5s; display: inline-block; border-bottom: 1px solid transparent;}
footer .footertop ul li a:hover {color: #aba56b;}
footer .footertop .addres li {margin-bottom: 20px;}
footer .footertop .addres li i {color: #aba56b; font-size: 22px;}
footer .footerboo ul {display: flex; justify-content: space-between; margin: 0; border-top: 1px solid #aba56b; padding-top: 20px;}
footer .footerboo {background-color: #f8f9fa; padding: 20px;}
footer .footerboo .soical li:first-child {color: #aba56b; text-align: center;}
footer .footerboo .soical li:first-child a {color: #fff; font-size: 16px; display: inline-block; width: 35px; height: 35px; line-height: 35px;
background-color: #aba56b; border-radius: 50%; transition: .5s;}
footer .footerboo .soical li:first-child a:hover {background-color: #000;}
footer .footerboo ul li img {width: 195px; background-color: #aba56b; padding: 0px 10px 8px; border-radius: 100px;}

/* quickcontact */
.quickcontact {
  width: 45px;
  position: fixed;
  top: 77%;
  right: 15px;
  z-index: 102;
}

/* modal */

.modal .modal-title {
  color: #aba56b;
}

.modal .close {
  color: #aba56b;
  font-size: 25px;
  background-color: transparent;
  border: none;
}

.modal .modal-header {
  border-color: #aba56b;
}

.modal form {
  row-gap: 20px;
}

.modal .modal-content {
  background-color: #fff;
  padding: 15px;
  border-radius: 30px;
}

.modal form .form-control,
.modal form .form-select {
  border: none;
  border-bottom: 1px solid #000000;
  background-color: #85232b00;
  border-radius: 0px;
  color: #000000;
}

.modal form .label {
  color: #000000;
  font-size: 16px;
  font-weight: 600;
  margin-bottom: 10px;
}

.modal form .form-control:focus,
.modal form .form-select:focus {
  box-shadow: none;
  border-color: #1f1a17;
}

.modal form .form-control::placeholder,
.modal form .form-select::placeholder {
  color: #000000;
}

.modal form .submit {
  background-color: #aba56b;
  color: #fff;
  width: 100%;
  font-weight: 500;
  padding: 10px;
  border: transparent;
}








  .popup-box{
        display: flex;
    }

  .form-box {
    background: #dcd0d2;
    padding: 30px 25px;
    text-align: center;
    width: 500px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
  }

  .form-box p {
    font-size: 14px;
    line-height: 30px;
    margin-bottom: 20px;
  }
  .form-box h2 {
    margin: 0;
    font-size: 18px;
    color: #795324;
    font-weight: 900 !important;
    margin-bottom: 20px;
    line-height: 30px;
  }
  
  .form-box h2 span{
      color:rgb(70 70 70) !important;
  }


  .phone-input {
    display: flex;
    align-items: center;
    border: 1px solid #ccc;
    border-radius: 8px;
    overflow: hidden;
    margin-bottom: 20px;
  }

  .country-code {
    background: #eee;
    padding: 10px 12px;
    font-size: 15px;
    border-right: 1px solid #ccc;
  }

  input[type="number"] {
    border: none;
    outline: none;
    padding: 10px;
    width: 100%;
    font-size: 16px;
  }

  .book-btn {
    color: white;
    border: none;
    padding: 12px 0;
    width: 100%;
    border-radius: 8px;
    font-size: 16px;
    cursor: pointer;
    animation: blink-bg 1s infinite alternate;
  }

  @keyframes blink-bg {
    0% { background-color: #000; }
    50% { background-color: #795324; }
    100% { background-color: #000; }
  }

  .social-icons {
    margin-top: 20px;
  }

  .social-icons a {
    text-decoration: none;
    color: #555;
    font-size: 22px;
    margin: 0 10px;
    transition: color 0.3s;
  }

  .social-icons a:hover {
    color: #007BFF;
  }
  
  
    select {
    border: none;
    outline: none;
    background: #eee;
    padding: 10px;
    font-size: 15px;
    border-right: 1px solid #ccc;
  }

/* ===========================
   Responsive Design
   =========================== */
    @media (max-width: 768px) {
    
      .popup-box {
        flex-direction: column;
        align-items: center;
        justify-content: center;
      }
    
      .form-box {
        width: 100%;
        padding: 20px;
        box-shadow: 0 3px 10px rgba(0,0,0,0.15);
      }
    
      .form-box h2 {
        font-size: 18px;
      }
    
      .form-box p {
        font-size: 13px;
        margin-bottom: 15px;
      }
    
      .phone-input {
        flex-direction: row;
      }
    
      select {
        font-size: 14px;
        padding: 8px;
        width: 30%;
      }
    
      input[type="number"] {
        font-size: 14px;
        padding: 8px;
      }
    
      .book-btn {
        font-size: 15px;
        padding: 10px 0;
      }
    
      .social-icons {
        margin-top: 15px;
      }
    
      .social-icons a {
        font-size: 20px;
        margin: 0 8px;
      }
    
      /* Optional: Adjust popup itself */
      .popup {
        width: 100%;
        height: 100%;
        overflow-y: auto;
        display: flex;
        align-items: center;
        justify-content: center;
      }
    
      .close-icon {
        top: 10px;
        right: 15px;
        font-size: 26px;
      }
    }
    
    @media (max-width: 480px) {
      .form-box h2 {
        font-size: 16px;
      }
    
      .form-box p {
        font-size: 12px;
      }
    
      select {
        width: 35%;
      }
    
      input[type="number"] {
        font-size: 13px;
      }
    
      .book-btn {
        font-size: 14px;
      }
    }



/* Overlay background */
.overlay {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  z-index: 999;
}

/* Styling for popups */
.popup {
  display: none;
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  padding: 20px;
  z-index: 1000;
  text-align: center;
  border-radius: 10px;
  width: 750px;
}

.popup img { width:500px;}
@media (max-width:991px) {
  .popup{
    width: 330px;
  }
}

.popup img {
  max-width: 100%;
  height: 100%;
}

/* Close icon */
.close-icon {
  position: absolute;
  top: 15px;
  right: 25px;
  font-size: 24px;
  font-weight: bolder;
  cursor: pointer;
  color: #000;
}

.close-icon:hover {
  color: #9c7440;
}

.precautions-for-hair-before-after .col-box{
  border: 1px solid #9c7440;
  padding: 20px;
  border-radius: 30px;
  height: 100%;
}

.cta-strap-content{
  background-color: #9c7440;
}

.cta-strap-content p{
  color: #fff;
}

.cta-strap-content button{
  background-color: #fff;
  padding: 10px;
  border-radius: 30px;
}

.cta-strap-content button a{
  color: #9c7440;
}

.best-advance-anti-ageing .col-box{
  border: 1px solid #9c7440;
  padding: 20px;
  height: 100%;
  border-radius: 30px;
}

