<div class="events-carousel np-carousel np-carousel-bg-blue" id="events-carousel">
    {% if items.any? %}
        {% for training_event in items %}
            <div class="np-carousel-card"> {% include "cards_featured_training_event" with training_event %}</div>
        {% endfor %}
    {% endif %}
</div>

<script>
$(document).ready(function(){

    $(".events-carousel").slick({
        slidesToShow: 1,
        prevArrow: '<i class="fal fa-chevron-left"></i>',
        nextArrow: '<i class="fal fa-chevron-right"></i>',
        infinite: true,
        dots: false,
        arrows: true
    });
});
	
</script>