/* SR top bar look like screenshot */
.sr-topnav {
  background:#082c58; /* deep navy */
}
.sr-topnav .nav-link { color:#fff; }
.sr-topnav .nav-link:hover, .sr-topnav .dropdown-item:hover { opacity:.85; }
.sr-topnav .dropdown-menu { border:0; box-shadow:0 10px 30px rgba(0,0,0,.1); }
.sr-callbtn { border-width:2px; }
.res-img-logo { height:42px; width:auto; }
body { padding-top: 88px; } /* offset fixed-top; tweak if header height changes */
@media (max-width:1199.98px){ body{ padding-top:72px; } }


@font-face {
  font-family: 'TruenoLight';
  src: url('../fonts/truenolt-webfont.woff2') format('woff2'),
         url('../fonts/truenolt-webfont.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'TruenoSemiBold';
  src: url('../fonts/truenosbd-webfont.woff2') format('woff2'),
       url('../fonts/truenosbd-webfont.woff') format('woff');
  font-weight: normal;
  font-style: normal;
}


body {
  font-family: 'TruenoLight';
  padding-top: 80px;
}


.test {
  width: 100%;
  height: 75px;
  background: rgba(0, 0, 0, 0.7);
  z-index: 999999;
}

.sticky-img {
  margin: 0 auto;
  display: block;
}

.accordion a {
  position: relative;

  display: -webkit-box;

  display: -webkit-flex;

  display: -ms-flexbox;

  display: flex;

  -webkit-box-orient: vertical;

  -webkit-box-direction: normal;

  -webkit-flex-direction: column;

  -ms-flex-direction: column;

  flex-direction: column;

  width: 100%;

  padding: 1rem 3rem 1rem 1rem;

  color: #27406c;

  font-size: 35px;

  font-weight: 400;

  font-family: Montserrat, Regular;

  border-bottom: 1px solid #e5e5e5;

  text-align: left;
}

@media (min-width: 1200px) {
nav > .container, .container-lg, .container-md, .container-sm, .container-xl {
  max-width: 1360px;
}
}

.accordion a:hover,
.accordion a:hover::after {
  cursor: pointer;

  color: #03b5d2;
}

.accordion a.active {
  color: #03b5d2;

  border-bottom: 1px solid #03b5d2;
}

.accordion .content {
  opacity: 0;

  padding: 0 1rem;

  max-height: 0;

  border-bottom: 1px solid #e5e5e5;

  overflow: hidden;

  clear: both;

  -webkit-transition: all 0.2s ease 0.15s;

  -o-transition: all 0.2s ease 0.15s;

  transition: all 0.2s ease 0.15s;
}

.accordion a::after {
  font-family: 'Ionicons';

  content: '\f218';

  position: absolute;

  float: right;

  right: 1rem;

  font-size: 1rem;

  color: #27406c;

  padding: 2px;

  margin: 30px;

  width: 30px;

  height: 30px;

  -webkit-border-radius: 50%;

  -moz-border-radius: 50%;

  border-radius: 50%;

  border: 1px solid #ffffff;

  text-align: center;
}

.accordion a.active::after {
  font-family: 'Ionicons';

  content: '\f209';
}

.accordion .content p {
  font-size: 1rem;

  font-weight: 300;
}

.accordion .content.active {
  opacity: 1;

  padding: 1rem;

  max-height: 100%;

  -webkit-transition: all 0.35s ease 0.15s;

  -o-transition: all 0.35s ease 0.15s;

  transition: all 0.35s ease 0.15s;
}

.res-img-right {
  width: 60vw;

  height: auto;

  float: right;
}

.res-img {
  width: 100%;

  height: auto;

  max-width: 400px;
}

.res-img-header {
  width: 100%;

  height: auto;

  max-width: 700px;
}

.res-img-logo {
  width: 100%;

  height: auto;

  max-width: 175px;
}

.res-waze {
  width: 100%;

  height: auto;

  max-width: 80px;
}

/* Whatsapp Icon */

.float {
  position: fixed;

  width: 60px;

  height: 60px;

  bottom: 40px;

  right: 40px;

  background-color: #25d366;

  color: #fff;

  border-radius: 50px;

  text-align: center;

  font-size: 30px;

  box-shadow: 2px 2px 3px #999;

  z-index: 100;
}

.my-float {
  margin-top: 16px;
}

.navbar-light span.navbar-toggler-icon {
  background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='white' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E");

  color: white;
}

nav .navbar-nav li .active {
  font-weight: bold;
}

.dropdown .dropdown-menu a:hover {
  color: #ffffff !important;

  background-color: #002464;

  border-color: #ffffff;
}

button.navbar-toggler.navbar-toggler-right {
  border-color: white;
}

/* Carousel Testimonial */

.carousel {
  width: 650px;

  margin: 0 auto;
}

.carousel .item {
  color: #999;

  font-size: 14px;

  text-align: center;

  overflow: hidden;

  padding-bottom: 10%;
}

.carousel .item a {
  color: #eb7245;
}

.carousel .testimonial {
  padding: 10px 0 10px;

  font-size: 1.3vw;

  color: #002464;

  font-family: 'TruenoLight';
}

.carousel .overview {
  text-align: center;

  color: #002464;

  font-size: 1.3vw;

  padding-bottom: 5px;
}

.carousel .overview b {
  color: #333;

  font-size: 15px;

  text-transform: uppercase;

  display: block;

  padding-bottom: 5px;
}

.carousel .carousel-control {
  width: 50px;

  height: 50px;

  border-radius: 50%;

  background: #002464;

  text-shadow: none;

  top: 30px;

  right: -150px;
}

.carousel-control i {
  font-size: 20px;

  margin-right: 2px;

  position: relative;

  top: 0.8vw;
}

.carousel-control.left {
  left: auto;

  right: 800px;

  top: 30px;
}

.carousel-control.right i {
  margin-right: -2px;
}

.carousel .carousel-indicators {
  bottom: 15px;
}

.carousel-indicators li,
.carousel-indicators li.active {
  width: 11px;

  height: 11px;

  margin: 1px 5px;

  border-radius: 50%;
}

.carousel-indicators li {
  background: #e2e2e2;

  border-color: transparent;
}

.carousel-indicators li.active {
  border: none;

  background: #888;
}

@media (max-width: 1250px) and (min-width: 992px) {
  .carousel {
    width: 450px;

    margin: 0 auto;
  }

  .carousel .carousel-control {
    width: 50px;

    height: 50px;

    border-radius: 50%;

    background: #002464;

    text-shadow: none;

    top: 25px;

    right: -150px;
  }

  .carousel-control i {
    font-size: 20px;

    margin-right: 2px;

    position: relative;

    top: 1vw;
  }

  .carousel-control.left {
    left: auto;

    right: 600px;

    top: 25px;
  }

  .carousel-control.right i {
    margin-right: -2px;
  }

  .carousel .carousel-indicators {
    bottom: 15px;
  }

  .carousel-indicators li,
  .carousel-indicators li.active {
    width: 11px;

    height: 11px;

    margin: 1px 5px;

    border-radius: 50%;
  }

  .carousel-indicators li {
    background: #e2e2e2;

    border-color: transparent;
  }

  .carousel-indicators li.active {
    border: none;

    background: #888;
  }
}

/* new header for new index */

.subcontainer {
  padding-left: 10%;

  padding-right: 10%;
}

.s2-header {
  font-family: TruenoSemiBold;

  margin-bottom: 5%;

  font-size: 2.2vw;

  text-align: center;

  color: #013590;
}

.s4-header {
  font-family: TruenoSemiBold;

  margin-bottom: 5%;

  font-size: 2.2vw;

  text-align: center;

  color: #013590;
}

.s5-header {
  font-family: TruenoSemiBold;

  margin-bottom: 5%;

  font-size: 2.2vw;

  text-align: left;

  color: #013590;
}

.subtext {
  font-size: 1.2vw;

  color: #727272;
}

.s2-container {
  margin-left: 10%;

  margin-right: 10%;
}

.s6-subheader {
  font-family: TruenoSemiBold;

  margin-bottom: 5%;

  font-size: 1.2vw;

  text-align: left;

  color: #013590;

  margin-top: 5%;
}

.s6-subtext {
  font-size: 1vw;

  color: #727272;
}

#section-7 {
  background-color: #f8f8f8;

  background-size: cover;

  width: 100%;

  height: auto;
}

.s7-subheader {
  font-family: TruenoSemiBold;

  margin-bottom: 5%;

  font-size: 1.2vw;

  text-align: center;

  color: #013590;

  margin-top: 5%;
}

.subpageheader-center {
  font-family: TruenoSemiBold;

  margin-bottom: 5%;

  font-size: 1.5vw;

  text-align: center;

  color: #013590;

  margin-top: 5%;
}

.subpageheader-left {
  font-family: TruenoSemiBold;

  margin-bottom: 5%;

  font-size: 1.5vw;

  text-align: left;

  color: #013590;

  margin-top: 5%;
}

.subpagesubheader {
  font-family: TruenoRegular;

  margin-bottom: 5%;

  font-size: 1.2vw;

  text-align: left;

  color: #013590;

  margin-top: 5%;
}

/* end here */

/* subpage accordion */

.treatment-acc {
  background-color: #f5f5f5;
  color: #727272;
  cursor: pointer;
  padding: 18px;
  width: 100%;
  border: none;
  border-bottom: 2px solid #c3c3c3;
  text-align: left;
  outline: none;
  transition: 0.4s;
  font-size: 1.2vw;
}

.treatmentactive,
.treatment-acc:hover {
  background-color: #ccc;
}

.treatment-acc:after {
  content: '\002B';
  color: #777;
  font-weight: bold;
  float: right;
  margin-left: 5px;
}

.treatmentactive:after {
  content: '\2212';
}

.panel {
  padding: 0 18px;
  background-color: #f2fdff;
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.2s ease-out;
  color: black;
  font-size: 1.2vw;
}

/* end here */

/* image responsive */

.sub-img {
  position: absolute;

  overflow: hidden;
}

@media only screen and (max-width: 1051px) and (min-width: 768px) {
  .res-waze {
    width: 100%;

    height: auto;

    max-width: 50px;
  }
}

@media only screen and (max-width: 991px) and (min-width: 768px) {
  .carousel {
    width: 300px;

    margin: 0 auto;
  }

  .carousel .carousel-control {
    width: 50px;

    height: 50px;

    border-radius: 50%;

    background: #002464;

    text-shadow: none;

    top: 20px;

    right: -150px;
  }

  .carousel-control i {
    font-size: 20px;

    margin-right: 2px;

    position: relative;

    top: 1.3vw;
  }

  .carousel-control.left {
    left: auto;

    right: 400px;

    top: 20px;
  }

  .carousel-control.right i {
    margin-right: -2px;
  }

  .carousel .carousel-indicators {
    bottom: 15px;
  }

  .carousel-indicators li,
  .carousel-indicators li.active {
    width: 11px;

    height: 11px;

    margin: 1px 5px;

    border-radius: 50%;
  }

  .carousel-indicators li {
    background: #e2e2e2;

    border-color: transparent;
  }

  .carousel-indicators li.active {
    border: none;

    background: #888;
  }
}

@media only screen and (max-width: 767px) and (min-width: 421px) {
  .carousel {
    width: 400px;

    margin: 0 auto;
  }

  .carousel .carousel-control {
    width: 25px;

    height: 25px;

    border-radius: 50%;

    background: #002464;

    text-shadow: none;

    top: 25%;

    right: -75px;
  }

  .carousel-control i {
    font-size: 14px;

    margin-right: 2px;
  }

  .carousel-control.left {
    left: auto;

    right: 250px;

    top: 25%;
  }

  .carousel-control.right i {
    margin-right: -2px;
  }

  .carousel .carousel-indicators {
    bottom: 15px;
  }

  .carousel-indicators li,
  .carousel-indicators li.active {
    width: 11px;

    height: 11px;

    margin: 1px 5px;

    border-radius: 50%;
  }

  .carousel-indicators li {
    background: #e2e2e2;

    border-color: transparent;
  }

  .carousel-indicators li.active {
    border: none;

    background: #888;
  }
}

@media (max-width: 420px) {
  .carousel {
    width: 80vw;

    margin: 0 auto;
  }

  .carousel .carousel-control {
    width: 15px;

    height: 15px;

    border-radius: 50%;

    background: #002464;

    text-shadow: none;

    top: 25%;

    right: -35px;
  }

  .carousel-control i {
    font-size: 8px;

    margin-right: 2px;
  }

  .carousel-control.left {
    left: auto;

    right: 225px;

    top: 25%;
  }

  .carousel-control.right i {
    margin-right: -2px;
  }

  .carousel .carousel-indicators {
    bottom: 15px;
  }

  .carousel-indicators li,
  .carousel-indicators li.active {
    width: 11px;

    height: 11px;

    margin: 1px 5px;

    border-radius: 50%;
  }

  .carousel-indicators li {
    background: #e2e2e2;

    border-color: transparent;
  }

  .carousel-indicators li.active {
    border: none;

    background: #888;
  }
}

/* Footer */

.site-footer {
  background: transparent linear-gradient(180deg, #032767 0%, #021434 100%) 0%
    0% no-repeat padding-box;

  padding: 45px 0 20px;

  font-size: 15px;

  line-height: 24px;

  color: #ffffff;

  font-family: 'TruenoLight';
}

.site-footer hr {
  border-top-color: #bbb;

  opacity: 0.5;
}

.site-footer hr.small {
  margin: 20px 0;
}

.site-footer h6 {
  color: #ffffff;

  font-family: TruenoSemiBold;

  font-size: 16px;

  text-transform: uppercase;

  margin-top: 5px;

  letter-spacing: 2px;
}

.site-footer a {
  color: #ffffff;
}

.site-footer a:hover {
  color: #3366cc;

  text-decoration: none;
}

.footer-links {
  padding-left: 0;

  list-style: none;
}

.footer-links li {
  display: block;
}

.footer-links a {
  color: #ffffff;

  font-family: 'TruenoLight';
}

.footer-links a:active,
.footer-links a:focus,
.footer-links a:hover {
  color: #3366cc;

  text-decoration: none;
}

.footer-links.inline li {
  display: inline-block;
}

.site-footer .social-icons {
  text-align: right;
}

.site-footer .social-icons a {
  width: 40px;

  height: 40px;

  line-height: 40px;

  margin-left: 6px;

  margin-right: 0;

  border-radius: 100%;

  background-color: #aec6cf;
}

.copyright-text {
  margin: 0;
}

@media (max-width: 991px) {
  .site-footer [class^='col-'] {
    margin-bottom: 30px;
  }
}

@media (max-width: 767px) {
  .site-footer {
    padding-bottom: 0;
  }

  .site-footer .copyright-text,
  .site-footer .social-icons {
    text-align: center;
  }
}

.social-icons {
  padding-left: 0;

  margin-bottom: 0;

  list-style: none;
}

.social-icons li {
  display: inline-block;

  margin-bottom: 4px;
}

.social-icons li.title {
  margin-right: 15px;

  text-transform: uppercase;

  color: #96a2b2;

  font-weight: 700;

  font-size: 13px;
}

.social-icons a {
  background-color: #eceeef;

  color: #818a91;

  font-size: 16px;

  display: inline-block;

  line-height: 44px;

  width: 44px;

  height: 44px;

  text-align: center;

  margin-right: 8px;

  border-radius: 100%;

  -webkit-transition: all 0.2s linear;

  -o-transition: all 0.2s linear;

  transition: all 0.2s linear;
}

.social-icons a:active,
.social-icons a:focus,
.social-icons a:hover {
  color: #fff;

  background-color: #29aafe;
}

.social-icons.size-sm a {
  line-height: 34px;

  height: 34px;

  width: 34px;

  font-size: 14px;
}

.social-icons a.facebook:hover {
  background-color: #3b5998;
}

.social-icons a.twitter:hover {
  background-color: #00aced;
}

.social-icons a.linkedin:hover {
  background-color: #007bb6;
}

.social-icons a.dribbble:hover {
  background-color: #ea4c89;
}

@media (max-width: 767px) {
  .subcontainer {
    padding-left: 2%;

    padding-right: 2%;
  }

  .treatment-acc {
    font-size: 3vw;
  }

  .panel {
    font-size: 3vw;
  }

  .subpageheader-center {
    font-family: TruenoSemiBold;

    margin-bottom: 5%;

    font-size: 4vw;

    text-align: center;

    color: #013590;

    margin-top: 5%;
  }

  .subpagesubheader {
    font-family: TruenoRegular;

    margin-bottom: 5%;

    font-size: 3vw;

    text-align: center;

    color: #013590;

    margin-top: 5%;
  }

  .subpageheader-left {
    font-family: TruenoSemiBold;

    margin-bottom: 5%;

    font-size: 4vw;

    text-align: center;

    color: #013590;

    margin-top: 5%;
  }

  .s6-subheader {
    font-family: TruenoSemiBold;

    margin-bottom: 5%;

    font-size: 3vw;

    text-align: left;

    color: #013590;

    margin-top: 5%;
  }

  .s6-subtext {
    font-size: 3vw;

    color: #727272;
  }

  .subtext {
    font-size: 3vw;

    color: #727272;

    text-align: justify;
  }

  .s2-header {
    font-family: TruenoSemiBold;

    margin-bottom: 5%;

    font-size: 4vw;

    text-align: center;

    color: #013590;
  }

  .social-icons li.title {
    display: block;

    margin-right: 0;

    font-weight: 600;
  }
}

/* Start Basic Query */

.waze-icons {
  padding-left: 0;

  margin-bottom: 0;

  list-style: none;
}

.waze-icons li {
  display: inline-block;

  margin-bottom: 4px;
}

.waze-icons li.title {
  margin-right: 15px;

  text-transform: uppercase;

  color: #96a2b2;

  font-weight: 700;

  font-size: 13px;
}

.waze-icons a {
  display: inline-block;

  line-height: 44px;

  text-align: center;

  margin-right: 8px;

  border-radius: 100%;

  -webkit-transition: all 0.2s linear;

  -o-transition: all 0.2s linear;

  transition: all 0.2s linear;
}

.dropdown-menu a:active {
  background-color: #15b5d8 !important;
}

.dropdown .dropdown-menu a {
  color: #000 !important;
}

.top-nav {
  box-shadow: 0px 10px 30px #0000003d;

  padding-top: 15px;

  padding-bottom: 15px;

  background: transparent linear-gradient(180deg, #002464 0%, #001232 100%) 0%
    0% no-repeat padding-box;
}

nav .navbar-nav li a {
  color: #ffffff !important;

  padding-left: 15px !important;

  padding-right: 15px !important;

  font-size: 16px;
}

nav .navbar-nav li .active {
  font-weight: bold;
}

#section-1 {
  height: auto;

  width: 100%;
}

#section-2 {
  background-color: #f5f5f5;

  height: auto;

  width: 100%;

  padding-top: 5%;

  padding-bottom: 5%;
}

.video-container {
  padding-left: 10%;

  padding-right: 10%;
}

.custom-container {
  padding-left: 10%;

  padding-right: 10%;
}

.contact-container {
  padding-left: 10%;

  padding-right: 10%;
}

.square-content {
  width: 100%;

  background: #002464 0% 0% no-repeat padding-box;

  box-shadow: 0px 15px 25px #00000029;
}

.square-content:before {
  content: '';

  display: block;

  padding-top: 25%;
}

.square-content-text {
  color: #ffffff;

  font-size: 1.5vw;

  text-align: center;

  position: relative;

  top: 50%;

  -ms-transform: translateY(-50%);

  -webkit-transform: translateY(-50%);

  transform: translateY(-50%);
}

#section-3 {
  width: 100%;

  height: auto;
}

