{{#extend "layout"}}{{#content "main"}}
<h1>Masonry</h1>
<p>This boilerplate contains default styles and scripts to get up and running with a stable and fluid masonry setup.</p>
<h2>Getting started</h2>
<ul>
	<li>Include rough-masonry.js</li>
	<li>Include _rough-masonry.scss</li>
	<li>Enable the script in app.js</li>
	<li>Modify if you need</li>
</ul>
<h2>Example</h2>
<div id="Masonry" class="Masonry">
	<div class="Masonry-item">
		<p>I'm a masonry item</p>
	</div>
	<div class="Masonry-item">
		<p>I'm a masonry item</p>
	</div>
	<div class="Masonry-item">
		<p>I'm a masonry item</p>
	</div>
	<div class="Masonry-item is-featured">
		<p>I'm a featured .Masonry-item</p>
	</div>
	<div class="Masonry-item">
		<p>I'm a masonry item</p>
	</div>
	<div class="Masonry-item">
		<p>I'm a masonry item</p>
	</div>
	<div class="Masonry-item">
		<p>I'm a masonry item</p>
	</div>
	<div class="Masonry-item is-featured">
		<p>I'm a featured .Masonry-item</p>
	</div>
	<div class="Masonry-item">
		<p>I'm a masonry item</p>
	</div>
	<div class="Masonry-item">
		<p>I'm a masonry item</p>
	</div>
</div>
{{/content}}{{/extend}}