@keyframes slide_1 {
    0% {
        opacity: 0;
        transform: translateY(-10vw);
    }

    5% {
        opacity: 0;
        transform: translateY(-10vw);
    }

    15% {
        opacity: 100;
        transform: translateY(0);
    }

    90% {
        opacity: 100;
        transform: translateY(0);
    }

    100% {
        opacity: 0;
        transform: translateY(-10vw);
    }
}

@keyframes slide_2 {
    0% {
        opacity: 0;
        transform: translateY(10vw);
    }

    5% {
        opacity: 0;
        transform: translateY(10vw);
    }

    15% {
        opacity: 100;
        transform: translateY(0);
    }

    90% {
        opacity: 100;
        transform: translateY(0);
    }

    100% {
        opacity: 0;
        transform: translateY(10vw);
    }
}

.imagerunning_0 {
    animation: slide_1 6s ease-in-out 250ms 1 alternate forwards;
}

.imagerunning_1 {
    animation: slide_1 6s ease-in-out 500ms 1 alternate forwards;
}

.imagerunning_2 {
    animation: slide_1 6s ease-in-out 750ms 1 alternate forwards;
}

.imagerunning_3 {
    animation: slide_1 6s ease-in-out 1000ms 1 alternate forwards;
}

.imagerunning_4 {
    animation: slide_1 6s ease-in-out 1250ms 1 alternate forwards;
}

.imagerunning_5 {
    animation: slide_1 6s ease-in-out 1500ms 1 alternate forwards;
}

.imagerunning_6 {
    animation: slide_2 6s ease-in-out 1500ms 1 alternate forwards;
}

.imagerunning_7 {
    animation: slide_2 6s ease-in-out 1250ms 1 alternate forwards;
}

.imagerunning_8 {
    animation: slide_2 6s ease-in-out 1000ms 1 alternate forwards;
}

.imagerunning_9 {
    animation: slide_2 6s ease-in-out 750ms 1 alternate forwards;
}

.imagerunning_10 {
    animation: slide_2 6s ease-in-out 500ms 1 alternate forwards;
}

.imagerunning_11 {
    animation: slide_2 6s ease-in-out 250ms 1 alternate forwards;
}