/* glitch text */

.glitch{

position:relative;
font-size:64px;
letter-spacing:10px;

}

.glitch::before,
.glitch::after{

content:attr(data-text);
position:absolute;
left:0;
top:0;
width:100%;
overflow:hidden;

}

.glitch::before{

color:#ff0050;
animation:glitch1 2s infinite linear alternate;

}

.glitch::after{

color:#00eaff;
animation:glitch2 2s infinite linear alternate;

}

@keyframes glitch1{

0%{clip-path:inset(0 0 90% 0);}
20%{clip-path:inset(10% 0 70% 0);}
40%{clip-path:inset(40% 0 40% 0);}
60%{clip-path:inset(60% 0 20% 0);}
80%{clip-path:inset(80% 0 5% 0);}
100%{clip-path:inset(0 0 90% 0);}

}

@keyframes glitch2{

0%{clip-path:inset(90% 0 0 0);}
20%{clip-path:inset(70% 0 10% 0);}
40%{clip-path:inset(40% 0 40% 0);}
60%{clip-path:inset(20% 0 60% 0);}
80%{clip-path:inset(5% 0 80% 0);}
100%{clip-path:inset(90% 0 0 0);}

}