body {
  background-color: #222222;
  color: #fff;
}

p {
  text-align: center;
  font-size: 7em;
  display: inline;
  padding: 10px;
}

p.red a {
  font-family: Monoton;
  animation: red 1.5s ease-in-out infinite alternate;
}
p.red a:hover {
  color: #FF1F09;
  animation: none;
}
@keyframes red {
  from {
    text-shadow: 0 0 10px #fff, 0 0 20px #fff, 0 0 30px #fff, 0 0 40px #FF1F09, 0 0 70px #FF1F09, 0 0 80px #FF1F09, 0 0 100px #FF1F09, 0 0 150px #FF1F09;
  }
  to {
    text-shadow: 0 0 5px #fff, 0 0 10px #fff, 0 0 15px #fff, 0 0 20px #FF1F09, 0 0 35px #FF1F09;
  }
}
p.blue a {
  font-size: 150%;
  color: #228DFF;
  font-family: Iceland;
}
p.blue a:hover {
  text-shadow: 0 0 10px #228DFF, 0 0 20px #228DFF, 0 0 30px #228DFF, 0 0 40px #228DFF, 0 0 70px #228DFF, 0 0 80px #228DFF, 0 0 100px #228DFF, 0 0 150px #228DFF;
}

p.yellow a {
  color: #FFDD1B;
  font-family: Pacifico;
}
p.yellow a:hover {
  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;
}

p.green a {
  color: #B6FF00;
  font-family: Permanent Marker;
}
p.green a:hover {
  animation: green 1.5s ease-in-out infinite alternate;
}
@keyframes green {
  from {
    text-shadow: 0 0 10px #fff, 0 0 20px #fff, 0 0 30px #fff, 0 0 40px #B6FF00, 0 0 70px #B6FF00, 0 0 80px #B6FF00, 0 0 100px #B6FF00, 0 0 150px #B6FF00;
  }
  to {
    text-shadow: 0 0 5px #fff, 0 0 10px #fff, 0 0 15px #fff, 0 0 20px #B6FF00, 0 0 35px #B6FF00, 0 0 40px #B6FF00, 0 0 50px #B6FF00, 0 0 75px #B6FF00;
  }
}
p.orange a {
  color: #FF9900;
  font-family: Audiowide;
}
p.orange a:hover {
  animation: orange 2.0s ease-in-out infinite alternate;
}
@keyframes orange {
  from {
    text-shadow: 0 0 10px #fff, 0 0 20px #fff, 0 0 30px #fff, 0 0 40px #FF9900, 0 0 70px #FF9900, 0 0 80px #FF9900, 0 0 100px #FF9900, 0 0 150px #FF9900;
  }
  to {
    text-shadow: 0 0 5px #fff, 0 0 10px #fff, 0 0 15px #fff, 0 0 20px #FF9900, 0 0 35px #FF9900, 0 0 40px #FF9900, 0 0 50px #FF9900, 0 0 75px #FF9900;
  }
}
p.violet a {
  color: #BA01FF;
  font-family: Vampiro One;
}
p.violet a:hover {
  animation: violet 1.5s ease-in-out infinite alternate;
}
@keyframes violet {
  from {
    text-shadow: 0 0 10px #fff, 0 0 20px #fff, 0 0 30px #fff, 0 0 40px #ff00de, 0 0 70px #ff00de, 0 0 80px #ff00de, 0 0 100px #ff00de, 0 0 150px #ff00de;
  }
  to {
    text-shadow: 0 0 5px #fff, 0 0 10px #fff, 0 0 15px #fff, 0 0 20px #ff00de, 0 0 35px #ff00de, 0 0 40px #ff00de, 0 0 50px #ff00de, 0 0 75px #ff00de;
  }
}
p a:hover {
  color: #fff;
}

@media (max-width: 1000px) {
  p {
    font-size: 3.5em;
  }
}