<header class="bar" id="top-menu">
            <h1 class="logo"><a href="/"><img src="{{ .Site.Params.logo }}" alt="{{ .Site.Title }}"/></a></h1>
            <nav class="menu">
              <ul>
              {{ $currentPage := . }}
              {{ range .Site.Menus.main }}
              {{ if .HasChildren }}
                <details class="menu-dropdown">
                <summary class="menu-nav-item {{ if $currentPage.HasMenuCurrent "main" . }}active{{ end }}">
                    <a href="#">
                        {{ .Pre }}
                        <span>{{ .Name }}</span>
                    </a>
                </summary>
                <ul class="sub-menu">
                    {{ range .Children }}
                        <li class="{{ if $currentPage.IsMenuCurrent "main" . }}active{{ end }}">
                            <a href="{{ .URL }}">{{ .Name }}</a>
                        </li>
                    {{ end }}
                </ul>
              </details>
            {{ else }}
                <li class="menu-nav-item">
                    <a href="{{ .URL }}">
                        {{ .Pre }}
                        <span>{{ .Name }}</span>
                    </a>
                </li>
            {{ end }}
        {{ end }}
              </ul>
            </nav>
    </header>