:root {
  --white: white;
  --black: black;
}

.w-layout-grid {
  grid-row-gap: 16px;
  grid-column-gap: 16px;
  grid-template-rows: auto auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  display: grid;
}

a {
  color: #333;
  text-decoration: underline;
}

.app {
  z-index: 2;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  display: flex;
  position: relative;
}

.grid {
  z-index: 3;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  margin-top: 0;
  display: flex;
  position: relative;
}

.grid.tablet {
  display: none;
}

.link {
  width: 13vw;
  cursor: pointer;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  margin: 2.5rem 23px;
  display: flex;
}

.h1 {
  color: #fff;
  text-align: center;
  letter-spacing: 0;
  text-transform: uppercase;
  margin-top: 0;
  margin-bottom: 0;
  padding-top: .9rem;
  font-family: Akkurat mono, sans-serif;
  font-size: 18px;
  font-weight: 400;
  line-height: 1.9rem;
  display: inline-block;
}

.text {
  color: rgba(255, 255, 255, .5);
  margin-top: .2rem;
  line-height: 1rem;
}

.body {
  height: 100%;
  min-height: 100vh;
  min-width: 100vw;
  color: #fff;
  letter-spacing: -.02em;
  text-transform: uppercase;
  background-color: #000;
  background-image: none;
  background-position: 0 0;
  justify-content: center;
  align-items: center;
  font-family: system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Noto Sans, Ubuntu, Cantarell, Helvetica Neue, Oxygen, Fira Sans, Droid Sans, sans-serif;
  font-size: .85rem;
  line-height: .85rem;
  display: block;
}

.nav-wrap {
  z-index: 99;
  width: 100vw;
  height: 80px;
  justify-content: center;
  align-items: center;
  display: flex;
  position: fixed;
  top: 0%;
  bottom: auto;
  left: 0%;
  right: 0%;
}

.nav-link {
  color: #fff;
  margin-left: 16px;
  margin-right: 16px;
  text-decoration: none;
  transition: all 70ms;
}

.nav-link:hover, .nav-link.w--current {
  text-decoration: underline;
}

.credit-wrap {
  z-index: 99;
  width: 25vw;
  height: auto;
  padding-bottom: 4vh;
  position: fixed;
  top: auto;
  bottom: 0%;
  left: 0%;
  right: auto;
}

.credit-wrap__row {
  width: 100%;
  height: auto;
  color: rgba(255, 255, 255, .5);
  flex-direction: column;
  align-items: flex-start;
  margin-bottom: 16px;
  padding-left: 4vw;
  display: flex;
}

.italic-text {
  font-size: .75rem;
  font-style: italic;
}

.text-link {
  color: #fff;
  text-align: left;
  margin-top: 4px;
  font-size: .75rem;
}

.logo {
  justify-content: center;
  display: none;
}

.image {
  width: 70%;
  max-width: 70%;
}

.logoimage {
  z-index: 999;
  width: 70%;
  max-width: 70%;
  min-width: 70%;
  position: relative;
}

.gradient-bg {
  z-index: -1;
  opacity: .5;
  filter: blur(200px);
  justify-content: center;
  align-items: center;
  position: absolute;
  top: 0%;
  bottom: 0%;
  left: 0%;
  right: 0%;
  overflow: hidden;
}

.bg-circle {
  width: 30vw;
  height: 30vw;
  background-color: #455268;
  border-radius: 100%;
  position: absolute;
  top: 0%;
  bottom: auto;
  left: 0%;
  right: auto;
}

.bg-circle._1 {
  width: 40vw;
  height: 40vw;
  opacity: 1;
  background-color: #7056f5;
  border-radius: 20%;
  margin-top: -16%;
  margin-left: -16%;
}

.bg-circle._2 {
  opacity: .5;
  background-color: #487698;
  border-radius: 40%;
  margin-top: -20%;
}

.bg-circle._3 {
  width: 40vw;
  height: 40vw;
  background-color: #e1e5ee;
  margin-top: -12%;
  margin-left: 52%;
}

.bg-circle._4 {
  width: 60vw;
  height: 60vw;
  background-color: #a7cf38;
  margin-top: -32%;
  margin-right: -10%;
  left: auto;
  right: 0;
}

