:root {
  --limegreen: #18ff3d;
  --darkgreen: #1c4832;
  --palegreen: #a6e5d2;
  --lightgreen: #edfeef;
  --white: #ffffff;
  --stronggreen: #45bf96;

  --family: "neue-haas-grotesk-text", sans-serif;
  --title: "metropolisregular", "neue-haas-grotesk-text", sans-serif;
  --regular: 400;
  --bold: 700;
}

@font-face {
  font-family: "metropolisregular";
  src:
    url("../fonts/metropolisdisplay-webfont.woff2") format("woff2"),
    url("../fonts/metropolisdisplay-webfont.woff") format("woff");
  font-weight: normal;
  font-style: normal;
}

/* Text for screen readers only; shown when focused (the skip link). Same as the parent theme's. */
.screen-reader-text {
  clip: rect(1px, 1px, 1px, 1px);
  position: absolute !important;
  height: 1px;
  width: 1px;
  overflow: hidden;
}

.screen-reader-text:focus {
  background-color: #f1f1f1;
  border-radius: 3px;
  box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
  clip: auto !important;
  color: #21759b;
  display: block;
  font-size: 14px;
  font-size: 0.875rem;
  font-weight: bold;
  height: auto;
  left: 5px;
  line-height: normal;
  padding: 15px 23px 14px;
  text-decoration: none;
  top: 5px;
  width: auto;
  z-index: 100000; /* Above the WP toolbar. */
}

.desktop {
  display: block;
}
.mobile {
  display: none;
}
.small-desktop {
  display: block;
}
.small-mobile {
  display: none;
}

/* Full-width video (Home, Building). */
.page-video {
  width: 100%;
  line-height: 0; /* no gap under the video */
}
.page-video video {
  width: 100%;
  height: auto;
  display: block;
  object-fit: cover;
}

/* Home intro video pause/play button: right-hand end of the down-arrow row. */
.intro-down-module {
  position: relative;
  --video-toggle-bottom: -3px; /* centres the 44px button on the arrow */
}
@media (max-width: 575.98px) {
  .intro-down-module {
    --video-toggle-bottom: -7px;
  }
}
.intro-video-toggle {
  position: absolute;
  right: 12px;
  bottom: var(--video-toggle-bottom, 0px);
  z-index: 5;
  width: 44px;
  height: 44px;
  padding: 0;
  border: 1px solid rgba(255, 255, 255, 0.8);
  border-radius: 50%;
  background-color: rgba(28, 72, 50, 0.45);
  display: flex;
  align-items: center;
  justify-content: center;
}
.intro-video-toggle[hidden] {
  display: none;
}
/* Pause icon: two bars. */
.intro-video-toggle-icon {
  box-sizing: border-box;
  width: 14px;
  height: 16px;
  border-left: 4px solid #fff;
  border-right: 4px solid #fff;
}
/* Play icon: a triangle. */
.intro-video-toggle.is-paused .intro-video-toggle-icon {
  width: 0;
  height: 0;
  margin-left: 4px;
  border-style: solid;
  border-width: 8px 0 8px 14px;
  border-color: transparent transparent transparent #fff;
}

/* Home intro background video. Fills the intro from the start, and is centred
   like the background photo behind it (its first frame), so the picture
   doesn't shift sideways when the video starts playing. */
#myVideo {
  position: absolute;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.color-darkgreen {
  color: var(--darkgreen);
}
.color-limegreen {
  color: var(--limegreen);
}
.color-lightgreen {
  color: var(--lightgreen);
}
.color-palegreen {
  color: var(--palegreen);
}
.color-white {
  color: var(--white);
}

.bg-darkgreen {
  background-color: var(--darkgreen);
}
.bg-lightgreen {
  background-color: var(--lightgreen);
}
.bg-palegreen {
  background-color: var(--palegreen);
}
.bg-white {
  background-color: var(--white);
}

