@import './animations.css';
@font-face {
  font-family: "Outfit";
  src: url("./static/Fonts/Inter/Static/Inter-Light.ttf");
  font-display: swap;
}
@font-face {
  font-family: "Outfit";
  src: url("./static/Fonts/Inter/Static/Inter-Bold.ttf");
  font-weight: bold;
  font-display: swap;
}
.grecaptcha-badge {
  z-index: 999;
}

a.--no-style {
  text-decoration: inherit;
  color: inherit;
  width: fit-content;
  height: fit-content;
  margin: 20px 0px;
}
@media screen and (max-width: 1024px) {
  a.--no-style {
    text-align: center;
    align-self: center;
  }
}
a.--no-style--x-close {
  margin-top: 0;
}

a.--nostyle text-box__big-button {
  width: fit-content;
  text-decoration: inherit;
  color: inherit;
}

body {
  background-color: white;
  justify-items: center;
}

:root {
  --primary-font: "Outfit";
  --secondary-color: #333;
  --secondary-color-b: #3D3D3D;
  --secondary-color-transparent: rgba(56, 56, 56, 0.3);
  --secondary-color-transparent-2: rgba(56, 56, 56, 0.8);
  --secondary-color-b-transparent: rgba(61, 61, 61, 0.8);
  --primary-color: #EFE6EA;
  --primary-color-transparent-0: rgba(239,230,235, 0.14);
  --primary-color-transparent: rgba(239,230,235, 0.5);
  --primary-color-transparent-1: rgba(239,230,235, 0.65);
  --primary-color-transparent-2: rgba(239,230,235, 0.8);
  --tertiary-color: #FC814A;
  --tertiary-color-b: #FD9E72;
  --tertiary-color-c: #FFE6D6;
  --quaternary-color: #D6F5FF;
  --parallax-4-position: -0px;
  --parallax-10-position: -0px;
}

.hidden-scroll {
  animation-play-state: paused !important;
}

.slice {
  width: 100%;
  max-width: 1920px;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: center;
  align-content: center;
  background-color: var(--primary-color);
  min-height: 90vh;
  height: fit-content;
  position: relative;
  overflow: hidden;
  align-items: center;
}
@media screen and (max-width: 768px) {
  .slice {
    max-width: 100%;
  }
}
@media screen and (min-width: 1920px) {
  .slice {
    border-left: 3px solid var(--tertiary-color);
    border-right: 3px solid var(--tertiary-color);
  }
}
.slice__container {
  height: 100%;
  max-width: 70%;
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: center;
  align-content: center;
  max-width: 1920px;
}
@media screen and (max-width: 1024px) {
  .slice__container {
    max-width: 80%;
  }
}
@media screen and (max-width: 900px) {
  .slice__container {
    max-width: 100%;
  }
}
.slice__container--depressed:before {
  position: absolute;
  box-shadow: inset 0px 10px 11px -7px rgba(0, 0, 0, 0.1), inset 0px -10px 11px -7px rgba(0, 0, 0, 0.1);
  content: " ";
  top: 0px;
  height: 100%;
  width: 100%;
  background-color: rgba(0, 0, 0, 0.04);
}
.slice__container--risen:after {
  position: absolute;
  box-shadow: 0px 0px 11px 7px rgba(0, 0, 0, 0.1);
  content: " ";
  top: 0px;
  height: 100%;
  width: 100%;
}
.slice__container--rounded-top:before {
  z-index: 0;
  border-radius: 100%;
  position: absolute;
  box-shadow: 0px -2px 14px 2px rgba(0, 0, 0, 0.1);
  background: white;
  width: 150vw;
  height: 400px;
  min-width: 1800px;
  bottom: -400px;
  content: "";
  top: 25px;
}
.slice__container--rounded-top:after {
  content: " ";
  position: absolute;
  background-color: var(--primary-color);
  padding-top: 100%;
  top: 100px;
  width: 100vw;
}
.slice__container--rounded-bottom:before {
  z-index: 0;
  border-radius: 100%;
  position: absolute;
  box-shadow: 0px 2px 14px 2px rgba(0, 0, 0, 0.1);
  background: white;
  width: 150vw;
  height: 400px;
  min-width: 1800px;
  content: "";
  bottom: 25px;
}
.slice__container--rounded-bottom:after {
  content: " ";
  position: absolute;
  background-color: var(--primary-color);
  padding-top: 100%;
  bottom: 100px;
  width: 100vw;
}
.slice__container--half-l {
  max-width: 50%;
  width: fit-content;
}
.slice__container--half-r {
  max-width: 50%;
  width: fit-content;
}
.slice__container--full {
  width: 100%;
}
@media screen and (max-width: 1024px) {
  .slice__container--full {
    max-width: 100%;
  }
}
.slice__container--no-height {
  height: initial;
  min-height: 508px;
}
.slice--100 {
  min-height: 100vh;
}
@media screen and (max-width: 768px) {
  .slice--100 {
    min-height: 100vh;
  }
}
.slice--10 {
  min-height: 10vh;
}
@media screen and (max-width: 768px) {
  .slice--10 {
    min-height: 100vh;
  }
}
.slice--15 {
  min-height: 15vh;
}
@media screen and (max-width: 768px) {
  .slice--15 {
    min-height: 100vh;
  }
}
.slice--fit {
  padding: 0px;
  min-height: 0vh;
  height: fit-content;
}
.slice__big-button, .slice__big-button-2 {
  background: none;
  border: 2px solid var(--tertiary-color);
  border-radius: 3px;
  color: var(--tertiary-color);
  min-width: 7em;
  z-index: 1;
  padding: 0.6em 2em;
  margin: 0.2em 0.5em;
  font-size: 14pt;
  animation: fade-in 0.8s 0.4s;
  animation-fill-mode: backwards;
}
.slice__big-button:hover, .slice__big-button-2:hover {
  cursor: pointer;
  color: var(--primary-color);
  border-color: var(--primary-color);
  transition: all 0.05s;
}
.slice__big-button-2:hover {
  cursor: pointer;
  color: var(--secondary-color-transparent);
  border-color: var(--secondary-color-transparent);
  transition: all 0.05s;
}
.slice__image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  overflow: hidden;
  min-width: 200px;
}
.slice--footer {
  background-color: var(--primary-color);
  min-height: 10vh;
  box-shadow: 0px 0px 7px 2px rgba(0, 0, 0, 0.2);
  z-index: 3;
}
.slice--empty {
  min-height: 100px;
  background: none;
}

