*,
*::after,
*::before {
  box-sizing: border-box;
}
html {
  scroll-behavior: initial;
}
body {
  overflow-x: hidden !important;
}
:root {
  font-size: 16px;
  --color-text: #fff;
  --color-bg: #002147;
  --color-link: #fff;
  --color-link-hover: #fff;
  --page-padding: 0;
  /*--page-padding: 1.5rem 2rem;*/
}
@font-face {
  font-family: "United";
  src: url(fonts/UnitedSansSemiCond-Heavy_UppercaseOnly.otf);
  font-display: swap;
}
@font-face {
  font-family: "UnitedItalic";
  src: url(fonts/UnitedItalicCondBlack.otf);
  font-display: swap;
}
@font-face {
  font-family: "National";
  src: url(fonts/National-Book.otf);
  font-display: swap;
  font-weight: 400;
}
@font-face {
  font-family: "National";
  src: url(fonts/National-Semibold.otf);
  font-display: swap;
  font-weight: 600;
}
.animations-container {
  background-color: #00305b;
}
.top-page-header {
  position: fixed;
  z-index: 9999;
  width: 100%;
}
.top-page-header img.logo {
  width: 50px;
  padding: 10px;
}
.top-page-header a {
  position: absolute;
  right: 10px;
  top: 10px;
}
.top-page-header a img {
  width: 33px;
  padding: 5px;
}
.font-united {
  font-family: "United", sans-serif;
}
.animated {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}
@-webkit-keyframes fadeInUp {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 20%, 0);
    transform: translate3d(0, 20%, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}
