{% block custom_stylesheets %}
    {% do assets.addCss('theme://css/boxlist.css', 90) %}
{% endblock %}

<h1 class="page-cell">{{ page.title }}</h1>

<div class="img-box-list page-cell">
    {% for box in page.header.boxes %}
    <div class="img-box">
        <div class="animated-image">
            <img loading="lazy" alt="{{ box.title }}" style="position: relative; left: 0px; top: 0px; user-select: none" draggable="false" unselectable="on" src="{{ page.media[box.image].url|e }}">
            {% if box.url != '' %}<a href="{{ box.url }}" target="_blank">Zur<br/>Webseite</a>{% endif %}
        </div>
        <div class="img-box-caption">
            <h6>{{ box.title }}</h6>
            <span>{{ box.description }}</span>
        </div>
    </div>
    {% endfor %}
</div>