.s3-container {
  padding-left: 10%;
}

.s3-title {
  color: #27406c;

  font-size: 5.5vw;
}

.s3-sub-text {
  color: #03245e;

  font-size: 1.8vw;

  text-align: left;

  width: 80%;
}

.reach-button {
  display: block;

  position: relative;

  top: -2px;

  border: 2px solid #ffffff;
}

.km-button {
  margin-top: 2%;

  font-family: Montserrat;

  font-weight: 600;

  font-size: 2vw;

  color: #27406c;

  padding-left: 5%;

  padding-right: 5%;

  border: 5px solid #ffffff;

  background-color: transparent;

  text-align: center;
}

.km-button:hover {
  background-color: #27406c;

  color: #ffffff;
}

#section-4 {
  background-color: #f5f5f5;

  height: auto;

  width: 100%;

  padding-top: 6.5%;

  padding-bottom: 6.5%;
}

.s4-header {
  font-family: TruenoSemiBold;

  margin-bottom: 5%;

  font-size: 3vw;

  text-align: center;

  color: #002464;

  text-transform: uppercase;
}

.s4-info-box {
  width: 100%;

  height: 100%;

  background: #0ae6f9 0% 0% no-repeat padding-box;
}

.s4-text {
  color: #002464;

  font-size: 1.6vw;

  font-family: TruenoSemiBold;

  font-weight: bold;

  margin-bottom: 15%;
}

