@font-face {
  font-family: "Neutrif Studio";
  font-style: normal;
  font-display: swap;
  src: url('/wp-content/themes/tkmulti/public/fonts/Neutrif Studio/neutrifstudio-regular-webfont.woff2') format('woff2'), url('/wp-content/themes/tkmulti/public/fonts/Neutrif Studio/neutrifstudio-regular-webfont.woff') format('woff');
}
@font-face {
  font-family: "Neutrif Studio";
  font-style: normal;
  font-display: swap;
  font-weight: 500;
  src: url('/wp-content/themes/tkmulti/public/fonts/Neutrif Studio/neutrifstudio-medium-webfont.woff2') format('woff2'), url('/wp-content/themes/tkmulti/public/fonts/Neutrif Studio/neutrifstudio-medium-webfont.woff') format('woff');
}
@font-face {
  font-family: "Neutrif Studio";
  font-style: normal;
  font-display: swap;
  font-weight: 500;
  src: url('/wp-content/themes/tkmulti/public/fonts/Neutrif Studio/neutrifstudio-bold-webfont.woff2') format('woff2'), url('/wp-content/themes/tkmulti/public/fonts/Neutrif Studio/neutrifstudio-bold-webfont.woff') format('woff');
}
@font-face {
  font-family: "TKType";
  font-style: normal;
  font-display: swap;
  src: url('/wp-content/themes/tkmulti/public/fonts/TKType/tktyperegular.woff') format('woff');
}
@font-face {
  font-family: "TKType";
  font-style: normal;
  font-display: swap;
  font-weight: 500;
  src: url('/wp-content/themes/tkmulti/public/fonts/TKType/tktypemedium.woff') format('woff');
}
@font-face {
  font-family: "TKType";
  font-style: normal;
  font-display: swap;
  font-weight: bold;
  src: url('/wp-content/themes/tkmulti/public/fonts/TKType/tktypebold.woff') format('woff');
}
@font-face {
  font-family: "TKIconFont";
  font-style: normal;
  font-display: swap;
  font-weight: normal;
  src: url('/wp-content/themes/tkmulti/public/fonts/TKIconFont/thyssen-krupp-iconfont.woff') format('woff');
}
html {
  position: relative;
  overflow: hidden;
  -ms-scroll-chaining: none;
      overscroll-behavior: none;
  margin-top: 0 !important;
  width: 100%;
  height: 100vh;
  height: var(--innerHeight, 100vh);
}
body {
  width: 100%;
  height: 100%;
  font-size: 0;
  font-family: "TKType", "TKIconFont", sans-serif;
  margin: 0;
  background-color: #1d1d1b;
  overflow: hidden;
  color: white;
  -ms-scroll-chaining: none;
      overscroll-behavior: none;
}
body a {
  text-decoration: none !important;
  outline: none;
  color: white;
}
body p a {
  text-decoration: underline !important;
}
body button {
  border-radius: 0;
  border: none;
  background: transparent;
  padding: 0;
}
@media (min-width: 1025px) {
  body.use-will-change video,
  body.use-will-change section[data-title],
  body.use-will-change .midground.background-image,
  body.use-will-change .midground.parallax-part {
    will-change: transform, opacity;
  }
}
body [style*="opacity: 0"],
body [style*="opacity:0"] {
  pointer-events: none;
}
body #app > .framework {
  width: 100vw;
  height: 100vh;
  position: relative;
  margin: 0 auto;
}
body #app > .framework > .bar {
  position: absolute;
  z-index: 7;
}
body #app > .framework > .bar.top {
  top: 0;
  left: 0;
  width: 100vw;
  height: 12vh;
  z-index: 7;
}
@media (max-width: 768px) {
  body #app > .framework > .bar.top {
    z-index: 102;
  }
}
body #app > .framework > .bar.top > .tk-logo {
  position: absolute;
  top: 0;
  left: 4vw;
  right: 4vw;
  bottom: 0;
}
@media (max-width: 768px) {
  body #app > .framework > .bar.top > .tk-logo {
    right: auto;
  }
}
body #app > .framework > .bar.top > .tk-logo img.logo {
  cursor: pointer;
  width: 7.2vw;
  bottom: 50%;
  left: 0;
  transform: translateY(50%) scale(1);
  transform-origin: center left;
  position: absolute;
}
@media (max-width: 768px) {
  body #app > .framework > .bar.top > .tk-logo img.logo {
    bottom: 50% !important;
    transform: translateY(50%) scale(1) !important;
    width: 12vw;
  }
}
body #app > .framework > .bar.top > .tk-logo img.strap {
  position: absolute;
  bottom: 0;
  right: 0;
  width: 17vw;
  transform: scale(1);
  transform-origin: center right;
}
body #app > .framework > .bar.top > .tk-logo.desktop {
  display: block;
}
@media (max-width: 768px) {
  body #app > .framework > .bar.top > .tk-logo.desktop {
    opacity: 1;
    transition: opacity 0.3s ease-in-out 0.6s;
  }
  [data-page="Homepage > Homepage"] body #app > .framework > .bar.top > .tk-logo.desktop {
    opacity: 0;
    transition: opacity 0.3s ease-in-out;
  }
  .mobile-menu-open body #app > .framework > .bar.top > .tk-logo.desktop,
  .contact-form-open body #app > .framework > .bar.top > .tk-logo.desktop {
    opacity: 0;
    transition: opacity 0.3s ease-in-out;
  }
}
body #app > .framework > .bar.top > .tk-logo.mobile {
  display: none;
}
@media (max-width: 768px) {
  body #app > .framework > .bar.top > .tk-logo.mobile {
    display: block;
    opacity: 0;
    top: 50%;
    height: 33px;
    width: 150px;
    transform: scale(1) translateY(-50%) !important;
    transition: opacity 0.3s ease-in-out;
  }
  [data-page="Homepage > Homepage"] body #app > .framework > .bar.top > .tk-logo.mobile {
    opacity: 1;
    transition: opacity 0.3s ease-in-out 0.6s;
  }
  .mobile-menu-open body #app > .framework > .bar.top > .tk-logo.mobile,
  .contact-form-open body #app > .framework > .bar.top > .tk-logo.mobile {
    opacity: 0;
    transition: opacity 0.3s ease-in-out;
  }
}
body #app > .framework > .bar.top > .multi-logo {
  position: absolute;
  top: 50vh;
  left: 50%;
  transform: translate(-50%, -50%);
  overflow: hidden;
  white-space: nowrap;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  width: 28vw;
  height: 9.03225806vw;
  cursor: pointer;
  transition: opacity 0.3s ease-in-out 0.6s;
  background-image: url('/wp-content/themes/tkmulti/public/multi_mlti_padded.svg') !important;
  will-change: transform, top, opacity;
}
@media (max-width: 768px) {
  body #app > .framework > .bar.top > .multi-logo {
    width: 254px;
    height: 81.93548387px;
  }
}
.mobile-menu-open body #app > .framework > .bar.top > .multi-logo,
.contact-form-open body #app > .framework > .bar.top > .multi-logo {
  opacity: 0;
  transition: opacity 0.3s ease-in-out;
  pointer-events: none;
}
body #app > .framework > .bar.top > .multi-logo > .U {
  position: absolute;
  display: inline-block;
  left: 20%;
  top: 50%;
  transform: translateY(-50%);
  width: 9.03225806vw;
  height: 9.03225806vw;
  overflow: hidden;
}
@media (max-width: 768px) {
  body #app > .framework > .bar.top > .multi-logo > .U {
    width: 81.93548387px;
    height: 81.93548387px;
  }
}
body #app > .framework > .bar.top > .multi-logo > .U > div {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-size: 9.03225806vw;
  background-repeat: repeat;
  background-position: top left;
  height: 600%;
  width: 600%;
  background-image: url('/wp-content/themes/tkmulti/public/multi_u_padded.svg');
  will-change: transform;
}
@media (max-width: 768px) {
  body #app > .framework > .bar.top > .multi-logo > .U > div {
    background-size: 81.93548387px;
  }
}
body #app > .framework > .bar.top > .mobile-menu-toggle {
  position: absolute;
  top: 50%;
  right: 15px;
  height: 32px;
  width: 32px;
  transform: translateY(-50%);
  background: transparent;
  border: none;
  border-radius: 0;
  display: none;
  padding: 0;
  outline: none;
}
@media (max-width: 768px) {
  body #app > .framework > .bar.top > .mobile-menu-toggle {
    display: block;
  }
}
body #app > .framework > .bar.top > .mobile-menu-toggle > span {
  position: absolute;
  width: 100%;
  height: 1px;
  left: 0;
  background-color: white;
}
body #app > .framework > .bar.top > .mobile-menu-toggle > span:nth-child(1) {
  top: 0;
}
body #app > .framework > .bar.top > .mobile-menu-toggle > span:nth-child(2) {
  top: 50%;
  transform: translateY(-50%);
}
body #app > .framework > .bar.top > .mobile-menu-toggle > span:nth-child(3) {
  bottom: 0;
}
body #app > .framework > .bar.top > .mobile-menu-toggle.open > span:nth-child(1) {
  width: 136%;
  height: 1px;
  transform-origin: top left;
  transform: rotate(45deg);
}
body #app > .framework > .bar.top > .mobile-menu-toggle.open > span:nth-child(2) {
  display: none;
}
body #app > .framework > .bar.top > .mobile-menu-toggle.open > span:nth-child(3) {
  width: 136%;
  height: 1px;
  transform-origin: bottom left;
  transform: rotate(-45deg);
}
body #app > .framework > .bar.left {
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  display: inline-block;
  width: 16vw;
}
@media (max-width: 768px) {
  body #app > .framework > .bar.left {
    position: relative;
    min-width: 0;
    width: 100%;
    top: 0;
    transform: none;
  }
}
body #app > .framework > .bar.left > button.nav {
  background: transparent;
  border: none;
  border-radius: 0;
  padding: 0;
  font-family: inherit;
  color: white;
  font-size: 1.18055556vw;
  margin-bottom: 4em;
  line-height: 1.1em;
  display: block;
  text-decoration: none;
  outline: none;
  vertical-align: middle;
  cursor: pointer;
  white-space: nowrap;
}
@media (max-width: 768px) {
  body #app > .framework > .bar.left > button.nav {
    font-size: 12.75px;
  }
}
@media (max-width: 768px) and (min-height: 900px) {
  body #app > .framework > .bar.left > button.nav {
    font-size: 20.4px;
  }
}
@media (max-width: 768px) {
  body #app > .framework > .bar.left > button.nav {
    opacity: 0;
    transition: opacity 0.3s ease-in-out, left 0s ease-in-out 0.3s;
    position: absolute;
    top: 18vh;
    left: -999px;
    margin-bottom: 0;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    font-size: 0.97222222vw;
  }
}
@media (max-width: 768px) and (max-width: 768px) {
  body #app > .framework > .bar.left > button.nav {
    font-size: 10.5px;
  }
}
@media (max-width: 768px) and (max-width: 768px) and (min-height: 900px) {
  body #app > .framework > .bar.left > button.nav {
    font-size: 16.8px;
  }
}
body #app > .framework > .bar.left > button.nav:last-child {
  margin-bottom: 0;
}
body #app > .framework > .bar.left > button.nav:before {
  content: "";
  vertical-align: middle;
  display: inline-block;
  width: 3.2vw;
  height: 2px;
  background-color: white;
  margin-right: 0.8vw;
  opacity: 0;
  transition: opacity 0.2s ease-in-out;
}
body #app > .framework > .bar.left > button.nav.active {
  font-weight: 500;
}
body #app > .framework > .bar.left > button.nav.active:before {
  opacity: 1;
}
@media (max-width: 768px) {
  body #app > .framework > .bar.left > button.nav.active {
    opacity: 1;
    left: 0;
    transition: opacity 0.3s ease-in-out 0.6s, left 0s ease-in-out 0.6s;
  }
}
body #app > .framework > .bar.right {
  right: 0;
  width: 8vw;
  height: 100%;
  pointer-events: none;
}
@media (max-width: 768px) {
  body #app > .framework > .bar.right {
    width: 0;
  }
}
body #app > .framework > .bar.right .heading {
  position: absolute;
  top: 94px;
  right: 50%;
  transform-origin: top right;
  transform: rotate(90deg) translate(100%, 0%);
  font-size: 1.38888889vw;
  line-height: 1em;
  color: white;
  text-transform: uppercase;
  opacity: 1;
  transition: opacity 0.5s ease-in-out;
  margin: 0;
  white-space: nowrap;
  letter-spacing: 0.2em;
}
@media (max-width: 768px) {
  body #app > .framework > .bar.right .heading {
    font-size: 15px;
  }
}
@media (max-width: 768px) and (min-height: 900px) {
  body #app > .framework > .bar.right .heading {
    font-size: 24px;
  }
}
body #app > .framework > .bar.right .heading.hidden {
  opacity: 0;
}
@media (max-width: 768px) {
  body #app > .framework > .bar.right .heading {
    display: none !important;
  }
}
body #app > .framework > .bar.bottom {
  bottom: 0;
  width: 100vw;
  min-height: 56px;
  pointer-events: none;
}
@media (max-width: 768px) {
  body #app > .framework > .bar.bottom {
    min-height: 0;
  }
}
body #app > .framework > .bar > button.go {
  position: absolute;
  width: 3.2vw;
  height: 3.2vw;
  box-sizing: border-box;
  border: none;
  border-radius: 0;
  background: transparent;
  font-size: 0;
  outline: none;
  display: block;
  opacity: 0;
  transition: opacity 0.3s ease-in-out;
  pointer-events: all;
}
body #app > .framework > .bar > button.go.active {
  opacity: 1;
  cursor: pointer;
}
@media (max-width: 768px) {
  body #app > .framework > .bar > button.go.active {
    display: none;
  }
}
body #app > .framework > .bar > button.go:before {
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  width: 1.6vw;
  height: 1.6vw;
  border-top: 2px solid white;
  border-right: 2px solid white;
  transform: translate(-50%, -50%) rotate(-45deg);
}
body #app > .framework > .bar > button.go.up {
  top: 100%;
  left: 50%;
  transform: translate(-50%, 0%) rotate(0deg);
}
@media (max-width: 768px) {
  body #app > .framework > .bar > button.go.up {
    transform: rotate(0deg);
    bottom: 21.4px;
  }
}
body #app > .framework > .bar > button.go.down {
  top: 0;
  left: 50%;
  transform: translate(-50%, -100%) rotate(180deg);
}
@media (max-width: 768px) {
  body #app > .framework > .bar > button.go.down {
    transform: rotate(180deg);
    bottom: 15px;
  }
}
body #app > .framework > .bar > button.go.left {
  top: 50%;
  right: -3.2vw;
  transform: translate(0%, -50%) rotate(-90deg);
}
body #app > .framework > .bar > button.go.left:before {
  transform: translate(-50%, -50%) translateY(4px) rotate(-45deg);
}
@media (max-width: 768px) {
  body #app > .framework > .bar > button.go.left {
    transform: rotate(-90deg);
    bottom: 18.2px;
  }
}
body #app > .framework > .bar > button.go.right {
  top: 50%;
  left: -3.2vw;
  transform: translate(0%, -50%) rotate(90deg);
}
body #app > .framework > .bar > button.go.right:before {
  transform: translate(-50%, -50%) translateY(4px) rotate(-45deg);
}
@media (max-width: 768px) {
  body #app > .framework > .bar > button.go.right {
    transform: rotate(90deg);
    bottom: 18.2px;
  }
}
@media (max-width: 768px) {
  body #app > .framework > .bar > button.go {
    display: none;
  }
  body #app > .framework > .bar > button.go.active {
    display: block;
  }
}
@media (max-width: 768px) {
  body #app > .framework > .bar button.go {
    display: none !important;
  }
}
body #app > .framework .mobile-nav-arrows {
  display: none;
  position: absolute;
  top: var(--innerHeight, 100vh);
  transform: translateY(-100%);
  padding-bottom: 8vw;
  right: 4vw;
  z-index: 100;
}
body #app > .framework .mobile-nav-arrows > button.go {
  position: absolute;
  width: 32px;
  height: 32px;
  box-sizing: border-box;
  border: none;
  border-radius: 0;
  background: transparent;
  font-size: 0;
  outline: none;
  display: block;
  opacity: 0;
  transition: opacity 0.3s ease-in-out;
  pointer-events: all;
}
body #app > .framework .mobile-nav-arrows > button.go.active {
  opacity: 1;
  cursor: pointer;
}
@media (max-width: 768px) {
  body #app > .framework .mobile-nav-arrows > button.go.active {
    display: none;
  }
}
body #app > .framework .mobile-nav-arrows > button.go:before {
  content: "";
  display: block;
  position: absolute;
  top: 50%;
  left: 50%;
  width: 16px;
  height: 16px;
  border-top: 2px solid white;
  border-right: 2px solid white;
  transform: translate(-50%, -50%) rotate(-45deg);
}
body #app > .framework .mobile-nav-arrows > button.go.up {
  top: 100%;
  left: 50%;
  transform: translate(-50%, 0%) rotate(0deg);
}
@media (max-width: 768px) {
  body #app > .framework .mobile-nav-arrows > button.go.up {
    transform: rotate(0deg);
    bottom: 79px;
  }
}
body #app > .framework .mobile-nav-arrows > button.go.down {
  top: 0;
  left: 50%;
  transform: translate(-50%, -100%) rotate(180deg);
}
@media (max-width: 768px) {
  body #app > .framework .mobile-nav-arrows > button.go.down {
    transform: rotate(180deg);
    bottom: 15px;
  }
}
body #app > .framework .mobile-nav-arrows > button.go.left {
  top: 50%;
  right: -32px;
  transform: translate(0%, -50%) rotate(-90deg);
}
body #app > .framework .mobile-nav-arrows > button.go.left:before {
  transform: translate(-50%, -50%) translateY(4px) rotate(-45deg);
}
@media (max-width: 768px) {
  body #app > .framework .mobile-nav-arrows > button.go.left {
    transform: rotate(-90deg);
    bottom: 47px;
  }
}
body #app > .framework .mobile-nav-arrows > button.go.right {
  top: 50%;
  left: -32px;
  transform: translate(0%, -50%) rotate(90deg);
}
body #app > .framework .mobile-nav-arrows > button.go.right:before {
  transform: translate(-50%, -50%) translateY(4px) rotate(-45deg);
}
@media (max-width: 768px) {
  body #app > .framework .mobile-nav-arrows > button.go.right {
    transform: rotate(90deg);
    bottom: 47px;
  }
}
@media (max-width: 768px) {
  body #app > .framework .mobile-nav-arrows > button.go {
    display: none;
  }
  body #app > .framework .mobile-nav-arrows > button.go.active {
    display: block;
  }
}
@media (max-width: 768px) {
  body #app > .framework .mobile-nav-arrows {
    display: block;
  }
  body #app > .framework .mobile-nav-arrows > button.go {
    position: absolute;
    top: auto !important;
    left: auto !important;
    right: -99px !important;
    bottom: 32px !important;
    display: block;
    opacity: 0;
    transition: opacity 0.3s ease-in-out, bottom 0.3s ease-in-out, right 0s linear 0.3s;
  }
  body #app > .framework .mobile-nav-arrows[data-show-down="true"] > button.go.down {
    right: 0 !important;
    opacity: 1;
    transition: opacity 0.3s ease-in-out, bottom 0.3s ease-in-out, right 0s linear;
  }
  body #app > .framework .mobile-nav-arrows[data-show-up="true"] > button.go.up {
    right: 0 !important;
    opacity: 1;
    transition: opacity 0.3s ease-in-out, bottom 0.3s ease-in-out, right 0s linear;
  }
  body #app > .framework .mobile-nav-arrows[data-show-up="true"][data-show-down="true"][data-show-left="false"][data-show-right="false"] > button.go.up {
    right: 0 !important;
    opacity: 1;
    transition: opacity 0.3s ease-in-out, bottom 0.3s ease-in-out, right 0s linear;
    bottom: 64px !important;
  }
  body #app > .framework .mobile-nav-arrows[data-show-left="true"] > button.go.left {
    right: 0 !important;
    opacity: 1;
    transition: opacity 0.3s ease-in-out, bottom 0.3s ease-in-out, right 0s linear;
    bottom: 64px !important;
  }
  body #app > .framework .mobile-nav-arrows[data-show-right="true"] > button.go.right {
    right: 0 !important;
    opacity: 1;
    transition: opacity 0.3s ease-in-out, bottom 0.3s ease-in-out, right 0s linear;
    bottom: 64px !important;
  }
  body #app > .framework .mobile-nav-arrows[data-show-up="true"][data-show-down="true"][data-show-left="true"] > button.go.up,
  body #app > .framework .mobile-nav-arrows[data-show-up="true"][data-show-down="true"][data-show-right="true"] > button.go.up {
    right: 0 !important;
    opacity: 1;
    transition: opacity 0.3s ease-in-out, bottom 0.3s ease-in-out, right 0s linear;
    bottom: 96px !important;
  }
  body #app > .framework .mobile-nav-arrows[data-show-up="false"][data-show-down="false"][data-show-left="true"][data-show-right="true"] > button.go.left {
    right: 0 !important;
    opacity: 1;
    transition: opacity 0.3s ease-in-out, bottom 0.3s ease-in-out, right 0s linear;
    bottom: 64px !important;
  }
  body #app > .framework .mobile-nav-arrows[data-show-up="false"][data-show-down="false"][data-show-left="true"][data-show-right="true"] > button.go.right {
    right: 0 !important;
    opacity: 1;
    transition: opacity 0.3s ease-in-out, bottom 0.3s ease-in-out, right 0s linear;
    bottom: 32px !important;
  }
}
body #app > .framework .sections {
  position: absolute;
  top: 0;
  left: 0;
  width: 100vw;
  height: 100vh;
}
body #app > .framework .sections.backgrounds > section {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  transform: translateY(-100vh);
  overflow: hidden;
  z-index: -1;
}
body #app > .framework .sections.backgrounds > section > .image {
  background-position: center;
  background-size: cover;
  width: 100%;
  height: 130%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
