<!doctype html>
<html>
<head>
	<meta charset="utf-8">
	<meta http-equiv="X-UA-Compatible" content="IE=edge">
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<title>Brain Admin Dashboard Template</title>

	
	<link rel="stylesheet" href="css/style.css">
	
	<script src="js/jquery.js"></script>

	<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
	<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
	<!--[if lt IE 9]>
	<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
	<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
	<![endif]-->

</head>
<body class="sidebar-push">
  
  		<nav class="navbar navbar-default navbar-fixed-top">
	<div class="container-fluid">
		<!-- Brand and toggle get grouped for better mobile display -->
		<div class="navbar-header">
			<button type="button" class="navbar-toggle visible-xs visible-sm collapsed pull-left" id="showLeftPush">
				<i class="md md-menu"></i>
			</button>
			<a class="navbar-brand" href="index.html">Blueprint</a>
			<button type="button" class="navbar-toggle pull-right" id="showRightPush">
				<i class="md md-more-vert"></i>
			</button>
		</div>
		<div class="hidden-xs">
            <ul class="nav navbar-nav">
                <li class="active"><a href="../default/panels.html">Admin</a></li>
<li><a href="../sidebar-mini/panels.html">Sidebar-Mini</a></li>
<li><a href="../fixed/panels.html">Fixed</a></li>
            </ul>

			<ul class="nav navbar-nav navbar-right">
				<li class="active dropdown">
					<button class="btn btn-default navbar-btn btn-rounded"  data-toggle="dropdown">
						<i class="md md-notifications"></i>
					</button>
					<div class="dropdown-menu dropdown-caret dropdown-caret-right  width-300">
						<div class="dropdown-padding dropdown-headline">
							<div class="media dropdown-head">
								<div class="media-body media-middle">
									<h4 class="">Notifications <small class="bold text-muted">(3 new)</small></h4>
								</div>
								<div class="media-right media-middle">
									<a href="#" class="text-muted"><i class="md md-list"></i></a>
								</div>
							</div>
						</div>
						<div class="dropdown-padding">
							<div class="notification-block body-bg">
									<span class="notification-icon orange">
										<i class="md md-comment"></i>
									</span>
									<span class="notification-content">
										Andrew replied to <a href="#">"How do I use Grunt?"</a>
									</span>
									<small>2 min ago</small>
							</div>
							<div class="notification-block body-bg">
									<span class="notification-icon green">
										<i class="md md-today"></i>
									</span>
									<span class="notification-content">
										Event <a href="#">SEO Conference</a> started
									</span>
									<small>2 min ago</small>

							</div>
							<div class="notification-block body-bg">

									<span class="notification-icon primary">
										<i class="md md-timelapse"></i>
									</span>
									<span class="notification-content">
										2h 40min left to <a href="#">General Board Meeting</a>.
									</span>
									<small>2 min ago</small>

							</div>
						</div>
						<div class="dropdown-padding text-center">
							<a href="#">View all</a>
						</div>
					</div>
				</li>
				<li class="dropdown">
					<button class="btn btn-default-light navbar-btn btn-rounded"  data-toggle="dropdown">
						<i class="md md-language"></i>
					</button>
					<ul class="dropdown-menu dropdown-caret dropdown-caret-right dropdown-menu-auto">
						<li><a href="#">English</a></li>
						<li><a href="#">German</a></li>
						<li><a href="#">French</a></li>
					</ul>
				</li>
				<li class="dropdown">
					<button class="btn btn-primary navbar-btn btn-rounded"  data-toggle="dropdown">
						<i class="md md-email"></i>
					</button>
					<div class="dropdown-menu dropdown-caret dropdown-caret-right width-300">
						<div class="dropdown-padding">
							<a href="#" class="notification-block">
									<span class="notification-icon primary">
										<i class="md md-email"></i>
									</span>
									<span class="notification-content">
										Hi Andrew,
										Is it ok to meet tomorrow?
									</span>
								<small>2 min ago</small>
							</a>
						</div>
						<div class="dropdown-padding">
							<a href="#" class="notification-block">
									<span class="notification-icon primary">
										<i class="md md-email"></i>
									</span>
									<span class="notification-content">
										Hi Andrew,
										Is it ok to meet tomorrow?
									</span>
								<small>2 min ago</small>
							</a>
						</div>
					</div>
				</li>

				
				
				<li>
					<a href="#" class="user" id="showUserPush">
						<img src="images/guy.jpg" width="40" alt="guy" class="img-circle"/>
					</a>
				</li>
				
			</ul>
		</div>
	</div>