.s4-left-1 {
  width: 65%;

  height: 100%;

  float: left;

  background-image: url('../images/box-1.png');

  background-size: cover;

  background-repeat: no-repeat;

  position: relative;
}

.s4-left-2 {
  width: 65%;

  height: 100%;

  float: left;

  background-image: url('../images/box-2.png');

  background-size: cover;

  background-repeat: no-repeat;

  position: relative;
}

.s4-left-3 {
  width: 65%;

  height: 100%;

  float: left;

  background-image: url('../images/box-3.png');

  background-size: cover;

  background-repeat: no-repeat;

  position: relative;
}

.s4-right {
  width: 35%;

  height: auto;

  float: right;

  position: relative;

  top: 8vw;

  text-align: center;
}

.lm-button {
  margin-top: 2%;

  font-family: Montserrat;

  font-weight: 600;

  font-size: 1.1vw;

  color: #27406c;

  padding-left: 5%;

  padding-right: 5%;

  border: 5px solid #ffffff;

  background-color: transparent;

  text-align: center;
}

.lm-button:hover {
  background-color: #27406c;

  color: #ffffff;
}

.s4-container {
  margin-left: 5%;

  margin-right: 5%;
}

#section-5 {
  background-color: #f8f8f8;

  background-size: cover;

  background-repeat: no-repeat;

  height: auto;

  width: 100%;
}

