body {
  background-color: #010101;
  font-family: Arial, 'Helvetica Neue', Helvetica, sans-serif;
  color: #333;
  font-size: 1vw;
  line-height: 20px;
}

h1 {
  margin-top: 20px;
  margin-bottom: 10px;
  color: #e0e0df;
  font-size: 38px;
  line-height: 44px;
  font-weight: 700;
}

h2 {
  margin-top: 0px;
  margin-bottom: 20px;
  font-family: 'Wtmonarchnova roman', sans-serif;
  color: #fff;
  font-size: 2.8em;
  line-height: 1;
  font-weight: 400;
}

.nav {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  padding-top: 3.13em;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}

.hero-section {
  position: relative;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  padding-top: 9.32em;
  padding-bottom: 0px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}

.main-heading {
  margin-top: 0px;
  margin-bottom: 0px;
  font-family: Tuskergrotesk, sans-serif;
  font-size: 12.28em;
  line-height: 1.45;
  font-weight: 300;
  mix-blend-mode: exclusion;
}

.heading-div {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  margin-right: -5.6em;
}

.h3 {
  margin-top: 30px;
  margin-left: 19px;
  font-family: Tuskergrotesk, sans-serif;
  color: #fff;
  font-size: 4.46em;
  line-height: 1;
  font-weight: 400;
}

.eye-image {
  position: absolute;
  left: 0%;
  top: 56px;
  right: auto;
  bottom: auto;
  z-index: -1;
  width: 37.95em;
  height: 40.46em;
}

.para-div {
  position: relative;
  z-index: 5;
  margin-top: 60px;
  margin-left: 27em;
}

.para {
  position: relative;
  z-index: 1;
  max-width: 640px;
  opacity: 0.5;
  font-family: 'Wtmonarchnova roman', sans-serif;
  color: #fff;
  font-size: 2.79em;
  line-height: 1.32;
  letter-spacing: -1px;
}

.para.difference {
  position: absolute;
  left: 0%;
  top: 0%;
  right: 0%;
  bottom: 0%;
  z-index: -1;
  opacity: 1;
  mix-blend-mode: difference;
}

.para.white {
  opacity: 1;
}

.para.white.learn {
  max-width: 800px;
}

.robot-image {
  position: absolute;
  left: auto;
  top: 5.52em;
  right: -7.92em;
  bottom: 0%;
  z-index: -1;
  width: 32.03em;
  height: 37.56em;
  -webkit-transition: all 300ms ease;
  transition: all 300ms ease;
  -o-object-fit: cover;
  object-fit: cover;
}

.robot-image.rebrand {
  z-index: 0;
  opacity: 0;
}

.robot-image.rebrand.hide {
  opacity: 0;
}

.robot-image.rebrand.show {
  top: 10.72em;
  opacity: 1;
}

.robot-image.rarity {
  top: 7.52em;
  opacity: 0;
}

.robot-image.rarity.show {
  opacity: 1;
}

.robot-image.learn {
  right: -13.42em;
  width: 28em;
  height: 30em;
  opacity: 0;
}

.robot-image.learn.show {
  opacity: 1;
}

.robot-image.merch {
  top: 11.22em;
  opacity: 0;
}

.robot-image.merch.show {
  opacity: 1;
}

.robot-image.story {
  top: 8.12em;
  opacity: 0;
}

.robot-image.story.show {
  opacity: 1;
}

.robot-image.two-roadmap {
  top: 11.32em;
  opacity: 0;
}

.robot-image.two-roadmap.show {
  opacity: 1;
}

.badge-img {
  position: absolute;
  left: auto;
  top: 2.85em;
  right: 0%;
  bottom: auto;
  width: 19.31em;
  height: 24.5em;
}

.global {
  display: none;
}

.numbers-tab-div {
  position: relative;
  z-index: 10;
  padding-top: 11.66em;
}

.numbers {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
}

.number-tab {
  height: 50px;
  background-color: transparent;
  opacity: 0.6;
  font-family: Tuskergrotesk, sans-serif;
  color: #fff;
  font-size: 3.35vw;
  font-weight: 700;
}

