* {
  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: #282828; padding: 6px 0px;}
header .header-top .top-info li, header .header-top .top-info li a {color: #fff; font-size: 14px;}

header .header-med{background-color: #000;}
header .header-med .imgs{width: 13%;}
header .header-med .nav-info .nav-info-class{gap: 60px;}
header .header-med .nav-info a{color: #fff; font-size: 13px; border-bottom: 1px solid #fff;}
header .header-med .enquiry {display: inline-block; padding: 10px 20px; background-color: transparent; color: #bd8326; border-radius: 3px;
transition: .5s; border: 1px solid #bd8326; position: relative; transition: .5s; z-index: 1;}
header .header-med .enquiry::before {position: absolute; content: ''; top: 0px; left: 0px; width: 0px; height: 100%; transition: .5s;
background-color: #bd8326; z-index: -1;}
header .header-med .enquiry:hover:before {width: 100%;}
header .header-med .enquiry:hover {color: #ffffff;}

header .headermn{padding: 10px 30px; background-color: #bd8326;}
header .headermn .navbar .navbar-brand {width: 13%; display: none;}
header .nav-link {color: #ffffff; font-size: 13px; font-weight: 500; transition: .5s; position: relative; padding: 0px 0px !important; text-transform: uppercase;}
header .nav-link::after {content: ''; background-color: #fff; 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: #fff;}
header .navbar-toggler {border: none; color: #bd8326; 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; gap: 35px;}

header  .drop-down{
  
}
header  .drop-down li a{
  color: #000 !important;
  font-size: 18px;
}
header  .drop-down li a:hover{
  background-color: #bd8326;
  color: #fff !important;
}

header .navbar-expand-lg .navbar-nav .dropdown-menu.start-atuo {
  left: auto;
}

.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 .navbar .whatsapp li a {display: inline-block; padding: 10px 20px; background-color: transparent; color: #e56215; border-radius: 3px;
transition: .5s; border: 1px solid #e56215; 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: #e56215; z-index: -1;}
header .navbar .whatsapp li a:hover:before {width: 100%;}
header .navbar .whatsapp li a:hover {color: #ffffff;} */



/* slider */

#slider .owl-item {
  background-position: bottom right;
  background-repeat: no-repeat;
  background-size: cover;
  padding: 274px 0;
}

#slider .owl-theme .owl-dots .owl-dot {
  display: none;
}


/* about */

#about {margin-top: -10px; padding: 10px 0px 0px; background-image: url(../images/bg-about.webp); background-position: center; background-repeat: no-repeat; background-size: cover;}
#about .row {row-gap: 30px; align-items: center;}
#about .content{padding: 50px 0px;}
#about ul li {margin-bottom: 8px; font-size: 15px;}
#about .content h2 {font-family: 'Roboto Slab', serif; color: #bd8326; font-size: 35px; margin-bottom: 10px; font-weight: bold;}
#about .content h5{font-size: 22px; font-weight: 600;}
#about .content ul{margin-left: 20px;}
#about .content h4{font-size: 18px; margin-bottom: 10px;}
#about .imgs {overflow: hidden; border-radius: 5px; text-align: end;}
#about .imgs img {transition: 9s;}
#about .imgs:hover img {transform: scale(1.2);}

#about-content{padding: 60px 0px;}
#about-content .iner h2{font-size: 35px; font-weight: 600; margin-bottom: 15px;}
#about-content .iner .text{font-size: 15px;}

/* our-treatments */

#our-treatments{padding: 60px 0px;}
#our-treatments .row{row-gap: 7px;}
#our-treatments h2{font-size: 36px; text-align: center; font-weight: 600; position: relative; margin-bottom: 60px;}
#our-treatments h2::before{position: absolute; content: ''; z-index: 1; height: 3px; width: 53px; top: 57px; margin: auto; text-align: center; left: 0px; right: 0px; background-color: #bd8326;}
#our-treatments .iner{position: relative; z-index: 1;}
#our-treatments .iner::before{position: absolute; left: 0; right: 0; top: 0; bottom: 0; content: ''; background-color: #bd83266e; z-index:1; display: none; transition: .5s;}
#our-treatments .iner:hover::before{display: block;}
#our-treatments .iner .content h3{font-size: 26px; text-transform: uppercase; color: #fff;}
#our-treatments .iner .content .text{color: #fff; visibility: hidden; transition: .5s;}
#our-treatments .iner:hover .content .text, #our-treatments .iner:hover a{visibility: visible;}
#our-treatments a {display: inline-block; padding: 10px 20px; background-color: transparent; color: #fff; border-radius: 3px; margin-top: 15px; text-transform: uppercase; transition: .5s; border: 1px solid #fff; position: relative; transition: .5s; z-index: 1; visibility: hidden;}
#our-treatments a::before {position: absolute; content: ''; top: 0px; left: 0px; width: 0px; height: 100%; transition: .5s;
background-color: #fff; z-index: -1;}
#our-treatments a:hover:before {width: 100%;}
#our-treatments a:hover {color: #bd8326;} 
#our-treatments .iner .content{position: absolute; bottom: 23%; text-align: center; left: 0; right: 0; z-index: 2; transition: .5s;}
#our-treatments .iner:hover .content{bottom: 26%;}

/* counter  */

#counter{background-image: url(../images/bg.jpg); background-position: center center; background-repeat: no-repeat; background-size: cover; background-attachment: fixed; padding: 80px 0; position: relative; z-index: 1;}
#counter::before{position: absolute; content: ''; left: 0; right: 0; top: 0; bottom: 0; background-color: #00000096; z-index: -1;}
#counter .row{row-gap: 30px;}
#counter .item{text-align: center;} 
#counter .item h2{ color: #fff; margin: 20px 0px; font-size: 25px;}
#counter .item h3{ font-size: 16px; color: #fff;}
#counter .item i{ font-size: 24px; color: #fff;}


/* gallery */

#gallery {
  background-color: #ffffff;
  padding: 0px 0 50px;
  overflow: hidden;
}

#gallery .row{row-gap: 20px;}

#gallery h2{font-size: 36px; text-align: center; font-weight: 600; position: relative; margin-bottom: 65px;}
#gallery h2::before{position: absolute; content: ''; z-index: 1; height: 3px; width: 53px; top: 57px; margin: auto; text-align: center; left: 0px; right: 0px; background-color: #bd8326;}

#gallery .img-wrapper {
  position: relative;
  margin-top: 15px;
  overflow: hidden;
  box-shadow: 0 0 8px #00000033;
}

#gallery .img-wrapper img {
  width: 100%;
  height: 300px;
  object-fit: cover;
}

#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;
}

.gallery-ses{padding: 60px 0px !important;}
#gallery .video video{width: 100%;}
#gallery .nav{justify-content: center; gap: 20px; margin-bottom: 35px !important;}
#gallery .nav .nav-item .nav-link{color: #000000;}
#gallery .nav-pills .nav-link:hover{background-color:#bd8326; color: #fff;}
#gallery .nav-pills .nav-link.active{background-color: #bd8326; color:#fff; }

.nav-pills .nav-link.active,
.nav-tabs .nav-link.active {
    background-color: #bd8326 !important;
    color: white !important;
}


/* video-sec */

#video-sec{padding: 60px 0px; background-color: #eeebeb;}
#video-sec h2{font-size: 36px; text-align: center; font-weight: 600; position: relative; margin-bottom: 65px;}
#video-sec h2::before{position: absolute; content: ''; z-index: 1; height: 3px; width: 53px; top: 57px; margin: auto; text-align: center; left: 0px; right: 0px; background-color: #bd8326;}

/* chouse */

#chouse{padding: 50px 0px 50px;}
#chouse h2{font-size: 36px; text-align: center; font-weight: 600; position: relative;}
#chouse h2::before{position: absolute; content: ''; z-index: 1; height: 3px; width: 53px; top: 57px; margin: auto; text-align: center; left: 0px; right: 0px; background-color: #bd8326;}
#chouse .inr{background-color: #fff; padding: 10px; box-shadow: 0 0 5px rgba(0, 0, 0, .15); margin-top: 50px; height: 100%;}
#chouse .inr .imgsc{text-align: center; width: 81px; height: 81px; background-image: linear-gradient(to right, #bd8326 0, #ad6f0a 100%); line-height: 77px; border-radius: 50%; color: #fff; margin: auto; box-shadow: 0 8px 10px 0 rgba(0, 0, 0, .08);}
#chouse .inr .imgsc img{width: 40px;}
#chouse .inr h5{text-align: center; font-size: 20px; color: #bd8326; margin: 25px 0px;}
#chouse .inr .text{font-size: 16px; line-height: 27px; text-align: justify; color: #787878; font-weight: 400;}

/* testimonial */

#testimonial{padding: 50px 0 60px;}
#testimonial h2{color: #bd8326;}
#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: #bd8326; 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: #bd8326;}

/* footer */

footer .footertop {background-color: #000000; padding: 70px 0px 20px;}
footer .row {row-gap: 25px;}
footer .footertop h3{font-size: 20px; margin-bottom: 15px; color: #bd8326;}
footer .footertop .about img {width: 111px;}
footer .footertop .about p {color: #fff; font-size: 14px; width:77%; margin-top: 20px;}
footer .footertop ul {list-style: none;}
footer .footertop ul li {color: #fff; font-size: 14px; margin-top: 10px;}
footer .footertop ul li a {color: #fff; font-size: 14px; transition: .5s; display: inline-block; border-bottom: 1px solid transparent;}
footer .footertop ul li a:hover {color: #bd8326;}
footer .footertop .addres li {margin-bottom: 20px;}
footer .footertop .addres li i {color: #bd8326; font-size: 22px;}
footer .footerboo ul {display: flex; justify-content: space-between; margin: 0; border-top: 1px solid #bd8326; padding-top: 20px;}
footer .footerboo {background-color: #000000; padding: 20px;}
footer .footerboo .soical li:first-child {color: #bd8326; 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: #bd8326; border-radius: 50%; transition: .5s;}
footer .footerboo .soical li:first-child a:hover {background-color: #fff; color: #bd8326;}
footer .footerboo ul li img {width: 195px; background-color: #bd8326; padding: 0px 10px 8px; border-radius: 100px;}

/* quickcontact */
.quickcontact {
  width: 45px;
  position: fixed;
  top: 77%;
  right: 15px;
  z-index: 102;
}



/* modal */

.modal form.row {
  row-gap: 20px;
}

.modal .btn-theme {
  border-radius: 0px;
  background: #e56215;
  color: #fff;
}

.modal .btn-theme:hover {
  background-color: #000;
  color: white;
}

.modal .form-control {
  border-radius: 0px;
  border: none;
  box-shadow: none;
  background-color: #f1f1f1;
}

.modal .form-control:focus {
  border-color: #000;
}

.modal .submit {
  background-color: #e56215;
  color: #fff;
  font-weight: 500px;
  padding: 10px;
  border: 0;
  transition: .5;
}

.modal .submit:hover {
  background-color: #000;
}

/* about-sec */

#about-sec{padding: 60px 0px; background-color: #e7e7e7;}
#about-sec .contanet{text-align: center;}
#about-sec .contanet h2{font-size: 35px; font-weight: 600;}
#about-sec .contanet p, #about-sec .contanet p a{color: #000; transition: .5s;}
#about-sec .contanet p a:hover{color: #bd8326;}

/* contact */

/* contact */

#contact {padding: 50px 0px;}
#contact .iner {text-align: center; width: 100%; height: 100%; text-align: center; border: 2px solid #bd8326; padding: 25px; position: relative;
overflow: hidden; z-index: 1;}
#contact .iner::before {content: ""; position: absolute; background: #bd8326; height: 100%; width: 100%; left: 0; top: 0; z-index: -1;
transform: rotateZ(180deg); transform-origin: center top; transition: all 0.3s;}
#contact .iner:hover:before {transform: rotateZ(0deg);}
#contact .iner h5 {color: #bd8326; font-size: 30px; transition: .5s;}
#contact .iner h6, #contact .iner h6 a {color: #000; transition: .5s; font-size: 14px;}
#contact .iner:hover h5,
#contact .iner:hover h6,
#contact .iner:hover h6 a,
#contact .iner:hover h4 {color: #fff;}
#contact-from {background-color: #bd8326; overflow: hidden;}
#contact-from h3 {color: #fff;}
#contact-from .content {padding: 51px 25px 50px 25px;}
#contact-from .inr {row-gap: 30px;}
#contact-from .map{margin-bottom: -7px;}
#contact-from .form-control {border-radius: 0px; box-shadow: none; padding: 9px 20px;}
#contact-from .btn {padding: 10px 60px; border: 2px solid #fff; background-color: #fff; border-radius: 2px; color: #000; transition: .5s;}
#contact-from .btn:hover {background-color: transparent; color: #fff;}

/* blog */

#blog-page{padding: 70px 0;}
#blog-page .row{row-gap: 30px;}
#blog-page .inner{box-shadow: 0 0 10px #00000033; height: 100%;}
#blog-page .text{padding: 20px;}
#blog-page .text h5 a{color: #000; }
#blog-page .text span{color: #6d6d6d; display: inline-block; margin: 7px 0; font-size: 15px;}
#blog-page .text span i{color: #bd8326;}
#blog-page .text p{color: #6d6d6d; font-size: 16px;}
#blog-page .text .read{color: #bd8326; font-weight: 500; font-size: 16px; display: inline-block; margin-top: 20px; transition: .5s;}
#blog-page .text .read:hover{color: #000;}

/* blog-det */

#blog-det{padding: 40px 0px;}
#blog-det h5{margin: 15px 0px; font-size: 22px;}
#blog-det .imgs img{width: 100%;}
#blog-det .recent li:first-child{width: 20%;}
#blog-det .image-info li i{color: #bd8326;}
#blog-det .image-info li a{color: #5c5c5c; font-size: 14px;}
#blog-det .text{margin-top: 15px; font-size: 15px; text-align: justify;}
#blog-det .iner-a{position: sticky; top: 20px;}
#blog-det .iner-a h4{font-size: 20px; margin-bottom: 30px; position: relative;}
#blog-det .iner-a h4::before{position: absolute; content: ''; width: 40px; height: 3px; background-color: #bd8326; z-index: 1; top: 30px;}
#blog-det .iner-a .recent{margin-bottom: 20px;}
#blog-det .iner-a .recent li h6 {margin-bottom: 3px;}
#blog-det .iner-a .recent li h6 a{color: #000; font-size: 15px;}
#blog-det .iner-a .recent .text-a{font-size: 15px;}

/* service-det */

#service-det{padding: 50px 0px;}
#service-det .row{row-gap: 30px;}
#service-det h2{font-family: 35px; font-weight: 600;}
#service-det .text{margin: 10px 0px; font-size: 15px; text-align: justify;}

#gynecomastiat-transplant{padding: 50px 0px 0px; background-color: #ecf0f1; position: relative; overflow: hidden;}
#gynecomastiat-transplant h2{text-align: center; font-size: 35px; margin-bottom: 40px;}
#gynecomastiat-transplant .imgsc{overflow: hidden; border-radius: 10px; margin-bottom: 50px; position: relative; z-index: 2;}
#gynecomastiat-transplant .imgsc img{transition: .5s;}
#gynecomastiat-transplant .imgsc:hover img{transform: scale(1.1);}
#gynecomastiat-transplant .iner{padding: 25px; background-color:#000000de;}
#gynecomastiat-transplant .iner h3{color: #FFFFFF; font-family: "Roboto", Sans-serif; font-size: 18px; font-weight: 700;
text-transform: capitalize; text-align: center;}
#gynecomastiat-transplant .iner .text-a{color: #FFFFFF; font-family: "Roboto", Sans-serif; font-size: 16px; font-weight: 400;
text-transform: capitalize; line-height: 1.4em; text-align: center; margin-bottom: 3px;}
#gynecomastiat-transplant .iner form .form-label{color: #fff;}
#gynecomastiat-transplant .iner form .form-control{padding: 9px; border-radius: 0px; box-shadow: none; margin-bottom: 15px;}
#gynecomastiat-transplant .iner form .btn{padding: 9px 0px; width: 100%; background-color: #bd8326; color: #ffffff;}


/* career */
#career-page{ margin-top: -40px; padding-bottom: 70px;}
#career-page .career-mn{background-color: #ffffff; padding: 40px; position: relative; box-shadow: 0 0 15px rgba(0, 0, 0, 0.1); border-radius: 10px; z-index: 2; background-image: url(../images/contact-img.png); background-size: cover; background-position: center center;}
#career-page h2{text-align: center; color: #bd8326; font-weight: bold;}
#career-page p{text-align: center; color: grey; font-size: 17px; margin: 20px 0;} 
#career-page .form-control{background-color: transparent; border-radius: 0; padding: 8px; }
#career-page .form-control:focus{box-shadow: 0 0 5px 1px #3e0a3d;}
#career-page .submit{background-color: #bd8326; color: #fff; padding: 10px; border: none; transition: .5s;}
#career-page .submit:hover{background-color: #000;}