.consult-container {
  padding-left: 15%;

  padding-right: 15%;
}

.s5-header {
  font-family: TruenoSemiBold;

  margin-bottom: 5%;

  font-size: 2.2vw;

  text-align: left;

  color: #013590;
}

.contactbox {
  background: #ffffff 0% 0% no-repeat padding-box;

  box-shadow: 0px 15px 25px #00000029;

  height: 55px;

  width: 100%;
}

.contactbox::placeholder {
  font-size: 1vw;

  font-family: Montserrat;

  font-weight: 600;

  letter-spacing: 0;

  color: #d8d8d8;

  opacity: 1;
}

input[type='text'],
input[type='email'] {
  font-size: 1vw;

  font-family: Montserrat;

  letter-spacing: 0;

  color: black;

  opacity: 1;

  padding-left: 5%;

  border: none;
}

.messagetext {
  background: #ffffff 0% 0% no-repeat padding-box;

  box-shadow: 0px 15px 25px #00000029;

  height: 180px;

  width: 100%;
}

.messagetext::placeholder {
  font-size: 1vw;

  font-family: Montserrat;

  font-weight: 600;

  letter-spacing: 0;

  color: #d8d8d8;

  opacity: 1;
}

textarea {
  font-size: 1vw;

  font-family: Montserrat;

  letter-spacing: 0;

  color: black;

  opacity: 1;

  padding-left: 5%;

  border: none;
}