.number-tab.w--current {
  background-color: transparent;
  opacity: 1;
}

.number-tab.four {
  height: 50px;
}

.tab-pane-tab-1 {
  padding-left: 0em;
}

.hands-image {
  position: absolute;
  left: 0%;
  top: auto;
  right: auto;
  bottom: -42em;
  z-index: 0;
  width: 33.48em;
  height: 33.48em;
  -webkit-transition: all 300ms ease;
  transition: all 300ms ease;
  -o-object-fit: contain;
  object-fit: contain;
}

.hands-image.rebrand {
  opacity: 0;
}

.hands-image.rebrand.hide {
  opacity: 0;
}

.hands-image.rebrand.show {
  opacity: 1;
}

.hands-image.rarity {
  opacity: 0;
}

.hands-image.rarity.show {
  opacity: 1;
}

.hands-image.learn {
  opacity: 0;
}

.hands-image.learn.show {
  opacity: 1;
  -o-object-fit: cover;
  object-fit: cover;
}

.hands-image.merch {
  opacity: 0;
}

.hands-image.merch.show {
  opacity: 1;
}

.hands-image.story {
  opacity: 0;
}

.hands-image.story.show {
  opacity: 1;
}

.hands-image.two-roadmap {
  opacity: 0;
}

.hands-image.two-roadmap.show {
  opacity: 1;
}

.tabs-content {
  padding-top: 2.85em;
  padding-left: 2.85em;
}

.tabs {
  margin-left: -100px;
}

.footer {
  margin-top: 700px;
}

.footer-container {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  max-width: 1292px;
  margin-right: auto;
  margin-left: auto;
  padding-top: 30px;
  padding-bottom: 68px;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  border-top: 1px solid hsla(0, 0%, 100%, 0.3);
}

.footer-text {
  font-family: 'Monumentgrotesk semi mono', sans-serif;
  color: #fff;
  font-size: 0.78em;
}

.social-links {
  display: -ms-grid;
  display: grid;
  grid-auto-columns: 1fr;
  grid-column-gap: 32px;
  grid-row-gap: 16px;
  -ms-grid-columns: 1fr 1fr;
  grid-template-columns: 1fr 1fr;
  -ms-grid-rows: auto;
  grid-template-rows: auto;
}

.rebrand-img1 {
  width: 20.83em;
  margin-top: 10px;
}

.rarity-img {
  width: 20.83em;
}

.learn-img {
  width: 20.83em;
  height: 20.83em;
  margin-right: 20px;
  -o-object-fit: cover;
  object-fit: cover;
}

.merch-image {
  width: 20.83em;
}

.bold-text {
  font-family: 'Wtmonarchnova roman', sans-serif;
  line-height: 100%;
  font-style: normal;
  font-weight: 400;
}

@media screen and (min-width: 1920px) {
  .para {
    max-width: 860px;
  }

  .para.white {
    max-width: 590px;
    opacity: 1;
  }

  .para.white.learn {
    max-width: 1000px;
  }

  .robot-image.learn.show {
    opacity: 1;
  }

  .numbers-tab-div {
    position: relative;
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    padding-top: 11.66em;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -webkit-align-items: center;
    -ms-flex-align: center;
    align-items: center;
  }

  .number-tab {
    background-color: transparent;
    opacity: 0.6;
    font-family: Tuskergrotesk, sans-serif;
    color: #fff;
    font-size: 3.35em;
    line-height: 100%;
    font-weight: 700;
  }

  .number-tab.w--current {
    background-color: transparent;
    opacity: 1;
    line-height: 100%;
  }

  .tab-pane-tab-1 {
    padding-top: 0em;
    padding-left: 0em;
  }

  .hands-image {
    position: absolute;
    left: 0%;
    top: auto;
    right: auto;
    bottom: -40.18em;
    height: 33.48em;
  }

  .hands-image.rebrand.show {
    z-index: -1;
  }

  .hands-image.rarity {
    z-index: -1;
  }

  .hands-image.learn {
    z-index: -1;
  }

  .hands-image.learn.show {
    opacity: 1;
  }

  .hands-image.merch {
    z-index: -1;
  }

  .hands-image.story {
    z-index: -1;
  }

  .hands-image.two-roadmap {
    z-index: -1;
  }

  .tabs {
    margin-right: 0px;
    margin-left: 0px;
  }

  .footer-container {
    margin-top: 1000px;
  }
}

