.slider {
    position: relative;
    width: 100%;
    height: 0;
    padding-bottom: 43.75%; 
    overflow: hidden;

}
@media screen and (max-width: 768px) {
    .slider {
        padding-bottom: 100%; 
    }
}
@media screen and (min-width: 1280px) {
    .slider {
        padding-bottom: 29.17%; 
    }
}


.slider__item {
    position: absolute;
    inset: 0;
    opacity: 0;
    z-index: 0;
    animation: slideShow 9s linear infinite 0s;
}

.slider__img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.slider__item:nth-child(2) {
    animation-delay: 3s;
}

.slider__item:nth-child(3) {
    animation-delay: 6s;
}

@keyframes slideShow {
    0% {
        opacity: 0;
        animation-timing-function: ease-in;
    }
    8% {
        opacity: 1;
        animation-timing-function: ease-out;
    }
    33% {
        opacity: 1;
    }
    50%,
    100% {
        opacity: 0;
    }
}