<div class="off-canvas-wrap" data-offcanvas>
	<div class="inner-wrap">
		<nav class="tab-bar">
			<section class="left-small">
				<a class="left-off-canvas-toggle menu-icon" href="#"><span></span></a>
			</section>

			<section class="middle tab-bar-section">
				<h1 class="title">Foundation</h1>
			</section>

			<section class="right-small">
				<a class="right-off-canvas-toggle menu-icon" href="#"><span></span></a>
			</section>
		</nav>

		<aside class="left-off-canvas-menu">
			<ul class="off-canvas-list">
				<li><label>Foundation</label></li>
				<li><a href="#">The Psychohistorians</a></li>
				<li><a href="#">...</a></li>
			</ul>
		</aside>

		<aside class="right-off-canvas-menu">
			<ul class="off-canvas-list">
				<li><label>Users</label></li>
				<li><a href="#">Hari Seldon</a></li>
				<li><a href="#">...</a></li>
			</ul>
		</aside>

		<section class="main-section">
			<!-- content goes here -->
		</section>

		<a class="exit-off-canvas"></a>

	</div>
</div>
