<div class="{% if css %}{{ css }}{% else %}row d-flex align-items-center mt-5 mb-5{% endif%}">

  {% if textleft %}

    <div class="col-12 col-md-6">

      {{ body | markdown | safe }}

    </div>

    <div class="col-12 col-md-6 pt-3 pt-sm-0">

      <div class="card {% if shadow %}shadow{% endif %}">

        {% if src %}
        <img {% if popup %}data-popup="true" data-nsrc="{{ get_url(path=popup, cachebust=true) }}"{% endif %} src="{{ get_url(path=src, cachebust=true) }}" alt="{% if alt %}{{ alt }}{% endif %}" width="100%" class="card-img-top img-fluid">
        {% endif %}

        {% if src2 %}
        <img {% if popup2 %}data-popup="true" data-nsrc="{{ get_url(path=popup2, cachebust=true) }}"{% endif %} src="{{ get_url(path=src2, cachebust=true) }}" alt="{% if alt %}{{ alt2 }}{% endif %}" width="100%" class="card-img-top img-fluid">
        {% endif %}

      </div>

    </div>

  {% else %}

    <div class="col-12 col-md-6 order-2 order-md-1">

      <div class="card {% if shadow %}shadow{% endif %}">

        {% if src %}
        <img {% if popup %}data-popup="true" data-nsrc="{{ get_url(path=popup, cachebust=true) }}"{% endif %} src="{{ get_url(path=src, cachebust=true) }}" alt="{% if alt %}{{ alt }}{% endif %}" width="100%" class="card-img-top img-fluid">
        {% endif %}

      </div>

    </div>

    <div class="col-12 col-md-6 order-1 order-md-2">

      {{ body | markdown | safe }}

    </div>

  {% endif %}

</div>