body { background: url(../img/bgs/bg-top.png) top center no-repeat#040404!important; background-size: 150%!important; overflow-x: hidden!important;}
.bg-roadmap {background: url(../img/bgs/bg-skulls.png) top center no-repeat#040404!important; background-size: 100%!important;}
.bg-game  {background: url(../img/bgs/bg-game.png) top center no-repeat#040404!important; background-size: 100%!important;}
nav.navbar {height: 150px!important;}
.navbar .navbar-brand {padding: 0!important;}
.navbar-brand img {width: 80px!important; padding: 1em 0;}
 
.navbar.stickytop {position:fixed; top:0}

.over {z-index: 250; position: relative;}
.response {color: #fff;}

.fa-spin, .fa-check {color: #90DD2C; margin-right: 5px;}
.fa-times {margin-right: 5px; color: rgb(197, 95, 0);}

video {mix-blend-mode: lighten; width: 100%; height: 100%;}

.offcanvas-header img {width: 50%!important;}

.card {background: none!important;}
.accordion-wrapper .card-header button.collapsed {color: #fff; font-size: 1rem; font-weight: normal;}

.w-illu {width: 150px!important;}
.roadmap-icon {width: 100px; margin: 0 auto;}

.form-control {    border: 1px solid rgb(255 255 255);}
.team img {width: 80%!important;}

#necropass { background: url(../img/bgs/bg-waves.png) top left#040404!important;}
#skelliesvisuals {background: rgb(0,0,0); background: linear-gradient(0deg, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 15%, rgba(0,0,0,1) 50%, rgba(0,0,0,1) 85%, rgba(0,0,0,0) 100%); margin:-10rem 0 -10rem 0; padding: 5rem 0; position: relative; z-index: 10;}
#faq {background: rgb(100,102,36);
    background: linear-gradient(0deg, rgba(100,102,36,0.14049369747899154) 0%, rgba(0,0,0,1) 100%);}


.accordion-wrapper .card {border: 1px solid rgba(255, 255, 255, 0.2)!important;}
.accordion-wrapper p {color: #fff!important;}

#WEB3_CONNECT_MODAL_ID {z-index: 1200;}

/**/
section h1, section h3, section h4 {color: #fff!important; font-family: 'Bebas Neue', sans-serif; font-weight: normal!important;}
h2  {font-family: 'Syne Mono', monospace; font-weight: normal; color: #90DD2C;}
.logo-intro {font-size: 6vw!important; line-height: 1em!important;}
section h3 {font-size: 6vw!important;}
section h4 {font-size: 2rem!important;}

.text-left {text-align: left!important;}
.text-white-50 {color: rgba(255, 255, 255, .7)!important;}

.navbar.stickytop {background:linear-gradient(180deg, rgba(0,0,0,1) 0%, rgba(0,0,0,0) 100%);}
button.hamburger span, button.hamburger:after, button.hamburger:before {background: #fff;}
.banner--stick.transparent.navbar-dark .nav-link, .banner--stick:not(.navbar-dark).navbar-dark .nav-link {color: #fff;}

/* buttons */
.disconnected { background: rgba(50, 50, 50, 1);}
    .disconnected i {color: red; font-size: .8em; margin-right: 0.5rem;}
.connected {background: rgba(50, 50, 50, 1);}
    .connected i {color:greenyellow; font-size: .8em; margin-right: 0.5rem;}

@media (min-width: 516px) {
   
    .logo-intro img {width: 100%;}
    body, .bg-forest {background-size: 100%!important;}
     
}

@media (max-width: 991.98px) {
    video {width: 100%; }
    body {background-size: 250%!important; background-position: top right;}
    .navbar-brand img {width: 60px!important;}
    h1.logo-intro, section h3 {font-size: 5em!important; line-height: 1em;}
    .offcanvas-nav {background: rgba(0, 0, 0, 0.7)!important;   backdrop-filter: blur(20px);}
    .bg-roadmap {}
}