/* Extra small devices (phones, 600px and down) */
@media only screen and (max-width: 600px) {
  .hide-mobile {
    display: none;
  }

  .hero-video video {
    min-width: 0%;
    min-height: 0%;
  }

  .contact-form .center {
    text-align: center;
  }

  .profile-img.first {
    margin-top: -55px !important;
  }

  .section-header {
    height: 100px;
  }
}

/* Small devices (portrait tablets and large phones, 600px and up) */
@media only screen and (min-width: 600px) {
  .hide-mobile {
    display: none;
  }

  .contact-form .center {
    text-align: center;
  }

  /* .profile-img.first {
    margin-top: -55px !important;
  } */

  .section-header {
    height: 100px;
  }
}

/* Medium devices (landscape tablets, 768px and up) */
@media only screen and (min-width: 768px) {
  .hide-mobile {
    display: block;
  }
}

/* Large devices (laptops/desktops, 992px and up) */
@media only screen and (min-width: 992px) {
}

/* Extra large devices (large laptops and desktops, 1200px and up) */
@media only screen and (min-width: 1200px) {
}

@media only screen and (min-width: 768px) and (max-width: 992px) {
  .header-inner ul li a {
    padding: 30px 10px 40px;
  }
}

/* Extra large devices (large laptops and desktops, 1200px and up) */
@media only screen and (max-width: 1200px) {
  .about-p,
  .covid-alert {
    padding: 0 100px;
  }
  .about-imgs {
    padding: 0 110px 250px;
    gap: 40px;
  }
  .profiles {
    padding: 200px 80px 80px;
  }
  .scoial-links {
    right: -600px;
  }
}

/* Large devices (laptops/desktops, 992px and up) */
@media only screen and (max-width: 992px) {
  .scoial-links {
    right: -500px;
  }
  .about-p,
  .covid-alert {
    padding: 0 80px;
  }
  .about-imgs {
    padding: 0 40px 250px;
    gap: 30px;
  }
  .profiles {
    padding: 250px 80px 80px;
  }
  .profile-card {
    flex-direction: column;
    gap: 20px;
    margin-bottom: 55px;
    align-items: center;
    height: auto;
  }
  .profile-extra-img {
    top: -230px;
    left: unset;
  }
  .profile-text p,
  .profile-text {
    text-align: center;
  }
  .footer-inner .instafeed {
    padding: 0 30px;
  }
  .contact {
    padding: 20px 25px;
  }
  .contact-content {
    padding: 90px 60px 70px;
  }
  .treatments-wrapper {
    padding: 20px 25px;
  }

  .covid-alert {
    margin-top: -80px;
  }
}

/* Medium devices (landscape tablets, 768px and up) */
@media only screen and (max-width: 768px) {
  .hero-section .scoial-links {
    display: none;
  }
  .header-inner .scoial-links {
    display: block;
  }
  .scoial-links {
    top: 20px;
    right: 20px;
  }
  .scoial-links li i {
    font-size: 22px;
  }
  .scoial-links li {
    width: 30px;
    height: 30px;
    margin: 0 !important;
    background-color: #ffffff;
  }

  .scoial-links ul li a {
    display: flex;
    padding: 0;
    color: #000000;
    /* background-color: black; */
  }
  .scoial-links ul {
    flex-direction: row;
  }
  .about-p,
  .covid-alert {
    padding: 0 30px;
  }
  .about-imgs {
    padding: 0 40px;
    gap: 20px;
    /* flex-direction: column; */
    /* justify-content: center; */
    align-items: center;
    height: auto;
    margin-bottom: 35px;
    background-image: none;
  }

  .profile-card {
    flex-direction: column;
    gap: 20px;
    margin-bottom: 25px;
    align-items: center;
  }
  .profiles {
    padding: 250px 30px 80px;
  }
  .footer-inner .instafeed {
    flex-direction: column;
    gap: 20px;
  }
  .contact {
    padding: 10px 10px;
  }
  .contact-content {
    padding: 70px 25px 50px;
  }
  .form-group {
    flex-direction: column;
    gap: 0;
  }
  .header-inner > ul {
    display: none;
  }

  .mobile-menu {
    display: flex;
    padding-top: 20px;
    padding-bottom: 10px;
    padding-left: 30px;
    padding-right: 30px;
  }

  /* .mobile-menu-wrapper {
    display: block;
  } */

  .treatments-wrapper {
    padding: 10px 10px;
  }
  .treatment-details {
    font-size: 14px;
  }

  .mobile-actions {
    display: block;
  }
  .covid-alert {
    margin-top: 0px;
  }

  .hero-section {
    height: auto;
    flex-direction: column;
    gap: 35px;
  }
  .hero-btn {
    display: block;
    margin-bottom: 35px;
  }
}

/* Small devices (portrait tablets and large phones, 600px and up) */
@media only screen and (max-width: 600px) {
  .treatment-table {
    gap: 10px;
  }
  .treatments-wrapper {
    padding: 5px 5px;
  }
  .treatments-content {
    padding: 120px 5px 100px;
  }
}

/* Extra small devices (phones, 600px and down) */
@media only screen and (max-width: 600px) {
}
