/* Colors */
/* Functions */
@import url('https://fonts.googleapis.com/css2?family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');
body {
  line-height: 1.2;
  --gutter-x: 18px;
  --gutter-x2: -18px;
  overflow-x: clip;
  font-family: 'Roboto', sans-serif;
}
:root{
  --first-font: "Poppins", sans-serif;
}
.containers{
  max-width: 1520px;
  margin: 0 auto;
}
header{
  width: 100%;
  height: auto;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 9999;
}

header .web-lang {
  cursor: pointer;
  z-index: 9;
  margin-bottom:0;
}
header .web-lang > li {
  background:linear-gradient(73deg, #7cdbff 0%, #545454 98%, #5abcd9 100%);
  padding: 13px;
  font-weight: bold;
  color: #010101;
  display: flex;
  align-items: center;
  position: relative;
  -webkit-border-radius: 16px;
  -moz-border-radius: 16px;
  -ms-border-radius: 16px;
  border-radius: 20%;
}
header .web-lang > li svg {
  width: 24px;
  height: 24px;
}
header .web-lang > li:after {
  content: ' ';
  border: 5px solid;
  transform: translateY(50%);
  border-color: #010101 transparent transparent transparent;
  margin-left: 5px;
}
header .web-lang > li:hover > ul.sub-menu {
  z-index: 15;
  opacity: 1;
  top: 100%;
  pointer-events: initial;
}
header .web-lang li ul.sub-menu {
  display: initial;
  opacity: 0;
  position: absolute;
  z-index: 9;
  top: 80%;
  margin-top: 10px;
  left: 50%;
  transform: translateX(-50%);
  pointer-events: none;
  -moz-transition: all 0.2s;
  -webkit-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s;
}
header .web-lang li ul.sub-menu::after {
  content: '';
  width: 100%;
  height: 20px;
  position: absolute;
  top: -20px;
  background: None;
  left: 0;
  z-index: 0;
}
header .web-lang li ul.sub-menu:before {
  content: ' ';
  position: absolute;
  left: 50%;
  top: 0;
  transform: translate(-50%, -100%);
  border: 10px solid;
  border-color: transparent transparent #E8BF78 transparent;
}
header .web-lang li ul.sub-menu li {
  padding: 0;
  margin: 0;
  -moz-transition: all 0.2s;
  -webkit-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s;
  background-color: #010101;
  border:1px solid #bfb299;
  text-decoration:none;
}
header .web-lang li ul.sub-menu li:last-child {
  border-bottom: 0;
}
header .web-lang li ul.sub-menu li:hover {
  background-color: #1b1b1b;
}
header .web-lang li ul.sub-menu li a {
  white-space: nowrap;
  font-size: 16px;
  font-weight: 600;
  color: #fff;
  margin: 0;
  padding: 10px 20px 10px 15px;
  display: block;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  border-radius: 0;
}
header .web-lang li ul.sub-menu li a img {
  margin-right: 10px;
  width: 20px;
  height: 20px;
}

.logo img {
    width: 300px;
}

.video-fan{
    position: relative;
    display: flex !important;
    justify-content: center;
    align-items: center;
}

.video-imgs{
    border-radius:25px;
}

.play-icon{
position: absolute;
    width: 64px;
    height: auto;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    -moz-transition: all 0.2s;
    -webkit-transition: all 0.2s;
    -o-transition: all 0.2s;
    transition: all 0.2s;
}

.actives{
  padding:15px!important;
  background: linear-gradient(75deg, #052033, #031224,#010415);
}

.nav-menu{
  max-width: 100%;
  height: auto;
  display: flex;
  justify-content: center;
  padding: 20px 0;
}

.main-menu {
  width: 1520px;
  height: auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 0 20px;
}


#mobile-footer-cta-buttons {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 999;
}

#mobile-footer-cta-buttons .row {
  --gutter-x: 4px;
  --gutter-x2: -4px;
}
#mobile-footer-cta-buttons .button-x {
  height: 52px;
  width: 100%;
  padding: 0 20px;
  color: #fff;
}
#mobile-footer-cta-buttons .button-x.button-call {
  /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#f4f7fc+0,dfdfdf+100 */
  background: #218AA5;
  /* Old browsers */
  background: -moz-linear-gradient(top, #218AA5 0%, #1a778f 100%);
  /* FF3.6-15 */
  background: -webkit-linear-gradient(top, #218AA5 0%, #1a778f 100%);
  /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to bottom, #218AA5 0%, #1a778f 100%);
  /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='@first', endColorstr='@sec', GradientType=0);
  text-decoration: none;
  /* IE6-9 */
}
#mobile-footer-cta-buttons .button-x.button-whatsapp {
  background:linear-gradient(to bottom, #58D164 0%, #2CB842 100%);
  /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='@first', endColorstr='@sec', GradientType=0);
  text-decoration: none;
  /* IE6-9 */
}
.button-cta i {
  font-size: 30px;
}
#mobile-footer-cta-buttons .button-x svg {
  color: #fff;
}
#mobile-footer-cta-buttons .button-x span.text {
  margin-left: 12px;
  font-weight: 400;
  font-size: 20px;
  font-family: var(--first-font);
}

