@font-face {
  font-family: "aldrichrus";
  src: local("aldrichrus"), url("../fonts/aldrichrus.ttf") format("opentype") tech(color-COLRv1), url("../fonts/aldrichrus.woff2") format("woff");
}
body {
  color: #fff;
  background: #0f1017 url("https://launchpad.artyfact.game/static/assets/images/content/buy_arty_bg.jpg") top center/cover no-repeat;
  font-family: aldrichrus;
}

.wrapper {
  margin: 0 auto;
  display: flex;
  align-items: center;
  flex-direction: column;
}
.wrapper .main-title {
  font-size: 50px;
  margin-bottom: 125px;
}
@media screen and (max-width: 768px) {
  .wrapper .main-title {
    text-align: center;
  }
}

.main-block {
  border: 1px solid rgb(248, 169, 50);
  border-radius: 30px;
  width: 470px;
  height: 630px;
  background: #171717;
  padding: 50px 40px;
  padding-top: 100px;
  margin-bottom: 50px;
  position: relative;
}
.main-block::before {
  top: -50%;
  left: calc(50% - 175px);
  transform: translateY(60%);
  content: "";
  background: #fff;
  display: block;
  width: 350px;
  height: 350px;
  position: absolute;
  background: url("https://launchpad.artyfact.game/static/assets/images/content/portal_arty_logo.png") top center/cover no-repeat;
}
@media screen and (max-width: 768px) {
  .main-block {
    width: 80%;
  }
}

.claim-block {
  margin-top: 30px;
  padding-bottom: 30px;
  font-size: 20px;
  display: flex;
  gap: 20px;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  text-align: center;
}
.claim-block .reward-amount {
  background: #171717;
  color: #606060;
  width: 100%;
  padding: 25px 0;
  font-size: 26px;
  font-weight: bold;
  border: 2px solid #606060;
  border-radius: 9999px;
}
.claim-block .claim-button {
  width: 100%;
  color: #fff;
  cursor: pointer !important;
  font-family: aldrichrus;
  border-radius: 9999px;
  font-size: 26px;
  background: #8b620c;
  border: 2px solid #ffc733;
  box-shadow: inset 0 0 30px 6px #ffc733;
  padding: 25px 25px;
}
.claim-block .claim-button:hover {
  background: #f8a932;
}
@media screen and (max-width: 768px) {
  .claim-block .claim-button {
    margin-top: 20px;
  }
}
@media screen and (max-width: 768px) {
  .claim-block {
    font-size: 25px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
  }
}
@media screen and (max-width: 500px) {
  .claim-block {
    font-size: 20px;
  }
}

.vesting-periods {
  text-align: center;
  margin-top: 30px;
}
.vesting-periods .title {
  font-size: 20px;
}
.vesting-periods .table-wrapper {
  background: #242632;
  border-radius: 15px;
  padding: 15px 20px;
  overflow: hidden;
}
@media screen and (max-width: 768px) {
  .vesting-periods .table-wrapper {
    text-align: center;
  }
}
.vesting-periods .table-wrapper .header,
.vesting-periods .table-wrapper .content {
  display: grid;
  grid-template-columns: 1fr 1fr 1fr;
}
.vesting-periods .table-wrapper .header {
  color: #b0adb4;
  padding-bottom: 10px;
}
.vesting-periods .table-wrapper .content {
  max-height: 200px;
  overflow: scroll;
  padding-top: 15px;
  row-gap: 20px;
}

.separator {
  height: 1px;
  width: 100%;
  background: #b0adb4;
  opacity: 0.3;
}

.color-font {
  color: #ffbb0e;
}/*# sourceMappingURL=main.css.map */