html{
    overflow-x: hidden;
}

body{
    font-family: Lilita One;
    font-weight:400 !important;
   color:#2D2D2D;
    background: url(bg.png) no-repeat center center fixed; 
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}
.lilita{
    font-family: Lilita One;
}
.btn{
    border-radius:14px !important;
    transition:.5s;
    font-size:18px;
}
.btn:hover,.btn:focus{
    transform: scale(0.95);
}
.btn.active,.btn:focus{
    box-shadow:none !important;
    
}
.poppins{
    font-family: Poppins;
}
p,span{
    font-family: Poppins;
}
.nav-item .btn{
   height:41.2px;

}
li.nav-item {
    padding: 0rem 0.4rem;
}
button.btn.btn-primary i {
    font-size: 22px;
}
.logo{
    width:18rem;
}
.floating {  
    animation-name: floating;
    animation-duration: 4s;
    animation-iteration-count: infinite;
    animation-timing-function: ease-in-out;
    margin-left: 30px;
    margin-top: 5px;
}

@keyframes floating {
    from { transform: translate(0,  0px); }
    65%  { transform: translate(10px, 15px); }
    to   { transform: translate(0, -0px); }    
}
.btcup{
    position:absolute;
    left:80%;
    bottom:50%;
    width:10rem;
}
.penup{
    position:absolute;
    right:80%;
    bottom:50%;
    width:3.5rem;
}
.starsdown{
    position:absolute;
    right:80%;
    width:10rem;
    bottom:10%;
}
.rocketdown{
    position:absolute;
    left:80%;
    width:8rem;
    bottom:10%;
}


a.btn.btn-primary i {
    font-size: 25px;
}
.btn-primary:focus,.btn-primary.active{
    box-shadow: none !important;
    background: #2D2D2D;
    border-color:transparent;
}
.btn-primary:hover{
    background:#2D2D2D;
    border-color:transparent;
}
.btn-primary{
    background: #2D2D2D;
    border-color:transparent;
    color:#FFFFFF !important;
}
.gradient-1{
   
}
.navbar-toggler{
    background: #2D2D2D;
    border-radius:14px;
    padding:.25rem .5rem;
}
.navbar-toggler:focus,
.navbar-toggler:active,
.navbar-toggler-icon:focus {
    outline: none;
    box-shadow: none;
}


.navbar-toggler-icon{
background-image: url("data:image/svg+xml,%3Csvg width='20' height='23' viewBox='0 0 28 18' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect x='0.579102' y='0.548676' width='26.8646' height='3' rx='1' fill='white'/%3E%3Crect x='0.579102' y='7.54868' width='26.8646' height='3' rx='1' fill='white'/%3E%3Crect x='0.579102' y='14.5487' width='26.8646' height='3' rx='1' fill='white'/%3E%3C/svg%3E%0A");

}
button[aria-expanded="true"].navbar-toggler {
    background:#FFFFFF
}
button[aria-expanded="true"] .navbar-toggler-icon{
    background-image: url("data:image/svg+xml,%3Csvg width='21' height='24' viewBox='0 0 21 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Crect x='2.7373' y='0.794769' width='26.8646' height='3' rx='1' transform='rotate(50 2.7373 0.794769)' fill='%23FE78C0'/%3E%3Crect x='0.438965' y='21.3742' width='26.8646' height='3' rx='1' transform='rotate(-50 0.438965 21.3742)' fill='%23FE78C0'/%3E%3C/svg%3E%0A");
}
.text-primary{
    color: #2D2D2D !important;
}
.text-secondary{
    color:#F8CC0F !important
}
.text-blue{
    color:#27B5ED !important;
}
.text-dark{
    color:#3E3E3E !important;
}
body::-webkit-scrollbar {
    width: .9em;
   background:#e1e1e1
  }
 
   
  body::-webkit-scrollbar-thumb {
    background-color: #2D2D2D;
    border-radius:99px;
  }
  .btn-discord{
    background: #2D2D2D;
    color:#FFFFFF;
    padding:.3rem 1.5rem;
  }
  .btn-discord:hover{
      color:#FFFFFF
  }
  .btn-twitter{
    background: #2D2D2D;
   color:#FFFFFF;
   padding:.3rem 1.5rem;
  }
  .btn-twitter:hover{
    color:#FFFFFF
}
.text-brown{
    color:#EC6F00;

}
.text-wheat{
    color:#0A7D1D;
}
.text-bly{
    color:#4848E5;
}

footer{
    font-size:24px !important;
}
img{
    border-radius:18px;
}


