.br-lg {
  display: none;
}

@media only screen and (max-width: 1200px) {
  .br-lg {
    display: block;
  }
}

.br-md {
  display: none;
}

@media only screen and (max-width: 991.98px) {
  .br-md {
    display: block;
  }
}

.br-sm {
  display: none;
}

@media only screen and (max-width: 767.98px) {
  .br-sm {
    display: block;
  }
}

.br-xs {
  display: none;
}

@media only screen and (max-width: 575.98px) {
  .br-xs {
    display: block;
  }
}

body {
  font-family: "Josefin Sans", sans-serif;
  font-weight: 200;
  background: #FFFFFF;
  color: #423B27;
  font-size: 19px;
}

a {
  color: #262220;
}

a:hover {
  color: #AAA991;
}

h1, h2, h3, h4, h5 {
  font-family: "Bellefair", serif;
}

ul, li {
  list-style: none;
}

.btn-outline-dark {
  --bs-btn-hover-bg: #423B27;
  --bs-btn-color: $textcolor;
  --bs-btn-border-color: $textcolor;
  --bs-btn-hover-border-color: $textcolor;
  --bs-btn-hover-color: $primarycolor;
  letter-spacing: 0.3em;
}

.navbar {
  background: #AAA991;
}

a.nav-link {
  color: #423B27;
}

a.navbar-brand {
  color: #423B27;
}

.navbar .navbar-nav .nav-link:focus, .navbar-nav .nav-link:hover {
  color: #ffffff;
}

.hero {
  height: 95vh;
  width: 100%;
}

@media screen and (max-width: 991.98px) {
  .hero {
    height: 80vh;
  }
}

.hero-video video {
  width: 100%;
  height: 100vh;
}

.wrapper {
  overflow: hidden;
}

.hero-mobile {
  width: 100vw;
  height: 100vh;
  padding-top: 20vh;
  background: url(../img/heromobile.png);
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
}

.hero-mobile img {
  max-width: 100%;
  max-height: 50vh;
  -o-object-fit: contain;
     object-fit: contain;
}

.services h2 {
  text-align: center;
  font-size: 3em;
}

.card {
  border: 0;
  margin: 0 auto;
}

.card-text {
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
}

.service-img img {
  max-width: 300px;
}

.about {
  background: url(../img/aboutBG.png) no-repeat center center;
  background-size: cover;
  color: #FFFFFF;
}

.about-wrapper {
  margin: 0 auto;
}

_::-webkit-full-page-media, _:future, :root .about-img {
  height: 95vh;
  text-align: center;
}

_::-webkit-full-page-media img, _:future img, :root .about-img img {
  height: 100%;
  max-width: -webkit-fit-content;
  max-width: fit-content;
  margin: 0 auto;
}

@media screen and (max-width: 767.98px) {
  _::-webkit-full-page-media img, _:future img, :root .about-img img {
    max-width: 90vw;
  }
}

.contact {
  background: #AAA991;
}

.form-control {
  background: none;
  border: none;
  border-bottom: 1px solid #80736C;
  border-radius: 0;
}

i {
  color: #403936;
  font-size: 1.8em;
}

.contact-sns, .contact-hours {
  text-align: center;
}

.contact-hours ul {
  display: table;
  text-align: left;
  margin-left: auto;
  margin-right: auto;
  list-style: none;
  padding: 0;
}

footer {
  background: #AAA991;
}

.bg {
  background-image: url(../img/servicesbg.png);
  height: 80vh;
  width: 40%;
  background-size: contain;
  background-repeat: no-repeat;
  position: fixed;
  z-index: 999;
  right: 0;
  bottom: 0;
  opacity: 0.4;
}

.z-index {
  position: absolute;
  z-index: 9999;
}

.wax {
  padding-top: 100px;
}

.table > :not(caption) > * > * {
  border-bottom-width: 0;
}

td {
  border-left-color: #80736C;
  border-left-width: 1px;
  text-align: right;
}

.table {
  color: #423B27;
}

.facial-text {
  margin: 0 auto;
}

.prepost li {
  list-style: disc;
}

.direction {
  padding-top: 30vh;
  padding-bottom: 15vh;
}

iframe {
  max-width: 100vw;
  max-height: 450px;
  -o-object-fit: contain;
     object-fit: contain;
}

.direction-video-wrapper {
  max-width: 100vw;
  height: 100vh;
}

.direction-video-wrapper video {
  max-width: 95vw;
  height: 100vh;
}

.sent {
  margin-top: 60px;
  padding-top: 30vh;
  padding-bottom: 20vh;
}