One of the most useful things about Foundation is the ability to send different content to the device or screen size that the user is viewing your project on. By doing this you can speed up load times, customize the content for a specific device and/or screen size.
So let's give this a shot, right after the div with the class inner-wrap; this will be on or around line 19. Let's add the following code:
<div data-interchange="[mobile.html, (small)], [tablet.html, (medium)], [desktop.html, (large)]"></div>
Then we need to create three HTML files called mobile.html, tablet.html, and desktop.html. In index.html. The code you should cut and paste into your mobile.html file is as follows:
<nav class="tab-bar">
<section class="left-small">
<a class="left-off-canvas-toggle menu-icon"><span></span></a>
</section>
<section class="right-small">
<a class="right-off-canvas-toggle menu-icon"><...