<div class="card is-flex is-flex-direction-column is-fullheight is-justify-content-space-between">
            <div class="card-image">
              <a href="{{ post.permalink }}">
                <figure class="image is-4by3">
                  {% set image = resize_image(path="@/" ~ post.colocated_path ~ "/" ~ post.extra.depiction.image, width=800, height=600) -%}
                  <img src="{{ image.url }}" alt="{{ post.extra.depiction.alt }}" />
                  {% if post.extra.depiction.credits %}
                    <figcaption class="p-1 has-text-white has-background-black is-size-7 is-italic">{{ post.extra.depiction.credits }}</figcaption>
                  {% endif %}
                </figure>
              </a>
            </div>
            <div class="card-content is-fullheight">
                <a href="{{ post.permalink }}"><h3 class="title is-4">{{ post.title }}</h3></a>
                <div class="content">
                  {% include "blog/meta_line.html" -%}
                  {{ post.summary | safe }}
                </div>
            </div>
            <div class="card-footer blog-card-authors">
              <div class="card-footer-item">
                <div class="is-fullwidth">
                  {% include "blog/author_media.html" -%}
                </div>
              </div>
            </div>
          </div>