/* Immagine di fondo delle slide della pagina iniziale.
   Lo strato sta sotto al testo e non tocca la griglia del plugin: il
   contenitore della slide e' gia' position:relative e overflow:hidden. */

.content-slider .dmr-hero-img,
.content-slider .dmr-hero-velo {
    position: absolute;
    inset: 0;
    z-index: 0;
    pointer-events: none;
}

.content-slider .dmr-hero-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    display: block;
}

/* Velo scuro: solo i gradini previsti dal pannello, nessun valore libero. */
.content-slider .dmr-hero-velo { background: #000; }
.content-slider .dmr-hero-velo[data-velo="10"] { opacity: .10; }
.content-slider .dmr-hero-velo[data-velo="20"] { opacity: .20; }
.content-slider .dmr-hero-velo[data-velo="30"] { opacity: .30; }
.content-slider .dmr-hero-velo[data-velo="40"] { opacity: .40; }
.content-slider .dmr-hero-velo[data-velo="50"] { opacity: .50; }
.content-slider .dmr-hero-velo[data-velo="60"] { opacity: .60; }
.content-slider .dmr-hero-velo[data-velo="70"] { opacity: .70; }
.content-slider .dmr-hero-velo[data-velo="80"] { opacity: .80; }

/* Il testo resta sopra all'immagine. */
.content-slider .slide-grid-container { position: relative; z-index: 1; }

/* Il secondo pulsante e' un collegamento vero quando porta fuori dal sito:
   deve avere lo stesso aspetto del primo. */
.content-slider a.slide-button {
    display: inline-block;
    text-decoration: none;
}
.content-slider button.slide-button[disabled] { cursor: default; opacity: .7; }

/* Chi ha chiesto meno movimento non vede le animazioni di transizione. */
@media (prefers-reduced-motion: reduce) {
    .content-slider .slide-container,
    .content-slider .slide-animated-element,
    .content-slider .slide-animated-content {
        animation: none !important;
        transition: none !important;
    }
}