* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}

html {
  scroll-behavior: smooth;
}

body {
  font-family: 'Gotham Book', sans-serif;
  font-size: 14px;
}

ul {
  margin-bottom: 0;
  padding-left: 0;
}

.header-wrapper {
  /* height: 126px; */
  background-color: #231f20;
}

.header-inner {
  width: 100%;
  padding-top: 40px;
}

.header-inner ul {
  display: flex;
  list-style-type: none;
  justify-content: center;
}

.header-inner ul li {
  margin: 0 10px;
}

.header-inner ul li a {
  font-family: 'Century Gothic';
  text-decoration: none;
  color: #fff;
  width: 100%;
  height: 100%;
  display: block;
  padding: 35px 22px 35px;
  /* letter-spacing: 1.2px; */
  /* font-weight: 600; */
  font-size: 13px;
  font-weight: bold;
}

.header-inner ul li span {
  width: 100%;
  height: 100%;
  display: block;
}

.header-inner ul li.highlighted {
  background-color: #345b69;
}

.hero-section {
  position: relative;
  width: 100%;
  height: 550px;
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: hidden;
}

.hero-video {
  position: absolute;
  z-index: -1;
  filter: grayscale(1);
  top: 0;
  width: 100%;
  height: 100%;
}

.hero-video video {
  min-width: 100%;
  min-height: 100%;
}

.hero-logo {
  width: 250px;
}

.social-wrapper {
  max-width: 1300px;
  position: relative;
}

.scoial-links {
  position: absolute;
  right: -700px;
  top: -240px;
}

.scoial-links ul {
  display: flex;
  list-style: none;
  flex-direction: column;
  gap: 10px;
}

.scoial-links li {
  border-radius: 50%;
  background-color: #345b69;
  text-align: center;
  width: 55px;
  height: 55px;
}

.scoial-links li i {
  font-size: 35px;
}

.scoial-links li a {
  color: #231f20;
  display: flex;
  width: 100%;
  height: 100%;
  justify-content: center;
  align-items: center;
  text-decoration: none;
}

.about-section {
  text-align: center;
  padding: 40px 0;
  max-width: 1300px;
  margin: auto;
}

.about-p {
  padding: 0 220px;
}

.about-section .highlight {
  margin-bottom: 40px;
}

.covid-alert {
  padding: 0 220px;
  margin-top: -140px;
}

.about-section p {
  font-size: 14px;
  text-align: center;
  margin-bottom: 20px;
  color: #231f20;
  line-height: 1.3em;
  font-weight: 500;
}

.btn {
  padding: 12px 26px;
  background-color: #3a6f81;
  color: #fff;
  font-family: inherit;
  border: none;
  font-weight: 400;
  font-size: 14px;
  border-radius: 0;
  letter-spacing: 0.9px;
  cursor: pointer;
}

.about-section .btn {
  margin-top: 20px;
  margin-bottom: 20px;
}

.about-imgs {
  display: flex;
  justify-content: space-between;
  padding: 0 170px 250px;
  gap: 50px;
  position: relative;
  background-image: url('../images/texture.png');
  background-repeat: no-repeat;
  background-position: 100% 93%;
  /* height: 550px; */
}

.about-imgs .about-img-wrapper img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.section-header {
  background-image: url('../images/header_bg.png');
  background-repeat: no-repeat;
  background-size: cover;
  background-position: 0% 60%;
  height: 175px;
  display: flex;
  justify-content: center;
  align-items: center;
}

.section-header h1 {
  font-size: 22px;
  font-family: 'Century Gothic';
  letter-spacing: 0.25em;
  color: #fff;
  font-weight: 600;
  text-transform: uppercase;
}

.profile-card {
  display: flex;
  flex-direction: row;
  gap: 20px;
  /* margin-bottom: 65px; */
  position: relative;
  justify-content: center;
  align-items: center;
  min-height: 321px;
}

.profile-img {
  z-index: 100;
  width: 270px;
  border-radius: 50%;
  justify-content: center;
  align-items: center;
  display: flex;
}

.profile-img img {
  width: 100%;
  border-radius: 50%;
}

