@import url("https://fonts.googleapis.com/css2?family=Anek+Latin:wght@100;200;300;400;500;600;700;800&display=swap");
@import url("https://api.fontshare.com/v2/css?f[]=stardom@400&display=swap");
.btn {
  align-content: center;
  justify-content: center;
  padding: 5px 30px;
  font-size: 1rem;
  height: auto;
  border-color: #fff !important;
  transition: 0.5s;
}
.btn:hover {
  border: 1px solid #fff;
  background: #fff;
  color: #000 !important;
}

* {
  color: #fff !important;
  font-family: "Anek Latin", sans-serif !important;
}

::-webkit-scrollbar {
  width: 10px;
  padding: 2px;
}

::-webkit-scrollbar-thumb {
  background: #fff;
}

body {
  scroll-behavior: smooth;
  background: #000;
  max-width: 100vw;
}

h1, h2, h3, h4, h5, h6 {
  font-family: "Anek Latin", serif !important;
}

h1 {
  font-size: 3rem;
}

h2 {
  font-size: 2.5rem;
}

h3 {
  font-size: 2rem;
}

h4 {
  font-size: 1.5rem;
}

h5 {
  font-size: 1rem;
}

h6 {
  font-size: 0.7rem;
}

.container {
  padding: 0 25px;
}

.hero {
  padding: 160px 0 80px;
}

.flex.responsive {
  flex-direction: column;
}

p, a {
  color: #808080 !important;
}

a:hover {
  color: white !important;
}

strong, i, b, span, div {
  color: inherit !important;
}

input,
select,
textarea {
  transition: 0.5s;
  border-color: rgba(255, 255, 255, 0.5) !important;
  border-top: 0 !important;
  border-right: 0 !important;
  border-left: 0 !important;
  background: transparent;
  padding: 20px !important;
  color: rgba(255, 255, 255, 0.25) !important;
}
input:hover, input:focus,
select:hover,
select:focus,
textarea:hover,
textarea:focus {
  border-color: #fff !important;
  color: white !important;
}

header nav, footer nav {
  padding: 30px 25px !important;
}

option {
  color: black;
}

.bgGradient {
  background: rgb(255, 215, 0);
  background: -moz-linear-gradient(45deg, rgb(255, 215, 0) 0%, rgb(255, 13, 94) 50%, rgb(149, 26, 192) 100%);
  background: -webkit-linear-gradient(45deg, rgb(255, 215, 0) 0%, rgb(255, 13, 94) 50%, rgb(149, 26, 192) 100%);
  background: linear-gradient(45deg, rgb(255, 215, 0) 0%, rgb(255, 13, 94) 50%, rgb(149, 26, 192) 100%);
}

.bgAnimateGradient {
  background: linear-gradient(45deg, #ffd700, #ff0d5e, #951ac0);
  background-size: 600% 600%;
  -webkit-animation: bgAnimate 21s ease infinite;
  -moz-animation: bgAnimate 21s ease infinite;
  -o-animation: bgAnimate 21s ease infinite;
  animation: bgAnimate 21s ease infinite;
}

@-webkit-keyframes bgAnimate {
  0% {
    background-position: 96% 0%;
  }
  50% {
    background-position: 5% 100%;
  }
  100% {
    background-position: 96% 0%;
  }
}
@-moz-keyframes bgAnimate {
  0% {
    background-position: 96% 0%;
  }
  50% {
    background-position: 5% 100%;
  }
  100% {
    background-position: 96% 0%;
  }
}
@-o-keyframes bgAnimate {
  0% {
    background-position: 96% 0%;
  }
  50% {
    background-position: 5% 100%;
  }
  100% {
    background-position: 96% 0%;
  }
}
@keyframes bgAnimate {
  0% {
    background-position: 96% 0%;
  }
  50% {
    background-position: 5% 100%;
  }
  100% {
    background-position: 96% 0%;
  }
}
@media screen and (min-width: 768px) {
  .flex.responsive {
    flex-direction: row;
  }
  .container {
    padding: 0 150px;
  }
}