@import url('https://fonts.googleapis.com/css2?family=Big+Shoulders+Stencil+Display&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Exo+2&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Special+Elite&family=Ubuntu&display=swap');

body {
  background-color: #1B1B1B;
  color: #FFFFFF;
  font-family: 'Special Elite', cursive;
  font-size: 2.7em;
  text-align: center;
}

h1, h2, h3, h4, h5, h6 {
  font-family: 'Special Elite', cursive;
  text-transform: uppercase;
  letter-spacing: 20px;
}

b, strong {
  color: #dd3524;
}

i, em {
  color: #44945e;
}

b i {
  color: #9B8887;
}

a {
  display: inline-block;
  color: #8B72BE;
  text-shadow: 2px 2px 0 rgba(255, 255, 255, 0.8);
}

a:hover {
  display: inline-block;
  color: #C9A0DC;
  text-shadow: 2px 2px 0 gray;
  -webkit-animation: shake 0.2s infinite;
  -moz-animation: shake 0.2s infinite;
  -o-animation: shake 0.2s infinite;
  animation: shake 0.2s infinite;
}

@-webkit-keyframes shake {
  0% { transform: translate(1px, 1px); }
  10% { transform: translate(-1px, -2px); }
  20% { transform: translate(-3px, 0px); }
  30% { transform: translate(3px, 2px); }
  40% { transform: translate(1px, -1px); }
  50% { transform: translate(-1px, 2px); }
  60% { transform: translate(-3px, 1px); }
  70% { transform: translate(3px, 1px); }
  80% { transform: translate(-1px, -1px); }
  90% { transform: translate(1px, 2px); }
  100% { transform: translate(1px, -2px); }
}

@-moz-keyframes shake {
  0% { transform: translate(1px, 1px); }
  10% { transform: translate(-1px, -2px); }
  20% { transform: translate(-3px, 0px); }
  30% { transform: translate(3px, 2px); }
  40% { transform: translate(1px, -1px); }
  50% { transform: translate(-1px, 2px); }
  60% { transform: translate(-3px, 1px); }
  70% { transform: translate(3px, 1px); }
  80% { transform: translate(-1px, -1px); }
  90% { transform: translate(1px, 2px); }
  100% { transform: translate(1px, -2px); }
}

@-o-keyframes shake {
  0% { transform: translate(1px, 1px); }
  10% { transform: translate(-1px, -2px); }
  20% { transform: translate(-3px, 0px); }
  30% { transform: translate(3px, 2px); }
  40% { transform: translate(1px, -1px); }
  50% { transform: translate(-1px, 2px); }
  60% { transform: translate(-3px, 1px); }
  70% { transform: translate(3px, 1px); }
  80% { transform: translate(-1px, -1px); }
  90% { transform: translate(1px, 2px); }
  100% { transform: translate(1px, -2px); }
}

@keyframes shake {
  0% { transform: translate(1px, 1px); }
  10% { transform: translate(-1px, -2px); }
  20% { transform: translate(-3px, 0px); }
  30% { transform: translate(3px, 2px); }
  40% { transform: translate(1px, -1px); }
  50% { transform: translate(-1px, 2px); }
  60% { transform: translate(-3px, 1px); }
  70% { transform: translate(3px, 1px); }
  80% { transform: translate(-1px, -1px); }
  90% { transform: translate(1px, 2px); }
  100% { transform: translate(1px, -2px); }
}