.hero-banner{
  width: 100%;
  height: auto;
  position: relative;
  z-index: 800;
  margin-top: -34px;
  overflow-x: clip;
}

a.cta-btn {
  text-decoration: none;
  font-family: var(--first-font);
  color: #fff;
  font-size: 18px;
  padding: 10px;
  border: 2px solid #5abcd9;
  border-radius: 10px;
  background: linear-gradient(75deg, #052033, #031224,#010415);
  text-align: center;
}

.hero-section{
  padding-top: 208px;
  padding-bottom: 6px;
}

.hero-image{
  display: flex;

  img {
    max-width: 100%;
  }
}

.hero-form{
  display: flex;
  justify-content: end;
  align-items: center;
  margin-bottom: 50px;
}

.formsHero {
  padding: 0;
}
.formContainer{
  background: transparent;
  border: 2px solid #5abcd9;
  border-radius: 25px;
}
.formTitle {
  background: #5ABCD9;
  /* border-radius: 20px; */
  padding: 8px 0;
  border-top-left-radius: 20px;
  border-top-right-radius: 20px;

  h2{
    font-size: 32px;
    text-align: center;
    color: #010415;
    font-family: var(--first-font);
    margin:0;
  }
}

form#consultation-form {
  display: flex;
  flex-direction: column;
  padding: 20px;
  gap: 20px;

  input {
    padding: 20px;
    color: rgb(255, 255, 255);
    background: transparent;
    border: 2px solid #fff;
    border-radius: 15px;
    font-family: var(--first-font);
    font-weight: 600;
  }
  input::placeholder{
    color: #fff;
    font-family: var(--first-font);
    font-weight: 600;
  }
}

input#phone {
  width: 100%;
  padding: 20px 50px !important;
}
.radioAndText{
  width: 100%;
}

.radios{
  display: flex;
  align-items: center;
  margin-top: 20px;

  label{
    font-family: var(--first-font);
    font-size: 15px;
    color: #fff;
    padding-left: 20px;
  }
}
#privacy_policy,#patient_consent{
  padding:0px;
}
button.hero-btn {
  padding: 15px;
  background: linear-gradient(75deg, #052033, #031224, #010415);
  border: 2px solid #5ABCD9;
  border-radius: 10px;
  color: #fff;
  font-family: var(--first-font);
  font-weight: 600;
}

button.hero-btn:hover {
  background: #010415;
  transition: all 2s cubic-bezier(0, 0.64, 0.58, 1);
}

#owl-brands{
  width: 100%;
  height: auto;
  background-color: #010415;
  padding: 50px 0;
}
.imagesbrands img {
  /* width: 180px; */
  height: 80px;
  object-fit: contain;
}

