div{
    padding-top: 300px;
    padding-left: 200px;
    animation-name: example;
    animation-duration: 5s;
    background-color: red;
    display: inline-block;
    animation-name: nono;
    animation-duration: 7s;
}
button{
    color: rgb(221, 11, 11);
    size: 30px;
    background-color: rgb(197, 218, 12);
    animation-direction: reverse;
    
}
p{
    color: rgb(69, 221, 89);
    text-align: center;
    animation-name: done;
    animation-duration: 7s;
    font-size: 40px;
    padding-top: 90px;
}
.mop{
    color: cadetblue;
    animation-name: wop;
    animation-duration: 7s;
    padding-top: 10px;
    font-size: 19px;
}
body{
    background-image: url(bodi.jpg);
}
.polo{
    font-family: impact;
    font-size: 20px;
}
@keyframes example{
    from{background-color: chocolate;}
    to{background-color: chartreuse;}
}
@keyframes done{
    from{font-size: 20px;}
    to{font-size: 40px;}
}
@keyframes wop{
    from{padding-top: 300px;}
    to{padding-top: 10px;}
}
@keyframes nono{
    from{visibility: hidden;}
    to{visibility: visible;}
}