<div class="np-homepage-featured-courses row" style="margin-top:32px;">
  <div class="col-xs-12 col-md-10" style="margin:auto">
    <div class="np-homepage-headline">
      {{ homepage.featured_courses_headline }}
    </div>
    <div class="np-homepage-subheadline">
      {{ homepage.featured_courses_subheadline }}
    </div>
  
{% if courses.featured.any? %}
  <div class="row" style="margin-top:16px;">
    {% for course in courses.featured %}
      <div class="col-xs-12 col-md-6 col-lg-4 np-stretch-content">
        {% include "cards_course" with course %}
      </div>
    {% endfor %}
  </div>
{% else %}
  <div class="np-homepage-featured-empty">
    <div class="np-zero-state-text">
      There are currently no featured courses available.
    </div>
    <img class="np-zero-state-courses" alt="" />
  </div>
{% endif %}
</div>