.price-table {
  margin: 73px 0;
  padding: 30px 0;
  border: 1px solid #5abcd9;
  border-radius: 30px;
}


.table-price-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 30px;
}

.dhi-price {
  border-right: 3px solid #5abcd9;
}

.dhi-price h3 {
  font-family: var(--first-font);
  color: #fff;
  font-size: 18px;
  text-align: center;
}

.dhi-price p {
  text-align: center;
  color: #fff;
  font-family: var(--first-font);
  font-size: 26px;
}

.dhi-price2 h3 {
  font-family: var(--first-font);
  color: #fff;
  font-size: 18px;
  text-align: center;
}

.dhi-price2 p {
  text-align: center;
  color: #fff;
  font-family: var(--first-font);
  font-size: 26px;
}




.transplant-about{
  background-color: #010415;
  height: auto;
  padding: 50px 0;

  .trans-section{
    display: grid;
    grid-template-columns: repeat(3,1fr);
    justify-items: center;
    gap: 60px;

    .trans {
      position: relative;
      display: inline-block;
    
      img {
        width: 100%;
        height: 225px;
        object-fit: contain;
        border-radius: 30px;
        filter: brightness(0.5);
        &:hover {
          backdrop-filter: blur(2px);
        }
      }
    
      .trans-text {
        position: absolute;
        left: 0;
        bottom: 0;
        width: 100%;
        height: 100%;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        border-radius: 30px;
        background: linear-gradient(45deg, black, transparent);
        color: #fff;
        transition: opacity 0.3s ease;
        padding: 10px;
    
        .trans-title {
          margin: 0;
          font-family: var(--first-font);
          font-size: 22px;
          margin-bottom: 10px;
          text-align:center;
        }
        .trans-desc{
          font-family: var(--first-font);
          font-size: 16px;
          text-align: center;
        }
      }
    
      &:hover {
        .trans-text {
          opacity: 1;
        }

      }
    }
    
  }
}

.trans:hover .trans-text {
  opacity: 1; /* Hover olduğunda overlay'i görünür yap */
}

.sapphire-about{
  background: linear-gradient(262deg, #010415, #052033);
  height: auto;
  padding: 50px 0;
}

.sapphire-text{
  h2{
    font-size: 32px;
    color: #fff;
    font-family: var(--first-font);
    margin-bottom: 20px;
  }
  p{
    font-size: 20px;
    color: #fff;
    font-family: var(--first-font);
  }
}

.ba-img{
  border-radius: 25px;
}

#home-our-clinic{
  background-color: #010415;
  padding: 70px 0;
}

#home-our-clinic img {
  max-width: 100%;
  border: 4px solid #395caf85;
  border-radius:15px;
}

.clinic-title{
  text-align: center;
  color: #fff;
  font-size: clamp(24.5px, 3vw, 32px);
  margin-bottom: 10px;
  text-transform: uppercase;
  font-family: 'Poppins';
}

.clinic-row{
  margin-top:35px;
}

.our-mb{
  margin-bottom:15px;
}
img.big-clinic {
  height: 400px;
}


.transplant-step{
  background-color: #010415;
  height: auto;
  padding: 75px 0;

  h2{
    font-family: var(--first-font);
    color: #fff;
    text-align: center;
    font-size: 32px;
  }
  .trans-step-desk{
    display: flex;
    justify-content: center;
    margin-top: 50px;
    img{
      max-width: 100%;
      object-fit: contain;
    }
  }
.trans-step-mobile{
  display: none;
}
}

