﻿.crossfade > figure {
    animation: imageAnimation 30s linear infinite 0s;
    backface-visibility: hidden;
    background-size: cover;
    background-position: center center;
    color: transparent;
    height: 100%;
    left: 0px;
    opacity: 0;
    position: absolute;
    top: 0px;
    width: 100%;
    z-index: 0;
}

    .crossfade > figure:nth-child(1) {
        background-image: url('../../assets/images/bg/ved-ecom-1.jpg');
    }

    .crossfade > figure:nth-child(2) {
        animation-delay: 6s;
        background-image: url('../../assets/images/bg/ved-ecom-2.jpg');
    }

    .crossfade > figure:nth-child(3) {
        animation-delay: 12s;
        background-image: url('../../assets/images/bg/ved-ecom-3.jpg');
    }

    .crossfade > figure:nth-child(4) {
        animation-delay: 18s;
        background-image: url('../../assets/images/bg/ved-ecom-4.jpg');
    }



@keyframes imageAnimation {
    0% {
        animation-timing-function: ease-in;
        opacity: 0;
    }

    8% {
        animation-timing-function: ease-out;
        opacity: 1;
    }

    17% {
        opacity: 1;
    }

    25% {
        opacity: 0;
    }

    100% {
        opacity: 0;
    }
}

.vedika-ecom-overlay {
    position: absolute;
    background-image: url('../../assets/images/bg/vedika-ecom-bg-2.png');
    background-position: center;
    background-size: cover;
    width: 100%;
    height: 70vh;
    top: 0px;
}