body #app > .framework .sections.backgrounds > section > .image.parallax-part {
  width: 120%;
}
body #app > .framework .sections.backgrounds > section.hidden {
  transform: translate(-100vw, -100vh) !important;
  pointer-events: none;
}
body #app > .framework .sections.backgrounds > section[data-title="Homepage"] {
  transform: translateY(0vh);
}
@media (max-width: 768px) {
  body #app > .framework .sections.backgrounds > section div[style*="/1.jpg"] {
    background-image: url('/files/images/1.scaled.jpg') !important;
  }
  body #app > .framework .sections.backgrounds > section div[style*="/Multi_01_Home_bg.jpg"] {
    background-image: url('/files/images/Multi_01_Home_bg.scaled.jpg') !important;
  }
}
body #app > .framework .sections.backgrounds > section.background.black {
  background-color: #1d1d1b;
}
body #app > .framework .sections.backgrounds > section.background.purple {
  background-color: #2a1478;
}
body #app > .framework .sections.backgrounds > section.background.grey {
  background-color: #5f6369;
}
body #app > .framework .sections.backgrounds > section.background.dark-blue {
  background-color: #003c7d;
}
body #app > .framework .sections.backgrounds > section.background.light-blue {
  background-color: #00a0f5;
}
body #app > .framework .sections.backgrounds > section.z0 {
  z-index: 0;
}
body #app > .framework .sections.backgrounds > section.z1 {
  z-index: 1;
}
body #app > .framework .sections.backgrounds > section.z2 {
  z-index: 3;
}
body #app > .framework .sections.backgrounds > section .filter {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(to top, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.15) 100%);
}
body #app > .framework .sections.foregrounds {
  overflow: hidden;
}
body #app > .framework .sections.foregrounds > section {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  opacity: 0;
  z-index: -1;
}
body #app > .framework .sections.foregrounds > section.hidden {
  transform: translate(-100vw, -100vh) !important;
}
body #app > .framework .sections.foregrounds > section.z0 {
  z-index: 2;
}
body #app > .framework .sections.foregrounds > section.z1 {
  z-index: 3;
}
body #app > .framework .sections.foregrounds > section.z2 {
  z-index: 4;
}
body #app > .framework .sections.foregrounds > section > .center {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 64%;
  max-height: 100%;
  transform: translate(-50%, -50%);
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section > .center {
    width: 100%;
    padding: 0px 15px;
    box-sizing: border-box;
  }
}
body #app > .framework .sections.foregrounds > section > .content {
  position: absolute;
  left: 16vw;
  right: 8vw;
  top: 94px;
  bottom: 54px;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section > .content {
    top: 0;
    padding-top: 29vh;
    left: 4vw;
    right: 4vw;
  }
}
body #app > .framework .sections.foregrounds > section .overflow,
body #app > .framework .sections.foregrounds > section.overflow {
  -webkit-overflow-scrolling: touch;
}
body #app > .framework .sections.foregrounds > section .overflow.overflow-x,
body #app > .framework .sections.foregrounds > section.overflow.overflow-x {
  overflow-x: scroll;
  overflow-y: visible;
}
body #app > .framework .sections.foregrounds > section .overflow.overflow-y,
body #app > .framework .sections.foregrounds > section.overflow.overflow-y {
  overflow-y: scroll;
  overflow-x: visible;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section .overflow.mobile-overflow-x,
  body #app > .framework .sections.foregrounds > section.overflow.mobile-overflow-x {
    overflow-x: scroll;
    overflow-y: visible;
  }
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section .overflow.mobile-overflow-y,
  body #app > .framework .sections.foregrounds > section.overflow.mobile-overflow-y {
    overflow-y: scroll;
    overflow-x: visible;
  }
}
body #app > .framework .sections.foregrounds > section p,
body #app > .framework .sections.foregrounds > section h1 {
  position: absolute;
  line-height: 1.3em;
  margin: 0;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section p,
  body #app > .framework .sections.foregrounds > section h1 {
    position: relative;
    top: auto;
    left: auto;
    right: auto;
    bottom: auto;
    width: 100%;
  }
}
body #app > .framework .sections.foregrounds > section .dots {
  position: absolute;
  bottom: 0%;
  left: 50%;
  transform: translateX(-50%) !important;
  width: auto;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section .dots {
    bottom: auto;
    top: var(--innerHeight, 100vh);
    transform: translate(-50%, -200%) !important;
  }
}
body #app > .framework .sections.foregrounds > section .dots > .dot {
  display: inline-block;
  width: 4vw;
  margin-right: 4vw;
  padding: 4vw 0;
  cursor: pointer;
  opacity: 0.5;
  transition: opacity 0.3s ease-in-out;
}
body #app > .framework .sections.foregrounds > section .dots > .dot.active {
  opacity: 1;
}
body #app > .framework .sections.foregrounds > section .dots > .dot > span {
  background: white;
  height: 2px;
  display: block;
  width: 100%;
}
body #app > .framework .sections.foregrounds > section .dots > .dot:last-child {
  margin-right: 0;
}
body #app > .framework .sections.foregrounds > section[data-title="A New Era"] .content {
  top: 0;
  left: 0;
  right: 0;
  height: 100vh;
  height: var(--innerHeight, 100vh);
  box-sizing: border-box;
  bottom: auto;
  padding-bottom: 29vh;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="A New Era"] .content {
    padding-bottom: 0;
    padding-top: 0;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="A New Era"] h1 {
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 4.16666667vw;
  line-height: 1.3em;
  text-align: center;
  font-weight: normal;
  letter-spacing: 0.1em;
  width: 52vw;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="A New Era"] h1 {
    font-size: 45px;
  }
}
@media (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="A New Era"] h1 {
    font-size: 72px;
  }
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="A New Era"] h1 {
    font-size: 2.36111111vw;
    line-height: 5em;
    width: 80%;
  }
}
@media (max-width: 768px) and (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="A New Era"] h1 {
    font-size: 25.5px;
  }
}
@media (max-width: 768px) and (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="A New Era"] h1 {
    font-size: 40.8px;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="A New Era"] h1 > span {
  display: block;
}
body #app > .framework .sections.foregrounds > section[data-title="A New Era"] h1 > span.small {
  margin-bottom: 3em;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="A New Era"] h1 > span.small {
    margin-bottom: 0;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Metropolis"] h1 {
  position: absolute;
  left: 4vw;
  width: 44vw;
  font-size: 6.25vw;
  font-weight: 500;
  line-height: 1.2em;
  margin: 0;
  color: white;
  bottom: 50%;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Metropolis"] h1 {
    font-size: 67.5px;
  }
}
@media (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="Metropolis"] h1 {
    font-size: 108px;
  }
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Metropolis"] h1 {
    position: relative;
    left: auto;
    bottom: auto;
    width: 100%;
    margin-bottom: 0.2em;
    font-size: 3.95833333vw;
  }
}
@media (max-width: 768px) and (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Metropolis"] h1 {
    font-size: 42.75px;
  }
}
@media (max-width: 768px) and (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="Metropolis"] h1 {
    font-size: 68.4px;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Metropolis"] p {
  right: 12vw;
  font-size: 1.52777778vw;
  line-height: 1.3em;
  width: 28vw;
  top: 64%;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Metropolis"] p {
    font-size: 16.5px;
  }
}
@media (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="Metropolis"] p {
    font-size: 26.4px;
  }
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Metropolis"] p {
    position: relative;
    font-size: 1.38888889vw;
    line-height: 2em;
    width: 100%;
    top: auto;
    right: auto;
  }
}
@media (max-width: 768px) and (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Metropolis"] p {
    font-size: 15px;
  }
}
@media (max-width: 768px) and (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="Metropolis"] p {
    font-size: 24px;
  }
}
body #app > .framework .sections.foregrounds > section[data-title*="Lorem Ipsum"] p {
  color: white;
  text-align: left;
}
body #app > .framework .sections.foregrounds > section[data-title*="Lorem Ipsum"] p.big {
  margin: 0;
  max-width: 67%;
  font-size: 1.45833333vw;
  line-height: 1.4em;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title*="Lorem Ipsum"] p.big {
    font-size: 15.75px;
  }
}
@media (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title*="Lorem Ipsum"] p.big {
    font-size: 25.2px;
  }
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title*="Lorem Ipsum"] p.big {
    font-size: 1.25vw;
    max-width: 100%;
  }
}
@media (max-width: 768px) and (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title*="Lorem Ipsum"] p.big {
    font-size: 13.5px;
  }
}
@media (max-width: 768px) and (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title*="Lorem Ipsum"] p.big {
    font-size: 21.6px;
  }
}
body #app > .framework .sections.foregrounds > section[data-title*="Lorem Ipsum"] p.small {
  margin: 3em 0 0 auto;
  max-width: 67%;
  font-size: 1.11111111vw;
  line-height: 1.4em;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title*="Lorem Ipsum"] p.small {
    font-size: 12px;
  }
}
@media (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title*="Lorem Ipsum"] p.small {
    font-size: 19.2px;
  }
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title*="Lorem Ipsum"] p.small {
    max-width: 100%;
    font-size: 0.97222222vw;
    margin: 1.5em 0 0 0;
  }
}
@media (max-width: 768px) and (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title*="Lorem Ipsum"] p.small {
    font-size: 10.5px;
  }
}
@media (max-width: 768px) and (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title*="Lorem Ipsum"] p.small {
    font-size: 16.8px;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Projects"] p {
  color: white;
  margin: 0;
  position: absolute;
}
body #app > .framework .sections.foregrounds > section[data-title="Projects"] p.big {
  bottom: 55%;
  left: 4vw;
  width: 44vw;
  font-size: 2.70833333vw;
  line-height: 1.3em;
  font-weight: 500;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Projects"] p.big {
    font-size: 29.25px;
  }
}
@media (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="Projects"] p.big {
    font-size: 46.8px;
  }
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Projects"] p.big {
    position: relative;
    font-size: 2.08333333vw;
    width: 100%;
    bottom: auto;
    left: auto;
    margin-bottom: 1.3em;
  }
}
@media (max-width: 768px) and (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Projects"] p.big {
    font-size: 22.5px;
  }
}
@media (max-width: 768px) and (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="Projects"] p.big {
    font-size: 36px;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Projects"] p.small {
  font-size: 1.18055556vw;
  line-height: 1.3em;
  width: 28vw;
  right: 12vw;
  top: 55%;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Projects"] p.small {
    font-size: 12.75px;
  }
}
@media (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="Projects"] p.small {
    font-size: 20.4px;
  }
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Projects"] p.small {
    position: relative;
    font-size: 1.38888889vw;
    width: 100%;
    right: auto;
    top: auto;
  }
}
@media (max-width: 768px) and (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Projects"] p.small {
    font-size: 15px;
  }
}
@media (max-width: 768px) and (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="Projects"] p.small {
    font-size: 24px;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Test Tower"] p {
  bottom: 38%;
  left: 4vw;
  width: 36vw;
  font-size: 2.70833333vw;
  font-weight: 500;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Test Tower"] p {
    font-size: 29.25px;
  }
}
@media (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="Test Tower"] p {
    font-size: 46.8px;
  }
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Test Tower"] p {
    position: relative;
    top: auto;
    left: auto;
    right: auto;
    bottom: auto;
    width: 100%;
    font-size: 2.22222222vw;
    width: 84vw;
  }
}
@media (max-width: 768px) and (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Test Tower"] p {
    font-size: 24px;
  }
}
@media (max-width: 768px) and (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="Test Tower"] p {
    font-size: 38.4px;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Test Tower"] img,
body #app > .framework .sections.foregrounds > section[data-title="Test Tower"] video {
  position: absolute;
  width: 60vw;
  bottom: 35%;
  left: 4vw;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Test Tower"] img,
  body #app > .framework .sections.foregrounds > section[data-title="Test Tower"] video {
    position: relative;
    top: auto;
    left: auto;
    right: auto;
    bottom: auto;
    width: 100%;
    top: -50px;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="FAQs 2"] .content .left,
body #app > .framework .sections.foregrounds > section[data-title="FAQs 3"] .content .left {
  top: 10%;
  left: 4vw;
  width: 28vw;
  font-size: 1.18055556vw;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="FAQs 2"] .content .left,
  body #app > .framework .sections.foregrounds > section[data-title="FAQs 3"] .content .left {
    font-size: 12.75px;
  }
}
@media (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="FAQs 2"] .content .left,
  body #app > .framework .sections.foregrounds > section[data-title="FAQs 3"] .content .left {
    font-size: 20.4px;
  }
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="FAQs 2"] .content .left,
  body #app > .framework .sections.foregrounds > section[data-title="FAQs 3"] .content .left {
    position: relative;
    top: auto;
    left: auto;
    right: auto;
    bottom: auto;
    width: 100%;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="FAQs 2"] .content .right,
body #app > .framework .sections.foregrounds > section[data-title="FAQs 3"] .content .right {
  top: 10%;
  width: 28vw;
  left: 36vw;
  font-size: 1.18055556vw;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="FAQs 2"] .content .right,
  body #app > .framework .sections.foregrounds > section[data-title="FAQs 3"] .content .right {
    font-size: 12.75px;
  }
}
@media (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="FAQs 2"] .content .right,
  body #app > .framework .sections.foregrounds > section[data-title="FAQs 3"] .content .right {
    font-size: 20.4px;
  }
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="FAQs 2"] .content .right,
  body #app > .framework .sections.foregrounds > section[data-title="FAQs 3"] .content .right {
    position: relative;
    top: auto;
    left: auto;
    right: auto;
    bottom: auto;
    width: 100%;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="FAQs 2"] .content .faq-block,
