{% if karte.backimg %}
<style>
    #{{karte.wikiid}} {
        background-image: url("{{karte.backimg}}");
    }
    #inkarte{
        background-color: white;
        border-radius: 1rem;
        filter: drop-shadow(6px 6px 10px black);
        padding: 4px;
    }
</style>
{% endif %}
<article id="{{ karte.wikiid}}">
    <div id="inkarte">
        <img src="{{ karte.img }}" />
        {% if karte.ytid %}
        <p>
            <button id="{{karte_loop.index0}}" onclick="vorherige(this.id)">
                Vorherige</button
            ><button
                id="{{karte_loop.index0}}"
                onclick="abspielendiese(this.id)"
            >
                Abspielen</button
            ><button id="{{karte_loop.index0}}" onclick="nächste(this.id)">
                Nächstes
            </button>
        </p>
        <audio src="/static/{{karte.datei}}"></audio>
        {% endif %}

        <h2>{{ karte.titel}}</h2>

        {% if karte.jahrgang %}
        <p><b>Jahrgang:</b> {{ karte.jahrgang }}</p>
        {% endif %} {% if karte.plazirung%}
        <p><b>Plazirung:</b> {{ karte.plazirung }}</p>
        {% endif %} {% if karte.land %}
        <p><b>Antretent für:</b> {{karte.land}}</p>
        {% endif %}

        <p><b>Interpret(en):</b> {{ karte.interprete}}</p>

        <p><b>Länge:</b> {{karte.laenge|zeit}}</p>
        <p id="gray">
            {% if karte.text %}
            <a id="gray" href="{{ karte.text }}" target="_blank"
                >Original Text</a
            >
            {% endif %}
            <a id="gray" href="https://www.wikidata.org/entity/{{karte.wikiid}}"
                >Q-id:{{karte.wikiid}}</a
            >
        </p>
        {% if admin %}
        <form method="post">
            <button name="index" value="{{karte_loop.index0}}">
                &lt;X&gt;
            </button>
        </form>
        {% endif %}
    </div>
</article>