html {
  background: #8400ff;
  line-height:0px;
  animation-name: flashbg;
  animation-duration: 10s, 10s;
  animation-iteration-count: infinite;
  animation-timing-function: ease-in;
  animation-direction: alternate;
}

a:link, a:visited, a:hover {
  text-decoration: none;
  color: white;
}

a {
  text-align: center;
  font-size: 15px;
}

body {
  background: #8400ff
  line-height: 1px;
}

@font-face {
  font-family: Vogue;
  src: url(fonts/Vogue.ttf);
}

@font-face {
  font-family: Bedas;
  src: url(fonts/BebasNeueRegular-gxj83.ttf);
}

@font-face {
  font-family: Noodle;
  src: url(fonts/Bignoodletitling-8ojz.ttf);
}

@font-face {
  font-family: LineSeed;
  src: url("fonts/line seed/LINESeedSans_Rg-BF66398876eda0e.otf");
}

@font-face {
  font-family: BlackNorth;
  src: url("fonts/Blacknorthdemo-mLE25.otf");
}

h1 {
  transform-origin: 0
  display: inline-block;
  font-family: Noodle;
  text-align: center;
  color: #ff00ee;
  font-size: 90px;
  animation-name: flash, flashoutline;
  animation-duration: 1s, 1s;
  animation-iteration-count: infinite;
  animation-timing-function: ease-in, ease-in;
  animation-direction: alternate, alternate-reverse;
  transition: all 0.3s;
}

h1:hover {
  color: white;
  animation-play-state: paused;
  transition: all 0.3s;
  transform: scale(1.1);
}

p {
  text-align: center;
  color: white;
  font-size: 23px;
}

.center {
    right: 50%;
    bottom: 50%;
    transform: translate(50%,50%);
    position: absolute;
}

@keyframes flash {
  from {color: white;}
  to {color: #ff00ee;}
}

@keyframes flashoutline {
  
  from {text-shadow: -1px -1px 0 #ff00ee, 1px -1px 0 #ff00ee, -1px 1px 0 #ff00ee, 1px 1px 0 #ff00ee;}
  to {text-shadow: -1px -1px 0 #ffffff, 1px -1px 0 #ffffff, -1px 1px 0 #ffffff, 1px 1px 0 #ffffff;}
}

.fa {
  margin: 15px;
}

@keyframes flashbg {
  from {background: #8400ff;}
  to {background: #9209b6;}
}