---
layout: "base.njk"
---

<main class="wrapper-lg events">
    <article class="stack-lg">
        <h1 class="text-center">{{ title }}</h1>
        <div class="stack-lg">     
           {{ content | safe }}
            <h2>The events</h2>
            
            <ul class="grid eventlist" role="list" data-cols="3">
            {% for event in events %}
                <li class="event stack-2xs">
                    <h3>{{ event.name }}</h3>
                    <time datetime="{{ event.date }}">{{ event.date | dateDisplay }}</time>
                    <p>Distance: {{ event.distance }}</p>
                </li>
            {% endfor %}
            </ul>
        </div>
    </article>
</main>