.content-box, .content-box-fit, .content-box-full, .content-box-6-h, .content-box-6, .content-box-5-h, .content-box-5, .content-box-4-h, .content-box-4, .content-box-3-h, .content-box-3, .content-box-2-h, .content-box-2, .content-box-1_5-h, .content-box-1_5 {
  display: flex;
  position: relative;
  text-align: center;
  align-items: center;
  max-width: 1920px;
  justify-items: stretch;
  justify-content: space-around;
  z-index: 1;
  flex-direction: column;
  height: initial;
  width: 100%;
  line-height: 1.5em;
  min-width: 10em;
  min-height: fit-content;
}
@media screen and (max-width: 1024px) {
  .content-box, .content-box-fit, .content-box-full, .content-box-6-h, .content-box-6, .content-box-5-h, .content-box-5, .content-box-4-h, .content-box-4, .content-box-3-h, .content-box-3, .content-box-2-h, .content-box-2, .content-box-1_5-h, .content-box-1_5 {
    min-width: 215px;
  }
}
.content-box--29em {
  min-height: 29em;
}
.content-box--columns, .content-box--columns-rev {
  flex-direction: row;
  flex-wrap: wrap;
  align-items: normal;
  height: 100%;
}
@media screen and (max-width: 1024px) {
  .content-box--columns-rev {
    flex-direction: column-reverse;
  }
}
.content-box--l-align {
  align-items: start;
}
.content-box-1_5 {
  width: 66%;
}
@media screen and (max-width: 1024px) {
  .content-box-1_5 {
    width: 100%;
  }
}
.content-box-1_5-h {
  height: 50%;
}
.content-box-2 {
  width: 50%;
}
@media screen and (max-width: 1024px) {
  .content-box-2 {
    width: 100%;
  }
}
.content-box-2-h {
  height: 50%;
}
.content-box-3 {
  width: 33%;
}
@media screen and (max-width: 1024px) {
  .content-box-3 {
    width: 100%;
  }
}
.content-box-3-h {
  height: 33%;
}
.content-box-4 {
  width: 25%;
}
@media screen and (max-width: 1024px) {
  .content-box-4 {
    width: 100%;
  }
}
.content-box-4-h {
  height: 25%;
}
.content-box-5 {
  width: 20%;
}
@media screen and (max-width: 1024px) {
  .content-box-5 {
    width: 100%;
  }
}
.content-box-5-h {
  height: 20%;
}
.content-box-6 {
  width: 16.5%;
}
@media screen and (max-width: 1024px) {
  .content-box-6 {
    width: 100%;
  }
}
.content-box-6-h {
  height: 16.5%;
}
.content-box-full {
  height: 100%;
}
.content-box-fit {
  height: fit-content;
  margin: 4vh 0;
  padding: 4vh 0;
}
@media screen and (max-width: 425px) {
  .content-box-fit {
    padding: 0;
  }
}
.content-box--cen {
  justify-content: center;
}
.content-box--al-cen {
  align-items: center;
}
.content-box--justify-top {
  justify-content: start;
}
@media screen and (max-width: 425px) {
  .content-box--justify-top {
    justify-content: center;
  }
}
.content-box--justify-cen {
  justify-content: center;
}
.content-box--justify-bot {
  justify-content: end;
}
.content-box--350h {
  height: 350px;
}
.content-box--400h {
  height: 400px;
}
@media screen and (max-width: 425px) {
  .content-box--400h {
    min-height: 400px;
    height: fit-content;
  }
}

.content-frame, .content-frame-512, .content-frame-434, .content-frame-412, .content-frame-312, .content-frame-80w-big-top, .content-frame-80w-small-top, .content-frame-80w, .content-frame-90-big-top, .content-frame-90-small-top, .content-frame-90 {
  height: 100%;
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  align-items: center;
}
.content-frame-90 {
  width: 90%;
  height: 90%;
}
.content-frame-90-small-top {
  width: 90%;
  height: 90%;
  margin: 2vh 0vw;
}
.content-frame-90-big-top {
  width: 90%;
  height: 90%;
  margin: 5vh 0vw;
}
.content-frame-80w {
  width: auto;
  padding: 0 10%;
}
.content-frame-80w-small-top {
  margin: 0 10%;
  margin-top: 2vh;
}
.content-frame-80w-big-top {
  margin: 0 10%;
  margin-top: 5vh;
}
.content-frame-312 {
  width: 312px;
  height: 312px;
}
.content-frame-412 {
  width: 412px;
  height: 412px;
}
.content-frame-434 {
  width: 434px;
  height: 434px;
}
.content-frame-512 {
  width: 512px;
  height: 512px;
}
.content-frame--cen {
  justify-content: center;
}
.content-frame--top {
  justify-content: start;
}
.content-frame--shadow {
  transition: all 0.2s;
  box-shadow: inset 0 0 18px -7px var(--primary-color-transparent-0), 0 1px 1px 1px rgba(30, 30, 30, 0.1);
}
.content-frame--shadow:hover {
  transition: all 0s;
  box-shadow: inset 0 0 18px -7px var(--primary-color-transparent-0), 0 7px 10px 1px rgba(30, 30, 30, 0.2);
  filter: brightness(110%);
}
@media screen and (max-width: 425px) {
  .content-frame, .content-frame-512, .content-frame-434, .content-frame-412, .content-frame-312, .content-frame-80w-big-top, .content-frame-80w-small-top, .content-frame-80w, .content-frame-90-big-top, .content-frame-90-small-top, .content-frame-90 {
    width: 90vw;
    width: 85vw;
    padding: 15px;
  }
}
@media screen and (max-width: 425px) {
  .content-frame--contained {
    width: 100%;
    padding: 0;
  }
}

.gen-img, .gen-img-c, .gen-img-r, .gen-img-l, .gen-img-full, .gen-img-no-min {
  width: 100%;
  height: 100%;
  object-fit: cover;
  min-width: 200px;
  object-position: center top;
}
.gen-img-no-min {
  min-width: 0;
}
.gen-img-full {
  width: auto;
  height: auto;
}
.gen-img--shadow {
  border: 1px solid var(--secondary-color-transparent);
}
.gen-img--492 {
  object-fit: initial;
  width: 492px;
  height: 492px;
}
.gen-img-l {
  object-position: left top;
}
.gen-img-r {
  object-position: right top;
}
.gen-img-c {
  object-position: center;
}
.gen-img--contain {
  object-fit: contain;
}