body #app > .framework .sections.foregrounds > section[data-title="FAQs 3"] .content .faq-block {
  display: block;
}
body #app > .framework .sections.foregrounds > section[data-title="FAQs 2"] .content .faq-block span,
body #app > .framework .sections.foregrounds > section[data-title="FAQs 3"] .content .faq-block span {
  display: block;
}
body #app > .framework .sections.foregrounds > section[data-title="FAQs 2"] .content .faq-block span span:last-child,
body #app > .framework .sections.foregrounds > section[data-title="FAQs 3"] .content .faq-block span span:last-child {
  margin-bottom: 1.3em;
}
body #app > .framework .sections.foregrounds > section[data-title="FAQs"] .content {
  left: 0;
  right: 0;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="FAQs"] .content {
    right: 0;
    height: calc(var(--innerHeight, 100vh) - 29vh);
    bottom: auto;
    overflow-y: hidden;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="FAQs"] .carousel {
  width: auto;
  margin: 0 0 0 16vw;
  top: 50%;
  transform: translateY(-50%) !important;
  overflow: scroll;
  white-space: nowrap;
  position: relative;
  -webkit-overflow-scrolling: touch;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="FAQs"] .carousel {
    margin: 6vw 0;
    padding-bottom: 32vw;
    top: 0;
    transform: none !important;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="FAQs"] .carousel .faq-block {
  vertical-align: top;
  font-size: 1.18055556vw;
  line-height: 1.3em;
  display: inline-block;
  position: relative;
  margin-right: 4vw;
  width: 28vw;
  color: white;
  white-space: normal;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="FAQs"] .carousel .faq-block {
    font-size: 12.75px;
  }
}
@media (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="FAQs"] .carousel .faq-block {
    font-size: 20.4px;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="FAQs"] .carousel .faq-block:last-child {
  padding-right: 52vw;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="FAQs"] .carousel .faq-block {
    width: 72vw;
    margin-right: 12vw;
  }
  body #app > .framework .sections.foregrounds > section[data-title="FAQs"] .carousel .faq-block:first-child {
    margin-left: 4vw;
  }
  body #app > .framework .sections.foregrounds > section[data-title="FAQs"] .carousel .faq-block:last-child {
    margin-right: 4vw;
    padding-right: 20vw;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="FAQs"] .carousel .faq-block span {
  display: block;
}
body #app > .framework .sections.foregrounds > section[data-title="FAQs"] .carousel .faq-block > span {
  margin-bottom: 1.3em;
}
body #app > .framework .sections.foregrounds > section[data-title="The Team"] .content {
  left: 0;
  right: 0;
}
body #app > .framework .sections.foregrounds > section[data-title="The Team"] .overflow {
  overflow-x: auto;
  overflow-y: hidden;
  height: 100%;
  white-space: nowrap;
  -webkit-overflow-scrolling: touch;
}
body #app > .framework .sections.foregrounds > section[data-title="The Team"] .intro {
  display: inline-block;
  vertical-align: middle;
  width: 28vw;
  white-space: normal;
  margin-left: 20vw;
  overflow: hidden;
}
body #app > .framework .sections.foregrounds > section[data-title="The Team"] .intro span {
  display: block;
  line-height: 1.3em;
}
body #app > .framework .sections.foregrounds > section[data-title="The Team"] .intro span.small {
  width: 100%;
  font-size: 1.52777778vw;
  margin-bottom: 1em;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="The Team"] .intro span.small {
    font-size: 16.5px;
  }
}
@media (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="The Team"] .intro span.small {
    font-size: 26.4px;
  }
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="The Team"] .intro span.small {
    font-size: 1.38888889vw;
  }
}
@media (max-width: 768px) and (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="The Team"] .intro span.small {
    font-size: 15px;
  }
}
@media (max-width: 768px) and (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="The Team"] .intro span.small {
    font-size: 24px;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="The Team"] .intro span.big {
  width: 100%;
  margin: 0;
  font-size: 4.02777778vw;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="The Team"] .intro span.big {
    font-size: 43.5px;
  }
}
@media (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="The Team"] .intro span.big {
    font-size: 69.6px;
  }
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="The Team"] .intro span.big {
    font-size: 2.08333333vw;
  }
}
@media (max-width: 768px) and (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="The Team"] .intro span.big {
    font-size: 22.5px;
  }
}
@media (max-width: 768px) and (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="The Team"] .intro span.big {
    font-size: 36px;
  }
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="The Team"] .intro {
    position: relative;
    top: auto;
    left: auto;
    right: auto;
    bottom: auto;
    width: 100%;
    width: 84vw;
    margin-left: 8vw;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="The Team"] .team {
  display: inline-block;
  vertical-align: middle;
  height: 90%;
}
body #app > .framework .sections.foregrounds > section[data-title="The Team"] .team .team-member {
  display: inline-block;
  vertical-align: top;
  height: 100%;
  margin: 0 1vw;
  box-sizing: border-box;
  position: relative;
}
body #app > .framework .sections.foregrounds > section[data-title="The Team"] .team .team-member .team-photo {
  position: relative;
  height: 100%;
  width: 28vw;
  background-size: cover;
  background-position: center;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="The Team"] .team .team-member .team-photo {
    width: 80vw;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="The Team"] .team .team-member .badge {
  position: absolute;
  right: 0;
  width: 16vw;
  white-space: normal;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="The Team"] .team .team-member .badge {
    width: 52vw;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="The Team"] .team .team-member .badge h5 {
  font-size: 2.70833333vw;
  margin: 0;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="The Team"] .team .team-member .badge h5 {
    font-size: 29.25px;
  }
}
@media (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="The Team"] .team .team-member .badge h5 {
    font-size: 46.8px;
  }
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="The Team"] .team .team-member .badge h5 {
    font-size: 2.22222222vw;
    font-weight: normal;
  }
}
@media (max-width: 768px) and (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="The Team"] .team .team-member .badge h5 {
    font-size: 24px;
  }
}
@media (max-width: 768px) and (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="The Team"] .team .team-member .badge h5 {
    font-size: 38.4px;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="The Team"] .team .team-member .badge h6 {
  font-size: 1.18055556vw;
  margin: 0;
  margin-top: 1em;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="The Team"] .team .team-member .badge h6 {
    font-size: 12.75px;
  }
}
@media (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="The Team"] .team .team-member .badge h6 {
    font-size: 20.4px;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="The Team"] .team .team-member .social-media {
  display: inline-block;
  vertical-align: middle;
  font-size: 0;
}
body #app > .framework .sections.foregrounds > section[data-title="The Team"] .team .team-member .social-media a {
  display: inline-block;
  width: 25px;
  height: 25px;
  margin-left: 15px;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
}
body #app > .framework .sections.foregrounds > section[data-title="The Team"] .team .team-member .social-media a.facebook {
  background-image: url('/files/images/facebook.svg');
}
body #app > .framework .sections.foregrounds > section[data-title="The Team"] .team .team-member .social-media a.twitter {
  background-image: url('/files/images/twitter.svg');
}
body #app > .framework .sections.foregrounds > section[data-title="The Team"] .team .team-member:nth-child(odd) {
  padding-top: 4vw;
}
body #app > .framework .sections.foregrounds > section[data-title="The Team"] .team .team-member:nth-child(odd) .badge {
  bottom: 0;
}
body #app > .framework .sections.foregrounds > section[data-title="The Team"] .team .team-member:nth-child(even) {
  padding-bottom: 4vw;
}
body #app > .framework .sections.foregrounds > section[data-title="The Team"] .team .team-member:nth-child(even) .badge {
  bottom: 0;
}
body #app > .framework .sections.foregrounds > section[data-title="Projects > Partner with ThyssenKrupp"] .content img {
  position: absolute;
  right: 4vw;
  bottom: 4vw;
  width: 36vw;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Projects > Partner with ThyssenKrupp"] .content img {
    position: absolute;
    top: auto;
    left: auto;
    right: auto;
    bottom: auto;
    width: 100%;
    top: 14vh;
    width: 80vw;
    right: -4vw;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Projects > Partner with ThyssenKrupp"] .content p {
  position: absolute;
  left: 4vw;
  width: 44vw;
  bottom: 33%;
  color: white;
  font-size: 2.08333333vw;
  font-weight: 500;
  line-height: 1.3em;
  margin: 0;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Projects > Partner with ThyssenKrupp"] .content p {
    font-size: 22.5px;
  }
}
@media (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="Projects > Partner with ThyssenKrupp"] .content p {
    font-size: 36px;
  }
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Projects > Partner with ThyssenKrupp"] .content p {
    position: relative;
    font-size: 1.66666667vw;
    width: 100%;
    bottom: auto;
    left: auto;
    margin-top: 3.5em;
  }
}
@media (max-width: 768px) and (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Projects > Partner with ThyssenKrupp"] .content p {
    font-size: 18px;
  }
}
@media (max-width: 768px) and (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="Projects > Partner with ThyssenKrupp"] .content p {
    font-size: 28.8px;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Projects > Partner with ThyssenKrupp"] .content p .quote-attribution {
  display: block;
  margin-top: 1.3em;
  font-size: 1.18055556vw;
  font-weight: normal;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Projects > Partner with ThyssenKrupp"] .content p .quote-attribution {
    font-size: 12.75px;
  }
}
@media (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="Projects > Partner with ThyssenKrupp"] .content p .quote-attribution {
    font-size: 20.4px;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Projects > Attracted Interest"] p {
  position: absolute;
  bottom: 60%;
  left: 4vw;
  width: 44vw;
  font-size: 2.70833333vw;
  line-height: 1.3em;
  color: white;
  margin: 0;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Projects > Attracted Interest"] p {
    font-size: 29.25px;
  }
}
@media (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="Projects > Attracted Interest"] p {
    font-size: 46.8px;
  }
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Projects > Attracted Interest"] p {
    top: auto;
    left: auto;
    right: auto;
    bottom: auto;
    width: 100%;
    position: relative;
    font-size: 2.22222222vw;
    width: 80vw;
  }
}
@media (max-width: 768px) and (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Projects > Attracted Interest"] p {
    font-size: 24px;
  }
}
@media (max-width: 768px) and (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="Projects > Attracted Interest"] p {
    font-size: 38.4px;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Projects > Attracted Interest"] p.big.left {
  font-weight: 500;
}
body #app > .framework .sections.foregrounds > section[data-title="Projects > Attracted Interest"] p.small.left {
  top: 50%;
  bottom: auto;
  font-size: 1.66666667vw;
  width: 36vw;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Projects > Attracted Interest"] p.small.left {
    font-size: 18px;
  }
}
@media (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="Projects > Attracted Interest"] p.small.left {
    font-size: 28.8px;
  }
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Projects > Attracted Interest"] p.small.left {
    position: relative;
    top: auto;
    left: auto;
    right: auto;
    bottom: auto;
    width: 100%;
    font-size: 1.04166667vw;
    margin-top: 1em;
  }
}
@media (max-width: 768px) and (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Projects > Attracted Interest"] p.small.left {
    font-size: 11.25px;
  }
}
@media (max-width: 768px) and (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="Projects > Attracted Interest"] p.small.left {
    font-size: 18px;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Projects > Attracted Interest"] ul {
  position: absolute;
  top: 50%;
  padding: 0;
  right: 4vw;
  width: 28vw;
  font-size: 1.94444444vw;
  line-height: 1.3em;
  color: white;
  margin: 0;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Projects > Attracted Interest"] ul {
    font-size: 21px;
  }
}
@media (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="Projects > Attracted Interest"] ul {
    font-size: 33.6px;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Projects > Attracted Interest"] ul li {
  list-style: none;
  margin-bottom: 1em;
}
body #app > .framework .sections.foregrounds > section[data-title="Projects > Attracted Interest"] ul li:last-child {
  margin-bottom: 0;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Projects > Attracted Interest"] ul {
    position: relative;
    top: auto;
    left: auto;
    right: auto;
    bottom: auto;
    width: 100%;
    margin-top: 1em;
    width: 80vw;
    font-size: 1.38888889vw;
  }
}
@media (max-width: 768px) and (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Projects > Attracted Interest"] ul {
    font-size: 15px;
  }
}
@media (max-width: 768px) and (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="Projects > Attracted Interest"] ul {
    font-size: 24px;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Projects > Map"] .content {
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Projects > Map"] .content {
    top: 195px;
    padding: 0px 4vw;
    overflow: scroll;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Projects > Map"] img {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 60vw;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Projects > Map"] img {
    position: absolute;
    top: auto;
    left: auto;
    right: auto;
    bottom: auto;
    width: 100%;
    transform: none;
    position: relative;
    width: 160vw;
  }
}
body #app > .framework .sections.foregrounds > section.concept-repeatable-frame h1 {
  position: absolute;
  top: 0;
  right: 0;
  transform-origin: top right;
  transform: rotate(90deg) translateX(100%);
  color: white;
  font-size: 4.86111111vw;
  font-weight: normal;
  line-height: 130%;
  letter-spacing: 0.19em;
  text-transform: uppercase;
  margin: 0;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section.concept-repeatable-frame h1 {
    font-size: 52.5px;
  }
}
@media (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section.concept-repeatable-frame h1 {
    font-size: 84px;
  }
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section.concept-repeatable-frame h1 {
    font-size: 2.63888889vw;
  }
}
@media (max-width: 768px) and (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section.concept-repeatable-frame h1 {
    font-size: 28.5px;
  }
}
@media (max-width: 768px) and (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section.concept-repeatable-frame h1 {
    font-size: 45.6px;
  }
}
body #app > .framework .sections.foregrounds > section.concept-repeatable-frame img {
  position: absolute;
  top: 6%;
}
body #app > .framework .sections.foregrounds > section.concept-repeatable-frame img.left {
  width: 44vw;
  left: 4vw;
}
body #app > .framework .sections.foregrounds > section.concept-repeatable-frame img.right {
  width: 52vw;
  right: -4vw;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section.concept-repeatable-frame img.right {
    position: absolute;
    top: auto;
    left: auto;
    right: auto;
    bottom: auto;
    width: 100%;
    bottom: 10%;
    right: -4vw;
    width: 80vw;
  }
}
body #app > .framework .sections.foregrounds > section.concept-repeatable-frame .top {
  bottom: 50%;
  left: 4vw;
  width: 36vw;
  font-size: 2.70833333vw;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section.concept-repeatable-frame .top {
    font-size: 29.25px;
  }
}
@media (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section.concept-repeatable-frame .top {
    font-size: 46.8px;
  }
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section.concept-repeatable-frame .top {
    position: relative;
    top: auto;
    left: auto;
    right: auto;
    bottom: auto;
    width: 100%;
    width: 76vw;
    font-size: 2.22222222vw;
  }
}
@media (max-width: 768px) and (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section.concept-repeatable-frame .top {
    font-size: 24px;
  }
}
@media (max-width: 768px) and (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section.concept-repeatable-frame .top {
    font-size: 38.4px;
  }
}
body #app > .framework .sections.foregrounds > section.concept-repeatable-frame .bottom {
  top: 55%;
  left: 4vw;
  width: 60vw;
  font-size: 1.18055556vw;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section.concept-repeatable-frame .bottom {
    font-size: 12.75px;
  }
}
@media (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section.concept-repeatable-frame .bottom {
    font-size: 20.4px;
  }
}
body #app > .framework .sections.foregrounds > section.concept-repeatable-frame .bottom span {
  display: inline-block;
  vertical-align: top;
  line-height: 1.3em;
  margin-right: 4vw;
  width: 28vw;
}
body #app > .framework .sections.foregrounds > section.concept-repeatable-frame .bottom span:last-child {
  margin-right: 0;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section.concept-repeatable-frame .bottom {
    position: relative;
    top: auto;
    left: auto;
    right: auto;
    bottom: auto;
    width: 100%;
    margin-top: 1em;
  }
  body #app > .framework .sections.foregrounds > section.concept-repeatable-frame .bottom span {
    width: 76vw;
  }
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section.concept-repeatable-frame h1 {
    top: 29vh;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Projects > City Shaping"] .content video {
  position: absolute;
  width: 52vw;
  right: -4vw;
  left: auto;
  top: 6%;
  z-index: 0;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Projects > City Shaping"] .content video {
    position: relative;
    top: 4vw;
    right: auto;
    left: 8vw;
    width: 92vw;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Projects > City Shaping"] .content p {
  position: absolute;
  top: 50%;
  left: 4vw;
  width: 48vw;
  font-size: 1.66666667vw;
  z-index: 1;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Projects > City Shaping"] .content p {
    font-size: 18px;
  }
}
@media (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="Projects > City Shaping"] .content p {
    font-size: 28.8px;
  }
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Projects > City Shaping"] .content p {
    position: relative;
    top: auto;
    bottom: auto;
    left: auto;
    width: 84vw;
    font-size: 1.25vw;
  }
}
@media (max-width: 768px) and (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Projects > City Shaping"] .content p {
    font-size: 13.5px;
  }
}
@media (max-width: 768px) and (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="Projects > City Shaping"] .content p {
    font-size: 21.6px;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Linear Motor Technology"] h1 {
  left: 4vw;
  width: 44vw;
  bottom: 27%;
  z-index: 1;
}
body #app > .framework .sections.foregrounds > section[data-title="Linear Motor Technology"] h1 span {
  display: block;
}
body #app > .framework .sections.foregrounds > section[data-title="Linear Motor Technology"] h1 span.big {
  font-size: 2.70833333vw;
  line-height: 1.3em;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Linear Motor Technology"] h1 span.big {
    font-size: 29.25px;
  }
}
@media (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="Linear Motor Technology"] h1 span.big {
    font-size: 46.8px;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Linear Motor Technology"] h1 span.small {
  font-size: 1.52777778vw;
  font-weight: normal;
  line-height: 1.3em;
  margin-top: 1em;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Linear Motor Technology"] h1 span.small {
    font-size: 16.5px;
  }
}
@media (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="Linear Motor Technology"] h1 span.small {
    font-size: 26.4px;
  }
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Linear Motor Technology"] h1 {
    position: relative;
    top: auto;
    left: auto;
    right: auto;
    bottom: auto;
    width: 100%;
    width: 76vw;
    font-weight: normal;
  }
  body #app > .framework .sections.foregrounds > section[data-title="Linear Motor Technology"] h1 span.big {
    font-size: 2.08333333vw;
  }
  body #app > .framework .sections.foregrounds > section[data-title="Linear Motor Technology"] h1 span.small {
    font-size: 1.18055556vw;
  }
}
@media (max-width: 768px) and (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Linear Motor Technology"] h1 span.big {
    font-size: 22.5px;
  }
}
@media (max-width: 768px) and (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="Linear Motor Technology"] h1 span.big {
    font-size: 36px;
  }
}
@media (max-width: 768px) and (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Linear Motor Technology"] h1 span.small {
    font-size: 12.75px;
  }
}
@media (max-width: 768px) and (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="Linear Motor Technology"] h1 span.small {
    font-size: 20.4px;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Linear Motor Technology"] img {
  position: absolute;
}
body #app > .framework .sections.foregrounds > section[data-title="Linear Motor Technology"] img.desktop-only.up {
  top: -100px;
  width: 48vw;
  right: -8vw;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Linear Motor Technology"] img.desktop-only.up {
    position: absolute;
    top: auto;
    left: auto;
    right: auto;
    bottom: auto;
    width: 100%;
    display: none;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Linear Motor Technology"] img.desktop-only.down {
  width: 36vw;
  bottom: 0;
  right: -4vw;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Linear Motor Technology"] img.desktop-only.down {
    position: absolute;
    top: auto;
    left: auto;
    right: auto;
    bottom: auto;
    width: 100%;
    display: none;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Linear Motor Technology"] img.mobile-only {
  display: none;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Linear Motor Technology"] img.mobile-only {
    position: absolute;
    top: auto;
    left: auto;
    right: auto;
    bottom: auto;
    width: 100%;
    display: block;
  }
  body #app > .framework .sections.foregrounds > section[data-title="Linear Motor Technology"] img.mobile-only.up {
    top: 14vh;
    width: 72vw;
    right: -4vw;
  }
  body #app > .framework .sections.foregrounds > section[data-title="Linear Motor Technology"] img.mobile-only.down {
    top: 66%;
    width: 56vw;
    left: -4vw;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Linear Motor Technology"] video {
  position: absolute;
  width: 36vw;
  bottom: 0;
  right: -4vw;
  z-index: 0;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Linear Motor Technology"] video {
    bottom: 8vw;
    width: 84vw;
    left: -4vw;
    right: auto;
  }
}
@media (max-width: 768px) and (max-height: 633px) {
  body #app > .framework .sections.foregrounds > section[data-title="Linear Motor Technology"] video {
    width: 56vw;
    bottom: 8vw;
  }
}
@media (min-height: 768px) and (max-height: 1024px) and (max-width: 768px) and (orientation: portrait) {
  body #app > .framework .sections.foregrounds > section[data-title="Linear Motor Technology"] video {
    bottom: -1vw;
    width: 76vw;
    left: -4vw;
    right: auto;
  }
}
@media (min-width: 365px) and (min-height: 634px) and (max-width: 767px) and (max-height: 1023px) and (orientation: portrait) {
  body #app > .framework .sections.foregrounds > section[data-title="Linear Motor Technology"] video {
    position: relative;
    top: 4vw;
    bottom: auto;
    left: -4vw;
    right: auto;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Greater Capacity"] h1 {
  position: absolute;
  left: 4vw;
  bottom: 40%;
  width: 36vw;
  font-size: 4.02777778vw;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Greater Capacity"] h1 {
    font-size: 43.5px;
  }
}
@media (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="Greater Capacity"] h1 {
    font-size: 69.6px;
  }
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Greater Capacity"] h1 {
    position: relative;
    top: auto;
    left: auto;
    right: auto;
    bottom: auto;
    width: 100%;
    font-size: 2.08333333vw;
    width: 84vw;
  }
}
@media (max-width: 768px) and (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Greater Capacity"] h1 {
    font-size: 22.5px;
  }
}
@media (max-width: 768px) and (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="Greater Capacity"] h1 {
    font-size: 36px;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Greater Capacity"] p {
  right: 4vw;
  bottom: 4vw;
  width: 28vw;
  font-size: 1.18055556vw;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Greater Capacity"] p {
    font-size: 12.75px;
  }
}
@media (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="Greater Capacity"] p {
    font-size: 20.4px;
  }
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Greater Capacity"] p {
    position: relative;
    top: auto;
    left: auto;
    right: auto;
    bottom: auto;
    width: 100%;
    margin-top: 1.5em;
    width: 84vw;
    line-height: 1.5em;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Improving Transportation"] {
  z-index: 3 !important;
}
body #app > .framework .sections.foregrounds > section[data-title="Improving Transportation"] h1 {
  position: absolute;
  left: 4vw;
  top: 50%;
  transform: translateY(-54%);
  width: 52vw;
  font-size: 3.54166667vw;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Improving Transportation"] h1 {
    font-size: 38.25px;
  }
}
@media (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="Improving Transportation"] h1 {
    font-size: 61.2px;
  }
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Improving Transportation"] h1 {
    position: relative;
    top: auto;
    left: auto;
    right: auto;
    bottom: auto;
    width: 100%;
    font-size: 2.08333333vw;
    transform: none;
    width: 84vw;
  }
}
@media (max-width: 768px) and (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Improving Transportation"] h1 {
    font-size: 22.5px;
  }
}
@media (max-width: 768px) and (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="Improving Transportation"] h1 {
    font-size: 36px;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Improving Transportation"] img {
  position: absolute;
  bottom: -30%;
  right: -8vw;
  width: 64vw;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Improving Transportation"] img {
    position: absolute;
    top: auto;
    left: auto;
    right: auto;
    bottom: auto;
    width: 100%;
    width: 88vw;
    bottom: 0;
    right: -4vw;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Metros"] h1 {
  position: absolute;
  top: 0;
  right: 0;
  transform-origin: top right;
  transform: rotate(90deg) translateX(100%);
  color: white;
  font-size: 4.86111111vw;
  font-weight: normal;
  line-height: 130%;
  letter-spacing: 0.19em;
  text-transform: uppercase;
  margin: 0;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Metros"] h1 {
    font-size: 52.5px;
  }
}
@media (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="Metros"] h1 {
    font-size: 84px;
  }
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Metros"] h1 {
    font-size: 2.63888889vw;
  }
}
@media (max-width: 768px) and (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Metros"] h1 {
    font-size: 28.5px;
  }
}
@media (max-width: 768px) and (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="Metros"] h1 {
    font-size: 45.6px;
  }
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Metros"] h1 {
    top: 29vh;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Metros"] .big {
  top: 20%;
  left: 4vw;
  font-size: 2.70833333vw;
  line-height: 130.76923077%;
  width: 36vw;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Metros"] .big {
    font-size: 29.25px;
  }
}
@media (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="Metros"] .big {
    font-size: 46.8px;
  }
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Metros"] .big {
    position: relative;
    top: auto;
    left: auto;
    right: auto;
    bottom: auto;
    width: 100%;
    font-size: 2.22222222vw;
    width: 76vw;
  }
}
@media (max-width: 768px) and (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Metros"] .big {
    font-size: 24px;
  }
}
@media (max-width: 768px) and (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="Metros"] .big {
    font-size: 38.4px;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Metros"] .small {
  top: 47%;
  right: 8vw;
  transform: translateY(10%);
  font-size: 1.18055556vw;
  line-height: 141.17647059%;
  width: 24vw;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Metros"] .small {
    font-size: 12.75px;
  }
}
@media (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="Metros"] .small {
    font-size: 20.4px;
  }
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Metros"] .small {
    position: relative;
    top: auto;
    left: auto;
    right: auto;
    bottom: auto;
    width: 100%;
    font-size: 1.18055556vw;
    margin-top: 1em;
    width: 76vw;
  }
}
@media (max-width: 768px) and (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Metros"] .small {
    font-size: 12.75px;
  }
}
@media (max-width: 768px) and (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="Metros"] .small {
    font-size: 20.4px;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Metros"] video.bottom {
  position: absolute;
  top: 50%;
  left: 4vw;
  width: 36vw;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Metros"] video.bottom {
    position: relative;
    top: 8vw;
    bottom: auto;
    left: -4vw;
    width: 80vw;
  }
}
@media (max-width: 768px) and (max-height: 633px) {
  body #app > .framework .sections.foregrounds > section[data-title="Metros"] video.bottom {
    width: 56vw;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Metros"] img.top {
  position: absolute;
  top: -40%;
  right: -8vw;
  width: 64vw;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Metros"] img.top {
    position: absolute;
    top: auto;
    left: auto;
    right: auto;
    bottom: auto;
    width: 100%;
    top: -20%;
    right: -4vw;
    width: 88vw;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Airports"] img {
  position: absolute;
  top: 4vw;
  right: -8vw;
  width: 56vw;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Airports"] img {
    position: absolute;
    top: auto;
    left: auto;
    right: auto;
    bottom: auto;
    width: 100%;
    bottom: 0;
    right: -4vw;
    width: 80vw;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Airports"] .top {
  bottom: 50%;
  left: 4vw;
  width: 36vw;
  font-size: 2.70833333vw;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Airports"] .top {
    font-size: 29.25px;
  }
}
@media (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="Airports"] .top {
    font-size: 46.8px;
  }
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Airports"] .top {
    position: relative;
    top: auto;
    left: auto;
    right: auto;
    bottom: auto;
    width: 100%;
    width: 76vw;
    font-size: 2.22222222vw;
  }
}
@media (max-width: 768px) and (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Airports"] .top {
    font-size: 24px;
  }
}
@media (max-width: 768px) and (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="Airports"] .top {
    font-size: 38.4px;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Airports"] .bottom {
  top: 55%;
  left: 4vw;
  width: 60vw;
  font-size: 1.18055556vw;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Airports"] .bottom {
    font-size: 12.75px;
  }
}
@media (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="Airports"] .bottom {
    font-size: 20.4px;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Airports"] .bottom span {
  display: inline-block;
  vertical-align: top;
  line-height: 1.3em;
  margin-right: 4vw;
  width: 28vw;
}
body #app > .framework .sections.foregrounds > section[data-title="Airports"] .bottom span:last-child {
  margin-right: 0;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Airports"] .bottom {
    position: relative;
    top: auto;
    left: auto;
    right: auto;
    bottom: auto;
    width: 100%;
    margin-top: 1em;
  }
  body #app > .framework .sections.foregrounds > section[data-title="Airports"] .bottom span {
    width: 76vw;
  }
  body #app > .framework .sections.foregrounds > section[data-title="Airports"] .bottom span:last-child {
    margin-top: 1.3em;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Airports"] h1 {
  position: absolute;
  top: 0;
  right: 0;
  transform-origin: top right;
  transform: rotate(90deg) translateX(100%);
  color: white;
  font-size: 4.86111111vw;
  font-weight: normal;
  line-height: 130%;
  letter-spacing: 0.19em;
  text-transform: uppercase;
  margin: 0;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Airports"] h1 {
    font-size: 52.5px;
  }
}
@media (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="Airports"] h1 {
    font-size: 84px;
  }
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Airports"] h1 {
    font-size: 2.63888889vw;
  }
}
@media (max-width: 768px) and (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Airports"] h1 {
    font-size: 28.5px;
  }
}
@media (max-width: 768px) and (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="Airports"] h1 {
    font-size: 45.6px;
  }
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Airports"] h1 {
    top: 29vh;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Hotels"] .top,
