@media (min-width: 992px) {
    .animation {
        /* opacity: 0; */
        /* transform: translateX(-50px);
        transition: all 0.7s ease-out;
        transition-delay: 0.1s; */
    }
    .slide-up-lg-animation {
        -webkit-animation: slideUp 1s;
        -moz-animation: slideUp 1s;
        animation: slideUp 1s;
    }

}

.scroll-animation {
    /* opacity: 1; */
    transform: translateX(0);

}

.zoom-animation {

    -webkit-animation: zoomeffect 10s;
    -moz-animation: zoomeffect 10s;
    animation: zoomeffect 10s;
}

@keyframes zoomeffect {
    0% {
        background-position: center;
        transform: scale(2, 2);
    }

    100% {
        background-position: center;
        transform: scale(1, 1);
    }

}

.scale-animation {
    -webkit-animation: scaleY .5s;
    -moz-animation: scaleY .5s;
    animation: scaleY .5s;
}

@keyframes scaleY {
    0% {
        transform: scaleY(0);
    }

    100% {
        transform: scaleY(1);
    }

}

.slide-right-animation {
    -webkit-animation: slideRight .5s;
    -moz-animation: slideRight .5s;
    animation: slideRight .5s;
}

@keyframes slideRight {
    0% {
        /* opacity: 0; */
        transform: translateX(-300px);
    }

    100% {
        /* opacity: 1; */
        transform: translateX(0);

    }

}

.slide-left-animation {
    -webkit-animation: slideLeft .5s;
    -moz-animation: slideLeft .5s;
    animation: slideLeft .5s;
}

@keyframes slideLeft {
    0% {
        /* opacity: 0; */
        transform: translateX(50px);
    }

    100% {
        /* opacity: 1; */
        transform: translateX(0);

    }

}

.slide-up-animation {
    -webkit-animation: slideUp 1s;
    -moz-animation: slideUp 1s;
    animation: slideUp 1s;
}

@keyframes slideUp {
    0% {
        /* opacity: 0; */
        transform: translateY(50px);
    }

    100% {
        /* opacity: 1; */
        transform: translateY(0);

    }

}