@font-face {
  font-family: Inter Variablefont Opsz Wght;
  src: url('../images/') format("truetype");
  font-weight: 100 900;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: Inter Variablefont Opsz Wght;
  src: url('../images/') format("truetype");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: Spacegrotesk Variablefont Wght;
  src: url('../fonts/SpaceGrotesk-VariableFont_wght.ttf') format("truetype");
  font-weight: 300 700;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: Wavefont Variablefont Rond Yela Wght;
  src: url('../images/') format("truetype");
  font-weight: 4 1000;
  font-style: normal;
  font-display: swap;
}

@font-face {
  font-family: Abccameraplain Trial;
  src: url('../fonts/ABCCameraPlain-Bold-Trial.otf') format("opentype");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

:root {
  --golden: #ecb641;
  --bootscreen-orange: #ffa946;
  --white: white;
  --_variable-fonts---variable-font-weight: 100;
  --black: black;
  --_variable-fonts---font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;
}

.section {
  z-index: 1;
  pointer-events: auto;
  mix-blend-mode: normal;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
  position: fixed;
  inset: 0%;
}

.section-2 {
  background-color: #000;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.circle {
  aspect-ratio: 1;
  opacity: 1;
  background-color: #000;
  border-radius: 100%;
  width: 100%;
  height: 100%;
  transition: all .2s;
  position: absolute;
  transform: translate(0, 100%);
}

.circle.redcircle {
  filter: blur(8px);
  background-color: red;
  transform: translate(0, 33%);
}

.circle.redcircle.ripple-effect.outline {
  box-sizing: content-box;
  filter: blur();
  -webkit-text-stroke-width: 0px;
  -webkit-text-stroke-color: transparent;
  background-color: #0000;
  border: 1px solid #fff;
  width: 100%;
  height: 100%;
  padding: 0;
  inset: 0%;
  transform: translate(0, 33%);
}

.circle.greencircle {
  filter: blur(8px);
  background-color: #0f0;
  transform: translate(0, 33%);
}

.circle.greencircle.ripple-effect.outline {
  z-index: 0;
  box-sizing: content-box;
  opacity: 0;
  outline-offset: 0px;
  -webkit-text-stroke-width: 0px;
  -webkit-text-stroke-color: transparent;
  text-shadow: none;
  background-color: #0000;
  border: 1px solid #fff;
  outline: 1px #333;
  inset: 0%;
}

.circle.bluecircle {
  filter: blur(8px);
  background-color: #00f;
  transform: translate(0, 33%);
}

.circle.outlinecircle {
  filter: blur(8px);
  background-color: red;
  transform: translate(0, 33%);
}

.circle.outlinecircle.ripple-effect.outline {
  box-sizing: content-box;
  filter: blur();
  -webkit-text-stroke-width: 0px;
  -webkit-text-stroke-color: transparent;
  background-color: #0000;
  border: 1px solid #fff;
  width: 100%;
  height: 100%;
  padding: 0;
  inset: 0%;
  transform: rotate(0)translate(0, 33%);
}

.circle.outlinecircle.ripple-effect.outline.rotation1 {
  border-color: #888;
  transform: rotate(10deg)translate(0, 33%);
}

.circle.outlinecircle.ripple-effect.outline.rotation2 {
  border-color: #888;
  transform: rotate(20deg)translate(0, 33%);
}

.circle.outlinecircle.ripple-effect.outline.rotation3 {
  border-color: #888;
  transform: rotate(30deg)translate(0, 33%);
}

.circle.outlinecircle.ripple-effect.outline.rotation4 {
  border-color: #888;
  transform: rotate(40deg)translate(0, 33%);
}

.circle.outlinecircle.ripple-effect.outline.rotation5 {
  border-color: #888;
  transform: rotate(50deg)translate(0, 33%);
}

.circle.outlinecircle.ripple-effect.outline.rotation6 {
  border-color: #888;
  transform: rotate(60deg)translate(0, 33%);
}

.circle.outlinecircle.ripple-effect.outline.rotation7 {
  border-color: #888;
  transform: rotate(70deg)translate(0, 33%);
}

.circle.outlinecircle.ripple-effect.outline.rotation8 {
  border-color: #888;
  transform: rotate(80deg)translate(0, 33%);
}

.circle.outlinecircle.ripple-effect.outline.rotation9 {
  border-color: #888;
  transform: rotate(90deg)translate(0, 33%);
}

.circle.outlinecircle.ripple-effect.outline.rotation10 {
  border-width: 1px;
  border-color: #888;
  transform: rotate(100deg)translate(0, 33%);
}

.circle.outlinecircle.ripple-effect.outline.rotation11 {
  border-color: #888;
  transform: rotate(110deg)translate(0, 33%);
}

.circle.outlinecircle.ripple-effect.outline.rotation12 {
  border-color: #888;
  transform: rotate(120deg)translate(0, 33%);
}

.div-block {
  aspect-ratio: 1;
  width: 25vw;
  height: auto;
  position: absolute;
  transform: rotate(120deg);
}

.div-block.red {
  mix-blend-mode: normal;
  width: 18vw;
  padding: 0;
}

.div-block.green {
  mix-blend-mode: screen;
  width: 18vw;
  transform: rotate(240deg);
}

.div-block.blue {
  mix-blend-mode: screen;
  width: 18vw;
  transform: rotate(360deg);
}

.circleparent {
  z-index: 2;
  pointer-events: auto;
  width: 18vw;
  height: 18vw;
  animation: 8s linear infinite rotate;
  position: absolute;
  right: auto;
}

.rgbsection {
  z-index: 2;
  pointer-events: auto;
  -webkit-text-stroke-width: .5px;
  -webkit-text-stroke-color: #1f1f1f;
  width: 100vw;
  height: 100vh;
  text-shadow: none;
  mix-blend-mode: multiply;
  background-color: #000;
  justify-content: center;
  align-items: center;
  padding: 8px;
  font-family: Spacegrotesk Variablefont Wght, sans-serif;
  display: flex;
  position: relative;
  overflow: hidden;
}

.coordinates {
  text-align: right;
  justify-content: flex-end;
  align-items: flex-end;
  width: auto;
  height: auto;
  padding: 1rem;
  display: flex;
  position: absolute;
  inset: auto 0 0% auto;
}

.coordinatetext {
  pointer-events: none;
  color: #fff;
  cursor: pointer;
  -webkit-user-select: none;
  user-select: none;
  font-family: DM Mono, sans-serif;
  font-size: 1.2rem;
  line-height: 120%;
}

.time {
  text-align: right;
  justify-content: flex-end;
  align-items: flex-end;
  width: auto;
  height: auto;
  padding: 1rem;
  display: flex;
  position: absolute;
  inset: 0% 0 auto auto;
}

.timetext {
  pointer-events: none;
  color: #fff;
  cursor: pointer;
  -webkit-user-select: none;
  user-select: none;
  font-family: DM Mono, sans-serif;
  font-size: 1.2rem;
  line-height: 120%;
}

.location {
  text-align: right;
  justify-content: flex-start;
  align-items: flex-end;
  width: auto;
  height: auto;
  padding: 1rem;
  display: flex;
  position: absolute;
  inset: auto auto 0% 0%;
}

.locationtext {
  pointer-events: none;
  color: #fff;
  cursor: pointer;
  -webkit-user-select: none;
  user-select: none;
  font-family: DM Mono, sans-serif;
  font-size: 1rem;
  line-height: 120%;
}

.logo {
  text-align: right;
  justify-content: flex-start;
  align-items: flex-end;
  width: auto;
  height: auto;
  padding: 8px;
  display: flex;
  position: absolute;
  inset: 0% auto auto 0%;
}

.image {
  pointer-events: none;
  -webkit-user-select: none;
  user-select: none;
  max-width: 64px;
}

.noise {
  z-index: 9999;
  pointer-events: none;
  mix-blend-mode: multiply;
  background-image: url('../images/noise_512x512.gif');
  background-position: 50%;
  background-repeat: repeat;
  background-size: auto;
  background-attachment: fixed;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  display: flex;
  position: fixed;
  inset: 0%;
}

.gridsection {
  z-index: 2;
  filter: blur(5px);
  mix-blend-mode: multiply;
  background-color: #0000;
  border: .5px solid red;
  width: 12.5vw;
  height: 100vh;
  position: relative;
}

.grid {
  z-index: 9999;
  opacity: .64;
  pointer-events: none;
  mix-blend-mode: normal;
  border: 0 #fff;
  height: 101svh;
  display: flex;
  position: fixed;
  inset: 0%;
}

.gridcolumn {
  width: 12.5vw;
  height: 100%;
  box-shadow: none;
  outline-offset: 0px;
  mix-blend-mode: normal;
  object-fit: contain;
  border: .2px #797979e0;
  outline: .01px #8a8a8a80;
  flex-flow: wrap;
  justify-content: center;
  align-items: center;
  display: flex;
}

.code-embed {
  width: 0;
  height: 0;
}

.trefoil {
  z-index: 5;
  pointer-events: none;
  mix-blend-mode: exclusion;
  -webkit-user-select: none;
  user-select: none;
  max-width: 18vw;
  position: absolute;
  right: auto;
}

.heading1-portfolio {
  z-index: auto;
  filter: drop-shadow(0 0 6px #0009);
  transform-origin: 50% 100%;
  color: #000;
  text-align: center;
  letter-spacing: 8px;
  -webkit-text-stroke-width: 0px;
  -webkit-text-stroke-color: transparent;
  text-indent: 0;
  width: auto;
  max-width: none;
  height: auto;
  text-shadow: none;
  -webkit-text-decoration-skip-ink: auto;
  text-decoration-skip-ink: auto;
  -webkit-text-fill-color: transparent;
  mix-blend-mode: normal;
  background-color: #000;
  background-image: url('../images/noise_512x512.gif');
  background-position: 50%;
  background-repeat: repeat;
  background-size: contain;
  background-attachment: scroll;
  -webkit-background-clip: text;
  background-clip: text;
  justify-content: center;
  align-items: center;
  margin: 0 0 0;
  font-family: deuterium-variable, sans-serif;
  font-size: clamp(8rem, 6.824rem + 5.882vw, 10rem);
  font-weight: 100;
  line-height: 1.6;
  text-decoration: none;
  transition-property: all;
  transition-duration: .2s;
  transition-timing-function: ease;
  display: flex;
  position: relative;
  inset: 0%;
  overflow: hidden;
  transform: translate(0);
}

.heading1-portfolio:hover {
  filter: drop-shadow(0 8px 6px #0009);
  -webkit-text-stroke-width: 0px;
  -webkit-text-stroke-color: transparent;
  text-shadow: none;
  -webkit-text-fill-color: transparent;
  -webkit-background-clip: text;
  background-clip: text;
  border: 1px #fff;
}

.heading1-portfolio:active {
  -webkit-text-stroke-width: 0px;
  -webkit-text-stroke-color: transparent;
  font-family: deuterium-variable, sans-serif;
}

.maintext {
  z-index: 8;
  text-align: center;
  -webkit-user-select: none;
  user-select: none;
  width: auto;
  padding: 8px;
  position: absolute;
}

.maindescription {
  color: #fff;
  text-align: center;
  -webkit-text-stroke-width: 1px;
  width: auto;
  max-width: none;
  text-shadow: none;
  margin-top: 0;
  margin-left: 0;
  margin-right: auto;
  font-family: DM Mono, sans-serif;
  font-size: 1.65rem;
  line-height: 130%;
}

.section-3 {
  width: 100vw;
  height: 100vh;
}

.eyesection {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  background-color: #000;
  grid-template-rows: auto auto auto auto auto auto auto auto auto auto;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  width: 100vw;
  height: 100vh;
  padding: 24px;
  display: grid;
  position: relative;
}

.eyecontainer {
  justify-content: center;
  align-items: center;
  width: 64px;
  max-width: 64px;
  height: 64px;
  max-height: 64px;
  display: flex;
  overflow: hidden;
  transform: rotate(45deg);
}

.eye {
  background-color: #fff;
  background-image: radial-gradient(circle, #5e5e5e, #f8e9e9 73%, #fff);
  border-radius: 80% 0;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  margin: auto;
  display: flex;
  position: relative;
  overflow: hidden;
  transform: rotate(0);
}

.iris {
  background-color: #000;
  background-image: radial-gradient(circle, #000 23%, #bd6868);
  border-radius: 100%;
  justify-content: center;
  align-items: center;
  width: 40px;
  height: 40px;
  display: flex;
  position: relative;
  overflow: hidden;
}

.pupil {
  background-color: #fff;
  border-radius: 100%;
  width: 25%;
  height: 25%;
  position: relative;
}

.bottomlid {
  z-index: 3;
  background-color: #000;
  border-radius: 150% 150% 0% 0;
  width: 200%;
  height: 100%;
  position: absolute;
  transform: translate(0%, 100%);
}

.toplid {
  z-index: 3;
  background-color: #000;
  border-radius: 0% 0% 150% 150%;
  width: 200%;
  height: 100%;
  position: absolute;
  transform: translate(0, -100%);
}

.eyelids {
  z-index: 99999;
  -webkit-text-fill-color: inherit;
  background-clip: border-box;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  display: flex;
  position: absolute;
  transform: rotate(-45deg);
}

.tunnelsection {
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
  position: relative;
  overflow: hidden;
}

.tunnelcircle {
  z-index: 9999;
  background-color: #ffbf00;
  border-radius: 100%;
  width: 10vw;
  height: 10vw;
  position: absolute;
}

.tunnelcircle.tunnelcircle2 {
  z-index: 9998;
  background-image: linear-gradient(#ffbf00, #c4ff85 50%, #ffbf00);
  width: 20vw;
  height: 20vw;
}

.tunnelcircle.tunnelcircle3 {
  z-index: 9997;
  background-image: linear-gradient(#ffbf00, #9f7 28%, #5deccf 52%, #b1ff87 70%, #ffbf00);
  width: 30vw;
  height: 30vw;
}

.tunnelcircle.tunnelcircle4 {
  z-index: 9996;
  background-image: linear-gradient(#ffa600, #ffbf00 18%, #9f7 35%, #5deccf 52%, #b1ff87 70%, #ffbf00 85%, #ff8000);
  width: 40vw;
  height: 40vw;
}

.tunnelcircle.tunnelcircle5 {
  z-index: 9995;
  background-image: linear-gradient(#ff8000 14%, #ffbf00 27%, #9f7 39%, #5deccf 52%, #b1ff87 64%, #ffbf00 75%, #ff8000 91%);
  width: 50vw;
  height: 50vw;
}

.tunnelcircle.tunnelcircle6 {
  z-index: 9994;
  background-image: linear-gradient(#ff4d00, #ffbf00 13%, #9f7 25%, #76f4aa 39%, #6688ef 53%, #5deccf 61%, #b1ff87 72%, #dbdd3f 84%, #f50);
  width: 60vw;
  height: 60vw;
}

.tunnelcircle.tunnelcircle7 {
  z-index: 9993;
  background-image: linear-gradient(#a6ff7d 6%, #ffbf00 15%, #9f7 28%, #5deccf 40%, #799ff2 50%, #8ff7a4 58%, #b1ff87 70%, #ffbf00 81%, #6aff5a 94%);
  width: 70vw;
  height: 70vw;
}

.tunnelcircle.tunnelcircle8 {
  z-index: 9992;
  background-image: linear-gradient(#ffbf00, #44a7e4 16%, #9f7 28%, #5deccf 43%, #8288f4 55%, #98f99c 62%, #b1ff87 70%, #ffbf00 79%, #006aff 91%, #ffbf00);
  width: 80vw;
  height: 80vw;
}

.tunnelcircle.tunnelcircle9 {
  z-index: 9991;
  background-image: linear-gradient(#3745dd, #ffbf00 16%, #9f7 31%, #5deccf 46%, #b1ff87 60%, #ff9100 75%, #ffbf00 85%, #7476ff);
  width: 90vw;
  height: 90vw;
}

.tunnelcircle.tunnelcircle10 {
  z-index: 9990;
  background-image: linear-gradient(#ff1a00, #ccdf3c 10%, #9f7 22%, #71f2b2 31%, #639dee 49%, #5deccf 60%, #b1ff87 73%, #d3e34d 83%, #efcc1b 90%, #ff5e00);
  width: 100vw;
  height: 100vw;
}

.tunnelcircle.tunnelcircle11 {
  z-index: 9989;
  background-image: linear-gradient(#f30, #d3da33 12%, #9f7 28%, #5deccf 52%, #b1ff87 70%, #ffbf00 83%, #ff3c00);
  width: 110vw;
  height: 110vw;
}

.tunnelcircle.tunnelcircle12 {
  z-index: 9988;
  background-image: linear-gradient(#ffbf00, #61dd37 13%, #77efff 28%, #5d69ec 44%, #87fdff 58%, #ffe139 75%, #f40 90%, #007bff 104%);
  width: 120vw;
  height: 120vw;
}

.keyboardsection {
  background-color: #000;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  min-height: 100vh;
  padding: 16px;
  display: flex;
}

.keyboard {
  z-index: 10;
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  width: auto;
  margin-top: auto;
  margin-left: auto;
  margin-right: auto;
  display: flex;
  position: absolute;
  inset: auto 0% 0%;
}

.keyboardkey {
  aspect-ratio: 120 / 144;
  border-bottom: 6px solid #000;
  border-bottom-right-radius: 11px;
  border-bottom-left-radius: 11px;
  width: 10vw;
  max-width: 64px;
  transition: all .2s;
  display: inline-block;
  position: relative;
  overflow: hidden;
}

.keyimage {
  aspect-ratio: 120 / 144;
  transition: all .2s;
  position: absolute;
}

.keyimage:hover {
  transform: translate(0, 10%);
}

.keyrow {
  flex-flow: row;
  justify-content: center;
  align-items: center;
  display: flex;
  position: relative;
}

.keyrow.topkeyboardrow {
  z-index: 1;
  justify-content: center;
  align-items: center;
  margin: 0;
  inset: auto;
  transform: translate(0, 66%);
}

.keyrow.middlekeyboardrow {
  z-index: 2;
  transform: translate(0, 33%);
}

.keyrow.bottomkeyboardrow {
  z-index: 3;
  transform: translate(0);
}

.keyboardoutput {
  color: #000;
  text-align: center;
  white-space: normal;
  word-break: normal;
  background-color: #fff;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  max-width: none;
  height: 100vh;
  max-height: none;
  margin: 0 auto;
  padding: 8px;
  font-family: Inconsolata, monospace;
  font-size: 4rem;
  line-height: 100%;
  transition: all .2s;
  display: flex;
  position: relative;
  top: auto;
  overflow: hidden;
}

.body {
  background-color: gray;
}

.section-4 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-2 {
  width: 100%;
  height: 100%;
}

.downloadupload {
  z-index: 9997;
  background-image: url('../images/downloadupload_1024x512.gif');
  background-position: 50%;
  background-repeat: repeat;
  background-size: contain;
  background-attachment: scroll;
  width: 100svw;
  height: 100svh;
  display: none;
  position: fixed;
  inset: 0%;
}

.section-5 {
  background-color: #000;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.goldenratio {
  z-index: 1;
  box-sizing: border-box;
  border: 0 inset #554b14;
  outline: .5px solid #554b14;
  flex-flow: row;
  width: auto;
  height: auto;
  display: flex;
  position: relative;
  overflow: hidden;
}

.code-embed-3 {
  width: 100%;
  height: 100%;
}

.arccircle {
  z-index: 2;
  aspect-ratio: 1;
  background-color: #0000;
  border: 2px solid gold;
  border-radius: 100%;
  width: 200%;
  height: 200%;
  display: none;
  position: absolute;
  inset: 0%;
}

.spiralcanvascode {
  opacity: 1;
  pointer-events: none;
  mix-blend-mode: normal;
  width: 100vw;
  height: 100vh;
  display: none;
  position: absolute;
  inset: 0%;
}

.div-block-2 {
  background-color: green;
  width: 100vh;
  height: 100vh;
  position: absolute;
  inset: 0% auto auto 0%;
}

.div-block-3 {
  opacity: .46;
  background-color: green;
  width: 100vh;
  height: 100vh;
  display: none;
  position: absolute;
}

.goldenratiocircle {
  aspect-ratio: 1;
  border-top-style: solid;
  border-top-width: .5px;
  border-top-color: var(--golden);
  border-right-style: solid;
  border-right-width: .5px;
  border-right-color: var(--golden);
  border-bottom-style: solid;
  border-bottom-width: .5px;
  border-bottom-color: var(--golden);
  border-left-style: solid;
  border-left-width: .5px;
  border-left-color: var(--golden);
  width: 200%;
  height: 200%;
  box-shadow: inset 6px -4px 18px 3px var(--golden), 6px -4px 18px 3px var(--golden);
  background-color: #0000;
  border-radius: 50%;
  position: absolute;
  inset: 0% auto auto 0%;
  transform: translate(0);
}

.goldenratiocircle1 {
  aspect-ratio: 1;
  border: .5px solid var(--golden);
  width: 200%;
  height: 200%;
  box-shadow: 6px -4px 18px 3px var(--golden), inset 6px -4px 18px 4px var(--golden);
  background-color: #0000;
  border-radius: 50%;
  position: absolute;
  inset: 0% auto auto 0%;
  transform: translate(0);
}

.variablefontsection {
  background-color: #000;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.variablemarquee {
  z-index: 3;
  color: #fff;
  text-align: center;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  padding: 1rem;
  font-family: Spacegrotesk Variablefont Wght, sans-serif;
  display: flex;
  position: absolute;
}

.variabletext {
  font-size: 3rem;
  font-weight: 400;
  line-height: 100%;
  transition: all .2s;
  position: absolute;
}

.cube {
  transform-style: preserve-3d;
  position: relative;
}

.face.front {
  overflow: hidden;
}

.heading-2 {
  color: #fff;
  margin: 0 auto 0 0;
  font-family: Spacegrotesk Variablefont Wght, sans-serif;
  font-size: 3rem;
  font-weight: 700;
  line-height: 100%;
  position: static;
  left: 1rem;
}

.div-block-4 {
  z-index: 99;
  flex-flow: column;
  justify-content: center;
  align-items: flex-start;
  max-width: 61vw;
  margin-right: auto;
  padding-left: 1rem;
  display: flex;
  position: absolute;
  inset: 0% auto 0% 0;
}

.text-span {
  vertical-align: super;
  margin-bottom: 1rem;
  font-size: 1.2rem;
  line-height: 130%;
  display: block;
  position: relative;
}

.text-block {
  color: #fff;
  font-family: Inter Variablefont Opsz Wght, sans-serif;
}

.link, .link-2, .link-3 {
  color: #fff;
}

.italic-text {
  font-size: 5rem;
}

.section-6 {
  background-color: #000;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
  position: relative;
  overflow: hidden;
}

.marqueeline {
  position: absolute;
  inset: auto auto auto 0%;
}

.marqueelinecontent {
  font-family: Inter Variablefont Opsz Wght, sans-serif;
  display: inline-flex;
  transform: translate(0%);
}

.text-block-2 {
  color: #fff;
  font-family: Inter Variablefont Opsz Wght, sans-serif;
  font-size: 1rem;
  line-height: 120%;
}

.text-block-3 {
  color: #fff;
  font-family: Inter Variablefont Opsz Wght, sans-serif;
  font-size: 2rem;
  line-height: 120%;
}

.code-embed-4 {
  color: #fff;
  font-family: Inter Variablefont Opsz Wght, sans-serif;
  font-size: 5rem;
  line-height: 120%;
}

.text-block-4 {
  color: #fff;
  font-variation-settings: "wght" 100, "opsz" 14;
  white-space: nowrap;
  width: 100%;
  font-family: Inter Variablefont Opsz Wght, sans-serif;
  font-size: 3rem;
  line-height: 100%;
  display: block;
}

.div-block-5 {
  z-index: 2;
  aspect-ratio: 1;
  mix-blend-mode: hard-light;
  width: 33%;
  height: auto;
  margin-left: 0;
  padding: 0;
  position: absolute;
  inset: auto;
}

.tileasterisk {
  opacity: .5;
  mix-blend-mode: normal;
  width: 33.33%;
  transition: all 1.5s cubic-bezier(.77, 0, .175, 1);
}

.section-7 {
  width: 100vw;
  height: 100vh;
}

.code-embed-5 {
  font-family: Inter Variablefont Opsz Wght, sans-serif;
}

.body-3 {
  cursor: none;
  overflow-x: hidden;
}

.catalogsection {
  z-index: 0;
  background-color: #000;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
  position: static;
}

.catalogentry {
  aspect-ratio: 1;
  border: 1px solid #000;
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  width: 100vw;
  height: auto;
  min-height: 100vh;
  transition: all .2s;
  display: flex;
  position: absolute;
  overflow: hidden;
}

.catalogentry.entry1 {
  z-index: auto;
  box-sizing: border-box;
  width: 800px;
  height: 800px;
  min-height: 0;
  transition: all .2s;
  overflow: hidden;
  transform: none;
}

.catalogentry.entry1:hover {
  transform: none;
}

.catalogentry.entry2 {
  z-index: 99;
  z-index: 99;
  box-sizing: border-box;
  width: 800px;
  height: 800px;
  min-height: 0;
  transform-style: preserve-3d;
  overflow: hidden;
  transform: rotateX(-20deg)rotateY(-45deg)rotateZ(0)scale(.3)translate3d(0, 0, -50px);
}

.catalogentry.entry3 {
  z-index: 3;
  box-sizing: border-box;
  width: 800px;
  height: 800px;
  min-height: 0;
  transform-style: preserve-3d;
  overflow: hidden;
  transform: rotateX(-20deg)rotateY(-45deg)rotateZ(0)scale(.3)translate3d(0, 0, -100px);
}

.catalogentry.catalog1 {
  -webkit-user-select: none;
  user-select: none;
  border-style: none;
  border-width: 0;
  transition-duration: .6s;
  transition-timing-function: cubic-bezier(.85, 0, .15, 1);
}

.catalogentry.catalog2 {
  -webkit-user-select: none;
  user-select: none;
  border-style: none;
  transition-duration: .6s;
  transition-timing-function: cubic-bezier(.85, 0, .15, 1);
}

.catalogentry.catalog3 {
  -webkit-user-select: none;
  user-select: none;
  border-style: none;
  border-width: 0;
  transition-duration: .6s;
  transition-timing-function: cubic-bezier(.85, 0, .15, 1);
}

.catalogentryabovethefold {
  aspect-ratio: 1;
  background-color: red;
  background-image: url('../images/vinyl.png');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
  background-attachment: fixed;
  width: 100%;
  min-height: auto;
}

.catalogentryabovethefold.entry2abovethefold {
  background-color: #00f;
  background-size: 100%;
  height: 100%;
  min-height: 100%;
  position: relative;
  overflow: auto;
}

.catalogentryabovethefold.entry1abovethefold {
  background-size: 100%;
  background-attachment: scroll;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  height: 100%;
  min-height: 100%;
  display: block;
  position: relative;
  overflow: auto;
}

.catalogentryabovethefold.entry3abovethefold {
  background-color: #ff0;
  background-size: 100%;
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  height: 100%;
  min-height: 100%;
  display: block;
  position: relative;
  overflow: auto;
}

.catalogentrycontent {
  transform-origin: 50% 0;
  color: #fff;
  text-align: center;
  background-color: #fff;
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  width: 100vw;
  height: auto;
  min-height: 100vh;
  padding: 108px 1rem;
  display: none;
  transform: translate(0);
}

.paragraph {
  color: #000;
  width: 300px;
}

.heading-3 {
  color: #000;
  font-size: 3rem;
  line-height: 100%;
}

.catalogentryslider {
  z-index: 99;
  perspective: none;
  perspective-origin: 50%;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
  position: relative;
  overflow: hidden;
}

.section-8 {
  background-color: #1f1f1f;
  width: 100vw;
  height: 100vh;
}

.zrotate {
  perspective: none;
  perspective-origin: 50%;
  transform-origin: 50%;
  width: 100vw;
  height: 100vh;
  transform-style: preserve-3d;
  background-color: #0000;
  justify-content: center;
  align-items: center;
  transition: all .3s;
  display: flex;
  position: relative;
  overflow: hidden;
  transform: translate(0)rotateX(-20deg)rotateY(-45deg)rotateZ(0);
}

.entry {
  z-index: 1;
  aspect-ratio: 1;
  width: 100vw;
  height: 100vw;
  min-height: 0;
  transform-style: preserve-3d;
  background-color: #d3ceb6;
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  display: flex;
  position: absolute;
  overflow: hidden;
  transform: translateZ(20px)scale(1);
}

.entryabovethefold {
  aspect-ratio: 1;
  background-image: url('../images/vinyl.png');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: contain;
  background-attachment: fixed;
  width: 100vw;
  height: auto;
}

.div-block-6 {
  background-color: #fff;
  flex-flow: column;
  width: 100%;
  height: auto;
  min-height: 100vh;
  padding: 40px;
  display: flex;
}

.entrywrapper {
  perspective: none;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 1005px;
  display: flex;
  position: absolute;
  transform: scale(.25);
}

.zwrapper {
  z-index: 99;
  perspective: none;
  background-color: #0000;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  display: flex;
  position: relative;
}

.div-block-7 {
  z-index: 1;
  aspect-ratio: 1;
  background-color: #dd00ff80;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: auto;
  min-height: 100%;
  display: flex;
  position: relative;
}

.spinningvinyl {
  aspect-ratio: 1;
  width: 960px;
  max-width: 50%;
  height: auto;
  position: relative;
}

.image-2 {
  -webkit-user-select: none;
  user-select: none;
  transition-property: all;
  transition-duration: .5s;
  transition-timing-function: ease;
  animation: 30s linear infinite rotateZ;
}

.bitgrid {
  z-index: 9999;
  opacity: .33;
  pointer-events: none;
  mix-blend-mode: normal;
  object-fit: cover;
  background-image: url('../images/gridsquare2.svg');
  background-position: 50%;
  background-repeat: repeat;
  background-size: 12px 12px;
  background-attachment: scroll;
  justify-content: center;
  align-items: center;
  width: 100svw;
  height: 100svh;
  display: flex;
  position: fixed;
  inset: 0%;
}

.albumtitleframe {
  color: #fff;
  text-align: right;
  text-transform: uppercase;
  vertical-align: baseline;
  -webkit-user-select: none;
  user-select: none;
  margin: 0;
  font-family: DM Mono, sans-serif;
  font-size: 2rem;
  font-weight: 500;
  line-height: 90%;
  text-decoration: none;
  position: absolute;
  bottom: 1rem;
  left: auto;
  right: 1rem;
}

.artisttitleframe {
  color: #fff;
  text-align: right;
  text-transform: uppercase;
  vertical-align: baseline;
  -webkit-user-select: none;
  user-select: none;
  margin: 0;
  font-family: DM Mono, sans-serif;
  font-size: 2rem;
  font-weight: 500;
  line-height: 90%;
  text-decoration: none;
  position: absolute;
  inset: 1rem auto auto 1rem;
}

.siteheadline {
  z-index: 2;
  pointer-events: none;
  color: #0000;
  text-align: left;
  letter-spacing: -.5rem;
  -webkit-text-stroke-width: 1.2px;
  -webkit-text-stroke-color: white;
  text-transform: uppercase;
  -webkit-text-fill-color: transparent;
  -webkit-user-select: none;
  user-select: none;
  vertical-align: baseline;
  background-color: #0000;
  -webkit-background-clip: text;
  background-clip: text;
  width: auto;
  margin: 0 0 1rem;
  font-family: Poiret One, sans-serif;
  font-size: 10rem;
  font-weight: 400;
  line-height: 80%;
  text-decoration: none;
  position: relative;
  inset: auto;
}

.div-block-8 {
  z-index: 0;
  width: 100%;
  height: 100%;
  padding: 0;
  position: fixed;
  inset: 0%;
  overflow: hidden;
}

.div-block-9 {
  width: 100%;
  height: 100%;
  position: relative;
}

.div-block-10 {
  width: 200vw;
}

.image-3 {
  width: 100%;
}

.catalognoise {
  z-index: 999;
  pointer-events: none;
  mix-blend-mode: multiply;
  background-image: url('../images/noise_512x512.gif');
  background-position: 50%;
  background-repeat: repeat;
  background-size: auto;
  background-attachment: fixed;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  display: flex;
  position: fixed;
  inset: 0%;
}

.tilebackgroundwrapper {
  z-index: 1;
  pointer-events: none;
  width: 100%;
  height: 100%;
  position: fixed;
  inset: 0%;
  overflow: hidden;
}

.tilebackgroundanimation {
  width: 200%;
  height: 100%;
  position: absolute;
}

.image-4 {
  opacity: .75;
  width: 25%;
  display: none;
  position: fixed;
  inset: 0% 0% 0% auto;
}

.shadowvignette {
  z-index: 100;
  pointer-events: none;
  mix-blend-mode: multiply;
  position: fixed;
  inset: 0%;
}

.section-9 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.gradientbarcontainer {
  outline-offset: 0px;
  border: 8px #000;
  outline: 8px solid #333;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  max-width: 960px;
  height: 4rem;
  padding: 8px;
  display: flex;
}

.gradientbar {
  background-color: #0000;
  width: 100%;
  height: 100%;
}

.partitionsection {
  flex-flow: wrap;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
  position: fixed;
  inset: 0%;
}

.partition {
  background-image: linear-gradient(225deg, #000, #fff);
  width: 50%;
  height: 50%;
}

.siteheadlinecontainer {
  z-index: 1;
  opacity: 0;
  pointer-events: none;
  flex-flow: column;
  width: 38vw;
  transition: all .2s;
  display: flex;
  position: fixed;
  inset: auto auto 1rem 1rem;
  transform: translate(0, -10%);
}

.siteleadparagraph {
  opacity: 0;
  pointer-events: none;
  color: #fff;
  letter-spacing: 0;
  -webkit-user-select: none;
  user-select: none;
  word-spacing: 1px;
  font-family: DM Mono, sans-serif;
  font-size: .8rem;
  line-height: 140%;
  transition-property: all;
  transition-duration: .5s;
  transition-timing-function: ease;
  position: relative;
  transform: translate(0, -15%);
}

.code-embed-6 {
  z-index: 0;
  pointer-events: auto;
  width: 100svw;
  height: 100svh;
  position: fixed;
  inset: 0%;
}

.siteheadlineclones {
  z-index: 1;
  pointer-events: none;
  color: #0000;
  text-align: left;
  letter-spacing: -.5rem;
  -webkit-text-stroke-width: 1.2px;
  -webkit-text-stroke-color: red;
  text-transform: uppercase;
  -webkit-text-fill-color: transparent;
  -webkit-user-select: none;
  user-select: none;
  vertical-align: baseline;
  background-color: #0000;
  -webkit-background-clip: text;
  background-clip: text;
  width: auto;
  margin: 0 0 1rem;
  font-family: Poiret One, sans-serif;
  font-size: 11rem;
  font-weight: 400;
  line-height: 80%;
  text-decoration: none;
  position: absolute;
  inset: 0% 0% auto;
}

.siteheadlineclones.clone1 {
  -webkit-text-stroke-color: #fffc;
  font-size: 10rem;
  transform: translate(0, -10%);
}

.siteheadlineclones.clone2 {
  -webkit-text-stroke-color: #fff9;
  font-size: 10rem;
  transform: translate(0, -20%);
}

.siteheadlineclones.clone3 {
  -webkit-text-stroke-color: #fff6;
  font-size: 10rem;
  transform: translate(0, -30%);
}

.siteheadlineclones.clone4 {
  -webkit-text-stroke-color: #fff3;
  font-size: 10rem;
  transform: translate(0, -40%);
}

.siteheadlineclones.clone5 {
  -webkit-text-stroke-color: #ffffff1a;
  font-size: 10rem;
  transform: translate(0, -50%);
}

.stylus {
  z-index: 999;
  pointer-events: none;
  transform-origin: 100% 0;
  flex-flow: column;
  width: 100%;
  height: 100%;
  margin-right: 0%;
  transition: all .5s cubic-bezier(.755, .05, .855, .06);
  display: flex;
  position: absolute;
  inset: 0% 0% auto auto;
  transform: none;
}

.stylus.hidestylus {
  z-index: 9999;
  pointer-events: none;
  width: 100%;
  height: 100%;
  margin-right: 0%;
  display: block;
  position: absolute;
  inset: 0% 0% auto;
  transform: translate(0%, 25%)rotate(0);
}

.stylusimage {
  transform-origin: 70% 20%;
  width: auto;
  height: 75vh;
  margin-right: 0%;
  transition: all .7s cubic-bezier(.6, .04, .98, .335);
  display: inline-block;
  position: absolute;
  inset: 0% 0% auto auto;
  transform: translate(0%)rotate(0);
}

.styluscontainer {
  pointer-events: none;
  width: 100vw;
  height: 100vh;
  position: absolute;
  inset: 0%;
  overflow: hidden;
}

.gamesectionmain {
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  padding: 8px;
  display: flex;
  position: relative;
}

.gameswrapper {
  width: 98%;
  height: 98%;
  padding: 8px;
  position: relative;
  inset: auto;
}

.game {
  z-index: 1;
  background-color: #303030;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  display: flex;
  position: relative;
  inset: auto;
}

.game.slidergame {
  display: none;
}

.game.targetgame {
  z-index: 2;
  cursor: crosshair;
}

.code-embed-7 {
  color: #fff;
}

.section-10 {
  background-color: red;
  flex-flow: column;
  width: 100vw;
  height: 100vh;
  min-height: 100vh;
  display: flex;
  position: relative;
}

.progressbar {
  z-index: 99999;
  filter: blur(1px);
  flex-flow: column;
  width: 16px;
  height: 100dvh;
  padding: 0;
  display: flex;
  position: fixed;
  inset: 0% 0% 0% auto;
  overflow: hidden;
}

.bar {
  filter: blur(2px);
  transform-origin: 50% 0;
  width: 100%;
  height: 100%;
  transform-style: preserve-3d;
  background-image: repeating-linear-gradient(#000, #001eff 14.3%, #00c8ff 28.6%, #fff 42.9%, #ffea00 57.2%, #f60 71.5%, red 85.8%, #8b0000);
  transition: all .2s;
  transform: scale3d(1, 0, 1);
}

.printproxy {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  background-color: gray;
  grid-template: "Area . Area-2" 64px
                 "Area-7 . Area-5"
                 "Area-3 Area-6 Area-4" minmax(40px, 64px)
                 / minmax(64px, 64px) auto minmax(64px, 64px);
  grid-auto-columns: minmax(24px, 1fr);
  grid-auto-flow: row dense;
  place-items: center;
  width: 100%;
  height: 100%;
  padding: 8px;
  display: grid;
  position: relative;
}

.div-block-12 {
  border: 2px solid #000;
  border-width: 0 2px 2px 0;
  width: 100%;
  height: 100%;
}

.cropbox {
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  display: flex;
  position: relative;
}

.toplefthorizontalcrop {
  border-bottom: 1px solid #000;
  border-right: 1px solid #000;
  width: 75%;
  height: 1px;
  position: absolute;
  inset: auto auto 0%;
}

.topleftverticalcrop {
  border-bottom: 1px solid #000;
  border-right: 1px solid #000;
  width: 1px;
  height: 75%;
  position: absolute;
  inset: auto 0% auto auto;
}

.toprightverticalcrop {
  border-bottom: 1px solid #000;
  border-right: 1px solid #000;
  width: 1px;
  height: 75%;
  position: absolute;
  inset: auto auto auto 0%;
}

.toprighthorizontalcrop {
  border-bottom: 1px solid #000;
  border-right: 1px solid #000;
  width: 75%;
  height: 1px;
  position: absolute;
  inset: auto auto 0%;
}

.bottomleftverticalcrop {
  border-bottom: 1px solid #000;
  border-right: 1px solid #000;
  width: 1px;
  height: 75%;
  position: absolute;
  inset: auto 0% auto auto;
}

.bottomlefthorizontalcrop {
  border-bottom: 1px solid #000;
  border-right: 1px solid #000;
  width: 75%;
  height: 1px;
  position: absolute;
  inset: 0% auto auto;
}

.bottomrightverticalcrop {
  border-bottom: 1px solid #000;
  border-right: 1px solid #000;
  width: 1px;
  height: 75%;
  position: absolute;
  inset: auto auto auto 0%;
}

.bottomrighthorizontalcrop {
  border-bottom: 1px solid #000;
  border-right: 1px solid #000;
  width: 75%;
  height: 1px;
  position: absolute;
  inset: 0 auto auto;
}

.div-block-13 {
  justify-content: space-between;
  align-items: center;
  width: 100%;
  height: 100%;
  display: flex;
}

.calque {
  height: 100%;
  max-height: 24px;
}

.slugs {
  flex-flow: column;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  height: 100%;
  display: flex;
}

.calque2 {
  width: 100%;
  max-width: 50%;
  height: 100%;
}

.colorbars {
  border: .5px solid #000;
  flex-flow: row;
  display: flex;
}

.colorbox {
  background-color: #0ff;
  border: 1px solid #000;
  width: 20px;
  height: 20px;
}

.colorbox.black {
  background-color: #000;
}

.colorbox.white {
  background-color: #fff;
}

.colorbox.magenta {
  background-color: #f0f;
  border: 1px solid #000;
  width: 20px;
  height: 20px;
}

.colorbox.yellow {
  background-color: #ff0;
  border: 1px solid #000;
  width: 20px;
  height: 20px;
}

.colorbox.red {
  background-color: red;
  border: 1px solid #000;
  width: 20px;
  height: 20px;
}

.colorbox.green {
  background-color: green;
  border: 1px solid #000;
  width: 20px;
  height: 20px;
}

.colorbox.blue {
  background-color: #00f;
  border: 1px solid #000;
  width: 20px;
  height: 20px;
}

.greyscale {
  border: 1px solid #000;
  width: auto;
  display: flex;
}

.greyscaleblock {
  background-color: #000;
  width: 25px;
  height: 25px;
}

.greyscaleblock.black100 {
  aspect-ratio: 1;
  border: 1px solid #000;
  width: 20px;
  height: 20px;
}

.greyscaleblock.black90 {
  background-color: #1a1a1a;
  border: 1px solid #000;
  width: 20px;
  height: 20px;
}

.greyscaleblock.black80 {
  background-color: #333;
  border: 1px solid #000;
  width: 20px;
  height: 20px;
}

.greyscaleblock.black70 {
  background-color: #4d4d4d;
  border: 1px solid #000;
  width: 20px;
  height: 20px;
}

.greyscaleblock.black60 {
  background-color: #666;
  border: 1px solid #000;
  width: 20px;
  height: 20px;
}

.greyscaleblock.black50 {
  background-color: gray;
  border: 1px solid #000;
  width: 20px;
  height: 20px;
}

.greyscaleblock.black40 {
  background-color: #999;
  border: 1px solid #000;
  width: 20px;
  height: 20px;
}

.greyscaleblock.black30 {
  background-color: #b3b3b3;
  border: 1px solid #000;
  width: 20px;
  height: 20px;
}

.greyscaleblock.black20 {
  background-color: #ccc;
  border: 1px solid #000;
  width: 20px;
  height: 20px;
}

.greyscaleblock.black10 {
  background-color: #e6e6e6;
  border: 1px solid #000;
  width: 20px;
  height: 20px;
}

.greyscaleblock.black0 {
  background-color: #fff;
  border: 1px solid #000;
  width: 20px;
  height: 20px;
}

.colorscale {
  display: flex;
}

.colorscaleblock {
  background-color: #0ff;
  width: 25px;
  height: 25px;
}

.colorscaleblock.cyan100 {
  border: 1px solid #0ff;
  width: 20px;
  height: 20px;
}

.colorscaleblock.cyan80 {
  background-color: #40ffff;
  border: 1px solid #0ff;
  width: 20px;
  height: 20px;
}

.colorscaleblock.cyan60 {
  background-color: #80ffff;
  border: 1px solid #0ff;
  width: 20px;
  height: 20px;
}

.colorscaleblock.cyan40 {
  background-color: #bfffff;
  border: 1px solid #0ff;
  width: 20px;
  height: 20px;
}

.colorscaleblock.cyan20 {
  background-color: #fff;
  border: 1px solid #0ff;
  width: 20px;
  height: 20px;
}

.colorscaleblock.magenta100 {
  background-color: #f0f;
  border: 1px solid #f0f;
  width: 20px;
  height: 20px;
}

.colorscaleblock.magenta80 {
  background-color: #ff40ff;
  border: 1px solid #f0f;
  width: 20px;
  height: 20px;
}

.colorscaleblock.magenta60 {
  background-color: #ff80ff;
  border: 1px solid #f0f;
  width: 20px;
  height: 20px;
}

.colorscaleblock.magenta40 {
  background-color: #ffbfff;
  border: 1px solid #f0f;
  width: 20px;
  height: 20px;
}

.colorscaleblock.magenta20 {
  background-color: #fff;
  border: 1px solid #f0f;
  width: 20px;
  height: 20px;
}

.colorscaleblock.yellow100 {
  background-color: #ff0;
  border: 1px solid #ff0;
  width: 20px;
  height: 20px;
}

.colorscaleblock.yellow80 {
  background-color: #ffff40;
  border: 1px solid #ff0;
  width: 20px;
  height: 20px;
}

.colorscaleblock.yellow60 {
  background-color: #ffff80;
  border: 1px solid #ff0;
  width: 20px;
  height: 20px;
}

.colorscaleblock.yellow40 {
  background-color: #ffffbf;
  border: 1px solid #ff0;
  width: 20px;
  height: 20px;
}

.colorscaleblock.yellow20 {
  background-color: #fff;
  border: 1px solid #ff0;
  width: 20px;
  height: 20px;
}

.colorscaleblock.black100 {
  background-color: #000;
  border: 1px solid #000;
  width: 20px;
  height: 20px;
}

.colorscaleblock.black80 {
  background-color: #404040;
  border: 1px solid #000;
  width: 20px;
  height: 20px;
}

.colorscaleblock.black60 {
  background-color: gray;
  border: 1px solid #000;
  width: 20px;
  height: 20px;
}

.colorscaleblock.black40 {
  background-color: #bfbfbf;
  border: 1px solid #000;
  width: 20px;
  height: 20px;
}

.colorscaleblock.black20 {
  background-color: #fff;
  border: 1px solid #000;
  width: 20px;
  height: 20px;
}

.bottommargins {
  justify-content: space-between;
  align-items: center;
  width: 100%;
  height: 100%;
  display: flex;
}

.div-block-15 {
  grid-column-gap: 4px;
  grid-row-gap: 4px;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 88%;
  height: 88%;
  padding-left: 4px;
  padding-right: 4px;
  display: flex;
}

.div-block-16 {
  border-bottom: 2px solid #000;
  width: 100%;
  height: 100px;
}

.rule {
  border: 2px solid #000;
  width: 100%;
  height: 0;
  transition: all .3s;
}

.rulewrapper {
  grid-column-gap: 4px;
  grid-row-gap: 4px;
  flex-flow: row;
  justify-content: space-around;
  align-items: center;
  width: 90%;
  height: 50%;
  max-height: 24px;
  padding-left: 4px;
  padding-right: 4px;
  display: flex;
  position: relative;
  overflow: hidden;
}

.div-block-17 {
  background-image: url('../images/wave.svg');
  background-position: 50%;
  background-repeat: repeat-x;
  background-size: auto;
  background-attachment: scroll;
  width: 100%;
  height: 200%;
  position: absolute;
}

.div-block-17-copy {
  background-image: url('../images/wave.svg');
  background-position: 50%;
  background-repeat: repeat-x;
  background-size: cover;
  background-attachment: scroll;
  width: 100%;
  height: 200%;
  position: absolute;
  top: auto;
}

.moirewave1, .moirewave2 {
  background-image: url('../images/wave2.svg');
  background-position: 50%;
  background-repeat: repeat-x;
  background-size: auto;
  background-attachment: scroll;
  width: 100%;
  height: 200%;
  display: none;
  position: absolute;
}

.shadercanvas {
  mix-blend-mode: multiply;
  width: 100%;
  height: 12px;
  margin-bottom: 0;
  display: none;
  position: relative;
}

.printsection {
  background-color: #0000;
  flex-flow: column;
  width: 100vw;
  height: 100vh;
  min-height: 100vh;
  display: flex;
  position: relative;
}

.printsection.section-load-reducer {
  justify-content: center;
  align-items: center;
}

.section-11 {
  background-color: #0ff;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  padding: 0;
  display: flex;
}

.code-embed-8 {
  width: 100%;
  height: 100%;
}

.section-12 {
  background-color: gray;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.section-13 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-9 {
  aspect-ratio: 1;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 90%;
  max-width: none;
  height: 90%;
  margin-bottom: 0;
  display: flex;
  position: relative;
}

.section-14 {
  background-color: gray;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  padding: 2rem;
  display: flex;
}

.code-embed-10 {
  background-color: #000;
  flex-flow: column;
  order: 0;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  display: flex;
}

.mainarea {
  background-color: #0000;
  background-image: linear-gradient(#536cf7, #131533);
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  transition: opacity .2s;
  display: flex;
  position: relative;
}

.handwrapper {
  z-index: 4;
  aspect-ratio: 1;
  pointer-events: none;
  -webkit-user-select: none;
  user-select: none;
  width: 100%;
  max-width: 128px;
  height: auto;
  position: absolute;
  inset: auto;
  transform: translate(0%);
}

.fingersbase {
  z-index: 2;
  pointer-events: none;
  cursor: none;
  -webkit-user-select: none;
  user-select: none;
  width: 100%;
  height: 100%;
  position: relative;
  transform: translate(0, -50%);
}

.basefingerimage {
  -webkit-user-select: none;
  user-select: none;
}

.thumbhand {
  z-index: 9999;
  pointer-events: none;
  cursor: none;
  -webkit-user-select: none;
  user-select: none;
  width: 100%;
  height: 100%;
  position: relative;
  transform: translate(0, 50%);
}

.basethumbhandimage {
  z-index: 9999;
  -webkit-user-select: none;
  user-select: none;
  position: absolute;
}

.disc {
  z-index: 3;
  aspect-ratio: 1;
  pointer-events: auto;
  -webkit-user-select: none;
  user-select: none;
  background-color: #0000;
  border-radius: 1000px;
  width: 100px;
  height: 100px;
  position: relative;
  bottom: 0;
}

.discimage {
  z-index: 3;
  pointer-events: none;
  -webkit-user-select: none;
  user-select: none;
  position: relative;
}

.section-15 {
  background-color: #000;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  padding: 12px;
  display: flex;
}

.canvas-container {
  color: #fff;
  text-align: center;
  box-sizing: border-box;
  width: 100%;
  height: 100vh;
  margin-bottom: 0;
  font-family: Spacegrotesk Variablefont Wght, sans-serif;
}

.section-16 {
  background-color: #000;
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  width: 100vw;
  height: 100vh;
  min-height: 0;
  padding: 0;
  display: flex;
}

.code-embed-11 {
  width: 100%;
  height: 90%;
  font-family: Instrument Serif, sans-serif;
}

.about-text-wrapper {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  grid-template-rows: auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  display: grid;
  position: relative;
}

.section-17 {
  width: 100%;
}

.section-18 {
  background-color: #b7dbd5;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  padding: 1rem;
  display: flex;
}

.code-embed-12 {
  width: 100%;
  height: 100%;
  position: relative;
}

.section-19 {
  flex-flow: row;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: auto;
  min-height: 100vh;
  padding: 2rem;
  display: flex;
}

.code-embed-13 {
  width: 100%;
  height: 100%;
  margin: 0;
  display: none;
}

.code-embed-14 {
  cursor: pointer;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  max-width: 960px;
  height: auto;
  margin: 0;
  display: block;
}

.hintbox {
  grid-column-gap: 24px;
  grid-row-gap: 24px;
  justify-content: center;
  align-items: flex-start;
  width: 100%;
  height: auto;
  padding: 1rem;
  display: flex;
}

.hints {
  cursor: pointer;
  flex-flow: column;
  justify-content: center;
  align-items: flex-start;
  width: auto;
  height: 100%;
  padding: 1rem;
  font-family: norman-variable;
  display: flex;
}

.text-block-5 {
  text-align: center;
  cursor: pointer;
  margin-top: 2rem;
  font-family: norman-variable;
  font-size: 1.5rem;
  line-height: 100%;
}

.across {
  cursor: pointer;
  font-family: Instrument Serif, sans-serif;
  font-size: 1.5rem;
  line-height: 120%;
}

.text-block-7 {
  font-family: Instrument Serif, sans-serif;
  font-size: 1.5rem;
  line-height: 120%;
}

.heading-4 {
  font-family: norman-variable;
}

.heading-5, .heading-6 {
  margin-left: auto;
  margin-right: auto;
}

.section-20 {
  cursor: pointer;
  background-color: #000;
  justify-content: center;
  align-items: center;
  width: 100%;
  min-height: 100vh;
  padding: 1rem;
  display: flex;
}

.code-embed-15 {
  cursor: pointer;
  background-color: #0000;
  width: 100%;
  height: 100%;
}

.down {
  cursor: pointer;
  font-family: Instrument Serif, sans-serif;
  font-size: 1.5rem;
  line-height: 120%;
}

.div-block-20 {
  flex-flow: column;
  display: flex;
}

.div-block-21 {
  flex-flow: column;
  align-items: center;
  width: 100%;
  max-width: 720px;
  display: flex;
}

.section-21 {
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.section-22 {
  z-index: 2;
  background-color: #00000080;
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  width: 100vw;
  height: auto;
  min-height: 100vh;
  padding: 1rem;
  display: flex;
  position: relative;
}

.code-embed-16 {
  width: 100%;
  height: 100%;
  font-family: Spacegrotesk Variablefont Wght, sans-serif;
}

.div-block-22 {
  border: 1px solid #fffaf1;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  margin-bottom: 1rem;
  padding: 12px;
  display: flex;
  position: relative;
  overflow: hidden;
}

.lum-on-heading {
  z-index: 3;
  color: #ffcf55;
  cursor: pointer;
  -webkit-user-select: none;
  user-select: none;
  margin: 0;
  font-family: Spacegrotesk Variablefont Wght, sans-serif;
  font-size: 2rem;
  line-height: 100%;
  position: relative;
}

.background-video {
  z-index: 0;
  width: 100%;
  height: 100%;
  position: fixed;
  inset: 0%;
}

.terminalmeter {
  filter: blur();
  background-color: #fff;
  width: 100%;
  height: 100%;
  transition: transform .3s;
  position: absolute;
  inset: 0% auto 0% 0%;
  transform: translate(-100%);
  box-shadow: -5px 0 10px 5px #fff;
}

.terminalbootscreen {
  z-index: 9999;
  width: 100vw;
  height: 100vh;
  color: var(--bootscreen-orange);
  white-space: pre;
  background-color: #000;
  justify-content: flex-start;
  align-items: flex-start;
  padding: 1rem;
  font-family: Workbench, sans-serif;
  line-height: 140%;
  display: flex;
  position: fixed;
  inset: 0%;
}

.terminalbootscreentext {
  color: var(--bootscreen-orange);
  text-shadow: 1px 1px 8px #ffbb4ee6;
  cursor: pointer;
  -webkit-user-select: none;
  user-select: none;
  font-size: 1.3rem;
  line-height: 160%;
}

.bootscreentextinput {
  border: 1px solid var(--bootscreen-orange);
  color: var(--bootscreen-orange);
  cursor: pointer;
  align-self: flex-end;
  padding: 8px;
  font-size: 1rem;
  display: flex;
  position: absolute;
  inset: 0;
}

.div-block-24 {
  position: absolute;
}

.text-field, .bootscreeninput {
  color: var(--bootscreen-orange);
  background-color: #0000;
  border: 0 solid #000;
  margin: 0;
  font-size: 1rem;
  line-height: 100%;
}

.code-embed-17 {
  width: 100%;
  height: auto;
  color: var(--bootscreen-orange);
  background-color: #0000;
  padding-left: 0;
  line-height: 160%;
  display: flex;
  position: relative;
}

.julysection {
  background-color: #000;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
  overflow: hidden;
}

.code-embed-18 {
  z-index: 1;
  background-color: #00000040;
  width: 100%;
  max-width: none;
  height: 100%;
  position: relative;
}

.div-block-25 {
  z-index: 2;
  background-color: #fff;
  width: 100%;
  padding: 1.25rem;
  position: fixed;
  inset: 0% 0% auto;
}

.marquee-container {
  z-index: 5;
  background-color: #fff;
  padding: 0 8px;
  position: fixed;
  inset: 0% 0% auto;
  box-shadow: 0 4px 12px 4px #0003;
}

.code-embed-19 {
  text-align: center;
  border-left: 2px #000;
  flex-flow: row;
  justify-content: center;
  align-items: center;
  height: 100%;
  padding-top: 4px;
  padding-bottom: 4px;
  font-family: bourbon, sans-serif;
  font-size: 1rem;
  line-height: 120%;
  display: flex;
  position: relative;
}

.bottom-marquee {
  z-index: 5;
  background-color: #fff;
  flex-flow: row;
  align-items: center;
  padding: 0 4px;
  display: flex;
  position: fixed;
  inset: auto 0% 0%;
  box-shadow: 0 -4px 12px 4px #0003;
}

.contentinfocontainer {
  z-index: 3;
  pointer-events: none;
  transform-origin: 0%;
  text-align: center;
  text-shadow: 0 1px 16px #0006;
  white-space: pre-wrap;
  background-color: #0006;
  background-image: none;
  background-repeat: repeat;
  background-size: auto;
  background-attachment: scroll;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  max-width: 100%;
  height: 100%;
  max-height: none;
  margin: auto;
  padding: 4rem 0;
  display: flex;
  position: absolute;
  inset: auto;
}

.heading-7 {
  color: #fff;
  text-align: center;
  margin: 0;
  font-family: gin, sans-serif;
  font-size: 2.4rem;
  font-weight: 700;
  line-height: 100%;
}

.heading-8 {
  color: #000;
  text-align: center;
  overflow-wrap: anywhere;
  cursor: pointer;
  margin: 0;
  font-family: colt, sans-serif;
  font-size: 4rem;
  font-weight: 700;
  line-height: 140%;
}

.ctatext {
  color: #fff;
  text-shadow: 0 4px 4px #000000a8;
  font-family: bourbon, sans-serif;
  font-size: 1.5rem;
  line-height: 100%;
}

.ctatext.fade-in-text {
  text-shadow: 0 4px 8px #0006;
  font-family: bourbon, sans-serif;
}

.background-video-2 {
  z-index: 0;
  pointer-events: none;
  width: 100%;
  height: 100%;
  position: absolute;
  inset: 0%;
}

.happy4th {
  width: 96%;
  display: none;
}

.fade-in-text {
  color: #fff;
  margin-top: 0;
  margin-bottom: 16px;
  font-family: bourbon-rough, sans-serif;
  font-size: 2rem;
  line-height: 130%;
  position: relative;
}

.fade-in-text.fireworks-cta {
  margin-top: 12px;
  margin-bottom: 12px;
  font-size: 1.5rem;
}

.fade-in-text.cta-tagline {
  max-width: 360px;
  margin-bottom: 0;
}

.fade-in-text.dividingtext {
  font-size: 1rem;
}

.heading-9 {
  color: #fff;
  margin: 0;
  font-family: hwt-american-outline, sans-serif;
  font-size: 4rem;
  line-height: 100%;
}

.heading-9.fade-in-text {
  white-space: normal;
  overflow-wrap: break-word;
  word-break: normal;
  background-color: #0000;
  border-top: 1px #000;
  border-bottom: 1px #000;
  width: 100%;
  padding-top: 16px;
  padding-bottom: 4px;
  font-family: hwt-american-shopworn, sans-serif;
  font-size: 8rem;
}

.heading-9.fade-in-text.headline-no-breaks {
  word-break: keep-all;
  width: auto;
  padding: 4px 0;
  font-family: hwt-american-shopworn, sans-serif;
  font-size: 5rem;
  line-height: 120%;
  position: static;
}

.text-block-8 {
  z-index: 12;
  pointer-events: none;
  white-space: nowrap;
  background-color: #0000;
  height: auto;
  padding: 0 8px;
  font-family: gin, sans-serif;
  font-size: 1rem;
  line-height: 130%;
  position: relative;
  inset: 0% auto 0% 0%;
}

.code-embed-19-copy {
  text-align: center;
  -webkit-user-select: none;
  user-select: none;
  border-left: 0 #000;
  flex-flow: row;
  justify-content: center;
  align-items: center;
  height: 100%;
  padding-top: 4px;
  padding-bottom: 4px;
  font-family: bourbon, sans-serif;
  font-size: 1rem;
  line-height: 140%;
  display: flex;
}

.div-block-26 {
  z-index: 99;
  background-color: #fff;
  border-right: 2px solid #000;
  flex-flow: row;
  justify-content: center;
  align-self: center;
  align-items: center;
  height: 100%;
  padding: 0;
  display: flex;
  position: absolute;
  inset: 0% auto 0% 0%;
}

.catalog-text-container {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  display: flex;
  position: relative;
}

.july4subhead {
  color: #fff;
  margin: 0;
  font-family: hwt-american-outline, sans-serif;
  font-size: 4rem;
  line-height: 100%;
}

.july4subhead.fade-in-text {
  white-space: normal;
  overflow-wrap: break-word;
  word-break: normal;
  background-color: #0000;
  border-top: 1px #000;
  border-bottom: 1px #000;
  width: 100%;
  padding-top: 16px;
  padding-bottom: 4px;
  font-family: hwt-american-shopworn, sans-serif;
  font-size: 8rem;
}

.july4subhead.fade-in-text.headline-no-breaks {
  word-break: keep-all;
  width: auto;
  padding: 4px 0;
  font-family: hwt-american-shopworn, sans-serif;
  font-size: 3rem;
  line-height: 100%;
  position: static;
}

.divider {
  border: 2px solid #fff;
  width: 128px;
  margin-top: 0;
  margin-bottom: 12px;
}

.divider.fade-in-text {
  border-style: none;
}

.section-23 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-20 {
  width: 100%;
  height: 100%;
}

.textoverlay {
  z-index: 9999;
  -webkit-user-select: none;
  user-select: none;
  position: fixed;
  inset: 18px auto auto 18px;
}

.grammy-gsap-heading {
  color: #fff;
  text-align: left;
  margin: 0;
  font-family: Unbounded, sans-serif;
  font-size: 5rem;
  line-height: 100%;
}

.grammy-descriptions {
  z-index: 9999;
  color: #fff;
  -webkit-user-select: none;
  user-select: none;
  max-width: 360px;
  position: fixed;
  inset: auto auto 18px 18px;
}

.grammydescription {
  color: #fff;
  font-family: Instrument Serif, sans-serif;
  font-size: 1.25rem;
  font-weight: 400;
  line-height: 140%;
}

.section-24 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-21 {
  width: 100%;
  height: 100%;
}

.section-25 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-22 {
  width: 100%;
  height: 100%;
}

.dragonballlsection, .section-26 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-23 {
  width: 100%;
  height: 100%;
}

.section-27 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-24 {
  width: 100%;
  height: 100%;
}

.section-28 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-25 {
  width: 100%;
  height: 100%;
}

.section-29 {
  color: #fff;
  text-align: center;
  background-color: #000;
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  width: 100vw;
  height: 100vh;
  padding: 1rem;
  display: flex;
}

.code-embed-26 {
  width: 100%;
  max-width: 960px;
}

.section-30 {
  background-color: #000;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-27 {
  width: 100%;
  height: 100%;
}

.section-31 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
  position: fixed;
  inset: 0%;
}

.code-embed-28 {
  width: 100%;
  height: 100%;
}

.section-32 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: none;
}

.code-embed-29 {
  width: 100%;
  height: 100%;
}

.about-text {
  text-align: left;
  max-width: 48ch;
  font-family: Instrument Serif, sans-serif;
  font-size: 1.75rem;
  line-height: 130%;
}

.worksinprogress-section {
  z-index: 1;
  background-color: #000;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  height: 100vh;
  min-height: 100svh;
  padding: 1rem;
  display: flex;
  position: relative;
}

.noordzij-cube-embed {
  z-index: 0;
  color: #fff;
  mix-blend-mode: normal;
  background-color: #0000;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  margin: 0;
  display: flex;
  position: relative;
}

.noordzij-overlay-text {
  justify-content: center;
  align-items: center;
  padding: 1rem;
  display: flex;
  position: absolute;
  inset: 1rem;
}

.text-block-9 {
  color: #fff;
  text-align: left;
  margin-bottom: auto;
  margin-right: auto;
  font-family: Spacegrotesk Variablefont Wght, sans-serif;
  font-size: 2rem;
  font-weight: 700;
  line-height: 100%;
}

.text-block-9-copy {
  color: #fff;
  text-align: right;
  margin-top: auto;
  font-family: Spacegrotesk Variablefont Wght, sans-serif;
  font-size: 2rem;
  font-weight: 700;
  line-height: 100%;
}

.fluid-heading-2 {
  z-index: 100;
  color: #000;
  text-align: center;
  -webkit-text-stroke-width: 1px;
  -webkit-text-stroke-color: white;
  -webkit-text-fill-color: inherit;
  mix-blend-mode: difference;
  background-clip: border-box;
  border: 0 solid #000;
  margin: auto;
  font-family: Spacegrotesk Variablefont Wght, sans-serif;
  font-size: clamp(2rem, 1.304rem + 3.478vw, 4rem);
  font-weight: 700;
  line-height: 100%;
  position: absolute;
  inset: auto;
}

.text-block-9-copy-copy {
  color: #fff;
  text-align: right;
  margin-top: auto;
  font-family: Spacegrotesk Variablefont Wght, sans-serif;
  font-size: 2rem;
  font-weight: 700;
  line-height: 100%;
}

.ascii-heading {
  z-index: auto;
  color: #fff;
  text-align: left;
  letter-spacing: 0;
  -webkit-text-stroke-width: .25px;
  -webkit-text-stroke-color: black;
  width: 720px;
  max-width: none;
  height: auto;
  text-shadow: none;
  word-break: normal;
  -webkit-text-fill-color: inherit;
  mix-blend-mode: normal;
  background-color: #0000;
  background-clip: border-box;
  justify-content: center;
  align-items: center;
  margin: 0;
  font-family: Source Code Pro, sans-serif;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 80%;
  display: flex;
  position: relative;
  inset: 0%;
}

.main-subtext {
  color: #fff;
  text-align: center;
  -webkit-text-stroke-width: 0px;
  width: 100%;
  max-width: 360px;
  text-shadow: none;
  margin-top: 15vh;
  margin-left: auto;
  margin-right: auto;
  font-family: Wavefont Variablefont Rond Yela Wght, Arial, sans-serif;
  font-size: 1rem;
  font-weight: 900;
  line-height: 100%;
  overflow: hidden;
}

.code-embed-31 {
  opacity: 1;
  width: 100%;
  max-width: 600px;
  margin: 2rem auto 0;
}

.circlecopy {
  z-index: 3;
  pointer-events: auto;
  width: 25vw;
  height: 25vw;
  animation: 8s linear infinite rotate;
  position: absolute;
}

.work-section {
  z-index: 1;
  background-color: #0000;
  background-image: radial-gradient(circle, #000, #1b3836);
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  min-height: 100svh;
  padding: 0;
  display: flex;
  position: relative;
  overflow: visible;
}

.work-section.section-load-reducer {
  background-color: #0000;
  background-image: radial-gradient(circle, #000, #1b3836);
}

.virtualgrid {
  grid-column-gap: 0px;
  grid-row-gap: 0px;
  perspective: none;
  width: 100%;
  height: 50%;
  transform-style: preserve-3d;
  border: 1px solid #fff;
  flex-flow: column;
  grid-template-rows: auto auto auto auto auto auto auto auto auto auto auto auto;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  place-content: stretch flex-start;
  place-items: center stretch;
  display: flex;
  position: absolute;
  inset: auto 0% 0%;
  overflow: hidden;
  transform: perspective(25vh)rotateX(45deg)rotateY(0)rotateZ(0);
}

.virtualgrid.virtualgrid-top {
  perspective: none;
  transform-origin: 50% 0;
  width: 100vw;
  height: 55vh;
  transform-style: preserve-3d;
  border-style: none;
  display: none;
  inset: 0% 0% auto;
  transform: perspective(100vh)rotateX(-45deg)rotateY(0)rotateZ(0);
}

.virtualgrid.virtualgrid-right {
  backface-visibility: visible;
  perspective: none;
  transform-origin: 100%;
  width: 50vw;
  height: 100vh;
  transform-style: preserve-3d;
  border-style: none;
  justify-content: center;
  align-items: flex-end;
  display: none;
  inset: auto 0% auto auto;
  transform: perspective(25vw)rotateX(0)rotateY(-45deg)rotateZ(0);
}

.virtualgrid.virtualgrid-left {
  perspective: none;
  transform-origin: 0%;
  width: 50vw;
  height: 100vh;
  transform-style: preserve-3d;
  border-style: none;
  justify-content: center;
  align-items: flex-start;
  display: none;
  inset: auto auto auto 0%;
  transform: perspective(25vw)rotateX(0)rotateY(45deg)rotateZ(0);
}

.virtualgrid.virtualgrid-bottom {
  outline-offset: 0px;
  transform-origin: 50% 100%;
  width: 100vw;
  height: 55vh;
  transform-style: preserve-3d;
  border-style: none;
  outline: 3px #333;
  display: none;
  transform: perspective(100vh)rotateX(45deg)rotateY(0)rotateZ(0);
}

.virtualrow {
  border: .5px #fff;
  justify-content: center;
  align-items: flex-start;
  width: 200%;
  height: 5vh;
  display: flex;
  position: relative;
  transform: translate(0%);
}

.virtualrow.virtualrow-left {
  width: 100%;
  height: 100vh;
  display: flex;
  transform: translate(0%);
}

.virtualrow.virtualrow-bottom {
  display: flex;
}

.virtualrow.virtualrow-right {
  width: 100%;
  height: 100vh;
  display: flex;
  transform: translate(5%);
}

.virtualrow.virtualrow-top {
  display: flex;
  transform: translate(0%);
}

.virtualcell {
  outline-offset: 0px;
  background-color: #0000;
  border: .1px solid #fff;
  outline: 3px dotted #0000;
  width: 5%;
  height: 100%;
}

.vr-grid-embed {
  z-index: 1;
  background-color: #0000;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
  position: absolute;
  inset: 0%;
}

.work-samples-container {
  z-index: 3;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  padding: 4rem 2rem;
  display: flex;
  position: absolute;
  inset: 0%;
  overflow: hidden;
}

.heading-10 {
  color: #fff;
  margin: 0 0 auto;
  font-family: Spacegrotesk Variablefont Wght, sans-serif;
  font-size: 2rem;
  line-height: 100%;
  position: relative;
}

.text-block-10 {
  color: #fff;
  text-align: center;
  margin-top: auto;
  font-family: Spacegrotesk Variablefont Wght, sans-serif;
  position: relative;
}

.work-samples-carousel {
  grid-column-gap: 12px;
  grid-row-gap: 12px;
  flex: 0 auto;
  grid-template-rows: 33% 33% 33%;
  grid-template-columns: .25fr .25fr .25fr;
  grid-auto-columns: 1fr;
  grid-auto-flow: row;
  place-content: center;
  align-self: center;
  place-items: center;
  width: 100%;
  height: auto;
  margin: auto;
  padding: 0;
  display: flex;
  position: relative;
}

.image-5 {
  aspect-ratio: 1;
  vertical-align: baseline;
  object-fit: fill;
  width: 512px;
  max-width: 512px;
  height: 100%;
  margin: 0;
  display: none;
  overflow: clip;
}

.blackhole-section {
  z-index: 1;
  background-color: #000;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: auto;
  min-height: 100svh;
  padding: 0;
  display: flex;
  position: relative;
  overflow: visible;
}

.blackhole-script-embed {
  z-index: 3;
  position: absolute;
  inset: 0%;
}

.heading-11 {
  z-index: 4;
  position: relative;
}

.blackhole-text-content {
  z-index: 3;
  text-align: center;
  position: relative;
}

.blackhole-text-content.mask-target {
  z-index: 5;
}

.goodbye-text {
  color: #0f0;
  -webkit-user-select: none;
  user-select: none;
  font-family: Spacegrotesk Variablefont Wght, sans-serif;
  font-size: 2rem;
  line-height: 140%;
}

.text-block-11 {
  color: #0f0;
  -webkit-user-select: none;
  user-select: none;
  font-family: Instrument Serif, sans-serif;
  font-size: 1rem;
  line-height: 140%;
}

.mask-layer {
  z-index: 4;
  justify-content: center;
  align-items: center;
  display: flex;
  position: absolute;
  inset: 0%;
}

.link-4 {
  color: #0f0;
}

.spline-scene {
  aspect-ratio: 1;
  width: 512px;
  height: auto;
  padding: 0;
  display: block;
  position: relative;
}

.div-block-27 {
  position: relative;
}

.pill-container {
  z-index: 5;
  mix-blend-mode: normal;
  justify-content: center;
  align-items: center;
  width: 50%;
  max-width: 360px;
  height: 64px;
  padding: 0 1rem;
  display: flex;
  position: absolute;
  inset: 2rem auto auto;
}

.red-pill {
  color: #fff;
  text-align: center;
  background-color: red;
  border-radius: 48px;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  max-width: none;
  height: 100%;
  font-family: Instrument Serif, sans-serif;
  display: flex;
  position: absolute;
  left: 0;
  transform: rotate(0)translate(0);
  box-shadow: inset 0 8px 20px 2px #f5ddddcc, inset 0 -8px 12px 16px #36090954;
}

.div-block-29 {
  position: absolute;
}

.pillblock {
  box-sizing: content-box;
  outline-offset: 0px;
  -webkit-user-select: none;
  user-select: none;
  border: .5px solid #5e4848;
  border-color: #5e4848 #2a2670 #351b1b #7c5959;
  border-radius: 48px;
  outline: 3px #333;
  flex-flow: row;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  transition-property: all;
  transition-duration: .2s;
  transition-timing-function: ease;
  display: flex;
  position: relative;
  overflow: hidden;
  box-shadow: 0 0 20px #0003, 0 10px 14px 3px #615a5a80;
}

.pillblock:hover {
  transform: translate(0, -16px);
  box-shadow: 0 36px 18px 3px #0000004d, 0 10px 14px 3px #615a5a80;
}

.bluepill {
  position: absolute;
}

.redpill-copy {
  background-color: red;
  border-radius: 48px;
  width: 100%;
  max-width: none;
  height: 100%;
}

.blue-pill {
  outline-offset: 0px;
  transform-origin: 100%;
  color: #fff;
  text-align: center;
  background-color: #00f;
  border: 3px #000;
  border-radius: 0 48px 48px 0;
  outline: 3px #333;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  max-width: none;
  height: 100%;
  font-family: Instrument Serif, sans-serif;
  display: flex;
  position: absolute;
  right: 0%;
  transform: translate(50%);
  box-shadow: inset -12px 12px 20px -8px #dcdbe2, inset -24px -8px 12px 16px #00000054;
}

.pill-text {
  z-index: 5;
  opacity: 0;
  pointer-events: none;
  color: #fff;
  text-align: center;
  font-family: Instrument Serif, sans-serif;
  font-size: 12px;
  line-height: 100%;
  position: absolute;
}

.div-block-30 {
  z-index: 6;
  color: #fff;
  text-align: center;
  justify-content: center;
  align-items: center;
  width: 100%;
  min-width: 0;
  max-width: 240px;
  height: 1rem;
  font-family: Instrument Serif, sans-serif;
  transition: all .2s;
  display: flex;
  position: relative;
  overflow: hidden;
}

.redpill-text {
  z-index: 6;
  white-space: nowrap;
  width: auto;
  height: 1rem;
  font-size: 1rem;
  line-height: 100%;
  position: absolute;
  inset: 0%;
  transform: translate(-100%);
}

.bluepill-text {
  z-index: 6;
  white-space: nowrap;
  width: auto;
  height: 1rem;
  font-size: 1rem;
  line-height: 100%;
  position: absolute;
  inset: 0%;
  transform: translate(100%);
}

.centerpill-text {
  z-index: 6;
  white-space: nowrap;
  overflow-wrap: normal;
  width: 100%;
  height: 1rem;
  font-size: 1rem;
  line-height: 100%;
  position: absolute;
  inset: 0%;
  transform: translate(0%);
}

.section-33 {
  background-color: red;
  width: 100vw;
  height: 100vh;
  position: relative;
}

.code-embed-32 {
  width: 100%;
  height: 100%;
}

.code-embed-33 {
  width: 100%;
  height: 100%;
  position: absolute;
}

.fraction-scroll {
  z-index: 99;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 36px;
  height: 33%;
  margin-top: auto;
  margin-bottom: auto;
  padding: 12px 24px;
  display: flex;
  position: fixed;
  inset: 0% auto 0% 0;
}

.denominator {
  color: #fff;
  text-align: center;
  padding: 2px;
  font-family: Space Mono, sans-serif;
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1;
  text-decoration: none;
  transition: all .2s;
  position: absolute;
}

.numerators {
  -webkit-user-select: none;
  user-select: none;
  justify-content: center;
  align-items: center;
  width: 1rem;
  height: 2rem;
  transition-property: all;
  transition-duration: .2s;
  transition-timing-function: ease;
  display: flex;
  position: relative;
  overflow: hidden;
}

.numbers-divider {
  background-color: #fff;
  justify-content: flex-end;
  align-items: center;
  width: 100%;
  height: 2px;
  margin-top: 6px;
  margin-bottom: 6px;
  display: flex;
  position: relative;
  transform: skew(0deg, -20deg);
}

.numerator {
  color: #fff;
  text-align: center;
  padding-top: 2px;
  padding-bottom: 2px;
  font-family: Space Mono, sans-serif;
  font-size: 1.25rem;
  font-weight: 700;
  line-height: 1;
  position: absolute;
  transform: translate(0);
}

.numerator.numerator-2 {
  padding: 2px;
  transition: all .2s;
  transform: translate(0, 100%);
}

.numerator.numerator-1 {
  padding-left: 2px;
  padding-right: 2px;
  transition: all .2s;
}

.numerator.numerator-3 {
  padding: 2px;
  transition: all .2s;
  transform: translate(0, 200%);
}

.numerator.numerator-4 {
  padding: 2px;
  transition: all .2s;
  transform: translate(0, 300%);
}

.numerator.numerator-5 {
  padding: 2px;
  transition: all .2s;
  transform: translate(0, 400%);
}

.page-progress {
  z-index: 98;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 50px;
  height: auto;
  margin-top: auto;
  margin-bottom: auto;
  padding: 12px;
  display: none;
  position: fixed;
  inset: 0% 0% 0% auto;
}

.page-numbers-scale {
  perspective: none;
  perspective-origin: 100%;
  transform-origin: 100%;
  color: #fff;
  text-align: right;
  text-shadow: 2px 3px 6px #000c;
  font-family: Space Mono, sans-serif;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.4;
  text-decoration: none;
  transition: all .2s;
  transform: scale(1);
}

.page-numbers-scale.w--current {
  text-align: right;
  width: 1rem;
}

.page-numbers-scale-wrapper {
  perspective: 2000px;
  flex-flow: column;
  justify-content: center;
  align-items: flex-end;
  margin-top: 0;
  display: flex;
}

.text-block-13 {
  color: #fff;
  text-align: right;
  letter-spacing: 0;
  text-shadow: 6px -4px 6px #000c;
  margin-top: 8px;
  margin-bottom: 8px;
  font-family: Space Mono, sans-serif;
  font-size: 16px;
  font-weight: 400;
  line-height: 1.4;
}

.denominators {
  justify-content: center;
  align-items: center;
  width: 1rem;
  height: 2rem;
  transition: all .2s;
  display: flex;
  position: relative;
  overflow: hidden;
}

.page-arrow-up {
  color: #fff;
  text-align: center;
  cursor: pointer;
  font-family: Space Mono, sans-serif;
  font-size: 20px;
  font-weight: 400;
  line-height: 140%;
}

.div-block-31 {
  margin-top: 12px;
  margin-bottom: 12px;
}

.page-arrow-down {
  color: #fff;
  text-align: center;
  cursor: pointer;
  font-family: Space Mono, sans-serif;
  font-size: 20px;
  line-height: 140%;
}

.text-span-2 {
  font-size: 2.5rem;
  font-weight: 400;
}

.div-block-32 {
  flex-flow: column;
  display: flex;
  position: relative;
}

.scroll-indicator {
  z-index: 99;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 36px;
  height: 30%;
  margin-top: auto;
  margin-bottom: auto;
  padding: 12px 24px;
  display: flex;
  position: fixed;
  inset: 0% 0 0% auto;
}

.scroll-indicator-dots {
  grid-column-gap: 4px;
  grid-row-gap: 4px;
  flex-flow: column;
  flex: 0 auto;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 200px;
  padding: 16px;
  display: flex;
}

.scroll-indicator-dot {
  background-color: #fff;
  border-radius: 0;
  flex: 0 auto;
  justify-content: center;
  align-items: center;
  width: 3px;
  height: 20%;
  display: flex;
}

.headline-lens-wrapper {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  height: 18vh;
  line-height: 12rem;
  display: flex;
  position: relative;
  overflow: hidden;
}

.headline-lens-wrapper.outermost {
  height: 5vh;
  margin-top: 1vh;
  margin-bottom: 1vh;
  overflow: hidden;
}

.headline-lens-wrapper.midmost {
  justify-content: center;
  align-items: center;
  height: 10vh;
  margin-top: 1vh;
  margin-bottom: 1vh;
  overflow: hidden;
}

.section-34 {
  background-color: #000;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.type-displacement-grid {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  flex: none;
  grid-template-rows: .25fr .5fr .75fr 1.5fr .75fr .5fr .25fr;
  grid-template-columns: 1fr;
  grid-auto-columns: 1fr;
  place-content: center;
  width: 100%;
  height: 39vh;
  padding-top: 1rem;
  padding-bottom: 1rem;
  display: grid;
  position: relative;
}

.text-block-14 {
  color: #000;
  text-align: center;
  font-family: Oswald, sans-serif;
  font-size: 200px;
  font-weight: 500;
  line-height: 1;
  position: absolute;
}

.div-block-33 {
  background-color: #0000;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  transition: opacity .2s;
  display: flex;
  position: relative;
  overflow: hidden;
}

.main-text-displacement {
  color: #fff;
  text-align: center;
  letter-spacing: -6px;
  -webkit-text-fill-color: inherit;
  -webkit-user-select: none;
  user-select: none;
  cursor: pointer;
  background-clip: border-box;
  font-family: Instrument Sans, sans-serif;
  font-size: 8rem;
  font-weight: 700;
  line-height: 1;
  transition-property: all;
  transition-duration: .3s;
  transition-timing-function: ease;
  position: absolute;
  transform: scale(1);
}

.main-text-displacement:hover {
  transform: scale(1);
}

.row-displacement-text {
  background-color: #0000;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  transition: opacity .2s;
  display: flex;
  position: relative;
  overflow: hidden;
}

.type-displacement-grid-2 {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  flex: none;
  grid-template-rows: .25fr .5fr .75fr 1.5fr .75fr .5fr .25fr;
  grid-template-columns: 1fr;
  grid-auto-columns: 1fr;
  width: 100%;
  height: 42%;
  padding-top: 1rem;
  padding-bottom: 1rem;
  display: grid;
  position: relative;
  overflow: hidden;
}

.type-displacement-grid-horizontal {
  grid-column-gap: 6px;
  grid-row-gap: 6px;
  background-color: #000;
  flex: none;
  grid-template-rows: auto;
  grid-template-columns: 10fr 8fr 6fr 4fr 2fr 1fr .5fr .25fr;
  grid-auto-columns: 1fr;
  grid-auto-flow: column;
  width: 64%;
  height: auto;
  padding-top: 1rem;
  padding-bottom: 1rem;
  display: grid;
  position: relative;
}

.grid-displacement-horizontal-row {
  background-color: #0000;
  flex-flow: row;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  height: 100%;
  transition: opacity .2s;
  display: block;
  position: relative;
  overflow: hidden;
}

.main-text-displacement-horizontal {
  transform-origin: 0%;
  color: #fff;
  text-align: left;
  letter-spacing: 0;
  -webkit-text-fill-color: inherit;
  -webkit-user-select: none;
  user-select: none;
  cursor: pointer;
  background-clip: border-box;
  flex: 0 auto;
  align-self: auto;
  font-family: DM Mono, sans-serif;
  font-size: 3.75rem;
  font-weight: 700;
  line-height: 1;
  transition-property: all;
  transition-duration: .3s;
  transition-timing-function: ease;
  position: relative;
  transform: scale(1);
}

.main-text-displacement-horizontal:hover {
  transform: translate(0%)scale(1);
}

.multi-axis-grid-displacement {
  grid-column-gap: 6px;
  grid-row-gap: 6px;
  background-color: #000;
  flex: none;
  grid-template-rows: 1fr 2fr 3fr 4fr 3fr 2fr 1fr;
  grid-template-columns: 1fr 2fr 3fr 4fr 3fr 2fr 1fr;
  grid-auto-columns: 1fr;
  grid-auto-flow: column;
  width: 100%;
  height: 35rem;
  padding-top: 1rem;
  padding-bottom: 1rem;
  display: grid;
  position: relative;
}

.multi-grid-displacer-wrapper {
  background-color: #0000;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  transition: opacity .2s;
  display: flex;
  position: relative;
  overflow: hidden;
}

.multi-axis-displacement-text {
  transform-origin: 0%;
  color: #fff;
  text-align: left;
  letter-spacing: 0;
  -webkit-text-fill-color: inherit;
  -webkit-user-select: none;
  user-select: none;
  cursor: pointer;
  background-clip: border-box;
  flex: 0 auto;
  align-self: auto;
  font-family: DM Mono, sans-serif;
  font-size: 10rem;
  font-weight: 700;
  line-height: 1;
  transition-property: all;
  transition-duration: .3s;
  transition-timing-function: ease;
  position: relative;
  transform: scale(1);
}

.multi-axis-displacement-text:hover {
  transform: translate(0%)scale(1);
}

.multi-axis-displacement-text-copy {
  transform-origin: 0%;
  color: #fff;
  text-align: left;
  letter-spacing: 0;
  -webkit-text-fill-color: inherit;
  -webkit-user-select: none;
  user-select: none;
  cursor: pointer;
  background-clip: border-box;
  flex: 0 auto;
  align-self: auto;
  font-family: DM Mono, sans-serif;
  font-size: 15rem;
  font-weight: 700;
  line-height: 1;
  transition-property: all;
  transition-duration: .3s;
  transition-timing-function: ease;
  position: relative;
  transform: scale(1);
}

.multi-axis-displacement-text-copy:hover {
  transform: translate(0%)scale(1);
}

.multi-axis-displacement-text-scale {
  transform-origin: 50%;
  color: #fff;
  text-align: center;
  letter-spacing: 0;
  -webkit-text-fill-color: inherit;
  -webkit-user-select: none;
  user-select: none;
  cursor: pointer;
  background-clip: border-box;
  flex: 0 auto;
  align-self: auto;
  font-family: Oswald, sans-serif;
  font-size: 6.4rem;
  font-weight: 700;
  line-height: 1;
  transition-property: all;
  transition-duration: .3s;
  transition-timing-function: ease;
  position: relative;
  transform: scale(1);
}

.multi-axis-displacement-text-scale:hover {
  transform: translate(0%)scale(1);
}

.multi-axis-grid-displacement-scale {
  grid-column-gap: 6px;
  grid-row-gap: 6px;
  background-color: #000;
  flex: none;
  grid-template-rows: 1fr 2fr 3fr 4fr 3fr 2fr 1fr;
  grid-template-columns: 1fr 2fr 3fr 4fr 3fr 2fr 1fr;
  grid-auto-columns: 1fr;
  grid-auto-flow: column;
  width: 70rem;
  height: 35rem;
  padding-top: 1rem;
  padding-bottom: 1rem;
  display: grid;
  position: relative;
}

.multi-grid-displacer-scale-wrapper {
  background-color: #0000;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  transition: opacity .2s;
  display: flex;
  position: relative;
  overflow: hidden;
}

.heading-12 {
  color: #fff;
  font-family: deuterium-variable, sans-serif;
  font-size: 2rem;
  line-height: 1.2;
}

.side-grid {
  grid-column-gap: 12px;
  grid-row-gap: 12px;
  background-color: #000;
  flex-flow: row;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.multi-axis-x {
  grid-column-gap: 12px;
  grid-row-gap: 12px;
  background-color: #000;
  flex: none;
  grid-template-rows: .25fr 1fr .25fr;
  grid-template-columns: .25fr 1fr .25fr;
  grid-auto-columns: 1fr;
  grid-auto-flow: column;
  place-content: center;
  align-self: auto;
  place-items: center;
  width: 20rem;
  height: 20rem;
  padding-top: 1rem;
  padding-bottom: 1rem;
  display: grid;
  position: relative;
  overflow: hidden;
}

.multi-grid-text-x {
  transform-origin: 50%;
  color: #fff;
  text-align: center;
  letter-spacing: 0;
  -webkit-text-fill-color: inherit;
  -webkit-user-select: none;
  user-select: none;
  cursor: pointer;
  background-clip: border-box;
  flex: 0 auto;
  align-self: auto;
  font-family: Instrument Sans, sans-serif;
  font-size: 9rem;
  font-weight: 700;
  line-height: 1;
  transition-property: all;
  transition-duration: .3s;
  transition-timing-function: ease;
  position: relative;
  overflow: hidden;
  transform: scale(1);
}

.multi-grid-text-x:hover {
  transform: translate(0%)scale(1);
}

.multi-grid-x-wrapper {
  box-sizing: border-box;
  text-align: center;
  overflow: hidden;
}

.multi-axis-y {
  grid-column-gap: 6px;
  grid-row-gap: 6px;
  background-color: #000;
  flex: none;
  grid-template-rows: .25fr 2fr .25fr;
  grid-template-columns: .25fr 2fr .25fr;
  grid-auto-columns: 1fr;
  grid-auto-flow: column;
  place-content: center;
  place-items: center;
  width: 20rem;
  height: 20rem;
  padding-top: 1rem;
  padding-bottom: 1rem;
  display: grid;
  position: relative;
  overflow: hidden;
}

.multi-grid-y-wrapper {
  overflow: hidden;
}

.multi-grid-text-y {
  transform-origin: 50%;
  color: #fff;
  text-align: center;
  letter-spacing: 0;
  -webkit-text-fill-color: inherit;
  -webkit-user-select: none;
  user-select: none;
  cursor: pointer;
  background-clip: border-box;
  flex: 0 auto;
  align-self: auto;
  font-family: Instrument Sans, sans-serif;
  font-size: 9rem;
  font-weight: 700;
  line-height: 1;
  transition-property: all;
  transition-duration: .3s;
  transition-timing-function: ease;
  position: relative;
  transform: scale(1);
}

.multi-grid-text-y:hover {
  transform: translate(0%)scale(1);
}

.multi-axis-z {
  grid-column-gap: 6px;
  grid-row-gap: 6px;
  background-color: #000;
  flex: none;
  grid-template-rows: .5fr 1fr .5fr;
  grid-template-columns: .5fr 1fr .5fr;
  grid-auto-columns: 1fr;
  grid-auto-flow: column;
  place-content: center;
  place-items: center;
  width: 20rem;
  height: 20rem;
  padding-top: 1rem;
  padding-bottom: 1rem;
  display: grid;
  position: relative;
  overflow: hidden;
}

.multi-grid-z-wrapper {
  overflow: hidden;
}

.multi-grid-text-z {
  transform-origin: 50%;
  color: #fff;
  text-align: center;
  letter-spacing: 0;
  -webkit-text-fill-color: inherit;
  -webkit-user-select: none;
  user-select: none;
  cursor: pointer;
  background-clip: border-box;
  flex: 0 auto;
  align-self: auto;
  font-family: Instrument Sans, sans-serif;
  font-size: 9rem;
  font-weight: 700;
  line-height: 1;
  transition-property: all;
  transition-duration: .3s;
  transition-timing-function: ease;
  position: relative;
  transform: scale(1);
}

.multi-grid-text-z:hover {
  transform: translate(0%)scale(1);
}

.section-34-copy {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  background-color: #000;
  flex-flow: row;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.lens-grid-2 {
  background-color: #0000;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  transition: opacity .2s;
  display: flex;
  position: relative;
  overflow: hidden;
}

.type-displacement-grid-3 {
  grid-column-gap: 8px;
  grid-row-gap: 8px;
  flex: none;
  grid-template-rows: minmax(1rem, .25fr) minmax(1rem, .75fr) minmax(1rem, 1.5fr) minmax(1rem, 3fr) minmax(1rem, 1.5fr) minmax(1rem, .75fr) minmax(1rem, .25fr);
  grid-template-columns: 1fr;
  grid-auto-columns: 1fr;
  place-content: center;
  width: 100%;
  height: 53vh;
  padding-top: 1rem;
  padding-bottom: 1rem;
  display: grid;
  position: relative;
}

.main-text-displacement-2 {
  color: #fff;
  text-align: center;
  letter-spacing: -6px;
  -webkit-text-fill-color: inherit;
  -webkit-user-select: none;
  user-select: none;
  cursor: pointer;
  background-clip: border-box;
  font-family: Instrument Sans, sans-serif;
  font-size: 10rem;
  font-weight: 700;
  line-height: 1;
  transition-property: all;
  transition-duration: .3s;
  transition-timing-function: ease;
  position: absolute;
  transform: scale(1);
}

.main-text-displacement-2:hover {
  transform: scale(1);
}

.main-text-displacement-copy {
  color: #fff;
  text-align: center;
  letter-spacing: -6px;
  -webkit-text-fill-color: inherit;
  -webkit-user-select: none;
  user-select: none;
  cursor: pointer;
  background-clip: border-box;
  font-family: Instrument Sans, sans-serif;
  font-size: 8.5rem;
  font-weight: 700;
  line-height: 1;
  transition-property: all;
  transition-duration: .3s;
  transition-timing-function: ease;
  position: absolute;
  transform: scale(1);
}

.main-text-displacement-copy:hover {
  transform: scale(1);
}

.main-text-displacement-copy.displacement-row-1 {
  font-size: 10rem;
  inset: 14.2857% 0% auto;
}

.main-text-displacement-copy.displacement-row-2 {
  font-size: 10rem;
  top: 28.5714px;
}

.main-text-displacement-copy.displacement-row-3 {
  font-size: 10rem;
  top: 42.8571px;
}

.main-text-displacement-copy.displacement-row-4 {
  font-size: 10rem;
}

.main-text-displacement-copy.displacement-row-5 {
  font-size: 10rem;
  inset: auto 0% 42.8571%;
}

.main-text-displacement-copy.displacement-row-6 {
  font-size: 10rem;
  bottom: 28.5714px;
}

.main-text-displacement-copy.displacement-row-7 {
  font-size: 10rem;
  inset: auto 0% 14.2857%;
}

.row-displacement-text-copy {
  background-color: #0000;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  transition: opacity .2s;
  display: flex;
  position: relative;
  overflow: hidden;
}

.heading-13 {
  color: #0f0;
  white-space: break-spaces;
  word-break: normal;
  -webkit-user-select: none;
  user-select: none;
  width: auto;
  max-width: 48ch;
  margin: 12px 0;
  font-family: deuterium-variable, sans-serif;
  font-size: clamp(3rem, 6vw, 128px);
  font-weight: 700;
  line-height: 1;
}

.text-span-3 {
  font-family: Instrument Serif, sans-serif;
  font-style: italic;
}

.email-link {
  color: #0f0;
  font-style: normal;
  text-decoration: underline;
}

.email-link:hover {
  font-style: normal;
  text-decoration: none;
}

.section-35 {
  background-color: #000;
  width: 100dvw;
  height: 100dvh;
  min-height: 0;
  padding: 24px;
}

.text-grid-container {
  grid-column-gap: 6px;
  grid-row-gap: 6px;
  background-color: #000;
  grid-template-rows: 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
  grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
  grid-auto-columns: 1fr;
  width: 100%;
  height: 100%;
  display: grid;
  position: relative;
  overflow: hidden;
}

.grid-cell-item {
  background-color: #00f;
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  width: 100%;
  height: 100%;
  display: flex;
  position: relative;
  overflow: hidden;
}

.div-block-34 {
  background-color: #00f;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100dvw;
  height: 100dvh;
  display: flex;
  position: absolute;
  inset: 0;
  overflow: visible;
}

.centered-distorted-element {
  z-index: 2;
  perspective-origin: 50%;
  color: #fff;
  text-align: center;
  width: 100%;
  height: 100%;
  font-size: 48rem;
  line-height: 1;
  position: relative;
  inset: auto;
  overflow: visible;
}

.div-block-35 {
  width: 100dvw;
  height: 100dvh;
  position: relative;
  inset: 0%;
  overflow: hidden;
}

.div-block-36 {
  width: 100%;
  height: 100%;
  position: relative;
  inset: 0%;
}

.letter-wrapper {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100dvw;
  height: 100dvh;
  display: flex;
  position: relative;
  inset: 0%;
  overflow: hidden;
}

.moving-mask-element {
  background-color: green;
  background-image: url('../images/space-test.jpg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: cover;
  background-attachment: fixed;
  width: 100dvw;
  height: 100dvh;
  position: absolute;
  inset: 0%;
}

.text-block-15 {
  z-index: 99;
  color: #fff;
  text-align: center;
  inset: 0%;
  flex-flow: column;
  justify-content: center;
  align-self: center;
  align-items: center;
  margin: auto;
  font-family: DM Sans, sans-serif;
  font-size: 40rem;
  font-weight: 500;
  line-height: 1;
  display: flex;
  position: relative;
  inset: 0;
}

.window-pane {
  inset: 0%;
  background-color: #fff;
  flex-flow: column;
  justify-content: flex-start;
  align-items: flex-start;
  width: 100dvw;
  height: 100dvh;
  display: flex;
  position: absolute;
  inset: 0;
  overflow: hidden;
}

.section-36 {
  justify-content: center;
  align-items: center;
  width: 100svw;
  height: 100svh;
  display: flex;
}

.code-embed-34 {
  width: 100%;
  height: 100%;
}

.section-37 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100svw;
  height: 100svh;
  display: flex;
}

.code-embed-35 {
  width: 100%;
  height: 100%;
}

.section-38 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100svw;
  height: 100svh;
  display: flex;
}

.code-embed-36 {
  width: 100%;
  height: 100%;
}

.section-39 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-37 {
  width: 100%;
  height: 100%;
}

.section-40 {
  flex-flow: column;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-38 {
  width: 100%;
  height: 100%;
}

.section-41 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
  position: relative;
}

.curtain-embed {
  z-index: 2;
  background-color: #0000;
  width: 100%;
  height: 100%;
  position: absolute;
}

.heading-14 {
  z-index: 2;
  filter: drop-shadow(0 8px 20px #0000004d);
  text-align: center;
  background-color: #ff0;
  width: 100%;
  margin-top: auto;
  margin-bottom: auto;
  padding: 24px;
  font-family: Instrument Serif, sans-serif;
  position: absolute;
  top: 0;
  bottom: auto;
}

.playbill-header {
  z-index: 2;
  filter: drop-shadow(0 8px 20px #0000004d);
  text-align: center;
  background-color: #ff0;
  background-image: url('../images/paper_yellow.jpg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: cover;
  background-attachment: fixed;
  flex-flow: column;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  margin-top: auto;
  margin-bottom: auto;
  padding: 24px;
  font-family: Instrument Serif, sans-serif;
  display: flex;
  position: absolute;
  top: 0;
  bottom: auto;
}

.text-block-16 {
  font-size: 1.25rem;
  line-height: 1.2;
}

.heading-15 {
  margin: 0;
  font-size: 3rem;
  line-height: 1.2;
}

.section-42 {
  flex-flow: column;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-39 {
  width: 100%;
  height: 100%;
}

.div-block-37 {
  z-index: 1;
  background-color: #000;
  flex-flow: wrap;
  place-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  padding: 10vh 5vw;
  display: flex;
  position: absolute;
  inset: 0%;
}

.image-6 {
  width: auto;
  max-width: none;
  max-height: 40%;
  position: relative;
}

.overlay {
  z-index: 99;
  opacity: 1;
  pointer-events: none;
  mix-blend-mode: color-burn;
  background-image: url('../images/halftone_tile.jpg');
  background-position: 50%;
  background-repeat: repeat;
  background-size: 32px 16px;
  background-attachment: scroll;
  position: fixed;
  inset: 0%;
}

.section-43 {
  flex-flow: column;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-40 {
  width: 100%;
  height: 100%;
}

.section-44 {
  flex-flow: column;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-41 {
  width: 100%;
  height: 100%;
}

.section-45 {
  flex-flow: column;
  width: 100svw;
  height: 100svh;
  display: flex;
}

.code-embed-42 {
  width: 100%;
  height: 100%;
}

.section-46 {
  width: 100svw;
  height: 100svh;
}

.code-embed-43 {
  width: 100%;
  height: 100%;
}

.not-red-pill {
  color: #fff;
  text-align: center;
  background-color: red;
  border-radius: 48px;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  max-width: none;
  height: 100%;
  font-family: Instrument Serif, sans-serif;
  display: flex;
  position: absolute;
  left: 0;
  transform: rotate(0)translate(0);
  box-shadow: inset 0 8px 20px 2px #f5ddddcc, inset 0 -8px 12px 16px #36090954;
}

.section-47 {
  width: 100vw;
  height: 100vh;
}

.section-48 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-44 {
  width: 100%;
  height: 100%;
}

.section-49 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-45 {
  width: 100%;
  height: 100%;
}

.section-50 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-46, .code-embed-47 {
  width: 100%;
  height: 100%;
}

.displacement-embed {
  width: 100vw;
  height: 100vh;
}

.section-51 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-48 {
  width: 100%;
  height: 100%;
}

.section-52 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-49 {
  width: 100%;
  height: 100%;
}

.section-53 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-50 {
  width: 100%;
  height: 100%;
}

.section-54 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-51 {
  width: 100%;
  height: 100%;
}

.section-55 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-52 {
  width: 100%;
  height: 100%;
}

.section-56 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-53 {
  width: 100%;
  height: 100%;
}

.section-57 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-54, .code-embed-55 {
  width: 100%;
  height: 100%;
}

.section-58 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-56 {
  width: 100%;
  height: 100%;
}

.section-59 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-57, .canvas-input-stream {
  width: 100%;
  height: 100%;
}

.section-60 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-58 {
  width: 100%;
  height: 100%;
}

.section-61 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-59 {
  width: 100%;
  height: 100%;
}

.section-62 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-60 {
  width: 100%;
  height: 100%;
}

.section-63 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-61 {
  width: 100%;
  height: 100%;
}

.section-64 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-62 {
  width: 100%;
  height: 100%;
  margin-bottom: 0;
}

.section-65 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-63 {
  width: 100%;
  height: 100%;
  margin-bottom: 0;
}

.section-66 {
  flex-flow: column;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-64 {
  width: 100%;
  height: 100%;
  margin-bottom: 0;
}

.section-67 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-65 {
  width: 100%;
  height: 100%;
}

.section-68 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-66 {
  width: 100%;
  height: 100%;
}

.section-69 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-67 {
  width: 100%;
  height: 100%;
}

.section-70 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-68 {
  width: 100%;
  height: 100%;
}

.section-71 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: auto;
  min-height: 100vh;
  display: flex;
}

.code-embed-69 {
  width: 100%;
  height: 1005px;
}

.section-72 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-70 {
  width: 100%;
  height: 100%;
}

.section-73 {
  background-color: red;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: auto;
  min-height: 100vh;
  display: flex;
}

.code-embed-71 {
  width: 100%;
  height: 100%;
  margin-bottom: 0;
}

.section-74 {
  background-color: gray;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.section-75 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-72 {
  width: 100%;
  height: 100%;
  display: flex;
}

.section-76 {
  background-color: #000;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: auto;
  min-height: 100vh;
  display: flex;
}

.code-embed-73 {
  width: 100vw;
  height: 100vh;
}

.section-77 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-74 {
  width: 100%;
  height: 100%;
}

.section-78 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-75 {
  width: 100%;
  height: 100%;
}

.section-79 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-76 {
  width: 100%;
  height: 100%;
}

.section-80 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-77 {
  width: 100%;
  height: 100%;
}

.section-81 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-78 {
  width: 100%;
  height: 100%;
}

.section-82 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-79 {
  width: 100%;
  height: 100%;
}

.section-83 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-80 {
  width: 100%;
  height: 100%;
}

.section-84 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-81 {
  width: 100%;
  height: 100%;
}

.section-85 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-82 {
  width: 100%;
  height: 100%;
}

.section-86 {
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-83 {
  width: 100%;
  height: 100%;
}

.section-87 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-84 {
  width: 100%;
  height: 100%;
}

.section-88 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-85 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  font-family: Abccameraplain Trial, Arial, sans-serif;
  font-weight: 700;
  display: flex;
}

.section-89 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-86 {
  width: 100%;
  height: 100%;
}

.section-90 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-87 {
  width: 100%;
  height: 100%;
}

.section-91 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-88 {
  width: 100%;
  height: 100%;
}

.section-92 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-89 {
  width: 100%;
  height: 100%;
}

.section-93 {
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-90 {
  width: 100%;
  height: 100%;
}

.section-94 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-91 {
  width: 100%;
  height: 100%;
}

.section-95 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-92 {
  width: 100%;
  height: 100%;
}

.section-96 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-93 {
  width: 100%;
  height: 100%;
  display: none;
}

.code-embed-94 {
  width: 100%;
  height: 100%;
  font-family: Instrument Serif, sans-serif;
}

.section-97 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-95 {
  width: 100%;
  height: 100%;
}

.section-98 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-96 {
  width: 100%;
  height: 100%;
}

.section-99 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-97 {
  width: 100%;
  height: 100%;
}

.section-100 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-98 {
  width: 100%;
  height: 100%;
}

.section-101 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-99 {
  width: 100vw;
  height: 100vh;
}

.section-102 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-100 {
  width: 100%;
  height: 100%;
}

.section-103 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.embed1 {
  width: 100%;
  height: 100%;
}

.section-104 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-101 {
  width: 100%;
  height: 100%;
}

.section-105 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-102 {
  width: 100%;
  height: 100%;
}

.section-106 {
  background-color: #00f;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-103 {
  width: 600px;
  height: 600px;
}

.code-embed-104 {
  width: 100%;
  height: 100%;
}

.section-107 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-105 {
  width: 100%;
  height: 100%;
}

.section-108 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-106 {
  width: 100%;
  height: 100%;
}

.section-109 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-107 {
  width: 100%;
  height: 100%;
}

.section-110 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-108 {
  width: 100%;
  height: 100%;
}

.section-111 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-109 {
  width: 100%;
  height: 100%;
  margin-bottom: 0;
}

.section-112 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-110 {
  width: 100%;
  height: 100%;
  margin-bottom: 0;
}

.section-113 {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  background-image: url('../images/bird-paper-bg.jpg');
  background-position: 50%;
  background-repeat: no-repeat;
  background-size: cover;
  background-attachment: fixed;
  flex-flow: column;
  align-items: center;
  width: 100vw;
  height: auto;
  min-height: 100vh;
  padding: 88px 16px;
  display: flex;
}

.heading-16 {
  color: #3b2d2d;
  text-align: center;
  letter-spacing: 2px;
  margin: 0;
  font-family: Instrument Sans, sans-serif;
  font-size: 1rem;
  line-height: 1.2;
}

.text-block-17 {
  color: #333;
  text-align: center;
  margin: 0;
  font-family: Instrument Serif, sans-serif;
  font-size: 5.5rem;
  font-weight: 400;
  line-height: 1;
}

.text-block-18 {
  text-align: center;
}

.bold-text {
  font-family: Instrument Serif, sans-serif;
  font-size: 1.45rem;
}

.text-block-19 {
  text-align: center;
  font-family: Instrument Sans, sans-serif;
  font-size: 1rem;
  font-weight: 600;
  line-height: 1.1;
}

.bold-text-2 {
  font-size: .75rem;
  font-weight: 700;
  line-height: 1.2;
}

.tommyashby-socials {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  justify-content: center;
  align-items: center;
  margin-top: 24px;
  margin-bottom: 24px;
  display: flex;
}

.code-embed-111 {
  width: 100%;
  height: 720px;
}

.listen-button {
  color: #fff;
  text-align: center;
  background-color: #004c18;
  max-width: 256px;
  font-family: Instrument Serif, sans-serif;
  transition: all .2s;
}

.listen-button:hover {
  background-color: #84038d;
}

.image-7, .image-8, .image-9, .image-10, .image-11, .image-12 {
  max-height: 20px;
}

.code-embed-112, .code-embed-113 {
  width: 100%;
}

.section-114 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-114 {
  width: 100%;
  height: 100%;
  margin-bottom: 0;
}

.section-115 {
  grid-column-gap: 16px;
  grid-row-gap: 16px;
  flex-flow: column;
  grid-template-rows: auto auto;
  grid-template-columns: 1fr 1fr;
  grid-auto-columns: 1fr;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  min-height: 100vh;
  display: flex;
}

.code-embed-115 {
  width: 100%;
  height: auto;
  min-height: 100vh;
}

.section-116 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-116 {
  width: 100%;
  height: 100%;
}

.section-117 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-117 {
  width: 100%;
  height: 100%;
}

.section-118 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-118 {
  width: auto;
  height: auto;
}

.code-embed-119 {
  width: 100%;
  height: 100%;
}

.keyboardoutput-copy {
  color: #000;
  text-align: center;
  white-space: normal;
  word-break: normal;
  background-color: #fff;
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  max-width: none;
  height: 100vh;
  max-height: none;
  margin: 0 auto;
  padding: 0;
  font-family: Inconsolata, monospace;
  font-size: 4rem;
  line-height: 100%;
  transition: all .2s;
  display: flex;
  position: relative;
  top: auto;
  overflow: hidden;
}

.section-119 {
  flex-flow: column;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-120 {
  width: 100%;
  height: 100%;
}

.section-120 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-121 {
  width: 100%;
  height: 100%;
}

.section-121 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-122 {
  width: 100%;
  height: 100%;
}

.section-122 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-123 {
  width: 100%;
  height: 100%;
  margin-bottom: 0;
}

.section-123 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-124 {
  width: 100%;
  height: 100%;
  margin-bottom: 0;
}

.section-124 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-125 {
  width: 100%;
  height: 100%;
  margin-bottom: 0;
}

.section-125 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-126 {
  width: 100%;
  height: 100%;
  margin-bottom: 0;
}

.section-126 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-127 {
  width: 100%;
  height: 100%;
  margin-bottom: 0;
}

.section-127 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-128 {
  width: 100%;
  height: 100%;
  margin-bottom: 0;
}

.section-128 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-129 {
  width: 100%;
  height: 100%;
  margin-bottom: 0;
}

.section-129 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-130 {
  width: 100%;
  height: 100%;
}

.section-130 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-131 {
  width: 100%;
  height: 100%;
  margin-bottom: 0;
}

.section-131 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-132 {
  width: 100%;
  height: 100%;
}

.section-132 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-133 {
  width: 100%;
  height: 100%;
  margin-bottom: 0;
}

.section-133 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-134 {
  width: 100%;
  height: 100%;
  margin-bottom: 0;
}

.section-134 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-135 {
  width: 100%;
  height: 100%;
  margin-bottom: 0;
}

.section-135 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-136 {
  width: 100%;
  height: 100%;
  margin-bottom: 0;
}

.section-136 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-137 {
  width: 100%;
  height: 100%;
}

.section-137 {
  flex-flow: column;
  justify-content: center;
  align-items: center;
  width: 100vw;
  height: 100vh;
  display: flex;
}

.code-embed-138 {
  width: 100%;
  height: 100%;
}

@media screen and (max-width: 991px) {
  .heading1-portfolio {
    letter-spacing: 8px;
    text-indent: 0;
    margin-right: 0;
    font-size: 3rem;
  }

  .keyboardkey {
    border-bottom-width: 6px;
    border-bottom-right-radius: 12px;
    border-bottom-left-radius: 12px;
    width: 8vw;
  }

  .downloadupload {
    background-size: 80%;
    background-attachment: fixed;
  }

  .variabletext {
    font-size: 2rem;
  }

  .body-3 {
    overflow-x: hidden;
  }

  .albumtitleframe, .artisttitleframe {
    font-size: 2rem;
  }

  .siteheadline {
    font-size: 8rem;
  }

  .siteheadlinecontainer {
    width: 50vw;
    bottom: 4rem;
  }

  .siteheadlineclones, .siteheadlineclones.clone1, .siteheadlineclones.clone2, .siteheadlineclones.clone3, .siteheadlineclones.clone4, .siteheadlineclones.clone5 {
    font-size: 8rem;
  }

  .section-19 {
    flex-flow: column;
  }

  .across, .text-block-7, .down {
    font-size: 1rem;
  }

  .section-22 {
    font-size: 15px;
  }

  .lum-on-heading {
    font-size: 1rem;
  }

  .terminalbootscreentext {
    font-size: 1.2rem;
  }

  .contentinfocontainer {
    background-size: auto 100%;
  }

  .fade-in-text {
    margin-top: 4px;
    margin-bottom: 4px;
    font-size: 1.75rem;
  }

  .fade-in-text.cta-tagline {
    margin: 0;
    font-size: 1.5rem;
  }

  .fade-in-text.dividingtext {
    margin-bottom: 12px;
    font-size: .75rem;
  }

  .heading-9.fade-in-text {
    font-size: 4rem;
  }

  .heading-9.fade-in-text.headline-no-breaks {
    padding-top: 0;
    padding-bottom: 0;
    font-size: 3.5rem;
  }

  .july4subhead.fade-in-text {
    font-size: 4rem;
  }

  .july4subhead.fade-in-text.headline-no-breaks {
    padding-top: 0;
    padding-bottom: 0;
    font-size: 2.5rem;
  }

  .about-text {
    font-size: clamp(14px, 4vw, 18px);
  }

  .ascii-heading {
    letter-spacing: 0;
    text-indent: 0;
    margin-right: 0;
    font-size: 12px;
  }

  .headline-lens-wrapper {
    height: 18vh;
  }
}

@media screen and (max-width: 767px) {
  .grid {
    height: 100svh;
  }

  .trefoil {
    max-width: 128px;
  }

  .heading1-portfolio {
    letter-spacing: 8px;
    text-indent: 0;
    margin-right: 0;
  }

  .keyboardkey {
    border-bottom-width: 4px;
    border-bottom-right-radius: 8px;
    border-bottom-left-radius: 8px;
    width: 8vw;
  }

  .downloadupload {
    background-repeat: repeat-y;
    background-size: 100%;
  }

  .variabletext {
    font-size: 2rem;
  }

  .body-3 {
    overflow-x: hidden;
  }

  .catalogentryabovethefold.entry2abovethefold, .catalogentryabovethefold.entry1abovethefold, .catalogentryabovethefold.entry3abovethefold {
    height: auto;
    min-height: auto;
  }

  .albumtitleframe, .artisttitleframe {
    font-size: 1.8rem;
  }

  .siteheadline {
    font-size: 6rem;
  }

  .siteheadlinecontainer {
    width: 50vw;
    bottom: 5rem;
  }

  .siteheadlineclones, .siteheadlineclones.clone1, .siteheadlineclones.clone2, .siteheadlineclones.clone3, .siteheadlineclones.clone4, .siteheadlineclones.clone5 {
    font-size: 6rem;
  }

  .printproxy {
    grid-template-columns: minmax(64px, 64px) minmax(50%, 1fr) minmax(64px, 64px);
  }

  .calque {
    max-height: 24px;
  }

  .calque2 {
    max-width: 25px;
    max-height: 25px;
  }

  .colorscale.cyanscale, .colorscale.magentascale, .colorscale.yellowscale {
    max-width: 15%;
  }

  .colorscaleblock.cyan100, .colorscaleblock.cyan80, .colorscaleblock.cyan60, .colorscaleblock.cyan40, .colorscaleblock.cyan20, .colorscaleblock.magenta100, .colorscaleblock.magenta80, .colorscaleblock.magenta60, .colorscaleblock.magenta40, .colorscaleblock.magenta20, .colorscaleblock.yellow100, .colorscaleblock.yellow80, .colorscaleblock.yellow60, .colorscaleblock.yellow40, .colorscaleblock.yellow20, .colorscaleblock.black100, .colorscaleblock.black80, .colorscaleblock.black60, .colorscaleblock.black40, .colorscaleblock.black20 {
    height: 16px;
  }

  .about-text-wrapper {
    grid-template-columns: 1fr 1fr 1fr;
  }

  .section-19 {
    padding: 1rem;
  }

  .hintbox {
    justify-content: center;
    align-items: flex-start;
    padding: 8px;
  }

  .hints {
    padding: 0;
  }

  .across, .text-block-7 {
    line-height: 120%;
  }

  .heading-4 {
    font-size: 2rem;
    font-weight: 400;
    line-height: 120%;
  }

  .heading-5, .heading-6 {
    font-family: Instrument Serif, sans-serif;
    font-size: 1.2rem;
    font-weight: 400;
    line-height: 120%;
  }

  .down {
    line-height: 120%;
  }

  .terminalbootscreentext {
    font-size: 1rem;
  }

  .contentinfocontainer {
    background-size: cover;
    padding-left: 4px;
    padding-right: 4px;
  }

  .ctatext {
    margin-top: 16px;
    font-size: 1.25rem;
  }

  .fade-in-text {
    margin: 4px 0;
    font-size: 1.5rem;
  }

  .fade-in-text.fireworks-cta {
    font-size: 1.25rem;
  }

  .fade-in-text.cta-tagline {
    max-width: 90%;
    font-size: 1.4rem;
  }

  .fade-in-text.dividingtext {
    margin-top: 12px;
    font-size: .75rem;
  }

  .heading-9.fade-in-text {
    font-size: 4rem;
  }

  .heading-9.fade-in-text.headline-no-breaks {
    max-width: 80%;
    margin-top: 0;
    margin-bottom: 0;
    padding-top: 0;
    padding-bottom: 0;
    font-size: 2.75rem;
  }

  .july4subhead.fade-in-text {
    font-size: 4rem;
  }

  .july4subhead.fade-in-text.headline-no-breaks {
    max-width: 80%;
    margin-top: 0;
    margin-bottom: 0;
    padding-top: 0;
    padding-bottom: 0;
    font-size: 2rem;
  }

  .about-text {
    text-align: left;
    font-size: clamp(14px, 4vw, 16px);
  }

  .ascii-heading {
    letter-spacing: 0;
    text-indent: 0;
    margin-right: 0;
    font-size: 8px;
  }
}

@media screen and (max-width: 479px) {
  .circle.redcircle.ripple-effect {
    filter: blur(8px);
  }

  .circle.outlinecircle.ripple-effect.outline.rotation1 {
    will-change: auto;
    transform: rotate(10deg)translate(0, 33%);
  }

  .div-block.red, .div-block.green, .div-block.blue {
    width: 50vw;
  }

  .circleparent {
    width: 50vw;
    height: 50vw;
  }

  .rgbsection {
    width: 100svw;
    height: 100svh;
  }

  .coordinatetext, .timetext, .locationtext {
    font-size: .88rem;
  }

  .grid {
    height: 120svh;
  }

  .trefoil {
    z-index: 3;
    max-width: 128px;
  }

  .heading1-portfolio {
    letter-spacing: 5px;
    width: 100%;
    max-width: none;
    margin-left: 0;
    margin-right: 0;
    font-size: clamp(20px, 10vw, 48px);
    font-weight: 700;
    transition-property: all;
    transition-duration: .2s;
    transition-timing-function: ease;
  }

  .maindescription {
    font-size: clamp(16px, 6vw, 24px);
    font-weight: 500;
    transition-property: opacity;
    transition-duration: .2s;
    transition-timing-function: ease;
  }

  .eyesection {
    grid-column-gap: 16px;
    grid-row-gap: 16px;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr 1fr;
    grid-auto-flow: row;
    place-items: center;
    padding: 8px;
  }

  .eyecontainer {
    width: 40px;
    max-width: none;
    height: 40px;
    max-height: none;
  }

  .keyboardkey {
    border-bottom-width: 3px;
    border-bottom-right-radius: 10px;
    border-bottom-left-radius: 10px;
    width: 9vw;
  }

  .downloadupload {
    background-size: 100%;
  }

  .variablefontsection {
    width: 100svw;
    max-width: 100svw;
    height: 100svh;
    max-height: 100svh;
    overflow: hidden;
  }

  .variabletext {
    font-size: 1.25rem;
  }

  .cube {
    transform: scale3d(1none, 1none, 1none);
  }

  .body-2 {
    overflow: hidden;
  }

  .tileasterisk {
    opacity: .25;
    background-color: #0000;
    width: 100%;
  }

  .body-3 {
    height: 100svh;
    overflow-x: hidden;
  }

  .catalogsection {
    height: 100svh;
    overflow: hidden;
  }

  .catalogentry.catalog1, .catalogentry.catalog2, .catalogentry.catalog3 {
    border-style: none;
  }

  .catalogentryabovethefold.entry2abovethefold {
    flex-flow: column;
    justify-content: center;
    align-items: center;
    height: auto;
    min-height: auto;
    display: flex;
    overflow: visible;
  }

  .catalogentryabovethefold.entry1abovethefold {
    height: auto;
    min-height: auto;
    overflow: visible;
  }

  .catalogentryabovethefold.entry3abovethefold {
    justify-content: center;
    align-items: center;
    height: auto;
    min-height: auto;
    overflow: visible;
  }

  .catalogentryslider {
    height: 100svh;
  }

  .zwrapper {
    overflow: hidden visible;
  }

  .bitgrid {
    background-size: 8px 8px;
    height: 120svh;
  }

  .albumtitleframe, .artisttitleframe {
    font-size: 1.2rem;
    font-weight: 500;
  }

  .siteheadline {
    letter-spacing: -4px;
    width: auto;
    font-size: 5rem;
    bottom: 0;
  }

  .siteheadlinecontainer {
    justify-content: space-between;
    width: 70vw;
    top: 4rem;
    bottom: 5rem;
  }

  .siteleadparagraph {
    color: #fff;
    font-family: DM Mono, sans-serif;
    font-size: 10px;
    line-height: 140%;
  }

  .siteheadlineclones {
    letter-spacing: -4px;
    width: auto;
    font-size: 5rem;
    bottom: 0;
  }

  .siteheadlineclones.clone1, .siteheadlineclones.clone2, .siteheadlineclones.clone3, .siteheadlineclones.clone4, .siteheadlineclones.clone5 {
    font-size: 5rem;
  }

  .stylus.hidestylus {
    height: 100vh;
  }

  .stylusimage {
    height: 100%;
  }

  .progressbar, .bar {
    height: 100dvh;
    min-height: 100dvh;
  }

  .printproxy {
    grid-column-gap: 8px;
    grid-row-gap: 8px;
    grid-template-rows: 24px auto 24px;
    grid-template-columns: 24px repeat(auto-fit, minmax(50%, 1fr)) 24px;
    grid-auto-flow: column dense;
    place-items: center;
  }

  .div-block-13 {
    flex-flow: row;
  }

  .calque {
    max-height: 10px;
  }

  .calque2 {
    max-width: 16px;
    max-height: 16px;
  }

  .colorbox, .colorbox.magenta, .colorbox.yellow, .colorbox.red, .colorbox.green, .colorbox.blue {
    width: 12px;
    height: 12px;
  }

  .greyscale {
    width: auto;
  }

  .greyscaleblock.black100, .greyscaleblock.black90, .greyscaleblock.black80, .greyscaleblock.black70, .greyscaleblock.black60, .greyscaleblock.black50, .greyscaleblock.black40, .greyscaleblock.black30, .greyscaleblock.black20, .greyscaleblock.black10, .greyscaleblock.black0 {
    width: 12px;
    height: 12px;
  }

  .colorscale.cyanscale {
    width: auto;
  }

  .colorscale.magentascale, .colorscale.yellowscale {
    max-width: 15%;
  }

  .colorscaleblock.cyan100, .colorscaleblock.cyan80, .colorscaleblock.cyan60, .colorscaleblock.cyan40, .colorscaleblock.cyan20, .colorscaleblock.magenta100, .colorscaleblock.magenta80, .colorscaleblock.magenta60, .colorscaleblock.magenta40, .colorscaleblock.magenta20, .colorscaleblock.yellow100, .colorscaleblock.yellow80, .colorscaleblock.yellow60, .colorscaleblock.yellow40, .colorscaleblock.yellow20, .colorscaleblock.black100, .colorscaleblock.black80, .colorscaleblock.black60, .colorscaleblock.black40, .colorscaleblock.black20 {
    width: 12px;
    height: 12px;
  }

  .bottommargins {
    flex-flow: row;
  }

  .shadercanvas {
    display: flex;
  }

  .printsection {
    height: 100svh;
    min-height: 100svh;
  }

  .about-text-wrapper {
    grid-template-rows: repeat(auto-fit, 200px) minmax(auto, 50svh);
    grid-template-columns: 1fr;
  }

  .section-19 {
    flex-flow: column;
    padding-left: 8px;
    padding-right: 8px;
    overflow: visible;
  }

  .text-block-5 {
    text-align: center;
    font-size: 1.3rem;
    line-height: 120%;
  }

  .across, .text-block-7 {
    font-size: 12px;
  }

  .heading-4 {
    text-transform: none;
    overflow-wrap: break-word;
    font-size: 2rem;
    font-weight: 400;
    line-height: 120%;
  }

  .heading-5 {
    font-size: 1rem;
    line-height: 120%;
  }

  .heading-6 {
    font-family: Instrument Serif, sans-serif;
    font-size: 1rem;
    line-height: 120%;
  }

  .down {
    font-size: 12px;
  }

  .terminalbootscreentext {
    font-size: .8rem;
  }

  .contentinfocontainer {
    background-size: cover;
    padding-left: 0;
    padding-right: 0;
  }

  .ctatext {
    margin-top: 0;
  }

  .fade-in-text {
    margin-top: 4px;
    margin-bottom: 4px;
    font-size: 1.2rem;
  }

  .fade-in-text.fireworks-cta {
    font-size: 1rem;
  }

  .fade-in-text.cta-tagline {
    width: 90%;
    font-size: 1.25rem;
  }

  .fade-in-text.dividingtext {
    font-size: .5rem;
  }

  .heading-9.fade-in-text {
    margin: 0;
    font-size: 3.5rem;
  }

  .heading-9.fade-in-text.headline-no-breaks {
    max-width: 96%;
    padding-top: 4px;
    font-size: 2.75rem;
  }

  .july4subhead.fade-in-text {
    margin: 0;
    font-size: 3.5rem;
  }

  .july4subhead.fade-in-text.headline-no-breaks {
    max-width: 96%;
    padding-top: 4px;
  }

  .about-text {
    color: #0c0c0c;
    text-align: left;
    padding: 8px;
    font-size: clamp(14px, 4vw, 18px);
    line-height: 1.5;
  }

  .ascii-heading {
    letter-spacing: 0;
    width: 100%;
    max-width: none;
    margin-left: 0;
    margin-right: 0;
    font-size: 6px;
  }

  .main-subtext {
    width: 100%;
    font-size: 1rem;
  }

  .code-embed-31 {
    margin-top: 33vh;
    position: relative;
  }

  .circlecopy {
    width: 30vw;
    height: 30vw;
  }

  .work-section {
    overflow-x: hidden;
  }

  .vr-grid-embed {
    margin: 0;
    position: absolute;
    inset: 0%;
  }

  .blackhole-section {
    overflow-x: hidden;
  }

  .blackhole-text-content.mask-target {
    flex-flow: column;
    align-items: center;
    width: 100%;
    min-width: 0;
    display: flex;
  }

  .goodbye-text {
    text-align: center;
    min-width: 0%;
    height: auto;
    font-size: 1.5rem;
  }

  .text-block-11 {
    font-size: .85rem;
    position: static;
  }

  .pill-container {
    width: 100%;
    max-width: 300px;
  }

  .redpill-text, .bluepill-text, .centerpill-text {
    font-size: .8rem;
  }

  .fraction-scroll {
    padding-left: 6px;
    padding-right: 6px;
  }

  .denominator {
    font-size: clamp(10px, 4vw, 24px);
    text-decoration: none;
  }

  .denominator.w--current {
    font-size: clamp(10px, 3vw, 20px);
  }

  .numerators {
    height: 1.05rem;
  }

  .numerator.numerator-1 {
    font-size: clamp(10px, 3vw, 20px);
  }

  .denominators {
    height: 1.05rem;
  }

  .page-arrow-up {
    -webkit-user-select: none;
    user-select: none;
    font-size: 12px;
  }

  .div-block-31 {
    margin-top: 8px;
    margin-bottom: 8px;
  }

  .page-arrow-down {
    -webkit-user-select: none;
    user-select: none;
    font-size: 12px;
  }

  .scroll-indicator {
    width: 16px;
    padding-left: 6px;
    padding-right: 6px;
  }

  .scroll-indicator-dots {
    justify-content: center;
    align-items: flex-end;
    padding-left: 0;
    padding-right: 0;
  }

  .headline-lens-wrapper {
    height: auto;
    padding-top: 8px;
    padding-bottom: 8px;
    font-weight: 700;
  }

  .main-text-displacement-copy {
    letter-spacing: 0;
    font-size: 3rem;
  }

  .type-displacement-grid-2 {
    height: 66%;
  }
}

#w-node-_9e5115ec-fa03-b0e0-7316-2be6e49fa278-c342334a {
  grid-area: Area-2;
}

#w-node-a35d43ce-c10c-8d7c-9f1d-0014bb919336-c342334a {
  grid-area: Area-3;
}

#w-node-_43f001ad-cbe6-bffc-02a5-e4dc72c063c4-c342334a {
  grid-area: Area-4;
}

#w-node-b0ef4bd5-7ef0-455c-886e-cdbff9c139f0-c342334a {
  grid-area: Area-5;
}

#w-node-dcb00345-80a1-72e9-51b8-22340aecd47e-c342334a {
  grid-area: Area-6;
}

#w-node-ad1d61bf-ac7e-e8d9-1209-df098d30baaf-c342334a {
  grid-area: span 1 / span 1 / span 1 / span 1;
}

#w-node-_7da2f76e-fe06-6d42-3318-0731f376c53e-c342334a {
  grid-area: 1 / 2 / 2 / 3;
}

#w-node-_86e3dc4f-993d-8368-67a1-d9b8782b9265-c342334a, #w-node-_3d2f865d-6722-8bd9-945a-997eae490844-c342334a, #w-node-_218ba8e7-3513-da02-1e2e-841fbb886d6f-c342334a, #w-node-_7e3ee61f-0c87-e9db-f029-edc6488425f6-c342334a, #w-node-_893b0c79-44b8-6326-89e7-b063a0e83a74-c342334a, #w-node-c76650b6-b32b-9a0f-00ec-268675a2a4d9-c342334a, #w-node-_59bfcc06-f8f4-1dec-4380-99d10e1809da-c342334a, #w-node-fc0fd03e-8903-af21-01aa-65ad0c2930b3-c342334a {
  place-self: auto;
}

#w-node-_7d19c1d0-420b-104d-2b98-087c8419eb94-c342334a, #w-node-_918678ae-3f8b-0c4b-942f-6f4305cfa779-1b0f8850, #w-node-b101b18a-9697-bc91-f4ef-747eda609d4d-1b0f8850, #w-node-dfa9fde4-141d-fb9e-884c-1a4128b437c7-1b0f8850, #w-node-_0373bf73-5a07-98e4-ccfa-b7882b515ccd-1b0f8850, #w-node-_6c256301-2582-a026-5246-132cc6b2c089-1b0f8850, #w-node-ac1029bd-0ae1-b005-705a-be1c820a0326-1b0f8850, #w-node-_62a4914f-2e8b-c872-7319-ecda010cad0d-1b0f8850, #w-node-_06724769-f88b-07ea-e8ed-567d89c3275a-1b0f8850, #w-node-_6031804b-7e09-c667-3c7e-169ba5a2ea9b-1b0f8850, #w-node-_0030fdfc-6dad-3b9a-7e30-0203b7b577ae-1b0f8850, #w-node-_25897356-ae56-01f6-d085-228163623aa3-1b0f8850, #w-node-dc52d9f8-402e-5cbc-1fd1-ec06e5bdea3b-1b0f8850, #w-node-_3f1a6ca6-9d64-c153-dbf8-666981b1352b-1b0f8850, #w-node-_015118b4-4f57-3c2d-2bb4-1fd4d4141fe2-1b0f8850, #w-node-_25816787-b5ea-70f9-f402-1a4b2e8e4364-1b0f8850, #w-node-_7ff7478b-043d-e271-4b47-08416ac520e7-1b0f8850, #w-node-_63956d37-6bc9-0ff5-c352-3a2f9ea188f6-1b0f8850, #w-node-d84e5091-115a-3f89-5b03-50358d457ce0-1b0f8850, #w-node-_6db56f89-d3f4-41cc-1711-83c908350de3-1b0f8850, #w-node-_9ca5758f-24aa-5e93-430c-3ef80456d8ce-1b0f8850, #w-node-e3bc6c3f-ca49-c356-5d15-973902973516-1b0f8850, #w-node-_22fcadf6-8ae0-0b97-de8e-d6a0c971cb35-1b0f8850, #w-node-a5625b71-94dc-6095-7915-e54ae30e33a5-1b0f8850, #w-node-_4f4290ba-6d9e-deb0-b51c-4e0c78650ece-1b0f8850, #w-node-_7133b858-ed99-3e7b-8a06-0a13d837b38d-1b0f8850, #w-node-f0383c58-6420-cf21-9bb0-44327075e7ab-1b0f8850, #w-node-_67defb9d-3405-6061-15f3-fa02ecd10a75-1b0f8850, #w-node-_3386ad8c-8e62-31ce-50f0-9c28c262fe76-1b0f8850, #w-node-_731e8cfc-be19-7f94-040f-2683b856b54c-1b0f8850, #w-node-a7a52259-4fa2-35bb-f1df-46df773b9ade-1b0f8850, #w-node-caef8fe5-866a-9df1-df3e-a391cae0003d-1b0f8850, #w-node-_28608edb-5a81-b4b5-037e-0cf4bef009dc-1b0f8850, #w-node-_49f4faf7-7acc-0f59-1d8f-7fe19e2b47c3-1b0f8850, #w-node-_79f5b181-fd15-0ce0-8479-60f83a2142a7-1b0f8850, #w-node-_9fc496cc-7292-80e4-48d1-527c21abe0df-1b0f8850, #w-node-fff49766-302d-7e97-7f61-440b03f6c376-1b0f8850, #w-node-_718ca562-cf1b-2a7e-fe54-fee93b96ee6b-1b0f8850, #w-node-bdc8c7d3-1ba8-f462-d5ba-405f4211676e-1b0f8850, #w-node-_0ae962a4-f3f6-9080-3cee-a3e4a0ac8b83-1b0f8850, #w-node-d39dc86d-1e6f-be9c-f761-ae334b3ac163-1b0f8850, #w-node-c785cf7d-3fc0-884b-36fe-201a5910de52-1b0f8850, #w-node-_1e0ac3fd-f4a3-6192-b578-99a71c8e7f33-1b0f8850, #w-node-d316982f-6116-189a-ac2b-63ae2e653ad4-1b0f8850, #w-node-_54a42fc7-4458-4fcf-c16c-9bb0b7f8bae5-1b0f8850, #w-node-_1465e49b-789f-1c69-e238-6123d74c589a-1b0f8850, #w-node-_4d2d4f25-1661-9a2a-8bdf-340d824e7c65-1b0f8850, #w-node-_4e5cd9eb-774e-c81f-bd66-a7e43b3dd251-1b0f8850, #w-node-cfe32986-794c-225f-6d08-43e8b3fc52ba-1b0f8850, #w-node-b9ea2097-12ab-ae8f-3db7-fa2137710734-1b0f8850, #w-node-_4727c073-5e11-3bb1-cabc-3fe387070ce4-1b0f8850, #w-node-_9e2142ae-2615-2e23-4377-0e0487f3e917-1b0f8850, #w-node-_343687dc-2ac8-ce39-3b35-61671bbb1971-1b0f8850, #w-node-d3b8d27d-a382-1056-6026-47150efaf69e-1b0f8850, #w-node-ded03f13-286a-74ed-dce6-9cb3165954ed-1b0f8850, #w-node-_489de693-a09f-db09-fc96-2dffa47107c1-1b0f8850, #w-node-ed54b639-5a83-7a02-0117-fcb9cdd5d6b7-1b0f8850, #w-node-ff6510e1-a9b9-095b-e83e-5e5619ec2139-1b0f8850, #w-node-_6998c6a9-5406-37a5-9366-1f5469e5d8e1-1b0f8850, #w-node-_8a16f103-9438-90c7-6e7c-ebc27155ba13-1b0f8850, #w-node-b2274471-c53a-f68a-60a3-891bb5740b30-1b0f8850, #w-node-f87c93eb-7d2e-e95e-ad2b-4c5645d9f2dc-1b0f8850, #w-node-ce66d9c7-f932-cc80-701a-529c9884181a-1b0f8850, #w-node-d745badd-c00d-f28c-22e9-9130058b4060-1b0f8850, #w-node-_0a96a5a4-e785-8239-aef7-d8f7bad6a135-1b0f8850, #w-node-ee558066-9ba9-76d3-f658-b4dbb87deb29-1b0f8850, #w-node-_48b4b40e-7f3b-2d9c-2b80-939850c51440-1b0f8850, #w-node-_41de49d8-18ed-8e24-8ac7-e98e262895c0-1b0f8850, #w-node-_323fe2ca-84ac-d889-2155-9dacb4e9d53b-1b0f8850, #w-node-d10de78d-58b5-63dc-bbd8-e7c2e161b00d-1b0f8850, #w-node-_22126496-8370-4963-25d5-af4c209e5725-1b0f8850, #w-node-a3d3acce-ffdf-dd8e-a7c7-f62155a564b5-1b0f8850, #w-node-_4af6e6c3-87ba-9a6f-cf82-857ae936db80-1b0f8850, #w-node-_5ccf8188-bdc5-ecd8-12be-7de23d370145-1b0f8850, #w-node-bf155188-15bf-3894-d27c-39c93bbda276-1b0f8850, #w-node-_80cf860b-6f40-e04e-c719-2aa9eba121f1-1b0f8850, #w-node-_0003d5d3-7592-23b4-d7db-fc7027d8e54b-1b0f8850, #w-node-_9c4d5e79-ae04-626a-db16-9b25271eaceb-1b0f8850, #w-node-d7532519-3808-b6a3-c3c7-e7ef9a01bd3e-1b0f8850, #w-node-_8644fdff-405c-c644-e7bc-f3d73937bc36-1b0f8850, #w-node-_9e021d3e-dffc-f86b-0d53-d6c3c6321606-1b0f8850, #w-node-_075e3dd8-d6c1-0cba-4054-e0326bb66168-1b0f8850, #w-node-e3617d7b-8289-c638-f261-49687f5bbae1-1b0f8850, #w-node-_577ba1e9-061e-ca85-b8b6-7b4ca7d68195-1b0f8850, #w-node-_993133d6-dfa1-b7f6-570a-3ae3d0db01a9-1b0f8850, #w-node-_9d349a4d-c905-ea5f-c270-ec96bc85d831-1b0f8850, #w-node-fe16c142-9092-b96a-3e5f-3318f4e8c743-1b0f8850, #w-node-e6c23658-aee5-9f5c-4fc5-068e44c054f8-1b0f8850, #w-node-_5e6647bf-90a0-1c70-f099-5e29d5c9dfcd-1b0f8850, #w-node-_577e45b9-974a-74b2-8062-c46ddbf7f840-1b0f8850, #w-node-cc65d33d-22b6-fc97-f020-888abd919a33-1b0f8850, #w-node-e3568345-d4a1-57cb-2231-1bb9119a7fdf-1b0f8850, #w-node-_4d5f081b-fd00-f706-0cfa-9e55ad6982e6-1b0f8850, #w-node-b5f5b486-089a-8204-8952-fc0bbd1a1857-1b0f8850, #w-node-_1c723b21-17fb-2921-6044-8098a20c6806-1b0f8850, #w-node-_742f5cea-c215-696b-204b-ec4e8f82dbc3-1b0f8850, #w-node-_369e4589-470c-cf7c-ed67-c7cac94e6c6b-1b0f8850, #w-node-_102dd2c0-2a3c-9d3e-9560-85b3249d1da2-1b0f8850, #w-node-c9ee0586-b7a0-34ff-cdf3-dea2454b3eeb-1b0f8850, #w-node-_8ad1ce2d-eeee-ed23-294f-2e4210f968e7-1b0f8850, #w-node-_0b6d4f00-ded5-28eb-41e3-4ad4cd83ba9a-1b0f8850 {
  place-self: center;
}

#w-node-a6f9f541-fe7d-4259-075e-47bd3644acb3-fbdf0247 {
  place-self: auto;
}

#w-node-_5d92e164-5eef-1139-8e73-ec096018f8fb-fbdf0247 {
  grid-area: span 1 / span 1 / span 1 / span 1;
  place-self: center;
}

#w-node-_82f34a68-e496-3286-fd2e-945e047e07f8-fbdf0247, #w-node-_59f10f38-a197-9f07-6362-92fae6f2f388-fbdf0247, #w-node-_7d0452ca-acd7-d12d-716c-8ec1d53cfa5f-fbdf0247, #w-node-_92909f62-56c5-178d-eb56-57266734091d-fbdf0247, #w-node-_1b2a920d-3f9d-4623-7ba0-43e76be5a061-fbdf0247, #w-node-_7a7933ec-9ca5-ed01-e626-d9657061126c-fbdf0247, #w-node-faed9847-0b2e-c472-9e79-c68157433797-fbdf0247, #w-node-ec5b24a1-9914-2841-0e1a-f63aaf6ffc39-fbdf0247, #w-node-_55dab72c-692d-d3a6-d3c3-dcdf578a5307-fbdf0247, #w-node-dec88cfe-8ca9-a0f3-b14c-7c8f31748066-fbdf0247, #w-node-d01aeeee-ddde-49ae-d033-49a60f20624b-fbdf0247, #w-node-_309c5a10-c0cc-2679-be79-ac991318acd3-fbdf0247, #w-node-_3345408d-3275-9f19-d4c2-c0c7cb9cfa33-fbdf0247, #w-node-_921eaa4d-726e-bcfc-e178-c71ae81e59ee-fbdf0247, #w-node-_93766f01-24ad-178a-dbba-6e9b94b66985-fbdf0247, #w-node-_73275b50-896e-0542-79e9-822cdb221b32-fbdf0247, #w-node-eb85b6ef-8f28-e409-ef18-ef9f041943c9-fbdf0247, #w-node-_6d9d1097-f166-0442-e739-e13391a2fb8d-fbdf0247, #w-node-a4932d55-8fe2-5ce0-410c-98885bb0c50a-fbdf0247, #w-node-_36645551-2496-4bf7-0911-89094d897677-fbdf0247 {
  grid-area: span 1 / span 1 / span 1 / span 1;
  place-self: auto;
}

#w-node-f793952e-e843-7512-fc5c-00b3e0607788-fbdf0247 {
  grid-area: span 1 / span 1 / span 1 / span 1;
  place-self: center;
}

#w-node-_888f09ac-183b-eeee-0fdc-d91abbad17e6-fbdf0247, #w-node-_3ff8a895-26e7-9566-a05a-5d9c06e18cf7-fbdf0247, #w-node-f5390263-25e0-df30-3c2a-fac19b72c802-fbdf0247, #w-node-b05b5fa3-9166-319d-20c7-e78870da329d-fbdf0247, #w-node-_2b1b7ccd-40e8-4d77-1b69-99dadad84267-fbdf0247, #w-node-b5146a69-4aed-4929-45b9-5e317da92faa-fbdf0247, #w-node-a9ed0ced-2786-4958-79a6-a127745188bd-fbdf0247, #w-node-_09ea9d8e-2a51-5a19-e706-252899894e2c-fbdf0247, #w-node-_8b3b22c8-8385-c664-d590-c3070278fb5f-fbdf0247, #w-node-_9768b9b5-14fb-259c-1aa0-185925c322ec-fbdf0247, #w-node-_070603f5-7fd4-6eae-7899-ccd1392b1d5a-fbdf0247, #w-node-efd78f15-5a80-2c86-c088-0a11722d3adc-fbdf0247, #w-node-d979bce0-ed6e-424d-fcf3-97c80c40e934-fbdf0247, #w-node-_85d6a262-4d49-c96f-e058-4ea2f0e89919-fbdf0247, #w-node-_88d3749e-ce8e-5366-b575-7afc3581e294-fbdf0247, #w-node-_186e2282-cacf-08d7-99b5-e554c76845e2-fbdf0247, #w-node-_49970b16-1a28-7995-e27d-88a7777e5297-fbdf0247, #w-node-c6e19578-58f5-ff8d-5dea-675ee32ad414-fbdf0247, #w-node-_7f3a0494-65a5-07b5-273e-47f889badbf6-fbdf0247, #w-node-_43d7be65-6468-d230-59ae-cbdfea883dda-fbdf0247, #w-node-fd762814-0ec7-6546-37d9-eeb5a858ad1c-fbdf0247, #w-node-d6917545-ab43-53d6-ee6b-9fa6a4a50255-fbdf0247, #w-node-a4023ec5-4ae0-e161-be2b-a6b303ba4221-fbdf0247, #w-node-_3a59425b-7e24-005c-3f2d-bd611628012e-fbdf0247, #w-node-abc39380-5f94-e6dd-3cea-4d2e3f8f521d-fbdf0247, #w-node-_23175be5-d9bf-f979-60a2-e0404081cb61-fbdf0247, #w-node-_1ac908dd-3a19-9d29-d9c6-c2f0c5d0e71a-fbdf0247, #w-node-e0e2fde9-9c65-7ee6-2ba2-0e3e0f442a64-fbdf0247, #w-node-d2c0eb59-00b5-6d05-60c7-85816994495b-fbdf0247, #w-node-_9423e861-4d08-f013-2e3f-29e3deb57c6f-fbdf0247, #w-node-a7c6c2aa-7469-6635-1c74-df1545203644-fbdf0247, #w-node-_182baef5-531d-50c5-9e81-ef6032095b34-fbdf0247, #w-node-_36231031-f1e1-6ab6-74d5-9496317bab75-fbdf0247, #w-node-_7cad5e1d-974f-d396-4000-db2defc2bca0-fbdf0247, #w-node-f257e14c-1a27-d202-967e-400171155c41-fbdf0247, #w-node-_476f01d9-bffa-28e9-6da5-70b25c856114-fbdf0247, #w-node-_276f57fc-92f0-5f88-b91e-c1984d9f0e33-fbdf0247, #w-node-_3be102c1-dc95-8296-11c2-3b9f624f677d-fbdf0247, #w-node-f4e3e3cc-50a4-73c0-bb16-5f8d72430e99-fbdf0247, #w-node-c93cc890-6a08-9c97-a0ef-acf082be3db1-fbdf0247, #w-node-bdfc96d2-0a9f-6611-1486-b689d41f56a7-fbdf0247, #w-node-dcc1b035-90df-c2fe-d6a4-63160488965d-fbdf0247, #w-node-f2475b83-b92d-75ab-18af-ae4bd036ad92-fbdf0247, #w-node-d9abcf34-e30e-4a51-b6a8-048a12d6d983-fbdf0247, #w-node-b2150f37-fc31-e4c7-082f-dda08fc42125-fbdf0247, #w-node-_32f2db61-97f9-9976-3808-6fa3675f38b2-fbdf0247, #w-node-_2e60231d-9e7c-d809-5a5b-fbdff5de512f-fbdf0247, #w-node-_401be9f8-c3f0-435b-129b-fdcb56ea81d2-fbdf0247, #w-node-_5eeae2cf-a71b-f0e7-ba8f-32b0d172cb07-fbdf0247, #w-node-c01ac084-fd77-155f-1bc3-b45bb22bf471-fbdf0247, #w-node-_3d05c28b-d162-55a1-55e5-454db440021a-fbdf0247, #w-node-_60c58fe8-fac9-23a2-1d73-41de122b6443-fbdf0247, #w-node-_9cdb01ef-dffb-db18-3466-ae49f3687308-fbdf0247, #w-node-b0f8a0e3-3e6e-1ccf-2cc6-400c4add4455-fbdf0247, #w-node-ec1a79b0-3c50-3e29-df47-322dd4dbb8ff-fbdf0247, #w-node-_460c0e66-6582-7cc3-9d60-0f983b6cfa09-fbdf0247, #w-node-_3da995eb-d3e3-0b44-6dc7-c9fb7bfb69d7-fbdf0247, #w-node-_2bc93c11-5643-e29a-06c4-e8b3c83b4e80-fbdf0247, #w-node-_5d3b780b-7e84-0166-b3eb-73f4593acc7f-fbdf0247, #w-node-_45cd3868-e46e-c408-961f-b7c8d8c385cf-fbdf0247 {
  grid-area: span 1 / span 1 / span 1 / span 1;
  place-self: auto;
}

#w-node-f60f18de-51f2-a42c-2a19-919f898a54af-fbdf0247 {
  grid-area: span 1 / span 1 / span 1 / span 1;
  place-self: center;
}

#w-node-_3d54101b-a59a-5dc1-e035-41c5322307ea-fbdf0247, #w-node-c4c03f22-2c66-ef03-3612-81c6b6488e9a-fbdf0247, #w-node-_6c8d4fdf-ca6d-bd9c-549d-48a5bb9e8c20-fbdf0247, #w-node-_8c8657f6-f660-48b2-9f28-dd069ae1891f-fbdf0247, #w-node-_8b4ff6be-b8ed-3c48-4fc8-daf10bc66507-fbdf0247, #w-node-_0f442073-19cc-372c-1c54-299fdfc11844-fbdf0247, #w-node-b3b24262-af42-0bd6-a866-450868e26afe-fbdf0247, #w-node-fae6807b-26b9-d0dd-f944-fc5b078f4e5c-fbdf0247, #w-node-_5dcd4dee-7b6b-3e7b-da9a-48174cd9cedf-fbdf0247, #w-node-c39fd2b3-f375-3389-7976-c8290222ae2e-fbdf0247, #w-node-d42929ad-7172-6432-8502-51c0ea376c45-fbdf0247, #w-node-_452b7b84-2c4c-0c40-c231-e2c1d9e937b7-fbdf0247, #w-node-_718a58f1-773c-ed00-bd52-9fd5ffebaca4-fbdf0247, #w-node-f0491d4d-8b32-2ab5-bec7-ad30c59de210-fbdf0247, #w-node-af0d2484-0fad-2603-d8f2-d04cd2a12048-fbdf0247, #w-node-_2cb78cf9-bbe0-9263-0870-68d80c35e77c-fbdf0247, #w-node-_335bd460-4d9b-e23e-d6b1-d55fe606d14d-fbdf0247, #w-node-_9b549583-5f96-f112-2e4d-e98a2beb1db2-fbdf0247, #w-node-a43f5cea-e481-a0a2-169c-41ae93c9b8ec-fbdf0247, #w-node-d515d470-f75a-0745-ea35-26d49e77c461-fbdf0247, #w-node-_747cbd43-dbe1-cdfc-0016-3428537145b4-fbdf0247, #w-node-_2f97df88-2af1-2800-f6f3-9a1a22394144-fbdf0247, #w-node-_8499e4f7-d6e2-f19c-3467-d89a0c2e8d05-fbdf0247, #w-node-e23dce6a-6e84-d682-c422-f765f8421ed5-fbdf0247, #w-node-_594f8aa0-42b8-26ef-3440-b5f310b6c88c-fbdf0247 {
  grid-area: span 1 / span 1 / span 1 / span 1;
  place-self: auto;
}

#w-node-_594f8aa0-42b8-26ef-3440-b5f310b6c88f-fbdf0247, #w-node-_594f8aa0-42b8-26ef-3440-b5f310b6c892-fbdf0247, #w-node-_594f8aa0-42b8-26ef-3440-b5f310b6c895-fbdf0247, #w-node-_594f8aa0-42b8-26ef-3440-b5f310b6c898-fbdf0247, #w-node-_594f8aa0-42b8-26ef-3440-b5f310b6c89b-fbdf0247, #w-node-_594f8aa0-42b8-26ef-3440-b5f310b6c89e-fbdf0247, #w-node-_594f8aa0-42b8-26ef-3440-b5f310b6c8a1-fbdf0247, #w-node-_594f8aa0-42b8-26ef-3440-b5f310b6c8a4-fbdf0247, #w-node-b9a6a131-ef2e-9bc3-f663-da63186759c6-fbdf0247, #w-node-a72a13ef-0aa4-d28f-c6af-856382200da3-fbdf0247, #w-node-c8794ae9-b135-33f2-ad83-3bec5f7632d4-fbdf0247, #w-node-_01b37a28-8713-5685-b96a-da2bc7532782-fbdf0247, #w-node-_1593abeb-492a-0d0f-fa3c-b64e89167b91-fbdf0247, #w-node-d69a64b1-d48c-8606-7774-17aa94c80b77-fbdf0247, #w-node-_0eae0773-9f6f-b594-997c-8e7cb6a6036f-fbdf0247, #w-node-_4a63bce4-2bec-d80a-7f91-5a8eca10346a-fbdf0247, #w-node-d296be61-dd99-5a2f-a0b9-ed190fbe5fa0-fbdf0247, #w-node-bc49978a-8250-903b-aaff-1ca298887a5b-fbdf0247, #w-node-_394d8ad6-41fc-5019-de46-85ed963c25d4-fbdf0247, #w-node-b4748a06-c860-8447-c039-47a1808de9a4-fbdf0247, #w-node-e4bcab3c-6390-c41e-cb19-840e23d1fa41-fbdf0247, #w-node-_2ea8a4d1-8ab8-1748-1169-8184a6357c8b-fbdf0247, #w-node-ac5e07cf-4a86-14e3-be3f-481aec81e631-fbdf0247, #w-node-_9026dc9f-4246-c7f3-2d39-8376e4c86c7b-fbdf0247, #w-node-a298474b-5ad3-6e59-1d62-37ca709321ab-fbdf0247, #w-node-_188e486f-b1bb-3dec-19b5-d45de2171e96-fbdf0247 {
  grid-area: span 1 / span 1 / span 1 / span 1;
  place-self: center;
}

#w-node-_86c434b2-b96e-6faa-8a1e-91f90915e48a-fbdf0247, #w-node-_6cb0ee77-7540-a832-1866-d09a52d881c9-fbdf0247, #w-node-d44b861f-7ff7-1732-c132-1f0064739ea6-fbdf0247 {
  place-self: auto;
}

#w-node-_7e1e03e9-ce07-b965-2963-0c41365405c1-fbdf0247, #w-node-_6560eb03-a9e1-6c50-ff80-b305f0ad6154-fbdf0247 {
  place-self: center;
}

#w-node-c1b86ee0-f431-6629-e356-aa3d00054887-fbdf0247, #w-node-ae964fc9-be57-d020-c879-a7e5e9229c39-fbdf0247 {
  place-self: auto;
}

#w-node-b4206a87-8149-0d20-3c9d-87b89f33dc95-08beb809, #w-node-_7981bbc8-ac1b-1041-2e2b-e7220c3b34db-08beb809, #w-node-a472516b-b689-330d-7e37-8ab7cda186a5-08beb809, #w-node-b3bd291b-043f-809f-39e1-b1a68b6a9acc-08beb809, #w-node-d45a3851-a167-d983-1af2-1aff6c884c16-08beb809, #w-node-_9a3d2201-cb81-aa5c-0d92-5a4f119fe64c-08beb809, #w-node-_66a4b9c2-7293-7cfe-534b-56a29bfc0ffb-08beb809, #w-node-_77f78d69-6eeb-8578-5e94-3223798d8267-08beb809, #w-node-_9354830f-c087-aaf2-657a-1b6eebadde9d-08beb809, #w-node-e7a27568-6d0a-dd46-dc53-05ea4a21ea1f-08beb809, #w-node-_7d3cbf05-20d7-f429-4f26-56caa94a57a7-08beb809, #w-node-a4dad020-64c1-14b8-5fb2-41602d583a4e-08beb809, #w-node-fcf984b2-6e6b-25e7-2c5c-df80c6cbe7cc-08beb809, #w-node-c3923e95-ccef-a0c3-62f0-19d68c445214-08beb809, #w-node-d5620a2b-6340-a03f-329f-d776f20c4f9f-08beb809, #w-node-_6c063976-76e3-4a7d-36eb-6a4b63700c2d-08beb809, #w-node-dfdb4c23-b3fe-696d-f2e6-23bcb92bc211-08beb809, #w-node-cc283576-0f85-6382-9ae9-4615973063d2-08beb809, #w-node-_1987ccf7-5bf4-6513-3cf2-07ec5f67851c-08beb809, #w-node-_08c01bf8-4e95-e1bf-e5fe-518bacefa115-08beb809, #w-node-_6c4e7296-c894-b9a3-5f7d-be66aafe7b56-08beb809, #w-node-fd9cbf8e-be7f-cb96-293e-d35872d1a60e-08beb809, #w-node-_8f5b35ea-cc96-028e-1391-13e85180c9ae-08beb809, #w-node-_9bfe8850-b4f4-292a-d4fa-7b61f438e6b2-08beb809, #w-node-_35a051cd-e8f0-c5a8-eede-a38634900a03-08beb809, #w-node-_57fef54b-28e5-e3c7-a0c0-3cf1f4e95e12-08beb809, #w-node-_3316e676-ce4e-c5d3-7393-0ea0af560d8a-08beb809, #w-node-e6fc7973-dce6-2011-78da-a1eddf6446b0-08beb809, #w-node-c93e9345-0ea1-dfe0-6765-c99ea36d2d04-08beb809, #w-node-dca57af6-9922-1d52-01c8-00ea62afd784-08beb809, #w-node-_03fef5cc-ef3d-0a44-65f1-dc0fe7b1571f-08beb809, #w-node-a05f6c1c-22f3-fc9c-8a2a-21b9702e7e52-08beb809, #w-node-dfd4eead-c285-aefc-2460-8dc0bbdf1dd6-08beb809, #w-node-c492312c-0f60-d662-24ed-6368d99a96ce-08beb809, #w-node-_8cac37a0-d482-909a-6a4b-169900f6da35-08beb809, #w-node-_943bf48c-2809-d51f-d4f6-73fa19dc2b7c-08beb809, #w-node-_1ec57ab2-48c5-e1f4-242c-606de868df5a-08beb809, #w-node-_7c71c25a-e1cb-27d0-f259-27774b25398c-08beb809, #w-node-e3c3ef95-2c4c-2804-9bc1-a47dbb4c694a-08beb809, #w-node-b7ffce8c-8ab0-48f5-c0f5-c87ff1651501-08beb809, #w-node-_10b549bc-7d10-4577-dfe1-b288e80d3f3d-08beb809, #w-node-_78511a0d-d37e-ed70-dbe2-df5d177fb4b3-08beb809, #w-node-a555616d-4f65-2a54-08cc-0ec6b13cee61-08beb809, #w-node-_5cfac66d-128c-e9b8-a8b6-3d94f70222a4-08beb809, #w-node-_5aaf281a-a4a2-ef9c-b1ac-5d85b3047df2-08beb809, #w-node-_42b303b9-0470-8604-0550-eef13a891674-08beb809, #w-node-_034aef3f-5628-9eff-74b3-db1b621d70df-08beb809, #w-node-ba33ed13-01c0-3e1d-d5fe-180ae4afc126-08beb809, #w-node-f334b4f8-7284-58b5-17fd-749f93ebf1a4-08beb809 {
  grid-area: span 1 / span 1 / span 1 / span 1;
  place-self: auto;
}

@media screen and (max-width: 767px) {
  #w-node-_7da2f76e-fe06-6d42-3318-0731f376c53e-c342334a {
    grid-column-end: 4;
  }
}

@media screen and (max-width: 479px) {
  #w-node-_32793242-6508-4dc4-69ab-759bdb63ae0c-c342334a {
    grid-area: Area-7;
  }

  #w-node-_7da2f76e-fe06-6d42-3318-0731f376c53e-c342334a {
    grid-column: 1 / 3;
    grid-row-start: 2;
    align-self: start;
  }

  #w-node-_86e3dc4f-993d-8368-67a1-d9b8782b9264-c342334a {
    grid-area: span 1 / span 2 / span 1 / span 2;
    align-self: center;
  }
}


@font-face {
  font-family: 'Inter Variablefont Opsz Wght';
  src: url('../images/') format('truetype');
  font-weight: 100 900;
  font-style: italic;
  font-display: swap;
}
@font-face {
  font-family: 'Inter Variablefont Opsz Wght';
  src: url('../images/') format('truetype');
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Spacegrotesk Variablefont Wght';
  src: url('../fonts/SpaceGrotesk-VariableFont_wght.ttf') format('truetype');
  font-weight: 300 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Wavefont Variablefont Rond Yela Wght';
  src: url('../images/') format('truetype');
  font-weight: 4 1000;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Abccameraplain Trial';
  src: url('../fonts/ABCCameraPlain-Bold-Trial.otf') format('opentype');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}