.bg-circle._5 {
  margin-top: 24%;
  margin-right: -8%;
  bottom: 0%;
  left: auto;
  right: 0%;
}

.bg-circle._6 {
  width: 40vw;
  height: 40vw;
  background-color: red;
  margin-top: 35%;
  margin-bottom: -20%;
  margin-right: -16%;
  bottom: 0%;
  left: auto;
  right: 0%;
}

.flex-cap-2 {
  max-width: 80vw;
  margin-left: auto;
  margin-right: auto;
  display: flex;
}

.large-serif-2 {
  color: var(--white);
  text-transform: uppercase;
  font-size: 20rem;
  font-weight: 400;
  line-height: .8;
  display: block;
}

.large-serif-2.small {
  font-size: 9em;
  font-weight: 400;
}

.section {
  width: 100%;
  position: relative;
}

.section.bg-mid-gray {
  z-index: 99;
}

.sticky-wrapper {
  transform-origin: 0 0;
  position: -webkit-sticky;
  position: sticky;
  top: 0;
}

.detail-hero-grid {
  z-index: 12;
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  align-items: end;
  padding: 0 35px 20px;
  display: grid;
  position: relative;
}

.detail-text {
  color: #000;
  text-transform: uppercase;
  flex: 1;
  font-size: 22px;
  font-weight: 500;
}

.detail-text.small {
  color: var(--white);
  color: #fff;
  flex: 0 auto;
  font-size: 14px;
}

.main-grid {
  width: 100%;
  grid-column-gap: 24px;
  grid-row-gap: 24px;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
  align-items: start;
  padding-top: 5%;
  padding-left: 5%;
  padding-right: 5%;
  position: relative;
}

.main-grid.hero-area {
  padding-top: 200px;
  padding-bottom: 150px;
}

.main-grid.hero-area.full {
  min-height: 100vh;
  color: rgba(255, 255, 255, 0);
  align-items: start;
  justify-items: center;
  padding-top: 100px;
  padding-bottom: 0;
}

.center-wrapper {
  text-align: center;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  display: flex;
  position: relative;
}

.image-detail {
  height: 25px;
  filter: invert();
  transition: all .15s cubic-bezier(.215, .61, .355, 1);
}

.image-detail:hover {
  transform: scale(1.3);
}

.large-serif {
  color: var(--white);
  text-transform: uppercase;
  font-size: 20rem;
  font-weight: 400;
  line-height: .8;
}

.large-serif.small {
  font-size: 9em;
  font-weight: 400;
}

.flex-cap {
  z-index: 2;
  display: flex;
  position: relative;
}

.link-holder {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  grid-template-rows: auto auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  display: block;
}

.extra {
  z-index: 3;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  margin-top: 0;
  display: flex;
  position: relative;
}

.extraholder {
  grid-column-gap: 10px;
  grid-row-gap: 10px;
  align-items: center;
  display: flex;
}

.tween-block {
  align-items: center;
  font-size: 1rem;
  line-height: 1rem;
  text-decoration: none;
  display: flex;
}

.tween-block.facts {
  margin-bottom: 5px;
  padding-left: 10px;
  padding-right: 10px;
}

.letter-wrap {
  color: #fff;
  margin-top: 10px;
  font-family: Akkurat mono, sans-serif;
  font-size: 13px;
  font-weight: 400;
  line-height: 18px;
  text-decoration: none;
}

.letter-wrap.tween-block.first {
  padding-left: 5px;
}

.imagesx {
  z-index: 1;
  display: block;
  position: absolute;
  top: 0%;
  bottom: auto;
  left: 0%;
  right: auto;
}

.imagedx {
  z-index: 1;
  display: block;
  position: absolute;
  top: 0%;
  bottom: auto;
  left: auto;
  right: 0%;
}

.link-2 {
  color: #fffefe;
  font-family: Akkurat mono, sans-serif;
  font-size: 12px;
  text-decoration: none;
  transition: all .2s cubic-bezier(.215, .61, .355, 1);
}

.link-2:hover {
  transform: scale(1.2);
}

.letter-wrap-copy {
  color: #fff;
  margin-top: 10px;
  font-family: Arial, Helvetica Neue, Helvetica, sans-serif;
  font-size: 13px;
  font-weight: 400;
  line-height: 18px;
  text-decoration: none;
}