@media screen and (max-width: 479px) {
  h2 {
    font-size: 30px;
  }

  .main-heading {
    font-size: 110px;
  }

  .heading-div {
    margin-right: 0em;
  }

  .h3 {
    margin-left: 10px;
    font-size: 40px;
  }

  .eye-image {
    position: static;
    display: none;
    width: auto;
    height: auto;
  }

  .para-div {
    margin-top: 40px;
    margin-left: 0em;
  }

  .para {
    font-size: 26px;
  }

  .para.white {
    max-width: 100%;
  }

  .robot-image {
    position: absolute;
    left: 0%;
    top: 131px;
    right: auto;
    bottom: auto;
    width: 100%;
    height: 380px;
    margin-top: 60px;
  }

  .robot-image.rebrand.show {
    top: 28.32em;
  }

  .robot-image.learn {
    width: auto;
    height: auto;
  }

  .robot-image.merch {
    top: 22.12em;
  }

  .robot-image.story {
    top: 27.12em;
  }

  .robot-image.two-roadmap {
    left: 0%;
    top: 24.42em;
    right: 0%;
    bottom: auto;
  }

  .numbers-tab-div {
    margin-top: 420px;
  }

  .numbers {
    -webkit-box-align: start;
    -webkit-align-items: flex-start;
    -ms-flex-align: start;
    align-items: flex-start;
  }

  .number-tab {
    margin-top: 10px;
    padding-right: 20px;
    padding-left: 20px;
    font-size: 30px;
  }

  .number-tab.six {
    padding-left: 10px;
  }

  .tab-pane-tab-1 {
    padding-left: 10px;
  }

  .hands-image {
    position: absolute;
    bottom: -104.7em;
    width: 100%;
    height: 380px;
    margin-top: 60px;
    -o-object-fit: contain;
    object-fit: contain;
  }

  .hands-image.two-roadmap {
    width: 100%;
    height: 220px;
    -o-object-fit: contain;
    object-fit: contain;
  }

  .tabs-content {
    padding-top: 4em;
  }

  .tabs {
    width: 100%;
    margin-left: 0px;
  }

  .footer {
    margin-top: 420px;
  }

  .footer-container {
    padding-bottom: 40px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -webkit-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start;
  }

  .footer-text {
    font-size: 14px;
    text-align: center;
  }

  .social-links {
    margin-top: 20px;
  }

  .tabs-menu {
    display: -webkit-box;
    display: -webkit-flex;
    display: -ms-flexbox;
    display: flex;
    overflow: visible;
    margin-bottom: 20px;
    -webkit-flex-wrap: wrap;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
  }

  .body {
    padding-right: 20px;
    padding-left: 20px;
  }

  .learn-img {
    display: block;
    width: auto;
    height: auto;
    margin-top: 20px;
    margin-right: 0px;
  }
}

@font-face {
  font-family: 'Tuskergrotesk';
  src: url('../fonts/TuskerGrotesk-3600Semibold.woff2') format('woff2');
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Tuskergrotesk';
  src: url('../fonts/TuskerGrotesk-7600Semibold.woff2') format('woff2');
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Tuskergrotesk';
  src: url('../fonts/TuskerGrotesk-4600Semibold.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Monumentgrotesk semi mono';
  src: url('../fonts/MonumentGrotesk-Semi-Mono.woff2') format('woff2');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: 'Wtmonarchnova roman';
  src: url('../fonts/WTMonarchNova-Roman.ttf') format('truetype');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}