/* CSS Document */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
  margin: 0;
  padding: 0;
  border: 0;
  outline: 0;
  font-weight: inherit;
  font-style: inherit;
  font-size: 100%;
  font-family: inherit;
  vertical-align: baseline; }

/* remember to define focus styles! */
:focus {
  outline: 0; }

body {
  line-height: 1;
  color: black;
  background: white; }

ol, ul, li {
  list-style: none; }

/* tables still need 'cellspacing="0"' in the markup */
table {
  border-collapse: separate;
  border-spacing: 0; }

caption, th, td {
  text-align: left;
  font-weight: normal; }

blockquote:before, blockquote:after,
q:before, q:after {
  content: ""; }

blockquote, q {
  quotes: "" ""; }

a,
a:hover,
a:visited {
  text-decoration: none;
  color: inherit; }

button,
input {
  font-size: inherit;
  color: inherit;
  border: none; }

.grid-overlay {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 10000000;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, white 0%, black 0%, black 7.06027%, white 7.06027%,white 8.44907%, black 8.44907%, black 15.50933%, white 15.50933%,white 16.89813%, black 16.89813%, black 23.9584%, white 23.9584%,white 25.3472%, black 25.3472%, black 32.40747%, white 32.40747%,white 33.79627%, black 33.79627%, black 40.85653%, white 40.85653%,white 42.24533%, black 42.24533%, black 49.3056%, white 49.3056%,white 50.6944%, black 50.6944%, black 57.75467%, white 57.75467%,white 59.14347%, black 59.14347%, black 66.20373%, white 66.20373%,white 67.59253%, black 67.59253%, black 74.6528%, white 74.6528%,white 76.0416%, black 76.0416%, black 83.10187%, white 83.10187%,white 84.49067%, black 84.49067%, black 91.55093%, white 91.55093%,white 92.93973%, black 92.93973%, black 100%, white 100%,white 101.3888%, black 101.3888%, black 108.44907%, white 108.44907%);
  opacity: 0.1; }

body {
  position: relative;
  background: #f9b16f;
  height: 100vh;
  overflow: hidden;
  box-sizing: border-box; }

body,
input,
select,
textarea,
button {
  font-size: 16px;
  font-family: "azo-sans-web", -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol";
  font-weight: 300;
  line-height: 1.4;
  color: #f5f6f9; }
  @media (max-width: 320px) {
    body,
    input,
    select,
    textarea,
    button {
      font-size: 14px; } }
  @media (max-width: 568px) and (orientation: landscape) {
    body,
    input,
    select,
    textarea,
    button {
      font-size: 14px; } }

.button-scaler {
  transition: transform 0.2s; }
  .button-scaler:hover {
    transform: scale(1.1); }

a, a:visited {
  color: #f5f6f9; }

a:hover {
  color: #f5f6f9; }

.section {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0;
  transition: all 0.6s;
  pointer-events: none; }
  .section.is-visible {
    opacity: 1;
    pointer-events: auto; }

.primary-nav {
  position: fixed;
  top: 4vh;
  left: 0;
  right: 0;
  z-index: 100;
  width: 10vh;
  margin: auto; }
  @media (max-width: 414px) {
    .primary-nav {
      top: 4vh; } }
  @media (max-width: 736px) and (orientation: landscape) {
    .primary-nav {
      left: 8.44907%;
      right: auto;
      width: 18vh; } }

.primary__nav-link {
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto;
  text-transform: uppercase;
  font-size: 0.7em;
  line-height: 5vh;
  white-space: nowrap;
  transition: all 0.4s; }
  .primary__nav-link:hover {
    transform: scale(1.05);
    letter-spacing: 0.1em; }
  @media (max-width: 736px) and (orientation: landscape) {
    .primary__nav-link {
      line-height: 8vh; } }

.primary__log-in {
  right: 150%;
  text-align: right; }
  @media (max-width: 736px) and (orientation: landscape) {
    .primary__log-in {
      left: 150%;
      right: auto; } }

.primary__get-started {
  left: 150%; }
  @media (max-width: 736px) and (orientation: landscape) {
    .primary__get-started {
      display: none; } }

.twitter {
  position: fixed;
  bottom: 2vw;
  left: 2vw;
  font-size: 0.7em;
  text-align: right;
  opacity: 0.5;
  transition: all 0.4s; }
  .twitter:hover {
    opacity: 1; }

.nav-logo {
  display: block;
  width: 100%;
  opacity: 1;
  transition: all 0.4s; }
  .nav-logo:hover {
    transform: scale(1.1); }
  @media (max-width: 768px) {
    .nav-logo {
      top: 20px;
      left: 25px; } }
  @media (max-width: 414px) {
    .nav-logo {
      top: 15px;
      left: 20px; } }

.logo__fill,
.icon__fill {
  fill: #f5f6f9;
  transition: all 0.2s; }

.account-nav {
  position: fixed;
  top: 42px;
  right: 42px;
  font-size: 0.7em;
  letter-spacing: 0.2em;
  text-transform: uppercase; }
  .account-nav a {
    display: inline-block;
    padding: 0.5em 1em 0.6em; }
  @media (max-width: 768px) {
    .account-nav {
      top: 20px;
      right: 20px;
      margin: auto;
      text-align: center;
      transition: all 0.5s;
      min-width: 0%; } }
  @media (max-width: 414px) {
    .account-nav {
      top: 10px;
      right: 10px; } }

.intro {
  position: fixed;
  bottom: 12vh;
  left: 0;
  right: 0;
  z-index: 2;
  margin: auto;
  width: 49.3056%;
  text-align: center;
  color: white; }
  @media (max-width: 414px) {
    .intro {
      width: 83.10187%;
      bottom: 8vh; } }
  @media (max-width: 736px) and (orientation: landscape) {
    .intro {
      right: 8.44907%;
      left: auto;
      text-align: right; } }

.tagline {
  font-size: 5vw;
  font-weight: 900;
  line-height: 1;
  text-transform: uppercase; }
  @media (max-width: 414px) {
    .tagline {
      font-size: 10vw; } }

.description {
  margin: 1.5em 0;
  line-height: 1.4;
  opacity: 0.7; }

.overlay {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1;
  background: linear-gradient(150deg, rgba(253, 53, 186, 0), #fd35ba);
  pointer-events: none; }

.controls {
  position: fixed;
  bottom: 0;
  right: 0;
  width: 100px;
  z-index: 1000;
  font-size: 0.7em;
  color: black;
  opacity: 0; }
  .controls div {
    display: flex; }
  .controls input {
    background: none; }
  .controls:hover {
    opacity: 1; }

.get-started-button {
  display: inline-block;
  padding: 0.6em 1em 0.65em;
  border-radius: 3px;
  background: rgba(24, 26, 29, 0.8);
  text-transform: uppercase;
  font-weight: 900;
  transition: all 0.4s; }
  .get-started-button:hover {
    transform: scale(1.05);
    letter-spacing: 0.1em; }

/*# sourceMappingURL=styles.css.map */