/* 
    Handcoded by JAC - Johnny Alimoot C.
*/
:root {
    --slideImage1: url('../art/hero1.avif');
    --slideImage2: url('../art/hero2.avif');
    --slideImage3: url('../art/hero3.avif');
}


@keyframes hero-slideshow {
    0% {
        background-size: 100%;
    }

    0%,
    15% {
        background-image: var(--slideImage1)
    }

    18%,
    48% {
        background-image: var(--slideImage2)
    }

    50% {
        background-size: 120%;
    }

    51%,
    82% {
        background-image: var(--slideImage3)
    }

    85%,
    100% {
        background-image: var(--slideImage1)
    }

    100% {
        background-size: 140%;
    }
}


@keyframes fade {
    0% {
        opacity: 1;
    }

    50% {
        opacity: 1;
    }

    100% {
        opacity: 0;
    }
}



@media only screen and (max-width: 992px) {
    @keyframes hero-slideshow {

        0%,
        15% {
            background-image: var(--slideImage1)
        }

        18%,
        48% {
            background-image: var(--slideImage2)
        }

        51%,
        82% {
            background-image: var(--slideImage3)
        }

        85%,
        100% {
            background-image: var(--slideImage1)
        }
    }

}