<div class="{{ card_css_class }}" id="{{ card.code }}" data-title="">
    {% if show_header and card.title or card.menu %}
    <div class="card-header {{ card.header_css_class }}">
        <div class="d-flex align-items-center">
            <h5 class="mr-auto">{% if card.header_icon %}<i class="{{ card.header_icon }}"></i> {% endif %}{{ card.title }}</h5>
            {{ card.menu.render }}
            {% include 'cards/standard/_reload_button.html' %}
        </div>
    </div>
    {% endif %}
    <div class="{{ card_body_css_class }}">
        <iframe {% if card.extra_card_info.iframe_url %}src="{{ card.extra_card_info.iframe_url }}"{% endif %}
                {% if card.extra_card_info.iframe_srcdoc %}srcdoc="{{ card.extra_card_info.iframe_srcdoc }}"{% endif %}
                {% if card.extra_card_info.iframe_sandbox %}sandbox="{{ card.extra_card_info.iframe_sandbox }}"{% endif %}
                {% if card.extra_card_info.iframe_id %}id="{{ card.extra_card_info.iframe_id }}"{% endif %}
                {% if card.extra_card_info.iframe_name %}name="{{ card.extra_card_info.iframe_name }}"{% endif %}
                style="width: 100%; height: {{ card.extra_card_info.iframe_height }}; border: none; display: block;"
                allowfullscreen></iframe>
    </div>
    {% if card.footer %}
        <div class="card-footer">
            <small style="text-align: left">{{ card.footer|safe }}</small>
        </div>
    {% endif %}
</div>
{% include 'cards/standard/_reload_script.html' %}
