{% assign used_instructor_names = "" %}

<div class="instructors-carousel np-carousel" id="instructors-carousel">    
    <div class="np-carousel-card">
        <div class="instructor-slide">
            <div class="instructor-image" style='height:160px; width: 160px;'>
                <img style='height: 136px; width: 136px;' src="https://s3.amazonaws.com/static.northpass.com/NorthpassAcademy/headshot_1.jpg" />
            </div>
            <div class="instructor-info">
                <div class="instructor-name">Paula Naba</div>
                <a href="mailto:paula@northpass.com" target="_blank" class="instructor-email" style='color: #089FB7;'>paula@northpass.com</a>
                <div class="instructor-joined">Director of Customer Success</div>
            </div>
        </div>
    </div>
    <div class="np-carousel-card">
        <div class="instructor-slide">
            <div class="instructor-image" style='height:160px; width: 160px;'>
                <img style='height: 136px; width: 136px;' src="https://s3.amazonaws.com/static.northpass.com/NorthpassAcademy/charlie+1.png" />
            </div>
            <div class="instructor-info">
                <div class="instructor-name">Charlie Bencivenga</div>
                <a href="mailto:cbencivenga@northpass.com" target="_blank" class="instructor-email" style='color: #089FB7;'>cbencivenga@northpass.com</a>
                <div class="instructor-joined">Solutions Engineering Manager</div>
            </div>
        </div>
    </div>
    {% comment %}<div class="np-carousel-card">
        <div class="instructor-slide">
            <div class="instructor-image" style='height:160px; width: 160px;'>
                <img style='height: 136px; width: 136px;' src="https://s3.amazonaws.com/static.northpass.com/NorthpassAcademy/headshot_4.jpg" />
            </div>
            <div class="instructor-info">
                <div class="instructor-name">Rob Abrams</div>
                <a href="mailto:rabrams@northpass.com" target="_blank" class="instructor-email" style='color: #089FB7;'>rabrams@northpass.com</a>
                <div class="instructor-joined">Senior Implementation Manager</div>
            </div>
        </div>
    </div>{% endcomment %}
    <div class="np-carousel-card">
        <div class="instructor-slide">
            <div class="instructor-image" style='height:160px; width: 160px;'>
                <img style='height: 136px; width: 136px;' src="https://s3.amazonaws.com/static.northpass.com/NorthpassAcademy/headshot_2.jpg" />
            </div>
            <div class="instructor-info">
                <div class="instructor-name">Bridget Cafaro</div>
                <a href="mailto:bcafaro@northpass.com" target="_blank" class="instructor-email" style='color: #089FB7;'>bcafaro@northpass.com</a>
                <div class="instructor-joined">Customer Success Manager</div>
            </div>
        </div>
    </div>
    <div class="np-carousel-card">
        <div class="instructor-slide">
            <div class="instructor-image" style='height:160px; width: 160px;'>
                <img style='height: 136px; width: 136px;' src="https://s3.amazonaws.com/static.northpass.com/NorthpassAcademy/nergis2.png" />
            </div>
            <div class="instructor-info">
                <div class="instructor-name">Nergis Tepeli</div>
                <a href="mailto:ntepeli@northpass.com" target="_blank" class="instructor-email" style='color: #089FB7;'>ntepeli@northpass.com</a>
                <div class="instructor-joined">Customer Success Manager</div>
            </div>
        </div>
    </div>
    {% comment %}<div class="np-carousel-card">
        <div class="instructor-slide">
            <div class="instructor-image" style='height:160px; width: 160px;'>
                <img style='height: 136px; width: 136px;' src="https://s3.amazonaws.com/static.northpass.com/NorthpassAcademy/eric.png" />
            </div>
            <div class="instructor-info">
                <div class="instructor-name">Eric Pavan</div>
                <a href="mailto:epavan@northpass.com" target="_blank" class="instructor-email" style='color: #089FB7;'>epavan@northpass.com</a>
                <div class="instructor-joined">Customer Success Manager</div>
            </div>
        </div>
    </div>{% endcomment %}

    <div class="np-carousel-card">
        <div class="instructor-slide">
            <div class="instructor-image" style='height:160px; width: 160px;'>
                <img style='height: 136px; width: 136px;' src="https://s3.amazonaws.com/static.northpass.com/NorthpassAcademy/brian.png" />
            </div>
            <div class="instructor-info">
                <div class="instructor-name">Brian Bastante</div>
                <a href="mailto:bbastante@northpass.com" target="_blank" class="instructor-email" style='color: #089FB7;'>bbastante@northpass.com</a>
                <div class="instructor-joined">Technical Support Specialist</div>
            </div>
        </div>
    </div>
    <div class="np-carousel-card">
        <div class="instructor-slide">
            <div class="instructor-image" style='height:160px; width: 160px;'>
                <img style='height: 136px; width: 136px;' src="https://s3.amazonaws.com/static.northpass.com/NorthpassAcademy/headshot_3.png" />
            </div>
            <div class="instructor-info">
                <div class="instructor-name">Kasia Cholewa</div>
                <a href="mailto:paula@northpass.com" target="_blank" class="instructor-email" style='color: #089FB7;'>support@northpass.com</a>
                <div class="instructor-joined">Technical Support Specialist</div>
            </div>
        </div>
    </div>
</div>

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

    $(".instructors-carousel").slick({
        slidesToShow: 2.5,
        prevArrow: '<i class="fal fa-chevron-left"></i>',
        nextArrow: '<i class="fal fa-chevron-right"></i>',
        infinite: false,
        dots: false,
        arrows: true,
        responsive: [
            {
                breakpoint: 1170,
                settings: {
                    slidesToShow: 2,
                }
            },
            {
                breakpoint: 768,
                settings: {
                    slidesToShow: 1,
                }
            }
        ]
    });
});
	
</script>

<style>
    .instructors-carousel .fa-chevron-right:before {
        right: -7px !important;
    }
</style>