body{
    font-style: arial;
    background-color: black;
    
}
.animation-box{
    width: 75%;
    height: 27.5rem;
    margin: 0 auto;
    overflow: hidden;
    position: relative;
}


.first-text{
    font-size: 4.0rem;
    color: white;
    position: absolute;
    left: 2.5rem;
    top: 5rem;
    opacity: 0;
    animation-name: untoldcoding1;
    animation-duration: 6s;
    animation-delay: 1s;
}
.second-text{
    font-size: 3.0rem;
    color: white;
    position: absolute;
    top: 8rem;
    opacity: 0;
    animation-name: untoldcoding2;
    animation-duration: 6s;
    animation-delay: 2s;
}


.third-text{
    font-size: 2.0rem;
    color: white;
    position: absolute;
    left: 45%;
    top: 45%;
    opacity: 0;
    animation-name: untoldcoding3;
    animation-duration: 5s;
    animation-delay: 8s;
    transform: rotate(-90deg);
    white-space: nowrap;
}


.fourth-text{
    font-size: 3.0rem;
    color: red;
    position: absolute;
    left: 20%;
    top: 15rem;
    opacity: 0;
    animation-name: untoldcoding4;
    animation-duration: 12s;
    animation-delay: 10s;
}

.fifth-text{
    font-size: 3.5rem;
    color: rgb(240,220,90);
    position: absolute;
    left: 5%;
    bottom:40%;
    opacity: 0;
    animation-name: untoldcoding5;
    animation-duration: 12s;
    animation-delay: 8s;
}

@keyframes untoldcoding1 {
    0%{
        top: -3rem;
        opacity: 0;
    }
    75%{
        top: 45%;
        opacity: 1;
    }
    100%{
        top: -3rem;
        opacity: 0;
    }
}

@keyframes untoldcoding2 {
    0%{
        top: 3rem;
        opacity: 0;
    }
    75%{
        top: 50%;
        opacity: 1;
    }
    100%{
        
        opacity: 0;
    }
}
@keyframes untoldcoding3{
    0%{
        top:-2rem;
        opacity: 0;;
    }
    75%{
        top:50%;
        opacity:1;
    }
    100%{
        opacity:0 ;
    }
}

@keyframes untoldcoding4{
    0%{
        top:-3rem;
        opacity: 0;
    }
    75%{
        top:60%;
        opacity: 1;
    }
    100%{
        opacity:0;
    }
}

@keyframes untoldcoding5{
    0%{
        left: -3rem;
        opacity:0;
     }
     75%{
        top:100%;
        opacity: 1;
     }
     100%{
        opacity: 0;
     }
}