.animated-text { 
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 50px;
  margin-bottom: 15px;
}

.animated-text  a {color: #663399; text-decoration: none;} 
.animated-text  a:active {color: #663399; text-decoration: none;} 
.animated-text  a:visited {color: #663399; text-decoration: none;}

.text-frames {
  display: flex;
  justify-content: center;
  align-items: center;
  font-family: Arial;
  font-size: 20px;
  font-weight: bold;
  position: absolute;
  height: 50px;
  padding: 0 5px 0 5px;
  margin-top: 10px;
  
  -webkit-animation: fadeslideUp 12s infinite; /* Chrome, Opera 15+, Safari 5+ */
  -moz-animation: fadeslideUp 12s infinite; /* Fx 5+ */
  -o-animation: fadeslideUp 12s infinite; /* Opera 12+ */
  animation: fadeslideUp 12s infinite; /* Chrome, Firefox 16+, IE 10+, Opera */
}

.text-frame-1 {
  background: #C0C0C0;
  color: #663399;
  }

.text-frame-2 {
  background: #C0C0C0;
  color: #663399;
  }

.text-frame-3 {
  background: #C0C0C0;
  color: #663399;
  }

.text-frame-4 {
  background: #C0C0C0;
  color: #663399;
  }

#frame-2 {
    animation-delay: -9s;
    -webkit-animation-delay: -9s;
    -moz-animation-delay: -9s;
}

#frame-3 {
    animation-delay: -6s;
    -webkit-animation-delay: -6s;
    -moz-animation-delay: -6s;
}

#frame-4 {
    animation-delay: -3s;
    -webkit-animation-delay: -3s;
    -moz-animation-delay: -3s;
}

@-webkit-keyframes fadeslideUp {
    0% {
      opacity: 0;
      -webkit-transform: translateY(-40%);
      transform: translateY(-40%);
    }
    10% {
      opacity: 1;
      -webkit-transform: translateY(-50%);
      transform: translateY(-50%);
    }
    20% {
      opacity: 1;
      -webkit-transform: translateY(-50%);
      transform: translateY(-50%);
    }
    25% {
      opacity: 0;
      -webkit-transform: translateY(-60%);
      transform: translateY(-60%);
    }
    100% {
      opacity: 0;
      -webkit-transform: translateY(-60%);
      transform: translateY(-60%);
    }
}

@-moz-keyframes fadeslideUp {
    0% {
      opacity: 0;
      transform: translateY(-40%);
    }
    10% {
      opacity: 1;
      transform: translateY(-50%);
    }
    20% {
      opacity: 1;
      transform: translateY(-50%);
    }
    25% {
      opacity: 0;
      transform: translateY(-60%);
    }
    100% {
      opacity: 0;
      transform: translateY(-60%);
    }
}

@-o-keyframes fadeslideUp {
    0% {
      opacity: 0;
      transform: translateY(-40%);
    }
    10% {
      opacity: 1;
      transform: translateY(-50%);
    }
    20% {
      opacity: 1;
      transform: translateY(-50%);
    }
    25% {
      opacity: 0;
      transform: translateY(-60%);
    }
    100% {
      opacity: 0;
      transform: translateY(-60%);
    }
}

@keyframes fadeslideUp {
    0% {
      opacity: 0;
      -ms-transform: translateY(-40%);
      transform: translateY(-40%);
    }
    10% {
      opacity: 1;
      -ms-transform: translateY(-50%);
      transform: translateY(-50%); 
    }
    20% {
      opacity: 1;
      -ms-transform: translateY(-50%);
      transform: translateY(-50%); 
    }
    25% {
      opacity: 0;
      -ms-transform: translateY(-60%);
      transform: translateY(-60%);
    }
    100% {
      opacity: 0;
      -ms-transform: translateY(-60%);
      transform: translateY(-60%);
    }
}