html,
body {
  padding: 0;
  margin: 0;
  background-color: #edeae7;
  font-family: var(--family) !important;
  font-weight: var(--regular);
  font-style: normal;
}
html {
  scroll-behavior: smooth;
}
hr {
  opacity: 1 !important;
}
.divide-module h2 {
  font-family: "metropolisregular", "neue-haas-grotesk-text", sans-serif;
  font-size: 120px;
  margin: 30px 0 20px;
  line-height: 100px !important;
}
.privacy-section h2 {
  font-family: "neue-haas-grotesk-text", sans-serif !important;
  font-size: 36px !important;
}

button {
  border: none;
  background-color: transparent;
}
#app {
  padding: 0;
  margin: 0;
  overflow: hidden;
}
/* Scroll reveal: [data-reveal] elements fade up as they come into view,
   staggered when several arrive together (Reveal in main.js). Only while
   html.reveal-on is set (header.php: JS running, motion allowed). Uses the
   `translate` property so it doesn't clash with elements positioned with
   `transform` (e.g. the hero title and logo). */
.reveal-on [data-reveal] {
  transition: opacity 0.8s ease, translate 0.8s ease;
  transition-delay: var(--reveal-delay, 0s);
}
.reveal-on [data-reveal]:not(.is-revealed) {
  opacity: 0;
  translate: 0 24px;
}
@media print {
  .reveal-on [data-reveal] {
    opacity: 1 !important;
    translate: none !important;
  }
}

h1.header-title {
  font-family: var(--title) !important;
  color: var(--limegreen);
  /* Each size scales down if the longest word ("sustainability", about 6.1em
     wide) wouldn't fit the screen; line-height ratios match the old px values. */
  font-size: min(180px, calc((100vw - 24px) / 6.4));
  line-height: 0.944;
  text-align: center;
}
h3 {
}
.g-h3-padded {
  font-size: 26px;
  margin: 60px 0 20px;
}

.g-para-mb-lg {
  margin-bottom: 120px;
}
.g-para-mb-md {
  margin-bottom: 60px;
}
.g-para-mt-md {
  margin-top: 60px;
}
.g-div-pad-md {
  /* Vertical only, so a .container keeps its side padding. */
  padding-top: 60px;
  padding-bottom: 60px;
}

/* NAVIGATION */

.g-nav {
  position: fixed;
  z-index: 999;
  width: 100%;
  left: 0;
  top: 0;
}

/* The menu panel opens below the header bar, so the logo and the close
   cross stay visible. --g-nav-bar-height is 84px (64px on phones). */
.g-nav {
  --g-nav-bar-height: 84px;
}
.g-nav-link-container {
  position: absolute;
  top: var(--g-nav-bar-height);
  height: calc(100vh - var(--g-nav-bar-height));
  height: calc(100svh - var(--g-nav-bar-height));
  background-color: var(--darkgreen);
  width: 100vw;
  left: 0;
  /* Hidden (and out of the tab order) once the slide-out has finished. */
  transition: transform 0.6s ease-in-out, visibility 0s 0.6s;
  transform: translateX(-100%);
  visibility: hidden;
  overflow-x: hidden;
  overflow-y: auto; /* short screens, e.g. a phone in landscape */
}
/* No scrolling the page behind the open menu. */
html.g-nav-open {
  overflow: hidden;
}

/* A column, so the tagline sits at the bottom of the panel when there's room
   and simply follows the links when there isn't (short screens). */
.g-nav-link-container-inner {
  position: relative;
  left: calc(140px);
  padding-top: 40px;
  padding-bottom: 20px;
  min-height: 100%;
  display: flex;
  flex-direction: column;
}
.g-nav-link-container-inner-tag {
  margin-top: auto;
  padding-top: 24px;
  color: #fff;
  font-size: 19px;
}

.g-nav-link-container-inner ul {
  padding: 0 !important;
  list-style: none;
  margin-bottom: 0;
}

