@media only screen and (min-width:768px) {
    .animation-element {
        opacity: 0;
        position: relative;
    }
    /*animation element sliding left*/

    .animation-element.slide-left {
        opacity: 0;
        -moz-transition: all 1000ms linear;
        -webkit-transition: all 1000ms linear;
        -o-transition: all 1000ms linear;
        transition: all 1000ms linear;
        -moz-transform: translate3d(-200px, 0px, 0px);
        -webkit-transform: translate3d(-200px, 0px, 0px);
        -o-transform: translate(-200px, 0px);
        -ms-transform: translate(-200px, 0px);
        transform: translate3d(-200px, 0px, 0px);
    }

    .animation-element.slide-top {
        opacity: 0;
        -moz-transition: all 1000ms linear;
        -webkit-transition: all 1000ms linear;
        -o-transition: all 1000ms linear;
        transition: all 1000ms linear;
        -moz-transform: translate3d(0px, -200px, 0px);
        -webkit-transform: translate3d(0px, -200px, 0px);
        -o-transform: translate(0px, -200px, 0px);
        -ms-transform: translate(0px, -200px, 0px);
        transform: translate3d(0px, -200px, 0px);
    }

    .animation-element.slide-right {
        opacity: 0;
        -moz-transition: all 1000ms linear;
        -webkit-transition: all 1000ms linear;
        -o-transition: all 1000ms linear;
        transition: all 1000ms linear;
        -moz-transform: translateX(20%);
        -webkit-transform: translateX(20%);
        -o-transform: translateX(20%);
        -ms-transform: translateX(20%);
        transform: translateX(20%);
    }

    .animation-element.slide-bottom {
        opacity: 0;
        -moz-transition: all 1000ms linear;
        -webkit-transition: all 1000ms linear;
        -o-transition: all 1000ms linear;
        transition: all 1000ms linear;
        -moz-transform: translateY(200px);
        -webkit-transform: translateY(200px);
        -o-transform: translateY(200px);
        -ms-transform: translateY(200px);
        transform: translateY(200px);
    }

    .animation-element.slide-left.in-view,
    .animation-element.slide-top.in-view {
        opacity: 1;
        -moz-transform: translate3d(0px, 0px, 0px);
        -webkit-transform: translate3d(0px, 0px, 0px);
        -o-transform: translate(0px, 0px);
        -ms-transform: translate(0px, 0px);
        transform: translate3d(0px, 0px, 0px);
    }
    .animation-element.slide-right.in-view {
        opacity: 1;
        -moz-transform: translateX(0);
        -webkit-transform: translateX(0);
        -o-transform: translateX(0);
        -ms-transform: translateX(0);
        transform: translateX(0);
    }
    .animation-element.slide-bottom.in-view {
        opacity: 1;
        -moz-transform: translateY(0);
        -webkit-transform: translateY(0);
        -o-transform: translateY(0);
        -ms-transform: translateY(0);
        transform: translateY(0);
    }

}
.animation-element.slide-top {
    opacity: 0;
    -moz-transition: all 1000ms linear;
    -webkit-transition: all 1000ms linear;
    -o-transition: all 1000ms linear;
    transition: all 1000ms linear;
    -moz-transform: translate3d(0px, -200px, 0px);
    -webkit-transform: translate3d(0px, -200px, 0px);
    -o-transform: translate(0px, -200px, 0px);
    -ms-transform: translate(0px, -200px, 0px);
    transform: translate3d(0px, -200px, 0px);
}

.animation-element.slide-bottom {
    opacity: 0;
    -moz-transition: all 1000ms linear;
    -webkit-transition: all 1000ms linear;
    -o-transition: all 1000ms linear;
    transition: all 1000ms linear;
    -moz-transform: translateY(200px);
    -webkit-transform: translateY(200px);
    -o-transform: translateY(200px);
    -ms-transform: translateY(200px);
    transform: translateY(200px);
}
.animation-element.slide-top.in-view {
    opacity: 1;
    -moz-transform: translate3d(0px, 0px, 0px);
    -webkit-transform: translate3d(0px, 0px, 0px);
    -o-transform: translate(0px, 0px);
    -ms-transform: translate(0px, 0px);
    transform: translate3d(0px, 0px, 0px);
}

.animation-element.slide-bottom.in-view {
    opacity: 1;
    -moz-transform: translateY(0);
    -webkit-transform: translateY(0);
    -o-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
}