</nav>
	  	<div class="sidebar left-side" id="sidebar-left">
	<div class="sidebar-user">
		<div class="media sidebar-padding">
			<div class="media-left media-middle">
				<img src="images/guy.jpg" alt="person" style="width: 60px" class="img-circle"/>
			</div>
			<div class="media-body media-middle">
				<a href="#" class="h4 margin-none">Andrew Brain</a>
				<ul class="list-unstyled list-inline margin-none">
					<li><a href="account.html"><i class="md-person-outline"></i></a></li>
					<li><a href="email.html"><i class="md-email"></i></a></li>
					<li><a href="#"><i class="md-settings"></i></a></li>
					<li><a href="login.html"><i class="md-exit-to-app"></i></a></li>
				</ul>
			</div>
		</div>
	</div>
	<!-- Wrapper Reqired by Nicescroll (start scroll from here) -->
	<div class="nicescroll">
		<div class="wrapper" style="margin-bottom:90px">
			<ul class="nav nav-sidebar" id="sidebar-menu">
                <h4 class="sidebar-headline">Sidebar Menu</h4>
                <li><a href="index.html"><i class="md md-desktop-mac"></i> Dashboard <span class="sr-only">(current)</span></a></li>
				<li><a href="timeline.html"><i class="md md-dashboard"></i> Timeline</a></li>
                <li><a href="clients-listing.html"><i class="md md-group"></i> Clients</a></li>
                <li><a href="finances.html"><i class="md md-attach-money"></i> Financial</a></li>
                <li><a href="email.html"><i class="md md-email"></i>Emails</a></li>
                <li><a href="calendar.html"><i class="md md-event-available"></i>Calendar</a></li>
                <li><a href="forms.html"><i class="md md-text-format"></i>Form Elements</a></li>
                <li><a href="tables.html"><i class="md md-list"></i>Tables</a></li>
                <li><a href="charts.html"><i class="md md-insert-chart"></i>Charts</a></li>
                <li><a href="maps.html"><i class="md md-map"></i>Maps</a></li>

				<li class="submenu active">

					<a href="#"><i class="md md-my-library-add"></i>Components</a>
					<ul  style="display: block" class="collapse in">
						<li><a href="buttons.html">Buttons</a></li>
						<li>
							<a href="icons.html">
								Icons &nbsp;<span class="label label-primary">1468</span>
							</a>
						</li>
						<li class="active"><a href="panels.html">Panels </a></li>
						<li><a href="progress.html">Progress & Ratings</a></li>
						<li><a href="tabs.html">Tabs</a></li>
						<li><a href="tree.html">Tree View</a></li>
						<li><a href="nestable.html">Nestable</a></li>
						<li><a href="notifications.html">Notifications</a></li>
					</ul>
				</li>

				<li class="submenu">
                    <a href="#" >
                    <i class="md md-description"></i> Extra Pages <span class="pull-right label label-primary">10+</span>
                    </a>
                    <ul >
                        <li><a href="jobs.html">Jobs</a></li>
                        <li><a href="account.html">Account</a></li>
						<li><a href="marketing.html">Marketing</a></li>
                        <li><a href="error.html">Errors [404]</a></li>
                        <li><a href="login.html">Login</a></li>
                        <li><a href="signup.html">Sign Up</a></li>
                    </ul>
                </li>
			</ul>

			<h4 class="sidebar-headline">Sidebar Headline</h4>

			<ul class="nav nav-sidebar">
				<li class="submenu">
					<a href="#">
						<i class="md md-my-library-add"></i>Collapse Menu
					</a>
					<ul>
						<li><a href="#">Submenu Link</a></li>
						<li><a href="#">Submenu</a></li>
						<li><a href="#">Link &nbsp;<span class="label label-primary">1468+</span></a></li>
					</ul>
				</li>
			</ul>
		</div>
	</div>