.g-nav-bar {
  position: absolute;
  height: 84px;
  width: 100%;
  background-color: rgba(255, 255, 255, 0.9);
  top: 0;
  left: 0;
}

/* Burger: three lime bars (32px wide, 3px thick, 12px apart) in a 44px tap
   target. Open, the middle bar fades and the others turn into a cross. */
.g-nav-burger {
  position: absolute;
  top: 20px;
  right: 28px;
  width: 44px;
  height: 44px;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
}
.g-nav-burger-bar {
  position: absolute;
  left: 6px;
  width: 32px;
  height: 3px;
  background-color: var(--limegreen);
  transition: transform 0.3s ease, opacity 0.2s ease;
}
.g-nav-burger-bar:nth-child(1) {
  top: 8.5px;
}
.g-nav-burger-bar:nth-child(2) {
  top: 20.5px;
}
.g-nav-burger-bar:nth-child(3) {
  top: 32.5px;
}
.g-nav.active .g-nav-burger-bar:nth-child(1) {
  transform: translateY(12px) rotate(45deg);
}
.g-nav.active .g-nav-burger-bar:nth-child(2) {
  opacity: 0;
}
.g-nav.active .g-nav-burger-bar:nth-child(3) {
  transform: translateY(-12px) rotate(-45deg);
}
@media (hover: hover) {
  .g-nav-burger:hover {
    opacity: 0.7;
  }
}
@media (prefers-reduced-motion: reduce) {
  .g-nav-burger-bar,
  .g-nav-link-container {
    transition: none;
  }
}

.g-nav-logo {
  position: relative;
  left: 50%;
  top: 50%;
  width: 250px;
  height: 45px;
  transform: translate3d(-50%, -50%, 0);
}
.g-nav-logo-img {
  position: relative;
  width: 100%;
  transition: 0.6s ease-in-out;
}

.g-nav.active .g-nav-link-container {
  transform: translateX(0);
  visibility: visible;
  transition: transform 0.6s ease-in-out, visibility 0s;
}
.g-nav-bar .g-nav-link-container ul {
  list-style: none;
  padding: 0;
}

.g-nav-link-container li a,
.g-nav-link-container li {
  font-size: 84px;
  line-height: 75px;
  color: var(--white);
  text-decoration: none;
  transition: 0.3s;
  font-family: var(--title) !important;
}

.g-nav-link-container li a:hover {
  opacity: 0.6;
}

.g-jump-menu li {
  display: inline-block;
  margin-right: 20px;
}

/* MODULES */

.g-relative {
  position: relative;
}
.g-module {
  width: 100%;
  height: 100vh;
  position: relative;
}
.g-module-header {
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center;
}
.g-module-lg-pad {
  padding: 70px 0;
}
.g-pad-lg-btm {
  padding: 0px 0 80px !important;
}
.g-mt-lg {
  margin-top: 60px;
}

.g-image-bleed {
  position: relative;
}
.g-image-bleed-img {
  background-size: cover;
  position: absolute;
}
.g-img-full {
  width: 100%;
}

/* Images carry width/height attributes (so the page doesn't jump as they
   load); keep their proportions wherever CSS only sets the width. Zero
   specificity, so any rule that sets a height still wins. */
:where(img[width][height]) {
  height: auto;
}

/* Full-screen background photos: a smaller copy on phones (see
   metropolis_bg_vars() in inc/template-helpers.php). */
.g-responsive-bg {
  background-image: var(--bg-lg);
}
@media (max-width: 767.98px) {
  .g-responsive-bg {
    background-image: var(--bg-sm);
  }
}

/* Slider and off-the-edge photos are <img>s that fill their box the way the
   old cover backgrounds did. */
.full-carousel .carousel-image,
img.g-image-bleed-img {
  display: block;
  max-width: none;
  object-fit: cover;
}
img.g-image-bleed-img {
  object-position: left top; /* the old background's default anchor */
}

.header-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.3);
}
.header-title {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate3d(-50%, -50%, 0);
}

