@keyframes mySlideInRight {
    from {
        -webkit-transform: translate3d(100vw, 0, 0);
        transform: translate3d(100vw, 0, 0);
        visibility: visible;
    }

    to {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

.my_animate__slideInRight {
    -webkit-animation-name: mySlideInRight;
    animation-name: mySlideInRight;
}

/*=====================*/

@keyframes mySlideInLeft {
    from {
        -webkit-transform: translate3d(-100vw, 0, 0);
        transform: translate3d(-100vw, 0, 0);
        visibility: visible;
    }

    to {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

.my_animate__slideInLeft {
    -webkit-animation-name: mySlideInLeft;
    animation-name: mySlideInLeft;
}

/*=====================*/

@keyframes mySlideInUp {
    from {
        -webkit-transform: translate3d(0, 100vh, 0);
        transform: translate3d(0, 100vh, 0);
        visibility: visible;
    }

    to {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }
}

.my_animate__slideInUp {
    -webkit-animation-name: mySlideInUp;
    animation-name: mySlideInUp;
}

/*=====================*/

@keyframes mySlideOutUp {
    from {
        -webkit-transform: translate3d(0, 0, 0);
        transform: translate3d(0, 0, 0);
    }

    to {
        visibility: hidden;
        -webkit-transform: translate3d(0, -100vh, 0);
        transform: translate3d(0, -100vh, 0);
    }
}

.my_animate__slideOutUp {
    -webkit-animation-name: mySlideOutUp;
    animation-name: mySlideOutUp;
}

/*=====================*/

@keyframes myFadeIn {
    from {
        opacity: 0;
    }

    to {
        opacity: 0.9;
    }
}

.my_animate__fadeIn {
    -webkit-animation-name: myFadeIn;
    animation-name: myFadeIn;
}

/*=====================*/

.my_animate__fadeInAndSlideInUp {
    -webkit-animation-name: fadeIn, slideInUp;
    animation-name: fadeIn, slideInUp;
}

/*=====================*/

.long-duration {
    animation-duration: 2s;
}
