body {
  height: 100vh;
  width: 100vw;
  color: #333;
  margin: 0;
  font-family: courier;
}

footer {
  width: 100%;
  position: fixed;
  bottom: 10%;
}

a {
  text-decoration: none;
  color: #333;
  border-radius: 5px;
  padding: 2rem 3rem;
}
a:hover {
  cursor: pointer;
  color: #666;
  background: linear-gradient(10deg, #d90101, #f2ef7c, #7ce7f2, #cbf0b3, #fbe2a4);
  background-size: 1000% 1000%;
  -webkit-animation: AnimationName 5s ease infinite;
  -moz-animation: AnimationName 5s ease infinite;
  animation: AnimationName 5s ease infinite;
  mix-blend-mode: hard-light;
  transition: all 0.5s ease-in-out;
}

.body-gradient {
  background: linear-gradient(10deg, #d90101, #f2ef7c, #7ce7f2, #cbf0b3, #fbe2a4);
  background-size: 1000% 1000%;
  -webkit-animation: AnimationName 36s ease infinite;
  -moz-animation: AnimationName 36s ease infinite;
  animation: AnimationName 36s ease infinite;
}

@-webkit-keyframes AnimationName {
  0% {
    background-position: 55% 0%;
  }
  50% {
    background-position: 46% 100%;
  }
  100% {
    background-position: 55% 0%;
  }
}
@-moz-keyframes AnimationName {
  0% {
    background-position: 55% 0%;
  }
  50% {
    background-position: 46% 100%;
  }
  100% {
    background-position: 55% 0%;
  }
}
@keyframes AnimationName {
  0% {
    background-position: 55% 0%;
  }
  50% {
    background-position: 46% 100%;
  }
  100% {
    background-position: 55% 0%;
  }
}