/* Project Name: Farming Tales
 Author: hakkav
 Contact: twitter.com/hakkav_
 Discord: Hakkav#6371
 Email: grimmjow.nz@gmail.com
 If you need a web site do not hesitate to contact me. */

@charset 'UTF-8';
@import url(https://fonts.googleapis.com/css2?family=Rubik:ital,wght@0,300;0,400;0,500;0,700;0,800;0,900;1,300;1,500;1,600);
@import url(https://fonts.googleapis.com/css2?family=Nunito:ital,wght@0,400;0,500;0,600;0,700;0,800;0,900;1,700;1,800);

a {
  color: inherit;
  text-decoration: none;
  text-transform: none
}

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

.header_ft,
header {
  align-items: center;
  display: flex
}

.header_ft nav>:nth-child(n+1),
.res_menu nav>* {
  font-weight: 600;
  font-family: Rubik, sans-serif
}

.bc_jungle a,
.button img {
  transition: opacity .3s
}

.button,
.concept-art,
.res_menu nav>* {
  font-family: Rubik, sans-serif
}

.section-title .earn,
h2 {
  -webkit-text-fill-color: transparent
}

#first_bg,
#pearn-bg {
  background-position: center center;
  background-size: cover
}

ul,
ul[roavp_] {
  padding: 0;
  list-style: none
}

#first_bg,
#pearn-bg,
.header_ft,
footer {
  background-size: cover
}

#loading,
body {
  background-color: #242011
}

header {
  justify-content: center;
  padding: 0 2.125em;
  position: fixed;
  width: 100%;
  z-index: 200
}

@media screen and (min-width:1441px) {
  header {
    padding: 0 13.75em
  }
}

@media screen and (max-width:1080px) {
  header {
    font-size: 1.11111111vw
  }
}

@media screen and (max-width:698px) {
  .button:before {
    width: 0 !important
  }

  header {
    font-size: inherit;
    padding: 0;
    max-width: 100% !important
  }
}

.header_ft {
  background-image: url(../img/assets/header-bg.png);
  justify-content: space-between;
  height: 90px;
  width: 1200px;
  padding-left: 28px;
  padding-right: 28px;
  padding-bottom: 20px
}

.header_ft nav,
.header_ft>a {
  align-items: center;
  display: flex
}

.header_ft>a {
  justify-content: center
}

.header_ft nav a {
  position: relative
}

.header_ft nav>:nth-child(n+1) {
  display: inline-block;
  font-size: 18px;
  margin: 0 .86em;
  text-transform: uppercase;
  transition: opacity .3s, transform .3s, -webkit-transform .3s
}

.header_ft nav>:nth-child(n+1):hover {
  opacity: .8;
  -webkit-transform: translateY(-2px);
  transform: translateY(-2px)
}

.daap_buttons {
  align-items: center;
  display: flex;
  justify-content: flex-end
}

.daap_buttons>:last-child,
.daap_buttons>:nth-child(2) {
  margin-left: .2em
}

@media screen and (min-width:577px)and (max-width:1080px) {
  .daap_buttons .button-medium {
    height: 3rem;
    width: 9.875rem
  }

  .daap_buttons .button-small {
    height: 3rem;
    width: 6.4375rem
  }
}

.header_grid {
  cursor: pointer;
  display: none;
  margin-left: auto;
  font-size: 26px
}

.res_menu {
  --menu-transition: 0.3s linear;
  align-items: center;
  background-color: #261e19;
  bottom: 0;
  display: none;
  flex-direction: column;
  height: 100vh;
  justify-content: flex-start;
  left: 0;
  opacity: 0;
  overflow-y: auto;
  padding: 6.25rem 2.125rem 2.125rem;
  position: fixed;
  right: 0;
  top: 0;
  transition: opacity var(--menu-transition), visibility var(--menu-transition), -webkit-transform var(--menu-transition);
  transition: transform var(--menu-transition), opacity var(--menu-transition), visibility var(--menu-transition);
  transition: transform var(--menu-transition), opacity var(--menu-transition), visibility var(--menu-transition), -webkit-transform var(--menu-transition);
  visibility: hidden;
  width: 100vw;
  z-index: 140
}

.res_menu nav,
.stinvp {
  display: flex;
  width: 100%
}

.res_menu nav {
  align-items: center;
  flex-direction: column;
  justify-content: flex-start;
  margin-top: 2.6875rem
}

.res_menu nav>* {
  font-size: 24px
}

.res_menu nav a {
  display: inline-block;
  margin: 0 0 20px;
  padding: 10px 0;
  position: relative;
  text-transform: uppercase
}

.res_menu nav a:last-child {
  margin: 0
}

.res_menu nav a span {
  left: 50%;
  position: absolute;
  top: -7px;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%)
}

.res_menu nav a span.soon {
  background-color: #fed201;
  color: #000;
  font-size: 12px;
  line-height: 1;
  padding: 2px 2px 1px;
  pointer-events: none
}

.res_menu .select-lang__content {
  background: 0 0;
  border: none;
  box-shadow: none
}

.stinvp {
  align-items: flex-start;
  justify-content: space-around;
  margin-top: 40px
}

.res_menu.active {
  opacity: 1;
  visibility: visible
}

