.indexSlideShow17 {
    
}

.indexSlideShow17 * {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

:root {
    --marquee-width: 100%;
    --marquee-height: 200px;
    /* --marquee-elements: 12; */ /* defined with JavaScript */
    --marquee-elements-displayed: 5;
    --marquee-element-width: calc(var(--marquee-width) / var(--marquee-elements-displayed));
    --marquee-animation-duration: calc(var(--marquee-elements) * 9s);
}

.indexSlideShow17 .elementContainer {
    width: var(--marquee-width);
    height: var(--marquee-height);
    overflow: hidden;
    position: relative;
}

.indexSlideShow17 .marquee-content {
    list-style: none;
    height: 100%;
    display: flex;
    animation: mqppscrolling var(--marquee-animation-duration) linear infinite;
}

    .indexSlideShow17 .marquee-content:hover {
        animation-play-state: paused;
    }

@keyframes mqppscrolling {
    0% {
        transform: translateX(0);
    }

    100% {
        transform: translateX(calc(-1 * var(--marquee-element-width) * var(--marquee-elements)));
    }
}

.indexSlideShow17 .marquee-content li {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-shrink: 0;
    width: var(--marquee-element-width);
    max-height: 100%;
    white-space: nowrap;
    position:relative;
}

    .indexSlideShow17 .marquee-content li a {
        display: block;
        width: 100%;
        height: 100%;
    }

    .indexSlideShow17 .marquee-content li img {
        width: 100%;
        height: 100%;
    }

.indexSlideShow17 .marquee-content li .caption
{
    position : absolute;
    left : 5%;
    bottom : 4%;
    color:#FFFFFF;
    text-shadow:1px 1px 1px #000000;
}

@media (max-width: 480px) {
    :root {
        --marquee-elements-displayed: 1;
    }
}

@media (min-width: 481px) and (max-width: 767px) {
    :root {
        --marquee-elements-displayed: 2;
    }
}

@media (min-width: 768px) and (max-width: 979px) {
    :root {
        --marquee-elements-displayed: 3;
    }
}

@media (min-width: 980px) and (max-width:1199px) {
    :root {
        --marquee-elements-displayed: 4;
    }
}

@media (min-width: 1200px) and (max-width:1919px) {
    :root {
        --marquee-elements-displayed: 4;
    }
}

@media (min-width: 1920px) {
}