[data-animation="fadeIn"]{
    opacity: 0;
    transform: translate(0, 80px);
}

.trig [data-animation="fadeIn"],
[data-animation="fadeIn"].trig{
    animation: fadeIn 0.3s normal forwards ease-in-out;
}

.cover h3{
    opacity: 0;
    transform: translate(0, 50px);
}

.cover h4{
    opacity: 0;
    animation-delay: 0.5s;
    transform: translate(0, -20px);
}

.cover nav{
    opacity: 0;
    transform: translate(0, 80px);
    animation-delay: 1s;
}


.cover .trig h3{
    animation: fadeUp 0.5s normal forwards ease-in-out;
}

.cover .trig h4{
    animation: fadeDown 0.5s normal forwards ease-in-out;
}

.cover .trig nav{
    animation: fadeUp 0.5s normal forwards ease-in-out;
}

@keyframes fadeIn {
    0% {
        opacity:0;
        transform: translate(0, 50px);
    }
    100% {
        opacity:1;
        transform: translate(0, 0);
    }
}

@keyframes fadeUp {
    0% {
        opacity:0;
        transform: translate(0, 80px);
    }
    100% {
        opacity:1;
        transform: translate(0, 0);
    }
}

@keyframes fadeDown {
    0% {
        opacity:0;
        transform: translate(0, -50px);
    }
    100% {
        opacity:1;
        transform: translate(0, 0);
    }
}

@keyframes fade {
    0% {
        opacity:0;
    }
    100% {
        opacity:1;
    }
}