.image-5 {
  display: block;
}

.image-6 {
  display: none;
}

.heading {
  position: absolute;
}

@media screen and (max-width: 991px) {
  .app {
    width: 80vw;
    height: 100%;
    grid-column-gap: 16px;
    grid-row-gap: 16px;
    grid-template-rows: auto auto;
    grid-template-columns: 1fr 1fr;
    grid-auto-columns: 1fr;
    display: none;
    position: absolute;
    top: 0%;
    bottom: 0%;
    left: 0%;
    right: 0%;
  }

  .grid {
    width: 80vw;
    flex-direction: column;
  }

  .grid.tablet {
    grid-column-gap: 1px;
    grid-row-gap: 1px;
    grid-template-rows: auto auto;
    grid-template-columns: 1fr 1fr;
    grid-auto-columns: 1fr;
    margin-top: 20px;
    display: grid;
  }

  .link {
    width: 40vw;
  }

  .link.tablet {
    margin-top: 0;
    margin-bottom: 0;
  }

  .h1 {
    font-size: 2rem;
    line-height: 2rem;
  }

  .credit-wrap {
    width: 100vw;
    padding-bottom: 2vh;
  }

  .credit-wrap__row {
    justify-content: center;
    align-items: center;
    padding-left: 0;
  }

  .large-serif-2 {
    font-size: 200px;
  }

  .large-serif-2.small {
    font-size: 3em;
  }

  .detail-hero-grid {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
    grid-template-rows: auto;
    grid-template-columns: 1fr;
    grid-auto-columns: 1fr;
    padding-left: 0;
    padding-right: 0;
    display: grid;
  }

  .detail-text.small {
    align-self: center;
    margin-bottom: 5px;
    font-size: 13px;
  }

  .main-grid {
    grid-template-columns: 1fr 1fr;
  }

  .large-serif {
    font-size: 200px;
  }

  .large-serif.small {
    font-size: 3em;
  }

  .extra {
    width: 80vw;
    grid-column-gap: 7px;
    grid-row-gap: 7px;
    flex-direction: row;
  }

  .extraholder {
    grid-column-gap: 10px;
    grid-row-gap: 10px;
    grid-template-rows: auto;
    grid-template-columns: 1fr .5fr;
    grid-auto-columns: .9fr;
    display: grid;
  }

  .tween-block.facts {
    margin-bottom: 0;
    font-size: 10px;
    line-height: 10px;
  }

  .letter-wrap, .letter-wrap.tween-block.first {
    font-size: 10px;
  }

  .imagedx {
    justify-content: flex-end;
    display: flex;
  }

  .link-2 {
    letter-spacing: 0;
    font-size: 13px;
    line-height: 10px;
  }

  .letter-wrap-copy {
    font-size: 10px;
  }

  .image-2, .image-3 {
    max-width: 50%;
  }

  .responsiveimage {
    z-index: 0;
    width: 5vw;
    height: 5vw;
    filter: blur(40px);
    background-image: radial-gradient(circle, #4000ff, #179cf5 50%, #13e6aa);
    padding-bottom: 0;
    padding-right: 0;
    position: absolute;
  }

  .image-4 {
    max-width: 50%;
    filter: blur(70px) invert();
    border-radius: 200px;
  }

  .link-block, .linkblock {
    z-index: 1;
    position: relative;
  }
}

@media screen and (max-width: 767px) {
  .link {
    margin-top: 1.4rem;
    margin-bottom: 1.4rem;
  }

  .h1 {
    font-size: 1rem;
    line-height: 1rem;
  }

  .large-serif-2 {
    font-size: 80px;
  }

  .detail-text.small {
    margin-bottom: 5px;
  }

  .large-serif {
    font-size: 80px;
  }

  .extra {
    grid-column-gap: 2px;
    grid-row-gap: 2px;
    grid-template-rows: auto auto;
    grid-template-columns: 1fr 1fr;
    grid-auto-columns: 1fr;
    display: grid;
  }

  .tween-block {
    justify-content: center;
  }

  .tween-block.facts {
    display: none;
  }

  .link-2 {
    font-size: 12px;
  }

  .image-2, .image-3 {
    max-width: 40%;
  }
}

@media screen and (max-width: 479px) {
  .link {
    margin: 10vw 0;
  }

  .h1 {
    padding-top: 1vw;
    font-size: .8rem;
    line-height: .8rem;
  }

  .text {
    font-size: 2vw;
    line-height: 2vw;
  }

  .bg-circle._2 {
    background-color: #4353ff;
  }

  .bg-circle._3 {
    background-color: #3fa1f7;
  }

  .bg-circle._4 {
    background-color: #20c788;
  }

  .bg-circle._5 {
    background-color: #ffab9d;
  }

  .bg-circle._6 {
    background-color: #ff6382;
  }

  .flex-cap-2 {
    align-items: flex-start;
  }

  .large-serif-2.small {
    font-size: 2.2em;
    line-height: 100%;
  }

  .detail-hero-grid {
    grid-template-columns: .25fr;
    grid-auto-columns: .25fr;
    grid-auto-flow: row;
  }

  .detail-text {
    font-size: 14px;
  }

  .detail-text.small {
    margin-bottom: 5px;
  }

  .main-grid {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
  }

  .large-serif.small {
    font-size: 2.2em;
    line-height: 100%;
  }

  .flex-cap {
    align-items: flex-start;
  }

  .link-holder {
    width: auto;
    min-width: 30px;
  }

  .tween-block.facts {
    padding-left: 5px;
    padding-right: 5px;
  }

  .letter-wrap {
    text-align: center;
  }

  .letter-wrap.tween-block.first {
    padding-left: 0;
  }

  .link-2 {
    font-size: 13px;
  }

  .image-2, .image-3 {
    max-width: 30%;
  }

  .responsiveimage {
    filter: blur(20px);
  }
}

#w-node-_5e10a119-0fec-9858-08f3-552c44c61f16-8b7506fd, #w-node-_2349c9b8-b35a-bde1-8491-ac3648066ef4-8b7506fd {
  grid-area: span 1 / span 1 / span 1 / span 1;
}