.contact-button {
  margin-top: 2%;

  font-family: Montserrat;

  font-weight: 600;

  font-size: 2vw;

  color: #002464;

  padding-left: 5%;

  padding-right: 5%;

  border: 10px solid #002464;

  background-color: #ffffff;

  text-align: center;

  width: 100%;
}

.contact-button:hover {
  background-color: #002464;

  color: #ffffff;
}

#section-6 {
  background-color: #f5f5f5;

  width: 100%;

  height: auto;

  padding-top: 6.5%;

  padding-bottom: 6.5%;
}

#section-65 {
  background-color: #ffffff;

  width: auto;

  height: auto;

  padding-top: 6.5%;

  padding-bottom: 6.5%;


}

.s6-header {
  color: #002464;

  text-align: center;

  font-family: Montserrat;

  letter-spacing: 2.4px;

  font-size: 2.5vw;

  font-weight: bold;
}

#header-bg {
  background: url('../images/header-bg.png');

  background-size: cover;

  background-repeat: no-repeat;

  width: 100%;

  height: 27vw;
}

#header-bg-plain {
  background: url('../images/header-bg.png');

  background-size: cover;

  background-repeat: no-repeat;

  width: 100%;

  height: auto;
}

.header-left {
  width: 75%;

  height: 100%;

  float: left;
}

.header-full {
  width: 100%;

  height: 100%;

  position: relative;

  top: 15%;
}

/*Sub pages */

.header-right-age {
  width: 25%;

  height: 100%;

  float: left;

  background-image: url('../images/ageing/header.png');

  background-size: cover;

  background-repeat: no-repeat;

  position: relative;
}

.header-right-youth {
  width: 25%;

  height: 100%;

  float: left;

  background-image: url('../images/youthful/header.png');

  background-size: cover;

  background-repeat: no-repeat;

  position: relative;
}

.header-right-skinconcern {
  width: 25%;

  height: 100%;

  float: left;

  background-image: url('../images/skinconcern/header.png');

  background-size: cover;

  background-repeat: no-repeat;

  position: relative;
}

.header-left-location {
  width: 70%;

  height: 100%;

  float: left;
}

.header-right-location {
  width: 30%;

  height: 100%;

  float: left;

  background-image: url('../images/location/header.png');

  background-size: cover;

  background-repeat: no-repeat;

  position: relative;
}

.header-text {
  font-size: 5vw;

  font-family: TruenoSemiBold;

  color: #ffffff;

  text-shadow: 0px 3px 6px #00000029;

  text-align: center;

  position: relative;

  top: 20%;
}

.header-text-full {
  font-size: 5vw;

  font-family: TruenoSemiBold;

  color: #ffffff;

  text-shadow: 0px 3px 6px #00000029;

  text-align: center;

  position: relative;

  top: 20%;

  padding-top: 10%;

  padding-bottom: 10%;
}

#skin-treatment {
  background: #f2fdff 0% 0% no-repeat padding-box;

  width: 100%;

  height: auto;

  padding-top: 6.5%;

  padding-bottom: 6.5%;
}

.st-header {
  font-family: TruenoSemiBold;

  font-size: 3vw;

  color: #27406c;
}

.st-sub {
  font-family: 'TruenoLight';

  color: #27406c;

  font-size: 1.2vw;

  line-height: 2.7vw;
}

#categ-white {
  background: #ffffff 0% 0% no-repeat padding-box;

  padding-top: 6.5%;

  padding-bottom: 6.5%;

  width: 100%;

  height: auto;
}

#categ-blue {
  background: #f2fdff 0% 0% no-repeat padding-box;

  padding-top: 6.5%;

  padding-bottom: 6.5%;

  width: 100%;

  height: auto;
}

#categ-grey {
  background: #f5f5f5 0% 0% no-repeat padding-box;

  padding-top: 6.5%;

  padding-bottom: 6.5%;

  width: 100%;

  height: auto;

  overflow: hidden;
}

.categ-image {
  display: inline-block;

  vertical-align: top;

  width: 35%;
}

.categ-text {
  display: inline-block;

  width: 55%;
}

.categ-title {
  color: #002464;

  font-family: TruenoSemiBold;

  font-size: 2vw;
}

.categ-sub {
  font-family: 'TruenoLight';

  font-size: 1.1vw;

  color: #27406c;
}

ul.sq {
  list-style: none;
}