@media (min-width: 960px) {
    .float-right{
        float:right;
        margin:0 1rem;
    }
    p{
        font-size:28px;
        line-height:36px;
    }
    .swiper-slide img{
        width:calc(100% - 2rem);
        text-align: center;
        justify-content: center;
        margin-left:auto;
        margin-right:auto;
    }
    
    .swiper1{
        max-height:calc(15.5vw + 4rem);
        margin-bottom:3rem;
    }
    .swiper2{
        max-height:calc(35vw + 5rem);
    }
    .swiper-slide{
      
    }
    .container-fluid{
        padding-left:1rem;
        padding-right:1rem;
  max-width:2500px;
    }
    h1{
        font-size:64px;
        line-height:74px;
    }
    h2{
        font-size:48px;
        line-height:60px;
    }
    h3{
        font-size:36px;
        line-height:48px;
    }
    .btn-lg{
        font-size:24px;
        border-radius:19px;
        padding:.4rem 1.9rem;
        min-width:15rem;
        min-height:63px;
    }
    .custom-select{
        width:15rem;
        margin-left:auto;
        margin-right:auto;
    }
   
   
    section{
        padding-top:100px;
        padding-bottom:100px;
        padding-left:10px;
        padding-right:10px;
    }
    .select-selected {
        font-size:42px;
      color:#FCFCFC;
      
      cursor: pointer;
      user-select: none;
    }
    .select-items div{
        font-size:24px;
      color:#FCFCFC;
      padding: 8px 16px;
      cursor: pointer;
      user-select: none;
    }
    .swiper.swiper2.swiper-initialized.swiper-horizontal.swiper-pointer-events {
        transition:.01s;
        transform: rotate(
    180deg);
    }
    .reversed {
        transition:.01s;
        transform: rotate(
    180deg) !important;
    } 
}
 .team{
     transition:.3s;
 }
 .team:hover{
     transform:scale(.96);
     cursor:pointer;
 }
 .bright{
   filter: invert(100%) sepia(0%) saturate(10%) hue-rotate(114deg) brightness(1500%) contrast(108%)
}
@media (max-width: 960px) {
    body{
        background: url(https://images.unsplash.com/photo-1601662528567-526cd06f6582?ixlib=rb-1.2.1&ixid=MnwxMjA3fDB8MHxzZWFyY2h8MXx8cGFwZXIlMjB0ZXh0dXJlfGVufDB8fDB8fA%3D%3D&w=1000&q=80) no-repeat center center fixed; 
    }
    .floating{
        display:none
    }
.navbar-prop{
background:#2D2D2D !important;
border-bottom-left-radius: 18px;
border-bottom-right-radius: 18px;
    }
  
    .menu-btn{
background:#FFFFFF !important;
color:#2D2D2D !important;
    }
    .select-items div{
        font-size:18px;
      color:#FCFCFC;
      padding: 6px 14px;
      cursor: pointer;
      user-select: none;
    }
    .float-right{
       
        margin:0 .5rem;
    }
    .select-selected {
        font-size:28px;
      color:#FCFCFC;
      
      cursor: pointer;
      user-select: none;
    }
    footer{
        font-size:12px !important;
    }
    h1{
        font-size:42px;
        line-height:52px;
    }
    h2{
        font-size:30px;
        line-height:42px;
    }
    h3{
        font-size:24px;
        line-height:32px;
    }
    p{
        font-size:18px;
    }
    .m-100{
        width:100% !important;
    }
    .custom-select{
        width:153px;
        margin-left:auto;
        margin-right:auto;
    }
    section{
        padding-top:100px;
        padding-bottom:100px;
     
    }
    .swiper{
        max-height:50rem;
    }
    .under-swiper{
        margin-top:17rem;
    }
    .swiper-slide img{
        width:85%;
       
    }
    .home{
        margin-bottom:10rem;
    }
    .nav-item a {
        width:100%;
    }
    .mt-m-10{
        margin-top:7rem;
    }
    .nav-item .btn{
        width:100%;
     margin-top:.5rem;
     
     }
     
    .navbar-nav{

    }
    .navbar-brand img{
        width:12rem;
        
    }


  }
.navbar-brand img{
    border-radius:0px !important;
}
  
.custom-select {
    position: relative;
   
  }
  
  .custom-select select {
    display: none; /*hide original SELECT element:*/
  }
  
  .select-selected {
    background-color: #2D2D2D;
    color:#FFFFFF;
    border-radius:14px;
    
  }
  
  /*style the arrow inside the select element:*/
  .select-selected:after {
    position: absolute;
   
    top: 32px;
    right: 20px;
    width: 0;
    height: 0;
    border: 6px solid transparent;
    border-color: #fff transparent transparent transparent;
  }
  
  /*point the arrow upwards when the select box is open (active):*/
  .select-selected.select-arrow-active:after {
    border-color: transparent transparent #fff transparent;
    top: 7px;
  }
  
  /*style the items (options), including the selected item:*/
  
  
  /*style items (options):*/
  .select-items {
      border-radius:14px;
    position: absolute;
    background-color: #2D2D2D;
margin-top:.3rem;
    left: 0;
    right: 0;
    z-index: 99;
  }
  
  /*hide the items when the select box is closed:*/
  .select-hide {
    display: none;
  }
  
  .select-items div:hover, .same-as-selected {
    background-color: rgba(0, 0, 0, 0.05);
  }