<!DOCTYPE html>
<html lang="{{ lang }}" dir="{{ lang_dir }}">
    <head>
        <title>{{platform.titel}}</title>
        <meta charset="utf-8" >
        <link
            rel="icon"
            type="image/x-icon"
            href="{{ asset_src(platform.favicon) }}"
        >
        <link rel="canonical" href="{{ url_for('localized_index', lang=lang, _external=True) }}">
        {% for code in languages %}
        <link rel="alternate" hreflang="{{ code }}" href="{{ url_for('localized_index', lang=code, _external=True) }}">
        {% endfor %}
        <link rel="alternate" hreflang="x-default" href="{{ url_for('index', _external=True) }}">
        <!-- Bootstrap CSS only -->
        <link href="{{ url_for('static', filename='vendor/bootstrap/css/bootstrap' ~ ('.rtl' if lang_dir == 'rtl' else '') ~ '.min.css') }}" rel="stylesheet">
        <!-- Bootstrap JavaScript Bundle with Popper -->
        <script src="{{ url_for('static', filename='vendor/bootstrap/js/bootstrap.bundle.min.js') }}"></script>
        <!-- Bootstrap Icons -->
        <link rel="stylesheet" href="{{ url_for('static', filename='vendor/bootstrap-icons/font/bootstrap-icons.css') }}">
        <!-- Fontawesome -->
        <link rel="stylesheet" href="{{ url_for('static', filename='vendor/fontawesome/css/all.min.css') }}">
        <!-- Markdown -->
        <script src="{{ url_for('static', filename='vendor/marked/marked.min.js') }}"></script>
        <link rel="stylesheet" href="{{ url_for('static', filename='css/default.css') }}">
        <link rel="stylesheet" href="{{ url_for('static', filename='css/custom_scrollbar.css') }}">
        <!-- JQuery -->
        <script src="{{ url_for('static', filename='vendor/jquery/jquery.min.js') }}"></script>
    </head>
    <body
      {% if apod_bg %}
        style="
          background-image: url('{{ apod_bg }}');
          background-size: cover;
          background-position: center;
          background-attachment: fixed;
        "
      {% endif %}
    >
        <div class="container">
            <header class="header js-restore">
              <img
                src="{{ asset_src(platform.logo) }}"
                alt="logo"
              />
              <h1>{{platform.titel}}</h1>
              <h2>{{platform.subtitel}}</h2>
            </header>
            {% set menu_type = "header" %}
            {% include "moduls/navigation.html.j2"%}
            <main id="main">
            <div class="scroll-container">
                {% block content %}{% endblock %}
            </div>
            </main>
            <!-- Custom scrollbar element fixiert am rechten Rand  -->
            <div id="custom-scrollbar">
                <div id="scroll-thumb"></div>
            </div>
            {% set menu_type = "footer" %}
            {% include "moduls/navigation.html.j2" %}
            <footer class="footer">
                <div itemscope itemtype="http://schema.org/LocalBusiness" class="small">
                    <p itemprop="name">{{ company.titel }} <br />
                    {{ company.subtitel }}</p>
                    <span><i class="fa-solid fa-location-dot"></i> {{ company.address.values() | join(", ") }}</span>
                    <p><a href="{{company.imprint_url}}" class="iframe-link"><i class="fa-solid fa-scale-balanced"></i> {{ t('Imprint') }}</a></p>
                </div>
            </footer>
        </div>
        <!-- Include modal -->
        {% include "moduls/modal.html.j2" %}
        <script>window.I18N = {{ ui_strings | tojson }};</script>
        {% for name in [
            'modal',
            'navigation',
            'tooltip',
            'container',
            'fullwidth',
            'fullscreen',
            'iframe',
        ] %}
        <script src="{{ url_for('static', filename='js/' ~ name ~ '.js') }}"></script>
        {% endfor %}
    </body>
</html>