Demos: o-spacing

<div class="demo-named-spaces-container">
	<div class="demo-named-space demo-named-space--s1">
		<span class="demo-named-space__name">s1</span>
		<span class="demo-named-space__value">4px</span>
	</div>

	<div class="demo-named-space demo-named-space--s2">
		<span class="demo-named-space__name">s2</span>
		<span class="demo-named-space__value">8px</span>
	</div>

	<div class="demo-named-space demo-named-space--s3">
		<span class="demo-named-space__name">s3</span>
		<span class="demo-named-space__value">12px</span>
	</div>

	<div class="demo-named-space demo-named-space--s4">
		<span class="demo-named-space__name">s4</span>
		<span class="demo-named-space__value">16px</span>
	</div>

	<div class="demo-named-space demo-named-space--s6">
		<span class="demo-named-space__name">s6</span>
		<span class="demo-named-space__value">24px</span>
	</div>

	<div class="demo-named-space demo-named-space--s8">
		<span class="demo-named-space__name">s8</span>
		<span class="demo-named-space__value">32px</span>
	</div>

	<div class="demo-named-space demo-named-space--m12">
		<span class="demo-named-space__name">m12</span>
		<span class="demo-named-space__value">48px</span>
	</div>

	<div class="demo-named-space demo-named-space--m16">
		<span class="demo-named-space__name">m16</span>
		<span class="demo-named-space__value">64px</span>
	</div>

	<div class="demo-named-space demo-named-space--l18">
		<span class="demo-named-space__name">l18</span>
		<span class="demo-named-space__value">72px</span>
	</div>

	<div class="demo-named-space demo-named-space--l24">
		<span class="demo-named-space__name">l24</span>
		<span class="demo-named-space__value">96px</span>
	</div>
</div>

<div class="o-spacing-s1"></div>
<div class="o-spacing-s2"></div>
<div class="o-spacing-s3"></div>
<div class="o-spacing-s4"></div>
<div class="o-spacing-s6"></div>
<div class="o-spacing-s8"></div>
<div class="o-spacing-m12"></div>
<div class="o-spacing-m16"></div>
<div class="o-spacing-l18"></div>
<div class="o-spacing-l24"></div>