body {
  background-color: #290b62;
  font-family: effra, sans-serif;
  color: #080734;
  font-size: 18px;
  line-height: 26px;
}

h1 {
  margin-top: 0px;
  margin-bottom: 0px;
  font-size: 38px;
  line-height: 44px;
}

h2 {
  margin-top: 0px;
  margin-bottom: 10px;
  font-size: 32px;
  line-height: 36px;
  font-weight: 700;
}

h3 {
  margin-top: 0px;
  margin-bottom: 8px;
  font-size: 36px;
  line-height: 42px;
  font-weight: 500;
}

h4 {
  margin-top: 0px;
  margin-bottom: 18px;
  font-size: 20px;
  line-height: 24px;
  font-weight: 400;
}

p {
  margin-bottom: 0px;
}

strong {
  display: inline-block;
  margin-top: 12px;
  font-family: imaginaryfriend-bb, sans-serif;
  color: #edffa5;
  font-size: 24px;
  line-height: 28px;
  font-weight: 400;
  text-transform: uppercase;
}

.section {
  position: relative;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  padding-top: 82px;
  padding-bottom: 82px;
  -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;
}

.section.hero {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  overflow: hidden;
  max-height: 106vh;
  min-height: 100vh;
  padding-top: 8vh;
  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: 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;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#270a61), to(#fc84d3));
  background-image: linear-gradient(180deg, #270a61, #fc84d3);
}

.section.story-section {
  overflow: hidden;
  padding-top: 0px;
  padding-bottom: 0px;
  -webkit-box-orient: horizontal;
  -webkit-box-direction: normal;
  -webkit-flex-direction: row;
  -ms-flex-direction: row;
  flex-direction: row;
  -webkit-box-align: end;
  -webkit-align-items: flex-end;
  -ms-flex-align: end;
  align-items: flex-end;
  background-image: url('../images/skeleton.png'), url('../images/professor-bg.png'), radial-gradient(circle farthest-side at 50% 100%, #59ff9b, #56186c);
  background-position: 0% 100%, 100% 100%, 0px 0px;
  background-size: auto 100%, auto 100%, auto;
  background-repeat: no-repeat, no-repeat, repeat;
  color: #fff;
}

.section.team-section {
  overflow: hidden;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#270a61), to(#fc84d3));
  background-image: linear-gradient(180deg, #270a61, #fc84d3);
}

.section.roadmmap-section {
  display: none;
  height: 400vh;
  padding-bottom: 0px;
  -webkit-box-pack: start;
  -webkit-justify-content: flex-start;
  -ms-flex-pack: start;
  justify-content: flex-start;
  background-color: #32078a;
  text-align: center;
}

.section.final-section {
  overflow: hidden;
  padding-bottom: 0px;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#270a61), to(#fc84d3));
  background-image: linear-gradient(180deg, #270a61, #fc84d3);
}

.section.faq-section {
  overflow: hidden;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#270a61), to(#fc84d3));
  background-image: linear-gradient(180deg, #270a61, #fc84d3);
  -webkit-transition: all 280ms ease;
  transition: all 280ms ease;
}

.section.roadmmap-section {
  height: 400vh;
  padding-bottom: 0px;
  -webkit-box-pack: start;
  -webkit-justify-content: flex-start;
  -ms-flex-pack: start;
  justify-content: flex-start;
  background-color: #32078a;
  text-align: center;
}

.section.mint-hero {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  overflow: hidden;
  max-width: 100vw;
  min-height: 100vh;
  padding-top: 8vh;
  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: 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;
  background-image: url('../images/skeleton.png'), url('../images/professor-bg.png'), -webkit-gradient(linear, left top, left bottom, from(#270a61), to(#fc84d3));
  background-image: url('../images/skeleton.png'), url('../images/professor-bg.png'), linear-gradient(180deg, #270a61, #fc84d3);
  background-position: -5% 100%, 100% 100%, 0px 0px;
  background-size: auto 110%, auto 100%, auto;
  background-repeat: no-repeat, no-repeat, repeat;
}

.container {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  max-width: 1080px;
  padding-right: 18px;
  padding-left: 18px;
  -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;
  text-align: center;
}

.container.story-container {
  min-width: 680px;
  margin-top: 82px;
  margin-bottom: 92px;
}

.container.mint-container {
  margin-top: 98px;
  margin-bottom: -12px;
}

.hero-headline {
  position: relative;
  z-index: 1;
  max-height: 25vh;
  margin-top: 42px;
}

.hero-headline.mobile-headline {
  display: none;
}

.chrachters {
  position: relative;
  z-index: 1;
  max-height: 62vh;
  max-width: none;
  margin-top: 54px;
}

.button {
  position: relative;
  padding: 18px 42px;
  border: 1px none #000;
  border-radius: 100px;
  background-color: transparent;
  background-image: linear-gradient(135deg, #edffa5, #9ee542);
  -webkit-transition: all 120ms ease;
  transition: all 120ms ease;
  color: #080734;
  font-size: 18px;
  line-height: 32px;
  font-weight: 500;
  text-align: center;
  letter-spacing: 1px;
  text-decoration: none;
  text-transform: uppercase;
}

.button:hover {
  background-image: linear-gradient(135deg, #cd8, #7fbd2e);
}

.button.button-with-image {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  min-height: 74px;
  padding-right: 36px;
  padding-left: 36px;
  -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;
}

.absolute-left {
  position: absolute;
  left: -5%;
  top: -5%;
  right: auto;
  bottom: auto;
  width: 30vw;
  opacity: 0.28;
}

.absolute-right {
  position: absolute;
  left: auto;
  top: -5%;
  right: -5%;
  bottom: auto;
  width: 30vw;
  opacity: 0.28;
  -webkit-transform: rotateX(0deg) rotateY(180deg) rotateZ(0deg);
  transform: rotateX(0deg) rotateY(180deg) rotateZ(0deg);
  -webkit-transform-style: preserve-3d;
  transform-style: preserve-3d;
}

.headline {
  position: relative;
  z-index: 2;
  margin-bottom: 48px;
  background-image: linear-gradient(135deg, #9ee542, #edffa5);
  font-family: imaginaryfriend-bb, sans-serif;
  font-size: 76px;
  line-height: 82px;
  text-transform: uppercase;
  -webkit-background-clip: text;
  background-clip: text;
  -webkit-text-fill-color: transparent;
}

.headline.hidden-heading {
  display: none;
}

.headline.big-headline {
  margin-bottom: 64px;
  font-size: 82px;
  line-height: 92px;
}

.headline.big-headline.line-emulator {
  background-image: none;
  color: #edffa5;
  background-clip: border-box;
  -webkit-text-fill-color: inherit;
}

.headline.big-headline.mint-headline {
  margin-bottom: 48px;
}

.headline.line-emulator {
  position: absolute;
  top: 0px;
  z-index: 1;
}

.story-p {
  max-width: 545px;
  margin-bottom: 12px;
  color: #fff;
}

.story-p.final-one {
  max-width: 640px;
}

.story-image {
  width: 35%;
  margin-right: -1vw;
  margin-left: -2vw;
}

.story-ps {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  margin-top: -18px;
  margin-bottom: 24px;
  -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;
}

.team-members-container {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-flex-wrap: wrap;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  -webkit-box-align: start;
  -webkit-align-items: flex-start;
  -ms-flex-align: start;
  align-items: flex-start;
}

.team-block {
  position: relative;
  z-index: 1;
  overflow: hidden;
  width: 23%;
  margin-right: 1%;
  margin-bottom: 2%;
  margin-left: 1%;
  border-style: solid;
  border-width: 2px;
  border-color: #080734;
  border-radius: 8px;
  background-color: #fba6ff;
  -webkit-transition: all 180ms ease;
  transition: all 180ms ease;
}

.team-block.tilt-left:hover {
  box-shadow: -1px 1px 4px 0 rgba(0, 0, 0, 0.24);
  -webkit-transform: rotate(-2deg);
  -ms-transform: rotate(-2deg);
  transform: rotate(-2deg);
}

.team-block.tilt-left.hide-desktop {
  display: none;
}

.team-block.tilt-right:hover {
  box-shadow: 1px 1px 4px 0 rgba(0, 0, 0, 0.24);
  -webkit-transform: rotate(2deg);
  -ms-transform: rotate(2deg);
  transform: rotate(2deg);
}

.team-block.tilt-right.hide-desktop {
  display: none;
}

.team-name {
  font-family: imaginaryfriend-bb, sans-serif;
  color: #080734;
  font-weight: 700;
}

.team-member-info {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  padding: 24px;
  -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;
  font-size: 16px;
  line-height: 24px;
}

.team-image {
  position: absolute;
  right: 64px;
  bottom: 64px;
  max-height: 260px;
  max-width: 260px;
}

.team-image.image-bottom-left {
  left: 64px;
  right: auto;
}

.team-image.image-top-right {
  top: 64px;
  bottom: auto;
}

.team-image.image-top-left {
  left: 64px;
  top: 64px;
  right: auto;
  bottom: auto;
}

.team-p {
  position: relative;
  z-index: 1;
  max-width: 520px;
  margin-top: 12px;
  color: #fff;
  font-size: 20px;
  line-height: 30px;
}

.roadmap-content {
  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-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;
  -webkit-box-flex: 0;
  -webkit-flex: 0 0 auto;
  -ms-flex: 0 0 auto;
  flex: 0 0 auto;
}

.roadmap-number {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  width: 56px;
  height: 56px;
  margin-bottom: 18px;
  -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;
  border-radius: 100px;
  background-color: #9ee542;
  background-image: linear-gradient(135deg, #edffa5, #9ee542);
  font-family: imaginaryfriend-bb, sans-serif;
  font-size: 28px;
  font-weight: 700;
}

.lottie-animation {
  width: 100%;
  margin-top: -8px;
  margin-bottom: -12px;
}

.roadmap-title {
  font-family: imaginaryfriend-bb, sans-serif;
  color: #9ee542;
  font-size: 42px;
  line-height: 58px;
  font-weight: 700;
}

.roadmap-text {
  max-width: 700px;
  margin-bottom: 22px;
  padding-right: 48px;
  padding-left: 48px;
  color: #fff;
  font-size: 18px;
  line-height: 30px;
  font-weight: 400;
}

.roadmap-text.less-width-text {
  max-width: 660px;
  padding-right: 24px;
  padding-left: 24px;
}

.roadmap-container {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  overflow: hidden;
  max-width: 100vw;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  -webkit-box-align: stretch;
  -webkit-align-items: stretch;
  -ms-flex-align: stretch;
  align-items: stretch;
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
}

.bottom-image {
  -o-object-fit: contain;
  object-fit: contain;
  -o-object-position: 50% 100%;
  object-position: 50% 100%;
}

.bottom-image.image-3 {
  width: 450px;
  margin-right: -136px;
  margin-left: -284px;
}

.bottom-image.image-4 {
  width: 260px;
  margin-right: 32px;
  margin-left: -320px;
}

.bottom-image.image-2 {
  margin-right: -212px;
  margin-left: -64px;
}

.bottom-image.image-3 {
  width: 360px;
  margin-right: -70px;
  margin-left: -284px;
}

.bottom-image.image-2 {
  width: 240px;
  margin-right: -156px;
  margin-left: -64px;
}

.bottom-image.image-4 {
  width: 240px;
  margin-right: 55px;
  margin-left: -320px;
}

.bottom-image.image-1 {
  width: 340px;
}

.bottom-image.image-1.last-image {
  margin-left: -48px;
}

.bottom-image.green-arm {
  width: 310px;
}

.text-center {
  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-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;
}

.faq-block {
  position: relative;
  z-index: 1;
  width: 620px;
  margin-top: -18px;
  border: 2px solid #270a61;
  border-radius: 8px;
  background-color: #fba6ff;
  text-align: left;
}

.faq-single-block {
  padding: 24px;
  border-bottom: 2px solid #080734;
  -webkit-transition: all 40ms ease;
  transition: all 40ms ease;
  cursor: pointer;
}

.faq-single-block:hover {
  background-color: hsla(0, 0%, 100%, 0.18);
  color: #000;
}

.faq-single-block.last-block {
  border-bottom-style: none;
}

.faq-title {
  margin-bottom: 0px;
  font-weight: 500;
}

.faq-description {
  display: none;
  margin-top: 18px;
}

.faq-title-container {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
}

.left-faq {
  position: absolute;
  left: 0%;
  top: 0%;
  right: auto;
  bottom: 0px;
  background-image: url('../images/left-faq.png');
  background-position: 0% 100%;
  background-size: contain;
  background-repeat: no-repeat;
  -webkit-transition: all 280ms ease;
  transition: all 280ms ease;
}

.left-faq-image {
  height: 100%;
  opacity: 0;
  -webkit-transition: all 280ms ease;
  transition: all 280ms ease;
}

.faq-smoke {
  height: 49%;
  margin-left: -16%;
}

.faq-smoke.right-smoke {
  z-index: -1;
  height: 50%;
  margin-top: -7%;
  margin-right: -2.5%;
  margin-left: 0px;
}

.right-faq {
  position: absolute;
  left: auto;
  top: 0%;
  right: 0%;
  bottom: 0%;
  background-image: url('../images/right-faq.png');
  background-position: 100% 100%;
  background-size: contain;
  background-repeat: no-repeat;
  -webkit-transition: all 280ms ease;
  transition: all 280ms ease;
}

.roadmap-stages {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
}

.navbar {
  position: fixed;
  left: 0%;
  top: 0%;
  right: 0%;
  bottom: auto;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  padding: 18px 24px 18px 22px;
  -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;
  background-color: transparent;
  background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(41, 11, 98, 0.42)), to(rgba(65, 25, 111, 0.38)));
  background-image: linear-gradient(180deg, rgba(41, 11, 98, 0.42), rgba(65, 25, 111, 0.38));
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
}

.navbar.mint-navbar {
  position: absolute;
  background-image: none;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}

.social-button {
  position: relative;
  top: 0px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  margin-left: 8px;
  padding: 4px;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  border-style: solid;
  border-width: 1px;
  border-color: #080734;
  border-radius: 100px;
  background-image: linear-gradient(135deg, #4e339f, #9761da);
  box-shadow: 0 2px 4px 0 rgba(0, 0, 0, 0.18);
  -webkit-transition: all 180ms ease;
  transition: all 180ms ease;
  color: #fff;
  font-size: 14px;
  font-weight: 400;
  letter-spacing: 1px;
  text-decoration: none;
  text-transform: uppercase;
}

.social-button:hover {
  top: -2px;
  box-shadow: 0 8px 12px 0 rgba(0, 0, 0, 0.2);
  -webkit-transform: scale(1.04);
  -ms-transform: scale(1.04);
  transform: scale(1.04);
}

.social-button.disabled {
  background-color: #a5a5a5;
  background-image: none;
  box-shadow: none;
  opacity: 1;
}

.social-button.disabled:hover {
  top: 0px;
  -webkit-transform: none;
  -ms-transform: none;
  transform: none;
}

.symbol {
  width: 22px;
}

.nav-menu {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
}

.symbol-container {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  width: 42px;
  height: 42px;
  -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;
  border-radius: 100px;
  background-color: #270a61;
}

.symbol-container.disabled-button {
  background-color: #636363;
}

.logo {
  height: 24px;
}

.navbar-container {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -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;
  -webkit-box-flex: 1;
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
}

.headline-container {
  position: relative;
  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;
}

.footer-image {
  width: 100%;
}

.team-member-image {
  width: 100%;
}

.coming-soon-label {
  position: absolute;
  top: 10px;
  right: -28px;
  display: inline-block;
  padding-right: 36px;
  padding-left: 42px;
  -webkit-box-align: center;
  -webkit-align-items: center;
  -ms-flex-align: center;
  align-items: center;
  background-color: #270a61;
  box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.18);
  -webkit-transform: rotate(30deg);
  -ms-transform: rotate(30deg);
  transform: rotate(30deg);
  color: #fff;
  font-size: 12px;
  letter-spacing: 1px;
  text-transform: uppercase;
}

.button-container {
  position: relative;
  overflow: hidden;
  border-radius: 1000px;
  box-shadow: 0 4px 24px 0 rgba(0, 0, 0, 0.08), 0 2px 6px 0 rgba(0, 0, 0, 0.12);
  -webkit-transition: all 120ms ease;
  transition: all 120ms ease;
}

.button-container:hover {
  box-shadow: 1px 1px 3px 0 rgba(0, 0, 0, 0.32);
}

.button-container.mint-button {
  margin-right: auto;
  margin-left: auto;
}

.social-button-linkedin {
  position: absolute;
  left: auto;
  top: 12px;
  right: 12px;
  bottom: auto;
  border-radius: 100px;
  -webkit-transition: all 180ms ease;
  transition: all 180ms ease;
  font-size: 14px;
  font-weight: 400;
  letter-spacing: 1px;
  text-decoration: none;
  text-transform: uppercase;
}

.symbol-small-container {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  width: 42px;
  height: 42px;
  -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;
  border-radius: 100px;
  background-color: #270a61;
  background-image: linear-gradient(135deg, #edffa5, #9ee542);
  box-shadow: 0 7px 17px 0 rgba(39, 10, 97, 0.2);
}

.sticky-section {
  position: -webkit-sticky;
  position: sticky;
  top: 82px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  overflow: hidden;
  max-width: 100vw;
  min-height: 100vh;
  padding-top: 18px;
  -webkit-box-orient: vertical;
  -webkit-box-direction: normal;
  -webkit-flex-direction: column;
  -ms-flex-direction: column;
  flex-direction: column;
  background-image: -webkit-gradient(linear, left top, left bottom, from(#32078a), to(#30ae98));
  background-image: linear-gradient(180deg, #32078a, #30ae98);
}

.advisors {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  width: 100%;
  -webkit-box-pack: center;
  -webkit-justify-content: center;
  -ms-flex-pack: center;
  justify-content: center;
}

.alredy-minted {
  margin-top: 12px;
  color: #fff;
  font-size: 12px;
  letter-spacing: 1px;
  text-transform: uppercase;
}

.alredy-minted.wallet-address {
  margin-top: 2px;
}

.toggle-container {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  margin-bottom: 18px;
  border-style: solid;
  border-width: 1px;
  border-color: #080734;
  border-radius: 100px;
  background-color: hsla(0, 0%, 100%, 0.56);
  -webkit-backdrop-filter: blur(5px);
  backdrop-filter: blur(5px);
}

.toggle-text {
  padding: 8px 18px;
  border-radius: 100px;
  -webkit-transition: all 80ms ease;
  transition: all 80ms ease;
  letter-spacing: 0.6px;
  text-transform: uppercase;
  cursor: pointer;
}

.toggle-text:hover {
  background-color: hsla(0, 0%, 100%, 0.18);
}

.toggle-text.active-toggle {
  background-color: #fff;
  box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.18);
}

.mint-button-container {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  min-height: 208px;
  -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;
}

@media screen and (min-width: 1920px) {
  .section.hero {
    max-height: 100vh;
    padding-top: 4vh;
  }

  .section.story-section {
    overflow: hidden;
  }

  .section.team-section {
    overflow: hidden;
  }

  .section.roadmmap-section {
    position: -webkit-sticky;
    position: sticky;
  }

  .section.final-section {
    overflow: hidden;
  }

  .section.faq-section {
    overflow: hidden;
  }

  .section.mint-hero {
    padding-top: 4vh;
  }

  .container {
    max-width: 1240px;
  }

  .container.roadmap-container-sticky {
    position: -webkit-sticky;
    position: sticky;
    top: 82px;
  }

  .hero-headline {
    max-height: 19vh;
    max-width: none;
    margin-top: 64px;
  }

  .chrachters {
    height: 100%;
    max-height: 74vh;
    max-width: none;
    margin-top: 68px;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
  }

  .button {
    padding: 24px 48px;
    font-size: 24px;
  }

  .team-name {
    font-size: 42px;
    line-height: 50px;
  }

  .navbar {
    width: 100vw;
  }

  .sticky-section {
    top: 238px;
  }
}

@media screen and (max-width: 991px) {
  .section.story-section {
    background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.42)), to(rgba(0, 0, 0, 0.42))), url('../images/skeleton.png'), url('../images/professor-bg.png'), radial-gradient(circle farthest-side at 50% 100%, #59ff9b, #56186c);
    background-image: linear-gradient(180deg, rgba(0, 0, 0, 0.42), rgba(0, 0, 0, 0.42)), url('../images/skeleton.png'), url('../images/professor-bg.png'), radial-gradient(circle farthest-side at 50% 100%, #59ff9b, #56186c);
    background-position: 0px 0px, 0% 100%, 100% 100%, 0px 0px;
    background-size: auto, auto 100%, auto 100%, auto;
    background-repeat: repeat, no-repeat, no-repeat, repeat;
  }

  .section.mint-hero {
    background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(39, 10, 97, 0.24)), to(rgba(252, 132, 211, 0.24))), url('../images/skeleton.png'), -webkit-gradient(linear, left top, left bottom, from(#270a61), to(#fc84d3));
    background-image: linear-gradient(180deg, rgba(39, 10, 97, 0.24), rgba(252, 132, 211, 0.24)), url('../images/skeleton.png'), linear-gradient(180deg, #270a61, #fc84d3);
    background-position: 0px 0px, 50% 100%, 0px 0px;
    background-size: auto, auto 120%, auto;
    background-repeat: repeat, no-repeat, repeat;
  }

  .container.story-container {
    max-width: 100%;
    min-width: 100%;
  }

  .container.mint-container {
    max-width: 100vw;
    -webkit-box-flex: 1;
    -webkit-flex: 1;
    -ms-flex: 1;
    flex: 1;
  }

  .hero-headline {
    max-width: 95%;
  }

  .button {
    font-size: 18px;
  }

  .team-members-container {
    padding-right: 1.5%;
    padding-left: 1.5%;
  }

  .team-name {
    font-size: 32px;
    line-height: 40px;
  }

  .navbar {
    padding-right: 24px;
  }

  .alredy-minted.wallet-address {
    margin-top: 2px;
  }

  .mint-button-container {
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start;
  }
}

@media screen and (max-width: 767px) {
  .section.hero {
    max-height: none;
    min-height: auto;
    padding-top: 82px;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start;
  }

  .section.story-section {
    background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.36)), to(rgba(0, 0, 0, 0.36))), url('../images/skeleton.png'), radial-gradient(circle farthest-side at 50% 100%, #59ff9b, #56186c);
    background-image: linear-gradient(180deg, rgba(0, 0, 0, 0.36), rgba(0, 0, 0, 0.36)), url('../images/skeleton.png'), radial-gradient(circle farthest-side at 50% 100%, #59ff9b, #56186c);
    background-position: 0px 0px, 0% 100%, 0px 0px;
    background-size: auto, auto 100%, auto;
    background-repeat: repeat, no-repeat, repeat;
  }

  .section.mint-hero {
    padding-top: 82px;
    -webkit-box-pack: start;
    -webkit-justify-content: flex-start;
    -ms-flex-pack: start;
    justify-content: flex-start;
  }

  .hero-headline {
    display: none;
    margin-bottom: 8px;
  }

  .hero-headline.mobile-headline {
    display: block;
    max-height: none;
    max-width: 360px;
    -webkit-box-ordinal-group: 0;
    -webkit-order: -1;
    -ms-flex-order: -1;
    order: -1;
  }

  .chrachters {
    max-height: none;
    max-width: 130vw;
    min-width: 130vw;
    margin-bottom: -36px;
  }

  .absolute-left {
    left: -7%;
    width: 60vw;
    opacity: 0.36;
  }

  .absolute-right {
    right: -7%;
    width: 60vw;
    opacity: 0.36;
  }

  .headline {
    font-size: 64px;
    line-height: 76px;
  }

  .headline.big-headline {
    font-size: 68px;
    line-height: 78px;
  }

  .headline.big-headline.final-headline {
    margin-bottom: 36px;
  }

  .team-members-container {
    -webkit-box-align: stretch;
    -webkit-align-items: stretch;
    -ms-flex-align: stretch;
    align-items: stretch;
  }

  .team-block {
    width: 48%;
  }

  .team-block.tilt-left.hide-desktop {
    display: block;
  }

  .team-block.tilt-right.hide-desktop {
    display: block;
  }

  .team-p {
    margin-top: 18px;
  }

  .roadmap-content.first-content {
    margin-left: 0px;
  }

  .roadmap-text {
    max-width: 520px;
    padding-right: 32px;
    padding-left: 32px;
  }

  .roadmap-text.less-width-text {
    max-width: 520px;
    padding-right: 32px;
    padding-left: 32px;
  }

  .faq-block {
    width: 100%;
  }

  .faq-title {
    font-weight: 400;
  }

  .left-faq {
    display: none;
  }

  .right-faq {
    display: none;
  }

  .advisors {
    display: none;
  }
}

@media screen and (max-width: 479px) {
  .section {
    padding-top: 64px;
    padding-bottom: 64px;
  }

  .section.hero {
    padding-top: 92px;
  }

  .section.mint-hero {
    padding-top: 92px;
  }

  .container.story-container {
    margin-top: 64px;
    margin-bottom: 64px;
  }

  .hero-headline.mobile-headline {
    width: 100%;
    max-width: 90vw;
    margin-top: 36px;
    margin-bottom: 12px;
  }

  .chrachters {
    margin-top: 64px;
  }

  .story-p.final-one {
    font-size: 16px;
  }

  .team-members-container {
    margin-top: -12px;
    padding-right: 0%;
    padding-left: 0%;
  }

  .team-block {
    width: 48%;
    margin-bottom: 12px;
  }

  .team-name {
    margin-bottom: 4px;
    font-size: 28px;
    line-height: 36px;
  }

  .team-member-info {
    font-size: 14px;
  }

  .team-image.image-bottom-left {
    left: -18px;
    bottom: 18px;
  }

  .team-image.image-top-right {
    top: 38%;
    right: -82px;
    max-height: 220px;
    max-width: 220px;
  }

  .team-image.image-top-left {
    left: -83px;
    top: 18%;
  }

  .team-image.image-bottom-right {
    right: -82px;
    bottom: 15%;
  }

  .team-p {
    font-size: 16px;
  }

  .roadmap-content.last-content {
    margin-left: 24px;
  }

  .lottie-animation {
    width: 175vw;
  }

  .roadmap-title {
    margin-bottom: 12px;
  }

  .roadmap-text {
    padding-right: 0px;
    padding-left: 0px;
    font-size: 16px;
    line-height: 26px;
  }

  .roadmap-text.less-width-text {
    padding-right: 0px;
    padding-left: 0px;
  }

  .roadmap-container {
    margin-top: -18px;
  }

  .bottom-image.image-3 {
    width: 320px;
    margin-right: -124px;
    margin-left: -148px;
  }

  .bottom-image.image-4 {
    display: none;
    width: 180px;
    margin-right: 0px;
    margin-left: 0px;
  }

  .bottom-image.image-2 {
    width: 250px;
    margin-left: 0px;
  }

  .bottom-image.image-3 {
    width: 320px;
    margin-right: -24px;
  }

  .bottom-image.image-2 {
    width: 250px;
    margin-right: -107px;
    margin-left: 0px;
  }

  .bottom-image.image-4 {
    width: 180px;
    margin-right: 0px;
    margin-left: -174px;
  }

  .text-center {
    position: relative;
    z-index: 1;
    max-width: 100vw;
    margin-bottom: -75px;
    padding-right: 24px;
    padding-left: 24px;
  }

  .faq-title {
    width: 100%;
    margin-right: 18px;
    font-size: 18px;
    line-height: 26px;
  }

  .navbar {
    padding: 18px;
  }

  .social-button {
    margin-left: 12px;
  }

  .footer-image {
    max-width: 150vw;
    min-width: 150vw;
    margin-top: 24px;
  }

  .social-button-linkedin {
    margin-left: 12px;
  }

  .sticky-section {
    top: 90px;
  }

  .advisors {
    grid-auto-columns: 1fr;
    grid-column-gap: 16px;
    grid-row-gap: 16px;
    -ms-grid-columns: 1fr 1fr;
    grid-template-columns: 1fr 1fr;
    -ms-grid-rows: auto auto;
    grid-template-rows: auto auto;
  }
}

@font-face {
  font-family: 'Material Icons';
  src: url('../fonts/MaterialIcons-Regular.woff') format('woff');
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}