.profiles {
  padding: 80px 140px 50px 80px;
  max-width: 1300px;
  margin: auto;
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.profile-text {
  flex: 1;
}

.profile-text h3 {
  text-transform: uppercase;
  color: #231f20;
  font-weight: bold;
  font-size: 18px;
  margin-bottom: 18px;
}

.profile-text p {
  font-size: 14px;
  text-align: left;
  margin-bottom: 16px;
  color: #231f20;
  line-height: 1.4;
  font-weight: 500;
}

.profile-text p:last-of-type {
  margin-bottom: 0;
}

.profile-extra-img {
  position: absolute;
  z-index: 50;
  bottom: 55%;
  left: -65px;
}

.footer-wrapper {
  background-color: #3a6f81;
  padding: 35px 0 50px;
  text-align: center;
}

.footer-inner h4 {
  font-size: 14px;
  font-family: 'Century Gothic';
  color: #fff;
  font-weight: bold;
  text-transform: uppercase;
  letter-spacing: 0.25em;
  margin-bottom: 35px;
}

.footer-inner .instafeed {
  display: flex;
  justify-content: center;
  padding: 0 110px;
  align-items: center;
  gap: 35px;
  margin-bottom: 25px;
  margin-top: -35px;
}

.footer-inner .instafeed > div {
  width: 250px;
}

.footer-info {
  color: #fff;
  margin-bottom: 35px;
  padding: 0 15px;
}

.footer-info a {
  color: #fff;
  text-decoration: none;
}

.footer-info a:hover {
  color: rgb(216, 216, 216);
}

.footer-info h5 {
  text-transform: uppercase;
  font-size: 14px;
  letter-spacing: 4px;
  font-weight: bold;
  margin-bottom: 10px;
  font-family: 'Century Gothic';
}

.footer-info p {
  font-size: 14px;
  font-weight: 100;
  letter-spacing: 1.2px;
  font-family: 'Century Gothic';
}

.footer-info ul {
  display: flex;
  justify-content: center;
  list-style: none;
  gap: 15px;
  margin-top: 20px;
}

.footer-info li {
  border-radius: 50%;
  background-color: #fff;
  text-align: center;
  width: 30px;
  height: 30px;
}

.footer-info li i {
  font-size: 20px;
}

.footer-info li a {
  color: #3a6f81;
  display: flex;
  width: 100%;
  height: 100%;
  justify-content: center;
  align-items: center;
  text-decoration: none;
}

.treatments-wrapper {
  padding: 35px 45px;
}

.treatments-inner {
  background-color: #3a6f81;
}

.treatments {
  max-width: 1300px;
  margin: auto;
  position: relative;
}

.treatments-content {
  display: flex;
  padding: 120px 10px 100px;
  justify-content: center;
  flex-direction: column;
  line-height: 23px;
  letter-spacing: 0.9px;
}

.treatments-content .highlight {
  margin-top: 65px !important;
  max-width: 50%;
  margin:auto;
}

.treatment-header {
  font-size: 18px;
  color: #fff;
  font-weight: bold;
  margin-bottom: 25px;
}

.treatment-section {
  text-align: center;
  margin-bottom: 65px;
}

.treatment-details {
  font-size: 14px;
  color: #fff;
}

.treatment-add {
  font-size: 14px;
  margin-top: 25px;
  color: #fff;
}

.treatment-table {
  display: flex;
  flex-direction: row;
  gap: 50px;
  justify-content: center;
}

.treatment-table > div {
  text-align: left;
}

.treatments .btn {
  background-color: #231f20;
  font-size: 18px;
  padding: 14px 100px;
}

.contact {
  padding: 35px 45px;
  position: relative;
}

.contact-form {
  max-width: 800px;
  margin: auto;
}

.contact-content {
  background-color: #231f20;
}

.contact-form form {
  line-height: 23px;
  letter-spacing: 0.9px;
  display: flex;
  padding: 80px 0px;
  justify-content: center;
  flex-direction: column;
}

.contact-location {
  text-align: center;
  padding-bottom: 65px;
  max-width: 800px;
  margin: auto;
}

input,
textarea {
  width: 100%;
  padding: 15px;
  font-size: 14px;
  color: #231f20;
  font-family: inherit;
  border: 2px solid #8e8e8e;
  margin-bottom: 35px;
}

input:focus,
textarea:focus {
  outline: none;
}

.form-group {
  display: flex;
  gap: 35px;
}

.form-group > div {
  flex: 1;
}

.mobile-menu {
  display: flex;
  justify-content: space-between;
  color: #fff;
}

.mobile-logo {
  margin-top: -40px;
}

.mobile-logo a {
  font-size: 24px;
  color: #fff;
  text-decoration: none;
}

.toogle-menu {
  margin-right: -6px;
  font-size: 24px;
  cursor: pointer;
}

.toogle-menu .close {
  display: none;
}

.toogle-menu.show .close {
  display: block;
}

.toogle-menu.show .open {
  display: none;
}

.mobile-menu-wrapper {
  display: none;
  background-color: #fff;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 106px;
  z-index: 99999;
}

.mobile-menu-wrapper.show {
  display: block;
}

.mobile-inner {
  display: flex;
  flex-direction: column;
}

ul.mobile-inner li {
  margin: 0;
}

ul.mobile-inner li span a {
  color: #231f20;
  text-align: center;
  font-size: 14px;
  padding: 20px 30px 20px;
}

ul.mobile-inner li.highlighted span a {
  color: #ffffff;
  text-align: center;
}

.mobile-menu {
  display: none;
  justify-content: space-between;
  align-items: center;
}

.header-inner .scoial-links {
  display: none;
}

.mobile-actions {
  display: none;
  position: fixed;
  bottom: 15px;
  width: 100%;
  z-index: 9999;
  height: 47px;
}

.mobile-actions > div {
  display: flex;
  width: 90%;
  height: 100%;
  background-color: #231f20;
  margin: auto;
}

.mobile-actions a {
  display: flex;
  flex: 1;
  justify-content: center;
  align-items: center;
  width: 10% !important;
  height: auto !important;
  flex-grow: 1;
  display: flex;
  flex-direction: column;
  padding: 5px 0;
  box-sizing: border-box;
}

.mobile-actions a > div {
  fill: #fff;
  position: relative;
  flex-grow: 1;
  flex-basis: 21px;
  margin-top: 2px;
}

.mobile-actions svg {
  height: 17px;
  width: 28px;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}

.hero-btn .btn {
  font-size: 18px;
}

.hero-btn {
  display: none;
  text-transform: uppercase;
}

.highlight {
  color: #d5c27d !important;
  text-transform: uppercase;
  font-weight: bold !important;
}