## Header

### HTML

                        <!-- Begin .header -->
    <header class="header cf" role="banner">
    	<a href="/"><img src="../../images/logo.png" class="logo" alt="Logo Alt Text" /></a>
    	<a href="#" class="nav-toggle nav-toggle-search icon-search"><span class="is-vishidden">Search</span></a>
    	<a href="#" class="nav-toggle nav-toggle-menu icon-menu"><span class="is-vishidden">Menu</span></a>
    	<nav id="nav" class="nav">
    	<ul>
    		<li><a href="&#x2F;patterns&#x2F;04-pages-00-homepage&#x2F;04-pages-00-homepage.html">Home</a></li>
    		<li><a href="#">About</a></li>
    		<li><a href="&#x2F;patterns&#x2F;04-pages-01-blog&#x2F;04-pages-01-blog.html">Blog</a></li>
    		<li><a href="#">Contact</a></li>
    	</ul>
    </nav><!--end .nav-->

    	<form action="#" method="post" class="inline-form search-form">
        <fieldset>
    	    <legend class="is-vishidden">Search</legend>
    	    <label for="search-field" class="is-vishidden">Search</label>
    	    <input type="search" placeholder="Search" id="search-field" class="search-field" />
    	    <button class="search-submit">
    	    	<span class="icon-search" aria-hidden="true"></span>
    	    	<span class="is-vishidden">Search</span>
    	    </button>
        </fieldset>
    </form>
    </header>
    <!-- End .header -->

## Footer

### HTML

                        <!-- Begin Footer -->
    <footer class="footer" role="contentinfo">
    	<div class="lc">
    		<p class="copyright">&copy; 2015 Company Name. All rights reserved.</p>
    	</div>
    </footer>
    <!-- End Footer -->