      <li><a href="#">Item</a></li>
    </ul>
  </div>
</div>

<p>Using responsive classes, a menu bar can switch between being expanded and being condensed at different screen sizes. Use the classes <code>medium-condense</code>, <code>large-condense</code>, <code>medium-expand</code>, and <code>large-expand</code>.</p>

<div class="grid-block">
  <div class="small-12 medium-6 grid-content">
<hljs>
<ul class="menu-bar condense medium-expand">
  <li><a href="#">Item One</a></li>
  <li><a href="#">Item Too</a