body #app > .framework .sections.foregrounds > section[data-title="Shopping Malls"] .top {
  bottom: 45%;
  left: 4vw;
  width: 44vw;
  font-size: 2.70833333vw;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Hotels"] .top,
  body #app > .framework .sections.foregrounds > section[data-title="Shopping Malls"] .top {
    font-size: 29.25px;
  }
}
@media (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="Hotels"] .top,
  body #app > .framework .sections.foregrounds > section[data-title="Shopping Malls"] .top {
    font-size: 46.8px;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Hotels"] .top.right,
body #app > .framework .sections.foregrounds > section[data-title="Shopping Malls"] .top.right {
  left: auto;
  right: 8vw;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Hotels"] .top,
  body #app > .framework .sections.foregrounds > section[data-title="Shopping Malls"] .top {
    position: relative;
    top: auto;
    left: auto;
    right: auto;
    bottom: auto;
    width: 100%;
    width: 76vw;
    font-size: 2.22222222vw;
  }
}
@media (max-width: 768px) and (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Hotels"] .top,
  body #app > .framework .sections.foregrounds > section[data-title="Shopping Malls"] .top {
    font-size: 24px;
  }
}
@media (max-width: 768px) and (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="Hotels"] .top,
  body #app > .framework .sections.foregrounds > section[data-title="Shopping Malls"] .top {
    font-size: 38.4px;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Hotels"] .bottom,
body #app > .framework .sections.foregrounds > section[data-title="Shopping Malls"] .bottom {
  top: 60%;
  left: 4vw;
  width: 28vw;
  font-size: 1.18055556vw;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Hotels"] .bottom,
  body #app > .framework .sections.foregrounds > section[data-title="Shopping Malls"] .bottom {
    font-size: 12.75px;
  }
}
@media (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="Hotels"] .bottom,
  body #app > .framework .sections.foregrounds > section[data-title="Shopping Malls"] .bottom {
    font-size: 20.4px;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Hotels"] .bottom span,
body #app > .framework .sections.foregrounds > section[data-title="Shopping Malls"] .bottom span {
  display: inline-block;
  vertical-align: top;
  line-height: 1.3em;
  margin-right: 4vw;
  width: 28vw;
}
body #app > .framework .sections.foregrounds > section[data-title="Hotels"] .bottom span:last-child,
body #app > .framework .sections.foregrounds > section[data-title="Shopping Malls"] .bottom span:last-child {
  margin-right: 0;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Hotels"] .bottom,
  body #app > .framework .sections.foregrounds > section[data-title="Shopping Malls"] .bottom {
    position: relative;
    top: auto;
    left: auto;
    right: auto;
    bottom: auto;
    width: 100%;
    margin-top: 1em;
  }
  body #app > .framework .sections.foregrounds > section[data-title="Hotels"] .bottom span,
  body #app > .framework .sections.foregrounds > section[data-title="Shopping Malls"] .bottom span {
    width: 76vw;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Hotels"] h1,
body #app > .framework .sections.foregrounds > section[data-title="Shopping Malls"] h1 {
  position: absolute;
  top: 0;
  right: 0;
  transform-origin: top right;
  transform: rotate(90deg) translateX(100%);
  color: white;
  font-size: 4.86111111vw;
  font-weight: normal;
  line-height: 130%;
  letter-spacing: 0.19em;
  text-transform: uppercase;
  margin: 0;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Hotels"] h1,
  body #app > .framework .sections.foregrounds > section[data-title="Shopping Malls"] h1 {
    font-size: 52.5px;
  }
}
@media (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="Hotels"] h1,
  body #app > .framework .sections.foregrounds > section[data-title="Shopping Malls"] h1 {
    font-size: 84px;
  }
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Hotels"] h1,
  body #app > .framework .sections.foregrounds > section[data-title="Shopping Malls"] h1 {
    font-size: 2.63888889vw;
  }
}
@media (max-width: 768px) and (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Hotels"] h1,
  body #app > .framework .sections.foregrounds > section[data-title="Shopping Malls"] h1 {
    font-size: 28.5px;
  }
}
@media (max-width: 768px) and (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="Hotels"] h1,
  body #app > .framework .sections.foregrounds > section[data-title="Shopping Malls"] h1 {
    font-size: 45.6px;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Hotels"] img,
body #app > .framework .sections.foregrounds > section[data-title="Shopping Malls"] img {
  position: absolute;
  top: 6%;
}
body #app > .framework .sections.foregrounds > section[data-title="Hotels"] img.left,
body #app > .framework .sections.foregrounds > section[data-title="Shopping Malls"] img.left {
  width: 44vw;
  left: 8vw;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Hotels"] img.left,
  body #app > .framework .sections.foregrounds > section[data-title="Shopping Malls"] img.left {
    position: absolute;
    top: auto;
    left: auto;
    right: auto;
    bottom: auto;
    width: 100%;
    bottom: 10%;
    right: -4vw;
    width: 80vw;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Hotels"] img.right,
body #app > .framework .sections.foregrounds > section[data-title="Shopping Malls"] img.right {
  width: 52vw;
  right: -4vw;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Hotels"] h1,
  body #app > .framework .sections.foregrounds > section[data-title="Shopping Malls"] h1 {
    top: 29vh;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Offices"] h1 {
  position: absolute;
  top: 0;
  right: 0;
  transform-origin: top right;
  transform: rotate(90deg) translateX(100%);
  color: white;
  font-size: 4.86111111vw;
  font-weight: normal;
  line-height: 130%;
  letter-spacing: 0.19em;
  text-transform: uppercase;
  margin: 0;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Offices"] h1 {
    font-size: 52.5px;
  }
}
@media (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="Offices"] h1 {
    font-size: 84px;
  }
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Offices"] h1 {
    font-size: 2.63888889vw;
  }
}
@media (max-width: 768px) and (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Offices"] h1 {
    font-size: 28.5px;
  }
}
@media (max-width: 768px) and (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="Offices"] h1 {
    font-size: 45.6px;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Offices"] img {
  position: absolute;
  top: 6%;
}
body #app > .framework .sections.foregrounds > section[data-title="Offices"] img.left {
  width: 44vw;
  left: 4vw;
}
body #app > .framework .sections.foregrounds > section[data-title="Offices"] img.right {
  width: 52vw;
  right: -4vw;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Offices"] img.right {
    position: absolute;
    top: auto;
    left: auto;
    right: auto;
    bottom: auto;
    width: 100%;
    bottom: 10%;
    right: -4vw;
    width: 80vw;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Offices"] .top {
  bottom: 50%;
  left: 4vw;
  width: 36vw;
  font-size: 2.70833333vw;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Offices"] .top {
    font-size: 29.25px;
  }
}
@media (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="Offices"] .top {
    font-size: 46.8px;
  }
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Offices"] .top {
    position: relative;
    top: auto;
    left: auto;
    right: auto;
    bottom: auto;
    width: 100%;
    width: 76vw;
    font-size: 2.22222222vw;
  }
}
@media (max-width: 768px) and (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Offices"] .top {
    font-size: 24px;
  }
}
@media (max-width: 768px) and (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="Offices"] .top {
    font-size: 38.4px;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Offices"] .bottom {
  top: 55%;
  left: 4vw;
  width: 60vw;
  font-size: 1.18055556vw;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Offices"] .bottom {
    font-size: 12.75px;
  }
}
@media (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="Offices"] .bottom {
    font-size: 20.4px;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Offices"] .bottom span {
  display: inline-block;
  vertical-align: top;
  line-height: 1.3em;
  margin-right: 4vw;
  width: 28vw;
}
body #app > .framework .sections.foregrounds > section[data-title="Offices"] .bottom span:last-child {
  margin-right: 0;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Offices"] .bottom {
    position: relative;
    top: auto;
    left: auto;
    right: auto;
    bottom: auto;
    width: 100%;
    margin-top: 1em;
  }
  body #app > .framework .sections.foregrounds > section[data-title="Offices"] .bottom span {
    width: 76vw;
  }
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Offices"] h1 {
    top: 29vh;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Tech & Design > Linear Drive"] .content.video-to-left video,
