<div class="np-homepage-featured np-homepage-featured-items np-max-width">
    <div class="np-homepage-featured-text">
      <div class="np-homepage-headline">
        Featured Photography From Our Users
      </div>
    </div>

    <div class="featured-photography-carousel np-carousel np-carousel-bg-blue" id="featured-photography-carousel">
        <div class="np-carousel-card">
            <div>
                <img src="https://s3.amazonaws.com/static.northpass.com/getpixel-dark-mode/pixel-featured-photography-1.jpg" alt="Featured Photography" />
            <div class="slide-label">Sam Rigsby</div>
        </div>
       
        </div>
        <div class="np-carousel-card">
        <div>
             <img src="https://s3.amazonaws.com/static.northpass.com/getpixel-dark-mode/pixel-featured-photography-2.jpg" alt="Featured Photography" />
            <div class="slide-label">Jenny Nguyen</div>
        </div>
       
        </div>
        <div class="np-carousel-card">
            <div>
                <img src="https://s3.amazonaws.com/static.northpass.com/getpixel-dark-mode/pixel-featured-photography-3.jpg" alt="Featured Photography" />
                <div class="slide-label">Miriam Jenkins</div>
            </div>       
        </div>
        <div class="np-carousel-card">
        <div>
                <img src="https://s3.amazonaws.com/static.northpass.com/getpixel-dark-mode/pixel-featured-photography-4.jpg" alt="Featured Photography" />
            <div class="slide-label">Aron Sanchez</div>
        </div>
    
        </div>
        <div class="np-carousel-card">
        <div>
             <img src="https://s3.amazonaws.com/static.northpass.com/getpixel-dark-mode/pixel-featured-photography-5.jpg" alt="Featured Photography" />
            <div class="slide-label">Kelly Beeker</div>
        </div>
       
        </div>
    </div>
</div>

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

        $("#featured-photography-carousel").slick({
            slidesToShow: 3.8,
            prevArrow: '<i class="fal fa-chevron-left"></i>',
            nextArrow: '<i class="fal fa-chevron-right"></i>',
            infinite: false,
            responsive: [
                 {
                    breakpoint: 1350,
                    settings: {
                        slidesToShow: 2.6,
                    }
                },
                {
                    breakpoint: 1024,
                    settings: {
                        slidesToShow: 2,
                    }
                },
                {
                    breakpoint: 768,
                    settings: {
                        slidesToShow: 1,
                    }
                }
            ]
        });
    });
	
</script>