/* STYLES FOR ABOVE THE FOLD */
/*-- -------------------------- -->
<---           Hero             -->
<--- -------------------------- -*/
/* Mobile - 360px */
@media only screen and (min-width: 0rem) {
  #hero {
    overflow: hidden;
    padding-bottom: 6.25rem;
    padding: 0 1rem;
    position: relative;
    text-align: center;
    z-index: 1;
    margin-top: 70px;
  }
  #hero .cs-picture {
    z-index: -2;
    position: absolute;
    top: 0;
    left: 0;
    display: block;
    height: 100%;
    /* Background Image */
    width: 100%;
  }
  #hero .cs-picture img {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    /* Makes image act like a background-image */
    object-fit: cover;
  }
  #hero .cs-picture:before {
    z-index: 1;
    position: absolute;
    top: 0;
    left: 0;
    /* Black Color Overlay */
    content: "";
    opacity: 0.6;
    display: block;
    background: #000;
    height: 100%;
    width: 100%;
    /* prevents the cursor from interacting with it */
    pointer-events: none;
  }
  #hero .cs-container {
    position: relative;
    margin: auto;
    max-width: 80em;
    width: 100%;
    padding: clamp(9em, 17vw, 17.5em) 0;
  }
  #hero .cs-flex-group {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    margin: auto;
    margin-top: 100px;
    /* 60px - 220px */
    margin-bottom: clamp(3.75em, 15.5vw, 13.75em);
    /* 464px - 562px */
    width: 100%;
    box-sizing: border-box;
  }
  #hero .cs-title {
    width: 100%;
    color: var(--bodyTextColorWhite);
    text-align: center;
    font: 400 clamp(1rem, 8vw, 2.7rem)/calc(1em + 12px) "REM", sans-serif;
    max-width: 85vw;
  }
  #hero .cs-title .br-desktop {
    display: none;
  }
  #hero .cs-title .br-mobile {
    display: inline;
  }
  #hero .cs-text {
    /* 32px - 40px */
    margin: 0 auto clamp(2rem, 4vw, 2.5rem) auto;
    /* 40px - 48px */
    margin-bottom: 24px;
    font: 1.1em/calc(1em + 12px) "REM", sans-serif;
    color: var(--bodyTextColorWhite);
    text-align: center;
    max-width: 100%;
    width: 100%;
  }
  #hero .cs-text .br-mobile {
    display: none;
  }
  #hero .hero-buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    align-items: center;
    justify-content: center;
    width: 60%;
  }
  #hero .hero-buttons .cs-button-gray,
  #hero .hero-buttons .cs-button-outline {
    padding: 16px 50px;
    line-height: 1.5em;
    font-weight: 500;
    width: 100%;
  }
}
@media only screen and (min-width: 575px) {
  #hero .cs-title {
    max-width: 85%;
  }
  #hero .cs-text .br-mobile {
    display: inline;
  }
  #hero .hero-buttons {
    width: unset;
  }
  #hero .hero-buttons .cs-button-gray,
  #hero .hero-buttons .cs-button-outline {
    width: max-content;
  }
}
/* Tablet - 768px */
@media only screen and (min-width: 48rem) {
  #hero {
    padding: 0 clamp(2em, 5vw, 2.5em);
  }
  #hero .cs-container {
    padding: clamp(9em, 17vw, 17.5em) 0;
    padding-bottom: 0;
  }
  #hero .cs-title {
    font: 400 clamp(1rem, 8vw, 2.9rem)/calc(1em + 12px) "REM", sans-serif;
    max-width: 100%;
  }
  #hero .cs-title .br-desktop {
    display: inline-block;
  }
  #hero .cs-title .br-mobile {
    display: none;
  }
  #hero .cs-text {
    font: 1.25em/calc(1em + 12px) "REM", sans-serif;
    max-width: 100%;
  }
  #hero .cs-text .br-mobile {
    display: inline;
  }
  #hero .cs-button-solid {
    margin-right: 1.25rem;
    margin-bottom: 0;
  }
  #hero .hero-buttons {
    gap: 30px;
  }
}
/* Desktop - 1300px */
@media only screen and (min-width: 81.25em) {
  #hero .cs-flex-group {
    margin-top: 30px;
  }
  #hero .cs-picture {
    max-height: 800px;
  }
  #hero .cs-title {
    width: 100%;
    color: var(--bodyTextColorWhite);
    text-align: center;
    font: 400 clamp(1rem, 8vw, 3.8rem)/calc(1em + 12px) "REM", sans-serif;
    max-width: 75%;
  }
  #hero .cs-text {
    max-width: 100%;
  }
}
@media only screen and (min-width: 1441px) {
  #hero {
    margin-top: 120px;
  }
  .cs-picture {
    max-height: 900px !important;
  }
}

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