.location-gallery-row {
  margin-bottom: 70px;
}
#map {
  height: 100%;
}
.g-location-list {
  box-sizing: border-box;
  padding: 30px 0 30px 0.75rem;
}

.g-location-list h3 {
  margin-bottom: 30px;
}

/* Below the map (under 1200px), line the list up with the rest of the page:
   its inner .container already provides the normal side padding. */
@media (max-width: 1199.98px) {
  .g-location-list-col,
  .g-location-list {
    padding-left: 0;
    padding-right: 0;
  }
}

/* 576–767px: use the full width instead of Bootstrap's 540px container.
   Add .g-fill-sm to a section to opt it in (also: icon grids, the Home intro
   key facts, the Location intro and amenities, and the footer). */
@media (min-width: 576px) and (max-width: 767.98px) {
  /* Slide-out menu: left-aligned like on phones, so the items fit. */
  .g-nav-link-container-inner {
    left: 30px;
  }
  .g-fill-sm .container,
  .icon-grid .container,
  .container-intro-base .container,
  .location-intro .container,
  .g-location-list .container,
  #contact .container {
    max-width: none;
  }
}

/* Phones: one list flowing down two columns (numbers stay in order down each
   column). */
@media (max-width: 575.98px) {
  .g-location-list-items {
    display: block;
    column-count: 2;
    column-gap: 24px;
    margin-left: 0;
    margin-right: 0;
  }
  .g-location-list-items > div {
    padding: 0;
  }
  .g-location-list li {
    break-inside: avoid;
  }
}

.g-location-list ul {
  list-style: none;
  padding: 0 0 0 0px;
  margin-bottom: 0;
}
.g-location-list li {
  margin-bottom: 10px;
  font-size: 14px;
  /* Long names wrap with a hanging indent past the number. */
  display: flex;
  align-items: flex-start;
}
.g-location-list-number {
  flex: none;
  width: 21px;
  font-size: 13px;
  margin-right: 5px;
  text-align: center;
  display: inline-block;
  background-color: #ffffff;
  border: 1px solid var(--darkgreen);
  border-radius: 100%;
  color: var(--darkgreen);
}

/* Intro */

.container-intro-base {
  width: 100%;
  position: absolute;
  bottom: 0;
  border-top: 1px solid var(--palegreen);
  text-align: center;
}

.intro-icon {
  display: block;
  height: 80px;
  margin: 0 auto 10px;
}
.intro-icon img {
  height: 100%;
  width: auto;
}
.intro-down-module {
  margin: 20px auto 5px;
}
.intro-down-module p {
  font-size: 23px;
}
.intro-down-arrow {
  width: 40px;
  height: 38px;
}
.intro-down-arrow img {
  width: 100%;
}

/* .divide-module h2 {
  font-family: "metropolisregular", "neue-haas-grotesk-text", sans-serif;
  font-size: 74px;
  margin: 10px 0;
} */
.divide-module .divide-module-box {
  text-align: center;
  padding: 40px 60px;
}
.divide-module .divide-module-box-wide {
  padding: 40px;
}
.divide-module .intro-module-box {
  text-align: center;
  padding: 20px 70px;
}
.intro-divide {
  margin: 0;
}
.intro-module-box p,
.divide-module-box p {
  font-size: 17px;
  margin-bottom: 0;
  text-wrap: balance;
}
/* .divide-module .intro-module-box:first-child,
.divide-module .divide-module-box:first-child {
  border-right: 1px solid #fff;
}
.divide-module .intro-module-box:last-child,
.divide-module .divide-module-box:last-child {
  border-left: 1px solid #fff;
} */
.divide-palegreen-right {
  border-right: 1px solid var(--palegreen);
}
.divide-palegreen {
  border-color: var(--palegreen) !important;
}
.divide-module-line {
  margin: 0;
}
.divide-module-icon-blank,
.divide-module-icon {
  width: 100px;
  height: 100px;
  border-radius: 100%;
  margin: 0 auto 30px;
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}
.divide-module-icon-blank {
  padding: 0;
  height: 94px;
  width: 220px;
  display: flex;
}
.divide-module-icon-blank img,
.divide-module-icon img {
  display: block;
  /* width: auto;
  height: auto;
  max-height: 100%;
  max-width: 100%; */
}
.module-icon-w {
  width: 100%;
  height: auto;
}
.module-icon-h {
  width: auto;
  height: 100%;
}

