<div class="row mb-4">
    {% if publication.image_url %}
    <div class="col-12 col-lg-3 mt-lg-2 mb-3 mb-lg-0 text-start text-lg-center">
        <a href="javascript:void(0)">
            <img src="{{ publication.image_url }}"
                 title="{{ publication.image_title }}"
                 alt="{{ publication.image_description }}"
                 class="mw-100" style="max-height: 150px"
                 loading="lazy">
        </a>
    </div>

    {% comment %}
    <div class="col-12 col-lg-4 mt-lg-2">
        <div class="img-responsive-wrapper">
            <div class="img-responsive img-responsive-panoramic">
                <figure class="img-wrapper">
                  <a href="javascript:void(0)">
                    <img src="{{ publication.image_url }}"
                         title="{{ publication.image_title }}"
                         alt="{{ publication.image_description }}"
                         loading="lazy">
                  </a>
                </figure>
            </div>
        </div>
    </div>
    {% endcomment %}

    <div class="col-12 col-lg-8 ps-lg-4">
    {% else %}
    <div class="col">
    {% endif %}

        {% include "includes/edit_page_publication.html" with item=page_publication %}

        {% block title %}
        {% endblock title %}

        {% if publication.subheading %}
        {{ publication.subheading }}
        {% endif %}

        {% block publication_content %}
        {% endblock publication_content %}

        {% if publication.related_links %}
        <div class="row mt-3">
            <div class="col">
            {% for link in publication.related_links %}
            <span
                class="badge badge-grey-unical square-corners mb-3 me-3 ms-0 pe-5 p-2 mw-100"
                style="font-size: 100%">
                <a class="no-color" href="{{ link.url }}">
                    <b>{{ link.name }}</b>
                </a>
            </span>
            {% endfor %}
            </div>
        </div>
        {% endif %}
    </div>
</div>
