{% assign item = include.item %}
<div class="d-none d-md-block">
    <div class="row no-gutters {% unless include.hide_bottom_border %}border-bottom{% endunless %} border-gray">
        <div class="col-md-3 col-xl-2 mb-md-0 p-md-3">
            {%- if item.cover -%}
            <img data-src="{{ item.cover | relative_url }}" alt="{{ item.title }}" class="lazy w-100 rounded-sm" src="{{ '/assets/images/empty_300x200.png' | relative_url }}">
            {%- else -%}
            <svg class="bubble-visual-hash lazy w-100 rounded-sm" data-bubble-visual-hash="{{ item.id }}" viewBox="0 0 300 200"></svg>
            {%- endif -%}
        </div>
        <div class="col-md-9 col-xl-10 p-3 pl-md-0">
            <h5 class="mt-0 mb-1 font-weight-normal">{{ item.title }}</h5>
            <p class="mt-0 mb-0 small">{% include widgets/author_list.html authors=item.authors %}</p>
            <p class="mt-0 mb-0 small">{{item.pub_pre}}<i>{{ item.pub }}</i>{{ item.pub_post }} {{ item.pub_date }} {{ item.pub_last }} <span data-semantic-scholar-id="{{ item.semantic_scholar_id }}"></span></p>
            <p class="mt-0 mb-0 small text-muted">{{ item.abstract }}</p>
            
            <p class="small pb-0 mb-0 lh-125 text-muted abstract-links">
                {% for link in item.links %}
                {% if link[1].url %}
                <a target="{{ link[1]['target'] }}" href="{{ link[1]['url'] }}">[{{ link[0] }}]</a>
                {% else %}
                <a target="_blank" href="{{ link[1] }}">[{{ link[0] }}]</a>
                {% endif %}
                {% endfor %}
            </p>

        </div>
    </div>
</div>

<div class="row no-gutters d-md-none {% unless include.hide_bottom_border %}border-bottom{% endunless %} border-gray {% if include.first %}rounded-xl-top{% endif %} {% if include.last %}rounded-xl-bottom{% endif %} {% if item.cover %}lazy{% endif %}" data-src="{{ item.cover | relative_url }}">
    <div class="w-100 {% if include.first %}rounded-xl-top{% endif %} {% if include.last %}rounded-xl-bottom{% endif %}" style="background-color: rgba(255,255,255,0.9);">
        <div class="d-flex align-items-start flex-column py-3 px-4">
            <div class="mb-auto"></div>
            <div>
                <h5 class="mt-0 mb-1 font-weight-normal">{{ item.title }}</h5>
                <p class="mt-0 mb-0 small">{% include widgets/author_list.html authors=item.authors %}</p>
                <p class="mt-0 mb-0 small">{{item.pub_pre}}<i>{{ item.pub }}</i>{{ item.pub_post }} {{ item.pub_date }} {{ item.pub_last }} <span data-semantic-scholar-id="{{ item.semantic_scholar_id }}"></span></p>
                <p class="mt-0 mb-0 small text-muted">{{ item.abstract }}</p>
                
                <p class="small pb-0 mb-0 lh-125 text-muted abstract-links">
                    {% for link in item.links %}
                    {% if link[1].url %}
                    <a target="{{ link[1]['target'] }}" href="{{ link[1]['url'] }}">[{{ link[0] }}]</a>
                    {% else %}
                    <a target="_blank" href="{{ link[1] }}">[{{ link[0] }}]</a>
                    {% endif %}
                    {% endfor %}
                </p>
            </div>
        </div>
    </div>

</div>