.metropolis-full {
  width: 100%;
}
.metropolis-full img {
  width: 100%;
}

p {
  font-family: var(--family) !important;
}

.content-container {
  position: relative;
  width: 100%;
}
.content-container .container {
  position: relative;
  z-index: 3;
  height: 100%;
}

.content-intro {
  height: 100vh;
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  z-index: 10;
}
.content-downloads {
  height: 50vh;
  z-index: 10;
}

.content-intro-tagline {
  position: absolute;
  left: 50%;
  transform: translate3d(-50%, -50%, 0);
  top: 20%;
  font-size: 18px;
  font-weight: var(--bold);
  width: 100%;
  text-align: center;
}
.content-intro-tagline p {
  font-size: 23px;
}
.content-intro-logo {
  position: absolute;
  left: 50%;
  top: calc(50% - 100px);
  width: 50%;
  transform: translate3d(-50%, -50%, 0);
}
.content-intro-logo-downloads {
  top: calc(50%);
}

.content-downloads .content-intro-logo {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 80%;
  max-width: 600px;
  transform: translate3d(-50%, -50%, 0);
}

/* On Home the logo is the H1; keep it looking like a plain block. */
h1.content-intro-logo {
  margin: 0;
  font-size: inherit;
  line-height: inherit;
}
.content-intro-logo img {
  width: 100%;
  height: auto;
}

/* NAVIGATION */

.section-download {
  padding: 70px 0;
}
.download-box {
  width: 90%;
  height: auto;
  position: relative;
}

.section-download-unlocked .download-box {
  width: 100%;
}

.download-box img {
  width: 100%;
}
.download-box-label {
  margin-top: 10px;
  font-size: 12px;
}
.download-box-label span {
  vertical-align: bottom;
}
.download-box-label img {
  width: 20px;
  height: 23px;
  margin-right: 5px;
}
.download-link,
.download-link:active,
.download-link:visited {
  display: block;
  color: var(--darkgreen) !important;
  text-decoration: none;
}
#download-module hr {
  margin: 10px 0;
}
input[type="checkbox"] {
  accent-color: var(--darkgreen);
}

.section-download-unlocked h1,
.section-download-unlocked h2 {
  margin-bottom: 20px !important;
  text-align: center !important;
}

.privacy-section {
  padding: 50px 0;
}
.privacy-section h1 {
  margin-bottom: 40px;
}

/* footer */

.footer-mid ul {
  list-style: none;
  padding: 0;
}

.footer-band {
  width: 100%;
}
.footer-mid {
  position: relative;
  z-index: 1;
  padding: 100px 0 0;
  overflow: hidden;
}
.footer-bottom {
  position: relative;
  z-index: 2;
  padding: 60px 0 40px;
}

.footer-details {
  margin-bottom: 80px;
}

.footer-detail {
  font-family: var(--family);
  font-weight: var(--regular);
  font-style: normal;
  color: var(--lightgreen);
  font-size: 15px;
  line-height: 22px;
}
.footer-detail a:visited,
.footer-detail a {
  text-decoration: none;
  color: var(--lightgreen);
  transition: 0.2s;
  overflow-wrap: anywhere; /* long email addresses wrap instead of overlapping */
}

