<div class="np-resource-header np-resource-header-card np-card-padding-large">
  <div class="np-top-vocabulary np-text-title">
    {% t shared.learning_path.title %}
    <i class="far fa-road np-button-color np-learning-path-icon"></i>
  </div>
  <div class="np-top-title lp-title">
    <a href="{% route home %}" class="np-back-button" aria-label="{% t shared.go_back %}">
      <i class="far fa-arrow-left np-icon-back"></i>
    </a>
    {{ learning_path.name }}
  </div>
</div>

<div class="row">
  <div class="col-xs-12 col-sm-6">
    <div class="np-card-container">
      <img
        src="{{ learning_path.image_url }}"
        class="np-top-image"
        alt="{{ learning_path.name }}"
      />
      <div class="np-card-padding-dynamic">
        {% include "learning_path_description" %}
        {% include "learning_path_instructors" %}
      </div>
    </div>
  </div>
  <div class="col-xs-12 col-sm-6 np-grid-spacing">
    <div class="np-top-cta">
      {% include "learning_path_progress_and_cta" %}
    </div>
    {% include "learning_path_outline" %}
  </div>
</div>

