{% for category in page.taxonomy.category %}
  <div class="card {{ category }}" data-category= "{{ category }}">

      {% set image = page.media.images|first %}
      {% if image %}
      <div class="card-image">
          <a href="{{ page.url }}">{{ image.html }}</a>
      </div>
      {% endif %}

      <div class="card-header">
          <div class="card-title">
          {% include 'partials/blog/title.html.twig' with {title_level: 'h5'} %}
          </div>


          {% if page.taxonomy.category %}
            <div class="card-category">
              {% include 'partials/blog/category.html.twig' %}
            </div>
        {% endif %}

        {% if page.date %}
        <div class="card-date">
          {% include 'partials/blog/date.html.twig' %}
        </div>
        {% endif %}
      </div>

      {% if page.taxonomy.tag %}
        <div class="card-footer">
          {% include 'partials/blog/taxonomy.html.twig' %}
        </div>
    {% endif %}
  </div>
{% endfor %}