.text-box, .tile-box-slide-right, .text-box-slide-right, .text-box-slide-right-1 {
  display: flex;
  position: relative;
  text-align: center;
  justify-items: center;
  justify-content: space-around;
  z-index: 1;
  animation: fade-in 0.8s 0.2s;
  animation-fill-mode: backwards, forwards;
  border-radius: 3px;
  flex-direction: column;
  height: fit-content;
  line-height: 1.5em;
  max-width: 100%;
  min-width: 10em;
  margin: 1em;
}
@media screen and (max-width: 1024px) {
  .text-box, .tile-box-slide-right, .text-box-slide-right, .text-box-slide-right-1 {
    min-width: 215px;
  }
}
.text-box-slide-right, .text-box-slide-right-1 {
  animation: fade-in 0.8s 0.4s, slide-right-entrance 1s -0.3s;
  animation-fill-mode: backwards, forwards;
}
.text-box-slide-right-1 {
  animation: fade-in 0.8s 0.6s, slide-right-entrance 1s -0.5s;
  animation-fill-mode: backwards, forwards;
}
.text-box--bg-w {
  background-color: white;
}
.text-box--close {
  margin-top: 1em;
  margin-bottom: 1em;
}
.text-box__body {
  height: 100%;
  display: flex;
  position: relative;
  flex-direction: column;
  margin: 2em;
  flex-wrap: wrap;
  align-content: center;
  justify-content: center;
  min-width: 33.3%;
  width: 100%;
}
@media screen and (max-width: 1024px) {
  .text-box__body {
    width: auto;
    max-width: 100%;
  }
}
.text-box__body--10 {
  min-width: 10%;
  width: 10%;
}
.text-box__body--20 {
  min-width: 20%;
  width: 20%;
}
.text-box__body--25 {
  min-width: 25%;
  width: 25%;
}
.text-box__body--33 {
  min-width: 33%;
  width: 33%;
}
.text-box__body--40 {
  width: 40%;
  min-width: 40%;
}
.text-box__body--45 {
  width: 45%;
  min-width: 45%;
}
.text-box__body--50 {
  width: 50%;
  min-width: 50%;
}
.text-box__body--60 {
  width: 60%;
  min-width: 60%;
}
.text-box__body--66 {
  width: 66%;
  min-width: 66%;
}
.text-box__body--80 {
  width: 80%;
  min-width: 80%;
}
.text-box__body--margin-5 {
  margin: 0 5em;
}
.text-box__body--expanding {
  overflow-y: hidden;
  height: 0px;
}
.text-box__expand-toggle {
  -webkit-tap-highlight-color: transparent;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -moz-visibility: hidden;
  z-index: 1;
  cursor: pointer;
  position: absolute;
  width: 100%;
  height: 4em;
  top: 0em;
  opacity: 0;
}
.text-box__expand-toggle:checked ~ .text-box__body--expanding {
  height: fit-content;
  overflow: visible;
}
.text-box__expand-toggle ~ .text-box__title, .text-box__expand-toggle ~ .text-box__title-4, .text-box__expand-toggle ~ .text-box__title-3, .text-box__expand-toggle ~ .text-box__title-2, .text-box__expand-toggle ~ .text-box__title-1, .text-box__expand-toggle ~ .text-box__title-hero {
  padding-right: 2em;
}
.text-box__expand-toggle ~ .text-box__title::after, .text-box__expand-toggle ~ .text-box__title-4::after, .text-box__expand-toggle ~ .text-box__title-3::after, .text-box__expand-toggle ~ .text-box__title-2::after, .text-box__expand-toggle ~ .text-box__title-1::after, .text-box__expand-toggle ~ .text-box__title-hero::after {
  position: absolute;
  right: 0em;
  content: "+";
}
.text-box__expand-toggle:checked ~ .text-box__title::after, .text-box__expand-toggle:checked ~ .text-box__title-4::after, .text-box__expand-toggle:checked ~ .text-box__title-3::after, .text-box__expand-toggle:checked ~ .text-box__title-2::after, .text-box__expand-toggle:checked ~ .text-box__title-1::after, .text-box__expand-toggle:checked ~ .text-box__title-hero::after {
  content: "-";
}
.text-box__title, .text-box__title-4, .text-box__title-3, .text-box__title-2, .text-box__title-1, .text-box__title-hero {
  z-index: 0;
  font-weight: bold;
  font-size: 1.2em;
  line-height: 1.2em;
  margin: 0.5em 12%;
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  justify-content: center;
}
.text-box__title-hero {
  font-size: 4.2em;
  line-height: 1.3em;
}
@media screen and (max-width: 512px) {
  .text-box__title-hero {
    font-size: 10vw;
  }
}
.text-box__title-1 {
  font-size: 3.2em;
  line-height: 1.1em;
}
@media screen and (max-width: 512px) {
  .text-box__title-1 {
    font-size: 7vw;
  }
}
.text-box__title-2 {
  font-size: 2.4em;
  line-height: 1.1em;
}
@media screen and (max-width: 512px) {
  .text-box__title-2 {
    font-size: 6vw;
  }
}
.text-box__title-3 {
  font-size: 1.8em;
  line-height: 1.1em;
}
@media screen and (max-width: 512px) {
  .text-box__title-3 {
    font-size: 5vw;
  }
}
.text-box__title-4 {
  font-size: 1.3em;
  line-height: 1.1em;
}
@media screen and (max-width: 512px) {
  .text-box__title-4 {
    font-size: 4vw;
  }
}
.text-box__paragraph, .text-box__paragraph--bold, .text-box__paragraph--x-close, .text-box__paragraph--close {
  flex-direction: column;
  align-items: center;
  display: flex;
  justify-content: center;
  width: 100%;
}
.text-box__paragraph--close {
  margin: 1em 0em;
}
.text-box__paragraph--x-close {
  margin: 0.25em 0em;
}
.text-box__paragraph--bold {
  font-weight: bold;
}
.text-box__paragraph--quote span::before, .text-box__paragraph--quote span::after {
  font-size: xx-large;
  content: '"';
}
.text-box__paragraph--r-align {
  align-items: initial;
  text-align: right;
}
.text-box__paragraph--l-align {
  align-items: initial;
  text-align: left;
}
.text-box__paragraph--sm {
  font-size: 0.8em;
}
.text-box__paragraph--bottom {
  position: relative;
  bottom: 0px;
}
.text-box__link {
  text-decoration: none;
  color: black;
}
.text-box__image-box {
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: hidden;
  max-height: 80%;
  margin: 1em;
  overflow: hidden;
}
.text-box__image-box--20 {
  width: 20%;
}
.text-box__image-box--30 {
  width: 30%;
}
.text-box__image-box--33 {
  width: 33%;
}
.text-box__image-box--40 {
  width: 40%;
}
.text-box__image-box--50 {
  width: 50%;
}
.text-box__image-box--circle-frame {
  border-radius: 50%;
}
@media screen and (max-width: 512px) {
  .text-box__image-box {
    margin: 1em;
  }
}
.text-box__image {
  width: 100%;
  height: 100%;
  object-fit: cover;
  overflow: hidden;
  border-radius: 3px;
  min-width: 200px;
}
.text-box__image:hover {
  transform: scale 1.2;
}
.text-box--columns {
  flex-direction: row;
  flex-wrap: wrap;
  vertical-align: top;
  align-items: center;
}
@media screen and (max-width: 1024px) {
  .text-box--columns {
    flex-direction: column;
  }
  .text-box--columns .text-box__body {
    height: fit-content;
    max-width: 100%;
  }
  .text-box--columns .text-box__image-box {
    width: 100%;
    max-height: 350px;
  }
  .text-box--columns .text-box__image-box--circle-frame {
    width: 80%;
    margin: 1em;
    max-width: 350px;
  }
}
.text-box--columns .text-box__body {
  height: 100%;
}
.text-box--shadow .text-box__body {
  box-shadow: 0 0px 8px 0 rgba(0, 0, 0, 0.2);
}
.text-box--no-margin {
  margin: 0px;
}
.text-box--no-entrance {
  animation: none;
}
.text-box--fade-only {
  animation: fade-in 0.8s 0.4s;
  animation-fill-mode: both;
}
.text-box--left-text {
  text-align: left;
  align-items: start;
}
.text-box--left-text .text-box__title, .text-box--left-text .text-box__title-hero, .text-box--left-text .text-box__title-1, .text-box--left-text .text-box__title-2, .text-box--left-text .text-box__title-3, .text-box--left-text .text-box__title-4 {
  margin: 0 0;
}
@media screen and (max-width: 1024px) {
  .text-box--left-text {
    text-align: center;
  }
}

