@import url("https://fonts.googleapis.com/css2?family=Audiowide&display=swap");

body {
  background: black;
  font-family: "Impact;
  width: 1vw;
  margin: 25rem auto;
}

p {
  text-align: center;
  font-size: 10rem;
}

.textGlitchRGB {
  color: rgba(255, 255, 255, 0.8);
  text-shadow: 3px 3px 0px rgb(255, 0, 0), -3px 3px 0px rgb(0, 255, 0),
    3px -3px 0px rgb(0, 0, 255);
  animation: rgb-glitch 555ms ease infinite alternate;
}
@keyframes rgb-glitch {
  0% {
    color: rgba(255, 255, 255, 0.5);
    text-shadow: 13px 3px 0px rgb(255, 0, 0), -3px 3px 0px rgb(0, 255, 0);
  }
  20% {
    text-shadow: 13px 3px 0px rgb(0, 255, 0), -3px 3px 0px rgb(0, 0, 255),
      3px -3px 0px rgb(255, 0, 0);
  }
  22% {
    text-shadow: 3px 3px 0px rgb(0, 255, 0), -3px 3px 0px rgb(0, 0, 255),
      3px -3px 0px rgb(255, 0, 0);
  }
  25% {
    text-shadow: 3px 3px 0px rgb(0, 255, 0), -3px 3px 0px rgb(0, 0, 255),
      3px -3px 0px rgb(255, 0, 0);
  }
  60% {
    text-shadow: 4px 2px 0px rgb(0, 255, 0), -3px 3px 0px rgb(0, 0, 255),
      3px -3px 0px rgb(255, 0, 0);
  }
  65% {
    text-shadow: 4px 2px 0px rgb(0, 255, 0), -3px 13px 0px rgb(0, 0, 255),
      13px -3px 0px rgb(255, 0, 0);
  }
  67% {
    color: rgba(255, 255, 255, 1);
    text-shadow: 4px 2px 0px rgb(0, 255, 0), -3px 13px 0px rgb(0, 0, 255),
      3px -3px 0px rgb(255, 0, 0);
  }
  90% {
    text-shadow: 3px 3px 0px rgb(0, 0, 255), -3px 3px 0px rgb(255, 0, 0),
      3px -3px 0px rgb(0, 255, 0);
  }
  92% {
    text-shadow: 0px 0px 0px none;
  }
}
