<p>There are 8 stylistic module class suffixes which provide a unique style variation to the module: title1-8 and box1-8. There are also various additional structural suffixes, these affect the layout and metrics of the module.</p>
<p>Furthermore, you can also add FontAwesome icons into the Module Class Suffix. You will get a medium sized icon to the left of the title. Suffixes are in the icon-NAME format such as icon-star, as shown on the Typography page.</p>

[spacer size="80"]

[row equal_height="yes"]
	[column size="1/4"]
		<div class="uk-panel title1">
			<h3 class="uk-panel-title">
				<span class="uk-title-text">Title 1</span>
			</h3>
			<div class="panel-content">
				<p>An example module using the <strong>title1</strong> module class suffix.</p>
				<p>Lorem ipsum dolor sit amet, consecetur adipiscing elit donec sit amet nibh.</p>
			
			</div>
		</div>
	[/column]
	[column size="1/4"]
		<div class="uk-panel title2">
			<h3 class="uk-panel-title">
				<span class="uk-title-text">Title 2</span>
			</h3>
			<div class="panel-content">
				<p>An example module using the <strong>title2</strong> module class suffix.</p>
				<p>Lorem ipsum dolor sit amet, consecetur adipiscing elit donec sit amet nibh.</p>
			</div>
		</div>
	[/column]
	[column size="1/4"]
		<div class="uk-panel title3">
			<h3 class="uk-panel-title">
				<span class="uk-title-text">Title 3</span>
			</h3>
			<div class="panel-content">
				<p>An example module using the <strong>title3</strong> module class suffix.</p>
				<p>Lorem ipsum dolor sit amet, consecetur adipiscing elit donec sit amet nibh.</p>
			</div>
		</div>
	[/column]
	[column size="1/4"]
		<div class="uk-panel title4">
			<h3 class="uk-panel-title">
				<span class="uk-title-text">Title 4</span>
			</h3>
			<div class="panel-content">
				<p>An example module using the <strong>title4</strong> module class suffix.</p>
				<p>Lorem ipsum dolor sit amet, consecetur adipiscing elit donec sit amet nibh.</p>
			</div>
		</div>
	[/column]
[/row]

[divider]

[spacer size="50"]

[row equal_height="yes"]
	[column size="1/4"]
		<div class="uk-panel title5">
			<h3 class="uk-panel-title">
				<span class="uk-title-text">Title 5</span>
			</h3>
			<div class="panel-content">
				<p>An example module using the <strong>title5</strong> module class suffix.</p>
				<p>Lorem ipsum dolor sit amet, consecetur adipiscing elit donec sit amet nibh.</p>
			</div>
		</div>
	[/column]
	[column size="1/4"]
		<div class="uk-panel title6">
			<h3 class="uk-panel-title">
				<span class="uk-title-text">Title 6</span>
			</h3>
			<div class="panel-content">
				<p>An example module using the <strong>title6</strong> module class suffix.</p>
				<p>Lorem ipsum dolor sit amet, consecetur adipiscing elit donec sit amet nibh.</p>
			</div>
		</div>
	[/column]
	[column size="1/4"]
		<div class="uk-panel title7">
			<h3 class="uk-panel-title">
				<span class="uk-title-text">Title 7</span>
			</h3>
			<div class="panel-content">
				<p>An example module using the <strong>title7</strong> module class suffix.</p>
				<p>Lorem ipsum dolor sit amet, consecetur adipiscing elit donec sit amet nibh.</p>
			</div>
		</div>
	[/column]
	[column size="1/4"]
		<div class="uk-panel title8">
			<h3 class="uk-panel-title">
				<span class="uk-title-text">Title 8</span>
			</h3>
			<div class="panel-content">
				<p>An example module using the <strong>title8</strong> module class suffix.</p>
				<p>Lorem ipsum dolor sit amet, consecetur adipiscing elit donec sit amet nibh.</p>
			</div>
		</div>
	[/column]
[/row]

[divider]

[spacer size="50"]

[row equal_height="yes"]
	[column size="1/4"]
		<div class="uk-panel box1">
			<h3 class="uk-panel-title">
				<span class="uk-title-text">Box 1</span>
			</h3>
			<div class="panel-content">
				<p>An example module using the <strong>box1</strong> module class suffix.</p>
				<p>Lorem ipsum dolor sit amet, consecetur adipiscing elit donec sit amet nibh.</p>
			</div>
		</div>
	[/column]
	[column size="1/4"]
		<div class="uk-panel box2">
			<h3 class="uk-panel-title">
				<span class="uk-title-text">Box 2</span>
			</h3>
			<div class="panel-content">
				<p>An example module using the <strong>box2</strong> module class suffix.</p>
				<p>Lorem ipsum dolor sit amet, consecetur adipiscing elit donec sit amet nibh.</p>
			</div>
		</div>
	[/column]
	[column size="1/4"]
		<div class="uk-panel box3">
			<h3 class="uk-panel-title">
				<span class="uk-title-text">Box 3</span>
			</h3>
			<div class="panel-content">
				<p>An example module using the <strong>box3</strong> module class suffix.</p>
				<p>Lorem ipsum dolor sit amet, consecetur adipiscing elit donec sit amet nibh.</p>
			</div>
		</div>
	[/column]
	[column size="1/4"]
		<div class="uk-panel box4">
			<h3 class="uk-panel-title">
				<span class="uk-title-text">Box 4</span>
			</h3>
			<div class="panel-content">
				<p>An example module using the <strong>box4</strong> module class suffix.</p>
				<p>Lorem ipsum dolor sit amet, consecetur adipiscing elit donec sit amet nibh.</p>
			</div>
		</div>
	[/column]
[/row]
[spacer]
[divider]

[spacer size="50"]

[row equal_height="yes"]
	[column size="1/4"]
		<div class="uk-panel box5">
			<h3 class="uk-panel-title">
				<span class="uk-title-text">Box 5</span>
			</h3>
			<div class="panel-content">
				<p>An example module using the <strong>box5</strong> module class suffix.</p>
				<p>Lorem ipsum dolor sit amet, consecetur adipiscing elit donec sit amet nibh.</p>
			</div>
		</div>
	[/column]
	[column size="1/4"]
		<div class="uk-panel box6">
			<h3 class="uk-panel-title">
				<span class="uk-title-text">Box 6</span>
			</h3>
			<div class="panel-content">
				<p>An example module using the <strong>box6</strong> module class suffix.</p>
				<p>Lorem ipsum dolor sit amet, consecetur adipiscing elit donec sit amet nibh.</p>
			</div>
		</div>
	[/column]
	[column size="1/4"]
		<div class="uk-panel box-shadow">
			<h3 class="uk-panel-title">
				<span class="uk-title-text">box-shadow</span>
			</h3>
			<div class="panel-content">
				<p>An example module using the <strong>box-shadow</strong> module class suffix.</p>
				<p>Lorem ipsum dolor sit amet, consecetur adipiscing elit donec sit amet nibh.</p>
			</div>
		</div>
	[/column]
	[column size="1/4"]
		<div class="uk-panel box-bevel">
			<h3 class="uk-panel-title">
				<span class="uk-title-text">Boxs-bevel</span>
			</h3>
			<div class="panel-content">
				<p>An example module using the <strong>box-bevel</strong> module class suffix.</p>
				<p>Lorem ipsum dolor sit amet, consecetur adipiscing elit donec sit amet nibh.</p>
			</div>
		</div>
	[/column]
[/row]

[spacer size="50"]