.navigation {
  width: 100%;
  z-index: 3;
  height: fit-content;
  position: static;
}
.navigation__hamburger {
  -webkit-tap-highlight-color: rgba(255, 255, 255, 0);
  visibility: hidden;
  z-index: -1;
}
.navigation__bar {
  max-width: 1920px;
  z-index: 1;
  position: absolute;
  display: flex;
  flex-direction: row;
  align-items: center;
  flex-wrap: wrap;
  justify-content: center;
  align-content: center;
  width: 100%;
  min-height: 4em;
}
.navigation__bar--fixed {
  top: 0;
  position: fixed !important;
  z-index: 3 !important;
}
.navigation__bar--fixed > .navigation__left-side {
  transition: opacity 1s;
  opacity: 1 !important;
}
.navigation__bar--fixed > .navigation__special-button {
  transition: opacity 1s;
  opacity: 1 !important;
  pointer-events: auto;
}
.navigation__bar--fixed:hover {
  transition: color 0.3s cubic-bezier(0.1, 0.5, 0.1, 0.7);
  mix-blend-mode: unset;
}
.navigation__buttons {
  justify-self: center;
  right: 5%;
  position: absolute;
  align-content: space-even;
  display: flex;
  flex-wrap: wrap;
}
.navigation__buttons:after {
  background-color: var(--primary-color-transparent-0);
  -webkit-box-shadow: 0 0 30px 20px var(--primary-color-transparent-0);
  box-shadow: 0 0 30px 20px var(--primary-color-transparent-0);
  content: " ";
  position: absolute;
  z-index: -1;
  left: 10%;
  top: 50%;
  height: 0%;
  width: 80%;
}
.navigation__button {
  background: none;
  border: none;
  color: var(--secondary-color);
  min-width: 7em;
  font-size: 14pt;
  position: relative;
}
.navigation__button:hover {
  cursor: pointer;
  color: var(--tertiary-color-b);
  transition: all 0.1s;
}
.navigation__button:after {
  content: " ";
  position: absolute;
  z-index: -1;
  left: -15%;
  top: -50%;
  height: 200%;
  width: 130%;
}
.navigation__button--mobile {
  visibility: hidden;
  z-index: -1;
  position: absolute;
  pointer-events: none;
}
.navigation__button--active {
  color: var(--tertiary-color);
}
.navigation__special-button {
  background-color: var(--tertiary-color);
  color: white;
  transition: opacity 0.5s;
  opacity: 0;
  border: 2px solid var(--tertiary-color);
  border-radius: 3px;
  min-width: 7em;
  font-size: 14pt;
  right: 0;
  position: absolute;
  height: 2.2em;
  margin: 0.15em 0.5em;
  pointer-events: none;
}
.navigation__special-button--active {
  background-color: white;
  border-color: #aaa;
  color: #aaa;
  cursor: pointer;
  transition: all 0.1s;
}
.navigation__special-button:hover {
  background-color: var(--secondary-color);
  border-color: var(--secondary-color);
  cursor: pointer;
  transition: all 0.1s;
}
.navigation__left-side {
  align-content: center;
  flex-wrap: wrap;
  display: flex;
  font-size: 22pt;
  font-weight: bold;
  height: 2.2em;
  margin: 0.15em 0.5em;
  transition: opacity 0.5s;
  left: 0;
  position: absolute;
  height: 2em;
  margin: 0.5em;
}
.navigation__left-side:after {
  background-color: var(--primary-color-transparent-0);
  -webkit-box-shadow: 0 0 30px 20px var(--primary-color-transparent-0);
  box-shadow: 0 0 30px 20px var(--primary-color-transparent-0);
  content: " ";
  position: absolute;
  z-index: -1;
  left: 10%;
  top: 50%;
  height: 0%;
  width: 80%;
}
@media screen and (max-width: 768px) {
  .navigation {
    min-height: 0px;
    height: 0px;
    visibility: hidden;
  }
  .navigation--open {
    visibility: visible;
  }
  .navigation__left-side {
    opacity: 0;
    left: 0;
    position: absolute;
    height: 2em;
    margin: 0.5em;
  }
  .navigation__buttons {
    flex-direction: column;
    justify-content: center;
    width: 100%;
    left: 0;
  }
  .navigation__buttons:after {
    -webkit-box-shadow: none;
    box-shadow: none;
  }
  .navigation__special-button {
    visibility: hidden;
  }
  .navigation__hamburger {
    -webkit-tap-highlight-color: transparent;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-tap-highlight-color: rgba(255, 255, 255, 0);
    position: absolute;
    right: 8px;
    top: 8px;
    z-index: 3;
    background-size: cover;
    width: 36px;
    height: 36px;
    min-height: 2em;
    visibility: visible;
    z-index: 3;
  }
  .navigation__hamburger:hover {
    cursor: pointer;
  }
  .navigation__bar {
    height: 100%;
    top: 0;
    position: fixed !important;
    z-index: 4 !important;
    background-color: var(--primary-color);
    mix-blend-mode: difference;
  }
  .navigation__bar > .navigation__left-side {
    transition: opacity 1s;
    opacity: 0 !important;
  }
  .navigation__bar > .navigation__special-button {
    transition: opacity 1s;
    opacity: 1 !important;
    pointer-events: auto;
  }
  .navigation__hamburger-container {
    -webkit-tap-highlight-color: transparent;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -moz-visibility: hidden;
    position: absolute;
    height: fit-content;
    width: fit-content;
    display: flex;
    flex-wrap: no-wrap;
    flex-direction: column;
    justify-content: space-evenly;
    padding: 5px;
    align-content: center;
    align-items: center;
    background-color: none;
    border-radius: 5px;
    width: 100%;
    height: 100%;
    top: 0;
    right: 0px;
  }
  .navigation__hamburger-line {
    -webkit-tap-highlight-color: rgba(255, 255, 255, 0);
    position: relative;
    display: flex;
    z-index: 2;
    opacity: 0.8;
    background-size: cover;
    width: 26px !important;
    height: 0.25em;
    margin: 0em 0;
    transition: transform 0.2s;
    background-color: white;
    mix-blend-mode: difference;
  }
  .navigation__hamburger-button {
    width: 100%;
    height: 100%;
    opacity: 0;
    /*display: none;*/
    z-index: 3;
  }
  .navigation--open .navigation__bar {
    mix-blend-mode: unset;
  }
  .navigation--open .navigation__hamburger-line {
    background-color: black;
  }
  .navigation--open .navigation__hamburger-line:nth-child(2) {
    opacity: 0;
  }
  .navigation--open .navigation__hamburger-line:nth-child(1) {
    transform-origin: 0;
    transform: translate(5px, 0px) rotate(45deg) translate(1px, 0px);
  }
  .navigation--open .navigation__hamburger-line:nth-child(3) {
    transform-origin: 0;
    transform: translate(5px, 0px) rotate(-45deg) translate(1px, 0px);
  }
  .navigation--open .navigation__button {
    font-size: 32pt;
    margin: 0.5em 0;
    background-color: var(--primary-color) .navigation--open .navigation__button --mobile;
    background-color-visibility: visible;
    background-color-z-index: inherit;
    background-color-position: inherit;
    background-color-pointer-events: inherit;
  }
  .navigation--open .navigation__button--active {
    border-bottom: 0;
    border-radius: 2px;
    cursor: pointer;
    background-color: black;
    color: white;
    transition: all 0.2s;
  }
  .navigation--open .navigation__hamburger-container {
    background-color: rgba(0, 0, 0, 0);
  }
}

