@import '../c/conf';

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

    100% {
        opacity: 1;
    }
}

@keyframes fade_in_up {
    0% {
        transform: translate3d(0, 360rpx, 0);
        opacity: 0.3;
    }

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

@keyframes fade_in_down {
    0% {
        transform: translate3d(0, -360rpx), 0;
        opacity: 0.3;
    }

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

@keyframes fade_in_right {
    0% {
        transform: translate3d(360rpx, 0, 0);
        opacity: 0.3;
    }

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

@keyframes fade_in_left {
    0% {
        transform: translate3d(-360rpx, 0, 0);
        opacity: 0.3;
    }

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

.a-fade-in {
    animation: fade_in $ad2 ease-in;
}

.a-fade-in-up {
    animation: fade_in_up $ad2 ease-in;
}

.a-fade-in-right {
    animation: fade_in_right $ad2 ease-in;
}

.a-fade-in-left {
    animation: fade_in_left $ad2 ease-in;
}

.a-fade-in-down {
    animation: fade_in_down $ad2 ease-in;
}