<div class="d-flex flex-column card-regular col-md-3 my-2 my-md-5 px-0" style="height: 500px; overflow: hidden;">
    {{ $page := . }}
    {{- with .Resources.Match "images/banner.svg" -}}
    {{ range . }}
    {{- $image := . -}}
    <div style="height: 60%; overflow: hidden;">
        <div class="ma-0 pa-0" style="background-image: url('{{ $image.RelPermalink }}'); background-position: center; background-size: cover; height: 250%;">
        </div>
    </div>
    {{- end -}}
    {{- end -}}
    <div class="mx-3 my-3">
        <h5 class="created text-muted text-uppercase font-weight-bold">{{ $page.Date.Format "January 2, 2006" }}</h5>
        <p class="text-muted">{{ $page.ReadingTime }} min read</p>
    </div>
</div>