footer {
  max-width: 1920px;
  width: 100%;
}

/* Backgrounds */
.cloud-bg {
  background-image: url("./static/Images/cloud-background.png");
  background-position: center;
  background-size: auto;
}

.mail-bg {
  background-image: url("./static/Images/mail-background.jpg");
  background-position: center;
  background-size: cover;
}

.sea-bg {
  background-image: url("./static/Images/sea-background.jpg");
  background-position: center;
  background-size: cover;
}

.courses-bg {
  background-image: url("./static/Images/courses-background.jpg");
  background-position: center;
  background-size: cover;
}
@media screen and (max-width: 512px) {
  .courses-bg {
    background-position: 46% 50%;
  }
}

.table-bg-1 {
  background-image: url("./static/Images/table-background-1.jpg");
  background-position: center;
  background-size: cover;
}

.table-bg-2 {
  background-image: url("./static/Images/table-background.jpg");
  background-position: center;
  background-size: cover;
}

.toronto-bg {
  background-image: url("./static/Images/toronto-2560.jpg");
  background-position: 50% 55%;
  background-size: auto;
}
@media screen and (max-width: 1920px) and (max-height: 1000px) {
  .toronto-bg {
    background-image: url("./static/Images/toronto-1920.jpg");
  }
}

.main-bg {
  background-image: url("./static/Images/toronto.webp");
  background-position: 50% 35%;
  background-size: cover;
}

.main-bg-scroll {
  background-image: none;
  background-color: #879eca;
  max-width: 1920px;
}
.main-bg-scroll::after {
  top: 0px;
  max-width: 1920px;
  position: fixed;
}
.main-bg-scroll::before {
  background-image: url("./static/Images/toronto.webp");
  height: 100%;
  width: 100%;
  max-width: 1920px;
  content: "";
  position: fixed;
  background-position: 50% calc(35% + var(--parallax-10-position));
  background-size: cover;
  background-position-y: calc(35% + var(--parallax-10-position)) !important;
}
@media screen and (max-width: 1920px) and (min-height: 1601px) {
  .main-bg-scroll::before {
    background-image: url("./static/Images/toronto-1920.webp");
  }
}
@media screen and (max-width: 1600px) {
  .main-bg-scroll::before {
    background-image: url("./static/Images/toronto-1600.webp");
  }
}
@media screen and (max-width: 425px) {
  .main-bg-scroll::before {
    background-image: url("./static/Images/toronto-425.webp");
  }
}

.textured-bg-scroll::before {
  background-image: url("./static/Images/texture-1.webp");
  height: 100%;
  width: 100%;
  content: "";
  position: absolute;
  background-attachment: fixed;
  background-size: auto;
  background-position-y: var(--parallax-4-position);
}
@media screen and (max-width: 1920px) and (min-height: 1601px) {
  .textured-bg-scroll::before {
    background-image: url("./static/Images/texture-1.webp");
  }
}
@media screen and (max-height: 1600px) {
  .textured-bg-scroll::before {
    background-image: url("./static/Images/texture-1.webp");
  }
}

.textured-2-bg-scroll::before {
  background-image: url("./static/Images/texture-2.webp");
  height: 100%;
  width: 100%;
  content: "";
  position: absolute;
  background-attachment: fixed;
  background-size: initial;
  background-position-y: var(--parallax-4-position);
}
@media screen and (max-width: 1920px) and (min-height: 1601px) {
  .textured-2-bg-scroll::before {
    background-image: url("./static/Images/texture-2.webp");
  }
}
@media screen and (max-width: 1600px) {
  .textured-2-bg-scroll::before {
    background-image: url("./static/Images/texture-2.webp");
  }
}

.meeting-bg {
  background-image: url("./static/Images/meeting.webp");
  background-position: 50% 55%;
  background-size: cover;
}
@media screen and (max-width: 1920px) and (min-height: 1601px) {
  .meeting-bg {
    background-image: url("./static/Images/meeting-1920.webp");
  }
}
@media screen and (max-width: 1600px) {
  .meeting-bg {
    background-image: url("./static/Images/meeting-1600.webp");
  }
}
@media screen and (max-width: 425px) {
  .meeting-bg {
    background-image: url("./static/Images/meeting-425.webp");
  }
}