.btn-smob {
  display: block;
  margin-left: auto;
  margin-right: auto
}

.bc_jungle,
.button {
  display: flex;
  z-index: 1
}

.stinvp .controls-wrapper>:not(:first-child) {
  margin-top: 1.4375rem
}

.button:disabled {
  cursor: default;
  opacity: .5;
  pointer-events: none
}

.ft-link:hover {
  background: #562b03;
  border-radius: 10px;
  box-shadow: inset 0 4px 4px rgb(0 0 0 / 25%);
  color: #e9bd6f;
  padding: .5rem
}

.button {
  align-items: center;
  background: 0 0;
  border: none;
  box-shadow: none;
  font-weight: 800;
  justify-content: center;
  outline: 0;
  position: relative;
  text-decoration: none;
  transition: transform .3s;
  transition: transform .3s, -webkit-transform .3s
}

.button:before {
  background: url(../img/assets/browsp.png) 50%/contain no-repeat;
  content: "";
  pointer-events: none;
  -webkit-transform: scale(3);
  transform: scale(3)
}

.button img,
.button:before {
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: -1
}

.background_ft,
.bc_jungle,
.ft-story,
.section-title,
.section-title h2 {
  position: relative
}

.button img {
  max-height: 100%;
  max-width: 100%;
  min-height: 100%;
  min-width: 100%
}

.bc_jungle a:hover,
.button:hover>img {
  opacity: .7
}

.button-small {
  font-size: 18px;
  height: 2.438rem;
  width: 6.75rem
}

.button-medium {
  font-size: 18px;
  height: 2.68rem;
  width: 10.5rem
}

.button-big {
  font-size: 30px;
  height: 50px;
  width: 188px
}

.background_ft {
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none;
  width: 100%
}

.background_ft img {
  height: auto;
  width: 100%
}

.bc_jungle {
  flex-direction: column;
  margin-top: -.9375rem;
  width: 100%
}

.bc_jungle .bc_row,
.ft-story {
  align-items: center;
  display: flex
}

.bc_jungle .bc_row {
  flex-wrap: wrap;
  justify-content: center
}

.bc_jungle .bc_row>.button {
  margin: 0 auto
}

.bc_jungle .bc_row>a {
  height: 5rem;
  position: relative;
  width: 11.25rem
}

@media screen and (max-width:1080px) {
  .header_ft nav>:nth-child(n+1) {
    font-size: 14px;
    margin: 0 .75em
  }

  .daap_buttons>:last-child,
  .daap_buttons>:nth-child(2) {
    margin-left: 1.25em
  }

  .blog-slider__content>img {
    max-width: 300px !important;
    margin-top: 50px !important
  }

  .button-medium,
  .button-small {
    font-size: 16px
  }

  .button-big {
    font-size: 20px;
    height: 34px;
    width: 128px
  }

  .bc_jungle .bc_row>a {
    height: 3.75rem;
    width: 9.375rem
  }
}

.bg-infoabout {
  background: #785e45 !important;
  border-radius: 62px 60px 50px 50px !important;
  padding: 20px !important
}

.about_content,
.inverstor__inner {
  background-repeat: no-repeat;
  background-position: 50%
}

@media screen and (max-width:576px) {
  .concept-art__content-bg img {
    width: 100%;
    height: 200px !important;
    left: 20% !important;
    margin-top: 100px !important
  }

  .button-medium {
    height: 3rem;
    width: 9.875rem
  }

  .button:before {
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 0%;
    z-index: -1
  }

  .button-big {
    font-size: 15px;
    height: 2.25rem;
    width: 11rem
  }

  .bc_jungle .bc_row>a {
    height: 2.5rem;
    width: 8.75rem
  }

  .bc_jungle .bc_row img {
    top: 150% !important
  }

  .about_content {
    padding: 160px 40px 30px !important
  }

  .bc_jungle>:nth-child(2) a:first-child {
    margin: 0 calc(50% - 4.6875rem) .625rem
  }
}

.bc_jungle .bc_row img {
  height: auto;
  left: 50%;
  position: absolute;
  top: 50%;
  -webkit-transform: translate(-50%, -50%) scale(1.5);
  transform: translate(-50%, -50%) scale(1.5);
  width: 68%
}

.bc_jungle>:first-child {
  padding: 0 3.75rem
}

@media screen and (min-width:1441px) {
  .bc_jungle>:first-child {
    padding: 0 17.5rem
  }

  .team__background {
    margin-top: -3.125rem
  }
}

.bc_jungle>:nth-child(2) {
  margin-top: 2.8125rem
}

.bc_jungle .footer-background {
  height: auto;
  left: 0;
  pointer-events: none;
  position: absolute;
  top: 0;
  -webkit-transform: translateY(-3.4375rem);
  transform: translateY(-3.4375rem);
  width: 100%;
  z-index: -1
}

@media screen and (max-width:1080px) {
  .bc_jungle>:first-child {
    padding: 0 1.25rem
  }

  .bc_jungle>:nth-child(2) {
    margin-top: 1.5625rem
  }

  .bc_jungle .footer-background {
    -webkit-transform: translateY(-2.8125rem);
    transform: translateY(-2.8125rem)
  }
}

