.ani {
    animation-fill-mode: both;
    -webkit-animation-fill-mode: both;
    animation-duration: 0.6s;
    -webkit-animation-duration: 0.6s;
    animation-timing-function: cubic-bezier(0.18, 0.89, 0.32, 1.28);
    -webkit-animation-timing-function: cubic-bezier(0.18, 0.89, 0.32, 1.28);
}

@keyframes kf_fade {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@-webkit-keyframes kf_fade {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

.fade {
    opacity: 0;
}

.fade.animated {
    animation-name: kf_fade;
    -webkit-animation-name: kf_fade;
}

@keyframes kf_fade_in_left {
    0% {
        opacity: 0;
        transform: translate3d(-50px, 0, 0);
        -webkit-transform: translate3d(-50px, 0, 0);
        -moz-transform: translate3d(-50px, 0, 0);
        -ms-transform: translate3d(-50px, 0, 0);
        -o-transform: translate3d(-50px, 0, 0);
    }

    100% {
        opacity: 1;
        transform: translate3d(0, 0, 0);
        -webkit-transform: translate3d(0, 0, 0);
        -moz-transform: translate3d(0, 0, 0);
        -ms-transform: translate3d(0, 0, 0);
        -o-transform: translate3d(0, 0, 0);
    }
}

@-webkit-keyframes kf_fade_in_left {
    0% {
        opacity: 0;
        transform: translate3d(-50px, 0, 0);
        -webkit-transform: translate3d(-50px, 0, 0);
        -moz-transform: translate3d(-50px, 0, 0);
        -ms-transform: translate3d(-50px, 0, 0);
        -o-transform: translate3d(-50px, 0, 0);
    }

    100% {
        opacity: 1;
        transform: translate3d(0, 0, 0);
        -webkit-transform: translate3d(0, 0, 0);
        -moz-transform: translate3d(0, 0, 0);
        -ms-transform: translate3d(0, 0, 0);
        -o-transform: translate3d(0, 0, 0);
    }
}

.fade_in_left {
    opacity: 0;
}

.fade_in_left.animated {
    animation-name: kf_fade_in_left;
    -webkit-animation-name: kf_fade_in_left;
}

@keyframes kf_fade_in_right {
    0% {
        opacity: 0;
        transform: translate3d(50px, 0, 0);
        -webkit-transform: translate3d(50px, 0, 0);
        -moz-transform: translate3d(50px, 0, 0);
        -ms-transform: translate3d(50px, 0, 0);
        -o-transform: translate3d(50px, 0, 0);
    }

    100% {
        opacity: 1;
        transform: translate3d(0, 0, 0);
        -webkit-transform: translate3d(0, 0, 0);
        -moz-transform: translate3d(0, 0, 0);
        -ms-transform: translate3d(0, 0, 0);
        -o-transform: translate3d(0, 0, 0);
    }
}

@-webkit-keyframes kf_fade_in_right {
    0% {
        opacity: 0;
        transform: translate3d(50px, 0, 0);
        -webkit-transform: translate3d(50px, 0, 0);
        -moz-transform: translate3d(50px, 0, 0);
        -ms-transform: translate3d(50px, 0, 0);
        -o-transform: translate3d(50px, 0, 0);
    }

    100% {
        opacity: 1;
        transform: translate3d(0, 0, 0);
        -webkit-transform: translate3d(0, 0, 0);
        -moz-transform: translate3d(0, 0, 0);
        -ms-transform: translate3d(0, 0, 0);
        -o-transform: translate3d(0, 0, 0);
    }
}

.fade_in_right {
    opacity: 0;
}

.fade_in_right.animated {
    animation-name: kf_fade_in_right;
    -webkit-animation-name: kf_fade_in_right;
}

@keyframes kf_fade_in_bottom {
    0% {
        opacity: 0;
        transform: translate3d(0, 50px, 0);
        -webkit-transform: translate3d(0, 50px, 0);
        -moz-transform: translate3d(0, 50px, 0);
        -ms-transform: translate3d(0, 50px, 0);
        -o-transform: translate3d(0, 50px, 0);
    }

    100% {
        opacity: 1;
        transform: translate3d(0, 0, 0);
        -webkit-transform: translate3d(0, 0, 0);
        -moz-transform: translate3d(0, 0, 0);
        -ms-transform: translate3d(0, 0, 0);
        -o-transform: translate3d(0, 0, 0);
    }
}

@-webkit-keyframes kf_fade_in_bottom {
    0% {
        opacity: 0;
        transform: translate3d(0, 50px, 0);
        -webkit-transform: translate3d(0, 50px, 0);
        -moz-transform: translate3d(0, 50px, 0);
        -ms-transform: translate3d(0, 50px, 0);
        -o-transform: translate3d(0, 50px, 0);
    }

    100% {
        opacity: 1;
        transform: translate3d(0, 0, 0);
        -webkit-transform: translate3d(0, 0, 0);
        -moz-transform: translate3d(0, 0, 0);
        -ms-transform: translate3d(0, 0, 0);
        -o-transform: translate3d(0, 0, 0);
    }
}

.fade_in,
.fade_in_bottom {
    opacity: 0;
}

.fade_in.animated,
.fade_in_bottom.animated {
    animation-name: kf_fade_in_bottom;
    -webkit-animation-name: kf_fade_in_bottom;
}

@keyframes kf_fade_in_top {
    0% {
        opacity: 0;
        transform: translate3d(0, -50px, 0);
        -webkit-transform: translate3d(0, -50px, 0);
        -moz-transform: translate3d(0, -50px, 0);
        -ms-transform: translate3d(0, -50px, 0);
        -o-transform: translate3d(0, -50px, 0);
    }

    100% {
        opacity: 1;
        transform: translate3d(0, 0, 0);
        -webkit-transform: translate3d(0, 0, 0);
        -moz-transform: translate3d(0, 0, 0);
        -ms-transform: translate3d(0, 0, 0);
        -o-transform: translate3d(0, 0, 0);
    }
}

@-webkit-keyframes kf_fade_in_top {
    0% {
        opacity: 0;
        transform: translate3d(0, -50px, 0);
        -webkit-transform: translate3d(0, -50px, 0);
        -moz-transform: translate3d(0, -50px, 0);
        -ms-transform: translate3d(0, -50px, 0);
        -o-transform: translate3d(0, -50px, 0);
    }

    100% {
        opacity: 1;
        transform: translate3d(0, 0, 0);
        -webkit-transform: translate3d(0, 0, 0);
        -moz-transform: translate3d(0, 0, 0);
        -ms-transform: translate3d(0, 0, 0);
        -o-transform: translate3d(0, 0, 0);
    }
}

.fade_in_top {
    opacity: 0;
}

.fade_in_top.animated {
    animation-name: kf_fade_in_top;
    -webkit-animation-name: kf_fade_in_top;
}