.footer-border-section {
  padding-top: 30px;
  padding-bottom: 30px;
  border-top: 1px solid var(--lightgreen);
  border-bottom: 1px solid var(--lightgreen);
}
.footer-border-section p {
  font-size: 18px;
  margin-bottom: 0;
}
.accomm-outer {
  background-color: var(--stronggreen);
  margin-bottom: 80px;
  padding: 60px 0 40px;
  font-size: 20px;
}
.footer-credit-container {
  align-self: flex-end;
  text-align: right;
}
.footer-credit {
  margin-bottom: 20px;
  text-align: right;
}
.footer-credit img {
  height: auto;
  width: 100%;
}
.footer-jll,
.footer-ecp,
.footer-credit a:visited,
.footer-credit a {
  color: var(--lightgreen);
  text-decoration: none;
  transition: 0.2s;
}
.footer-jll img {
  height: 55px;
  width: auto;
}
.footer-ecp img {
  height: 70px;
  width: auto;
}
.footer-legals {
  color: var(--lightgreen);
  font-size: 9px;
}

@media (max-width: 1199.98px) {
  .divide-module h2 {
    font-family: "metropolisregular", "neue-haas-grotesk-text", sans-serif;
    font-size: 80px;
    line-height: 74px !important;
    margin: 20px 0 10px;
  }
  h1.header-title {
    font-size: min(130px, calc((100vw - 24px) / 6.4));
    line-height: 0.923;
  }
  #map {
    height: 600px;
    width: 100%;
  }
  .footer-detail-logo {
    margin-bottom: 32px;
  }
}

@media (max-width: 991.98px) {
  .desktop {
    display: none;
  }
  .mobile {
    display: block;
  }
  .divide-module .divide-module-box {
    padding: 40px 20px;
  }
  /* No bottom padding: .footer-mid wraps the disclaimer band too, so it only
     added empty space at the very bottom of the page. */
  .footer-mid {
    padding: 80px 0 0;
  }
  /* Keep the gap between agencies smaller than the footer's top padding. */
  .footer-details {
    margin-bottom: 16px;
  }
  .footer-bottom {
    padding: 40px 0 20px;
  }
  .footer-credit {
    max-width: 200px;
    margin-top: 20px;
  }
  .intro-icon {
    height: 80px;
    margin: 10px auto 10px;
  }
  .divide-module .intro-module-box {
    text-align: center;
    padding: 20px 30px;
  }
  .intro-module-box p,
  .divide-module-box p {
    font-size: 15px;
    margin-bottom: 0;
  }

  .g-para-mb-lg {
    margin-bottom: 60px;
  }
  .g-para-mt-md {
    margin-top: 0px;
  }
  h1.header-title {
    font-size: min(130px, calc((100vw - 24px) / 6.4));
    line-height: 0.923;
  }
}

@media (max-width: 767.98px) {
  .content-intro {
    /* height: calc(100vh - 74px); */
  }
  .content-intro-logo {
    top: calc(50% - 120px);
    width: 80%;
  }
  .content-intro-tagline {
    width: 100%;
    text-align: center;
  }
  .divide-module .intro-module-box {
    text-align: center;
    padding: 20px 10px;
  }
  .accomm-outer {
    padding: 40px 0;
    margin-bottom: 40px;
  }
  .g-pad-lg-btm {
    padding-bottom: 40px !important;
  }
  .intro-icon {
    height: 60px;
    margin: 10px auto 20px;
  }
  .divide-module h2 {
    font-size: 64px;
    line-height: 60px !important;
    margin: 10px 0 0;
  }
  .intro-down-module p {
    margin-bottom: 10px;
    font-size: 14px;
  }
  h1.header-title {
    font-size: min(110px, calc((100vw - 24px) / 6.4));
    line-height: 0.909;
  }
  .divide-module-icon-blank {
    padding: 0;
    height: 94px;
    width: 140px;
    display: flex;
  }
  .location-gallery-row {
    margin-bottom: 0;
  }
  .location-gallery-row img {
    margin-bottom: 20px;
  }
  #map {
    height: 500px;
    width: 100%;
  }
}