@keyframes fadeInUp {
  from {
    opacity: 0;
    -webkit-transform: translate3d(0, 20%, 0);
    transform: translate3d(0, 20%, 0);
  }
  to {
    opacity: 1;
    -webkit-transform: none;
    transform: none;
  }
}
.fadeInUp {
  -webkit-animation-name: fadeInUp;
  animation-name: fadeInUp;
}
@-webkit-keyframes slideUp {
  from {
    -webkit-transform: translate3d(0, 20%, 0);
    transform: translate3d(0, 20%, 0);
  }
  to {
    -webkit-transform: none;
    transform: none;
  }
}
@keyframes slideUp {
  from {
    -webkit-transform: translate3d(0, 20%, 0);
    transform: translate3d(0, 20%, 0);
  }
  to {
    -webkit-transform: none;
    transform: none;
  }
}
.slideUp {
  -webkit-animation-name: fadeInUp;
  animation-name: fadeInUp;
}
body {
  margin: 0;
  color: var(--color-text);
  background-color: var(--color-bg);
  font-family: "National", sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  overflow-x: hidden;
}
.text-fade-in {
  background-size: cover;
  background-position: center;
  background-attachment: fixed;
  background-color: #00305b;
}
@media (max-width: 991px) {
  .text-fade-in {
    background-attachment: initial;
  }
}
.text-fade-in img {
  width: 100%;
  max-width: 1200px;
  padding: 0 30px;
}
.text-fade-in .grid-item {
  display: grid;
  align-items: center;
  justify-items: center;
  min-height: 100vh;
  width: 100%;
}
.text-fade-in .pusher {
  padding-bottom: 50vh;
}
/*Buildup Effect*/
.buildup-effect h2 {
  font-size: 6vw;
  text-align: center;
}
@media (max-width: 480px) {
  .buildup-effect h2 {
    font-size: 10vw;
    line-height: 10vw;
  }
}
.effect-reveal-wrapper .content {
  padding: 35vh 0 35vh;
}
.effect-reveal {
  font-size: 10vw;
  line-height: 10vw;
  text-align: center;
}
.text-reveal-with-bg {
  max-width: 100vw;
}
.text-reveal-with-bg .content-section {
  --scroll-length: 4.5;
  height: calc(var(--scroll-length) * 75vh);
  background: #002147;
  width: 100%;
  overflow-x: clip;
  /* ---------------------------------- */
}
.text-reveal-with-bg .content-section .char {
  display: inline-block;
}
.text-reveal-with-bg .content-section .main-content .subheading,
.text-reveal-with-bg .content-section .main-content .paragraph {
  opacity: 1;
}
.text-reveal-with-bg .figure {
  --scale: calc(0.85 + (0.2 * var(--scroll-length) * var(--visible-y)));
  width: 100%;
  min-height: 100vh;
  height: 100vh;
  position: absolute;
  position: sticky;
  top: 0;
  left: 0;
  margin: 0;
  display: block;
  overflow: hidden;
  will-change: transform;
  transform: scale(var(--scale));
  transform-origin: center;
}
@media (max-width: 1199px) {
  .text-reveal-with-bg .figure.resp-65 img {
    object-position: 65% center;
  }
}
@media (max-width: 1199px) {
  .text-reveal-with-bg .figure.resp-60 img {
    object-position: 60% center;
  }
}
@media (max-width: 1199px) {
  .text-reveal-with-bg .figure.resp-75 img {
    object-position: 75% center;
  }
}
.text-reveal-with-bg .figure > img {
  will-change: transform;
  transform: scale(calc(1 / var(--scale)));
  display: block;
  width: 100%;
  height: 100%;
  max-width: 100%;
  -o-object-fit: cover;
  object-fit: cover;
  -o-object-position: center center;
  object-position: center center;
}
.text-reveal-with-bg .main-content {
  position: absolute;
  top: 0;
  width: 100%;
  height: 100%;
  max-width: 40vw;
  display: grid;
  grid-template-rows: 1fr 1fr;
  color: white;
  padding: 2em;
}
.text-reveal-with-bg .main-content.pos-left {
  left: 10vw;
}
@media (max-width: 768px) {
  .text-reveal-with-bg .main-content.pos-left {
    max-width: 100%;
    left: 1vw;
  }
}
.text-reveal-with-bg .main-content.pos-right {
  right: 10vw;
  max-width: 40vw;
}
@media (max-width: 768px) {
  .text-reveal-with-bg .main-content.pos-right {
    max-width: 100%;
    right: 1vw;
  }
}
.text-reveal-with-bg .main-content > .header {
  grid-row: 1/2;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  margin-bottom: 45px;
}
.text-reveal-with-bg .main-content > .paragraph {
  grid-row: 2/3;
  line-height: 1.5;
}
.text-reveal-with-bg .main-content > .paragraph p {
  color: #fff;
  font-weight: 600;
  font-size: 21px;
  line-height: 30px;
  margin-bottom: 30px;
}
@media (max-width: 768px) {
  .text-reveal-with-bg .main-content > .paragraph p {
    font-size: 18px;
  }
}
.text-reveal-with-bg .main-content > .paragraph p .blue {
  color: #3cb6ff;
  font-weight: 600;
}
.text-reveal-with-bg h2.split-heading {
  font-size: 120px;
  line-height: 120px;
}
@media (max-width: 991px) {
  .text-reveal-with-bg h2.split-heading {
    font-size: 45px;
    line-height: 45px;
  }
}
.text-reveal-with-bg h3.split-heading {
  font-size: 66px;
  line-height: 66px;
}
@media (max-width: 991px) {
  .text-reveal-with-bg h3.split-heading {
    font-size: 45px;
    line-height: 45px;
  }
}
.text-reveal-with-bg .split-heading {
  margin: 0;
}
@media (max-width: 768px) {
}
@media (max-width: 480px) {
}
.text-reveal-with-bg .split-heading .grad {
  color: #00b8b4;
  background-image: -webkit-linear-gradient(45deg, #1f5da6, #00b8b4);
  background-clip: text;
  -webkit-background-clip: text;
  text-fill-color: transparent;
  -webkit-text-fill-color: transparent;
}
.text-reveal-with-bg .split-heading .grad * {
  background-image: inherit !important;
  background-clip: inherit !important;
  -webkit-background-clip: inherit !important;
  text-fill-color: inherit !important;
  -webkit-text-fill-color: inherit !important;
}
.text-reveal-with-bg .subheading {
  font-size: 1.25em;
  font-weight: 600;
  margin-bottom: 0.5em;
}
.text-reveal-with-bg .subheading .quotes {
  font-size: 150px;
  height: 120px;
}
.text-reveal-with-bg *,
.text-reveal-with-bg *:before,
.text-reveal-with-bg *:after {
  position: relative;
  box-sizing: border-box;
}
/*Img with content*/
.buildup-effect.with-image {
  /*min-height: 100vh;*/
  /*background-size: cover;*/
  /*background-position: center;*/
  /*Doesnt work, eh*/
  /*top: 0 !important;*/
}
.content-buildup-wrapper {
  background-image: url(../images/backgrounds/bg.jpg);
  background-position: center;
  background-size: 100%;
  background-position: top;
  background-repeat: no-repeat;
  background-attachment: fixed;
  padding: 10vh 0;
}
@media (max-width: 600px) {
  .content-buildup-wrapper {
    background-image: url(../images/backgrounds/bg-mobile.jpg);
  }
}
.content-buildup-wrapper .content {
  padding-bottom: 40vh;
}
.content-buildup-wrapper .content__title {
  font-size: 4vw;
}
@media (max-width: 480px) {
  .content-buildup-wrapper .content__title {
    font-size: 6vw;
  }
}
.content-buildup-wrapper .content__title .big.with-img img {
  display: inline;
  width: 5vw;
  margin-bottom: 1.5vw;
}
.content-buildup-wrapper .content__title .big.with-img img[data-scroll] {
  transition: all 0.1s;
}
.content-buildup-wrapper .content__title .big.with-img img[data-scroll="in"] {
  -webkit-transition: all 0.1s;
  -moz-transition: all 0.1s;
  -ms-transition: all 0.1s;
  -o-transition: all 0.1s;
  transition: all 0.1s;
  opacity: 0;
}
.content-buildup-wrapper .content__title .big.with-img img[data-scroll="out"] {
  -webkit-transition: all 0.1s;
  -moz-transition: all 0.1s;
  -ms-transition: all 0.1s;
  -o-transition: all 0.1s;
  transition: all 0.1s;
  opacity: 1;
}
.content-buildup-wrapper .content__title .big {
  font-size: 7vw;
}
@media (max-width: 480px) {
  .content-buildup-wrapper .content__title .big {
    font-size: 10vw;
  }
}
.text-content {
  padding: 15px;
}
.text-content .content {
  width: 100%;
}
.anim-circles {
  position: relative;
  z-index: 10;
}
@media (max-width: 991px) {
  .anim-circles {
    display: none;
  }
}
.anim-circles .scrollmagic-pin-spacer {
  margin-bottom: 0 !important;
}
.anim-circles .bg {
  position: absolute;
  width: 100%;
  height: 100%;
  display: block;
  background-size: cover;
  background-attachment: fixed;
}
@media (max-width: 1199px) {
  .anim-circles .bg {
    display: none;
  }
}
.anim-circles .anim-container {
  width: 660px;
  display: block;
  margin: 0 auto;
}
.anim-circles .anim-wrapper {
  position: relative;
  margin-bottom: 300px;
  padding-bottom: 50vh;
}
@media (max-width: 1099px) {
  .anim-circles .anim-wrapper {
    transform: scale(0.75) translate3d(0, -6vh, 0);
  }
}
@media (max-width: 800px) {
  .anim-circles .anim-wrapper {
    transform: scale(0.6) translate3d(0, -11vh, 0);
  }
}
.anim-circles .pos-left,
.anim-circles .pos-right,
.anim-circles .pos-top {
  border-radius: 100%;
}
.anim-circles .pos-left {
  position: absolute;
  width: 420px;
  height: 420px;
  top: -100px;
}
.anim-circles .pos-left .circle-color {
  opacity: 0.75;
  background-color: #00B9B4;
  mix-blend-mode: screen;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: 100%;
}
.anim-circles .pos-left p.inside {
  font-size: 45px;
  text-align: center;
  line-height: 30px;
  bottom: 120px;
  position: absolute;
  left: -85px;
}
.anim-circles .pos-right {
  position: absolute;
  width: 420px;
  height: 420px;
  top: -100px;
}
.anim-circles .pos-right .circle-color {
  opacity: 0.75;
  background-color: #1F5DA6;
  mix-blend-mode: screen;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: 100%;
}
.anim-circles .pos-right p.inside {
  font-size: 45px;
  text-align: center;
  line-height: 30px;
  bottom: 120px;
  position: absolute;
  right: -145px;
}
.anim-circles .pos-top {
  position: absolute;
  width: 420px;
  height: 420px;
  left: 0;
  right: 0;
  margin: 0 auto;
}
.anim-circles .pos-top .circle-color {
  opacity: 0.75;
  background-color: #009EC3;
  mix-blend-mode: screen;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: 100%;
}
.anim-circles .pos-top p.inside {
  font-size: 45px;
  text-align: center;
  line-height: 30px;
  top: 110px;
  position: absolute;
  left: 0;
  right: 0;
}
.anim-circles .central-anim-logo {
  width: 75px;
  height: 75px;
  margin: 0 auto;
  display: block;
  z-index: 555;
  position: relative;
}
.anim-circles-mobile {
  display: none;
  position: relative;
  z-index: 10;
  padding-top: 33vh;
  padding-bottom: 22vh;
}
@media (max-width: 991px) {
  .anim-circles-mobile {
    display: block;
  }
}
.anim-circles-mobile .bg {
  position: absolute;
  width: 100%;
  height: 100%;
  display: block;
  background-size: cover;
  background-attachment: fixed;
}
@media (max-width: 1199px) {
  .anim-circles-mobile .bg {
    display: none;
  }
}
.anim-circles-mobile img.main {
  display: block;
  margin: 0 auto;
  padding: 0 15px;
  width: 100%;
  max-width: 750px;
}
.buildup-effect.with-image .img {
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -ms-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s;
  max-width: 25vw;
  display: block;
  margin: 0 auto;
  position: relative;
}
.buildup-effect.with-image .img [data-scroll] {
  transition: all 0.2s;
}
.buildup-effect.with-image .img[data-scroll="in"] {
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -ms-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s;
  opacity: 0;
  bottom: 60px;
}
.buildup-effect.with-image .img[data-scroll="out"] {
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -ms-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s;
  opacity: 1;
  bottom: 0;
}
.demo-2 {
  --color-text: #ddc4a4;
  --color-bg: #0e0e0e;
  --color-link: #ede3e3;
  --color-link-hover: #d68521;
}
/* Page Loader */
.js .loading::before,
.js .loading::after {
  content: '';
  position: fixed;
  z-index: 1000;
}
.js .loading::before {
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: var(--color-bg);
}
.js .loading::after {
  top: 50%;
  left: 50%;
  width: 60px;
  height: 60px;
  margin: -30px 0 0 -30px;
  border-radius: 50%;
  opacity: 0.4;
  background: var(--color-link);
  animation: loaderAnim 0.7s linear infinite alternate forwards;
}
@keyframes loaderAnim {
  to {
    opacity: 1;
    transform: scale3d(0.5, 0.5, 1);
  }
}
a {
  text-decoration: none;
  color: var(--color-link);
  outline: none;
  cursor: pointer;
}
a:hover {
  color: var(--color-link-hover);
  outline: none;
}
/* Better focus styles from https://developer.mozilla.org/en-US/docs/Web/CSS/:focus-visible */
a:focus {
  /* Provide a fallback style for browsers
     that don't support :focus-visible */
  outline: none;
  background: lightgrey;
}
a:focus:not(:focus-visible) {
  /* Remove the focus indicator on mouse-focus for browsers
     that do support :focus-visible */
  background: transparent;
}
a:focus-visible {
  /* Draw a very noticeable focus style for
     keyboard-focus on browsers that do support
     :focus-visible */
  outline: 2px solid red;
  background: transparent;
}
.unbutton {
  background: none;
  border: 0;
  padding: 0;
  margin: 0;
  font: inherit;
  cursor: pointer;
}
.unbutton:focus {
  outline: none;
}
main {
  counter-reset: section;
}
.splitting .word {
  white-space: nowrap;
}
.frame {
  color: var(--color-title);
  padding: var(--page-padding);
  display: grid;
  grid-template-columns: 1fr;
  grid-template-rows: auto auto auto auto;
  grid-template-areas: 'title' 'prev' 'demos' 'sponsor';
  justify-content: start;
  justify-items: end;
  margin-bottom: 3rem;
  grid-gap: 0.5rem;
  align-items: start;
  font-weight: 600;
  font-size: 14px;
}
.frame a:not(.frame__title-back),
.line {
  white-space: nowrap;
  overflow: hidden;
  position: relative;
}
.frame a:not(.frame__title-back)::before,
.line::before {
  content: '';
  height: 1px;
  width: 100%;
  background: currentColor;
  position: absolute;
  top: 90%;
  transition: transform 0.3s;
  transform-origin: 0% 50%;
}
.frame a:not(.frame__title-back):hover::before,
.line:hover::before {
  transform: scaleX(0);
  transform-origin: 100% 50%;
}
.frame__title {
  grid-area: title;
  display: flex;
  align-items: center;
}
.frame__title-main {
  font-size: 1rem;
  margin: 0;
  font-weight: normal;
}
.frame__title-back {
  position: relative;
  display: flex;
  align-items: flex-end;
}
.frame__title-back svg {
  fill: currentColor;
}
.frame__prev {
  grid-area: prev;
  align-self: start;
}
.frame__demos {
  display: flex;
  gap: 1rem;
}
.frame__demos span {
  opacity: 0.7;
}
.intro {
  min-height: 100vh;
  display: grid;
  place-items: center;
  text-align: center;
}
.intro__title {
  display: grid;
  place-items: center;
  margin: 0;
  line-height: 0.9;
  font-weight: 300;
}
.intro__title-pre {
  font-family: norman-stencil, sans-serif;
  font-weight: 800;
  text-transform: uppercase;
  font-size: clamp(2rem, 10vw, 9rem);
}
.intro__title-sub {
  font-size: clamp(1rem, 6vw, 2.75rem);
}
.intro__info {
  position: relative;
  max-width: 20ch;
  opacity: 0.6;
  line-height: 1.2;
  margin-bottom: 4rem;
  padding-bottom: 1rem;
  font-weight: 600;
  font-size: 14px;
}
.intro__info::after {
  content: '';
  position: absolute;
  left: 50%;
  width: 1px;
  height: 2rem;
  background: #fff;
  top: 100%;
}
.content {
  display: flex;
  flex-direction: column;
  width: 100vw;
  position: relative;
  padding: var(--page-padding);
}
.content--full {
  padding: 0;
}
.content p {
  max-width: 660px;
  margin: 1.5rem auto;
  font-size: 1.25rem;
  line-height: 1.5;
  font-weight: 600;
}
.content--highlight p {
  font-size: clamp(1rem, 3vw, 2rem);
}
.content__title {
  counter-increment: section;
  display: grid;
}
.content__title--left {
  text-align: left;
}
.content__title--right {
  text-align: right;
}
.content__title::before {
  content: "";
  font-weight: 400;
  font-family: area-normal, sans-serif;
  display: block;
  font-size: 1rem;
  margin-bottom: 2vh;
  text-align: center;
}
.content__title--sides {
  display: grid;
  grid-template-rows: auto auto;
  grid-template-columns: 100%;
  text-align: left;
  gap: 2rem;
}
.content__title--sides span:last-child {
  justify-self: end;
}
.font-1 {
  font-weight: 100;
}
.font-2 {
  font-weight: 400;
}
.font-3 {
  font-weight: 600;
}
.font-4 {
  font-weight: 400;
  font-style: italic;
}
.font-5 {
  font-weight: 300;
  text-transform: uppercase;
}
.font-6 {
  font-weight: 400;
}
.font-7 {
  font-weight: 400;
}
.font-8 {
  font-weight: 400;
  text-transform: lowercase;
}
.font-9 {
  font-weight: 400;
}
.font-10 {
  font-weight: 800;
}
.font-11 {
  font-weight: 400;
}
.font-12 {
  font-weight: 700;
}
.font-13 {
  font-weight: initial;
  font-variation-settings: "wght" 400;
}
.font-14 {
  font-weight: initial;
  font-variation-settings: "STYL" 0;
}
.font-15 {
  font-weight: initial;
  font-variation-settings: 'STYL' 100;
}
.font-16 {
  font-weight: initial;
  font-variation-settings: "slnt" 0;
}
.font-17 {
  font-weight: initial;
  font-variation-settings: "wght" 450, "wdth" 80;
}
.font-18 {
  font-weight: initial;
  font-variation-settings: "slnt" 0, "wght" 100, "wdth" 100;
}
.font-19 {
  font-weight: initial;
  font-variation-settings: "slnt" 0, "wght" 610;
}
.font-20 {
  font-weight: initial;
  font-variation-settings: "wght" 400;
}
.font-21 {
  font-weight: 900;
  font-style: normal;
}
.font-22 {
  font-weight: 400;
  font-style: normal;
}
.font-23 {
  font-variation-settings: "opsz" 1000, "wght" 300;
}
.font-height {
  line-height: 1.4;
}
.font-height-medium {
  line-height: 0.9;
}
.font-medium {
  font-size: 6vw;
  margin-top: 3rem;
}
.font-larger {
  font-size: 27vw;
}
.font-upper {
  text-transform: uppercase;
}
.font-sub {
  font-size: 5vw;
  margin-top: 2rem;
  display: block;
}
.splitting .font-sub .word {
  display: grid;
  grid-auto-flow: column;
}
.char-wrap {
  display: inline-block;
  position: relative;
  overflow: hidden;
}
@media screen and (min-width: 53em) {
  .frame {
    justify-items: start;
    grid-gap: 2rem;
    grid-template-columns: auto auto 1fr auto;
    grid-template-rows: auto;
    grid-template-areas: 'title prev demos sponsor';
  }
  .frame__demos {
    justify-self: end;
  }
}
section.hor-scroll-section {
  background: #00305b;
  overflow: hidden;
}
section.hor-scroll-section .h-container {
  min-height: 100vh;
  display: flex;
  flex-direction: row;
}
section.hor-scroll-section .h-container.width-4 {
  --items-width: 4;
  width: calc(var(--items-width) * 40vw);
}
section.hor-scroll-section .h-container.width-5 {
  --items-width: 5;
  width: calc(var(--items-width) * 40vw);
}
section.hor-scroll-section .h-container.width-6 {
  --items-width: 6;
  width: calc(var(--items-width) * 40vw);
}
section.hor-scroll-section .h-container.width-7 {
  --items-width: 7;
  width: calc(var(--items-width) * 40vw);
}
@media (max-width: 700px) {
  section.hor-scroll-section .h-container {
    width: 300vw;
  }
}
@media (max-width: 480px) {
  section.hor-scroll-section .h-container {
    width: 400vw;
    height: 600px;
  }
}
@media (max-width: 400px) {
  section.hor-scroll-section .h-container {
    width: 500vw;
  }
}
section.hor-scroll-section .h-section {
  width: 100vw;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  position: relative;
}
@media (max-width: 480px) {
  section.hor-scroll-section .h-section {
    height: 600px;
  }
}
section.hor-scroll-section .h-section:first-of-type {
  margin-left: 150px;
}
section.hor-scroll-section .h-section:last-of-type {
  margin-right: 250px;
}
section.hor-scroll-section .h-section img.mid-logo {
  display: block;
  width: 115px;
  min-width: 115px;
  margin-bottom: 150px;
}
section.hor-scroll-section .h-section .main-container {
  position: relative;
  margin: 0 15px;
}
section.hor-scroll-section .h-section .main-container:hover .txt-wrapper {
  -webkit-transition: all 0.3s ease-in;
  -moz-transition: all 0.3s ease-in;
  transition: all 0.3s ease-in;
  overflow: hidden;
  height: auto;
  max-height: 500px;
  opacity: 1;
}
section.hor-scroll-section .h-section .txt-wrapper {
  -webkit-transition: all 0.3s ease-out;
  -moz-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out;
  max-height: 0;
  opacity: 0;
}
section.hor-scroll-section .h-section .txt-wrapper .gallery-link img {
  width: 36px;
  display: inline-block;
  min-width: auto;
  margin-bottom: 50px;
}
section.hor-scroll-section .h-section .txt-wrapper .gallery-link span {
  color: #009dc2;
  font-size: 18px;
  text-transform: uppercase;
  font-weight: 600;
  margin-left: 25px;
  line-height: 36px;
  margin-bottom: 50px;
  vertical-align: top;
}
section.hor-scroll-section .h-section img {
  width: 100%;
  min-width: 500px;
}
@media (max-width: 1920px) {
  section.hor-scroll-section .h-section img {
    min-width: 400px;
  }
}
@media (max-width: 1200px) {
  section.hor-scroll-section .h-section img {
    min-width: none;
  }
}
section.hor-scroll-section .h-section .corner {
  height: 0px;
  border-style: solid;
  border-width: 0 0 30px 30px;
  border-color: transparent transparent #00305B transparent;
  transform: rotate(0deg);
  position: absolute;
  bottom: 0;
  right: 0;
}
section.hor-scroll-section .h-section .text {
  padding: 15px;
  color: #fff;
  position: absolute;
  bottom: 0;
}
section.hor-scroll-section .h-section .text h5 {
  font-size: 3em;
}
@media (max-width: 700px) {
}
@media (max-width: 480px) {
  section.hor-scroll-section .h-section .text h5 {
    font-size: 35px;
  }
}
section.hor-scroll-section .h-section .text p {
  font-size: 18px;
  margin-bottom: 0;
  font-weight: 600;
  color: rgba(255, 255, 255, 0.5);
}
section.hor-scroll-section .h-section .text p span {
  color: #ffffff;
}
section.hor-scroll-section .h-section .gr {
  position: absolute;
  bottom: 0;
  height: 75%;
  width: 100%;
  right: 0;
  background: -moz-linear-gradient(top, rgba(255, 255, 255, 0) 0%, rgba(0, 19, 35, 0.85) 100%);
  background: -webkit-linear-gradient(top, rgba(255, 255, 255, 0) 0%, rgba(0, 19, 35, 0.85) 100%);
  background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, rgba(0, 19, 35, 0.85) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00ffffff', endColorstr='#d9001323', GradientType=0);
}
section.hor-scroll-section.mobile .h-container {
  display: block;
  width: auto;
  height: auto;
}
section.hor-scroll-section.mobile .h-section {
  display: block;
  margin-left: 0;
  min-height: auto;
  height: auto;
  margin-bottom: 15px;
}
section.hor-scroll-section.mobile .h-section img {
  min-width: 320px;
  max-width: 400px;
}
section.hor-scroll-section.mobile .h-section img.mid-logo {
  width: 115px !important;
  min-width: auto !important;
}
section.hor-scroll-section.mobile .img-wrapper {
  overflow: hidden;
}
section.hor-scroll-section.mobile .txt-wrapper {
  -webkit-transition: all 0.3s ease-in;
  -moz-transition: all 0.3s ease-in;
  transition: all 0.3s ease-in;
  overflow: hidden;
  height: auto;
  max-height: 500px;
  opacity: 1;
}
.full-w-big-type {
  background-size: cover;
  min-width: 100vw;
  min-height: 100vh;
}
.full-w-big-type h2 {
  font-size: 180px;
  text-align: center;
  line-height: 150px;
  color: #fff;
}
.full-w-big-type h2 span {
  color: #3CB6FF;
}
@media (max-width: 1200px) {
  .full-w-big-type h2 {
    font-size: 120px;
    line-height: 100px;
  }
}
@media (max-width: 768px) {
  .full-w-big-type h2 {
    font-size: 60px;
    line-height: 55px;
  }
}
.full-w-big-type .table {
  display: table;
  width: 100%;
  height: 100%;
  min-height: 100vh;
}
.full-w-big-type .table-cell {
  display: table-cell;
  width: 100%;
  height: 100%;
  vertical-align: middle;
  min-height: 100vh;
}
.full-w-big-type .btns {
  text-align: center;
  max-width: 900px;
  margin: 5vh auto 0;
}
.full-w-big-type .btn {
  display: inline-block;
  background: #3cb6ff;
  background: -moz-linear-gradient(left, #3cb6ff 0, #1f5da6 100%);
  background: -webkit-linear-gradient(left, #3cb6ff 0, #1f5da6 100%);
  background: linear-gradient(to right, #3cb6ff 0, #1f5da6 100%);
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#3cb6ff', endColorstr='#1f5da6', GradientType=1);
  font-size: 21px;
  width: auto;
  max-width: 290px;
  text-align: center;
  line-height: 40px;
  padding-top: 5px;
  padding: 5px 25px 0;
  margin: 15px 30px 0;
}
.full-w-big-type .btn:hover,
.full-w-big-type .btn:focus,
.full-w-big-type .btn:active {
  background: #3cb6ff !important;
}
section.overlapping-imgs {
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background-size: cover;
  background-position: center;
}
section.overlapping-imgs .bg-wrapper {
  display: block;
  width: 100%;
  height: 100vh;
  background-size: cover;
  background-position: center;
  position: absolute;
}
section.overlapping-imgs .bg-wrapper.blurry {
  opacity: 0;
}
section.overlapping-imgs .tween-panel {
  height: 100%;
  width: 100%;
}
section.overlapping-imgs .text-panel {
  max-width: 650px;
  margin-bottom: 300px;
}
@media (max-width: 480px) {
  section.overlapping-imgs .text-panel {
    max-width: 300px;
  }
}
section.overlapping-imgs h1 {
  font-family: "United";
  font-size: 60px;
  text-align: left;
  color: #fff;
}
section.overlapping-imgs p {
  font-size: 21px;
  color: #fff;
}
.section-wipes-wrapper {
  min-height: 100vh;
  width: 100%;
}
.section-wipes-wrapper .wipe-panel {
  min-height: 100vh;
  width: 100%;
  display: grid;
  grid-template-columns: 1fr 1fr;
}
.section-wipes-wrapper .wipe-content {
  display: grid;
  align-items: center;
  justify-items: center;
  width: 100vw;
}
.section-wipes-wrapper .wipe-content .font-united {
  font-size: 7vw;
}
.section-wipes-wrapper .el-1 .font-united {
  margin-top: -20vh;
}
.section-wipes-wrapper .el-3 .font-united {
  margin-top: 20vh;
}
.text-wipes .backgrounds-wrapper {
  background-size: cover;
  background-position: center;
}
.text-wipes .wipe-bg {
  -webkit-transition: all 0.5s;
  -moz-transition: all 0.5s;
  -ms-transition: all 0.5s;
  -o-transition: all 0.5s;
  transition: all 0.5s;
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  margin: 0 auto;
  left: 0;
  right: 0;
  background-size: cover;
  background-position: center;
  opacity: 0;
}
.text-wipes .wipe-bg.visible {
  -webkit-transition: all 0.5s;
  -moz-transition: all 0.5s;
  -ms-transition: all 0.5s;
  -o-transition: all 0.5s;
  transition: all 0.5s;
  opacity: 1;
}
.text-wipes #spacer {
  width: 100%;
  height: 100%;
}
.text-wipes #trigger2 {
  position: absolute;
  top: 50vh;
}
.text-wipes #trigger3 {
  position: absolute;
  top: 115vh;
}
.text-wipes #trigger4 {
  position: absolute;
  top: 170vh;
}
.text-wipes #sliderwrapper {
  position: relative;
  height: auto;
}
.text-wipes #slider {
  width: 100%;
  height: 100%;
  color: #ffffff;
}
.text-wipes .wipe-panel {
  height: 100vh;
  width: 100%;
  position: absolute;
  display: grid;
  grid-template-columns: 2fr 1fr;
}
.text-wipes .wipe-content {
  display: grid;
  align-items: center;
  justify-items: center;
  width: 100vw;
}
.text-wipes .wipe-content .font-united {
  -webkit-transition: all 0.5s;
  -moz-transition: all 0.5s;
  -ms-transition: all 0.5s;
  -o-transition: all 0.5s;
  transition: all 0.5s;
  position: relative;
  font-size: 90px;
  opacity: 0;
  bottom: -30px;
}
@media (max-width: 600px) {
  .text-wipes .wipe-content .font-united {
    font-size: 60px;
  }
}
@media (max-width: 480px) {
  .text-wipes .wipe-content .font-united {
    font-size: 45px;
  }
}
.text-wipes .active-panel .font-united {
  -webkit-transition: all 0.5s;
  -moz-transition: all 0.5s;
  -ms-transition: all 0.5s;
  -o-transition: all 0.5s;
  transition: all 0.5s;
  opacity: 1;
  bottom: 0;
}
.text-wipes .panel2 .font-united {
  margin-top: -160px;
}
@media (max-width: 600px) {
  .text-wipes .panel2 .font-united {
    margin-top: -100px;
  }
}
.text-wipes .panel4 .font-united {
  margin-top: 160px;
}
@media (max-width: 600px) {
  .text-wipes .panel4 .font-united {
    margin-top: 100px;
  }
}
.slide-wipes .backgrounds-wrapper {
  background-size: cover;
  background-position: center;
}
.slide-wipes .wipe-bg {
  -webkit-transition: all 0.5s;
  -moz-transition: all 0.5s;
  -ms-transition: all 0.5s;
  -o-transition: all 0.5s;
  transition: all 0.5s;
  display: block;
  width: 100%;
  height: 100%;
  position: absolute;
  margin: 0 auto;
  left: 0;
  right: 0;
  background-size: cover;
  background-position: center;
  opacity: 0;
}
.slide-wipes .wipe-bg.visible {
  -webkit-transition: all 0.5s;
  -moz-transition: all 0.5s;
  -ms-transition: all 0.5s;
  -o-transition: all 0.5s;
  transition: all 0.5s;
  opacity: 1;
}
.slide-wipes .spacer {
  width: 100%;
  height: 100%;
}
.slide-wipes .wipe-trigger2 {
  position: absolute;
  top: 100vh;
}
.slide-wipes .wipe-trigger3 {
  position: absolute;
  top: 300vh;
}
.slide-wipes .wipe-trigger4 {
  position: absolute;
  top: 500vh;
}
.slide-wipes .wipe-sliderwrapper {
  position: relative;
  height: auto;
}
.slide-wipes .wipe-slider {
  width: 100%;
  height: 100%;
  color: #ffffff;
}
.slide-wipes .wipe-panel {
  height: 100vh;
  width: 100%;
  position: absolute;
  display: grid;
  grid-template-columns: 1fr 1fr;
}
.slide-wipes .wipe-content {
  display: grid;
  align-items: center;
  justify-items: left;
  width: 100vw;
}
.slide-wipes .wipe-content .content-wrapper {
  max-width: 600px;
  margin-left: 15%;
}
.slide-wipes .wipe-content .content-wrapper p {
  font-size: 21px;
  font-weight: 600;
  margin-bottom: 10px;
}
.slide-wipes .wipe-content .content-wrapper p.blue {
  color: #3CB6FF;
}
.slide-wipes .wipe-content .content-wrapper {
  -webkit-transition: all 0.5s;
  -moz-transition: all 0.5s;
  -ms-transition: all 0.5s;
  -o-transition: all 0.5s;
  transition: all 0.5s;
  position: relative;
  font-size: 7vw;
  opacity: 0;
  bottom: -90px;
}
.slide-wipes .active-panel .content-wrapper {
  -webkit-transition: all 0.5s;
  -moz-transition: all 0.5s;
  -ms-transition: all 0.5s;
  -o-transition: all 0.5s;
  transition: all 0.5s;
  opacity: 1;
  bottom: 0;
}
.slide-wipes .wipe-panel2 .font-united {
  margin-top: -20vh;
}
.slide-wipes .wipe-panel4 .font-united {
  margin-top: 20vh;
}
section.overlap-img .panel {
  background: #ccc;
  height: 100vh;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 1;
}
.random-buildup-effect-wrapper {
  background: #1F5DA6;
  padding-bottom: 20vh;
  position: relative;
  max-width: 100vw;
  overflow: hidden;
}
.random-buildup-effect-wrapper .bg {
  position: absolute;
  width: 100%;
  height: 100%;
  display: block;
  background-size: cover;
  background-attachment: fixed;
}
@media (max-width: 1199px) {
  .random-buildup-effect-wrapper .bg {
    display: none;
  }
}
.random-buildup-effect-wrapper .content {
  width: 75vw;
  margin: 0 auto;
  display: block;
  padding: 0 30px;
  max-width: 90vw;
}
.random-buildup-effect-wrapper .content h2 {
  font-size: 3vw;
  text-align: center;
  margin-bottom: 10vh;
  margin-top: 0;
}
@media (max-width: 768px) {
  .random-buildup-effect-wrapper .content h2 {
    font-size: 7vw;
  }
}
@media (max-width: 480px) {
  .random-buildup-effect-wrapper .content {
    padding: 0 15px;
  }
}
.random-buildup-effect-wrapper .content .font-united .blue {
  color: #3CB6FF;
  display: inline;
}
.button {
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -ms-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s;
  display: block;
  width: 240px;
  height: 60px;
  border: 0;
  outline: 0;
  margin: 0;
  line-height: 64px;
  font-family: "United", sans-serif;
  text-transform: uppercase;
  font-size: 24px;
  color: #fff;
  text-align: center;
  padding: 0;
  text-shadow: none !important;
  text-decoration: none !important;
}
.button.gradient-blue-cyan {
  /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#1f5da6+0,00b8b4+100 */
  background: #1f5da6;
  /* Old browsers */
  background: -moz-linear-gradient(left, #1f5da6 0%, #00b8b4 100%);
  /* FF3.6-15 */
  background: -webkit-linear-gradient(left, #1f5da6 0%, #00b8b4 100%);
  /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to right, #1f5da6 0%, #00b8b4 100%);
  /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1f5da6', endColorstr='#00b8b4', GradientType=1);
  /* IE6-9 */
  color: #fff;
}
.button.gradient-blue-cyan:hover {
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  -ms-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s;
  /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#1f88a3+0,00b8b4+31,00b8b4+31 */
  background: #1f88a3;
  /* Old browsers */
  background: -moz-linear-gradient(left, #1f88a3 0%, #00b8b4 31%, #00b8b4 31%);
  /* FF3.6-15 */
  background: -webkit-linear-gradient(left, #1f88a3 0%, #00b8b4 31%, #00b8b4 31%);
  /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to right, #1f88a3 0%, #00b8b4 31%, #00b8b4 31%);
  /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1f88a3', endColorstr='#00b8b4', GradientType=1);
  /* IE6-9 */
  color: #fff;
}
.final-cta {
  background-size: cover;
  background-position: center;
}
.final-cta h2 {
  display: block;
  font-size: 90px;
  line-height: 90px;
  margin-bottom: 60px;
}
@media (max-width: 991px) {
  .final-cta h2 {
    font-size: 60px;
    line-height: 60px;
  }
}
.final-cta .container {
  min-height: 100vh;
  padding: 10vh 15px;
  display: block;
  width: 100%;
  max-width: 1000px;
  margin: 0 auto;
  text-align: center;
}
.final-cta .blue-label {
  /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#3cb6ff+0,1f5da6+100 */
  background: #3cb6ff;
  /* Old browsers */
  background: -moz-linear-gradient(left, #3cb6ff 0%, #1f5da6 100%);
  /* FF3.6-15 */
  background: -webkit-linear-gradient(left, #3cb6ff 0%, #1f5da6 100%);
  /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to right, #3cb6ff 0%, #1f5da6 100%);
  /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#3cb6ff', endColorstr='#1f5da6', GradientType=1);
  /* IE6-9 */
  font-size: 21px;
  font-weight: 600;
  display: inline-block;
  padding: 3px 15px;
}
.final-cta p {
  font-size: 30px;
  line-height: 35px;
}
.final-cta .mb-30 {
  margin-bottom: 30px;
}
.final-cta .mb-60 {
  margin-bottom: 60px;
}
.final-cta p a {
  color: #fff;
  display: block;
}
.final-cta p a:hover {
  color: #ff0;
}
.tsg-text-grad {
  color: #00b8b4;
  background-image: -webkit-linear-gradient(45deg, #1f5da6, #00b8b4);
  background-clip: text;
  -webkit-background-clip: text;
  text-fill-color: transparent;
  -webkit-text-fill-color: transparent;
}
.tsg-text-grad * {
  background-image: inherit !important;
  background-clip: inherit !important;
  -webkit-background-clip: inherit !important;
  text-fill-color: inherit !important;
  -webkit-text-fill-color: inherit !important;
}
/*# sourceMappingURL=animations-page-styles.css.map */