@keyframes fadeInLeft {
0% {
    opacity: 0;
    -webkit-transform: translateX(-60px);
    -ms-transform: translateX(-60px);
    transform: translateX(-60px);
}

100% {
    opacity: 1;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
}
}

.fadeInLeft {
-webkit-animation-name: fadeInLeft;
animation-name: fadeInLeft;
}
@keyframes fadeInRight {
0% {
    opacity: 0;
    -webkit-transform: translateX(60px);
    -ms-transform: translateX(60px);
    transform: translateX(60px);
}

100% {
    opacity: 1;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
}
}

.fadeInRight {
-webkit-animation-name: fadeInRight;
animation-name: fadeInRight;
}
@keyframes fadeInDown {
0% {
    opacity: 0;
    -webkit-transform: translateY(-40px);
    -ms-transform: translateY(-40px);
    transform: translateY(-40px);
}

100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
}
}

.fadeInDown {
-webkit-animation-name: fadeInDown;
animation-name: fadeInDown;
}

@keyframes fadeInUp {
0% {
    opacity: 0;
    -webkit-transform: translateY(40px);
    -ms-transform: translateY(40px);
    transform: translateY(40px);
}

100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
}
}

.fadeInUp {
    -webkit-animation-name: fadeInDown;
    animation-name: fadeInUp;
}

.animated {
    -webkit-animation-duration: 0.5s;
    animation-duration: 0.5s;
    -webkit-animation-fill-mode: both;
    animation-fill-mode: both;
}