
body{
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 20%;
}
.container{
    position: absolute;
    margin: auto;
    width: 100%;
    text-align: center;
    height: fit-content;
    font-size:80px;
}

.container span{
    display: inline-block;
    color: transparent;
    text-shadow: 0px 0px 0px black;
    animation-duration: 5s;
    animation-iteration-count: infinite;
}

.container span:nth-child(1){
    animation-name: fadeleft;
}
.container span:nth-child(2){
    animation-name: faderight;
    animation-delay: .5s;
}
.container span:nth-child(3){
    animation-name: fadeleft;
    animation-delay: .8s;
}
.container span:nth-child(4){
    animation-name: fadeleft;
    animation-delay: 1.1s;
}
.container span:nth-child(5){
    animation-name: faderight;
    animation-delay: 1.4s;
}
.container span:nth-child(6){
    animation-name: fadeleft;
    animation-delay: 1.7s;
}
.container span:nth-child(7){
    animation-name: faderight;
    animation-delay: 2s;
}

@keyframes fadeleft{
    50%{
        transform: skew(50deg) translateY(-200%);
        text-shadow: 0px 0px 50px;
        opacity: 0;
    }
}
@keyframes faderight{
    50%{
        transform: skew(-50deg) translateY(-200%);
        text-shadow: 0px 0px 50px;
        opacity: 0;
    }
}