<div class="js-ag-carousel">
  <div class="ag-carousel_item">
    <picture>
      <source srcset="https://raw.githack.com/SochavaAG/example-mycode/master/pens/1_images/avatar-circle-1.png">
      <img src="https://raw.githack.com/SochavaAG/example-mycode/master/pens/1_images/avatar-circle-1.png" alt="Avatar" />
    </picture>
  </div>

  <div class="ag-carousel_item">
    <picture>
      <source srcset="https://raw.githack.com/SochavaAG/example-mycode/master/pens/1_images/avatar-circle-2.png">
      <img src="https://raw.githack.com/SochavaAG/example-mycode/master/pens/1_images/avatar-circle-2.png" alt="Avatar" />
    </picture>
  </div>

  <div class="ag-carousel_item">
    <picture>
      <source srcset="https://raw.githack.com/SochavaAG/example-mycode/master/pens/1_images/avatar-circle-3.png">
      <img src="https://raw.githack.com/SochavaAG/example-mycode/master/pens/1_images/avatar-circle-3.png" alt="Avatar" />
    </picture>
  </div>

  <div class="ag-carousel_item">
    <picture>
      <source srcset="https://raw.githack.com/SochavaAG/example-mycode/master/pens/1_images/avatar-circle-4.png">
      <img src="https://raw.githack.com/SochavaAG/example-mycode/master/pens/1_images/avatar-circle-4.png" alt="Avatar" />
    </picture>
  </div>

  <div class="ag-carousel_item">
    <picture>
      <source srcset="https://raw.githack.com/SochavaAG/example-mycode/master/pens/1_images/avatar-circle-5.png">
      <img src="https://raw.githack.com/SochavaAG/example-mycode/master/pens/1_images/avatar-circle-5.png" alt="Avatar" />
    </picture>
  </div>

  <div class="ag-carousel_item">
    <picture>
      <source srcset="https://raw.githack.com/SochavaAG/example-mycode/master/pens/1_images/avatar-circle-6.png">
      <img src="https://raw.githack.com/SochavaAG/example-mycode/master/pens/1_images/avatar-circle-6.png" alt="Avatar" />
    </picture>
  </div>

  <div class="ag-carousel_item">
    <picture>
      <source srcset="https://raw.githack.com/SochavaAG/example-mycode/master/pens/1_images/avatar-circle-7.png">
      <img src="https://raw.githack.com/SochavaAG/example-mycode/master/pens/1_images/avatar-circle-7.png" alt="Avatar" />
    </picture>
  </div>

  <div class="ag-carousel_item">
    <picture>
      <source srcset="https://raw.githack.com/SochavaAG/example-mycode/master/pens/1_images/avatar-circle-8.png">
      <img src="https://raw.githack.com/SochavaAG/example-mycode/master/pens/1_images/avatar-circle-8.png" alt="Avatar" />
    </picture>
  </div>

  <div class="ag-carousel_item">
    <picture>
      <source srcset="https://raw.githack.com/SochavaAG/example-mycode/master/pens/1_images/avatar-circle-9.png">
      <img src="https://raw.githack.com/SochavaAG/example-mycode/master/pens/1_images/avatar-circle-9.png" alt="Avatar" />
    </picture>
  </div>

  <div class="ag-carousel_item">
    <picture>
      <source srcset="https://raw.githack.com/SochavaAG/example-mycode/master/pens/1_images/avatar-circle-10.png">
      <img src="https://raw.githack.com/SochavaAG/example-mycode/master/pens/1_images/avatar-circle-10.png" alt="Avatar" />
    </picture>
  </div>

  <div class="ag-carousel_item">
    <picture>
      <source srcset="https://raw.githack.com/SochavaAG/example-mycode/master/pens/1_images/avatar-circle-11.png">
      <img src="https://raw.githack.com/SochavaAG/example-mycode/master/pens/1_images/avatar-circle-11.png" alt="Avatar" />
    </picture>
  </div>

  <div class="ag-carousel_item">
    <picture>
      <source srcset="https://raw.githack.com/SochavaAG/example-mycode/master/pens/1_images/avatar-circle-12.png">
      <img src="https://raw.githack.com/SochavaAG/example-mycode/master/pens/1_images/avatar-circle-12.png" alt="Avatar" />
    </picture>
  </div>

  <div class="ag-carousel_item">
    <picture>
      <source srcset="https://raw.githack.com/SochavaAG/example-mycode/master/pens/1_images/avatar-circle-13.png">
      <img src="https://raw.githack.com/SochavaAG/example-mycode/master/pens/1_images/avatar-circle-13.png" alt="Avatar" />
    </picture>
  </div>

  <div class="ag-carousel_item">
    <picture>
      <source srcset="https://raw.githack.com/SochavaAG/example-mycode/master/pens/1_images/avatar-circle-14.png">
      <img src="https://raw.githack.com/SochavaAG/example-mycode/master/pens/1_images/avatar-circle-14.png" alt="Avatar" />
    </picture>
  </div>

  <div class="ag-carousel_item">
    <picture>
      <source srcset="https://raw.githack.com/SochavaAG/example-mycode/master/pens/1_images/avatar-circle-15.png">
      <img src="https://raw.githack.com/SochavaAG/example-mycode/master/pens/1_images/avatar-circle-15.png" alt="Avatar" />
    </picture>
  </div>
</div>

.js-ag-carousel {
  padding: 50px 0;
}

(function ($) {
  $(function () {


    $('.js-ag-carousel').slick({
      dots: false,
      arrows: false,
      infinite: true,
      slidesToShow: 5,
      slidesToScroll: 1,
      autoplay: true,
      autoplaySpeed: 0,
      speed: 8000,
      cssEase: 'linear',
      responsive: [
        {
          breakpoint: 1320,
          settings: {
            slidesToShow: 4,
            speed: 12000,
            slidesToScroll: 4
          }
        },
        {
          breakpoint: 1080,
          settings: {
            slidesToShow: 3,
            slidesToScroll: 3
          }
        },
        {
          breakpoint: 680,
          settings: {
            slidesToShow: 2,
            slidesToScroll: 2
          }
        },
        {
          breakpoint: 480,
          settings: {
            slidesToShow: 1,
            slidesToScroll: 1
        }
      }]
    });


  });
})(jQuery);