.transplant-kind{
  background-color: #010415;
  height: auto;
  padding: 75px 0;

  .kind-transplant{
    display: grid;
    grid-template-columns: repeat(5,1fr);
    justify-items: center;
    gap: 55px;

    .transText {
      background: linear-gradient(262deg, #010415, #052033);
      margin-top: 30px;
      display: flex;
      justify-content: center;
      align-items: center;
      padding: 20px;
      border-radius: 25px;


      h3{
        font-size: 17px;
        color: #fff;
        font-family: var(--first-font);
        text-align: center;
      }
    }
  }
}

.imgandTransText img {
  max-width: 100%;
}


.female-transplant{
  background-color: #010415;
  height: auto;
  padding: 75px 0;
  overflow-x: clip;
 
}
.female-transplant img{
  border-radius: 40px;
  border: 2px solid #5ABCD9;
}
.female-transplant .owl-stage-outer{
  overflow: visible;
}
.female-transplant .owl-item{
  opacity: 0;
  transition: all 0.3;
}
.female-transplant .owl-item.active{
  opacity: 1;
}

.firstactiveitem{
  transform: scale(1.05) !important;
  transition: transform 3s ease;
}
.lastactiveitem{
  transform: scale(0.9) !important;
  transition: 1s;
}
.transSectionBox{
  position: relative;
}
.transSectionBox img{
    max-width: 100%;
    height: 500px;
    object-fit: cover;
}
.transSectionBox .box-front {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  top: 0;
  display: flex;
  justify-content: center;
  align-items: end;
  padding: 20px;
  text-align: center;
}

.box-trans-text{
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items:end;
  border-radius: 30px;
  color: #fff;
  opacity: 1;
  transition: opacity 0.3s ease;
  padding: 10px;
  z-index: 1000;
}

.transSectionBox .box-trans-text .box-front{
  position: absolute;
  left: 0;
  bottom: 0;
  top: 59%;
  width: 100%;
  height: 40%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  border-radius: 30px;
  background: linear-gradient(45deg, black, transparent);
  color: #fff;
  opacity: 1;
  transition: opacity 0.3s ease;
  padding: 10px;
  z-index: 1000;
}

.transSectionBox .box-trans-text .box-front .box-title h2{
  color: #010415;
  font-size: 24px;
  font-weight: 600;
  font-family: var(--first-font);
}

.box-desc {
  font-family: var(--first-font);
  padding: 20px;
  font-size: 16px;
}

.accordion-images img {
    max-width: 100%;
}

#our-doctors{
    background-color:#010415;
    padding:35px 0;
}

#our-doctors-carousel{
    padding:35px 0;
    background-color:#010415;
}


#our-doctors-carousel .owl-dots .owl-dot.active span {
    background-color: #fff;
    width: 36px
}

#our-doctors-carousel .owl-dots .owl-dot span {
    background-color: #fff;
    width: 12px;
    height: 12px;
    -moz-transition: all .2s;
    -webkit-transition: all .2s;
    -o-transition: all .2s;
    transition: all .2s
}

.our-title{
  font-size: 32px;
  color: #fff;
  font-family: var(--first-font);
  text-align:center;
}

.doctors-box-content{
    margin-top:40px;
}

.doctor-box {
    position: relative;
    margin-bottom: 30px;
}

.doctor-image {
  width: 100%;
  height: 544px;
  border-radius: 25px;
  filter: brightness(0.8);
  object-fit: cover;
}
.doctor-box-text{
position: absolute;
    /* left: 50%; */
    bottom: 0px;
    padding: 20px;
    width: 100%;
}
.doctor-box-text h3{
    font-size:20px;
    color:#fff;
}

.doctor-box-text p{
    font-size:16px;
    color:#fff;
}


.transFaq{
  background-color: #010415;
  height: auto;
  padding: 75px 0;

  .accordions{

    .accordion-faqs{
      h2{
        font-size: 25px;
        color: #031224;
        font-family: var(--first-font);
        text-align: center;
        font-weight: bold;
      }
      .accords{
        padding: 20px;
        border-radius: 20px;
        border: 2px solid #010415;
        margin-top: 30px;
        h3{
            cursor: pointer;
            font-size: 17px;
            color: #031224;
            font-family: var(--first-font);
            font-weight: bold;
        }
        .accordion-desc{
          display: none;

          p{
            font-size: 16px;
              color: #031224;
              font-family: var(--first-font);
          }
        }
      }
    }

    .accordion-images{
      margin-left: auto;
    }
  }
}

