.cs-overlay {
    position: absolute;
    z-index: 10;
    pointer-events: none;
}

.cs-overlay.fullsize {
    width: 100%;
}

.cs-overlay.realsize {
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    box-sizing: border-box;
}


/* Comportement par défaut */
.desktop-only {
    display: block;
}
.mobile-only {
    display: none;
}

/* Sur écran <= 768px */
@media screen and (max-width: 768px) {
    /* Si on utilise la version mobile */
    .cs-overlay:not(.no-mobile) .desktop-only {
        display: none;
    }
    .cs-overlay:not(.no-mobile) .mobile-only {
        display: block;
    }

    /* Si on n'utilise PAS la version mobile */
    .cs-overlay.no-mobile .desktop-only {
        display: block;
    }
    .cs-overlay.no-mobile .mobile-only {
        display: none;
    }
}

.cs-overlay.top-left img { top: 5px; left: 5px; }
.cs-overlay.top-right img { top: 5px; right: 5px; }
.cs-overlay.bottom-left img { bottom: 5px; left: 5px; }
.cs-overlay.bottom-right img { bottom: 5px; right: 5px; }

.cs-overlay.fullsize img { 
    width: 100%; 
    height: auto; 
    top:0!important; 
    left: 0!important; 
    right: 0!important; 
    bottom: 0!important;
    padding: 0!important;
    border-radius: 0!important; 
}

.cs-overlay.fullsize.top-left { top: 0; left: 0; }
.cs-overlay.fullsize.top-right { top: 0; right: 0; }
.cs-overlay.fullsize.bottom-left { bottom: 0; left: 0; }
.cs-overlay.fullsize.bottom-right { bottom: 0; right: 0; }

.cs-overlay.realsize img { width: 30%; height: auto; position: absolute; padding: 0!important; }



