.first-bg-color {
    background: #dbd8e3;
}

.second-bg-color {
    background: #5c5470;
}

.third-bg-color {
    background: #352f44;
}

.fourth-bg-color {
    background: #2a2438;
}

.first-color {
    color: #dbd8e3;
}

.second-color {
    color: #5c5470;
}

.third-color {
    color: #352f44;
}

.fourth-color {
    color: #2a2438;
}

.secondary-bg {
    background-color: rgba(33,28,44, 0.9) !important;
}

.body {
    background-color: #2a2438;
}

.overflow-ellipsis {
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
}

#particles-js canvas {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: -1;
}

.reflection-gradient {
    background: linear-gradient(0deg, rgba(255,218,0,1) 0%, rgba(255,252,233,1) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    display: inline-block;
}

.burn-gradient {
    background: linear-gradient(0deg, rgba(179,0,0,1) 0%, rgba(255,112,112,1) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    display: inline-block;
}

header {
    background-color: rgba(33,28,44, 0.9);
}

.img-logo {
    height: 55px !important;
}

.btn-nav {
    background-color: inherit;
    border: none;
}

.btn-nav:hover {
    background-color: rgba(63,57,75, 0.5);
    border: none;
}

#claimRewardsBtn {
    display: none;
}

.point {
    height: 0.5rem;
    margin: 2px;
    border-radius: .3rem;
}

.w-30 {
    width: 30%;
}
.h-100-p {
    height: 100%;
}

.mint-btn:hover {
    background-color:  #198754  !important;
    border-color: #198754 !important;
    color: white !important;
}

.about {
    background-color: rgba(33,28,44, 0.9);
}

.ranking {
    background-color: rgb(33,28,44, 0.9);
}

.contract {
    background-color: rgb(33,28,44, 0.9);
}

footer {
    background-color: rgb(33,28,44, 0.9);
}

.img-burnable {
    height: 350px;
}

.img-faq {
    height: 350px;
}

.img-marketplace {
    height: 70px;
}

.img-kalao {
    height: 100px;
}

.tier {
    font-weight: 500;
}

hr {
    background: rgb(42,36,56);
    background: linear-gradient(90deg, rgba(42,36,56,1) 0%, rgba(255,255,255,1) 50%, rgba(42,36,56,1) 100%);}

.rare-gradient {
    background: linear-gradient(0deg, rgba(143,160,255,1) 0%, rgba(0,38,252,1) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    display: inline-block;
}
.rare-gradient-bg {
    background: linear-gradient(0deg, rgba(143,160,255,1) 0%, rgba(0,38,252,1) 100%);
}

.epic-gradient {
    background: linear-gradient(0deg, rgb(229, 143, 255) 0%, rgb(183, 0, 255) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    display: inline-block;
}
.epic-gradient-bg {
    background-color: linear-gradient(0deg, rgb(229, 143, 255) 0%, rgb(183, 0, 255) 100%);
}

.legendary-gradient {
    background: linear-gradient(0deg, rgba(255,255,255,1) 0%, rgba(252,211,0,1) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    display: inline-block;
}
.legendary-gradient-bg {
    background: linear-gradient(0deg, rgba(255,255,255,1) 0%, rgba(252,211,0,1) 100%);
}

.mythic-gradient {
    background: linear-gradient(0deg, #df9191 0%, rgba(232,66,67,1) 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    display: inline-block;
}
.mythic-gradient-bg {
    background: linear-gradient(0deg, #df9191 0%, rgba(232,66,67,1) 100%);
}

.glow {
    color: #fff;
    text-align: center;
    animation: glow 1s ease-in-out infinite alternate;
  }
  
  @-webkit-keyframes glow {
    from {
      text-shadow: 0 0 10px #fff, 0 0 20px #fff, 0 0 30px #ff0000, 0 0 40px #910000, 0 0 50px #ff0000, 0 0 60px #910000, 0 0 70px #ff0000;
    }
    
    to {
      text-shadow: 0 0 20px #fff, 0 0 30px #ff0000, 0 0 40px #ff0000, 0 0 50px #910000, 0 0 60px #ff0000, 0 0 70px #910000, 0 0 80px #ff0000;
    }
  }

.twitter-btn:hover {
    background-color: #1c95e6 !important;
    border-color: #1c95e6 !important;
    color: white !important;
}

.telegram-btn:hover {
    background-color: #28a9eb !important;
    border-color: #28a9eb !important;
    color: white !important;
}

.discord-btn:hover {
    background-color: #5865f2 !important;
    border-color: #5865f2 !important;
    color: white !important;
}

input:invalid {
    border: red solid 2px;
}
