<div class="np-card np-no-horizontal-padding">
  <div>
    <div class="np-learning-path np-featured-course">
      <div class="np-featured-course-img-container">
        {% comment %}
          <div class="np-card-image-content-top">           
              {% include "course_details" %}
          </div>
          {% endcomment %}
          <img
          class="np-card-image"
          alt="{{ course.name }}"
          src="{{ course.image_url }}"
          style="border-top-left-radius: 16px; border-bottom-left-radius: 16px;"
          >
      </div>


      <div class="np-card-text-wrapper">
        <div>
          <div class="np-dashboard-resources-title" style="margin-top: 2%; margin-left: 2%;">
            {%comment%}{{ homepage.featured_courses_headline }}{%endcomment%}
            Featured Course
          </div>
        </div>
        <div class="np-card-content np-card-content-vertical" style="margin-top: -1%; padding: 0 3%;">
          <h3 class="np-card-content-title">
            {{ course.name }}
          </h3>
          <h3 class="np-card-description">
            {{ course.full_description }}
          </h3>
          {%comment%}<div class="np-card-image-content-bottom" >
            <div class="np-card-content-progress np-button-color">
            {% t shared.progress, count: course.progress %}
            </div> 
          </div>{%endcomment%}

          <div class="np-card-content-footer" style="margin-top: 12%; position: absolute; border-radius: 16px;">
            <a
              class="np-top-button np-button-font-color np-button" href="{% route course_enrollment, code: course.enrollment_code %}" style="background: #175C62; border-radius: 12px;"          
              >
                {%comment%}{% if course.enrolled? == false %}
                  {% t shared.enroll %}
                {% elsif course.started? == false %}
                  {% t shared.start, key: current_school.course_vocabulary %}
                {% elsif course.completed? %}
                  {% t shared.course.view, key: current_school.course_vocabulary %}
                {% else %}
                  {% t shared.continue %}
                {% endif %}{%endcomment%}
              Learn More
            </a>
            
            {%comment%}{% include "course_details" %}{%endcomment%}
          </div>
        </div>
      </div>
    </div>
  </div>
</div>