ul.sq li::before {
  content: '\25A0';

  font-size: 1.1vw;

  color: #04f7f2;

  display: inline-block;

  width: 1em;

  margin-left: -1em;
}

#categ-contact {
  background: transparent
    linear-gradient(
      255deg,
      #3dd2d8 0%,
      #00d7ff 0%,
      #10daff 33%,
      #05f2f4 85%,
      #00ffee 100%
    )
    0% 0% no-repeat padding-box;

  width: 100%;

  height: auto;

  padding-top: 6.5%;

  padding-bottom: 6.5%;
}

.contact-font {
  text-align: center;

  font-size: 1.5vw;

  color: #27406c;

  font-family: 'TruenoLight';

  position: relative;

  margin-bottom: 5%;
}

.categ-contact-button {
  margin-top: 2%;

  font-family: Montserrat;

  font-weight: 600;

  font-size: 1.5vw;

  color: #27406c;

  padding-left: 5%;

  padding-right: 5%;

  padding-bottom: 1%;

  padding-top: 1%;

  border: 5px solid #ffffff;

  background-color: transparent;

  text-align: center;

  margin: 0 auto;

  display: block;
}

.categ-contact-button:hover {
  background-color: #27406c;

  color: #ffffff;
}

#contact-location {
  background: url('../images/marble-bg.png');

  background-size: cover;

  background-repeat: no-repeat;

  box-shadow: 0px 15px 35px #00000029;

  height: auto;

  width: 100%;

  padding-top: 6.5%;

  padding-bottom: 6.5%;
}

#contact-map {
  background: #f2fdff 0% 0% no-repeat padding-box;

  width: 100%;

  height: auto;

  padding-top: 6.5%;

  padding-bottom: 6.5%;
}

.left-contact {
  width: 20%;

  height: auto;

  float: left;
}

.right-contact {
  width: 70%;

  height: auto;

  float: left;
}

.contact-text {
  font-family: Montserrat;

  color: #27406c;

  font-size: 1vw;
}

.header-left-about {
  width: 60%;

  height: 100%;

  float: left;
}

.header-right-about {
  width: 40%;

  height: 100%;

  float: left;

  background-image: url('../images/about/aboutr.jpg');

  background-size: cover;

  background-repeat: no-repeat;

  position: relative;
}

#about {
  width: 100%;

  height: auto;

  margin-top: 6.5%;

  margin-bottom: 6.5%;
}

.about-header {
  color: #27406c;

  font-family: TruenoSemiBold;

  text-align: left;

  font-size: 2.5vw;
}

.about-content {
  color: #27406c;

  font-family: 'TruenoLight';

  text-align: left;

  font-size: 1vw;

  line-height: 2vw;
}

.about-wrapper {
  margin-bottom: 5%;
}

.header-right-other {
  width: 25%;

  height: 100%;

  float: left;

  background-image: url('../images/otherconcern/header.png');

  background-size: cover;

  background-repeat: no-repeat;

  position: relative;
}

.info-header {
  font-family: TruenoSemiBold;

  font-size: 1.5vw;

  color: #27406c;
}

.info-sub-header {
  font-family: Montserrat;

  font-weight: bold;

  font-size: 1.2vw;

  color: #27406c;
}

#skintreatment {
  width: 100%;

  height: auto;
}

.skin-row {
  display: -ms-flexbox;

  display: flex;

  -ms-flex-wrap: wrap;

  flex-wrap: wrap;
}

.st-container {
  display: inline-block;
}

.left-box-blue {
  background: #f2fdff 0% 0% no-repeat padding-box;

  width: 100%;

  height: auto;

  padding-top: 6.5%;

  padding-bottom: 3.25%;

  padding-left: 10%;

  padding-right: 10%;

  text-align: center;
}

.right-box-white {
  background: #ffffff 0% 0% no-repeat padding-box;

  width: 100%;

  height: auto;

  padding-top: 6.5%;

  padding-bottom: 3.25%;

  padding-left: 10%;

  padding-right: 10%;

  text-align: center;
}

.left-box-white {
  background: #ffffff 0% 0% no-repeat padding-box;

  width: 100%;

  height: auto;

  padding-top: 6.5%;

  padding-bottom: 3.25%;

  padding-left: 10%;

  padding-right: 10%;

  text-align: center;
}

.right-box-blue {
  background: #f2fdff 0% 0% no-repeat padding-box;

  width: 100%;

  height: auto;

  padding-top: 6.5%;

  padding-bottom: 3.25%;

  padding-left: 10%;

  padding-right: 10%;

  text-align: center;
}

.rm-button {
  margin-top: 2%;

  font-family: Montserrat;

  font-weight: 600;

  font-size: 1.3vw;

  color: #27406c;

  padding-left: 5%;

  padding-right: 5%;

  padding-bottom: 1%;

  padding-top: 1%;

  border: 5px solid #002464;

  background-color: transparent;

  text-align: center;
}

.rm-button:hover {
  background-color: #002464;

  color: #ffffff;
}

.youth-sub {
  font-family: 'TruenoLight';

  font-size: 1.5vw;

  color: #27406c;
}

.youth-header {
  font-size: 5vw;

  font-family: 'TruenoLight';

  color: #ffffff;

  text-shadow: 0px 3px 6px #00000029;

  text-align: center;

  position: relative;

  top: 15%;
}

#ageing-s1 {
  background-color: #ffffff;

  width: 100%;

  height: auto;

  padding-top: 6.5%;

  padding-bottom: 6.5%;
}

#ageing-s2 {
  background-color: #f2fdff;

  width: 100%;

  height: auto;

  padding-top: 6.5%;

  padding-bottom: 6.5%;
}

.ageing-header {
  font-family: TruenoSemiBold;

  font-size: 2vw;

  color: #002464;
}

