<header id="header">
  <div id="banner"></div>
  <div id="header-outer" class="outer">
    <div id="header-title" class="inner">
      <h1 id="logo-wrap">
        <a href="<%- url_for() %>" id="logo"><%= config.title %></a>
      </h1>
      <% if (theme.subtitle){ %>
        <h2 id="subtitle-wrap">
          <a href="<%- url_for() %>" id="subtitle"><%= theme.subtitle %></a>
        </h2>
      <% } %>
    </div>
    <div id="header-inner" class="inner">
      <nav id="main-nav">
        <a id="main-nav-toggle" class="nav-icon"></a>
        <% for (var i in theme.menu){ %>
          <a class="main-nav-link" href="<%- url_for(theme.menu[i]) %>"><%= i %></a>
        <% } %>
      </nav>
      <nav id="sub-nav">
        <% if (theme.rss){ %>
          <a id="nav-rss-link" class="nav-icon" href="<%- url_for(theme.rss) %>" title="<%= __('rss_feed') %>"></a>
        <% } %>
        <a id="nav-search-btn" class="nav-icon" title="<%= __('search') %>"></a>
      </nav>
      <div id="search-form-wrap">
        <%- search_form({button: '&#xF002;'}) %>
      </div>
    </div>
  </div>
</header>