body {
  margin: 0;
  padding: 0;
  font-family: anta;
  background: linear-gradient(45deg, #2d2d2d 9%, #000 100%);
}

.center {
  display: flex;
  text-align: center;
  justify-content: center;
  align-items: center;
  min-height: 100vh;
}

.ring {
  position: absolute;
  width: 30vh;
  height: 30vh;
  border-radius: 50%;
  animation: ring 2s linear infinite;
  z-index: -1;
}

@keyframes ring {
  0% {
    transform: rotate(0deg);
    box-shadow: 0.2vh 0.6vh 0.3vh #333;
  }

  50% {
    transform: rotate(180deg);
    box-shadow: 0.2vh 0.7vh 0.3vh #18b201;
  }

  100% {
    transform: rotate(360deg);
    box-shadow: 0.2vh 0.6vh 0.3vh #333;
  }
}

.ring:before {
  position: absolute;
  content: '';
  left: 0;
  top: 0;
  height: 100%;
  width: 100%;
  border-radius: 50%;
  box-shadow: 0 0 2vh rgba(255, 255, 255, .3);
}

span,
a {
  color: #737373;
  font-size: 3vh;
  text-transform: uppercase;
  text-decoration: none;
  letter-spacing: 0.3vw;
  line-height: 4vh;
  animation: text 3s ease-in-out infinite;
}

div.reaper span {
  line-height: normal;
  font-size: 3vh;
}

div.reaper span.glow {
  text-shadow:
  -0.1vh -0.1vh 0 rgba(255, 255, 255, 0.4),
  0.1vh -0.1vh 0 rgba(255, 255, 255, 0.4),
  -0.1vh 0.1vh 0 rgba(255, 255, 255, 0.4),
  0.1vh 0.1vh 0 rgba(255, 255, 255, 0.4),
  0 -0.2vh 0.8vh,
  0 0 0.2vh,
  0 0 0.5vh #7eff00,
  0 0 1.5vh #44ff44,
  0 0 0.2vh #7eff00,
  0 0.2vh 0.3vh #000;
}

a {
  font-size: 4vh;
  animation: flicker 3s linear infinite;
}

a:hover {
  animation: none;
  text-shadow:
  -0.1vh -0.1vh 0 rgba(255, 255, 255, 0.4),
  0.1vh -0.1vh 0 rgba(255, 255, 255, 0.4),
  -0.1vh 0.1vh 0 rgba(255, 255, 255, 0.4),
  0.1vh 0.1vh 0 rgba(255, 255, 255, 0.4),
  0 -0.2vh 0.8vh,
  0 0 0.2vh,
  0 0 1.5vh #7eff00,
  0 0 2.5vh #44ff44,
  0 0 1.2vh #7eff00,
  0 0.2vh 0.3vh #000;
}

.reaper {
  position: absolute;
  bottom: 1vh;
  width: 100%;
  text-align: center;
  justify-content: center;
  align-items: center;
}

.glow {
  -webkit-transition: text-shadow 0.2s linear;
  -moz-transition: text-shadow 0.2s linear;
  -ms-transition: text-shadow 0.2s linear;
  -o-transition: text-shadow 0.2s linear;
  transition: text-shadow 0.2s linear;
}

.glow:hover {
  text-shadow: 0 0 3vh #0f0;
  /* replace with whatever color you want */
}

@keyframes flicker {

  0%,
  19%,
  22%,
  62%,
  64%,
  70%,
  100% {
    opacity: 0.99;
    text-shadow:
      -0.1vh -0.1vh 0 rgba(255, 255, 255, 0.4),
      0.1vh -0.1vh 0 rgba(255, 255, 255, 0.4),
      -0.1vh 0.1vh 0 rgba(255, 255, 255, 0.4),
      0.1vh 0.1vh 0 rgba(255, 255, 255, 0.4),
      0 -0.2vh 0.8vh,
      0 0 0.2vh,
      0 0 0.5vh #7eff00,
      0 0 1.5vh #44ff44,
      0 0 0.2vh #7eff00,
      0 0.2vh 0.3vh #000;
    }

  20%,
  21%,
  63%,
  65%,
  69.9% {
    opacity: 0.4;
    text-shadow: none;
  }
}