HTML5 Sectioning elements

dabblet.css

/**
 * HTML5 Sectioning elements
 */

@import url(http://fonts.googleapis.com/css?family=Open+Sans:400,700);
body { font-family: "Open Sans"; }

dabblet.html

<header>
	<h1>My Site</h1>
	<section role="form" aria-label="Site Search">
	<form action="#">
	<label for="search">Search:</label>
	<input type="search" id="search" required />
	<input type="submit" value="Submit!"/>
	</form>
	</section>
</header>
<nav aria-label="Main">
	<ul>
		<li><a href="#">About Me</a></li>
		<li><a href="#">Blog</a></li>
		<li><a href="#">Photos</a></li>
	</ul>
</nav>
<section role="main">
	<article>
		<header>
			<h2>My Blog Article</h2>
			<p>Published by me on date.</p>
		</header>
		<p>This is the main content of my article.  <p>
		<aside>
			<p>Here are some additional resources about this post.</p>
		</aside>
		<footer>
			<p>More metatdata</p>
		</footer>
		<section>
			<h2>Comments</h2>
			<article>
				<h3>My two cents</h3>
				<p>Answered all my questions...  Thanks!</p>
			</article>	
		</section>
	</article>
</section>
<footer>
	<p>Copywrong info</p>
</footer>

dabblet.js

// alert('Hello world!');

settings.json

{"view":"separate","fontsize":"100","seethrough":"","prefixfree":"1","page":"html"}