body {
  background-color: orange;
  font-family: 'Creepster', cursive;
  background-image: url('https://media.giphy.com/media/3a7MwISbmEF8I/giphy.gif');

}

h1 {
  font-size: 72px;
  text-align: center;
}

a {
  font-size: 45px;
  color: red;
  animation: pulse 1s;
  animation-iteration-count: infinite;
  text-decoration: none;
}

a:hover {
  color: yellow;
}

.back {
  display: flex;
  justify-content: center;
  margin-top: 30px;
}

.content {
  display: flex;
  flex-direction: column;
  justify-content: space-around;
  align-items: center;
  height: 80vh;
}

.videos {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  overflow: scroll;
  height: 350px;
}

iframe {
  margin: 20px;
  flex-shrink: 0;
}

@keyframes example {
  0%   {color:black; left:0px; top:0px;}
  15%  {color:red; left:200px; top:0px;}
  30%  {color:yellow; left:200px; top:50px;}
  45%  {color:red; left:-200px; top:50px;}
  60% {color:yellow; left:-200px; top:0px;}
  75% {color:black; left:0px; top:0px;}
}

@keyframes pulse {
  0% {

    text-shadow: 0px 0px #000;
  }
  70% {

      text-shadow: 5px 5px 8px #000;
  }
  100% {

      text-shadow: 0px 0px #000;
  }
}

.enter-text {
  position: relative;
  animation: example 4s, pulse 1s;
  animation-iteration-count: infinite;
  animation-direction: alternate;
}