@keyframes vov-fade-in {
    from { opacity: 0
    }

    to {
        opacity: 1
    }
}

@keyframes vov-fade-in-up {
    from {
        opacity: 0;
        transform: translate3d(0, 150px, 0)
    }

    to {
        opacity: 1;
        transform: translate3d(0, 0, 0)
    }
}
@keyframes vov-fade-in-down {
    from {
        opacity: 0;
        transform: translate3d(0, -150px, 0)
    }

    to {
        opacity: 1;
        transform: translate3d(0, 0, 0)
    }
}
@keyframes vov-fade-in-right {
    from {
        opacity: 0;
        transform: translate3d(150px, 0, 0)
    }

    to {
        opacity: 1;
        transform: translate3d(0, 0, 0)
    }
}
@keyframes vov-fade-in-left {
    from {
        opacity: 0;
        transform: translate3d(-150px, 0, 0)
    }

    to {
        opacity: 1;
        transform: translate3d(0, 0, 0)
    }
}
@-webkit-keyframes vov-blur-in {
    from {
        -webkit-opacity: 0;
        -webkit-filter: blur(6px)
    }

    to {
        -webkit-opacity: 1;
        -webkit-filter: blur(0)
    }
}
.vov {
    --i: 1;
    --d: 3/10;
    --time-unit: 1.2s;
    -webkit-animation-delay: calc(var(--d) * var(--time-unit));
    -webkit-animation-duration: calc(var(--i) * var(--time-unit));
    -webkit-animation-fill-mode: both
}
[vovin] {
    opacity: 0
}
.vov-fade-in{
    -webkit-animation-name: vov-fade-in
}
.vov-fade-in-up {
    animation-name: vov-fade-in-up
}
.vov-fade-in-down {
    animation-name: vov-fade-in-down
}
.vov-fade-in-right {
    animation-name: vov-fade-in-right
}
.vov-fade-in-left {
    animation-name: vov-fade-in-left
}
.vov-blur-in {
    animation-name: vov-blur-in
}