.bebas-neue-regular {
  font-family: "Bebas Neue", sans-serif;
  font-weight: 400;
  font-style: normal;
}

html {
    background-color: black;
    font-family: "Bebas Neue", sans-serif;
}

nav {
    padding-top: 10px;
    background-color: black;
    padding-bottom: 6px;
    display: flex;
    align-content: space-between;
    justify-content: space-between;
    padding-left:10%;
    padding-right: 10%;
    border: solid 5px rgba(255, 255, 255, 0.158);
    border-radius: 5px;


}
@media (max-width: 768px) {
    nav a {
        font-size:15px !important;
    }

}

@media (max-width: 480px) {
    nav a {
        font-size:7px !important;
    }
}
nav a {
    text-align: center;
    width: 14%;
    margin: 4px;
    color: white !important;
    padding: 15px;
    font-size: 30px;
    box-shadow: -5px 5px 0px rgb(202, 173, 255);
    transform: translateX(-5px);
    transform: translateY(-5px);
    background-color: blueviolet;
    border-radius: 5px;
    transition: ease 1s;
}
/* nav a:nth-last-child(-n+2) {
    padding: 15px;
    box-shadow: 5px 5px 0px rgb(202, 173, 255);
    transform: translateX(-5px);
    transform: translateY(-5px);
    background-color: blueviolet;
    border-radius: 5px;
    transition: ease 1s;
} */
nav a:hover {
    transform: translateX(0px);
    transform: translateY(0px);
    box-shadow: 0px 0px 0px rgb(211, 116, 255);
    
    transition: ease 0.3s;
}


#selected {
    color: pink !important;
}


body {
  margin: 0;
}

.spiral {
  position: fixed;     /* important */
  inset: 0;
  z-index: -1;         /* safely behind everything */
}

/* Both gradient layers */
.spiral::before,
.spiral::after {
  content: "";
  position: absolute;
  inset: 0;
}

/* First gradient */
.spiral::before {
  background-image: repeating-radial-gradient(
    circle at center,
    rgb(0, 0, 0) 0,
    rgb(0, 0, 0) 10px,
    rgb(43 0 69) 10px,
    rgb(43, 0, 69) 20px
  );
}

/* Second gradient */
.spiral::after {
  background-image: repeating-radial-gradient(
    circle at center,
    rgb(43, 0, 69) 0px,
    rgb(43, 0, 69) 15px,
    rgb(0, 0, 0) 15px,
    rgb(0, 0, 0) 25px
  );

  opacity: 0;
  animation: fade 15s ease-in-out infinite alternate;
}

@keyframes fade {
  from { opacity: 0; }
  to   { opacity: 1; }
}

.bnuy {
	text-align: center;
	display: flex;
	justify-content: space-evenly;
	flex-direction: column;
	align-items: center;
}
.bnuy * {
	background-color: black;
	border: solid 5px pink;
	border-radius: 8px;
	padding:15px;
	width: 60%;
	color: pink;
	font-size: 70px;
}

.bnuy img {
	width:500px !important;
	padding: 0px !important;
	border: dashed 5px pink;
}

.tile {
  text-align: center;
  color: pink;
  border: solid pink 5px;
  width: 75% !important;
  margin: auto;
  margin-top: 20px;
  margin-bottom: 20px;
  background-color: black;
  border-radius: 8px;

}