body #app > .framework .sections.foregrounds > section[data-title="Tech & Design > Exchanger"] .content.video-to-left video,
body #app > .framework .sections.foregrounds > section[data-title="Tech & Design > Energy Storage"] .content.video-to-left video {
  left: auto;
  right: 36vw;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Tech & Design > Linear Drive"] .content.video-to-left video,
  body #app > .framework .sections.foregrounds > section[data-title="Tech & Design > Exchanger"] .content.video-to-left video,
  body #app > .framework .sections.foregrounds > section[data-title="Tech & Design > Energy Storage"] .content.video-to-left video {
    left: auto;
    right: auto;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Tech & Design > Linear Drive"] .content.video-to-left p,
body #app > .framework .sections.foregrounds > section[data-title="Tech & Design > Exchanger"] .content.video-to-left p,
body #app > .framework .sections.foregrounds > section[data-title="Tech & Design > Energy Storage"] .content.video-to-left p {
  left: 36vw;
  right: auto;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Tech & Design > Linear Drive"] .content.video-to-left p,
  body #app > .framework .sections.foregrounds > section[data-title="Tech & Design > Exchanger"] .content.video-to-left p,
  body #app > .framework .sections.foregrounds > section[data-title="Tech & Design > Energy Storage"] .content.video-to-left p {
    left: auto;
    right: auto;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Tech & Design > Linear Drive"] .content.video-to-right video,
body #app > .framework .sections.foregrounds > section[data-title="Tech & Design > Exchanger"] .content.video-to-right video,
body #app > .framework .sections.foregrounds > section[data-title="Tech & Design > Energy Storage"] .content.video-to-right video {
  left: 36vw;
  right: auto;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Tech & Design > Linear Drive"] .content.video-to-right video,
  body #app > .framework .sections.foregrounds > section[data-title="Tech & Design > Exchanger"] .content.video-to-right video,
  body #app > .framework .sections.foregrounds > section[data-title="Tech & Design > Energy Storage"] .content.video-to-right video {
    left: auto;
    right: auto;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Tech & Design > Linear Drive"] .content.video-to-right p,
body #app > .framework .sections.foregrounds > section[data-title="Tech & Design > Exchanger"] .content.video-to-right p,
body #app > .framework .sections.foregrounds > section[data-title="Tech & Design > Energy Storage"] .content.video-to-right p {
  left: auto;
  right: 37vw;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Tech & Design > Linear Drive"] .content.video-to-right p,
  body #app > .framework .sections.foregrounds > section[data-title="Tech & Design > Exchanger"] .content.video-to-right p,
  body #app > .framework .sections.foregrounds > section[data-title="Tech & Design > Energy Storage"] .content.video-to-right p {
    left: auto;
    right: auto;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Tech & Design > Linear Drive"] .content video,
body #app > .framework .sections.foregrounds > section[data-title="Tech & Design > Exchanger"] .content video,
body #app > .framework .sections.foregrounds > section[data-title="Tech & Design > Energy Storage"] .content video {
  display: block;
  position: absolute;
  width: 40vw;
  bottom: 10%;
  max-width: 40vw;
  max-height: 68vh;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Tech & Design > Linear Drive"] .content video,
  body #app > .framework .sections.foregrounds > section[data-title="Tech & Design > Exchanger"] .content video,
  body #app > .framework .sections.foregrounds > section[data-title="Tech & Design > Energy Storage"] .content video {
    position: relative;
    bottom: auto;
    width: 80vw;
    margin-top: -12vw;
    margin-right: -4vw;
    max-height: none;
    max-width: none;
    margin-left: auto;
  }
}
@media (max-width: 768px) and (max-height: 633px) {
  body #app > .framework .sections.foregrounds > section[data-title="Tech & Design > Linear Drive"] .content video,
  body #app > .framework .sections.foregrounds > section[data-title="Tech & Design > Exchanger"] .content video,
  body #app > .framework .sections.foregrounds > section[data-title="Tech & Design > Energy Storage"] .content video {
    width: 64vw;
  }
}
@media (min-height: 768px) and (max-height: 1024px) and (max-width: 768px) and (orientation: portrait) {
  body #app > .framework .sections.foregrounds > section[data-title="Tech & Design > Linear Drive"] .content video,
  body #app > .framework .sections.foregrounds > section[data-title="Tech & Design > Exchanger"] .content video,
  body #app > .framework .sections.foregrounds > section[data-title="Tech & Design > Energy Storage"] .content video {
    width: 64vw;
  }
}
@media (min-width: 365px) and (min-height: 634px) and (max-width: 767px) and (max-height: 1023px) and (orientation: portrait) {
  body #app > .framework .sections.foregrounds > section[data-title="Tech & Design > Linear Drive"] .content video,
  body #app > .framework .sections.foregrounds > section[data-title="Tech & Design > Exchanger"] .content video,
  body #app > .framework .sections.foregrounds > section[data-title="Tech & Design > Energy Storage"] .content video {
    width: 80vw;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Tech & Design > Linear Drive"] .content p,
body #app > .framework .sections.foregrounds > section[data-title="Tech & Design > Exchanger"] .content p,
body #app > .framework .sections.foregrounds > section[data-title="Tech & Design > Energy Storage"] .content p {
  position: absolute;
  width: 35vw;
  top: 50%;
  font-size: 1.66666667vw;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Tech & Design > Linear Drive"] .content p,
  body #app > .framework .sections.foregrounds > section[data-title="Tech & Design > Exchanger"] .content p,
  body #app > .framework .sections.foregrounds > section[data-title="Tech & Design > Energy Storage"] .content p {
    font-size: 18px;
  }
}
@media (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="Tech & Design > Linear Drive"] .content p,
  body #app > .framework .sections.foregrounds > section[data-title="Tech & Design > Exchanger"] .content p,
  body #app > .framework .sections.foregrounds > section[data-title="Tech & Design > Energy Storage"] .content p {
    font-size: 28.8px;
  }
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Tech & Design > Linear Drive"] .content p,
  body #app > .framework .sections.foregrounds > section[data-title="Tech & Design > Exchanger"] .content p,
  body #app > .framework .sections.foregrounds > section[data-title="Tech & Design > Energy Storage"] .content p {
    position: relative;
    top: -3vw;
    width: 84vw;
    left: auto;
    right: auto;
    font-size: 1.25vw;
  }
}
@media (max-width: 768px) and (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Tech & Design > Linear Drive"] .content p,
  body #app > .framework .sections.foregrounds > section[data-title="Tech & Design > Exchanger"] .content p,
  body #app > .framework .sections.foregrounds > section[data-title="Tech & Design > Energy Storage"] .content p {
    font-size: 13.5px;
  }
}
@media (max-width: 768px) and (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="Tech & Design > Linear Drive"] .content p,
  body #app > .framework .sections.foregrounds > section[data-title="Tech & Design > Exchanger"] .content p,
  body #app > .framework .sections.foregrounds > section[data-title="Tech & Design > Energy Storage"] .content p {
    font-size: 21.6px;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Test Tower > Highest Visitor Platform"] img {
  position: absolute;
  top: 45%;
  width: 36vw;
  left: 4vw;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Test Tower > Highest Visitor Platform"] img {
    position: absolute;
    top: auto;
    left: auto;
    right: auto;
    bottom: auto;
    width: 100%;
    width: 92vw;
    left: -4vw;
    bottom: 0;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Test Tower > Highest Visitor Platform"] p {
  width: 28vw;
  font-size: 2.70833333vw;
  font-weight: 500;
  right: 12vw;
  bottom: 35%;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Test Tower > Highest Visitor Platform"] p {
    font-size: 29.25px;
  }
}
@media (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="Test Tower > Highest Visitor Platform"] p {
    font-size: 46.8px;
  }
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Test Tower > Highest Visitor Platform"] p {
    position: relative;
    top: auto;
    left: auto;
    right: auto;
    bottom: auto;
    width: 100%;
    width: 80vw;
    font-size: 2.22222222vw;
  }
}
@media (max-width: 768px) and (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Test Tower > Highest Visitor Platform"] p {
    font-size: 24px;
  }
}
@media (max-width: 768px) and (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="Test Tower > Highest Visitor Platform"] p {
    font-size: 38.4px;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Test Tower > Visit"] img.desktop-only {
  position: absolute;
  bottom: 50%;
  width: 48vw;
  right: 0;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Test Tower > Visit"] img.desktop-only {
    position: absolute;
    top: auto;
    left: auto;
    right: auto;
    bottom: auto;
    width: 100%;
    display: none;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Test Tower > Visit"] img.mobile-only {
  display: none;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Test Tower > Visit"] img.mobile-only {
    position: absolute;
    top: auto;
    left: auto;
    right: auto;
    bottom: auto;
    width: 100%;
    display: block;
  }
  body #app > .framework .sections.foregrounds > section[data-title="Test Tower > Visit"] img.mobile-only.left {
    left: -52vw;
    width: 100vw;
    top: 14vh;
  }
  body #app > .framework .sections.foregrounds > section[data-title="Test Tower > Visit"] img.mobile-only.right {
    top: 14vh;
    right: -4vw;
    width: 60vw;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Test Tower > Visit"] p.large {
  top: 60%;
  left: 4vw;
  width: 30vw;
  font-size: 2.70833333vw;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Test Tower > Visit"] p.large {
    font-size: 29.25px;
  }
}
@media (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="Test Tower > Visit"] p.large {
    font-size: 46.8px;
  }
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Test Tower > Visit"] p.large {
    position: relative;
    top: auto;
    left: auto;
    right: auto;
    bottom: auto;
    width: 100%;
    font-size: 2.22222222vw;
    width: 80vw;
  }
}
@media (max-width: 768px) and (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Test Tower > Visit"] p.large {
    font-size: 24px;
  }
}
@media (max-width: 768px) and (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="Test Tower > Visit"] p.large {
    font-size: 38.4px;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Test Tower > Visit"] p.small {
  top: 60%;
  left: 44vw;
  width: 32vw;
  font-size: 2.70833333vw;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Test Tower > Visit"] p.small {
    font-size: 29.25px;
  }
}
@media (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="Test Tower > Visit"] p.small {
    font-size: 46.8px;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Test Tower > Visit"] p.small span {
  font-size: 1.18055556vw;
  line-height: 1.3em;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Test Tower > Visit"] p.small span {
    font-size: 12.75px;
  }
}
@media (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="Test Tower > Visit"] p.small span {
    font-size: 20.4px;
  }
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Test Tower > Visit"] p.small {
    position: relative;
    top: auto;
    left: auto;
    right: auto;
    bottom: auto;
    width: 100%;
    font-size: 1.18055556vw;
    width: 80vw;
    margin-top: 1.3em;
  }
}
@media (max-width: 768px) and (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Test Tower > Visit"] p.small {
    font-size: 12.75px;
  }
}
@media (max-width: 768px) and (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="Test Tower > Visit"] p.small {
    font-size: 20.4px;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Tech & Design"] img.top,
body #app > .framework .sections.foregrounds > section[data-title="Tech & Design"] video {
  position: absolute;
  bottom: 2%;
  left: 4vw;
  width: 52vw;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Tech & Design"] img.top,
  body #app > .framework .sections.foregrounds > section[data-title="Tech & Design"] video {
    position: absolute;
    top: auto;
    left: auto;
    right: auto;
    bottom: auto;
    width: 100%;
    top: 14vh;
    left: -4vw;
    width: 88vw;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Tech & Design"] img.bottom {
  display: none;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Tech & Design"] img.bottom {
    position: absolute;
    top: auto;
    left: auto;
    right: auto;
    bottom: auto;
    width: 100%;
    display: block;
    top: 66%;
    left: 0;
    right: 0;
    width: 92vw;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Tech & Design"] p {
  right: 12vw;
  width: 36vw;
  top: 18%;
}
body #app > .framework .sections.foregrounds > section[data-title="Tech & Design"] p span {
  display: block;
  line-height: 1.3em;
}
body #app > .framework .sections.foregrounds > section[data-title="Tech & Design"] p span.big {
  font-size: 3.47222222vw;
  font-weight: 500;
  margin-bottom: 1em;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Tech & Design"] p span.big {
    font-size: 37.5px;
  }
}
@media (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="Tech & Design"] p span.big {
    font-size: 60px;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Tech & Design"] p span.small {
  font-size: 1.52777778vw;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Tech & Design"] p span.small {
    font-size: 16.5px;
  }
}
@media (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="Tech & Design"] p span.small {
    font-size: 26.4px;
  }
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Tech & Design"] p {
    position: relative;
    top: auto;
    left: auto;
    right: auto;
    bottom: auto;
    width: 100%;
    transform: none;
  }
  body #app > .framework .sections.foregrounds > section[data-title="Tech & Design"] p span.big {
    font-size: 2.08333333vw;
    width: 76vw;
  }
  body #app > .framework .sections.foregrounds > section[data-title="Tech & Design"] p span.small {
    font-size: 1.38888889vw;
    width: 88vw;
  }
}
@media (max-width: 768px) and (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Tech & Design"] p span.big {
    font-size: 22.5px;
  }
}
@media (max-width: 768px) and (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="Tech & Design"] p span.big {
    font-size: 36px;
  }
}
@media (max-width: 768px) and (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Tech & Design"] p span.small {
    font-size: 15px;
  }
}
@media (max-width: 768px) and (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="Tech & Design"] p span.small {
    font-size: 24px;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > Creation of the Telephone"] .big {
  bottom: 48%;
  left: 4vw;
  width: 36vw;
  font-size: 1.94444444vw;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > Creation of the Telephone"] .big {
    font-size: 21px;
  }
}
@media (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > Creation of the Telephone"] .big {
    font-size: 33.6px;
  }
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > Creation of the Telephone"] .big {
    position: relative;
    top: auto;
    left: auto;
    right: auto;
    bottom: auto;
    width: 100%;
    font-size: 1.66666667vw;
    width: 84vw;
    margin-bottom: 1em;
  }
}
@media (max-width: 768px) and (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > Creation of the Telephone"] .big {
    font-size: 18px;
  }
}
@media (max-width: 768px) and (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > Creation of the Telephone"] .big {
    font-size: 28.8px;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > Creation of the Telephone"] .small {
  top: 60%;
  right: 12vw;
  width: 28vw;
  font-size: 1.18055556vw;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > Creation of the Telephone"] .small {
    font-size: 12.75px;
  }
}
@media (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > Creation of the Telephone"] .small {
    font-size: 20.4px;
  }
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > Creation of the Telephone"] .small {
    position: relative;
    top: auto;
    left: auto;
    right: auto;
    bottom: auto;
    width: 100%;
    font-size: 1.18055556vw;
    width: 84vw;
  }
}
@media (max-width: 768px) and (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > Creation of the Telephone"] .small {
    font-size: 12.75px;
  }
}
@media (max-width: 768px) and (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > Creation of the Telephone"] .small {
    font-size: 20.4px;
  }
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > The Sky is the Limit"] .content,
  body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > The Sky is the Limit Read More"] .content {
    right: 0;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > The Sky is the Limit"] img,
body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > The Sky is the Limit Read More"] img {
  position: absolute;
  bottom: 50%;
  width: 48vw;
  left: 36vw;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > The Sky is the Limit"] img,
  body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > The Sky is the Limit Read More"] img {
    width: 96vw;
    left: 0;
    bottom: 10%;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > The Sky is the Limit"] .big,