#app.w-node-_8e3d87f1-f319-5f99-8adf-f3736844175b-8b7506fd {
  grid-area: 2 / 1 / 3 / 13;
  align-self: center;
}

#w-node-_690abc98-f736-fe8a-e7fa-215e9373cb7f-8b7506fd {
  grid-area: 1 / 1 / 2 / 13;
  align-self: center;
}

#w-node-_94290278-10de-c9de-e56f-235f6ff77862-8b7506fd {
  grid-area: 3 / 1 / 4 / 13;
  align-self: center;
}

#w-node-bcc9aeff-d49c-c2fa-1344-ea21cfb9c60d-8b7506fd {
  grid-area: 4 / 1 / 5 / 13;
  align-self: end;
}

#w-node-bcc9aeff-d49c-c2fa-1344-ea21cfb9c60e-8b7506fd {
  grid-area: 1 / 6 / 2 / 8;
  align-self: end;
}

#w-node-bcc9aeff-d49c-c2fa-1344-ea21cfb9c613-8b7506fd {
  grid-area: 1 / 1 / 2 / 2;
  align-self: center;
}

#w-node-bcc9aeff-d49c-c2fa-1344-ea21cfb9c615-8b7506fd {
  grid-area: 1 / 1 / 2 / 2;
  align-self: center;
  justify-self: start;
}

#w-node-bcc9aeff-d49c-c2fa-1344-ea21cfb9c616-8b7506fd {
  grid-area: 1 / 2 / 2 / 3;
  align-self: center;
}

#w-node-bcc9aeff-d49c-c2fa-1344-ea21cfb9c618-8b7506fd {
  grid-area: 1 / 1 / 2 / 2;
  align-self: center;
  justify-self: start;
}

#w-node-bcc9aeff-d49c-c2fa-1344-ea21cfb9c619-8b7506fd {
  grid-area: 1 / 11 / 2 / 12;
}

#w-node-bcc9aeff-d49c-c2fa-1344-ea21cfb9c61b-8b7506fd {
  grid-area: 1 / 1 / 2 / 2;
  align-self: center;
  justify-self: start;
}

#w-node-bcc9aeff-d49c-c2fa-1344-ea21cfb9c61c-8b7506fd {
  grid-area: 1 / 12 / 2 / 13;
}

