/* prefixed by https://autoprefixer.github.io (PostCSS: v7.0.26, autoprefixer: v9.7.3) */

.slideshow {
    list-style: none;
    z-index: 1;
}



.slideshow li span {
    width: 100%;
    height: 100vh;
    position: absolute;
    top: 70px;
    left: 0px;
    color: transparent;
    background-size: cover;
    background-position: 50% 50%;
    background-repeat: none;
    opacity: 0;
    z-index: 0;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-animation: imageAnimation 24s linear infinite 0s;
    animation: imageAnimation 24s linear infinite 0s;
}

/* IE11 */
_:-ms-lang(x)::-ms-backdrop,
.slideshow li span {
    width: 100%;
    height: 100vh;
    top: 175px;
    left: 0px;
    background-size: cover;
    background-position: ;
    background-repeat: none;
}

@media only screen and (max-width: 1000px) {
    .slideshow li span {

        height: 60vw;
    }

    /* IE11 */
    _:-ms-lang(x)::-ms-backdrop,
    .slideshow li span {
        width: 100%;
        height: 100vh;
        top: 200px;
        left: 0px;
        background-size: cover;
        background-position: ;
        background-repeat: none;
    }
}


@media only screen and (max-width: 720px) {
    .slideshow li span {
        height: 400px;
        top: 71px;
    }
}


.slideshow li:nth-child(1) span {
    background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.4)), to(rgba(0, 0, 0, 0.6))), url(/en/images/banners/ishiguro-yakkyoku.jpg);
    background-image: -o-linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.6)), url(/en/images/banners/ishiguro-yakkyoku.jpg);
    background-image: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.6)), url(/en/images/banners/ishiguro-yakkyoku.jpg);
}

.slideshow li:nth-child(2) span {
    background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.4)), to(rgba(0, 0, 0, 0.6))), url(/en/images/banners/soil-banner.jpg);
    background-image: -o-linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.6)), url(/en/images/banners/soil-banner.jpg);
    background-image: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.6)), url(/en/images/banners/soil-banner.jpg);
    -webkit-animation-delay: 6s;
    animation-delay: 6s;
}

.slideshow li:nth-child(3) span {
    background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.4)), to(rgba(0, 0, 0, 0.6))), url(/en/images/banners/tomato-field.jpg);
    background-image: -o-linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.6)), url(/en/images/banners/tomato-field.jpg);
    background-image: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.6)), url(/en/images/banners/tomato-field.jpg);
    -webkit-animation-delay: 12s;
    animation-delay: 12s;
}

.slideshow li:nth-child(4) span {
    background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.4)), to(rgba(0, 0, 0, 0.6))), url(/en/images/banners/agri-worker.jpg);
    background-image: -o-linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.6)), url(/en/images/banners/agri-worker.jpg);
    background-image: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.6)), url(/en/images/banners/agri-worker.jpg);
    -webkit-animation-delay: 18s;
    animation-delay: 18s;
}

.slideshow li:nth-child(5) span {
    background-image: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0.4)), to(rgba(0, 0, 0, 0.6))), url(/en/images/banners/flower-field.jpg);
    background-image: -o-linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.6)), url(/en/images/banners/flower-field.jpg);
    background-image: linear-gradient(rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.6)), url(/en/images/banners/flower-field.jpg);
    -webkit-animation-delay: 18s;
    animation-delay: 18s;
}

@-webkit-keyframes imageAnimation {
    0% {
        opacity: 0;
        -webkit-animation-timing-function: ease-in;
    }

    12.5% {
        opacity: 1;
        -webkit-animation-timing-function: ease-out;
    }

    25% {
        opacity: 1;
    }

    37.5% {
        opacity: 0;
    }

    100% {
        opacity: 0;
    }
}

@keyframes imageAnimation {
    0% {
        opacity: 0;
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
    }

    12.5% {
        opacity: 1;
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
    }

    25% {
        opacity: 1;
    }

    37.5% {
        opacity: 0;
    }

    100% {
        opacity: 0;
    }
}

@-webkit-keyframes titleAnimation {
    0% {
        opacity: 0;
    }

    12.5% {
        opacity: 1;
    }

    25% {
        opacity: 1;
    }

    37.5% {
        opacity: 0;
    }

    100% {
        opacity: 0;
    }
}

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

    12.5% {
        opacity: 1;
    }

    25% {
        opacity: 1;
    }

    37.5% {
        opacity: 0;
    }

    100% {
        opacity: 0;
    }
}

.no-cssanimations .slideshow li span {
    opacity: 1;
}