<nav class="navbar is-fixed-top has-shadow" role="navigation" aria-label="main navigation" id="main-navbar">
    <input type="checkbox" id="burger-toggle" role="button" class="navbar-toggle" aria-label="menu" aria-expanded="false" data-target="main-menu" />
    <div class="navbar-brand">
        <a href="{{ get_url(path="@/_index.md") }}" class="navbar-item">
            {{ config.title }}
        </a>

        <label for="burger-toggle" class="navbar-burger">
            <span aria-hidden="true"></span>
            <span aria-hidden="true"></span>
            <span aria-hidden="true"></span>
        </label>
    </div>

    <div class="navbar-menu" id="main-menu">
        <div class="navbar-start">
            <div class="navbar-item has-dropdown is-hoverable is-mega">
                <a href="#" class="navbar-item">Projekte</a>
                <div class="navbar-dropdown">
                    {% include "menu/projects.html" %}
                </div>
            </div>

            <div class="navbar-item has-dropdown is-hoverable is-mega">
                <a href="#" class="navbar-item">Informationen für…</a>
                <div class="navbar-dropdown">
                    {% include "menu/infos.html" %}
                </div>
            </div>

            <div class="navbar-item has-dropdown is-hoverable">
                <a href="#" class="navbar-item">Teckids-Gemeinschaft</a>
                <div class="navbar-dropdown">
                    {% include "menu/gemeinschaften.html" %}
                </div>
            </div>

            <div class="navbar-item has-dropdown is-hoverable">
                <a href="#" class="navbar-item">Updates</a>
                <div class="navbar-dropdown">
                    {% include "menu/updates.html" %}
                </div>
            </div>
        </div>
    </div>
</nav>