Template:Text Shuffle/styles.css

/* assembling piece by piece rn */
/* found some good tutorial but well lets see */

.TextShuffler {
  display: flex;
  flex-direction: column;
  animation: scrollText 8s linear infinite;
}

.TextShuffler > div {
  height: 1.5em;
  display: flex;
  align-items: center;
  justify-content: center;
}

@keyframes scrollText {
  0% { transform: translateY(0); }
  20% { transform: translateY(-1.5em); }
  40% { transform: translateY(-3em); }
  60% { transform: translateY(-4.5em); }
  80% { transform: translateY(-6em); }
  100% { transform: translateY(0); }
}