.meeting-bg-scroll {
  background-image: none;
  background-color: none;
  top: 0px;
  max-width: 1920px;
}
.meeting-bg-scroll::after {
  top: 0px;
  max-width: 1920px;
  position: fixed;
}
.meeting-bg-scroll::before {
  background-image: url("./static/Images/meeting.webp");
  height: 100%;
  width: 100%;
  max-width: 1920px;
  content: "";
  position: fixed;
  top: 0px;
  background-position: 50% 55%;
  background-size: cover;
  background-size: cover;
  background-position-y: calc(55% + var(--parallax-4-position)) !important;
}
@media screen and (max-width: 1920px) and (min-height: 1601px) {
  .meeting-bg-scroll::before {
    background-image: url("./static/Images/meeting-1920.webp");
  }
}
@media screen and (max-height: 1600px) {
  .meeting-bg-scroll::before {
    background-image: url("./static/Images/meeting-1600.webp");
  }
}
@media screen and (max-width: 425px) {
  .meeting-bg-scroll::before {
    background-image: url("./static/Images/meeting-425.webp");
  }
}

.mail-bg-scroll {
  background-image: none;
  background-color: none;
}
.mail-bg-scroll::after {
  position: fixed;
}
.mail-bg-scroll::before {
  background-image: url("./static/Images/mailbox-2160.webp");
  height: 100%;
  width: 100%;
  content: "";
  position: fixed;
  background-position: 50% 55%;
  background-size: cover;
  background-position-y: calc(55% + var(--parallax-10-position)) !important;
}
@media screen and (max-width: 1920px) and (min-height: 1601px) {
  .mail-bg-scroll::before {
    background-image: url("./static/Images/mailbox-1920.webp");
  }
}
@media screen and (max-height: 1600px) {
  .mail-bg-scroll::before {
    background-image: url("./static/Images/mailbox-1600.webp");
  }
}

.sunrise-bg {
  background-image: url("./static/Images/sunrise.jpg");
  background-color: #903d45;
  background-position: bottom;
  background-size: cover;
}

.worker-bg {
  background-image: url("./static/Images/worker.webp");
  background-position: 50% 50%;
  height: 430px;
  background-size: auto;
}
@media screen and (max-width: 1920px) and (min-height: 1601px) {
  .worker-bg {
    background-image: url("./static/Images/worker-1920.webp");
    background-position: 50% 55%;
  }
}
@media screen and (max-height: 1600px) {
  .worker-bg {
    background-image: url("./static/Images/worker-1600.webp");
    background-position: 50% 55%;
  }
}

/* CARD SECTION */
.card-box {
  display: flex;
  position: relative;
  text-align: center;
  justify-items: center;
  justify-content: center;
  z-index: 1;
  margin: 2em;
  animation: fade-in 0.8s 0.2s, slide-down-entrance 1s -0.3s;
  animation-fill-mode: backwards, forwards;
  border-radius: 3px;
  flex-direction: row;
  height: fit-content;
  width: 100%;
  min-width: 420px;
}
.card-box__card {
  position: relative;
  background-color: var(--primary-color);
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
  text-align: center;
  transition: max-width 0.5s ease-in-out -0.2s, flex 0.5s ease-in-out -0.2s, opacity 1s;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
}
.card-box__card--clickable {
  transition: transform 0.3s ease-in-out -0.1s, box-shadow 0.2s ease-in-out -0.1s;
}
.card-box__card--clickable:hover {
  transition: transform 0.3s ease-in-out -0.1s, box-shadow 0.2s ease-in-out -0.1s;
  transform: scale(1.01);
  box-shadow: 0 4px 12px 1px rgba(0, 0, 0, 0.2);
}
.card-box__card--2 {
  flex: 0 0 45%;
  max-width: 45%;
  min-height: 50vh;
  margin: 5%;
}
.card-box__card--3 {
  flex: 0 0 31%;
  max-width: 31%;
  height: 15em;
  margin: 1%;
}
.card-box__card--6 {
  flex: 0 0 31%;
  max-width: 15%;
  height: 15em;
  margin: 1%;
}
.card-box__image {
  width: 100%;
  max-height: 60%;
  object-fit: cover;
  position: relative;
}
.card-box__body {
  display: flex;
  flex-direction: column;
  flex-wrap: nowrap;
  align-content: center;
  justify-content: space-evenly;
  height: calc(40% - 2em);
  min-width: 33.3%;
  padding: 1em;
}
.card-box__paragraph {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  align-content: center;
  justify-content: center;
  margin: 0em 1em;
  line-height: 1.35;
  width: 100%;
}
.card-box__title {
  font-weight: bold;
  max-height: 50%;
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  align-content: center;
  justify-content: center;
  line-height: 1.1em;
}
.card-box__title--1 {
  font-size: 1.7em;
}
.card-box__title--2 {
  font-size: 1.5em;
}
.card-box__title--3 {
  font-size: 1.3em;
}
.card-box__title--4 {
  font-size: 1.1em;
}
@media screen and (max-width: 1024px) {
  .card-box {
    flex-direction: column;
    margin-left: 0;
    margin-right: 0;
    min-width: 280px;
  }
  .card-box__card {
    min-height: 25vh;
    margin: 0px;
    height: 25vh;
    width: 100%;
    max-width: 100%;
    margin: 0.2em 0px;
  }
  .card-box__card .card-box__body {
    height: fit-content;
    width: 100%;
  }
  .card-box__card .card-box__image {
    width: 100%;
    max-height: 350px;
  }
  .card-box__card .card-box__image--circle-frame {
    max-width: 350px;
  }
}

.services-card {
  display: flex;
  flex-wrap: wrap;
  flex-direction: row;
  text-align: center;
  flex: 0 0 25%;
  max-width: 25%;
  height: 20em;
  margin: 1em;
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2);
  transition: max-width 0.5s ease-in-out -0.2s, flex 0.5s ease-in-out -0.2s, opacity 1s;
}

.services-card-image-title {
  display: flex;
  flex-wrap: wrap;
  align-content: center;
  justify-content: center;
  /*background-image: url('./static/Images/therapist.jpg');*/
  background-position: 60%;
  background-size: cover;
  width: 100%;
  height: 70%;
  transition: width 0.5s ease-in-out 0.5s;
  overflow: hidden;
}

/*.services-card-body {
	width: 50%;
	opacity: 0;
	visibility: hidden;
	transition: visibility 0.5s 0s, opacity 0.5s 0s;
}*/
.tile-box {
  display: flex;
  position: relative;
  text-align: center;
  justify-items: center;
  justify-content: center;
  flex-wrap: wrap;
  z-index: 1;
  animation: fade-in 0.8s 0.2s, slide-down-entrance 1s -0.3s;
  animation-fill-mode: backwards, forwards;
  flex-direction: row;
  height: fit-content;
  line-height: 1.5em;
  width: 100%;
}
.tile-box-slide-right {
  animation: fade-in 0.8s 0.2s, slide-right-entrance 1s -0.3s;
  animation-fill-mode: backwards, forwards;
}
.tile-box__tile {
  height: fit-content;
  width: fit-content;
  margin: 0.2em 0.4em;
  padding: 0.2em 0.4em;
  border: 1px solid black;
  border-radius: 2px;
}
.tile-box__tile:hover {
  background-color: black;
  color: white;
  transition: all 0.15s;
}
.tile-box--narrow {
  margin: 0 12%;
}