.gorunuraccord{
  display: block!important;
  margin-top: 20px;
  padding: 0;
}


section#transplant-answers {
  background-color: #010415;
  padding: 75px 0!important;
  overflow-x: clip;
  h2{
    font-size: 24px;
    color: #fff;
    font-family: var(--first-font);
    text-align: center;
    margin-bottom: 73px;
  }
  .answers-carousel{

    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin-top: 50px;
      .answers-box {
        padding: 20px;
        border: 1px solid #5abcd9;
        border-radius: 20px;
        background: linear-gradient(262deg, #010415, #052033);
        
        .answers-textBox{
          margin-top: 20px;
          h3{
            font-size: 32px;
            color: #fff;
            font-family: var(--first-font);
            text-align: center;
            font-weight: 900;
          }
          p{
            font-size: 16px;
            color: #fff;
            font-family: var(--first-font);
            text-align: center;
            font-weight: 400;
          }
      }
    }
  }
}


.transplant-packages{
  padding: 75px 0;
  background: linear-gradient(262deg, #010415, #052033);
  h2{
    font-size: 24px;
    color: #fff;
    font-family: var(--first-font);
    text-align: center;
  }
  .packagesHair{
    display: grid;
    grid-template-columns: repeat(2,1fr);
    margin-top: 50px;
    gap: 25px;

    .packages-item{
      background-color: #010415;
    display: flex;
    align-items: center;
    padding: 0 70px;

      img{
        max-width: 100%;
      }
      p{
        font-size: 22px;        
        color: #fff;
        font-family: var(--first-font);
        margin-left: 20px;
        margin-bottom: 0;
      }
    }
  }
}



#transplant-answers .owl-stage-outer{
  overflow: visible!important;
}
#transplant-answers .owl-item{
  opacity: 0;
  transition: all 0.3;
}
#transplant-answers .owl-item.active{
  opacity: 1;
  transform 3s ease, opacity 3s ease;
}

.testimonials-transplant {
  padding: 75px 0;
  background-color: #010415;
  overflow-x: clip;
}

.testimonials-transplant h2 {
  font-size: 24px;
  color: #fff;
  font-family: var(--first-font);
  text-align: center;
}

.testimonials-transplant .testimonials-carousel {
margin-top: 50px;
}
.testimonials-transplant .testimonials-box {
  padding: 40px;
  background: transparent;
  border: 3px solid #5abcd9;
  border-radius: 40px;
}

.testimonials-transplant .testimonials-textBox {
  margin-bottom: 20px;
  border-bottom: 1px solid #5abcd9;
}

.testimonials-transplant .testimonials-text {
  font-size: 16px;
  color: #fff;
  text-align: center;
  font-family: var(--first-font);
}

.testimonials-transplant .testimonial-flexs {
  display: flex;
  align-items: center;
  justify-content: center;
}

.testimonials-transplant .patient-name {
  font-size: 12px;
  color: #fff;
  font-family: var(--first-font);
  margin: 0;
}

.testimonials-transplant .patient-process {
  color: #42768c;
  font-size: 12px;
  font-family: var(--first-font);
}

.testimonialfirstitem, .testimonialLastitem {

  transition: transform 3s ease, opacity 3s ease; /* Örnek olarak 3 saniyelik bir süre */
}

.testimonialfirstitem{
  transform: scale(1.2)!important;
}

.testimonialLastitem{
  transform: scale(0.9)!important;
}


.testimonials-transplant .owl-stage-outer{
  overflow: visible;
}
.testimonials-transplant .owl-item{
  opacity: 0;
  transition: all 0.3;
}
.testimonials-transplant .owl-item.active{
  opacity: 1;
  transition: transform 3s ease, opacity 3s ease;
}


.sapphire-footer{
  padding: 75px 0;
  background-color: #010415;
}

