<!-- Header Start -->
<header class="navigation">
    <div class="header-container">
        <img src="{{ .Site.Params.logo | absURL }}" alt="{{ .Site.Title }}" class="logo">
        <ul class="nav">
            {{ $section := .Page.Section }}
            <li {{ if .Page.IsHome }} class="active" {{ end}}><a href="{{ site.Home.RelPermalink }}">{{ i18n "home" }}</a></li>
            {{ range .Site.Menus.main }}
            {{ if .HasChildren }}

            {{ $active := false }}
            {{ range .Children }}
                {{ if eq $section .URL }}
                    {{ $active = true }}
                {{ end}}
            {{ end }}

            <li {{ if $active }} class="menu-li menu-active" {{ else }} class="menu-li" {{ end}}>
                <span>{{ .Name }}</span>
                <ul class="dropdown-menu">
                    {{ range .Children }}
                    <li {{ if eq $section .URL }} class="active"{{ end}}><a href="{{ .URL | absLangURL }}">{{ .Name }}</a></li>
                    {{ end }}
                </ul>
            </li>
            {{ else }}
            <li {{ if eq $section .URL }} class="active"{{ end}}><a href="{{ .URL | absLangURL }}">{{ .Name }}</a></li>
            {{ end }}

            {{ end }}

        </ul>
        <div class="menu-li language-menu">
            <span>{{ .Site.Language.LanguageName }}</span>
            <ul class="dropdown-menu">
                {{ range .Page.AllTranslations }}
                <li onclick="location = '{{ .Permalink }}'">{{ .Language.LanguageName }}</li>
                {{ end }}
            </ul>
        </div>
    </div>
</header>