.slide-from-right {
    -webkit-animation: 1.5s ease-out 0s 1 slideInFromRight; /* Chrome, Opera 15+, Safari 5+ */
            animation: 1.5s ease-out 0s 1 slideInFromRight; /* Chrome, Firefox 16+, IE 10+, Opera */
}


.slide-from-left {
    -webkit-animation: 1.5s ease-out 0s 1 slideInFromLeft;
            animation: 1.5s ease-out 0s 1 slideInFromLeft;
}

@-webkit-keyframes slideInFromRight {
    0% {
        transform: translateX(100%);
    }

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

@keyframes slideInFromRight {
    0% {
        transform: translateX(100%);
    }

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

@-webkit-keyframes slideInFromLeft {
    0% {
        transform: translateX(-100%);
    }

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

@keyframes slideInFromLeft {
    0% {
        transform: translateX(-100%);
    }

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