@media (max-width: 575.98px) {
  .small-desktop {
    display: none;
  }
  .small-mobile {
    display: block;
  }
  .g-div-pad-md {
    padding-top: 30px;
    padding-bottom: 30px;
  }
  .g-nav-bar {
    position: absolute;
    height: 64px;
  }
  .g-nav {
    --g-nav-bar-height: 64px;
  }
  .g-nav-logo {
    width: 200px;
    height: auto;
  }
  .g-nav-burger {
    top: 10px;
    right: 10px;
  }
  .g-nav-link-container-inner {
    position: relative;
    padding-top: 30px;
    left: calc(30px);
  }
  .g-nav-link-container-inner-tag {
    font-size: 15px;
  }
  .g-nav-link-container li a,
  .g-nav-link-container li {
    font-size: 50px;
    line-height: 52px;
  }
  .g-mt-lg {
    margin: 20px 0;
  }
  section {
    padding-left: 0;
    padding-right: 0;
  }
  .g-image-bleed-img {
    position: relative;
    width: 100% !important;
    height: auto !important;
    background-position: center;
  }
  h1.header-title {
    font-size: min(60px, calc((100vw - 24px) / 6.4));
    line-height: 1.02;
    padding: 0 12px;
  }
  .divide-module h2 {
    font-size: 48px !important;
    text-align: left !important;
    line-height: 45px !important;
  }
  .divide-palegreen-right {
    border: none;
  }

  .footer-mid {
    padding: 60px 0 0;
  }

  .building-intro img {
    margin-bottom: 20px;
  }
  .g-para-mt-md {
    margin-top: 0px;
    margin-bottom: 60px;
  }
  .g-para-mb-lg {
    margin-bottom: 20px;
  }

  .content-intro {
    height: auto;
  }
  .intro-down-module {
    margin-bottom: 20px;
  }
  .content-container-inner {
    position: relative;
    width: 100%;
    height: calc(100vh - 150px);
  }

  .content-intro-logo {
    top: calc(50% + 30px);
    width: 84%;
  }
  .intro-down-arrow {
    padding: 0;
    width: 30px;
    height: 29px;
  }
  .intro-down-arrow img {
    width: 100% !important;
    height: auto;
  }
  .divide-module-icon {
    width: 80px;
    height: 80px;
  }
  .container-intro-base {
    bottom: auto;
    position: relative;
    padding-bottom: 20px;
  }
  .content-intro-tagline p {
    font-size: 19px;
    margin: 0;
  }
  .intro-module-box p,
  .divide-module-box p {
    font-size: 14px;
  }

  .divide-module .intro-module-box:first-child,
  .divide-module .divide-module-box:first-child {
    border-right: none;
  }
  .divide-module .intro-module-box:last-child,
  .divide-module .divide-module-box:last-child {
    border-left: none;
  }
  .divide-module .divide-module-box {
    padding: 15px 15%;
  }
  .divide-module-container {
    padding: 30px 0;
  }
  .divide-module .intro-module-box {
    padding: 15px 15%;
  }
  .download-box-label {
    margin-bottom: 40px;
  }
  .divide-module h2 {
    font-size: 60px;
    text-align: center;
  }
  .divide-module-icon {
    margin-bottom: 15px;
  }
  .section-download {
    padding: 40px 0 30px;
  }
  .g-h3-padded {
    margin-top: 30px;
  }
  .g-para-mt-md {
    margin-bottom: 30px;
  }
}

@media (max-width: 389.99px) {
  .small-mobile {
    display: block;
  }
  .divide-module h2 {
    font-size: 42px !important;
    line-height: 39px !important;
  }
}

@media (hover: hover) {
  .download-link:hover .download-box-label,
  .footer-jll:hover,
  .footer-ecp:hover,
  .footer-credit a:hover,
  .footer-detail a:hover {
    color: var(--white);
    opacity: 0.8;
  }
}

/* 404 page */
.not-found-menu a {
  color: var(--darkgreen);
}

/* Gap above the footer (previously a <br> in the markup). */
#contact {
  margin-top: 24px;
}