.ft-story {
  flex-direction: column;
  justify-content: flex-start;
  margin-top: -98px
}

.section-title,
.why {
  align-items: center;
  display: flex
}

.section-title {
  flex-direction: column;
  justify-content: center;
  margin-bottom: 2.8125rem;
  text-transform: uppercase;
  text-align: center
}

.section-title h2 {
  letter-spacing: -.75px
}

.section-title .earn {
  background: -webkit-linear-gradient(#362d22, #875037);
  -webkit-background-clip: text
}

.section-title h2:before {
  content: url(../img/earn/div2.png);
  height: 6.4rem;
  left: 50%;
  position: absolute;
  top: -.12rem;
  -webkit-transform: translate(-50%);
  transform: translate(-50%)
}

.why {
  justify-content: center;
  margin-top: 9.375rem
}

.about_content,
.about_info {
  align-items: center;
  display: flex;
  z-index: 1;
  position: relative
}

.why .section-title {
  margin: 0 0 94px
}

.about_info {
  flex-direction: column;
  justify-content: center
}

.about_info>p {
  font-family: Nunito, sans-serif;
  font-size: 20px;
  font-weight: 500;
  line-height: 140%;
  max-width: 44rem;
  text-align: center
}

@media screen and (max-width:576px) {
  .bc_jungle .footer-background {
    -webkit-transform: translateY(-1.6875rem);
    transform: translateY(-1.6875rem)
  }

  .section-title {
    margin-bottom: 2.5rem !important
  }

  .section-title h2 {
    white-space: nowrap !important;
    font-size: 25px !important
  }

  .why {
    margin-top: 60px !important
  }

  .why .section-title {
    margin: -75px 0 94px
  }

  .about_content,
  .about_info {
    background-position: 10% 135% !important;
    background-repeat: no-repeat;
    background-size: contain;
    display: flex;
    position: relative;
    z-index: 1
  }

  .about_content {
    align-items: center;
    justify-content: center;
    width: 100% !important
  }

  .about_info {
    align-items: center;
    justify-content: center;
    width: 100%
  }

  .about_info>p {
    font-size: 15px
  }
}

.about_content {
  background-image: url(../img/about/tabout.png);
  background-size: contain;
  justify-content: center;
  padding: 114px 80px 180px;
  width: 100%
}

.concept-art,
.preview_vd {
  align-items: center;
  display: flex
}

.preview_vd {
  justify-content: center;
  padding-bottom: 40px
}

.concept-art {
  flex-direction: column;
  font-weight: 400;
  position: relative;
  width: 100%;
  z-index: 10
}

.concept-art__content,
.team__content {
  align-items: center;
  width: 100%;
  display: flex
}

.concept-art__content {
  flex-direction: column;
  padding: 14.375rem 0 38.75rem;
  text-align: center;
  z-index: 1
}

.concept-art__content img {
  height: auto;
  width: 17.8125rem
}

.concept-art__content>p,
ul {
  color: #482202;
  font-family: Nunito, sans-serif;
  font-size: 22px;
  font-weight: 700
}

@media screen and (max-width:808px) {

  .concept-art__content>p,
  ul {
    color: #d3c9c1;
    margin-top: 35px !important
  }

  .section-title .earn {
    background: -webkit-linear-gradient(#ffce6b, #eddcbc);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent
  }
}

.concept-art__content-bg {
  left: 50%;
  position: absolute;
  top: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  z-index: -1
}

.concept-art__content-bg img {
  height: auto;
  width: 71rem
}

@media screen and (max-width:1080px) {
  .concept-art__content {
    padding: 14rem 0 16rem
  }

  .concept-art__content img {
    width: 15.625rem
  }

  .concept-art__content>p,
  ul {
    margin-top: -1.875rem;
    width: 28rem
  }

  .concept-art__content-bg img {
    width: 50rem
  }

  .team__content {
    padding-top: 60px;
    padding-bottom: 60px
  }
}

@media screen and (min-width:577px) and (max-width:808px) {
  .concept-art__content-bg img {
    width: 100%;
    height: 240px !important;
    left: 20% !important;
    margin-top: 580px !important
  }
}

body,
button,
h2,
p,
ul {
  margin: 0
}

.team {
  position: relative;
  width: 100%;
  z-index: 15
}

.team__background {
  height: 100%;
  pointer-events: none;
  position: absolute;
  width: 100%
}

.team__content {
  flex-direction: column;
  padding-top: 60px;
  padding-bottom: 60px
}

@media screen and (min-width:1441px) {
  .team__content {
    padding-top: 60px;
    padding-bottom: 60px
  }
}

.inverstor__inner {
  align-items: center;
  background-size: contain;
  display: flex;
  justify-content: center;
  max-width: 1200px;
  padding: 114px 80px 180px;
  position: relative;
  width: 100%;
  z-index: 1
}

.inverstor__items {
  display: flex;
  width: 100%;
  flex-wrap: wrap;
  justify-content: center
}

.inverstor__item {
  align-items: center;
  display: flex;
  height: 100px;
  justify-content: center;
  max-width: 224px
}

.inverstor__item img {
  object-fit: contain;
  width: 70%
}

@media(max-width:991.98px) {
  .inverstor__inner {
    padding: 8px 45px 16px
  }

  .inverstor__items {
    margin: 10px
  }

  .inverstor__item {
    height: 80px;
    margin: 2px;
    max-width: 100%;
    width: calc(34% - 26px)
  }

  .inverstor__item img {
    height: 100%;
    width: 100%
  }
}

@media(max-width:575.98px) {
  .inverstor__inner {
    padding-bottom: 90px;
    padding-left: 30px;
    padding-right: 30px
  }

  .inverstor__item {
    height: 94px
  }
}

.rc-slider-handle:focus-visible {
  border-color: #2db7f5;
  box-shadow: 0 0 0 3px #96dbfa
}

button {
  font-family: inherit;
  font-size: 100%;
  line-height: 1.15
}

.menu-item,
.roadmap-item[roavp_] h5[roavp_],
h2 {
  font-family: Rubik, sans-serif
}

h2,
h2.h2-xs {
  font-size: 40px
}

* {
  box-sizing: border-box
}

body {
  color: #fff
}

.menu-item,
.uppc,
h2 {
  text-transform: uppercase
}

h2,
p {
  padding: 0
}

h2 {
  font-weight: 700;
  line-height: 130%;
  background: -webkit-linear-gradient(#ffce6b, #eddcbc);
  -webkit-background-clip: text
}

#first_bg,
#pearn-bg,
.social-icon,
footer {
  background-repeat: no-repeat
}

@media screen and (max-width:576px) {
  .preview_vd {
    padding: 0
  }

  .concept-art {
    margin-top: 0
  }

  .concept-art__content>p,
  ul {
    margin-top: 0;
    width: 18.75rem
  }

  .concept-art__content-bg img {
    width: 100%;
    height: 220px !important
  }

  .concept-art__content-bg {
    left: 33% !important;
    top: 80% !important
  }

  .team__content {
    padding-top: 60px;
    padding-bottom: 60px
  }

  .videft .thumbnail {
    position: relative;
    background-size: contain;
    width: 650px !important;
    height: 491px
  }

  .videft .thumbnail .play-but {
    top: calc(50% - (250px / 2)) !important
  }

  h2 {
    font-size: 30px
  }
}

.copyright,
h5 {
  font-size: 18px
}

img {
  -webkit-user-select: none;
  -ms-user-select: none;
  user-select: none
}

#first_bg {
  background-image: linear-gradient(180deg, rgba(46, 21, 17, .36), rgba(32, 28, 24, .86)), url(../img/backgd/home-banner.jpg);
  width: 100%
}

#pearn-bg {
  background-image: linear-gradient(180deg, rgba(0, 0, 0, .16), rgba(25, 30, 35, .8)), url(../img/backgd/fearn.jpg);
  width: 100%
}

.block,
section {
  display: block
}

.vp_bqYKR {
  padding-bottom: 180px
}

.vp_bqYKR .vp_2hWN5 {
  display: flex;
  flex-direction: row;
  align-items: center;
  margin: 0 auto;
  width: 100%;
  max-width: 1600px;
  justify-content: center
}

@media(max-width:1670px) {
  .vp_bqYKR .vp_2hWN5 {
    padding-right: 5%;
    padding-left: 5%
  }
}

.vp_bqYKR .vp_2hWN5 .vp_15vKI .vp_3x1gT {
  font-family: Rubik, sans-serif;
  font-size: 60px;
  color: #fff;
  font-weight: 700;
  text-transform: uppercase
}

@media(max-width:1100px) {
  .vp_bqYKR .vp_2hWN5 .vp_15vKI .vp_3x1gT {
    font-size: 70px
  }
}

.vp_bqYKR .vp_2hWN5 .vp_15vKI .vp_30haR {
  font-family: Nunito, sans-serif;
  font-size: 28px;
  line-height: 34px;
  color: #f1eacf;
  white-space: nowrap;
  margin-top: 10px
}

@media(max-width:1360px) {
  .vp_bqYKR .vp_2hWN5 .vp_15vKI .vp_30haR {
    font-size: 18px
  }
}

@media(max-width:1024px) {
  .vp_bqYKR .vp_2hWN5 .vp_15vKI .vp_30haR {
    font-size: 16.5px;
    line-height: 30px
  }
}

@media(max-width:834px) {
  .vp_bqYKR .vp_2hWN5 .vp_15vKI .vp_3x1gT {
    font-size: 46px;
    line-height: 48px
  }

  .vp_bqYKR .vp_2hWN5 .vp_15vKI .vp_30haR {
    font-size: 18px;
    line-height: 28.5px
  }
}

@media(max-width:480px) {
  .vp_bqYKR .vp_2hWN5 .vp_15vKI .vp_30haR {
    font-size: 14px;
    line-height: 24.18px
  }
}

@media(max-width:414px) {
  .vp_bqYKR .vp_2hWN5 .vp_15vKI .vp_3x1gT {
    font-size: 40px;
    line-height: 46px
  }

  .vp_bqYKR .vp_2hWN5 .vp_15vKI .vp_30haR {
    text-align: center;
    white-space: pre-wrap;
    font-size: 14px;
    line-height: 22px
  }
}

.vp_bqYKR .vp_2hWN5 .vp_15vKI .vp_1odtR {
  display: flex;
  flex-direction: row;
  justify-content: space-evenly
}

.vp_bqYKR .vp_2hWN5 .vp_15vKI .st_2Gy9t {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: center;
  margin-top: 20px
}

@media(max-width:946px) {
  .vp_bqYKR .vp_2hWN5 {
    flex-direction: column-reverse;
    align-items: center
  }

  .vp_bqYKR .vp_2hWN5 .vp_15vKI {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center
  }

  .vp_bqYKR .vp_2hWN5 .vp_15vKI .st_2Gy9t {
    grid-gap: 20px;
    gap: 20px
  }
}

@media(max-width:940px) {
  .vp_bqYKR .vp_2hWN5 .vp_15vKI .st_2Gy9t {
    transform: translateX(-2.5%)
  }
}

@media(max-width:550px) {
  .vp_bqYKR .vp_2hWN5 .vp_15vKI .st_2Gy9t {
    transform: translateX(0);
    grid-gap: 15px;
    gap: 15px
  }
}

@media(max-width:360px) {
  .vp_bqYKR .vp_2hWN5 .vp_15vKI .st_2Gy9t {
    grid-gap: 10px;
    gap: 10px
  }
}

.vp_bqYKR .vp_2hWN5 .vp_15vKI .st_2Gy9t .st_3aK0U {
  outline: 0;
  border: none;
  background-color: transparent;
  transition: .2s ease-out
}

.vp_bqYKR .vp_2hWN5 .vp_15vKI .st_2Gy9t .st_3aK0U:hover {
  text-decoration: none;
  transform: scale(1.1)
}

.vp_bqYKR .vp_2hWN5 .vp_15vKI .vp_1odtR a:hover {
  text-decoration: none;
  transform: scale(.9)
}

.vp_bqYKR .vp_2hWN5 .vp_15vKI .st_2Gy9t .st_3aK0U:active {
  transform: translateY(5px)
}

.vp_bqYKR .vp_2hWN5 .lg_29Oy3 {
  margin-left: 20px
}

.vp_bqYKR .vp_2hWN5 .lg_29Oy3 .lg_2Hupy {
  width: 90%;
  background-size: cover;
  background-position: 50%
}

@media(max-width:940px) {
  .vp_bqYKR .vp_2hWN5 .lg_29Oy3 .lg_2Hupy {
    width: 36vw !important
  }
}

@media(max-width:768px) {
  .vp_bqYKR .vp_2hWN5 {
    justify-content: center;
    padding-top: 10px;
    flex-wrap: wrap-reverse
  }

  .vp_bqYKR .vp_2hWN5 .vp_15vKI {
    width: 100%
  }

  .vp_bqYKR .vp_2hWN5 .lg_29Oy3 .lg_2Hupy {
    border-radius: 50px;
    width: 30vw !important;
    margin-bottom: 10%
  }
}

.videft {
  position: relative;
  flex-shrink: 0
}

.videft .thumbnail {
  position: relative;
  background-size: contain;
  width: 800px;
  height: 593px
}

.videft .thumbnail:hover .play-but {
  transform: scale(1.1)
}

.videft .thumbnail .payimg {
  background: url(../img/video/thumbnail.png) 0 0/contain no-repeat;
  width: inherit;
  height: inherit;
  cursor: pointer
}

.videft .thumbnail .play-but {
  position: absolute;
  background: url(../img/video/play_button.png) 0 0/contain no-repeat;
  width: 114.6666666667px;
  height: 114.6666666667px;
  top: calc(50% - (80px / 2));
  left: calc(50% - (140px / 2));
  pointer-events: none;
  transition: transform .25s cubic-bezier(.25, .46, .45, .94)
}

@media only screen and (max-width:1500px) {
  .videft {
    margin: 40px 0 28px
  }
}

@media only screen and (max-width:810px) {
  .videft {
    transform: scale(.6, .6);
    margin: -92px 0 -50px;
    position: relative;
    flex-shrink: 0;
    left: -4px
  }
}

p {
  font-size: 1.0625rem
}

.steps__preview {
  position: relative;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  width: 80px;
  height: 80px;
  margin: 0 auto 20px;
  border-radius: 18px
}

@media only screen and (max-width:767px) {
  .steps__preview {
    margin: 0 0 32px
  }
}

.steps__preview:after,
.steps__preview:before {
  content: "";
  position: absolute;
  top: 50%;
  width: 12px;
  height: 12px;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  border-radius: 50%;
  border: 2px solid #b1b5c3
}

.steps__preview:before {
  left: -36px
}

.steps__preview:after {
  right: -36px
}

.container {
  width: 100%;
  padding-right: 15px;
  padding-left: 15px;
  margin-right: auto;
  margin-left: auto
}

@media(min-width:576px) {
  .container {
    max-width: 540px
  }
}

@media(min-width:768px) {
  .container {
    max-width: 720px
  }
}

@media(min-width:992px) {
  .container {
    max-width: 960px
  }
}

@media(min-width:1200px) {
  .container {
    max-width: 1140px
  }
}

.row.wrapper[roavp_] {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  margin-top: 24px
}

.row {
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
  flex-wrap: wrap;
  margin-right: -15px;
  margin-left: -15px
}

.roadmap-item[roavp_] {
  min-height: 200px;
  min-width: 200px;
  max-width: 320px;
  flex-wrap: wrap;
  margin: 0 16px 32px;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  z-index: 1
}

.roadmap-item[roavp_] h5[roavp_] {
  background: url(../img/rdmap/trunk.png) 0 0/100% 100% no-repeat;
  width: 100%;
  text-align: center;
  padding: 26px 28px;
  font-size: 20px
}

.roadmap-item[roavp_] ul[roavp_] {
  padding: 12px 16px
}

ul[roavp_] {
  margin: 0
}

.roadmap-item[roavp_] ul[roavp_] li[roavp_] {
  font-family: Nunito, sans-serif;
  position: relative;
  padding-left: 28px;
  line-height: 1.5em;
  color: #bfb59a;
  margin-bottom: 4px;
  font-size: 20px
}

.roadmap-item[roavp_] ul[roavp_] li[roavp_]:before {
  content: "";
  position: absolute;
  width: 22px;
  height: 22px;
  border-radius: 4px;
  top: 4px;
  left: 0;
  border: 2px solid #9d8b6c
}

.roadmap-item[roavp_] ul[roavp_] li.selected[roavp_]:after {
  color: #a5a700;
  font-family: fontawesome;
  content: "\f00c";
  position: absolute;
  top: -2px;
  left: 2px;
  font-size: 26px
}

@media(min-width:340px) {
  .row {
    margin-right: -15px;
    margin-left: -10px
  }
}

@media only screen and (min-width:600px) {
  ::-webkit-scrollbar-track {
    border-radius: 0;
    background-color: transparent
  }

  ::-webkit-scrollbar {
    width: 10px;
    height: 10px;
    background-color: #242011
  }

  ::-webkit-scrollbar-thumb {
    border-radius: 0;
    background-color: #b9895a
  }
}

@media(min-width:992px) and (max-width:1199.95px) {
  h2.h2-xs {
    font-size: 2.84rem
  }

  p {
    font-size: 1rem
  }
}

@media(min-width:768px) and (max-width:991.95px) {
  .wide-60 {
    padding-top: 80px;
    padding-bottom: 40px
  }

  h2.h2-xs {
    font-size: 2.65rem
  }

  p {
    font-size: 1.0625rem
  }
}

@media(max-width:767px) {
  .wide-60 {
    padding-top: 80px;
    padding-bottom: 40px
  }
}

@media(min-width:480px) and (max-width:767.95px) {
  .wide-60 {
    padding-top: 80px;
    padding-bottom: 40px
  }

  h2.h2-xs {
    font-size: 2.4rem
  }

  p {
    font-size: 1.125rem
  }
}

@media(min-width:321px) and (max-width:479.95px) {
  .wide-60 {
    padding-top: 80px;
    padding-bottom: 40px
  }

  h2.h2-xs {
    font-size: 2.2rem
  }

  p {
    font-size: 1.125rem
  }

  .section-title h2 {
    font-size: 2.3rem;
    padding: 0 5%
  }

  @media(max-width:320.95px) {
    .wide-60 {
      padding-top: 80px;
      padding-bottom: 40px
    }

    h2.h2-xs {
      font-size: 2.2rem
    }

    p {
      font-size: 1.125rem
    }

    .section-title h2 {
      font-size: 2.3rem;
      padding: 0 5%
    }
  }
}

.wide-60 {
  padding-top: 60px;
  padding-bottom: 60px
}

footer {
  bottom: 0;
  left: 0;
  padding: 2rem 8%;
  background-color: #0e0e0e;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  z-index: 100;
  background-image: linear-gradient(180deg, rgba(28, 24, 12, .72), rgba(25, 30, 35, .6)), url(../img/footer/footer_bg.jpg);
  width: 100%;
  background-position: center bottom
}

.logo {
  height: 80px;
  margin-bottom: 1rem
}

.inf-ee {
  padding-bottom: 20px;
  display: flex;
  flex-direction: column
}

.footer-menu-container,
.social-icons-container {
  display: flex;
  margin-bottom: 8px;
  justify-content: center;
  align-items: center
}

.social-icon {
  height: 60px;
  width: 100px;
  background-image: url(../img/social/discord.png);
  background-position: center
}

.social-icon:nth-of-type(2) {
  background-image: url(../img/social/twitter.png)
}

.social-icon:nth-of-type(3) {
  background-image: url(../img/social/neftyb.png)
}

.social-icon:nth-of-type(4) {
  background-image: url(../img/social/youtube.png)
}

.footer-menu-container {
  list-style-type: none;
  color: #f2f2f2;
  font-size: 18px
}

.menu-item {
  margin: 1rem 1.4rem;
  cursor: pointer;
  opacity: .6
}

.menu-item:hover {
  opacity: 1
}

.copyright {
  color: #f2f2f2;
  opacity: .6;
  text-align: center;
  font-family: Nunito, sans-serif;
  font-weight: 600
}

.blog-slider {
  width: 95%;
  position: relative;
  max-width: 800px;
  margin: auto;
  padding: 25px;
  border-radius: 25px;
  transition: .3s
}

@media screen and (max-width:992px) {
  .blog-slider {
    max-width: 680px;
    height: 400px
  }
}


.bgist {
  background-image: url(../img/partner/board_pt.png);
}


@media screen and (max-width:768px) {
  .blog-slider {
    min-height: 500px;
    height: auto;
    margin: 180px auto
  }

  .bgist {
    background-image: none !important;
  }
}

.blog-slider__item {
  display: flex;
  align-items: center
}

@media screen and (max-width:768px) {
  .blog-slider__item {
    flex-direction: column
  }
}

@media screen and (max-width:1008px) {
  .header_ft {
    padding: .4375em .875em
  }

  .daap_buttons,
  .header_ft nav {
    display: none
  }

  .header_ft nav>:nth-child(n+1) {
    font-size: 16px;
    margin: 0 .75em
  }

  .header_grid,
  .res_menu {
    display: flex
  }

  .why {
    margin-top: 60px !important
  }

  .blog-slider__item {
    flex-direction: column !important;
    margin-top: -80px !important;
    text-align: center !important;
    padding: 0 30px !important
  }
}

.blog-slider__item.swiper-slide-active .blog-slider__img img {
  opacity: 1;
  transition-delay: 0.3s
}

.blog-slider__item.swiper-slide-active .blog-slider__content>* {
  opacity: 1;
  transform: none
}

.blog-slider__item.swiper-slide-active .blog-slider__content>:first-child {
  transition-delay: 0.3s
}

.blog-slider__item.swiper-slide-active .blog-slider__content>:nth-child(2) {
  transition-delay: 0.4s
}

.blog-slider__item.swiper-slide-active .blog-slider__content>:nth-child(3) {
  transition-delay: 0.5s
}

.blog-slider__item.swiper-slide-active .blog-slider__content>:nth-child(4) {
  transition-delay: 0.6s
}

.blog-slider__item.swiper-slide-active .blog-slider__content>:nth-child(5) {
  transition-delay: 0.7s
}

.blog-slider__item.swiper-slide-active .blog-slider__content>:nth-child(6) {
  transition-delay: 0.8s
}

.blog-slider__item.swiper-slide-active .blog-slider__content>:nth-child(7) {
  transition-delay: 0.9s
}

.blog-slider__item.swiper-slide-active .blog-slider__content>:nth-child(8) {
  transition-delay: 1s
}

.blog-slider__item.swiper-slide-active .blog-slider__content>:nth-child(9) {
  transition-delay: 1.1s
}

.blog-slider__item.swiper-slide-active .blog-slider__content>:nth-child(10) {
  transition-delay: 1.2s
}

.blog-slider__item.swiper-slide-active .blog-slider__content>:nth-child(11) {
  transition-delay: 1.3s
}

.blog-slider__item.swiper-slide-active .blog-slider__content>:nth-child(12) {
  transition-delay: 1.4s
}

.blog-slider__item.swiper-slide-active .blog-slider__content>:nth-child(13) {
  transition-delay: 1.5s
}

.blog-slider__item.swiper-slide-active .blog-slider__content>:nth-child(14) {
  transition-delay: 1.6s
}

.blog-slider__item.swiper-slide-active .blog-slider__content>:nth-child(15) {
  transition-delay: 1.7s
}

.blog-slider__img {
  width: 450px;
  flex-shrink: 0;
  height: 380px;
  border-radius: 20px;
  transform: translateX(-80px);
  overflow: hidden
}

.blog-slider__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  opacity: 0;
  border-radius: 20px;
  transition: .3s
}