.footerText p{
  font-size: 16px;
  color: #fff;
  font-family: var(--first-font);
  margin-top: 20px;
}
.foText {
  display: flex;
  flex-direction: column;
  border-right: 1px solid #fff;
  align-items: center;
}
.foText p{
  font-size: 16px;
  color: #fff;
  font-family: var(--first-font);
}
.foİcon {
  display: flex;
  flex-direction: column;
  margin-left: 20px;
}

.foİcon p{
  font-size: 16px;
  color: #fff;
  font-family: var(--first-font);
  margin: 0;
}

.icontext {
  margin-bottom: 20px;
}
.icon {
  margin-right: 20px;
}
.icon i {
  color: #fff;
  font-size: 20px;
}

a.foLink {
  text-decoration: none;
  color: #fff;
  /* font-weight: 600; */
  font-family: var(--first-font);
  margin-bottom: 20px;
}
a.texticon{
  text-decoration: none;
  color: #fff;
  /* font-weight: 600; */
  font-family: var(--first-font);
}
a.texticon:hover{
  color: #5abcd9;
  transition: 0.3s;
}
a.foLink:hover {
  color: #5abcd9;
  transition: 0.3s;
}

.footerLlogo img {
  max-width: 100%;
}

.footerBigLogo img {
  width: 100%;
  height: 300px;
  object-fit: scale-down;
}

.footer-alt {
    padding: 15px 0;
    background-color: #010415;
}
.footersals {
    margin: 0 auto;
}
.copy-right p {
    font-family:var(--first-font);
    color: #fff;
    margin-top: 15px;
}
img.crabs-logo {
    width: 200px;
    object-fit:contain
}


.cta {
    width: 100%;
    background-color: #010415;
    padding: 50px 0;
    font-family: 'Poppins';
}

.cta-inner {
    max-width: 1440px;
    border-radius: 10px;
    background: linear-gradient(#030f21, #000);
    border: .4px solid #395caf85;
    margin: 0 auto;
    width: 95%;
    display: flex;
    max-height: 200px;
    align-items: center;
    justify-content: space-around;
    padding: 30px 50px
}

.cta-left {
    display: flex;
    align-items: center
}



.cta h2 {
    font-size: clamp(18px,2.2vw,26px);
    color: #f5f5f5;
    font-weight: 300;
    margin-left: 20px
}

.cta-content {
    gap: 12px;
    color: #fff
}

.cta .calendar,.cta-content {
    display: flex;
    align-items: center
}

.cta .calendar {
    justify-content: center;
    gap: 8px;
    font-size: 16px;
    color: #05122e;
    font-weight: 500;
    background-color: #fff;
    padding: 5px 22px;
    transition: all .2s ease-in-out;
    border-radius: 8px
}

.cta .calendar:hover {
    scale: .98
}

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

}

@media screen and (max-width: 1250px) {
    .cta-content {
        flex-direction:column
    }
}

@media screen and (max-width: 950px) {
    .section-padding {
        padding:35px 0
    }

    .cta-content {
        flex-direction: row
    }

    .cta-inner {
        flex-direction: column;
        max-height: max-content;
        gap: 50px;
        padding: 50px 0;
        position: relative
    }

    .cta-inner .cta-left img {
        position: absolute;
        margin: 0;
        top: -200px;
        z-index: -1
    }
}

@media screen and (max-width: 500px) {
    .cta-content {
        flex-direction:column
    }
}

