[data-anim-slide] {
    opacity: 0;
    animation-duration: 1s;
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.275);
    animation-iteration-count: 1;
}

[data-anim-slide].is-view {
    animation-name: anim-slide;
    animation-fill-mode: forwards;
}

[data-anim-slide="bottomIn"].is-view {
    animation-name: anim-slide-bottomIn;
}

[data-anim-slide="leftIn"].is-view {
    animation-name: anim-slide-leftIn;
}

[data-anim-slide="rightIn"].is-view {
    animation-name: anim-slide-rightIn;
}

[data-anim-slide="delay-leftIn-child"] .delay {
    opacity: 0;
    animation-fill-mode: forwards;
}

[data-anim-slide="delay-leftIn-child"].is-view .delay {
    animation-duration: 1s;
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1.275);
    animation-iteration-count: 1;
}

[data-anim-slide="delay-leftIn-child"].is-view .delay:nth-child(1) {
    animation-name: anim-slide-leftIn;
}

[data-anim-slide="delay-leftIn-child"].is-view .delay:nth-child(2) {
    animation-name: anim-slide-leftIn;
    animation-delay: .2s;
}

[data-anim-slide="delay-leftIn-child"].is-view .delay:nth-child(3) {
    animation-name: anim-slide-leftIn;
    animation-delay: .4s;
}

[data-anim-slide="delay-leftIn-child"].is-view .delay:nth-child(4) {
    animation-name: anim-slide-leftIn;
    animation-delay: .6s;
}

[data-anim-slide="delay-leftIn-child"].is-view .delay:nth-child(5) {
    animation-name: anim-slide-leftIn;
    animation-delay: .8s;
}

@keyframes anim-slide {
    0% {
        opacity: 0;
        transform: translate3d(0)
    }

    100% {
        opacity: 1;
        transform: translateZ(0)
    }
}

@keyframes anim-slide-bottomIn {
    0% {
        opacity: 0;
        transform: translate3d(0, 50px, 0)
    }

    100% {
        opacity: 1;
        transform: translateZ(0)
    }
}

@keyframes anim-slide-leftIn {
    0% {
        opacity: 0;
        transform: translate3d(-50px, 0, 0)
    }

    100% {
        opacity: 1;
        transform: translateZ(0)
    }
}

@keyframes anim-slide-rightIn {
    0% {
        opacity: 0;
        transform: translate3d(50px, 0, 0)
    }

    100% {
        opacity: 1;
        transform: translateZ(0)
    }
}