@keyframes fadein {
    from { opacity: 0; }
    to { opacity: 1; }
}
@keyframes fadeout {
    from { opacity: 1; }
    to { opacity: 0; }
}


@keyframes slidein {
    from { left: 100%; }
    to { left: 0; }
}
@keyframes slideout {
    from { left: 0; }
    to { left: -100%; }
}

.animation-fadein {
    animation: fadein 1s;
    opacity: 1;
    z-index: 80;
}
.animation-fadeout {
    animation: fadeout 1s;
    opacity: 0;
    z-index: 70;
}

.animation-slidein {
    animation: slidein 1s;
    left: 0;
}
.animation-slideout {
    animation: slideout 1s;
    left: 100%;
}