<!-- Navigation -->
<div id="sticky" class="logo{% if page.collection == 'tracks' %} sticky{% endif %}">

  <a id="logo" {% if page.url != '/' %}href="/"{% else %}href="#top"{% endif %}><img height="40px" src="{{ site.logo }}" alt="{{ site.title }} Logo" /></a>
  <a href="#navbar" onclick="blurBody()" alt="Navigation Menu" title="Navigation Menu"><span
      class="fas fa-bars navmenu"></span></a>

</div>

<div id="navbar" class="modalDialog">
  <a href="#close" onclick="removeBlur()" alt="Close Menu" title="Close Menu">
    <div id="closearea"> </div>
  </a>
  <nav>
    <a href="#close" title="Close" onclick="removeBlur()" class="close-button">X</a>
    <ul>
      {% if page.url != '/' %}
      <li><a href="{{ relBase }}/" onclick="removeBlur()" class="button">🏡 Home</a></li>
      {% endif %}
      {% for entry in site.data.navigation %}
      {% if entry.external_site == false %}
      <li><a href="{{ relBase }}{{ entry.url }}" onclick="removeBlur()" class="button">{{ entry.icon }} {{ entry.name }}</a></li>
      {% else %}
      <li><a href="{{ entry.url }}" target="_blank" rel="noopener" onclick="removeBlur()" class="button">{{ entry.icon }} {{ entry.name }}</a></li>
      {% endif %}
      {% endfor %}

    </ul>
  </nav>
</div>
  
  
  <!-- End Navigation -->