{% include "header" %}
<main class="np-main np-learning-paths np-subpage-container np-max-width">
    {% include 'mi_zona_pyme_lp_section' %}
    <!-- Learning Paths -->
    <div class="lps-wrapper grid">
		{% assign ccw_enrolled_lps = learning_paths.enrolled | sort: "name" %}
            {% for learning_path in ccw_enrolled_lps %}
              {% for category in learning_path.categories %}
                  {% if category.name == "Mi Zona Pyme" %}
                      {% include "cards_learning_paths_squares" %}
                  {% endif %}
              {% endfor %}
            {% endfor %}
    </div>
    <!-- Training Event -->
    <div class="np-dashboard-resources">
        <div class="text-container">
            <div class="text-heading text-center">
                Sesiones en vivo
            </div>
        </div>
      {% if training_events.available.any? %}
        <div class="row row-with-thumbnails">
          {% for training_event in training_events.available %}
            <div class="col-xs-12 col-sm-6 col-lg-4 np-stretch-content">
                {% assign event_name = training_event.title | downcase %}
                {% if event_name contains "mi zona pyme" %}
                    {% include "cards_training_event" %}
                {% endif %}
            </div>
          {% endfor %}
        </div>
      {% else %}
        {% include "training_events_zero_state" %}
      {% endif %}
    </div>

    <!-- FAQs 
    <div class="faq">
        {% include 'faq_ccw_section' %}
    </div>-->

{% include "footer" %}

<style>
.grid {
    Display: Flex;
    flex-direction: row;
    flex-wrap: wrap;
}

.text-container {
    margin-top: 25px;
}

@media (min-width:768px) {
    .np-subpage-container { 
        padding: 25px 5% 184px 5%;
    }
}

@media (max-width: 800px) {
  .grid {
    flex-direction: column;
  }
</style>