/*
\\\\\Jak ustawiać/////
.slider {width} + .slider img {width}  -  ta sama wartość, nie większa niż szerokość zdjęcia;
.slider img {animation-duration}  -  czas trwania animacji;
.slider img {transition-timing-function: steps(6, jump-start)}  -  6 oznacza ilość slide'ów;
@keyframes - pierwszy i ostatni translate = 0, reszta podzielona równo na ilość slide'ów;
*/
.slider{
    margin: auto;
    width: 760px;
    overflow: hidden;
    display: flex;
    flex-wrap: nowrap;
}
.slider img{
    width: 100%;
    animation-name: sliding;
    animation-duration: 15000ms;
    animation-delay: 2s;
    transition-timing-function: steps(3, start);
    animation-iteration-count: infinite;
    animation-direction: normal;
}
@keyframes sliding {
    0% {
        transform: translate(0px);
    }
    3.33%, 33.33% {
        transform: translate(-100%);
    }
    36.66%, 66.66% {
        transform: translate(-200%);
    }
    69.99%, 99.99% {
        transform: translate(0px);
    }
  }
  @media (max-width: 1010px){
    .slider{
        margin: 0;
        width: 100%;
    }
    .slider img{
    height: 100%;
    }
  }