.reusable-btn2 {
    display: flex;
    align-items: center;
    min-width: 230px;
    height: 40px;
    background: linear-gradient(to bottom,#58D164 0%,#2CB842 100%);
    border-radius: 8px;
    color: #fff;
    position: relative;
    transition: all .3s ease-in-out;
    overflow: hidden;
    padding-left: 50px;
    gap: 4px;
    color: #fff;
    font-weight: 600;
    text-decoration:none;
}

.reusable-btn2:hover {
    transform: scale(1.2);
    transition: 0.6s;
    color:#fff;
}

.wp-link.reusable-btn2 span {
    display: block;
    margin-left: 10px
}

.wp-link.reusable-btn2 i {
    color: #fff;
    font-size: 25px
}



.home-center-contact {
    background-color: #010415;
    padding: 80px 0;
}

.doctors-contact-image{
    border-radius:25px;
}

.landing-col {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    color:#fff;
    gap: 30px;
    position: relative;
}

.landing-container .landing-col.red {
    background: rgb(187,0,0);
    background: linear-gradient(90deg, rgba(187,0,0,1) 70%, rgba(93.5,85,92.5,0.70) 100%);
}

.landing-container .landing-col.aqua {
    background: rgb(0,170,185);
    background: linear-gradient(270deg, rgba(0,170,185,1) 70%, rgba(93.5,85,92.5,0.70) 100%);
}




.title h1 {
    font-size: 2.5rem;
    margin: 0;
}

.contact-list {
    display: flex;
    flex-direction: column;
    gap: 10px;
    align-items: center;
    justify-content: start;
    margin-top:20px;
    overflow: hidden;
}

.contact-list .contact-list-item {
    display: none;
    flex-direction: column;
    gap: 10px;
    align-items: center;
    justify-content: center;
    visibility: hidden;
    transition: all 0.5s;
}

.contact-list .contact-list-item.active {
    display: flex;
    visibility: visible;
}

.btn.btn-sk {
    display: flex;
    align-items: center;
    justify-content: start;
    gap: 20px;
    width: 100%;
    background-color: #fff;
    color: #000;
    font-weight: 600;
    font-size: 17px;
    padding: 15px 40px 15px 16px;
    border-radius: 60px;
    text-align: left;
    max-width: 400px;
    transition: all 0.3s;
}


.btn.btn-sk.place>span {
    display: flex;
}
.btn.btn-sk .icon {
    width: 40px;
    height: 40px;
    border-radius: 50px;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #000;
    color: #fff;
    transition: all 0.3s;
}

.btn.btn-sk:hover {
    background-color: #000;
    color: #fff;
}

.btn.btn-sk.phone .icon {
    background-color: #0099FF;
}
.btn.btn-sk.whatsapp .icon {
    background-color: #25D366;
}
.btn.btn-sk.email .icon {
    background-color: #DA552F;
}
.btn.btn-sk.website .icon {
    background-color: #4C75A3;
}

.btn.btn-sk.place .icon {
    background-color: #F57D00;
}


.btn.btn-sk.phone:hover {
    background-color: #0099FF;
}

.btn.btn-sk.whatsapp:hover {
    background-color: #25D366;
}

.btn.btn-sk.email:hover {
    background-color: #DA552F;
}

.btn.btn-sk.website:hover {
    background-color: #4C75A3;
}

.btn.btn-sk.place:hover {
    background-color: #F57D00;
}


.contact-address {
    text-align: center;
    max-width: 460px;
    margin-top:20px;
    font-size: 16px;
    display: flex;
    gap: 10px;
    justify-content: center;
    text-align: center;
    line-height: 1.6;
    color: #fff;
}

.contact-address div.place {
    flex: 1;
}
.contact-address div.place span {
    font-size: 13px;
    font-weight: 300;
    display: block;
    margin-bottom: 8px;
}
.contact-address div.icon {
    font-size: 32px;
}

.social-media {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
    margin-bottom:20px;
}

.social-media a {
    display: flex;
    width: 50px;
    height: 50px;
    background-color: rgba(0,0,0,0.25);
    color: #fff;
    align-items: center;
    justify-content: center;
    border-radius: 6px;
    transition: all 0.3s;
}

.social-media a.facebook:hover {
    background-color: #0061FF;
}

.social-media a.twitter:hover {
    background-color: #131418;
}

.social-media a.instagram:hover {
    background-color: #E4405F;
}

.social-media a.youtube:hover {
    background-color: #CD201F;
}

.social-media a.tiktok:hover {
    background-color: #000000;
}

.language-box {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 5px;
    position: absolute;
    transform: rotate(90deg) translateY(-50%);
    top: 50%;
    right: -50px;
}

.language-box .language-btn {
    display: flex;
    padding:10px 15px;
    border-radius: 4px;
    font-size: 14px;
    font-weight: bold;
    background-color: transparent;
    color: #fff;
    position: relative;
    justify-content: center;
    align-items: center;gap: 10px;
    transition: all 0.3s;
    border:none;
    box-shadow: none;
    outline:none;
}

.language-box .language-btn.active {
    background-color: #fff;
    color: #000;
}

.language-box .language-btn.active:after {
    content: '';
    display: block;
    width: 0;
    height: 0;
    border-left: 10px solid transparent;
    border-right: 10px solid transparent;
    border-top: 8px solid #fff;
    position: absolute;
    bottom: -7px;
    left:50%;
    transform: translateX(-50%);
}

.language-box .language-btn img {
    width: 24px;
    height: 24px;
    border-radius: 50%;
}

.language-box .language-btn:not(.active):hover {
    background-color: rgba(0,0,0,0.1);
}

.mobile-company-list {
    width: 100%;
    display: none;
    position:absolute;
    top:0;
    left:0;
    z-index:4;
    flex-grow: 1;
}

.header-btn {
    width: calc(50% - 8px);
    height: 40px;
    margin:8px;
    border:none;
    outline:none;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    line-height: 1.1;
    background-image: linear-gradient(to right, #000000 0%, #53346D  51%, #000000  100%);
    background-size: 200% auto;
    box-shadow: 0 0 5px rgba(255,255,255,0.2);
    color:#fff;
    position: relative;
    border-radius:8px;
    transition:all 0.5s;
}

.header-btn.active {
    background-color: transparent;
    background-image: none !important;
    box-shadow:none;
    background-position: right center;
    color: #fff;
}

.mobile-company-list .header-btn strong {
    font-size: 14px;
}

.mobile-company-list .header-btn span {
    font-size: 11px;
}

@media (max-width: 1199px) {
    .language-box {
        top:60px;
        right: 20px;
        flex-direction: column;
        transform: none;
    }
    .language-box .language-btn {
        padding:0;
        width: 40px;
        height: 40px;
    }
    .language-box .language-btn span {
        display: none;
    }

    .language-box .language-btn.active:after {
        left: -18px;
        top:17px;
        bottom:0;
        transform: rotate(90deg) translateY(-50%);
    }
}

@media (max-width: 767px) {
    .mobile-company-list {
        display: flex;
    }
    .landing-container {
        height: 100vh;
        display: flex;
        position: relative;
    }

    .landing-container .landing-col {
        width: 100%;
        overflow: hidden;
        justify-content: center;
        gap:15px;
        padding: 25px;
        position: absolute;
        top: 0;
        padding-top: 48px;
        height: 100%;
        transition: all 0.3s;
    }

    .landing-container .landing-col.red {
        left:-100%
    }

    .landing-container .landing-col.aqua {
        right:-100%;
    }

    .landing-container .landing-col.red.active {
        left: 0;
    }

    .landing-container .landing-col.aqua.active {
        right: 0;
    }

    .logo img {
        max-width: 120px;
    }

    .contact-list {
        gap: 10px;
        margin-top:10px;
        padding: 0 20px;
    }

    .contact-list .contact-list-item {
        gap: 10px;
    }

    .btn.btn-sk {
        font-size: 15px;
        max-width: 300px;
        gap: 10px;
        padding: 5px 10px 5px 5px;
    }
    .btn.btn-sk .icon {
        width: 28px;
        height: 28px;
    }

    .btn.btn-sk>span {
        width: calc(100% - 38px);
    }

    .language-box {
        top:83px;
    }

    .social-media a {
        width: 40px;
        height: 40px;
    }

    .contact-address {
        font-size: 14px;
    }
}