</div>
	  	<div class="sidebar right-side" id="sidebar-right">
	<!-- Wrapper Reqired by Nicescroll -->
	<div class="nicescroll">
		<div class="wrapper">
			<div class="block-primary">
				<div class="media">
					<div class="media-left media-middle">
						<a href="#">
							<img src="images/guy.jpg" alt="person" class="img-circle border-white" width="60"/>
						</a>
					</div>
					<div class="media-body media-middle">
						<a href="account.html" class="h4">Andrew Brain</a>
						<a href="login.html" class="logout pull-right"><i class="md md-exit-to-app"></i></a>
					</div>
				</div>
			</div>
			<ul class="nav nav-sidebar" id="sidebar-menu">
				<li><a href="account.html"><i class="md md-person-outline"></i> Account</a></li>
				<li><a href="email.html"><i class="md md-email"></i> Emails</a></li>
				<li><a href="#"><i class="md md-attach-money"></i> Payments</a></li>
				<li><a href="#"><i class="md md-settings"></i> Settings</a></li>
				<li><a href="login.html"><i class="md md-exit-to-app"></i> Logout</a></li>
			</ul>
		</div>
	</div>
</div>
  
  
  


  <div class="container-fluid ">
      
<div id="main">
	<div class="page-header text-center">
		<h2>Panels</h2>
	</div>
	<div class="row">
	<div class="col-sm-6 col-md-4">
		<div class="panel">
			<div class="btn-group panel-action-buttons">
				<div class="btn-group" role="group">

					<a href="#" class="btn" data-toggle="dropdown"><i class="md md-settings"></i></a>
					<ul class="dropdown-menu dropdown-menu-right">
						<li><a href="#">Settings</a></li>
						<li><a href="#">Options</a></li>
					</ul>
				</div>
				<a href="#" class="btn"><i class="md md-keyboard-arrow-down"></i></a>
			</div>
			<div class="panel-body">
				<h4 class="margin-t-none">Basic Default Panel</h4>

				<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Autem consectetur dolore doloribus error
				   libero molestiae reiciendis reprehenderit.</p>
			</div>
		</div>
	</div>
	<div class="col-sm-6 col-md-4">
		<div class="panel panel-default">
			<div class="btn-group panel-action-buttons">
				<div class="btn-group" role="group">

					<a href="#" class="btn" data-toggle="dropdown"><i class="md md-settings"></i></a>
					<ul class="dropdown-menu dropdown-menu-right">
						<li><a href="#">Settings</a></li>
						<li><a href="#">Options</a></li>
					</ul>
				</div>
				<a href="#" class="btn"><i class="md md-keyboard-arrow-down"></i></a>
			</div>
			<div class="panel-body">
				<h4 class="margin-t-none">Panel with Border</h4>

				<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Asperiores consequatur placeat quia sed.
				   Beatae cum deleniti facere nemo vel voluptate.</p>
			</div>
		</div>
	</div>
	<div class="col-sm-6 col-md-4">
		<div class="panel panel-default panel-shadow">
			<div class="panel-body">
				<h4 class="margin-t-none">Panel with Shadow</h4>

				<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Assumenda distinctio dolor ducimus hic,
				   ipsam ipsum iste natus nemo perspiciatis quia?</p>
			</div>
		</div>
	</div>
</div>