#w-node-bcc9aeff-d49c-c2fa-1344-ea21cfb9c61e-8b7506fd {
  grid-area: 1 / 1 / 2 / 2;
  align-self: center;
  justify-self: start;
}

@media screen and (max-width: 991px) {
  #w-node-_5e10a119-0fec-9858-08f3-552c44c61f16-8b7506fd {
    justify-self: end;
  }

  #app.w-node-_8e3d87f1-f319-5f99-8adf-f3736844175b-8b7506fd {
    grid-column: 1 / 4;
    grid-row-end: 8;
    justify-self: center;
  }

  #w-node-f4eb3079-797d-04fd-5003-20bd759fc1ab-8b7506fd {
    justify-self: center;
  }

  #w-node-_690abc98-f736-fe8a-e7fa-215e9373cb7f-8b7506fd {
    grid-column-end: 13;
  }

  #w-node-_03a265a3-234e-c0c4-afba-f96dd6ca0d7f-8b7506fd {
    grid-area: span 1 / span 1 / span 1 / span 1;
  }

  #w-node-_94290278-10de-c9de-e56f-235f6ff77862-8b7506fd {
    grid-row: 2 / 3;
  }

  #w-node-_94290278-10de-c9de-e56f-235f6ff77867-8b7506fd {
    grid-area: 1 / 2 / 2 / 3;
  }

  #w-node-_94290278-10de-c9de-e56f-235f6ff7786a-8b7506fd {
    grid-area: 1 / 3 / 2 / 4;
  }

  #w-node-_94290278-10de-c9de-e56f-235f6ff7786d-8b7506fd {
    grid-area: 1 / 4 / 2 / 5;
  }

  #w-node-bcc9aeff-d49c-c2fa-1344-ea21cfb9c60d-8b7506fd {
    grid-area: 3 / 1 / 4 / 13;
  }

  #w-node-bcc9aeff-d49c-c2fa-1344-ea21cfb9c60e-8b7506fd {
    grid-area: 1 / 3 / 2 / 4;
    align-self: center;
    justify-self: center;
  }

  #w-node-bcc9aeff-d49c-c2fa-1344-ea21cfb9c613-8b7506fd, #w-node-bcc9aeff-d49c-c2fa-1344-ea21cfb9c616-8b7506fd {
    justify-self: center;
  }

  #w-node-bcc9aeff-d49c-c2fa-1344-ea21cfb9c619-8b7506fd {
    grid-column: 4 / 5;
    justify-self: center;
  }

  #w-node-bcc9aeff-d49c-c2fa-1344-ea21cfb9c61c-8b7506fd {
    grid-column: 5 / 6;
    justify-self: center;
  }
}

@media screen and (max-width: 767px) {
  #w-node-_04d78ff1-dbac-376f-ee34-248b72a4826e-8b7506fd {
    grid-area: 1 / 2 / 2 / 3;
  }

  #w-node-bbb18e7e-c841-d500-e9a9-682acc004ea6-8b7506fd {
    grid-area: 3 / 1 / 4 / 3;
  }

  #w-node-_1a1c07fe-6d48-de08-fb70-bf9cfdf0ad17-8b7506fd {
    grid-area: 2 / 1 / 3 / 2;
  }

  #w-node-_94290278-10de-c9de-e56f-235f6ff77867-8b7506fd, #w-node-_94290278-10de-c9de-e56f-235f6ff7786a-8b7506fd {
    grid-row: 2 / 3;
  }

  #w-node-_94290278-10de-c9de-e56f-235f6ff7786d-8b7506fd {
    grid-area: 3 / 2 / 4 / 4;
  }
}

@media screen and (max-width: 479px) {
  #w-node-bcc9aeff-d49c-c2fa-1344-ea21cfb9c60d-8b7506fd {
    grid-column: 2 / 12;
    align-self: center;
  }

  #w-node-bcc9aeff-d49c-c2fa-1344-ea21cfb9c60e-8b7506fd {
    align-self: end;
  }
}


@font-face {
  font-family: 'Akkurat mono';
  src: url('/al3-site/_a/al3.ph/fonts/Akkurat-Mono.woff') format('woff'), url('/al3-site/_a/al3.ph/fonts/Akkurat-Mono.ttf') format('truetype'), url('/al3-site/_a/al3.ph/fonts/Akkurat-Mono.otf') format('opentype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}