body {
  background-color: #222222;
  background: repeating-linear-gradient(
      135deg,
      #2b2b2b 0%,
      #2b2b2b 10%,
      #222222 0%,
      #222222 50%
    )
    0 / 15px 15px;
  animation: moveBackground 5s linear infinite; /* line animation */
}

@keyframes moveBackground {
  0% {
    background-position: 0 0; /* Start position */
  }
  100% {
    background-position: 15px 0; /* End position (move horizontally) */
  }
}

.top-right-image {
  position: absolute;
  top: 3rem;
  left: 3rem;
  max-width: 200px; /* L-size  */
  height: auto; /* Maintain aspect ratio */
  animation: wiggle 16s ease-in-out infinite; /* Total duration of 16s */
}

@keyframes wiggle {
  0% { transform: rotate(0deg); } /* Start static */
  12.5% { transform: rotate(3deg); } /* Wiggle */
  25% { transform: rotate(-12deg); } /* Wiggle */
  37.5% { transform: rotate(2deg); } /* Wiggle */
  50% { transform: rotate(0deg); } /* End wiggle, go static */
  62.5% { transform: rotate(0deg); } /* Stay static */
  100% { transform: rotate(0deg); } /* Stay static */
}


#container {
  width: 100%;
  height: 100%;
  position: fixed;
  padding: 2rem;
  display: flex;
  flex-direction: column;
  justify-content: center; /* Center vertically */
  align-items: center; /* Center horizontally */
  gap: 2.5rem;
}

/* Neon */
a {
  text-align: center;
  font-size: 2rem;
  /* margin-bottom: 0;
  margin-top: 0; */
  line-height: .5;
  text-decoration: none;
  color: #fff;
}

a:nth-child(1) {
  font-family: Silkscreen;
  animation: neon1 1.5s ease-in-out infinite alternate;
}

a:nth-child(2) {
  font-family: Silkscreen;
  animation: neon2 1.5s ease-in-out infinite alternate;
  animation-delay: 1.5s; 
}

a:nth-child(3) {
  font-family: Silkscreen;
  animation: neon3 1.5s ease-in-out infinite alternate;
}

a:nth-child(4) {
  font-family: Silkscreen;
  animation: neon4 1.5s ease-in-out infinite alternate;
  animation-delay: 1.5s; 
}

a:nth-child(5) {
  font-family: Silkscreen;
  animation: neon5 1.5s ease-in-out infinite alternate;
}

a:nth-child(6) {
  font-family: Silkscreen;
  animation: neon6 1.5s ease-in-out infinite alternate;
  animation-delay: 1.5s; 
}

/*glow*/

@-webkit-keyframes neon1 {
  from {
    text-shadow: 0 0 10px #fff, 0 0 10px #fff, 0 0 15px #fff, 0 0 20px #ffdd1b,
      0 0 35px #ffdd1b, 0 0 40px #ffdd1b, 0 0 50px #ffdd1b, 0 0 75px #ffdd1b;
  }
  to {
    text-shadow: 0 0 2px #fff, 0 0 5px #fff, 0 0 7px #fff, 0 0 10px #ffdd1b,
      0 0 16px #ffdd1b, 0 0 20px #ffdd1b, 0 0 25px #ffdd1b, 0 0 36px #ffdd1b;
  }
}

@keyframes neon1 {
  from {
    text-shadow: 0 0 10px #fff, 0 0 20px #fff, 0 0 30px #fff, 0 0 40px #ffdd1b,
      0 0 70px #ffdd1b, 0 0 80px #ffdd1b, 0 0 100px #ffdd1b, 0 0 150px #ffdd1b;
  }
  to {
    text-shadow: 0 0 5px #fff, 0 0 10px #fff, 0 0 15px #fff, 0 0 20px #ffdd1b,
      0 0 35px #ffdd1b, 0 0 40px #ffdd1b, 0 0 50px #ffdd1b, 0 0 75px #ffdd1b;
  }
}


@-webkit-keyframes neon2 {
  from {
    text-shadow: 0 0 10px #fff, 0 0 10px #fff, 0 0 15px #fff, 0 0 20px #ffdd1b,
      0 0 35px #ffdd1b, 0 0 40px #ffdd1b, 0 0 50px #ffdd1b, 0 0 75px #ffdd1b;
  }
  to {
    text-shadow: 0 0 2px #fff, 0 0 5px #fff, 0 0 7px #fff, 0 0 10px #ffdd1b,
      0 0 16px #ffdd1b, 0 0 20px #ffdd1b, 0 0 25px #ffdd1b, 0 0 36px #ffdd1b;
  }
}

@keyframes neon2 {
  from {
    text-shadow: 0 0 10px #fff, 0 0 20px #fff, 0 0 30px #fff, 0 0 40px #ffdd1b,
      0 0 70px #ffdd1b, 0 0 80px #ffdd1b, 0 0 100px #ffdd1b, 0 0 150px #ffdd1b;
  }
  to {
    text-shadow: 0 0 5px #fff, 0 0 10px #fff, 0 0 15px #fff, 0 0 20px #ffdd1b,
      0 0 35px #ffdd1b, 0 0 40px #ffdd1b, 0 0 50px #ffdd1b, 0 0 75px #ffdd1b;
  }
}