<div class="row">
	<div class="col-sm-6 col-md-4">

		<div class="panel panel-primary">

			<div class="btn-group panel-action-buttons">
				<div class="btn-group" role="group">

					<a href="#" class="btn" data-toggle="dropdown"><i class="md md-settings"></i></a>
					<ul class="dropdown-menu dropdown-menu-right">
						<li><a href="#">Settings</a></li>
						<li><a href="#">Options</a></li>
					</ul>
				</div>
				<a href="#" class="btn"><i class="md md-keyboard-arrow-down"></i></a>
			</div>
			<div class="panel-body">
				<h4 class="headline">Colored Panel</h4>

				<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Autem consectetur dolore doloribus error
				   libero molestiae reiciendis reprehenderit.</p>
			</div>
		</div>

		<div class="panel panel-grey">
			<div class="btn-group panel-action-buttons">
				<div class="btn-group" role="group">

					<a href="#" class="btn" data-toggle="dropdown"><i class="md md-settings"></i></a>
					<ul class="dropdown-menu dropdown-menu-right">
						<li><a href="#">Settings</a></li>
						<li><a href="#">Options</a></li>
					</ul>
				</div>
				<a href="#" class="btn"><i class="md md-keyboard-arrow-down"></i></a>
			</div>
			<div class="panel-body">
				<h4 class="headline">Colored Panel</h4>

				<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Asperiores consequatur placeat quia sed.
				   Beatae cum deleniti facere nemo vel voluptate.</p>
			</div>
		</div>

		<div class="panel panel-orange">
			<div class="btn-group panel-action-buttons">
				<div class="btn-group" role="group">

					<a href="#" class="btn" data-toggle="dropdown"><i class="md md-settings"></i></a>
					<ul class="dropdown-menu dropdown-menu-right">
						<li><a href="#">Settings</a></li>
						<li><a href="#">Options</a></li>
					</ul>
				</div>
				<a href="#" class="btn"><i class="md md-keyboard-arrow-down"></i></a>
			</div>
			<div class="panel-body">
				<h4 class="headline">Colored Panel</h4>

				<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit. Assumenda distinctio dolor ducimus hic,
				   ipsam ipsum iste natus nemo perspiciatis quia?</p>
			</div>
		</div>
	</div>
	<div class="col-sm-6 col-md-8">

		<div class="panel panel-default">
			<div class="btn-group panel-action-buttons">
				<div class="btn-group" role="group">

					<a href="#" class="btn" data-toggle="dropdown"><i class="md md-settings"></i></a>
					<ul class="dropdown-menu dropdown-menu-right">
						<li><a href="#">Settings</a></li>
						<li><a href="#">Options</a></li>
					</ul>
				</div>
				<a href="#" class="btn"><i class="md md-keyboard-arrow-down"></i></a>
			</div>
			<div class="panel-body">
				<h4 class="margin-t-none">Panel with Table</h4>
			</div>
			<table class="table">
				<thead>
				<tr>
					<th>#</th>
					<th>First Name</th>
					<th>Last Name</th>
					<th>Username</th>
				</tr>
				</thead>
				<tbody>
				<tr>
					<th scope="row">1</th>
					<td>Mark</td>
					<td>Otto</td>
					<td>@mdo</td>
				</tr>
				<tr>
					<th scope="row">2</th>
					<td>Jacob</td>
					<td>Thornton</td>
					<td>@fat</td>
				</tr>
				<tr>
					<th scope="row">3</th>
					<td>Larry</td>
					<td>the Bird</td>
					<td>@twitter</td>
				</tr>
				</tbody>
			</table>
		</div>
		<div class="panel panel-default panel-shadow">
			<div class="panel-body">
				<h4 class="margin-t-none">Panel with List</h4>

				<p>Some default panel content here. Nulla vitae elit libero, a pharetra augue. Aenean lacinia bibendum
				   nulla sed consectetur. Aenean eu leo quam. Pellentesque ornare sem lacinia quam venenatis vestibulum.
				   Nullam id dolor id nibh ultricies vehicula ut id elit.</p>
			</div>
			<ul class="list-group">
				<li class="list-group-item">Cras justo odio</li>
				<li class="list-group-item">Dapibus ac facilisis in</li>
				<li class="list-group-item">Morbi leo risus</li>
				<li class="list-group-item">Porta ac consectetur ac</li>
				<li class="list-group-item">Vestibulum at eros</li>
			</ul>
		</div>
	</div>
</div>

</div>

	  <div class="footer">
	<a href="index.html" class="brand">
		<i class="md md-multitrack-audio"></i> Blueprint
	</a>
	<ul>
		<li><a href="#">Contact us</a></li>
		<li><a href="#">Support</a></li>
	</ul>
</div>
  </div>


  <div class="overlay-disabled"></div>


  <!-- Plugins -->
  <script src="js/plugins.min.js"></script>

  
  <!-- App Scripts -->
  <script src="js/scripts.js"></script>

</body>
</html>