<link rel="stylesheet" href="path/to/normalize.css">
<link rel="stylesheet" href="path/to/perfect-scrollbar.css">
<link rel="stylesheet" href="path/to/font-awesome.css">
<link rel="stylesheet" href="path/to/open-sans.css">
<link rel="stylesheet" href="path/to/cssui.css">

<link rel="stylesheet" href="path/to/style.dashboard.css">
<link rel="stylesheet" href="path/to/style.css">

<div class="logged sidebar">
	<ul class="clear">
		<li class="gravatar float left"><img src="path/to/user.png" alt="user"></li>
		<li class="user float left">John Doe <a href="#">Logout</a></li>
	</ul>
</div>

<div class="header">
	<div class="clear">

		<!-- header dashboard -->
		<div class="float left">
			<ul class="breadcrumb">
				<li><a href=""><i class="fa fa-square-o" aria-hidden="true"></i>Dashboard</a></li>
				<li><i class="fa fa-long-arrow-right" aria-hidden="true"></i>Sample</li>
			</ul>
		</div>

		<!-- logged in header user -->
		<div class="float right user panel">

			<!-- user identity -->
			<div class="float left logged in">
				<ul class="clear">
					<li class="user float left">You login as John Doe</li>
					<li class="gravatar float left"><img src="img/user.png" alt="user"></li>
				</ul>
			</div>

			<!-- dropdown menu -->
			<div class="float left">

				<!--                       -->
				<!-- Here we dropdown menu -->
				<!--                       -->

			</div>
	</div>

	<!-- content -->
	<div class="content">
		<div class="box style">
			<h4>Sample</h4>
			Content...
		</div>
	</div>
</div>

<!-- nav wrapper -->
<div class="nav">

	<!-- click show/hide menu -->
	<div class="click"></div>
	<div class="sidebar">

		<!-- title for sidebar -->
		<div class="title">
			<p>Title for sidebar</p>
		</div>

		<!--                          -->
		<!-- 1. Add logged to sidebar -->
		<!--                          -->

		<div class="responsive">
			<ul class="menu scrollbar">

				<!-- dropdown menu -->
				<li>
					<span class="name">Dropdown menu</span>
					<ul>
						<li><a href="#">Click</a></li>
						<li class="parent">
						<a href="#" class="employ current">Europe</a>
							<ul class="submenu">
								<li><a href="#">Germany</a></li>
								<li><a href="#" class="current">France</a></li>
								<li><a href="#">Italy</a></li>
							</ul>
						</li>
					</ul>
				</li>
			</ul>
		</div>
	</div>
</div>

<!-- content wrapper -->
<div class="content-wrapper">

	<!--               -->
	<!-- 2. Add header -->
	<!--               -->

</div>

<script src="path/to/nanobar.js"></script>
<script>
	$(function() {

		var nanobar = new Nanobar();
		nanobar.go(100);

		/* Add responsive and dropdown menu js */
	});
</script>