<nav class=“row”>

<div id="nav">
  <ul class="columns primary-nav">

    <li id="toggleMenu"><a href="#nav">Menu</a></li>
    <li id="hideMenu"><a href="#toggleMenu">Menu</a></li>

    {% for nav in site.data.horiznav %}
      {% if nav.subcategories != null %}
        <li class="header-nav dropdown">
          <a href="{{ site.github.url }}{{ nav.url }}">{{ nav.title }}</a>
            <ul>
              {% for subcategory in nav.subcategories %}
                <li><a href="{{ site.github.url }}{{ subcategory.subhref }}">{{ subcategory.subtitle }}</a></li>
              {% endfor %}
            </ul>
        </li>
    {% elsif nav.external-subcategories != null %}
        <li class="header-nav dropdown">
          <a href="{{ site.url }}{{ nav.url }}">{{ nav.title }}</a>
            <ul>
              {% for subcategory in nav.external-subcategories %}
                <li><a href="{{ subcategory.subhref }}">{{ subcategory.subtitle }}</a></li>
              {% endfor %}
            </ul>
        </li>
            {% elsif nav.title == page.title %}
              <li class="active"><a href="{{ nav.href }}">{{ nav.title }}</a></li>
            {% else %}
              {% if nav.href %}
              <li><a href="{{ site.github.url }}{{ nav.href }}">{{ nav.title }}</a></li>
                {% elsif nav.external %}
                <li><a href="{{ nav.external }}">{{ nav.title }}</a></li>
              {% endif %}
      {% endif %}
    {% endfor %}
  </ul>

  <ul class="columns medium-4 right primary-nav flex">
    {% for socials in site.data.horizsocials %}
      <li class="right"><a href="{{ socials.href }}"><span class="icon-{{ socials.title }} socials"></span></a></li>
    {% endfor %}
  </ul>
</div>

</nav>