.slideDown{
    animation-name: slideDown;
    -webkit-animation-name: slideDown;

    animation-duration: 0.5s;
    -webkit-animation-duration: 0.5s;

    animation-timing-function: ease;
    -webkit-animation-timing-function: ease;

    visibility: visible !important;
}

    @keyframes slideDown {
        0% {
            transform: translateY(-15px) scale(1.03);
            -webkit-transform: translateY(-15px) scale(1.03);
            opacity: 0;
        }
        60% {
            opacity: 80%;
        }
        100%{
            transform: translateY(0%) scale(1);
            -webkit-transform: translateY(0%) scale(1);
            opacity: 100%;
        }
    }

.slideUp{
    animation-name: slideUp;
    -webkit-animation-name: slideUp;

    animation-duration: 0.5s;
    -webkit-animation-duration: 0.5s;

    animation-timing-function: ease;
    -webkit-animation-timing-function: ease;

    visibility: visible !important;
}

    @keyframes slideUp {
        0% {
            transform: translateY(15px) scale(1.03);
            -webkit-transform: translateY(15px) scale(1.03);
            opacity: 0;
        }
        60% {
            opacity: 80%;
        }
        100%{
            transform: translateY(0%) scale(1);
            -webkit-transform: translateY(0%) scale(1);
            opacity: 100%;
        }
    }

.slideUpRight{
    animation-name: slideUpRight;
    -webkit-animation-name: slideUpRight;

    animation-duration: 0.5s;
    -webkit-animation-duration: 0.5s;

    animation-timing-function: ease;
    -webkit-animation-timing-function: ease;

    visibility: visible !important;
}

    @keyframes slideUpRight {
        0% {
            transform: translate(-15px,15px) scale(1.03);
            -webkit-transform: translate(-15px,15px) scale(1.03);
            opacity: 0;
        }
        60% {
            opacity: 80%;
        }
        100% {
            transform: translate(0px,0px) scale(1);
            -webkit-transform: translate(0px,0px) scale(1);
            opacity: 100%;
        }
    }

.slideUpLeft{
    animation-name: slideUpLeft;
    -webkit-animation-name: slideUpLeft;

    animation-duration: 0.5s;
    -webkit-animation-duration: 0.5s;

    animation-timing-function: ease;
    -webkit-animation-timing-function: ease;

    visibility: visible !important;
}

    @keyframes slideUpLeft {
        0% {
            transform: translate(15px,15px) scale(1.03);
            -webkit-transform: translate(15px,15px) scale(1.03);
            opacity: 0;
        }
        60% {
            opacity: 80%;
        }
        100% {
            transform: translate(0px,0px) scale(1);
            -webkit-transform: translate(0px,0px) scale(1);
            opacity: 100%;
        }
    }


.zoomIn {
    animation-name: zoomIn;
    -webkit-animation-name: zoomIn;

    animation-duration: 2.5s;
    -webkit-animation-duration: 2.5s;

    animation-timing-function: ease;
    -webkit-animation-timing-function: ease;

    visibility: visible !important;
}

    @keyframes zoomIn {
        0% {
            transform: scale(1.15);
            -webkit-transform: scale(1.15);
        }
        100%{
            transform: scale(1);
            -webkit-transform: scale(1);
        }
    }