body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > The Sky is the Limit Read More"] .big {
  bottom: 50%;
  left: 4vw;
  width: 40vw;
  font-size: 2.70833333vw;
  font-weight: 500;
  margin-bottom: 1em;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > The Sky is the Limit"] .big,
  body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > The Sky is the Limit Read More"] .big {
    font-size: 29.25px;
  }
}
@media (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > The Sky is the Limit"] .big,
  body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > The Sky is the Limit Read More"] .big {
    font-size: 46.8px;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > The Sky is the Limit"] .big a,
body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > The Sky is the Limit Read More"] .big a {
  display: block;
  font-size: 43%;
  line-height: 1em;
  margin-top: 1.3em;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > The Sky is the Limit"] .big,
  body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > The Sky is the Limit Read More"] .big {
    position: relative;
    top: auto;
    left: auto;
    right: auto;
    bottom: auto;
    width: 100%;
    font-size: 2.22222222vw;
    width: 76vw;
  }
}
@media (max-width: 768px) and (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > The Sky is the Limit"] .big,
  body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > The Sky is the Limit Read More"] .big {
    font-size: 24px;
  }
}
@media (max-width: 768px) and (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > The Sky is the Limit"] .big,
  body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > The Sky is the Limit Read More"] .big {
    font-size: 38.4px;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > The Sky is the Limit"] .bullet,
body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > The Sky is the Limit Read More"] .bullet {
  position: relative;
  display: block;
  padding-left: 1em;
  margin-left: -1em;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > The Sky is the Limit"] .bullet,
  body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > The Sky is the Limit Read More"] .bullet {
    margin-left: 0;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > The Sky is the Limit"] .bullet:before,
body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > The Sky is the Limit Read More"] .bullet:before {
  content: "•";
  display: inline;
  position: absolute;
  line-height: 1.3em;
  font-size: 1em;
  top: 0;
  left: 0;
}
body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > The Sky is the Limit"] .column,
body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > The Sky is the Limit Read More"] .column {
  top: 55%;
  left: 4vw;
  width: 28vw;
  font-size: 1.18055556vw;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > The Sky is the Limit"] .column,
  body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > The Sky is the Limit Read More"] .column {
    font-size: 12.75px;
  }
}
@media (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > The Sky is the Limit"] .column,
  body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > The Sky is the Limit Read More"] .column {
    font-size: 20.4px;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > The Sky is the Limit"] .column.right,
body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > The Sky is the Limit Read More"] .column.right {
  left: 36vw;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > The Sky is the Limit"] .column,
  body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > The Sky is the Limit Read More"] .column {
    position: relative;
    top: auto;
    left: auto;
    right: auto;
    bottom: auto;
    width: 100%;
    width: 76vw;
    margin-bottom: 1em;
  }
  body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > The Sky is the Limit"] .column.right,
  body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > The Sky is the Limit Read More"] .column.right {
    left: 0;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > The Sky is the Limit"] .column.mobileOnly,
body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > The Sky is the Limit Read More"] .column.mobileOnly {
  display: none;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > The Sky is the Limit"] .column.mobileOnly,
  body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > The Sky is the Limit Read More"] .column.mobileOnly {
    display: block;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > The Sky is the Limit"] .column.mobileOnly .go,
body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > The Sky is the Limit Read More"] .column.mobileOnly .go {
  font-size: 1.38888889vw;
  padding: 1em 0;
  font-weight: 500;
  cursor: pointer;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > The Sky is the Limit"] .column.mobileOnly .go,
  body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > The Sky is the Limit Read More"] .column.mobileOnly .go {
    font-size: 15px;
  }
}
@media (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > The Sky is the Limit"] .column.mobileOnly .go,
  body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > The Sky is the Limit Read More"] .column.mobileOnly .go {
    font-size: 24px;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > The Sky is the Limit"] .column.mobileOnly .go:after,
body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > The Sky is the Limit Read More"] .column.mobileOnly .go:after {
  content: "\e653";
  display: inline-block;
  font-size: 1.11111111vw;
  line-height: 1em;
  margin-left: 1em;
  color: white;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > The Sky is the Limit"] .column.mobileOnly .go:after,
  body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > The Sky is the Limit Read More"] .column.mobileOnly .go:after {
    font-size: 12px;
  }
}
@media (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > The Sky is the Limit"] .column.mobileOnly .go:after,
  body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > The Sky is the Limit Read More"] .column.mobileOnly .go:after {
    font-size: 19.2px;
  }
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > The Sky is the Limit"] .column.desktopOnly,
  body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > The Sky is the Limit Read More"] .column.desktopOnly {
    display: none;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > The Sky is the Limit"] .carousel,
body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > The Sky is the Limit Read More"] .carousel {
  width: 100%;
  height: 100%;
  overflow: visible;
  white-space: nowrap;
  position: relative;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > The Sky is the Limit"] .carousel,
  body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > The Sky is the Limit Read More"] .carousel {
    overflow: scroll;
    overflow-y: hidden;
    -webkit-overflow-scrolling: touch;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > The Sky is the Limit"] .carousel > span,
body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > The Sky is the Limit Read More"] .carousel > span {
  width: 86%;
  height: 100%;
  display: inline-block;
  vertical-align: top;
  white-space: normal;
  position: relative;
}
body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > The Sky is the Limit"] .carousel > span.mobileOnly,
body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > The Sky is the Limit Read More"] .carousel > span.mobileOnly {
  display: none;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > The Sky is the Limit"] .carousel > span.mobileOnly,
  body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > The Sky is the Limit Read More"] .carousel > span.mobileOnly {
    display: inline-block;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > Mechanical Miracle"] {
  z-index: 3;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > Mechanical Miracle"] {
    z-index: 2;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > Mechanical Miracle"] img.top.right {
  position: absolute;
  bottom: 45%;
  width: 44vw;
  right: 4vw;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > Mechanical Miracle"] img.top.right {
    position: absolute;
    top: auto;
    left: auto;
    right: auto;
    bottom: auto;
    width: 100%;
    top: 11vh;
    width: 80vw;
    right: 0;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > Mechanical Miracle"] img.bottom.left {
  position: absolute;
  top: 60%;
  width: 28vw;
  left: 4vw;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > Mechanical Miracle"] img.bottom.left {
    position: absolute;
    top: auto;
    left: auto;
    right: auto;
    bottom: auto;
    width: 100%;
    bottom: -15%;
    width: 84vw;
    left: -4vw;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > Mechanical Miracle"] .bullet {
  position: relative;
  display: block;
  padding-left: 1em;
  margin-left: -1em;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > Mechanical Miracle"] .bullet {
    margin-left: 0;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > Mechanical Miracle"] .bullet:before {
  content: "•";
  display: inline;
  position: absolute;
  line-height: 1.3em;
  font-size: 1em;
  top: 0;
  left: 0;
}
body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > Mechanical Miracle"] p.big {
  bottom: 60%;
  width: 36vw;
  left: 4vw;
  font-size: 2.70833333vw;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > Mechanical Miracle"] p.big {
    font-size: 29.25px;
  }
}
@media (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > Mechanical Miracle"] p.big {
    font-size: 46.8px;
  }
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > Mechanical Miracle"] p.big {
    position: relative;
    top: auto;
    left: auto;
    right: auto;
    bottom: auto;
    width: 100%;
    font-size: 2.22222222vw;
    width: 76vw;
    margin-bottom: 1em;
  }
}
@media (max-width: 768px) and (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > Mechanical Miracle"] p.big {
    font-size: 24px;
  }
}
@media (max-width: 768px) and (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > Mechanical Miracle"] p.big {
    font-size: 38.4px;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > Mechanical Miracle"] p.small {
  top: 60%;
  width: 28vw;
  right: 12vw;
  font-size: 1.18055556vw;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > Mechanical Miracle"] p.small {
    font-size: 12.75px;
  }
}
@media (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > Mechanical Miracle"] p.small {
    font-size: 20.4px;
  }
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > Mechanical Miracle"] p.small {
    position: relative;
    top: auto;
    left: auto;
    right: auto;
    bottom: auto;
    width: 100%;
    width: 84vw;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > Artificial Intelligence"] img {
  position: absolute;
  bottom: 0;
  right: 4vw;
  width: 36vw;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > Artificial Intelligence"] img {
    position: absolute;
    top: auto;
    left: auto;
    right: auto;
    bottom: auto;
    width: 100%;
    top: 44%;
    right: -4vw;
    width: 60vw;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > Artificial Intelligence"] .bullet {
  position: relative;
  display: block;
  padding-left: 1em;
  margin-left: -1em;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > Artificial Intelligence"] .bullet {
    margin-left: 0;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > Artificial Intelligence"] .bullet:before {
  content: "•";
  display: inline;
  position: absolute;
  line-height: 1.3em;
  font-size: 1em;
  top: 0;
  left: 0;
}
body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > Artificial Intelligence"] p {
  top: 50%;
  transform: translateY(-50%);
  width: 28vw;
  left: 4vw;
  font-size: 1.18055556vw;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > Artificial Intelligence"] p {
    font-size: 12.75px;
  }
}
@media (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > Artificial Intelligence"] p {
    font-size: 20.4px;
  }
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Urban Evolution > Artificial Intelligence"] p {
    position: relative;
    top: auto;
    left: auto;
    right: auto;
    bottom: auto;
    width: 100%;
    transform: none;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Footer"] .wrapper {
  width: 100%;
  height: 50vh;
  height: calc(var(--innerHeight, 100vh) * 0.5);
  position: relative;
}
body #app > .framework .sections.foregrounds > section[data-title="Footer"] .footer {
  display: block;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Footer"] .footer {
    display: none;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Footer"] .mobile-footer {
  display: none;
  margin: 0 4vw;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Footer"] .mobile-footer {
    display: block;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Footer"] .footer,
body #app > .framework .sections.foregrounds > section[data-title="Footer"] .mobile-footer {
  position: absolute;
  bottom: 0;
  left: 0;
  padding: 2vw 0;
}
body #app > .framework .sections.foregrounds > section[data-title="Footer"] .footer.mobile-footer,
body #app > .framework .sections.foregrounds > section[data-title="Footer"] .mobile-footer.mobile-footer {
  bottom: 10%;
}
body #app > .framework .sections.foregrounds > section[data-title="Footer"] .footer .links,
body #app > .framework .sections.foregrounds > section[data-title="Footer"] .mobile-footer .links {
  width: 72vw;
  margin: 0 auto 4vw;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Footer"] .footer .links,
  body #app > .framework .sections.foregrounds > section[data-title="Footer"] .mobile-footer .links {
    width: 100%;
    margin: 4vw auto;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Footer"] .footer .links .column,
body #app > .framework .sections.foregrounds > section[data-title="Footer"] .mobile-footer .links .column {
  display: inline-block;
  vertical-align: top;
  width: 12vw;
  margin: 0 6vw;
}
body #app > .framework .sections.foregrounds > section[data-title="Footer"] .footer .links .column span,
body #app > .framework .sections.foregrounds > section[data-title="Footer"] .mobile-footer .links .column span,
body #app > .framework .sections.foregrounds > section[data-title="Footer"] .footer .links .column a,
body #app > .framework .sections.foregrounds > section[data-title="Footer"] .mobile-footer .links .column a {
  font-size: 1.18055556vw;
  display: block;
  color: white;
  font-family: "TKType", "TKIconFont", sans-serif;
  font-weight: 500;
  margin-bottom: 1em;
  cursor: pointer;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Footer"] .footer .links .column span,
  body #app > .framework .sections.foregrounds > section[data-title="Footer"] .mobile-footer .links .column span,
  body #app > .framework .sections.foregrounds > section[data-title="Footer"] .footer .links .column a,
  body #app > .framework .sections.foregrounds > section[data-title="Footer"] .mobile-footer .links .column a {
    font-size: 12.75px;
  }
}
@media (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="Footer"] .footer .links .column span,
  body #app > .framework .sections.foregrounds > section[data-title="Footer"] .mobile-footer .links .column span,
  body #app > .framework .sections.foregrounds > section[data-title="Footer"] .footer .links .column a,
  body #app > .framework .sections.foregrounds > section[data-title="Footer"] .mobile-footer .links .column a {
    font-size: 20.4px;
  }
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Footer"] .footer .links .column span:last-child,
  body #app > .framework .sections.foregrounds > section[data-title="Footer"] .mobile-footer .links .column span:last-child,
  body #app > .framework .sections.foregrounds > section[data-title="Footer"] .footer .links .column a:last-child,
  body #app > .framework .sections.foregrounds > section[data-title="Footer"] .mobile-footer .links .column a:last-child {
    margin-bottom: 0;
  }
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Footer"] .footer .links .column,
  body #app > .framework .sections.foregrounds > section[data-title="Footer"] .mobile-footer .links .column {
    width: 44vw;
    margin: 0;
    vertical-align: top;
  }
  body #app > .framework .sections.foregrounds > section[data-title="Footer"] .footer .links .column:first-child,
  body #app > .framework .sections.foregrounds > section[data-title="Footer"] .mobile-footer .links .column:first-child {
    margin: 0 4vw 0 0;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Footer"] .footer .misc,
body #app > .framework .sections.foregrounds > section[data-title="Footer"] .mobile-footer .misc {
  width: 100%;
}
body #app > .framework .sections.foregrounds > section[data-title="Footer"] .footer .misc > *,
body #app > .framework .sections.foregrounds > section[data-title="Footer"] .mobile-footer .misc > * {
  display: inline-block;
  vertical-align: middle;
}
body #app > .framework .sections.foregrounds > section[data-title="Footer"] .footer .misc .copy,
body #app > .framework .sections.foregrounds > section[data-title="Footer"] .mobile-footer .misc .copy {
  margin-left: 4vw;
  font-size: 0.83333333vw;
  color: white;
  width: 20vw;
  margin-right: 20vw;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Footer"] .footer .misc .copy,
  body #app > .framework .sections.foregrounds > section[data-title="Footer"] .mobile-footer .misc .copy {
    font-size: 9px;
  }
}
@media (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="Footer"] .footer .misc .copy,
  body #app > .framework .sections.foregrounds > section[data-title="Footer"] .mobile-footer .misc .copy {
    font-size: 14.4px;
  }
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Footer"] .footer .misc .copy,
  body #app > .framework .sections.foregrounds > section[data-title="Footer"] .mobile-footer .misc .copy {
    width: auto;
    margin-left: 0;
    margin-right: 0;
    margin-top: 4vw;
    margin-bottom: 4vw;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Footer"] .footer .misc .social-media,
body #app > .framework .sections.foregrounds > section[data-title="Footer"] .mobile-footer .misc .social-media {
  width: 12vw;
  margin-right: 28vw;
  text-align: center;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Footer"] .footer .misc .social-media,
  body #app > .framework .sections.foregrounds > section[data-title="Footer"] .mobile-footer .misc .social-media {
    width: auto;
    margin-right: 0;
    text-align: left;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Footer"] .footer .misc .social-media a,
body #app > .framework .sections.foregrounds > section[data-title="Footer"] .mobile-footer .misc .social-media a {
  display: inline-block;
  width: 1vw;
  height: 1vw;
  margin-right: 2.66666667vw;
  background-size: contain;
  background-position: center;
  background-repeat: no-repeat;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Footer"] .footer .misc .social-media a,
  body #app > .framework .sections.foregrounds > section[data-title="Footer"] .mobile-footer .misc .social-media a {
    width: 6vw;
    height: 6vw;
    margin-right: 6vw;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Footer"] .footer .misc .social-media a:last-child,
body #app > .framework .sections.foregrounds > section[data-title="Footer"] .mobile-footer .misc .social-media a:last-child {
  margin-right: 0;
}
body #app > .framework .sections.foregrounds > section[data-title="Footer"] .footer .misc .social-media a.facebook,
body #app > .framework .sections.foregrounds > section[data-title="Footer"] .mobile-footer .misc .social-media a.facebook {
  background-image: url('/files/images/facebook.svg');
}
body #app > .framework .sections.foregrounds > section[data-title="Footer"] .footer .misc .social-media a.twitter,
body #app > .framework .sections.foregrounds > section[data-title="Footer"] .mobile-footer .misc .social-media a.twitter {
  background-image: url('/files/images/twitter.svg');
}
body #app > .framework .sections.foregrounds > section[data-title="Footer"] .footer .misc .social-media a.linkedin,
body #app > .framework .sections.foregrounds > section[data-title="Footer"] .mobile-footer .misc .social-media a.linkedin {
  background-image: url('/files/images/linkedin.svg');
}
body #app > .framework .sections.foregrounds > section[data-title="Footer"] .footer .misc .social-media a.youtube,
body #app > .framework .sections.foregrounds > section[data-title="Footer"] .mobile-footer .misc .social-media a.youtube {
  background-image: url('/files/images/youtube.svg');
}
body #app > .framework .sections.foregrounds > section[data-title="Footer"] .footer .misc .others,
body #app > .framework .sections.foregrounds > section[data-title="Footer"] .mobile-footer .misc .others {
  width: 16vw;
  text-align: center;
  font-size: 0.83333333vw;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Footer"] .footer .misc .others,
  body #app > .framework .sections.foregrounds > section[data-title="Footer"] .mobile-footer .misc .others {
    font-size: 9px;
  }
}
@media (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="Footer"] .footer .misc .others,
  body #app > .framework .sections.foregrounds > section[data-title="Footer"] .mobile-footer .misc .others {
    font-size: 14.4px;
  }
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Footer"] .footer .misc .others,
  body #app > .framework .sections.foregrounds > section[data-title="Footer"] .mobile-footer .misc .others {
    width: 100%;
    text-align: left;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Footer"] .footer .misc .others a:after,
body #app > .framework .sections.foregrounds > section[data-title="Footer"] .mobile-footer .misc .others a:after {
  content: "|";
  display: inline-block;
  margin: 0 1em;
  font-size: 0.83333333vw;
}
@media (max-width: 768px) {
  body #app > .framework .sections.foregrounds > section[data-title="Footer"] .footer .misc .others a:after,
  body #app > .framework .sections.foregrounds > section[data-title="Footer"] .mobile-footer .misc .others a:after {
    font-size: 9px;
  }
}
@media (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .sections.foregrounds > section[data-title="Footer"] .footer .misc .others a:after,
  body #app > .framework .sections.foregrounds > section[data-title="Footer"] .mobile-footer .misc .others a:after {
    font-size: 14.4px;
  }
}
body #app > .framework .sections.foregrounds > section[data-title="Footer"] .footer .misc .others a:last-child:after,
body #app > .framework .sections.foregrounds > section[data-title="Footer"] .mobile-footer .misc .others a:last-child:after {
  display: none;
}
body #app > .framework .mobile-menu {
  display: none;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  transform: translateY(100vh);
  transition: transform 1s ease-in-out;
  background-color: #003c7d;
  z-index: 101;
}
@media (max-width: 768px) {
  body #app > .framework .mobile-menu {
    display: block;
  }
}
body #app > .framework .mobile-menu > .header {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 12vh;
  opacity: 0;
  transition: opacity 0.3s ease-in-out;
}
body #app > .framework .mobile-menu > .header > img.multi-fixed {
  position: absolute;
  display: block;
  width: 101.6px;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
