@keyframes slideDown {

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

    50% {
    transform: translateY(8%);
    }

    65% {
    transform: translateY(-4%);
    }

    80% {
    transform: translateY(4%);
    }

    95% {
    transform: translateY(-2%);
    }

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

}

.slideDown {
animation-duration: 1s;
animation-name: slideDown;
animation-timing-function: ease;
}