@-webkit-keyframes neon3 {
  from {
    text-shadow: 0 0 10px #fff, 0 0 10px #fff, 0 0 15px #fff, 0 0 20px #ffdd1b,
      0 0 35px #ffdd1b, 0 0 40px #ffdd1b, 0 0 50px #ffdd1b, 0 0 75px #ffdd1b;
  }
  to {
    text-shadow: 0 0 2px #fff, 0 0 5px #fff, 0 0 7px #fff, 0 0 10px #ffdd1b,
      0 0 16px #ffdd1b, 0 0 20px #ffdd1b, 0 0 25px #ffdd1b, 0 0 36px #ffdd1b;
  }
}

@keyframes neon3 {
  from {
    text-shadow: 0 0 10px #fff, 0 0 20px #fff, 0 0 30px #fff, 0 0 40px #ffdd1b,
      0 0 70px #ffdd1b, 0 0 80px #ffdd1b, 0 0 100px #ffdd1b, 0 0 150px #ffdd1b;
  }
  to {
    text-shadow: 0 0 5px #fff, 0 0 10px #fff, 0 0 15px #fff, 0 0 20px #ffdd1b,
      0 0 35px #ffdd1b, 0 0 40px #ffdd1b, 0 0 50px #ffdd1b, 0 0 75px #ffdd1b;
  }
}


@-webkit-keyframes neon4 {
  from {
    text-shadow: 0 0 10px #fff, 0 0 10px #fff, 0 0 15px #fff, 0 0 20px #ffdd1b,
      0 0 35px #ffdd1b, 0 0 40px #ffdd1b, 0 0 50px #ffdd1b, 0 0 75px #ffdd1b;
  }
  to {
    text-shadow: 0 0 2px #fff, 0 0 5px #fff, 0 0 7px #fff, 0 0 10px #ffdd1b,
      0 0 16px #ffdd1b, 0 0 20px #ffdd1b, 0 0 25px #ffdd1b, 0 0 36px #ffdd1b;
  }
}

@keyframes neon4 {
  from {
    text-shadow: 0 0 10px #fff, 0 0 20px #fff, 0 0 30px #fff, 0 0 40px #ffdd1b,
      0 0 70px #ffdd1b, 0 0 80px #ffdd1b, 0 0 100px #ffdd1b, 0 0 150px #ffdd1b;
  }
  to {
    text-shadow: 0 0 5px #fff, 0 0 10px #fff, 0 0 15px #fff, 0 0 20px #ffdd1b,
      0 0 35px #ffdd1b, 0 0 40px #ffdd1b, 0 0 50px #ffdd1b, 0 0 75px #ffdd1b;
  }
}

@-webkit-keyframes neon5 {
  from {
    text-shadow: 0 0 10px #fff, 0 0 10px #fff, 0 0 15px #fff, 0 0 20px #ffdd1b,
      0 0 35px #ffdd1b, 0 0 40px #ffdd1b, 0 0 50px #ffdd1b, 0 0 75px #ffdd1b;
  }
  to {
    text-shadow: 0 0 2px #fff, 0 0 5px #fff, 0 0 7px #fff, 0 0 10px #ffdd1b,
      0 0 16px #ffdd1b, 0 0 20px #ffdd1b, 0 0 25px #ffdd1b, 0 0 36px #ffdd1b;
  }
}

@keyframes neon5 {
  from {
    text-shadow: 0 0 10px #fff, 0 0 20px #fff, 0 0 30px #fff, 0 0 40px #ffdd1b,
      0 0 70px #ffdd1b, 0 0 80px #ffdd1b, 0 0 100px #ffdd1b, 0 0 150px #ffdd1b;
  }
  to {
    text-shadow: 0 0 5px #fff, 0 0 10px #fff, 0 0 15px #fff, 0 0 20px #ffdd1b,
      0 0 35px #ffdd1b, 0 0 40px #ffdd1b, 0 0 50px #ffdd1b, 0 0 75px #ffdd1b;
  }
}

@-webkit-keyframes neon6 {
  from {
    text-shadow: 0 0 10px #fff, 0 0 10px #fff, 0 0 15px #fff, 0 0 20px #ffdd1b,
      0 0 35px #ffdd1b, 0 0 40px #ffdd1b, 0 0 50px #ffdd1b, 0 0 75px #ffdd1b;
  }
  to {
    text-shadow: 0 0 2px #fff, 0 0 5px #fff, 0 0 7px #fff, 0 0 10px #ffdd1b,
      0 0 16px #ffdd1b, 0 0 20px #ffdd1b, 0 0 25px #ffdd1b, 0 0 36px #ffdd1b;
  }
}

@keyframes neon6 {
  from {
    text-shadow: 0 0 10px #fff, 0 0 20px #fff, 0 0 30px #fff, 0 0 40px #ffdd1b,
      0 0 70px #ffdd1b, 0 0 80px #ffdd1b, 0 0 100px #ffdd1b, 0 0 150px #ffdd1b;
  }
  to {
    text-shadow: 0 0 5px #fff, 0 0 10px #fff, 0 0 15px #fff, 0 0 20px #ffdd1b,
      0 0 35px #ffdd1b, 0 0 40px #ffdd1b, 0 0 50px #ffdd1b, 0 0 75px #ffdd1b;
  }
}

@media (max-width: 650px) {
  a {
    font-size: 1.5rem; /* Adjust font size for smaller screens */
  }
  
  #container {
    padding: 1rem; /* Adjust padding for smaller screens */
  }
}