html {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
@font-face {
  font-family: Gilmer Regular;
  src: url("font/gilmer-light.otf");
}
body {
  background-image: linear-gradient(
    to right,
    rgb(66, 2, 53),
    rgb(18, 2, 18),
    rgba(1, 9, 65, 0.953)
  ) !important;
  font-family: Gilmer Regular;
  font-weight: 500;
  line-height: 14.52px;
  text-align: left;
  text-underline-position: from-font;
  text-decoration-skip-ink: none;
  position: relative;
}

@keyframes animatebg {
  0% {
    filter: hue-rotate(0deg);
  }
  50% {
    filter: hue-rotate(50deg);
  }
  100% {
    filter: hue-rotate(100deg);
  }
}

nav {
  padding: 5px 0;
  background-color: #000000c4 !important;
}
.banner {
  background: linear-gradient(rgba(0, 0, 0, 0.753), rgba(0, 0, 0, 0.759)),
    url("images/potion2.jpg");
  background-position: center;
  background-size: cover;
  font-family: Trebuchet MS, sans-serif;
}
#cookie-banner {
  background-color: #96a8ed !important;
}
#close-sign-up {
  color: black !important;
}
.feature:hover {
  opacity: 1;
  transition: 0.5s ease-in-out;
  cursor: pointer;
}
.feature {
  height: 173px;
}
/* animate */

.game-feature {
  backdrop-filter: blur(30px);
}
#sign-in-modal {
  z-index: 999;
}
.grounded-radiants {
  background: linear-gradient(
    114.34deg,
    rgba(94, 0, 255, 0.1) -7.21%,
    rgba(255, 0, 234, 0.1) 108.18%
  );
  border-radius: 18px;
}