.ageing-content {
  font-family: 'TruenoLight';

  font-size: 1vw;

  color: #002464;
}

#ageing-divider {
  background: transparent
    linear-gradient(259deg, #3dd2d8 0%, #00d7ff 0%, #10daff 42%, #00ffee 100%)
    0% 0% no-repeat padding-box;

  width: 100%;

  height: auto;

  padding-top: 6.5%;

  padding-bottom: 6.5%;
}

#c-title {
  background-color: #002464;

  padding-top: 3.5%;

  padding-bottom: 3.5%;
}

.custom-title {
  color: white;

  font-size: 2.5vw;

  font-family: TruenoSemiBold;

  text-align: center;

  margin: 0 auto;
}

@media (max-width: 767px) {
  .m-pr-0 {
    padding-right: 0 !important;
  }

  .float {
    display: none;
  }

  .test {
    width: 100%;
    height: 75px;
    background: rgba(0, 0, 0, 0.7);
    z-index: 999999;
  }

  .sticky-img {
    margin: 0 auto;
    display: block;
  }

  .reach-button {
    display: block;

    position: relative;

    width: 50%;

    border: 2px solid #ffffff;
  }

  .top-nav {
    box-shadow: 0px 10px 30px #0000003d;

    padding-top: 15px;

    padding-bottom: 15px;

    background: transparent linear-gradient(180deg, #002464 0%, #001232 100%) 0%
      0% no-repeat padding-box;
  }

  .custom-title {
    color: white;

    font-size: 5vw;

    font-family: TruenoSemiBold;

    text-align: center;

    margin: 0 auto;

    padding: 5%;
  }

  .res-img-logo {
    width: 100%;

    height: auto;

    max-width: 105px;
  }

  .res-img-right {
    width: 60vw;

    height: auto;

    float: right;
  }

  .s3-container {
    padding-left: 10%;
  }

  .s3-title {
    color: #27406c;

    font-size: 6.5vw;
  }

  .s3-sub-text {
    color: #03245e;

    font-size: 3.5vw;

    text-align: left;

    width: 100%;

    margin-bottom: 0.4rem;
  }

  .km-button {
    margin-top: 2%;

    font-family: Montserrat;

    font-weight: 600;

    font-size: 5vw;

    color: #27406c;

    padding-left: 5%;

    padding-right: 5%;

    border: 2px solid #ffffff;

    background-color: transparent;

    text-align: center;
  }

  .s5-header {
    font-family: TruenoSemiBold;

    margin-bottom: 5%;

    font-size: 2.2vw;

    text-align: center;

    color: #013590;
  }

  .contactbox {
    background: #ffffff 0% 0% no-repeat padding-box;

    box-shadow: 0px 15px 25px #00000029;

    height: 40px;

    width: 100%;
  }

  .contactbox::placeholder {
    font-size: 3.5vw;

    font-family: Montserrat;

    font-weight: 600;

    letter-spacing: 0;

    color: #d8d8d8;

    opacity: 1;
  }

  input[type='text'],
  input[type='email'] {
    font-size: 3.5vw;

    font-family: Montserrat;

    letter-spacing: 0;

    color: black;

    opacity: 1;

    padding-left: 5%;

    border: none;
  }

  .messagetext {
    background: #ffffff 0% 0% no-repeat padding-box;

    box-shadow: 0px 15px 25px #00000029;

    height: 90px;

    width: 100%;
  }

  .messagetext::placeholder {
    font-size: 3.5vw;

    font-family: Montserrat;

    font-weight: 600;

    letter-spacing: 0;

    color: #d8d8d8;

    opacity: 1;
  }

  textarea {
    font-size: 3.5vw;

    font-family: Montserrat;

    letter-spacing: 0;

    color: black;

    opacity: 1;

    padding-left: 5%;

    border: none;
  }

  .contact-button {
    margin-top: 0;

    font-family: Montserrat;

    font-weight: 600;

    font-size: 6vw;

    color: #002464;

    padding-left: 5%;

    padding-right: 5%;

    border: 5px solid #002464;

    background-color: #ffffff;

    text-align: center;

    width: 100%;
  }

  .s4-container {
    margin-left: 2%;

    margin-right: 2%;
  }

  .lm-button {
    margin-top: 2%;

    font-family: Montserrat;

    font-weight: 600;

    font-size: 6vw;

    color: #27406c;

    padding-left: 5%;

    padding-right: 5%;

    border: 2px solid #ffffff;

    background-color: transparent;

    text-align: center;
  }

  .s4-left-1 {
    width: 45%;

    height: 100%;

    float: left;

    background-image: url('../images/box-1.png');

    background-size: cover;

    background-repeat: no-repeat;

    position: relative;
  }

  .s4-left-2 {
    width: 45%;

    height: 100%;

    float: left;

    background-image: url('../images/box-2.png');

    background-size: cover;

    background-repeat: no-repeat;

    position: relative;
  }

  .s4-left-3 {
    width: 45%;

    height: 100%;

    float: left;

    background-image: url('../images/box-3.png');

    background-size: cover;

    background-repeat: no-repeat;

    position: relative;
  }

  .s4-right {
    width: 55%;

    height: auto;

    float: right;

    position: relative;

    top: 8vw;

    text-align: center;

    padding-top: 10%;

    padding-bottom: 10%;
  }

  .s4-text {
    color: #002464;

    font-size: 5vw;

    font-family: TruenoSemiBold;

    font-weight: bold;

    margin-bottom: 0;
  }

  .about-content {
    color: #27406c;

    font-family: 'TruenoLight';

    text-align: left;

    font-size: 2vw;

    line-height: 6vw;
  }

  .st-sub {
    font-family: 'TruenoLight';

    color: #27406c;

    font-size: 3vw;

    line-height: 4.5vw;
  }

  .categ-sub {
    font-family: 'TruenoLight';

    font-size: 3vw;

    color: #27406c;
  }

  ul.sq {
    list-style: none;
  }

  ul.sq li::before {
    content: '\25A0';

    font-size: 3vw;

    color: #04f7f2;

    display: inline-block;

    width: 1em;

    margin-left: -1em;
  }

  .contact-container {
    padding-left: 0;

    padding-right: 0;
  }

  #contact-map {
    background: #f2fdff 0% 0% no-repeat padding-box;

    width: 100%;

    height: auto;

    padding-top: 0;

    padding-bottom: 0;
  }

  #mobile-contact-wrap {
    padding-top: 5%;

    margin: 0 auto;

    padding-left: 20%;

    padding-right: 20%;
  }

  .contact-text {
    font-family: Montserrat;

    color: #27406c;

    font-size: 3.5vw;
  }

  .res-waze {
    width: 100%;

    height: auto;

    max-width: 50px;
  }

  .res-img {
    width: 100%;

    height: 100%;

    max-width: 400px;
  }

  .rm-button {
    margin-top: 2%;

    font-family: Montserrat;

    font-weight: 600;

    font-size: 3vw;

    color: #27406c;

    padding-left: 5%;

    padding-right: 5%;

    padding-bottom: 1%;

    padding-top: 1%;

    border: 2px solid #002464;

    background-color: transparent;

    text-align: center;
  }

  .categ-contact-button {
    font-family: 'TruenoLight';

    font-weight: 600;

    font-size: 3vw;

    color: #27406c;

    padding-top: 1.5%;

    padding-bottom: 1.5%;

    border: 2px solid #ffffff;

    background-color: transparent;

    text-align: center;

    width: 40%;

    margin: 0 auto;

    display: block;
  }

  .categ-title {
    color: #002464;

    font-family: TruenoSemiBold;

    margin-top: 5%;

    font-size: 5vw;
  }

  .header-right-youth {
    width: auto;

    height: auto;

    float: left;

    background-image: none;

    background-size: cover;

    background-repeat: no-repeat;

    position: relative;
  }

  .header-left {
    width: 100%;

    height: 100%;

    float: left;
  }

  .youth-sub {
    font-family: 'TruenoLight';

    font-size: 3vw;

    color: #27406c;
  }

  .contact-font {
    text-align: center;

    font-size: 3vw;

    color: #27406c;

    font-family: 'TruenoLight';

    position: relative;

    margin-bottom: 5%;
  }

  .info-header {
    font-family: TruenoSemiBold;

    font-size: 5vw;

    margin-top: 5%;

    color: #27406c;
  }

  .info-sub-header {
    font-family: Montserrat;

    font-weight: bold;

    font-size: 4vw;

    color: #27406c;
  }

  .st-header {
    font-family: TruenoSemiBold;

    font-size: 5vw;

    color: #27406c;
  }

  .header-right-skinconcern {
    width: auto;

    height: auto;

    float: left;

    background-image: none;

    background-size: cover;

    background-repeat: no-repeat;

    position: relative;
  }

  .header-right-other {
    width: auto;

    height: auto;

    float: left;

    background-image: none;

    background-size: cover;

    background-repeat: no-repeat;

    position: relative;
  }

  .header-right-age {
    width: auto;

    height: auto;

    float: left;

    background-image: none;

    background-size: cover;

    background-repeat: no-repeat;

    position: relative;
  }

  .s6-header {
    color: #002464;

    text-align: center;

    font-family: Montserrat;

    letter-spacing: 2.4px;

    font-size: 7vw;

    font-weight: bold;
  }

  .carousel .testimonial {
    padding: 10px 0 10px;

    font-size: 5vw;

    color: #002464;

    font-family: 'TruenoLight';
  }

  .carousel .overview {
    text-align: center;

    color: #002464;

    font-size: 7vw;

    padding-bottom: 5px;
  }

  .consult-container {
    padding-right: 10%;

    padding-left: 10%;
  }

  .square-content-text {
    color: #ffffff;

    font-size: 5vw;

    text-align: center;

    position: relative;

    top: 1vw;

    -ms-transform: translateY(-50%);

    -webkit-transform: translateY(-50%);

    transform: translateY(-50%);
  }

  .square-content:before {
    content: '';

    display: block;

    padding-top: 15%;
  }

  .s4-header {
    font-family: TruenoSemiBold;

    margin-bottom: 5%;

    font-size: 5vw;

    text-align: center;

    color: #002464;

    text-transform: uppercase;
  }

  .accordion a {
    position: relative;

    display: -webkit-box;

    display: -webkit-flex;

    display: -ms-flexbox;

    display: flex;

    -webkit-box-orient: vertical;

    -webkit-box-direction: normal;

    -webkit-flex-direction: column;

    -ms-flex-direction: column;

    flex-direction: column;

    width: 100%;

    padding: 1rem 3rem 1rem 1rem;

    color: #27406c;

    font-size: 24px;

    font-weight: 400;

    font-family: Montserrat, Regular;

    border-bottom: 1px solid #e5e5e5;

    text-align: left;
  }

  .accordion a::after {
    font-family: 'Ionicons';

    content: '\f218';

    position: absolute;

    float: right;

    right: 1rem;

    font-size: 1rem;

    color: #27406c;

    padding: 1px;

    margin: 10px;

    width: 30px;

    height: 30px;

    -webkit-border-radius: 50%;

    -moz-border-radius: 50%;

    border-radius: 50%;

    border: 1px solid #ffffff;

    text-align: center;
  }

  .accordion a.active::after {
    font-family: 'Ionicons';

    content: '\f209';

    color: #03b5d2;
  }
}