body #app > .framework .mobile-menu.open {
  transform: translateY(0vh);
}
body #app > .framework .mobile-menu.open > .header {
  transition: opacity 0.3s ease-in-out 0.6s;
  opacity: 1;
}
body #app > .framework .mobile-menu > .body {
  margin-top: 24vw;
  padding-left: 4vw;
  box-sizing: border-box;
}
body #app > .framework .mobile-menu > .body > .nav {
  background: transparent;
  border: none;
  border-radius: 0;
  padding: 0;
  font-family: inherit;
  color: white;
  font-weight: normal;
  font-size: 1.94444444vw;
  margin-bottom: 1em;
  display: block;
  text-decoration: none;
  outline: none;
  vertical-align: middle;
  cursor: pointer;
  white-space: nowrap;
}
@media (max-width: 768px) {
  body #app > .framework .mobile-menu > .body > .nav {
    font-size: 21px;
  }
}
@media (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .mobile-menu > .body > .nav {
    font-size: 33.6px;
  }
}
body #app > .framework .mobile-menu > .footer {
  position: absolute;
  top: var(--innerHeight, 100vh);
  transform: translateY(-100%);
  left: 4vw;
  right: 4vw;
  height: 20vw;
  margin-top: -4vw;
}
body #app > .framework .mobile-menu > .footer > .tk-logo.desktop img {
  position: absolute;
  bottom: 0;
}
body #app > .framework .mobile-menu > .footer > .tk-logo.desktop img.logo {
  width: 24vw;
  left: 0;
}
body #app > .framework .mobile-menu > .footer > .tk-logo.desktop img.strap {
  position: absolute;
  width: 56vw;
  right: 0;
}
body #app > .framework section[data-title="Contact Us"] {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 8;
  background-color: #5f6369;
  transform: translateY(100%);
}
@media (max-width: 768px) {
  body #app > .framework section[data-title="Contact Us"] {
    z-index: 101;
  }
}
body #app > .framework section[data-title="Contact Us"] .toggle {
  width: 8vw;
  background-color: rgba(95, 99, 105, 0.41);
  color: white;
  font-size: 1.18055556vw;
  text-align: center;
  line-height: 2.7em;
  cursor: pointer;
  position: absolute;
  top: -2.7em;
  right: 4vw;
  opacity: 1;
  transition: opacity 0.3s ease-in-out;
}
@media (max-width: 768px) {
  body #app > .framework section[data-title="Contact Us"] .toggle {
    font-size: 12.75px;
  }
}
@media (max-width: 768px) and (min-height: 900px) {
  body #app > .framework section[data-title="Contact Us"] .toggle {
    font-size: 20.4px;
  }
}
@media (max-width: 768px) {
  body #app > .framework section[data-title="Contact Us"] .toggle {
    display: none;
  }
}
[data-page*="> Footer"] body #app > .framework section[data-title="Contact Us"] .toggle {
  opacity: 0;
  pointer-events: none;
}
body #app > .framework section[data-title="Contact Us"] .wrapper {
  width: 100%;
  height: 100%;
  padding: 6vw 0;
  box-sizing: border-box;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}
@media (max-width: 768px) {
  body #app > .framework section[data-title="Contact Us"] .wrapper {
    position: absolute;
    width: auto;
    height: auto;
    padding: 0;
    top: 0;
    left: 4vw;
    right: 4vw;
    height: var(--innerHeight, 100vh);
    overflow: visible;
  }
}
body #app > .framework section[data-title="Contact Us"] section.form {
  width: 60vw;
  position: relative;
  margin: 0 auto;
}
body #app > .framework section[data-title="Contact Us"] section.form h1 {
  position: absolute;
  top: 0;
  right: 0;
  transform-origin: top right;
  transform: rotate(90deg) translateX(100%);
  color: white;
  font-size: 4.86111111vw;
  font-weight: normal;
  line-height: 130%;
  letter-spacing: 0.19em;
  text-transform: uppercase;
  margin: 0;
}
@media (max-width: 768px) {
  body #app > .framework section[data-title="Contact Us"] section.form h1 {
    font-size: 52.5px;
  }
}
@media (max-width: 768px) and (min-height: 900px) {
  body #app > .framework section[data-title="Contact Us"] section.form h1 {
    font-size: 84px;
  }
}
@media (max-width: 768px) {
  body #app > .framework section[data-title="Contact Us"] section.form h1 {
    font-size: 2.63888889vw;
  }
}
@media (max-width: 768px) and (max-width: 768px) {
  body #app > .framework section[data-title="Contact Us"] section.form h1 {
    font-size: 28.5px;
  }
}
@media (max-width: 768px) and (max-width: 768px) and (min-height: 900px) {
  body #app > .framework section[data-title="Contact Us"] section.form h1 {
    font-size: 45.6px;
  }
}
@media (max-width: 768px) {
  body #app > .framework section[data-title="Contact Us"] section.form {
    width: 92vw;
    height: 100%;
  }
}
body #app > .framework section[data-title="Contact Us"] section.form > .header {
  display: none;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 12vh;
  opacity: 0;
  transition: opacity 0.3s ease-in-out;
}
@media (max-width: 768px) {
  body #app > .framework section[data-title="Contact Us"] section.form > .header {
    display: block;
  }
}
body #app > .framework section[data-title="Contact Us"] section.form > .header > img.multi-fixed {
  position: absolute;
  display: block;
  width: 101.6px;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