@media screen and (max-width:768px) {
  .blog-slider__img {
    transform: translateY(-50%);
    width: 90%
  }
}

@media screen and (max-height:500px) and (min-width:992px) {
  .blog-slider {
    height: 350px
  }

  .blog-slider__img {
    height: 270px
  }
}

.blog-slider__content {
  padding-right: 25px
}

@media screen and (max-width:768px) {
  .blog-slider__content {
    margin-top: -10px;
    text-align: center;
    padding: 0 30px
  }

  .blog-slider__content>img {
    max-width: 300px !important;
    margin-top: 50px !important
  }
}

.blog-slider__content>* {
  opacity: 0;
  transform: translateY(25px);
  transition: .4s
}

.blog-slider__code {
  color: #7b7992;
  margin-bottom: 15px;
  display: block;
  font-weight: 500
}

.blog-slider__title {
  font-size: 26px;
  font-family: Rubik, sans-serif;
  font-weight: 700;
  color: #ffbd5b;
  margin-bottom: 20px
}

.blog-slider__text {
  color: #b3afa8;
  margin-bottom: 30px;
  line-height: 1.4em;
  font-family: Nunito, sans-serif;
  font-size: 20px
}

.blog-slider__button {
  display: inline-flex;
  background-image: linear-gradient(147deg, #583d26 0, #87613f 74%);
  padding: 15px 35px;
  border-radius: 50px;
  color: #fff;
  text-decoration: none;
  font-weight: 500;
  text-align: center;
  justify-content: center;
  font-family: Rubik, sans-serif
}

@media screen and (max-width:576px) {
  .blog-slider__img {
    width: 95%
  }

  .menu-item {
    margin: 10px !important;
    font-size: 13px !important
  }

  .social-icon {
    height: 60px;
    width: 80px !important
  }

  .blog-slider__content {
    margin-top: -10px;
    padding: 0
  }

  .blog-slider__content>img {
    max-width: 300px !important;
    margin-top: 50px !important
  }

  .blog-slider__button {
    width: 100%
  }
}

.blog-slider .swiper-container-horizontal>.swiper-pagination-bullets,
.blog-slider .swiper-pagination-custom,
.blog-slider .swiper-pagination-fraction {
  bottom: 10px;
  left: 0;
  width: 100%
}

.blog-slider__pagination {
  position: absolute;
  z-index: 21;
  right: 20px;
  width: 11px !important;
  text-align: center;
  left: auto !important;
  top: 50%;
  bottom: auto !important;
  transform: translateY(-50%)
}

#loader-wrapper,
#loading,
.YouTubePopUp-Wrap {
  height: 100%;
  position: fixed
}

.blog-slider__pagination.swiper-pagination-bullets .swiper-pagination-bullet {
  margin: 8px 0
}

.blog-slider__pagination .swiper-pagination-bullet {
  width: 11px;
  height: 11px;
  display: block;
  border-radius: 10px;
  background: #6c6452;
  opacity: .2;
  transition: .3s
}

.blog-slider__pagination .swiper-pagination-bullet-active {
  opacity: 1;
  background: #ffbd5b;
  height: 30px;
  box-shadow: 0 0 20px rgba(252, 56, 56, .3)
}

@media screen and (max-width:768px) {
  .blog-slider__pagination {
    transform: translateX(-50%);
    left: 50% !important;
    top: 205px;
    width: 100% !important;
    display: flex;
    justify-content: center;
    align-items: center
  }

  .blog-slider__pagination.swiper-pagination-bullets .swiper-pagination-bullet {
    margin: 0 5px
  }

  .blog-slider__pagination .swiper-pagination-bullet-active {
    height: 11px;
    width: 30px
  }
}

.YouTubePopUp-Wrap {
  width: 100%;
  background-color: rgba(0, 0, 0, .8);
  top: 0;
  left: 0;
  z-index: 600
}

.YouTubePopUp-animation {
  opacity: 0;
  -webkit-animation-duration: .5s;
  animation-duration: .5s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  -webkit-animation-name: YouTubePopUp;
  animation-name: YouTubePopUp
}

@-webkit-keyframes YouTubePopUp {
  0% {
    opacity: 0
  }

  100% {
    opacity: 1
  }
}

@keyframes YouTubePopUp {
  0% {
    opacity: 0
  }

  100% {
    opacity: 1
  }
}

body.logged-in .YouTubePopUp-Wrap {
  top: 32px;
  z-index: 600
}

.YouTubePopUp-Content {
  max-width: 860px;
  display: block;
  margin: 0 auto;
  height: 100%;
  position: relative
}

.YouTubePopUp-Content iframe {
  max-width: 100% !important;
  width: 100% !important;
  display: block !important;
  height: 480px !important;
  border: none !important;
  position: absolute;
  top: 0;
  bottom: 0;
  margin: auto 0
}

.YouTubePopUp-Hide {
  -webkit-animation-duration: .5s;
  animation-duration: .5s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  -webkit-animation-name: YouTubePopUpHide;
  animation-name: YouTubePopUpHide
}

@-webkit-keyframes YouTubePopUpHide {
  0% {
    opacity: 1
  }

  100% {
    opacity: 0
  }
}

@keyframes YouTubePopUpHide {
  0% {
    opacity: 1
  }

  100% {
    opacity: 0
  }
}

.YouTubePopUp-Close {
  position: absolute;
  top: 0;
  cursor: pointer;
  bottom: 528px;
  right: 0;
  margin: auto 0;
  width: 24px;
  height: 24px;
  background: url(../img/assets/close.png) 0 0/24px 24px no-repeat;
  -webkit-background-size: 24px 24px;
  -moz-background-size: 24px 24px;
  -o-background-size: 24px 24px
}

.YouTubePopUp-Close:hover {
  opacity: .5
}

@media all and (max-width:768px) and (min-width:10px) {
  .YouTubePopUp-Content {
    max-width: 90%
  }
}

@media all and (max-width:600px) and (min-width:10px) {
  .YouTubePopUp-Content iframe {
    height: 320px !important
  }

  .YouTubePopUp-Close {
    bottom: 362px
  }
}

@media all and (max-width:480px) and (min-width:10px) {
  .YouTubePopUp-Content iframe {
    height: 220px !important
  }

  .YouTubePopUp-Close {
    bottom: 262px
  }
}

.three-bg {
  background-image: linear-gradient(180deg, rgba(28, 24, 12, .75), rgba(25, 30, 35, .6)), url(../img/backgd/rdmap.jpg);
  width: 100%;
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover
}

#loader-wrapper {
  top: 0;
  left: 0;
  width: 100%;
  z-index: 800
}

#loading {
  width: 100%;
  z-index: 680;
  margin-top: 0;
  top: 0
}

.cssload-loader {
  width: auto;
  height: 100vh;
  border: 0 dotted #aaa;
  display: flex;
  align-items: center;
  justify-content: center
}

.cssload-loader-inner {
  text-align: center;
  background: url(../img/logo/logo-white.png) center center/contain no-repeat;
  height: 20%;
  width: 20%
}