.rotator {
    position: relative;
    --einzeldauer: 7s;
}

.rotator>* {
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    opacity: 0;
    animation: Bildwechsler calc(var(--AnzahlBilder)*var(--einzeldauer)) linear infinite;
}

.rotator img {
    width: 100%;
    display: block;
}

.rotator>*:first-child {
    position: relative;
}

.rotator>*:nth-child(2){
    animation-delay: calc(1*var(--einzeldauer)); 
}

.rotator>*:nth-child(3){
    animation-delay: calc(2*var(--einzeldauer)); 
}

.rotator>*:nth-child(4){
    animation-delay: calc(3*var(--einzeldauer)); 
}

.rotator>*:nth-child(5){
    animation-delay: calc(4*var(--einzeldauer)); 
}

.rotator>*:nth-child(6){
    animation-delay: calc(5*var(--einzeldauer)); 
}

.rotator>*:nth-child(7){
    animation-delay: calc(6*var(--einzeldauer)); 
}

.rotator>*:nth-child(8){
    animation-delay: calc(7*var(--einzeldauer)); 
}

.rotator>*:nth-child(9){
    animation-delay: calc(8*var(--einzeldauer)); 
}

.rotator>*:nth-child(10){
    animation-delay: calc(9*var(--einzeldauer)); 
}

@keyframes Bildwechsler {
    0% {    
        opacity: 0;
        z-index: 23;   
    }
    3% {
        opacity: 1;
    }
    100% {
        opacity: 1;
        z-index: 1;
    }  
}