body #app > .framework section[data-title="Contact Us"] section.form > .header > img.tk-fixed {
  position: absolute;
  left: 0;
  width: 12vw;
  top: 50%;
  transform: translateY(-50%);
}
.contact-form-open body #app > .framework section[data-title="Contact Us"] section.form > .header {
  transition: opacity 0.3s ease-in-out 0.6s;
  opacity: 1;
}
body #app > .framework section[data-title="Contact Us"] section.form h1 {
  top: 1.6vw;
  right: -16vw;
  font-size: 1.38888889vw;
  letter-spacing: 0.2em;
  font-weight: bold;
}
@media (max-width: 768px) {
  body #app > .framework section[data-title="Contact Us"] section.form h1 {
    font-size: 15px;
  }
}
@media (max-width: 768px) and (min-height: 900px) {
  body #app > .framework section[data-title="Contact Us"] section.form h1 {
    font-size: 24px;
  }
}
@media (max-width: 768px) {
  body #app > .framework section[data-title="Contact Us"] section.form h1 {
    position: relative;
    padding-top: 15vh;
    top: 0;
    left: -4vw;
    right: auto;
    margin-bottom: 0;
    text-transform: uppercase;
    letter-spacing: 0.1em;
    transform: none;
    font-weight: 500;
    font-size: 0.97222222vw;
  }
  body #app > .framework section[data-title="Contact Us"] section.form h1:before {
    content: "";
    vertical-align: middle;
    display: inline-block;
    width: 3.2vw;
    height: 2px;
    background-color: white;
    margin-right: 0.8vw;
  }
}
@media (max-width: 768px) and (max-width: 768px) {
  body #app > .framework section[data-title="Contact Us"] section.form h1 {
    font-size: 10.5px;
  }
}
@media (max-width: 768px) and (max-width: 768px) and (min-height: 900px) {
  body #app > .framework section[data-title="Contact Us"] section.form h1 {
    font-size: 16.8px;
  }
}
body #app > .framework section[data-title="Contact Us"] section.form .close {
  position: absolute;
  top: 0;
  right: 0;
  width: 1.6vw;
  height: 1.6vw;
  transform: rotate(45deg);
  cursor: pointer;
  outline: none;
  z-index: 2;
}
@media (max-width: 768px) {
  body #app > .framework section[data-title="Contact Us"] section.form .close {
    display: none;
  }
}
body #app > .framework section[data-title="Contact Us"] section.form .close span {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 85%;
  height: 2px;
  background: white;
  transform: translate(-50%, -50%);
}
body #app > .framework section[data-title="Contact Us"] section.form .close span:last-child {
  transform: translate(-50%, -50%) rotate(90deg);
}
body #app > .framework section[data-title="Contact Us"] section.form h6 {
  font-size: 1.18055556vw;
  margin: 0 0 0.5em;
  padding-top: 1.6vw;
  line-height: 1.3em;
}
@media (max-width: 768px) {
  body #app > .framework section[data-title="Contact Us"] section.form h6 {
    font-size: 12.75px;
  }
}
@media (max-width: 768px) and (min-height: 900px) {
  body #app > .framework section[data-title="Contact Us"] section.form h6 {
    font-size: 20.4px;
  }
}
@media (max-width: 768px) {
  body #app > .framework section[data-title="Contact Us"] section.form h6 {
    margin-top: 1em;
  }
}
@media (max-width: 768px) {
  body #app > .framework section[data-title="Contact Us"] section.form form {
    margin-top: 4vw;
    height: calc(var(--innerHeight, 100vh) - 28vh);
    width: 100%;
    overflow: scroll;
  }
}
body #app > .framework section[data-title="Contact Us"] section.form form nf-field {
  vertical-align: middle;
  display: inline-block;
  box-sizing: border-box;
}
@media (max-width: 768px) {
  body #app > .framework section[data-title="Contact Us"] section.form form nf-field {
    display: block;
    width: 100%;
  }
}
body #app > .framework section[data-title="Contact Us"] section.form form nf-field .nf-field-container {
  margin-bottom: 0;
}
@media (max-width: 768px) {
  body #app > .framework section[data-title="Contact Us"] section.form form nf-field .nf-field-container {
    width: 100%;
    display: block;
  }
}
body #app > .framework section[data-title="Contact Us"] section.form form nf-field .nf-field-label {
  display: none;
}
body #app > .framework section[data-title="Contact Us"] section.form form nf-field .nf-before-field {
  display: none;
}
body #app > .framework section[data-title="Contact Us"] section.form form nf-field .nf-after-field {
  display: none;
}
body #app > .framework section[data-title="Contact Us"] section.form form nf-field * {
  display: inline-block;
  width: auto;
}
@media (max-width: 768px) {
  body #app > .framework section[data-title="Contact Us"] section.form form nf-field * {
    display: block;
    width: 100%;
  }
}
body #app > .framework section[data-title="Contact Us"] section.form form nf-field textarea {
  width: 60vw;
  background: transparent;
  border: none;
  border-radius: 0;
  padding: 0;
  font-size: 1.52777778vw;
  line-height: 1.3em;
  color: white;
  min-height: 128px;
  height: auto;
  outline: none;
  margin-bottom: 1.3em;
  border-bottom: 1px solid white;
}
@media (max-width: 768px) {
  body #app > .framework section[data-title="Contact Us"] section.form form nf-field textarea {
    font-size: 16.5px;
  }
}
@media (max-width: 768px) and (min-height: 900px) {
  body #app > .framework section[data-title="Contact Us"] section.form form nf-field textarea {
    font-size: 26.4px;
  }
}
body #app > .framework section[data-title="Contact Us"] section.form form nf-field textarea,
body #app > .framework section[data-title="Contact Us"] section.form form nf-field textarea::-webkit-input-placeholder {
  transition: color 0.3s ease-in-out, border-color 0.3s ease-in-out;
  color: white;
  font-family: "TKType", "TKIconFont", sans-serif;
}
body #app > .framework section[data-title="Contact Us"] section.form form nf-field textarea,
body #app > .framework section[data-title="Contact Us"] section.form form nf-field textarea::-moz-placeholder {
  transition: color 0.3s ease-in-out, border-color 0.3s ease-in-out;
  color: white;
  font-family: "TKType", "TKIconFont", sans-serif;
}
body #app > .framework section[data-title="Contact Us"] section.form form nf-field textarea,
body #app > .framework section[data-title="Contact Us"] section.form form nf-field textarea:-ms-input-placeholder {
  transition: color 0.3s ease-in-out, border-color 0.3s ease-in-out;
  color: white;
  font-family: "TKType", "TKIconFont", sans-serif;
}
body #app > .framework section[data-title="Contact Us"] section.form form nf-field textarea,
body #app > .framework section[data-title="Contact Us"] section.form form nf-field textarea::-ms-input-placeholder {
  transition: color 0.3s ease-in-out, border-color 0.3s ease-in-out;
  color: white;
  font-family: "TKType", "TKIconFont", sans-serif;
}
body #app > .framework section[data-title="Contact Us"] section.form form nf-field textarea,
body #app > .framework section[data-title="Contact Us"] section.form form nf-field textarea::placeholder {
  transition: color 0.3s ease-in-out, border-color 0.3s ease-in-out;
  color: white;
  font-family: "TKType", "TKIconFont", sans-serif;
}
@media (max-width: 768px) {
  body #app > .framework section[data-title="Contact Us"] section.form form nf-field textarea {
    width: 100%;
  }
}
body #app > .framework section[data-title="Contact Us"] section.form form nf-field input,
body #app > .framework section[data-title="Contact Us"] section.form form nf-field select {
  outline: none;
  background: transparent;
  border: none;
  border-radius: 0;
  padding: 0;
  font-size: 1.52777778vw;
  line-height: 1.3em;
  height: 2.7em;
  border-bottom: 1px solid white;
  margin-bottom: 1.7em;
  display: inline-block;
  width: 28vw;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
}
@media (max-width: 768px) {
  body #app > .framework section[data-title="Contact Us"] section.form form nf-field input,
  body #app > .framework section[data-title="Contact Us"] section.form form nf-field select {
    font-size: 16.5px;
  }
}
@media (max-width: 768px) and (min-height: 900px) {
  body #app > .framework section[data-title="Contact Us"] section.form form nf-field input,
  body #app > .framework section[data-title="Contact Us"] section.form form nf-field select {
    font-size: 26.4px;
  }
}
body #app > .framework section[data-title="Contact Us"] section.form form nf-field input,
body #app > .framework section[data-title="Contact Us"] section.form form nf-field select,
body #app > .framework section[data-title="Contact Us"] section.form form nf-field input::-webkit-input-placeholder,
body #app > .framework section[data-title="Contact Us"] section.form form nf-field select::-webkit-input-placeholder {
  transition: color 0.3s ease-in-out, border-color 0.3s ease-in-out;
  color: white;
  font-family: "TKType", "TKIconFont", sans-serif;
}
body #app > .framework section[data-title="Contact Us"] section.form form nf-field input,
body #app > .framework section[data-title="Contact Us"] section.form form nf-field select,
body #app > .framework section[data-title="Contact Us"] section.form form nf-field input::-moz-placeholder,
body #app > .framework section[data-title="Contact Us"] section.form form nf-field select::-moz-placeholder {
  transition: color 0.3s ease-in-out, border-color 0.3s ease-in-out;
  color: white;
  font-family: "TKType", "TKIconFont", sans-serif;
}
body #app > .framework section[data-title="Contact Us"] section.form form nf-field input,
body #app > .framework section[data-title="Contact Us"] section.form form nf-field select,
body #app > .framework section[data-title="Contact Us"] section.form form nf-field input:-ms-input-placeholder,
body #app > .framework section[data-title="Contact Us"] section.form form nf-field select:-ms-input-placeholder {
  transition: color 0.3s ease-in-out, border-color 0.3s ease-in-out;
  color: white;
  font-family: "TKType", "TKIconFont", sans-serif;
}
body #app > .framework section[data-title="Contact Us"] section.form form nf-field input,
body #app > .framework section[data-title="Contact Us"] section.form form nf-field select,
body #app > .framework section[data-title="Contact Us"] section.form form nf-field input::-ms-input-placeholder,
body #app > .framework section[data-title="Contact Us"] section.form form nf-field select::-ms-input-placeholder {
  transition: color 0.3s ease-in-out, border-color 0.3s ease-in-out;
  color: white;
  font-family: "TKType", "TKIconFont", sans-serif;
}
body #app > .framework section[data-title="Contact Us"] section.form form nf-field input,
body #app > .framework section[data-title="Contact Us"] section.form form nf-field select,
body #app > .framework section[data-title="Contact Us"] section.form form nf-field input::placeholder,
body #app > .framework section[data-title="Contact Us"] section.form form nf-field select::placeholder {
  transition: color 0.3s ease-in-out, border-color 0.3s ease-in-out;
  color: white;
  font-family: "TKType", "TKIconFont", sans-serif;
}
body #app > .framework section[data-title="Contact Us"] section.form form nf-field input option,
body #app > .framework section[data-title="Contact Us"] section.form form nf-field select option {
  color: #5f6369;
}
body #app > .framework section[data-title="Contact Us"] section.form form nf-field input[type="button"][value="Send"],
body #app > .framework section[data-title="Contact Us"] section.form form nf-field select[type="button"][value="Send"],
body #app > .framework section[data-title="Contact Us"] section.form form nf-field input[type="button"][value="Processing"],
body #app > .framework section[data-title="Contact Us"] section.form form nf-field select[type="button"][value="Processing"],
body #app > .framework section[data-title="Contact Us"] section.form form nf-field input.tkf-send-button,
body #app > .framework section[data-title="Contact Us"] section.form form nf-field select.tkf-send-button {
  font-size: 1.18055556vw;
  line-height: 2.76em;
  width: 12vw;
  border: 1px solid white;
  margin-bottom: 0;
  margin-right: 0;
  cursor: pointer;
  transition: background-color 0.3s ease-in-out, color 0.3s ease-in-out;
}
@media (max-width: 768px) {
  body #app > .framework section[data-title="Contact Us"] section.form form nf-field input[type="button"][value="Send"],
  body #app > .framework section[data-title="Contact Us"] section.form form nf-field select[type="button"][value="Send"],
  body #app > .framework section[data-title="Contact Us"] section.form form nf-field input[type="button"][value="Processing"],
  body #app > .framework section[data-title="Contact Us"] section.form form nf-field select[type="button"][value="Processing"],
  body #app > .framework section[data-title="Contact Us"] section.form form nf-field input.tkf-send-button,
  body #app > .framework section[data-title="Contact Us"] section.form form nf-field select.tkf-send-button {
    font-size: 12.75px;
  }
}
@media (max-width: 768px) and (min-height: 900px) {
  body #app > .framework section[data-title="Contact Us"] section.form form nf-field input[type="button"][value="Send"],
  body #app > .framework section[data-title="Contact Us"] section.form form nf-field select[type="button"][value="Send"],
  body #app > .framework section[data-title="Contact Us"] section.form form nf-field input[type="button"][value="Processing"],
  body #app > .framework section[data-title="Contact Us"] section.form form nf-field select[type="button"][value="Processing"],
  body #app > .framework section[data-title="Contact Us"] section.form form nf-field input.tkf-send-button,
  body #app > .framework section[data-title="Contact Us"] section.form form nf-field select.tkf-send-button {
    font-size: 20.4px;
  }
}
@media (max-width: 768px) {
  body #app > .framework section[data-title="Contact Us"] section.form form nf-field input[type="button"][value="Send"],
  body #app > .framework section[data-title="Contact Us"] section.form form nf-field select[type="button"][value="Send"],
  body #app > .framework section[data-title="Contact Us"] section.form form nf-field input[type="button"][value="Processing"],
  body #app > .framework section[data-title="Contact Us"] section.form form nf-field select[type="button"][value="Processing"],
  body #app > .framework section[data-title="Contact Us"] section.form form nf-field input.tkf-send-button,
  body #app > .framework section[data-title="Contact Us"] section.form form nf-field select.tkf-send-button {
    display: block;
    width: 44vw;
    margin: 16vw auto 0;
  }
}
body #app > .framework section[data-title="Contact Us"] section.form form nf-field input[type="button"][value="Send"]:hover,
body #app > .framework section[data-title="Contact Us"] section.form form nf-field select[type="button"][value="Send"]:hover,
body #app > .framework section[data-title="Contact Us"] section.form form nf-field input[type="button"][value="Processing"]:hover,
body #app > .framework section[data-title="Contact Us"] section.form form nf-field select[type="button"][value="Processing"]:hover,
body #app > .framework section[data-title="Contact Us"] section.form form nf-field input.tkf-send-button:hover,
body #app > .framework section[data-title="Contact Us"] section.form form nf-field select.tkf-send-button:hover {
  background-color: white;
  color: #5f6369;
}
@media (max-width: 768px) {
  body #app > .framework section[data-title="Contact Us"] section.form form nf-field input[type="button"][value="Send"]:hover,
  body #app > .framework section[data-title="Contact Us"] section.form form nf-field select[type="button"][value="Send"]:hover,
  body #app > .framework section[data-title="Contact Us"] section.form form nf-field input[type="button"][value="Processing"]:hover,
  body #app > .framework section[data-title="Contact Us"] section.form form nf-field select[type="button"][value="Processing"]:hover,
  body #app > .framework section[data-title="Contact Us"] section.form form nf-field input.tkf-send-button:hover,
  body #app > .framework section[data-title="Contact Us"] section.form form nf-field select.tkf-send-button:hover {
    background-color: transparent;
    color: white;
  }
}
@media (max-width: 768px) {
  body #app > .framework section[data-title="Contact Us"] section.form form nf-field input,
  body #app > .framework section[data-title="Contact Us"] section.form form nf-field select {
    width: 100%;
    display: block;
  }
}
body #app > .framework section[data-title="Contact Us"] section.form form nf-field:nth-child(odd) {
  margin-right: 4vw;
}
@media (max-width: 768px) {
  body #app > .framework section[data-title="Contact Us"] section.form form nf-field:nth-child(odd) {
    margin-right: 0;
  }
}
body #app > .framework section[data-title="Contact Us"] section.form form nf-field:last-child {
  margin-right: 0;
}
body #app > .framework section[data-title="Contact Us"] section.form form nf-field .nf-error input,
body #app > .framework section[data-title="Contact Us"] section.form form nf-field .nf-error select,
body #app > .framework section[data-title="Contact Us"] section.form form nf-field .nf-error textarea,
body #app > .framework section[data-title="Contact Us"] section.form form nf-field .nf-error input::-webkit-input-placeholder,
body #app > .framework section[data-title="Contact Us"] section.form form nf-field .nf-error select::-webkit-input-placeholder,
body #app > .framework section[data-title="Contact Us"] section.form form nf-field .nf-error textarea::-webkit-input-placeholder {
  border-color: #ff5757;
  color: #ff5757;
}
body #app > .framework section[data-title="Contact Us"] section.form form nf-field .nf-error input,
body #app > .framework section[data-title="Contact Us"] section.form form nf-field .nf-error select,
body #app > .framework section[data-title="Contact Us"] section.form form nf-field .nf-error textarea,
body #app > .framework section[data-title="Contact Us"] section.form form nf-field .nf-error input::-moz-placeholder,
body #app > .framework section[data-title="Contact Us"] section.form form nf-field .nf-error select::-moz-placeholder,
body #app > .framework section[data-title="Contact Us"] section.form form nf-field .nf-error textarea::-moz-placeholder {
  border-color: #ff5757;
  color: #ff5757;
}
body #app > .framework section[data-title="Contact Us"] section.form form nf-field .nf-error input,
body #app > .framework section[data-title="Contact Us"] section.form form nf-field .nf-error select,
body #app > .framework section[data-title="Contact Us"] section.form form nf-field .nf-error textarea,
body #app > .framework section[data-title="Contact Us"] section.form form nf-field .nf-error input:-ms-input-placeholder,
body #app > .framework section[data-title="Contact Us"] section.form form nf-field .nf-error select:-ms-input-placeholder,
body #app > .framework section[data-title="Contact Us"] section.form form nf-field .nf-error textarea:-ms-input-placeholder {
  border-color: #ff5757;
  color: #ff5757;
}
body #app > .framework section[data-title="Contact Us"] section.form form nf-field .nf-error input,
body #app > .framework section[data-title="Contact Us"] section.form form nf-field .nf-error select,
body #app > .framework section[data-title="Contact Us"] section.form form nf-field .nf-error textarea,
body #app > .framework section[data-title="Contact Us"] section.form form nf-field .nf-error input::-ms-input-placeholder,
body #app > .framework section[data-title="Contact Us"] section.form form nf-field .nf-error select::-ms-input-placeholder,
body #app > .framework section[data-title="Contact Us"] section.form form nf-field .nf-error textarea::-ms-input-placeholder {
  border-color: #ff5757;
  color: #ff5757;
}
body #app > .framework section[data-title="Contact Us"] section.form form nf-field .nf-error input,
body #app > .framework section[data-title="Contact Us"] section.form form nf-field .nf-error select,
body #app > .framework section[data-title="Contact Us"] section.form form nf-field .nf-error textarea,
body #app > .framework section[data-title="Contact Us"] section.form form nf-field .nf-error input::placeholder,
body #app > .framework section[data-title="Contact Us"] section.form form nf-field .nf-error select::placeholder,
body #app > .framework section[data-title="Contact Us"] section.form form nf-field .nf-error textarea::placeholder {
  border-color: #ff5757;
  color: #ff5757;
}
body #app > .framework section[data-title="Contact Us"] section.form form .checkbox-wrap {
  display: flex;
}
body #app > .framework section[data-title="Contact Us"] section.form form .checkbox-wrap .nf-field-label {
  font-size: 1.18055556vw;
  color: white;
  font-family: "TKType", "TKIconFont", sans-serif;
  line-height: 1.3em;
  display: inline-block;
  vertical-align: middle;
  width: 24vw;
  margin-right: 22vw;
  padding-left: 0;
  transition: color 0.3s ease-in-out;
}
@media (max-width: 768px) {
  body #app > .framework section[data-title="Contact Us"] section.form form .checkbox-wrap .nf-field-label {
    font-size: 12.75px;
  }
}
@media (max-width: 768px) and (min-height: 900px) {
  body #app > .framework section[data-title="Contact Us"] section.form form .checkbox-wrap .nf-field-label {
    font-size: 20.4px;
  }
}
@media (max-width: 768px) {
  body #app > .framework section[data-title="Contact Us"] section.form form .checkbox-wrap .nf-field-label {
    margin-right: 0;
    width: 100%;
  }
}
body #app > .framework section[data-title="Contact Us"] section.form form .checkbox-wrap .nf-field-label label {
  font-weight: normal;
}
body #app > .framework section[data-title="Contact Us"] section.form form .checkbox-wrap .nf-field-label a {
  text-decoration: underline !important;
  transition: color 0.3s ease-in-out;
}
@media (max-width: 768px) {
  body #app > .framework section[data-title="Contact Us"] section.form form .checkbox-wrap .nf-field-label a {
    display: inline;
  }
}
body #app > .framework section[data-title="Contact Us"] section.form form .checkbox-wrap .nf-field-label .ninja-forms-req-symbol {
  display: none;
}
body #app > .framework section[data-title="Contact Us"] section.form form .checkbox-wrap .nf-field-element {
  margin-top: 3px;
  vertical-align: middle;
}
@media (max-width: 768px) {
  body #app > .framework section[data-title="Contact Us"] section.form form .checkbox-wrap .nf-field-element {
    margin-top: 0;
    width: 10%;
  }
}
body #app > .framework section[data-title="Contact Us"] section.form form .checkbox-wrap input {
  display: inline-block;
  background: #2d2d2c;
  width: 1vw;
  height: 1vw;
  margin: 0;
  padding: 0;
  outline: none;
  border: none;
  border-radius: 0;
  color: white;
  -webkit-appearance: none;
  -moz-appearance: none;
       appearance: none;
  margin-right: 1vw;
  position: relative;
  cursor: pointer;
}
@media (max-width: 768px) {
  body #app > .framework section[data-title="Contact Us"] section.form form .checkbox-wrap input {
    width: 4vw;
    height: 4vw;
    margin-right: 4vw;
  }
}
body #app > .framework section[data-title="Contact Us"] section.form form .checkbox-wrap input:after {
  content: "\2714";
  display: none;
  position: absolute;
  font-size: 0.97222222vw;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  color: white;
  margin-top: 2px;
  font-family: "TKType", "TKIconFont", sans-serif;
}
@media (max-width: 768px) {
  body #app > .framework section[data-title="Contact Us"] section.form form .checkbox-wrap input:after {
    font-size: 10.5px;
  }
}
@media (max-width: 768px) and (min-height: 900px) {
  body #app > .framework section[data-title="Contact Us"] section.form form .checkbox-wrap input:after {
    font-size: 16.8px;
  }
}
body #app > .framework section[data-title="Contact Us"] section.form form .checkbox-wrap input:checked:after {
  display: block;
}
body #app > .framework section[data-title="Contact Us"] section.form form .checkbox-wrap.nf-error .nf-field-label {
  color: #ff5757;
}
body #app > .framework section[data-title="Contact Us"] section.form form .checkbox-wrap.nf-error .nf-field-label a {
  color: #ff5757;
}
body #app > .framework section[data-title="Contact Us"] section.form .nf-form-layout {
  opacity: 1;
  transition: opacity 0.3s ease-in-out;
}
body #app > .framework section[data-title="Contact Us"] section.form .nf-response-msg {
  opacity: 0;
  transition: opacity 0.3s ease-in-out 0.3s;
}
body #app > .framework section[data-title="Contact Us"] section.form .nf-response-msg[style*="display: block;"] {
  font-size: 1.45833333vw;
  line-height: 1.3em;
  color: white;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
  background-color: #5f6369;
  width: 100%;
  height: 100%;
  opacity: 1;
  z-index: 1;
}
@media (max-width: 768px) {
  body #app > .framework section[data-title="Contact Us"] section.form .nf-response-msg[style*="display: block;"] {
    font-size: 15.75px;
  }
}
@media (max-width: 768px) and (min-height: 900px) {
  body #app > .framework section[data-title="Contact Us"] section.form .nf-response-msg[style*="display: block;"] {
    font-size: 25.2px;
  }
}
@media (max-width: 768px) {
  body #app > .framework section[data-title="Contact Us"] section.form .nf-response-msg[style*="display: block;"] {
    transform: translate(-50%, 0%);
    top: 17vh;
    height: 50%;
  }
}
body #app > .framework section[data-title="Contact Us"] section.form .nf-response-msg[style*="display: block;"] .cover {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100%;
  transform: translate(-50%, -50%);
}
body #app > .framework section[data-title="Contact Us"] section.form .nf-response-msg[style*="display: block;"] .close-form {
  cursor: pointer;
  display: inline-block;
  width: 12vw;
  border: 1px solid white;
  margin: 0 auto;
  line-height: 2.76em;
  font-size: inherit;
  font-size: 1.18055556vw;
  transition: background-color 0.3s ease-in-out, color 0.3s ease-in-out;
}
@media (max-width: 768px) {
  body #app > .framework section[data-title="Contact Us"] section.form .nf-response-msg[style*="display: block;"] .close-form {
    font-size: 12.75px;
  }
}
@media (max-width: 768px) and (min-height: 900px) {
  body #app > .framework section[data-title="Contact Us"] section.form .nf-response-msg[style*="display: block;"] .close-form {
    font-size: 20.4px;
  }
}
body #app > .framework section[data-title="Contact Us"] section.form .nf-response-msg[style*="display: block;"] .close-form:hover {
  background-color: white;
  color: #5f6369;
}
@media (max-width: 768px) {
  body #app > .framework section[data-title="Contact Us"] section.form .nf-response-msg[style*="display: block;"] .close-form:hover {
    background-color: transparent;
    color: white;
  }
}
body #app > .framework section[data-title="Contact Us"] section.form .nf-response-msg[style*="display: block;"] ~ .nf-form-layout {
  opacity: 0;
}
body #app > .framework .language-picker {
  position: absolute;
  bottom: 1px;
  right: 14vw;
  z-index: 7;
}
body #app > .framework .language-picker .toggle {
  width: 8vw;
  background-color: rgba(95, 99, 105, 0.41);
  color: white;
  font-size: 1.18055556vw;
  text-align: center;
  line-height: 2.7em;
  cursor: pointer;
  opacity: 1;
  transition: opacity 0.3s ease-in-out;
  outline: 0;
  font-family: "TKType", "TKIconFont", sans-serif;
}
@media (max-width: 768px) {
  body #app > .framework .language-picker .toggle {
    font-size: 12.75px;
  }
}
@media (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .language-picker .toggle {
    font-size: 20.4px;
  }
}
@media (max-width: 768px) {
  body #app > .framework .language-picker .toggle {
    display: none;
  }
}
[data-page*="> Footer"] body #app > .framework .language-picker .toggle {
  opacity: 0;
  pointer-events: none;
}
body #app > .framework .language-picker .toggle:focus + .wrapper,
body #app > .framework .language-picker .wrapper:focus {
  opacity: 1;
  transform: translateY(0);
  transition: transform 0s linear 0s;
}
body #app > .framework .language-picker .wrapper {
  position: absolute;
  top: -2.7em;
  left: 0;
  width: 8vw;
  background-color: rgba(95, 99, 105, 0.41);
  color: white;
  font-size: 1.18055556vw;
  text-align: center;
  line-height: 2.7em;
  cursor: pointer;
  opacity: 0;
  transform: translateY(100px);
  transition: transform 0s linear 0.3s, opacity 0.3s ease-in-out 0s;
}
@media (max-width: 768px) {
  body #app > .framework .language-picker .wrapper {
    font-size: 12.75px;
  }
}
@media (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .language-picker .wrapper {
    font-size: 20.4px;
  }
}
body #app > .framework .mobile-landscape-warning {
  display: none;
  width: 100%;
  height: 100%;
  position: absolute;
  z-index: 10000;
  background-color: #5f6369;
}
body #app > .framework .mobile-landscape-warning > .wrapper {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
body #app > .framework .mobile-landscape-warning > .wrapper > h6 {
  color: white;
  font-size: 1.25vw;
  margin: 1em auto 0;
  font-family: "TKType", "TKIconFont", sans-serif;
  font-weight: normal;
  text-align: center;
}
@media (max-width: 768px) {
  body #app > .framework .mobile-landscape-warning > .wrapper > h6 {
    font-size: 13.5px;
  }
}
@media (max-width: 768px) and (min-height: 900px) {
  body #app > .framework .mobile-landscape-warning > .wrapper > h6 {
    font-size: 21.6px;
  }
}
body #app > .framework .mobile-landscape-warning > .wrapper > img {
  width: 24vw;
  display: block;
  margin: 0 auto;
}
@media (max-width: 768px) and (orientation: landscape) {
  body #app > .framework .mobile-landscape-warning {
    display: block;
  }
}
body #catapult-cookie-bar {
  text-align: center;
}
body #catapult-cookie-bar span,
body #catapult-cookie-bar #catapultCookie {
  font-family: "TKType", "TKIconFont", sans-serif;
  font-size: 12px;
  line-height: 1.3em;
  color: white !important;
}
::-webkit-scrollbar {
  display: none;
}
@media (min-width: 768px) and (max-width: 1024px) and (max-height: 768px) and (orientation: landscape) {
  html,
  body {
    position: fixed;
    width: 100%;
    height: 100vh;
    height: var(--innerHeight, 100vh);
    overflow: hidden;
  }
  html #app,
  body #app,
  html .framework,
  body .framework {
    overflow: hidden;
    height: 100%;
  }
}
@media (min-height: 768px) and (max-height: 1024px) and (max-width: 768px) and (orientation: portrait) {
  html,
  body {
    position: fixed;
    width: 100%;
    height: 100vh;
    height: var(--innerHeight, 100vh);
    overflow: hidden;
  }
  html #app,
  body #app,
  html .framework,
  body .framework {
    overflow: hidden;
    height: 100%;
  }
}
@media (max-width: 768px) {
  html,
  body {
    position: fixed;
    width: 100%;
    height: 100vh;
    height: var(--innerHeight, 100vh);
    overflow: hidden;
  }
  html #app,
  body #app,
  html .framework,
  body .framework {
    overflow: hidden;
    height: 100%;
  }
}