.list-box {
  text-align: start;
}
.list-box__item {
  text-align: left;
}

.form-box__input-container {
  vertical-align: top;
}
.form-box__label {
  display: flex;
  width: 100%;
  margin: 1em 0em 0.5em 0em;
}
.form-box__input {
  border: 0;
  background-color: rgba(0, 0, 0, 0.1);
}
.form-box__input--base-input, .form-box__input--textarea, .form-box__input--text {
  background: none;
  border: 1px solid #000;
  border-radius: 2px;
  padding: 0.5em 1.25em;
  z-index: 1;
}
.form-box__input--text {
  height: 1.5em;
  width: 22em;
  z-index: 1;
}
.form-box__input--textarea {
  height: 7em;
  width: 22em;
  z-index: 1;
}
.form-box__submit {
  background: none;
  border: 2px solid var(--tertiary-color);
  border-radius: 3px;
  color: var(--tertiary-color);
  min-width: 7em;
  z-index: 1;
  padding: 0.6em 2em;
  margin: 0.2em 0.5em;
  font-size: 14pt;
  animation: fade-in 0.8s 0.4s;
  animation-fill-mode: backwards;
}
.form-box__submit:hover {
  cursor: pointer;
  color: var(--secondary-color);
  border-color: var(--secondary-color);
  transition: all 0.05s;
}
.form-box__submit--disabled {
  background-color: white;
  border-color: #eee;
  color: #eee;
  cursor: default;
  transition: all 0.1s;
}
.form-box__submit--disabled:hover {
  background-color: white;
  border-color: #eee;
  color: #eee;
  cursor: default;
  transition: all 0.1s;
}
.form-box__error-text {
  color: red;
}

.gallery__img {
  -webkit-animation-name: fade;
  -webkit-animation-iteration-count: infinite;
  -webkit-animation-duration: 10s;
  animation-name: fade;
  animation-iteration-count: infinite;
  animation-duration: 10s;
}
.gallery__img--1 {
  -webkit-animation-delay: 0s;
}
.gallery__img--2 {
  -webkit-animation-delay: 5s;
}

.wipe-frame {
  width: 100%;
  height: 100%;
  right: 0;
  background-position: right;
  position: absolute;
  max-width: 100%;
}
.wipe-frame::before {
  position: absolute;
  z-index: 1;
  left: 0px;
  width: 3px;
  background-color: var(--tertiary-color);
  height: 100%;
  content: "";
}

.wipe-container {
  min-height: 360px;
}
.wipe-containerimg {
  object-position: right center;
}

.wipe-img {
  width: 100%;
  height: 100%;
  left: 0;
  position: absolute;
  object-position: right center;
  object-fit: none;
}
@media screen and (max-width: 1510px) {
  .wipe-img {
    object-position: right;
    object-fit: cover;
  }
}
@media screen and (max-width: 1024px) {
  .wipe-img {
    object-position: right center;
    object-fit: none;
  }
}
@media screen and (max-width: 768px) {
  .wipe-img {
    object-position: right center;
    object-fit: cover;
  }
}

.--no-bg {
  background: none;
}

.--primary-color-font {
  color: var(--primary-color);
}

.--primary-color-bg {
  background-color: var(--primary-color);
}

.--primary-color-trans-bg {
  background-color: var(--primary-color-transparent);
}

.--primary-multi-bg-1::before, .--primary-multi-bg-1-narrow::before {
  content: "";
  position: absolute;
  height: 100%;
  width: 100%;
  background: radial-gradient(ellipse at 150% 200%, var(--secondary-color-b), var(--primary-color) 70%, var(--primary-color));
}
.--primary-multi-bg-1-narrow::before {
  border-radius: 5px;
}

.--secondary-color-font {
  color: var(--secondary-color);
}

.--secondary-color-bg {
  background-color: var(--secondary-color);
}

.--secondary-color-trans-bg {
  background-color: var(--secondary-color-transparent-2);
}

.--secondary-color-trans-bg-hover {
  transition: background-color 0.1s;
}
.--secondary-color-trans-bg-hover:hover {
  transition: background-color 0.05s;
  background-color: var(--secondary-color);
}

.--secondary-color-b-bg {
  background-color: var(--secondary-color-b);
}

.--secondary-color-b-trans-bg {
  background-color: var(--secondary-color-b-transparent);
}

.--tertiary-color-font {
  color: var(--tertiary-color);
}

.--tertiary-color-bg {
  background-color: var(--tertiary-color);
}

.--tertiary-color-b-bg {
  background-color: var(--tertiary-color-b);
}

--tertiary-color-top-bor {
  border-top: 1px solid var(--tertiary-color);
}

.--margin-t-5 {
  margin-top: 10px;
}

.--cover {
  position: absolute;
  height: 100%;
  width: 100%;
  z-index: 1;
}

.--shadow {
  box-shadow: 0px 0px 7px 2px rgba(0, 0, 0, 0.1);
}

.--corners-15 {
  border-radius: 15px;
}

.--shadow-bottom {
  box-shadow: 0px 3px 7px 2px rgba(0, 0, 0, 0.2);
}

.invisible {
  opacity: 0;
}

body {
  margin: 0;
  font-family: var(--primary-font), verdana;
  color: var(--secondary-color);
  font-weight: 100;
}

body {
  display: flex;
  flex-direction: column;
  flex-wrap: wrap;
  align-content: center;
  min-height: 100vh;
  height: fit-content;
  width: 100%;
  background-color: var(--secondary-color);
}

.cover, .cover--medium:not(.hidden-scroll)::after, .cover--light:not(.hidden-scroll)::after, .cover--heavy-accent:not(.hidden-scroll)::after, .cover--accent:not(.hidden-scroll)::after, .cover:not(.hidden-scroll)::after {
  animation: none;
  animation-fill-mode: backwards;
  position: absolute;
  width: 100%;
  height: 100%;
  content: " ";
  top: 0px;
}
.cover:not(.hidden-scroll)::after, .cover--medium:not(.hidden-scroll)::after, .cover--light:not(.hidden-scroll)::after, .cover--heavy-accent:not(.hidden-scroll)::after, .cover--accent:not(.hidden-scroll)::after {
  background-color: rgba(220, 230, 230, 0.85);
}
.cover--accent:not(.hidden-scroll)::after {
  background-color: rgba(150, 140, 140, 0.3);
}
.cover--heavy-accent:not(.hidden-scroll)::after {
  background: linear-gradient(rgba(190, 180, 185, 0.9) 2%, rgba(190, 180, 185, 0.65));
}
.cover--light:not(.hidden-scroll)::after {
  background-color: rgba(220, 230, 230, 0.25);
}
.cover--medium:not(.hidden-scroll)::after {
  background-color: rgba(220, 230, 230, 0.75);
}
.cover--animate:not(.hidden-scroll)::after {
  animation: fade-in 1s 0s;
  animation-fill-mode: backwards;
}
.cover--scroll:not(.hidden-scroll)::after {
  position: fixed;
}

