.glitch { color: white; font-size: 2em; position: relative; width: 250px; margin: 0 auto; text-align: center; }

@keyframes noise-anim { 0% { clip: rect(53px, 9999px, 64px, 0); }
  5% { clip: rect(2px, 9999px, 93px, 0); }
  10% { clip: rect(44px, 9999px, 4px, 0); }
  15% { clip: rect(27px, 9999px, 73px, 0); }
  20% { clip: rect(13px, 9999px, 30px, 0); }
  25% { clip: rect(92px, 9999px, 1px, 0); }
  30% { clip: rect(61px, 9999px, 23px, 0); }
  35% { clip: rect(34px, 9999px, 39px, 0); }
  40% { clip: rect(90px, 9999px, 89px, 0); }
  45% { clip: rect(42px, 9999px, 48px, 0); }
  50% { clip: rect(34px, 9999px, 55px, 0); }
  55% { clip: rect(4px, 9999px, 86px, 0); }
  60% { clip: rect(60px, 9999px, 21px, 0); }
  65% { clip: rect(41px, 9999px, 61px, 0); }
  70% { clip: rect(66px, 9999px, 44px, 0); }
  75% { clip: rect(34px, 9999px, 48px, 0); }
  80% { clip: rect(89px, 9999px, 47px, 0); }
  85% { clip: rect(34px, 9999px, 66px, 0); }
  90% { clip: rect(2px, 9999px, 90px, 0); }
  95% { clip: rect(68px, 9999px, 85px, 0); }
  100% { clip: rect(34px, 9999px, 46px, 0); } }

.glitch:after { content: attr(data-text); width: 250px; position: absolute; left: 2px; text-shadow: -1px 0 red; top: 0; color: white; background: #111; overflow: hidden; clip: rect(0, 900px, 0, 0); animation: noise-anim 5s infinite linear alternate-reverse; }

@keyframes noise-anim-2 { 0% { clip: rect(59px, 9999px, 3px, 0); }
  5% { clip: rect(1px, 9999px, 36px, 0); }
  10% { clip: rect(40px, 9999px, 89px, 0); }
  15% { clip: rect(32px, 9999px, 85px, 0); }
  20% { clip: rect(72px, 9999px, 56px, 0); }
  25% { clip: rect(39px, 9999px, 66px, 0); }
  30% { clip: rect(25px, 9999px, 4px, 0); }
  35% { clip: rect(87px, 9999px, 50px, 0); }
  40% { clip: rect(70px, 9999px, 31px, 0); }
  45% { clip: rect(2px, 9999px, 19px, 0); }
  50% { clip: rect(26px, 9999px, 94px, 0); }
  55% { clip: rect(76px, 9999px, 50px, 0); }
  60% { clip: rect(31px, 9999px, 76px, 0); }
  65% { clip: rect(28px, 9999px, 48px, 0); }
  70% { clip: rect(34px, 9999px, 29px, 0); }
  75% { clip: rect(25px, 9999px, 31px, 0); }
  80% { clip: rect(30px, 9999px, 49px, 0); }
  85% { clip: rect(98px, 9999px, 81px, 0); }
  90% { clip: rect(80px, 9999px, 21px, 0); }
  95% { clip: rect(89px, 9999px, 44px, 0); }
  100% { clip: rect(20px, 9999px, 65px, 0); } }

.glitch:before { content: attr(data-text); width: 250px; position: absolute; left: -2px; text-shadow: 1px 0 blue; top: 0; color: white; background: #111; overflow: hidden; clip: rect(0, 900px, 0, 0); animation: noise-anim-2 2s infinite linear alternate-reverse; }