<!doctype html>
<html>


<!-- Mirrored from www.eakroko.de/flat/components-icons.html by HTTrack Website Copier/3.x [XR&CO'2014], Sat, 11 Jun 2016 05:19:17 GMT -->
<head>
	<meta charset="utf-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
	<!-- Apple devices fullscreen -->
	<meta name="apple-mobile-web-app-capable" content="yes" />
	<!-- Apple devices fullscreen -->
	<meta names="apple-mobile-web-app-status-bar-style" content="black-translucent" />

	<title>FLAT - Icons</title>

	<!-- Bootstrap -->
	<link rel="stylesheet" href="css/bootstrap.min.css">
	<!-- jQuery UI -->
	<link rel="stylesheet" href="css/plugins/jquery-ui/jquery-ui.min.css">
	<!-- Theme CSS -->
	<link rel="stylesheet" href="css/style.css">
	<!-- Color CSS -->
	<link rel="stylesheet" href="css/themes.css">


	<!-- jQuery -->
	<script src="js/jquery.min.js"></script>

	<!-- Nice Scroll -->
	<script src="js/plugins/nicescroll/jquery.nicescroll.min.js"></script>
	<!-- imagesLoaded -->
	<script src="js/plugins/imagesLoaded/jquery.imagesloaded.min.js"></script>
	<!-- jQuery UI -->
	<script src="js/plugins/jquery-ui/jquery-ui.js"></script>
	<!-- slimScroll -->
	<script src="js/plugins/slimscroll/jquery.slimscroll.min.js"></script>
	<!-- Bootstrap -->
	<script src="js/bootstrap.min.js"></script>
	<!-- Bootbox -->
	<script src="js/plugins/bootbox/jquery.bootbox.js"></script>
	<!-- Bootbox -->
	<script src="js/plugins/form/jquery.form.min.js"></script>
	<!-- Validation -->
	<script src="js/plugins/validation/jquery.validate.min.js"></script>
	<script src="js/plugins/validation/additional-methods.min.js"></script>

	<!-- Theme framework -->
	<script src="js/eakroko.min.js"></script>
	<!-- Theme scripts -->
	<script src="js/application.min.js"></script>
	<!-- Just for demonstration -->
	<script src="js/demonstration.min.js"></script>

	<!--[if lte IE 9]>
		<script src="js/plugins/placeholder/jquery.placeholder.min.js"></script>
		<script>
			$(document).ready(function() {
				$('input, textarea').placeholder();
			});
		</script>
		<![endif]-->

	<!-- Favicon -->
	<link rel="shortcut icon" href="img/favicon.ico" />
	<!-- Apple devices Homescreen icon -->
	<link rel="apple-touch-icon-precomposed" href="img/apple-touch-icon-precomposed.png" />

</head>

<body>
	<div id="navigation">
		<div class="container-fluid">
			<a href="#" id="brand">FLAT</a>
			<a href="#" class="toggle-nav" rel="tooltip" data-placement="bottom" title="Toggle navigation">
				<i class="fa fa-bars"></i>
			</a>
			<ul class='main-nav'>
				<li>
					<a href="index-2.html">
						<span>Dashboard</span>
					</a>
				</li>
				<li>
					<a href="#" data-toggle="dropdown" class='dropdown-toggle'>
						<span>Forms</span>
						<span class="caret"></span>
					</a>
					<ul class="dropdown-menu">
						<li>
							<a href="forms-basic.html">Basic forms</a>
						</li>
						<li>
							<a href="forms-extended.html">Extended forms</a>
						</li>
						<li>
							<a href="forms-validation.html">Validation</a>
						</li>
						<li>
							<a href="forms-wizard.html">Wizard</a>
						</li>
					</ul>
				</li>
				<li class='active'>
					<a href="#" data-toggle="dropdown" class='dropdown-toggle'>
						<span>Components</span>
						<span class="caret"></span>
					</a>
					<ul class="dropdown-menu">
						<li>
							<a href="components-timeline.html">Timeline</a>
						</li>
						<li>
							<a href="components-pagestatistics.html">Page statistics</a>
						</li>
						<li>
							<a href="components-sidebarwidgets.html">Sidebar widgets</a>
						</li>
						<li>
							<a href="components-messages.html">Messages &amp; Chat</a>
						</li>
						<li>
							<a href="components-gallery.html">Gallery &amp; Thumbs</a>
						</li>
						<li>
							<a href="components-tiles.html">Tiles</a>
						</li>
						<li class='active'>
							<a href="components-icons.html">Icons &amp; Buttons</a>
						</li>
						<li>
							<a href="components-elements.html">UI elements</a>
						</li>
						<li>
							<a href="components-typography.html">Typography</a>
						</li>
						<li>
							<a href="components-bootstrap.html">Bootstrap elements</a>
						</li>
						<li>
							<a href="components-grid.html">Grid</a>
						</li>
					</ul>
				</li>
				<li>
					<a href="#" data-toggle="dropdown" class='dropdown-toggle'>
						<span>Tables</span>
						<span class="caret"></span>
					</a>
					<ul class="dropdown-menu">
						<li>
							<a href="tables-basic.html">Basic tables</a>
						</li>
						<li>
							<a href="tables-advanced.html">Advanced tables</a>
						</li>
						<li>
							<a href="tables-large.html">Large tables</a>
						</li>
					</ul>
				</li>
				<li>
					<a href="#" data-toggle="dropdown" class='dropdown-toggle'>
						<span>Plugins</span>
						<span class="caret"></span>
					</a>
					<ul class="dropdown-menu">
						<li>
							<a href="plugins-charts.html">Charts</a>
						</li>
						<li>
							<a href="plugins-calendar.html">Calendar</a>
						</li>
						<li>
							<a href="plugins-filemanager.html">File manager</a>
						</li>
						<li>
							<a href="plugins-filetrees.html">File trees</a>
						</li>
						<li>
							<a href="plugins-elements.html">Editable elements</a>
						</li>
						<li>
							<a href="plugins-maps.html">Maps</a>
						</li>
						<li>
							<a href="plugins-dragdrop.html">Drag &amp; Drop widgets</a>
						</li>

					</ul>
				</li>
				<li>
					<a href="#" data-toggle="dropdown" class='dropdown-toggle'>
						<span>Pages</span>
						<span class="caret"></span>
					</a>
					<ul class="dropdown-menu">
						<li>
							<a href="more-error.html">Error pages</a>
						</li>
						<li class='dropdown-submenu'>
							<a href="#" data-toggle="dropdown" class='dropdown-toggle'>Shop</a>
							<ul class="dropdown-menu">
								<li>
									<a href="more-shop-list.html">List view</a>
								</li>
								<li>
									<a href="more-shop-product.html">Product view</a>
								</li>
							</ul>
						</li>
						<li>
							<a href="more-pricing.html">Pricing tables</a>
						</li>
						<li>
							<a href="more-faq.html">FAQ</a>
						</li>
						<li>
							<a href="more-invoice.html">Invoice</a>
						</li>
						<li>
							<a href="more-userprofile.html">User profile</a>
						</li>
						<li>
							<a href="more-searchresults.html">Search results</a>
						</li>
						<li>
							<a href="more-login.html">Login</a>
						</li>
						<li>
							<a href="more-locked.html">Lock screen</a>
						</li>
						<li>
							<a href="more-email.html">Email templates</a>
						</li>
						<li>
							<a href="more-blank.html">Blank page</a>
						</li>
						<li class='dropdown-submenu'>
							<a href="#" data-toggle="dropdown" class='dropdown-toggle'>Blog</a>
							<ul class="dropdown-menu">
								<li>
									<a href="more-blog-list.html">List big image</a>
								</li>
								<li>
									<a href="more-blog-list-small.html">List small image</a>
								</li>
								<li>
									<a href="more-blog-post.html">Post</a>
								</li>
							</ul>
						</li>
					</ul>
				</li>
				<li>
					<a href="#" data-toggle="dropdown" class='dropdown-toggle'>
						<span>Layouts</span>
						<span class="caret"></span>
					</a>
					<ul class="dropdown-menu">
						<li>
							<a href="layouts-sidebar-hidden.html">Default hidden sidebar</a>
						</li>
						<li>
							<a href="layouts-sidebar-right.html">Sidebar right side</a>
						</li>
						<li>
							<a href="layouts-color.html">Different default color</a>
						</li>
						<li>
							<a href="layouts-fixed.html">Fixed layout</a>
						</li>
						<li>
							<a href="layouts-fixed-topside.html">Fixed topbar and sidebar</a>
						</li>
						<li class='dropdown-submenu'>
							<a href="#">Mobile sidebar</a>
							<ul class="dropdown-menu">
								<li>
									<a href="layouts-mobile-slide.html">Slide</a>
								</li>
								<li>
									<a href="layouts-mobile-button.html">Button</a>
								</li>
							</ul>
						</li>
						<li>
							<a href="layouts-footer.html">Footer</a>
						</li>
					</ul>
				</li>
			</ul>
			<div class="user">
				<ul class="icon-nav">
					<li class='dropdown'>
						<a href="#" class='dropdown-toggle' data-toggle="dropdown">
							<i class="fa fa-envelope"></i>
							<span class="label label-lightred">4</span>
						</a>
						<ul class="dropdown-menu pull-right message-ul">
							<li>
								<a href="#">
									<img src="img/demo/user-1.jpg" alt="">
									<div class="details">
										<div class="name">Jane Doe</div>
										<div class="message">
											Lorem ipsum Commodo quis nisi ...
										</div>
									</div>
								</a>
							</li>
							<li>
								<a href="#">
									<img src="img/demo/user-2.jpg" alt="">
									<div class="details">
										<div class="name">John Doedoe</div>
										<div class="message">
											Ut ad laboris est anim ut ...
										</div>
									</div>
									<div class="count">
										<i class="fa fa-comment"></i>
										<span>3</span>
									</div>
								</a>
							</li>
							<li>
								<a href="#">
									<img src="img/demo/user-3.jpg" alt="">
									<div class="details">
										<div class="name">Bob Doe</div>
										<div class="message">
											Excepteur Duis magna dolor!
										</div>
									</div>
								</a>
							</li>
							<li>
								<a href="components-messages.html" class='more-messages'>Go to Message center
									<i class="fa fa-arrow-right"></i>
								</a>
							</li>
						</ul>
					</li>

					<li class="dropdown sett">
						<a href="#" class='dropdown-toggle' data-toggle="dropdown">
							<i class="fa fa-cog"></i>
						</a>
						<ul class="dropdown-menu pull-right theme-settings">
							<li>
								<span>Layout-width</span>
								<div class="version-toggle">
									<a href="#" class='set-fixed'>Fixed</a>
									<a href="#" class="active set-fluid">Fluid</a>
								</div>
							</li>
							<li>
								<span>Topbar</span>
								<div class="topbar-toggle">
									<a href="#" class='set-topbar-fixed'>Fixed</a>
									<a href="#" class="active set-topbar-default">Default</a>
								</div>
							</li>
							<li>
								<span>Sidebar</span>
								<div class="sidebar-toggle">
									<a href="#" class='set-sidebar-fixed'>Fixed</a>
									<a href="#" class="active set-sidebar-default">Default</a>
								</div>
							</li>
						</ul>
					</li>
					<li class='dropdown colo'>
						<a href="#" class='dropdown-toggle' data-toggle="dropdown">
							<i class="fa fa-tint"></i>
						</a>
						<ul class="dropdown-menu pull-right theme-colors">
							<li class="subtitle">
								Predefined colors
							</li>
							<li>
								<span class='red'></span>
								<span class='orange'></span>
								<span class='green'></span>
								<span class="brown"></span>
								<span class="blue"></span>
								<span class='lime'></span>
								<span class="teal"></span>
								<span class="purple"></span>
								<span class="pink"></span>
								<span class="magenta"></span>
								<span class="grey"></span>
								<span class="darkblue"></span>
								<span class="lightred"></span>
								<span class="lightgrey"></span>
								<span class="satblue"></span>
								<span class="satgreen"></span>
							</li>
						</ul>
					</li>
					<li class='dropdown language-select'>
						<a href="#" class='dropdown-toggle' data-toggle="dropdown">
							<img src="img/demo/flags/us.gif" alt="">
							<span>US</span>
						</a>
						<ul class="dropdown-menu pull-right">
							<li>
								<a href="#">
									<img src="img/demo/flags/br.gif" alt="">
									<span>Brasil</span>
								</a>
							</li>
							<li>
								<a href="#">
									<img src="img/demo/flags/de.gif" alt="">
									<span>Deutschland</span>
								</a>
							</li>
							<li>
								<a href="#">
									<img src="img/demo/flags/es.gif" alt="">
									<span>España</span>
								</a>
							</li>
							<li>
								<a href="#">
									<img src="img/demo/flags/fr.gif" alt="">
									<span>France</span>
								</a>
							</li>
						</ul>
					</li>
				</ul>
				<div class="dropdown">
					<a href="#" class='dropdown-toggle' data-toggle="dropdown">John Doe
						<img src="img/demo/user-avatar.jpg" alt="">
					</a>
					<ul class="dropdown-menu pull-right">
						<li>
							<a href="more-userprofile.html">Edit profile</a>
						</li>
						<li>
							<a href="#">Account settings</a>
						</li>
						<li>
							<a href="more-login.html">Sign out</a>
						</li>
					</ul>
				</div>
			</div>
		</div>
	</div>
	<div class="container-fluid" id="content">
		<div id="left">
			<form action="http://www.eakroko.de/flat/search-results.html" method="GET" class='search-form'>
				<div class="search-pane">
					<input type="text" name="search" placeholder="Search here...">
					<button type="submit">
						<i class="fa fa-search"></i>
					</button>
				</div>
			</form>
			<div class="subnav">
				<div class="subnav-title">
					<a href="#" class='toggle-subnav'>
						<i class="fa fa-angle-down"></i>
						<span>Content</span>
					</a>
				</div>
				<ul class="subnav-menu">
					<li class='dropdown'>
						<a href="#" data-toggle="dropdown">Articles</a>
						<ul class="dropdown-menu">
							<li>
								<a href="#">Action #1</a>
							</li>
							<li>
								<a href="#">Antoher Link</a>
							</li>
							<li class='dropdown-submenu'>
								<a href="#" data-toggle="dropdown" class='dropdown-toggle'>Go to level 3</a>
								<ul class="dropdown-menu">
									<li>
										<a href="#">This is level 3</a>
									</li>
									<li>
										<a href="#">Unlimited levels</a>
									</li>
									<li>
										<a href="#">Easy to use</a>
									</li>
								</ul>
							</li>
						</ul>
					</li>
					<li>
						<a href="#">News</a>
					</li>
					<li>
						<a href="#">Pages</a>
					</li>
					<li>
						<a href="#">Comments</a>
					</li>
				</ul>
			</div>
			<div class="subnav">
				<div class="subnav-title">
					<a href="#" class='toggle-subnav'>
						<i class="fa fa-angle-down"></i>
						<span>Plugins</span>
					</a>
				</div>
				<ul class="subnav-menu">
					<li>
						<a href="#">Cache manager</a>
					</li>
					<li class='dropdown'>
						<a href="#" data-toggle="dropdown">Import manager</a>
						<ul class="dropdown-menu">
							<li>
								<a href="#">Action #1</a>
							</li>
							<li>
								<a href="#">Antoher Link</a>
							</li>
							<li class='dropdown-submenu'>
								<a href="#" data-toggle="dropdown" class='dropdown-toggle'>Go to level 3</a>
								<ul class="dropdown-menu">
									<li>
										<a href="#">This is level 3</a>
									</li>
									<li>
										<a href="#">Unlimited levels</a>
									</li>
									<li>
										<a href="#">Easy to use</a>
									</li>
								</ul>
							</li>
						</ul>
					</li>
					<li>
						<a href="#">Contact form generator</a>
					</li>
					<li>
						<a href="#">SEO optimization</a>
					</li>
				</ul>
			</div>
			<div class="subnav">
				<div class="subnav-title">
					<a href="#" class='toggle-subnav'>
						<i class="fa fa-angle-down"></i>
						<span>Settings</span>
					</a>
				</div>
				<ul class="subnav-menu">
					<li>
						<a href="#">Theme settings</a>
					</li>
					<li class='dropdown'>
						<a href="#" data-toggle="dropdown">Page settings</a>
						<ul class="dropdown-menu">
							<li>
								<a href="#">Action #1</a>
							</li>
							<li>
								<a href="#">Antoher Link</a>
							</li>
							<li class='dropdown-submenu'>
								<a href="#" data-toggle="dropdown" class='dropdown-toggle'>Go to level 3</a>
								<ul class="dropdown-menu">
									<li>
										<a href="#">This is level 3</a>
									</li>
									<li>
										<a href="#">Unlimited levels</a>
									</li>
									<li>
										<a href="#">Easy to use</a>
									</li>
								</ul>
							</li>
						</ul>
					</li>
					<li>
						<a href="#">Security settings</a>
					</li>
				</ul>
			</div>
			<div class="subnav subnav-hidden">
				<div class="subnav-title">
					<a href="#" class='toggle-subnav'>
						<i class="fa fa-angle-right"></i>
						<span>Default hidden</span>
					</a>
				</div>
				<ul class="subnav-menu">
					<li>
						<a href="#">Menu</a>
					</li>
					<li class='dropdown'>
						<a href="#" data-toggle="dropdown">With submenu</a>
						<ul class="dropdown-menu">
							<li>
								<a href="#">Action #1</a>
							</li>
							<li>
								<a href="#">Antoher Link</a>
							</li>
							<li class='dropdown-submenu'>
								<a href="#" data-toggle="dropdown" class='dropdown-toggle'>More stuff</a>
								<ul class="dropdown-menu">
									<li>
										<a href="#">This is level 3</a>
									</li>
									<li>
										<a href="#">Easy to use</a>
									</li>
								</ul>
							</li>
						</ul>
					</li>
					<li>
						<a href="#">Security settings</a>
					</li>
				</ul>
			</div>
		</div>
		<div id="main">
			<div class="container-fluid">
				<div class="page-header">
					<div class="pull-left">
						<h1>Icons &amp; buttons</h1>
					</div>
					<div class="pull-right">
						<ul class="minitiles">
							<li class='grey'>
								<a href="#">
									<i class="fa fa-cogs"></i>
								</a>
							</li>
							<li class='lightgrey'>
								<a href="#">
									<i class="fa fa-globe"></i>
								</a>
							</li>
						</ul>
						<ul class="stats">
							<li class='satgreen'>
								<i class="fa fa-money"></i>
								<div class="details">
									<span class="big">$324,12</span>
									<span>Balance</span>
								</div>
							</li>
							<li class='lightred'>
								<i class="fa fa-calendar"></i>
								<div class="details">
									<span class="big">February 22, 2013</span>
									<span>Wednesday, 13:56</span>
								</div>
							</li>
						</ul>
					</div>
				</div>
				<div class="breadcrumbs">
					<ul>
						<li>
							<a href="more-login.html">Home</a>
							<i class="fa fa-angle-right"></i>
						</li>
						<li>
							<a href="components-messages.html">Components</a>
							<i class="fa fa-angle-right"></i>
						</li>
						<li>
							<a href="components-icons.html">Icons &amp; buttons</a>
						</li>
					</ul>
					<div class="close-bread">
						<a href="#">
							<i class="fa fa-times"></i>
						</a>
					</div>
				</div>
				<div class="row">
					<div class="col-sm-12">
						<div class="box box-color box-bordered">
							<div class="box-title">
								<h3>
									<i class="fa fa-th-large"></i>
									Basic Buttons
								</h3>
							</div>
							<div class="box-content">
								<div class="col-sm-3">
									<h6>Basic buttons</h6>
									<p>
										<button class="btn">Button</button>
										<button class="btn btn-primary">Primary</button>
									</p>
									<p>
										<button class="btn btn-info">Info</button>
										<button class="btn btn-warning">Warning</button>
										<button class="btn btn-danger">Danger</button>
									</p>
									<p>
										<button class="btn btn-inverse">Inverse</button>
										<button class="btn btn-success">Success</button>
									</p>
								</div>
								<div class="col-sm-3">
									<h6>Button sizes</h6>
									<p>
										<button class="btn btn-large">Large</button>
										<button class="btn">Default</button>
									</p>
									<p>
										<button class="btn btn-small">Small</button>
										<button class="btn btn-mini">Mini</button>
									</p>
									<p>
										<button class="btn-block btn btn-large">Block level</button>
									</p>
								</div>
								<div class="col-sm-3">
									<h6>Button dropdowns</h6>
									<p>
										<div class="btn-group">
											<a href="#" data-toggle="dropdown" class="btn dropdown-toggle">Action
												<span class="caret"></span>
											</a>
											<ul class="dropdown-menu">
												<li>
													<a href="#">Action 1</a>
												</li>
												<li class="divider"></li>
												<li>
													<a href="#">Action 2</a>
												</li>
												<li>
													<a href="#">Action 3</a>
												</li>
											</ul>
										</div>
									</p>
									<p>
										<div class="btn-group">
											<a href="#" class="btn">Default Action</a>
											<a href="#" data-toggle="dropdown" class="btn dropdown-toggle">
												<span class="caret"></span>
											</a>
											<ul class="dropdown-menu">
												<li>
													<a href="#">Action 1</a>
												</li>
												<li>
													<a href="#">Action 2</a>
												</li>
												<li>
													<a href="#">Action 3</a>
												</li>
											</ul>
										</div>
									</p>
									<div class="btn-group dropup">
										<a href="#" class="btn">Dropup</a>
										<a href="#" data-toggle="dropdown" class="btn dropdown-toggle">
											<span class="caret"></span>
										</a>
										<ul class="dropdown-menu">
											<li>
												<a href="#">Action 1</a>
											</li>
											<li>
												<a href="#">Action 2</a>
											</li>
											<li>
												<a href="#">Action 3</a>
											</li>
										</ul>
									</div>
								</div>
								<div class="col-sm-3">
									<h6>Button toolbars</h6>
									<p>
										<div class="btn-toolbar">
											<div class="btn-group">
												<button class="btn">1</button>
												<button class="btn">2</button>
												<button class="btn">3</button>
											</div>
											<div class="btn-group">
												<button class="btn">4</button>
												<button class="btn">5</button>
											</div>
											<div class="btn-group">
												<button class="btn">8</button>
											</div>
										</div>
									</p>
									<p>
										<div class="btn-toolbar">
											<div class="btn-group">
												<button class="btn">Prev</button>
												<button class="btn">Next</button>
											</div>
											<div class="btn-group">
												<button class="btn">Left</button>
												<button class="btn">Right</button>
											</div>
										</div>
									</p>
								</div>
							</div>
						</div>
					</div>
				</div>
				<div class="row">
					<div class="col-sm-12">
						<div class="box box-color box-bordered lightred">
							<div class="box-title">
								<h3>
									<i class="fa fa-tint"></i>
									Button template colors
								</h3>
							</div>
							<div class="box-content">
								<div class='basic-margin'>
									<a href="#" class='btn btn-red'>Color</a>
									<a href="#" class='btn btn-orange'>Color</a>
									<a href="#" class='btn btn-green'>Color</a>
									<a href="#" class="btn btn-brown">Color</a>
									<a href="#" class="btn btn-blue">Color</a>
									<a href="#" class='btn btn-lime'>Color</a>
									<a href="#" class="btn btn-teal">Color</a>
									<a href="#" class="btn btn-purple">Color</a>
									<a href="#" class="btn btn-pink">Color</a>
									<a href="#" class="btn btn-magenta">Color</a>
									<a href="#" class="btn btn-grey">Color</a>
									<a href="#" class="btn btn-darkblue">Color</a>
									<a href="#" class="btn btn-lightred">Color</a>
									<a href="#" class="btn btn-lightgrey">Color</a>
									<a href="#" class="btn btn-satblue">Color</a>
									<a href="#" class="btn btn-satgreen">Color</a>
								</div>
							</div>
						</div>
					</div>
				</div>
				<div class="row">
					<div class="col-sm-12">
						<div class="box box-color box-bordered green">
							<div class="box-title">
								<h3>
									<i class="fa fa-th"></i>
									Icon buttons
								</h3>
							</div>
							<div class="box-content">
								<div class="col-sm-3">
									<h6>Only icon</h6>
									<p>
										<button class="btn">
											<i class="fa fa-bell"></i>
										</button>
										<button class="btn btn-primary">
											<i class="fa fa-envelope"></i>
										</button>
									</p>
									<p>
										<button class="btn btn-info">
											<i class="fa fa-exclamation-triangle"></i>
										</button>
										<button class="btn btn-warning">
											<i class="fa fa-hdd-o"></i>
										</button>
										<button class="btn btn-danger">
											<i class="fa fa-clock-o"></i>
										</button>
									</p>
									<p>
										<button class="btn btn-inverse">
											<i class="fa fa-truck"></i>
										</button>
										<button class="btn btn-success">
											<i class="fa fa-cloud"></i>
										</button>
									</p>
								</div>
								<div class="col-sm-3">
									<h6>Icon with text</h6>
									<p>
										<button class="btn btn--icon">
											<i class="fa fa-user "></i>My profile</button>
										<button class="btn btn-primary btn--icon">
											<i class="fa fa-cog"></i>Settings</button>
									</p>
									<p>
										<button class="btn btn-small btn-inverse btn--icon">
											<i class="fa fa-trash-o"></i>Delete small</button>
										<button class="btn btn-mini btn-warning btn--icon">
											<i class="fa fa-edit"></i>Edit mini</button>
									</p>
								</div>
								<div class="col-sm-3">
									<h6>Icon dropdown</h6>
									<p>
										<div class="btn-group">
											<a href="#" data-toggle="dropdown" class="btn dropdown-toggle">
												<i class="fa fa-cog"></i>
												<span class="caret"></span>
											</a>
											<ul class="dropdown-menu">
												<li>
													<a href="#">Action 1</a>
												</li>
												<li>
													<a href="#">Action 2</a>
												</li>
												<li>
													<a href="#">Action 3</a>
												</li>
											</ul>
										</div>
									</p>
									<p>
										<div class="btn-group">
											<a href="#" data-toggle="dropdown" class="btn btn-danger dropdown-toggle">
												<i class="fa fa-tint"></i>
												<span class="caret"></span>
											</a>
											<ul class="dropdown-menu dropdown-danger">
												<li>
													<a href="#">Action 1</a>
												</li>
												<li>
													<a href="#">Action 2</a>
												</li>
												<li>
													<a href="#">Action 3</a>
												</li>
											</ul>
										</div>
									</p>
								</div>
								<div class="col-sm-3">
									<h6>Colored dropdowns</h6>
									<p>
										<div class="btn-group">
											<a href="#" data-toggle="dropdown" class="btn dropdown-toggle btn--icon">
												<i class="fa fa-user"></i>Basic
												<span class="caret"></span>
											</a>
											<ul class="dropdown-menu">
												<li>
													<a href="#">Action 1</a>
												</li>
												<li>
													<a href="#">Action 2</a>
												</li>
												<li>
													<a href="#">Action 3</a>
												</li>
											</ul>
										</div>
									</p>
									<p>
										<div class="btn-group">
											<a href="#" data-toggle="dropdown" class="btn btn-primary dropdown-toggle btn--icon">
												<i class="fa fa-cog"></i>Primary
												<span class="caret"></span>
											</a>
											<ul class="dropdown-menu dropdown-primary">
												<li>
													<a href="#">Action 1</a>
												</li>
												<li>
													<a href="#">Action 2</a>
												</li>
												<li>
													<a href="#">Action 3</a>
												</li>
											</ul>
										</div>
									</p>
									<p>
										<div class="btn-group">
											<a href="#" data-toggle="dropdown" class="btn btn-warning dropdown-toggle btn--icon">
												<i class="fa fa-cog"></i>Warning
												<span class="caret"></span>
											</a>
											<ul class="dropdown-menu dropdown-warning">
												<li>
													<a href="#">Action 1</a>
												</li>
												<li>
													<a href="#">Action 2</a>
												</li>
												<li>
													<a href="#">Action 3</a>
												</li>
											</ul>
										</div>
									</p>
									<p>
										<div class="btn-group">
											<a href="#" data-toggle="dropdown" class="btn btn-danger dropdown-toggle btn--icon">
												<i class="fa fa-cog"></i>Danger
												<span class="caret"></span>
											</a>
											<ul class="dropdown-menu dropdown-danger">
												<li>
													<a href="#">Action 1</a>
												</li>
												<li>
													<a href="#">Action 2</a>
												</li>
												<li>
													<a href="#">Action 3</a>
												</li>
											</ul>
										</div>
									</p>
									<p>
										<div class="btn-group">
											<a href="#" data-toggle="dropdown" class="btn btn-inverse dropdown-toggle btn--icon">
												<i class="fa fa-cog"></i>Inverse
												<span class="caret"></span>
											</a>
											<ul class="dropdown-menu dropdown-inverse">
												<li>
													<a href="#">Action 1</a>
												</li>
												<li>
													<a href="#">Action 2</a>
												</li>
												<li>
													<a href="#">Action 3</a>
												</li>
											</ul>
										</div>
									</p>
									<p>
										<div class="btn-group">
											<a href="#" data-toggle="dropdown" class="btn btn-success dropdown-toggle btn--icon">
												<i class="fa fa-cog"></i>Success
												<span class="caret"></span>
											</a>
											<ul class="dropdown-menu dropdown-success">
												<li>
													<a href="#">Action 1</a>
												</li>
												<li>
													<a href="#">Action 2</a>
												</li>
												<li>
													<a href="#">Action 3</a>
												</li>
											</ul>
										</div>
									</p>
								</div>
							</div>
						</div>
					</div>
				</div>
				<div class="row">
					<div class="col-sm-12">
						<div class="box">
							<div class="box-title">
								<h3>
									<i class="fa fa-th"></i>
									FontAwesome icons
								</h3>
							</div>
							<div class="box-content">
								Since FontAwesome has so many awesome updates find the always updated icon list on the official FontAwesome page
								<a href="http://fontawesome.io/icons/">http://fontawesome.io/icons/</a>
							</div>
						</div>
					</div>
					<!-- /.col-sm-12 -->
				</div>
				<div class="row">
					<div class="col-sm-12">
						<div class="box">
							<div class="box-title">
								<h3>
									<i class="fa fa-th"></i>Glyphicons PRO (420 icons)
								</h3>
							</div>
							<div class="box-content">
								<div class="col-sm-3">
									<ul class="the-icons">
										<li>
											<i class="glyphicon-glass"></i>glass</li>
										<li>
											<i class="glyphicon-leaf"></i>leaf</li>
										<li>
											<i class="glyphicon-dog"></i>dog</li>
										<li>
											<i class="glyphicon-user"></i>user</li>
										<li>
											<i class="glyphicon-girl"></i>girl</li>
										<li>
											<i class="glyphicon-car"></i>car</li>
										<li>
											<i class="glyphicon-user_add"></i>user_add</li>
										<li>
											<i class="glyphicon-user_remove"></i>user_remove</li>
										<li>
											<i class="glyphicon-film"></i>film</li>
										<li>
											<i class="glyphicon-magic"></i>magic</li>
										<li>
											<i class="glyphicon-envelope"></i>envelope</li>
										<li>
											<i class="glyphicon-camera"></i>camera</li>
										<li>
											<i class="glyphicon-heart"></i>heart</li>
										<li>
											<i class="glyphicon-beach_umbrella"></i>beach_umbrella</li>
										<li>
											<i class="glyphicon-train"></i>train</li>
										<li>
											<i class="glyphicon-print"></i>print</li>
										<li>
											<i class="glyphicon-bin"></i>bin</li>
										<li>
											<i class="glyphicon-music"></i>music</li>
										<li>
											<i class="glyphicon-note"></i>note</li>
										<li>
											<i class="glyphicon-heart_empty"></i>heart_empty</li>
										<li>
											<i class="glyphicon-home"></i>home</li>
										<li>
											<i class="glyphicon-snowflake"></i>snowflake</li>
										<li>
											<i class="glyphicon-fire"></i>fire</li>
										<li>
											<i class="glyphicon-magnet"></i>magnet</li>
										<li>
											<i class="glyphicon-parents"></i>parents</li>
										<li>
											<i class="glyphicon-binoculars"></i>binoculars</li>
										<li>
											<i class="glyphicon-road"></i>road</li>
										<li>
											<i class="glyphicon-search"></i>search</li>
										<li>
											<i class="glyphicon-cars"></i>cars</li>
										<li>
											<i class="glyphicon-notes_2"></i>notes_2</li>
										<li>
											<i class="glyphicon-pencil"></i>pencil</li>
										<li>
											<i class="glyphicon-bus"></i>bus</li>
										<li>
											<i class="glyphicon-wifi_alt"></i>wifi_alt</li>
										<li>
											<i class="glyphicon-luggage"></i>luggage</li>
										<li>
											<i class="glyphicon-old_man"></i>old_man</li>
										<li>
											<i class="glyphicon-woman"></i>woman</li>
										<li>
											<i class="glyphicon-file"></i>file</li>
										<li>
											<i class="glyphicon-coins"></i>coins</li>
										<li>
											<i class="glyphicon-airplane"></i>airplane</li>
										<li>
											<i class="glyphicon-notes"></i>notes</li>
										<li>
											<i class="glyphicon-stats"></i>stats</li>
										<li>
											<i class="glyphicon-charts"></i>charts</li>
										<li>
											<i class="glyphicon-pie_chart"></i>pie_chart</li>
										<li>
											<i class="glyphicon-group"></i>group</li>
										<li>
											<i class="glyphicon-keys"></i>keys</li>
										<li>
											<i class="glyphicon-calendar"></i>calendar</li>
										<li>
											<i class="glyphicon-router"></i>router</li>
										<li>
											<i class="glyphicon-camera_small"></i>camera_small</li>
										<li>
											<i class="glyphicon-dislikes"></i>dislikes</li>
										<li>
											<i class="glyphicon-star"></i>star</li>
										<li>
											<i class="glyphicon-link"></i>link</li>
										<li>
											<i class="glyphicon-eye_open"></i>eye_open</li>
										<li>
											<i class="glyphicon-eye_close"></i>eye_close</li>
										<li>
											<i class="glyphicon-alarm"></i>alarm</li>
										<li>
											<i class="glyphicon-clock"></i>clock</li>
										<li>
											<i class="glyphicon-stopwatch"></i>stopwatch</li>
										<li>
											<i class="glyphicon-projector"></i>projector</li>
										<li>
											<i class="glyphicon-history"></i>history</li>
										<li>
											<i class="glyphicon-truck"></i>truck</li>
										<li>
											<i class="glyphicon-cargo"></i>cargo</li>
										<li>
											<i class="glyphicon-compass"></i>compass</li>
										<li>
											<i class="glyphicon-keynote"></i>keynote</li>
										<li>
											<i class="glyphicon-paperclip"></i>paperclip</li>
										<li>
											<i class="glyphicon-power"></i>power</li>
										<li>
											<i class="glyphicon-lightbulb"></i>lightbulb</li>
										<li>
											<i class="glyphicon-tag"></i>tag</li>
										<li>
											<i class="glyphicon-tags"></i>tags</li>
										<li>
											<i class="glyphicon-cleaning"></i>cleaning</li>
										<li>
											<i class="glyphicon-ruller"></i>ruller</li>
										<li>
											<i class="glyphicon-gift"></i>gift</li>
										<li>
											<i class="glyphicon-umbrella"></i>umbrella</li>
										<li>
											<i class="glyphicon-book"></i>book</li>
										<li>
											<i class="glyphicon-bookmark"></i>bookmark</li>
										<li>
											<i class="glyphicon-wifi"></i>wifi</li>
										<li>
											<i class="glyphicon-cup"></i>cup</li>
										<li>
											<i class="glyphicon-stroller"></i>stroller</li>
										<li>
											<i class="glyphicon-headphones"></i>headphones</li>
										<li>
											<i class="glyphicon-headset"></i>headset</li>
										<li>
											<i class="glyphicon-warning_sign"></i>warning_sign</li>
										<li>
											<i class="glyphicon-signal"></i>signal</li>
										<li>
											<i class="glyphicon-retweet"></i>retweet</li>
										<li>
											<i class="glyphicon-refresh"></i>refresh</li>
										<li>
											<i class="glyphicon-roundabout"></i>roundabout</li>
										<li>
											<i class="glyphicon-random"></i>random</li>
										<li>
											<i class="glyphicon-heat"></i>heat</li>
										<li>
											<i class="glyphicon-repeat"></i>repeat</li>
										<li>
											<i class="glyphicon-display"></i>display</li>
										<li>
											<i class="glyphicon-log_book"></i>log_book</li>
										<li>
											<i class="glyphicon-adress_book"></i>adress_book</li>
										<li>
											<i class="glyphicon-building"></i>building</li>
										<li>
											<i class="glyphicon-eyedropper"></i>eyedropper</li>
										<li>
											<i class="glyphicon-adjust"></i>adjust</li>
										<li>
											<i class="glyphicon-tint"></i>tint</li>
										<li>
											<i class="glyphicon-crop"></i>crop</li>
										<li>
											<i class="glyphicon-vector_path_square"></i>vector_path_square</li>
										<li>
											<i class="glyphicon-vector_path_circle"></i>vector_path_circle</li>
										<li>
											<i class="glyphicon-vector_path_polygon"></i>vector_path_polygon</li>
										<li>
											<i class="glyphicon-vector_path_line"></i>vector_path_line</li>
										<li>
											<i class="glyphicon-vector_path_curve"></i>vector_path_curve</li>
										<li>
											<i class="glyphicon-vector_path_all"></i>vector_path_all</li>
										<li>
											<i class="glyphicon-font"></i>font</li>
										<li>
											<i class="glyphicon-italic"></i>italic</li>
										<li>
											<i class="glyphicon-bold"></i>bold</li>
										<li>
											<i class="glyphicon-text_underline"></i>text_underline</li>
										<li>
											<i class="glyphicon-text_strike"></i>text_strike</li>
									</ul>
								</div>
								<div class="col-sm-3">
									<ul class="the-icons">
										<li>
											<i class="glyphicon-text_height"></i>text_height</li>
										<li>
											<i class="glyphicon-text_width"></i>text_width</li>
										<li>
											<i class="glyphicon-text_resize"></i>text_resize</li>
										<li>
											<i class="glyphicon-left_indent"></i>left_indent</li>
										<li>
											<i class="glyphicon-right_indent"></i>right_indent</li>
										<li>
											<i class="glyphicon-align_left"></i>align_left</li>
										<li>
											<i class="glyphicon-align_center"></i>align_center</li>
										<li>
											<i class="glyphicon-align_right"></i>align_right</li>
										<li>
											<i class="glyphicon-justify"></i>justify</li>
										<li>
											<i class="glyphicon-list"></i>list</li>
										<li>
											<i class="glyphicon-text_smaller"></i>text_smaller</li>
										<li>
											<i class="glyphicon-text_bigger"></i>text_bigger</li>
										<li>
											<i class="glyphicon-embed"></i>embed</li>
										<li>
											<i class="glyphicon-embed_close"></i>embed_close</li>
										<li>
											<i class="glyphicon-table"></i>table</li>
										<li>
											<i class="glyphicon-message_full"></i>message_full</li>
										<li>
											<i class="glyphicon-message_empty"></i>message_empty</li>
										<li>
											<i class="glyphicon-message_in"></i>message_in</li>
										<li>
											<i class="glyphicon-message_out"></i>message_out</li>
										<li>
											<i class="glyphicon-message_plus"></i>message_plus</li>
										<li>
											<i class="glyphicon-message_minus"></i>message_minus</li>
										<li>
											<i class="glyphicon-message_ban"></i>message_ban</li>
										<li>
											<i class="glyphicon-message_flag"></i>message_flag</li>
										<li>
											<i class="glyphicon-message_lock"></i>message_lock</li>
										<li>
											<i class="glyphicon-message_new"></i>message_new</li>
										<li>
											<i class="glyphicon-inbox"></i>inbox</li>
										<li>
											<i class="glyphicon-inbox_plus"></i>inbox_plus</li>
										<li>
											<i class="glyphicon-inbox_minus"></i>inbox_minus</li>
										<li>
											<i class="glyphicon-inbox_lock"></i>inbox_lock</li>
										<li>
											<i class="glyphicon-inbox_in"></i>inbox_in</li>
										<li>
											<i class="glyphicon-inbox_out"></i>inbox_out</li>
										<li>
											<i class="glyphicon-cogwheel"></i>cogwheel</li>
										<li>
											<i class="glyphicon-cogwheels"></i>cogwheels</li>
										<li>
											<i class="glyphicon-picture"></i>picture</li>
										<li>
											<i class="glyphicon-adjust_alt"></i>adjust_alt</li>
										<li>
											<i class="glyphicon-database_lock"></i>database_lock</li>
										<li>
											<i class="glyphicon-database_plus"></i>database_plus</li>
										<li>
											<i class="glyphicon-database_minus"></i>database_minus</li>
										<li>
											<i class="glyphicon-database_ban"></i>database_ban</li>
										<li>
											<i class="glyphicon-folder_open"></i>folder_open</li>
										<li>
											<i class="glyphicon-folder_plus"></i>folder_plus</li>
										<li>
											<i class="glyphicon-folder_minus"></i>folder_minus</li>
										<li>
											<i class="glyphicon-folder_lock"></i>folder_lock</li>
										<li>
											<i class="glyphicon-folder_flag"></i>folder_flag</li>
										<li>
											<i class="glyphicon-folder_new"></i>folder_new</li>
										<li>
											<i class="glyphicon-edit"></i>edit</li>
										<li>
											<i class="glyphicon-new_window"></i>new_window</li>
										<li>
											<i class="glyphicon-check"></i>check</li>
										<li>
											<i class="glyphicon-unchecked"></i>unchecked</li>
										<li>
											<i class="glyphicon-more_windows"></i>more_windows</li>
										<li>
											<i class="glyphicon-show_big_thumbnails"></i>show_big_thumbnails</li>
										<li>
											<i class="glyphicon-show_thumbnails"></i>show_thumbnails</li>
										<li>
											<i class="glyphicon-show_thumbnails_with_lines"></i>show_thumbnails_with_lines</li>
										<li>
											<i class="glyphicon-show_lines"></i>show_lines</li>
										<li>
											<i class="glyphicon-playlist"></i>playlist</li>
										<li>
											<i class="glyphicon-imac"></i>imac</li>
										<li>
											<i class="glyphicon-macbook"></i>macbook</li>
										<li>
											<i class="glyphicon-ipad"></i>ipad</li>
										<li>
											<i class="glyphicon-iphone"></i>iphone</li>
										<li>
											<i class="glyphicon-iphone_transfer"></i>iphone_transfer</li>
										<li>
											<i class="glyphicon-iphone_exchange"></i>iphone_exchange</li>
										<li>
											<i class="glyphicon-ipod"></i>ipod</li>
										<li>
											<i class="glyphicon-ipod_shuffle"></i>ipod_shuffle</li>
										<li>
											<i class="glyphicon-ear_plugs"></i>ear_plugs</li>
										<li>
											<i class="glyphicon-phone"></i>phone</li>
										<li>
											<i class="glyphicon-step_backward"></i>step_backward</li>
										<li>
											<i class="glyphicon-fast_backward"></i>fast_backward</li>
										<li>
											<i class="glyphicon-rewind"></i>rewind</li>
										<li>
											<i class="glyphicon-play"></i>play</li>
										<li>
											<i class="glyphicon-pause"></i>pause</li>
										<li>
											<i class="glyphicon-stop"></i>stop</li>
										<li>
											<i class="glyphicon-forward"></i>forward</li>
										<li>
											<i class="glyphicon-fast_forward"></i>fast_forward</li>
										<li>
											<i class="glyphicon-step_forward"></i>step_forward</li>
										<li>
											<i class="glyphicon-eject"></i>eject</li>
										<li>
											<i class="glyphicon-facetime_video"></i>facetime_video</li>
										<li>
											<i class="glyphicon-download_alt"></i>download_alt</li>
										<li>
											<i class="glyphicon-mute"></i>mute</li>
										<li>
											<i class="glyphicon-volume_down"></i>volume_down</li>
										<li>
											<i class="glyphicon-volume_up"></i>volume_up</li>
										<li>
											<i class="glyphicon-screenshot"></i>screenshot</li>
										<li>
											<i class="glyphicon-move"></i>move</li>
										<li>
											<i class="glyphicon-more"></i>more</li>
										<li>
											<i class="glyphicon-brightness_reduce"></i>brightness_reduce</li>
										<li>
											<i class="glyphicon-brightness_increase"></i>brightness_increase</li>
										<li>
											<i class="glyphicon-circle_plus"></i>circle_plus</li>
										<li>
											<i class="glyphicon-circle_minus"></i>circle_minus</li>
										<li>
											<i class="glyphicon-circle_remove"></i>circle_remove</li>
										<li>
											<i class="glyphicon-circle_ok"></i>circle_ok</li>
										<li>
											<i class="glyphicon-circle_question_mark"></i>circle_question_mark</li>
										<li>
											<i class="glyphicon-circle_info"></i>circle_info</li>
										<li>
											<i class="glyphicon-circle_exclamation_mark"></i>circle_exclamation_mark</li>
										<li>
											<i class="glyphicon-remove"></i>remove</li>
										<li>
											<i class="glyphicon-ok"></i>ok</li>
										<li>
											<i class="glyphicon-ban"></i>ban</li>
										<li>
											<i class="glyphicon-download"></i>download</li>
										<li>
											<i class="glyphicon-upload"></i>upload</li>
										<li>
											<i class="glyphicon-shopping_cart"></i>shopping_cart</li>
										<li>
											<i class="glyphicon-lock"></i>lock</li>
										<li>
											<i class="glyphicon-unlock"></i>unlock</li>
										<li>
											<i class="glyphicon-electricity"></i>electricity</li>
										<li>
											<i class="glyphicon-ok_2"></i>ok_2</li>
										<li>
											<i class="glyphicon-remove_2"></i>remove_2</li>
										<li>
											<i class="glyphicon-cart_out"></i>cart_out</li>
										<li>
											<i class="glyphicon-cart_in"></i>cart_in</li>
									</ul>
								</div>
								<div class="col-sm-3">
									<ul class="the-icons">
										<li>
											<i class="glyphicon-left_arrow"></i>left_arrow</li>
										<li>
											<i class="glyphicon-right_arrow"></i>right_arrow</li>
										<li>
											<i class="glyphicon-down_arrow"></i>down_arrow</li>
										<li>
											<i class="glyphicon-up_arrow"></i>up_arrow</li>
										<li>
											<i class="glyphicon-resize_small"></i>resize_small</li>
										<li>
											<i class="glyphicon-resize_full"></i>resize_full</li>
										<li>
											<i class="glyphicon-circle_arrow_left"></i>circle_arrow_left</li>
										<li>
											<i class="glyphicon-circle_arrow_right"></i>circle_arrow_right</li>
										<li>
											<i class="glyphicon-circle_arrow_top"></i>circle_arrow_top</li>
										<li>
											<i class="glyphicon-circle_arrow_down"></i>circle_arrow_down</li>
										<li>
											<i class="glyphicon-play_button"></i>play_button</li>
										<li>
											<i class="glyphicon-unshare"></i>unshare</li>
										<li>
											<i class="glyphicon-share"></i>share</li>
										<li>
											<i class="glyphicon-chevron-right"></i>chevron-right</li>
										<li>
											<i class="glyphicon-chevron-left"></i>chevron-left</li>
										<li>
											<i class="glyphicon-bluetooth"></i>bluetooth</li>
										<li>
											<i class="glyphicon-euro"></i>euro</li>
										<li>
											<i class="glyphicon-usd"></i>usd</li>
										<li>
											<i class="glyphicon-gbp"></i>gbp</li>
										<li>
											<i class="glyphicon-retweet_2"></i>retweet_2</li>
										<li>
											<i class="glyphicon-moon"></i>moon</li>
										<li>
											<i class="glyphicon-sun"></i>sun</li>
										<li>
											<i class="glyphicon-cloud"></i>cloud</li>
										<li>
											<i class="glyphicon-direction"></i>direction</li>
										<li>
											<i class="glyphicon-brush"></i>brush</li>
										<li>
											<i class="glyphicon-pen"></i>pen</li>
										<li>
											<i class="glyphicon-zoom_in"></i>zoom_in</li>
										<li>
											<i class="glyphicon-zoom_out"></i>zoom_out</li>
										<li>
											<i class="glyphicon-pin"></i>pin</li>
										<li>
											<i class="glyphicon-albums"></i>albums</li>
										<li>
											<i class="glyphicon-rotation_lock"></i>rotation_lock</li>
										<li>
											<i class="glyphicon-flash"></i>flash</li>
										<li>
											<i class="glyphicon-google_maps"></i>google_maps</li>
										<li>
											<i class="glyphicon-anchor"></i>anchor</li>
										<li>
											<i class="glyphicon-conversation"></i>conversation</li>
										<li>
											<i class="glyphicon-chat"></i>chat</li>
										<li>
											<i class="glyphicon-male"></i>male</li>
										<li>
											<i class="glyphicon-female"></i>female</li>
										<li>
											<i class="glyphicon-asterisk"></i>asterisk</li>
										<li>
											<i class="glyphicon-divide"></i>divide</li>
										<li>
											<i class="glyphicon-snorkel_diving"></i>snorkel_diving</li>
										<li>
											<i class="glyphicon-scuba_diving"></i>scuba_diving</li>
										<li>
											<i class="glyphicon-oxygen_bottle"></i>oxygen_bottle</li>
										<li>
											<i class="glyphicon-fins"></i>fins</li>
										<li>
											<i class="glyphicon-fishes"></i>fishes</li>
										<li>
											<i class="glyphicon-boat"></i>boat</li>
										<li>
											<i class="glyphicon-delete"></i>delete</li>
										<li>
											<i class="glyphicon-sheriffs_star"></i>sheriffs_star</li>
										<li>
											<i class="glyphicon-qrcode"></i>qrcode</li>
										<li>
											<i class="glyphicon-barcode"></i>barcode</li>
										<li>
											<i class="glyphicon-pool"></i>pool</li>
										<li>
											<i class="glyphicon-buoy"></i>buoy</li>
										<li>
											<i class="glyphicon-spade"></i>spade</li>
										<li>
											<i class="glyphicon-bank"></i>bank</li>
										<li>
											<i class="glyphicon-vcard"></i>vcard</li>
										<li>
											<i class="glyphicon-electrical_plug"></i>electrical_plug</li>
										<li>
											<i class="glyphicon-flag"></i>flag</li>
										<li>
											<i class="glyphicon-credit_card"></i>credit_card</li>
										<li>
											<i class="glyphicon-keyboard-wireless"></i>keyboard-wireless</li>
										<li>
											<i class="glyphicon-keyboard-wired"></i>keyboard-wired</li>
										<li>
											<i class="glyphicon-shield"></i>shield</li>
										<li>
											<i class="glyphicon-ring"></i>ring</li>
										<li>
											<i class="glyphicon-cake"></i>cake</li>
										<li>
											<i class="glyphicon-drink"></i>drink</li>
										<li>
											<i class="glyphicon-beer"></i>beer</li>
										<li>
											<i class="glyphicon-fast_food"></i>fast_food</li>
										<li>
											<i class="glyphicon-cutlery"></i>cutlery</li>
										<li>
											<i class="glyphicon-pizza"></i>pizza</li>
										<li>
											<i class="glyphicon-birthday_cake"></i>birthday_cake</li>
										<li>
											<i class="glyphicon-tablet"></i>tablet</li>
										<li>
											<i class="glyphicon-settings"></i>settings</li>
										<li>
											<i class="glyphicon-bullets"></i>bullets</li>
										<li>
											<i class="glyphicon-cardio"></i>cardio</li>
										<li>
											<i class="glyphicon-t-shirt"></i>t-shirt</li>
										<li>
											<i class="glyphicon-pants"></i>pants</li>
										<li>
											<i class="glyphicon-sweater"></i>sweater</li>
										<li>
											<i class="glyphicon-fabric"></i>fabric</li>
										<li>
											<i class="glyphicon-leather"></i>leather</li>
										<li>
											<i class="glyphicon-scissors"></i>scissors</li>
										<li>
											<i class="glyphicon-bomb"></i>bomb</li>
										<li>
											<i class="glyphicon-skull"></i>skull</li>
										<li>
											<i class="glyphicon-celebration"></i>celebration</li>
										<li>
											<i class="glyphicon-tea_kettle"></i>tea_kettle</li>
										<li>
											<i class="glyphicon-french_press"></i>french_press</li>
										<li>
											<i class="glyphicon-coffe_cup"></i>coffe_cup</li>
										<li>
											<i class="glyphicon-pot"></i>pot</li>
										<li>
											<i class="glyphicon-grater"></i>grater</li>
										<li>
											<i class="glyphicon-kettle"></i>kettle</li>
										<li>
											<i class="glyphicon-hospital"></i>hospital</li>
										<li>
											<i class="glyphicon-hospital_h"></i>hospital_h</li>
										<li>
											<i class="glyphicon-microphone"></i>microphone</li>
										<li>
											<i class="glyphicon-webcam"></i>webcam</li>
										<li>
											<i class="glyphicon-temple_christianity_church"></i>temple_christianity_church</li>
										<li>
											<i class="glyphicon-temple_islam"></i>temple_islam</li>
										<li>
											<i class="glyphicon-temple_hindu"></i>temple_hindu</li>
										<li>
											<i class="glyphicon-temple_buddhist"></i>temple_buddhist</li>
										<li>
											<i class="glyphicon-bicycle"></i>bicycle</li>
										<li>
											<i class="glyphicon-life_preserver"></i>life_preserver</li>
										<li>
											<i class="glyphicon-share_alt"></i>share_alt</li>
										<li>
											<i class="glyphicon-comments"></i>comments</li>
										<li>
											<i class="glyphicon-flower"></i>flower</li>
										<li>
											<i class="glyphicon-baseball"></i>baseball</li>
										<li>
											<i class="glyphicon-rugby"></i>rugby</li>
										<li>
											<i class="glyphicon-ax"></i>ax</li>
										<li>
											<i class="glyphicon-table_tennis"></i>table_tennis</li>
									</ul>
								</div>
								<div class="col-sm-3">
									<ul class="the-icons">
										<li>
											<i class="glyphicon-bowling"></i>bowling</li>
										<li>
											<i class="glyphicon-tree_conifer"></i>tree_conifer</li>
										<li>
											<i class="glyphicon-tree_deciduous"></i>tree_deciduous</li>
										<li>
											<i class="glyphicon-more_items"></i>more_items</li>
										<li>
											<i class="glyphicon-sort"></i>sort</li>
										<li>
											<i class="glyphicon-filter"></i>filter</li>
										<li>
											<i class="glyphicon-gamepad"></i>gamepad</li>
										<li>
											<i class="glyphicon-playing_dices"></i>playing_dices</li>
										<li>
											<i class="glyphicon-calculator"></i>calculator</li>
										<li>
											<i class="glyphicon-tie"></i>tie</li>
										<li>
											<i class="glyphicon-wallet"></i>wallet</li>
										<li>
											<i class="glyphicon-piano"></i>piano</li>
										<li>
											<i class="glyphicon-sampler"></i>sampler</li>
										<li>
											<i class="glyphicon-podium"></i>podium</li>
										<li>
											<i class="glyphicon-soccer_ball"></i>soccer_ball</li>
										<li>
											<i class="glyphicon-blog"></i>blog</li>
										<li>
											<i class="glyphicon-dashboard"></i>dashboard</li>
										<li>
											<i class="glyphicon-certificate"></i>certificate</li>
										<li>
											<i class="glyphicon-bell"></i>bell</li>
										<li>
											<i class="glyphicon-candle"></i>candle</li>
										<li>
											<i class="glyphicon-pushpin"></i>pushpin</li>
										<li>
											<i class="glyphicon-iphone_shake"></i>iphone_shake</li>
										<li>
											<i class="glyphicon-pin_flag"></i>pin_flag</li>
										<li>
											<i class="glyphicon-turtle"></i>turtle</li>
										<li>
											<i class="glyphicon-rabbit"></i>rabbit</li>
										<li>
											<i class="glyphicon-globe"></i>globe</li>
										<li>
											<i class="glyphicon-briefcase"></i>briefcase</li>
										<li>
											<i class="glyphicon-hdd"></i>hdd</li>
										<li>
											<i class="glyphicon-thumbs_up"></i>thumbs_up</li>
										<li>
											<i class="glyphicon-thumbs_down"></i>thumbs_down</li>
										<li>
											<i class="glyphicon-hand_right"></i>hand_right</li>
										<li>
											<i class="glyphicon-hand_left"></i>hand_left</li>
										<li>
											<i class="glyphicon-hand_up"></i>hand_up</li>
										<li>
											<i class="glyphicon-hand_down"></i>hand_down</li>
										<li>
											<i class="glyphicon-fullscreen"></i>fullscreen</li>
										<li>
											<i class="glyphicon-shopping_bag"></i>shopping_bag</li>
										<li>
											<i class="glyphicon-book_open"></i>book_open</li>
										<li>
											<i class="glyphicon-nameplate"></i>nameplate</li>
										<li>
											<i class="glyphicon-nameplate_alt"></i>nameplate_alt</li>
										<li>
											<i class="glyphicon-vases"></i>vases</li>
										<li>
											<i class="glyphicon-bullhorn"></i>bullhorn</li>
										<li>
											<i class="glyphicon-dumbbell"></i>dumbbell</li>
										<li>
											<i class="glyphicon-suitcase"></i>suitcase</li>
										<li>
											<i class="glyphicon-file_import"></i>file_import</li>
										<li>
											<i class="glyphicon-file_export"></i>file_export</li>
										<li>
											<i class="glyphicon-bug"></i>bug</li>
										<li>
											<i class="glyphicon-crown"></i>crown</li>
										<li>
											<i class="glyphicon-smoking"></i>smoking</li>
										<li>
											<i class="glyphicon-cloud-upload"></i>cloud-upload</li>
										<li>
											<i class="glyphicon-cloud-download"></i>cloud-download</li>
										<li>
											<i class="glyphicon-restart"></i>restart</li>
										<li>
											<i class="glyphicon-security_camera"></i>security_camera</li>
										<li>
											<i class="glyphicon-expand"></i>expand</li>
										<li>
											<i class="glyphicon-collapse"></i>collapse</li>
										<li>
											<i class="glyphicon-collapse_top"></i>collapse_top</li>
										<li>
											<i class="glyphicon-globe_af"></i>globe_af</li>
										<li>
											<i class="glyphicon-global"></i>global</li>
										<li>
											<i class="glyphicon-spray"></i>spray</li>
										<li>
											<i class="glyphicon-nails"></i>nails</li>
										<li>
											<i class="glyphicon-claw_hammer"></i>claw_hammer</li>
										<li>
											<i class="glyphicon-classic_hammer"></i>classic_hammer</li>
										<li>
											<i class="glyphicon-hand_saw"></i>hand_saw</li>
										<li>
											<i class="glyphicon-riflescope"></i>riflescope</li>
										<li>
											<i class="glyphicon-electrical_socket_eu"></i>electrical_socket_eu</li>
										<li>
											<i class="glyphicon-electrical_socket_us"></i>electrical_socket_us</li>
										<li>
											<i class="glyphicon-pinterest"></i>pinterest</li>
										<li>
											<i class="glyphicon-dropbox"></i>dropbox</li>
										<li>
											<i class="glyphicon-google_plus"></i>google_plus</li>
										<li>
											<i class="glyphicon-jolicloud"></i>jolicloud</li>
										<li>
											<i class="glyphicon-yahoo"></i>yahoo</li>
										<li>
											<i class="glyphicon-blogger"></i>blogger</li>
										<li>
											<i class="glyphicon-picasa"></i>picasa</li>
										<li>
											<i class="glyphicon-amazon"></i>amazon</li>
										<li>
											<i class="glyphicon-tumblr"></i>tumblr</li>
										<li>
											<i class="glyphicon-wordpress"></i>wordpress</li>
										<li>
											<i class="glyphicon-instapaper"></i>instapaper</li>
										<li>
											<i class="glyphicon-evernote"></i>evernote</li>
										<li>
											<i class="glyphicon-xing"></i>xing</li>
										<li>
											<i class="glyphicon-zootool"></i>zootool</li>
										<li>
											<i class="glyphicon-dribbble"></i>dribbble</li>
										<li>
											<i class="glyphicon-deviantart"></i>deviantart</li>
										<li>
											<i class="glyphicon-read_it_later"></i>read_it_later</li>
										<li>
											<i class="glyphicon-linked_in"></i>linked_in</li>
										<li>
											<i class="glyphicon-forrst"></i>forrst</li>
										<li>
											<i class="glyphicon-pinboard"></i>pinboard</li>
										<li>
											<i class="glyphicon-behance"></i>behance</li>
										<li>
											<i class="glyphicon-github"></i>github</li>
										<li>
											<i class="glyphicon-youtube"></i>youtube</li>
										<li>
											<i class="glyphicon-skitch"></i>skitch</li>
										<li>
											<i class="glyphicon-foursquare"></i>foursquare</li>
										<li>
											<i class="glyphicon-quora"></i>quora</li>
										<li>
											<i class="glyphicon-badoo"></i>badoo</li>
										<li>
											<i class="glyphicon-spotify"></i>spotify</li>
										<li>
											<i class="glyphicon-stumbleupon"></i>stumbleupon</li>
										<li>
											<i class="glyphicon-readability"></i>readability</li>
										<li>
											<i class="glyphicon-facebook"></i>facebook</li>
										<li>
											<i class="glyphicon-twitter"></i>twitter</li>
										<li>
											<i class="glyphicon-instagram"></i>instagram</li>
										<li>
											<i class="glyphicon-posterous_spaces"></i>posterous_spaces</li>
										<li>
											<i class="glyphicon-vimeo"></i>vimeo</li>
										<li>
											<i class="glyphicon-flickr"></i>flickr</li>
										<li>
											<i class="glyphicon-last_fm"></i>last_fm</li>
										<li>
											<i class="glyphicon-rss"></i>rss</li>
										<li>
											<i class="glyphicon-skype"></i>skype</li>
										<li>
											<i class="glyphicon-e-mail"></i>e-mail</li>
									</ul>
								</div>
							</div>
						</div>
					</div>
				</div>
			</div>
		</div>
	</div>
	<script type="text/javascript">
	var _gaq = _gaq || [];
	_gaq.push(['_setAccount', 'UA-38620714-4']);
	_gaq.push(['_trackPageview']);

	(function() {
		var ga = document.createElement('script');
		ga.type = 'text/javascript';
		ga.async = true;
		ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
		var s = document.getElementsByTagName('script')[0];
		s.parentNode.insertBefore(ga, s);
	})();
	</script>
</body>


<!-- Mirrored from www.eakroko.de/flat/components-icons.html by HTTrack Website Copier/3.x [XR&CO'2014], Sat, 11 Jun 2016 05:19:17 GMT -->
</html>