.box-bg-white::before {
  position: absolute;
  height: 100%;
  width: 100%;
  content: " ";
  z-index: -1;
  border-radius: 3px;
  background-color: rgba(240, 240, 240, 0.75);
}
.box-bg-white--heavy::before {
  position: absolute;
  height: 100%;
  width: 100%;
  content: " ";
  z-index: -1;
  border-radius: 3px;
  background-color: rgba(255, 255, 255, 0.9);
}
.box-bg-white--solid::before {
  position: absolute;
  height: 100%;
  width: 100%;
  content: " ";
  z-index: -1;
  border-radius: 3px;
  background-color: rgb(255, 255, 255);
}

.vert-grad-border .text-box__body:after {
  position: absolute;
  width: calc(100% + 4em);
  left: -2em;
  height: 100%;
  content: " ";
  border: solid;
  border-image: linear-gradient(rgba(0, 0, 0, 0) 25%, #000, rgba(0, 0, 0, 0) 75%) 1;
  border-width: 0px 1px;
  border-style: solid;
}
.vert-grad-border--left .text-box__body:after {
  position: absolute;
  width: calc(100% + 4em);
  left: -2em;
  height: 100%;
  content: " ";
  border: solid;
  border-image: linear-gradient(rgba(0, 0, 0, 0) 25%, #000, rgba(0, 0, 0, 0) 75%) 1;
  border-width: 0px 0px 0px 1px;
  border-style: solid;
}
.vert-grad-border--right .text-box__body:after {
  position: absolute;
  width: calc(100% + 4em);
  left: -2em;
  height: 100%;
  content: " ";
  border: solid;
  border-image: linear-gradient(rgba(0, 0, 0, 0) 25%, #000, rgba(0, 0, 0, 0) 75%) 1;
  border-width: 0px 1px 0px 0px;
  border-style: solid;
}
.vert-grad-border--bottom .text-box__body:after {
  position: absolute;
  width: calc(100% + 4em);
  left: -2em;
  height: 100%;
  content: " ";
  border: solid;
  display: block;
  border-image: linear-gradient(rgba(0, 0, 0, 0) 25%, #000, rgba(0, 0, 0, 0) 75%) 1;
  border-width: 0px 0px 1px 0px;
  border-style: solid;
}
@media screen and (max-width: 1024px) {
  .vert-grad-border .text-box__body:after {
    visibility: hidden;
  }
  .vert-grad-border--left .text-box__body:after {
    visibility: hidden;
  }
  .vert-grad-border--right .text-box__body:after {
    visibility: hidden;
  }
  .vert-grad-border--bottom .text-box__body:after {
    visibility: hidden;
  }
}

@media screen and (max-width: 1024px) {
  .--reverse-col-tablet {
    flex-direction: column-reverse;
  }
}

.--home-title {
  position: relative;
}
.--home-title::before {
  z-index: -1;
  position: absolute;
  content: "";
  height: 100%;
  width: 100%;
  left: -136px;
  top: 35%;
  background-image: url("./static/Images/dot-title.webp");
  background-repeat: no-repeat;
}
@media screen and (max-width: 1024px) {
  .--home-title::before {
    left: -16vw;
    background-size: 15vw;
    width: 15vw;
    left: auto;
    right: 0px;
    top: 1.1em;
  }
}
@media screen and (max-width: 425px) {
  .--home-title::before {
    left: auto;
    right: 0px;
    top: 1.1em;
    background-size: 20vw;
    width: 20vw;
  }
}

.--dots-background::after {
  z-index: 0;
  left: calc(-120px + 5vw);
  position: absolute;
  content: "";
  height: 100%;
  width: 201px;
  background-image: url("./static/Images/dot-side.webp");
  background-repeat: repeat-y;
}
@media screen and (min-width: 1920px) {
  .--dots-background::after {
    left: 0;
  }
}
@media screen and (max-width: 1024px) {
  .--dots-background::after {
    top: 50px;
    left: -160px;
  }
}

.--dots-background-r::after {
  z-index: 0;
  right: calc(-120px + 5vw);
  position: absolute;
  content: "";
  height: 100%;
  width: 201px;
  background-image: url("./static/Images/dot-side.webp");
  background-repeat: repeat-y;
  background-position: 40%;
  transform: rotateY(180deg);
}
@media screen and (min-width: 1920px) {
  .--dots-background-r::after {
    right: 0;
  }
}
@media screen and (max-width: 1024px) {
  .--dots-background-r::after {
    top: 50px;
    right: -160px;
  }
}

.--dots-background-bot {
  border-bottom: 3px solid var(--tertiary-color);
  border-top: 3px solid var(--tertiary-color);
}
.--dots-background-bot::after {
  z-index: 0;
  left: calc(-95px + 5vw);
  position: absolute;
  content: "";
  height: 425px;
  width: 196px;
  bottom: -8px;
  background-position: 0% 100%;
  background-image: url("./static/Images/dots-bottom.webp");
  background-repeat: no-repeat;
}
@media screen and (min-width: 1920px) {
  .--dots-background-bot::after {
    left: 0;
  }
}

.--dots-background-r-bot {
  border-bottom: 3px solid var(--tertiary-color);
  border-top: 3px solid var(--tertiary-color);
}
.--dots-background-r-bot::after {
  z-index: 0;
  right: calc(-95px + 5vw);
  position: absolute;
  content: "";
  height: 425px;
  width: 196px;
  bottom: -8px;
  background-position: 100% 100%;
  background-image: url("./static/Images/dots-bottom.webp");
  background-repeat: no-repeat;
  transform: rotateY(180deg);
}
@media screen and (min-width: 1920px) {
  .--dots-background-r-bot::after {
    right: 0;
  }
}

.--margin-t-100 {
  margin-top: 100px;
}

.--margin-b-100 {
  margin-bottom: 100px;
}

.--margin-tb-100 {
  margin-top: 100px;
  margin-bottom: 100px;
}

.--margin-t-50 {
  margin-top: 50px;
}

.--margin-b-50 {
  margin-bottom: 50px;
}

.--margin-tb-50 {
  margin-top: 50px;
  margin-bottom: 50px;
}

.--italics {
  font-style: italic;
}

.parallax-4::before {
  background-position-y: var(--parallax-4-position);
}

.parallax-10::before {
  background-position-y: var(--parallax-10-position);
}

/*# sourceMappingURL=index.css.map */