LIST & PANNELS

Panels

<div class="panel panel-default">
	<div class="panel-body">
		Lorem ipsum dolor sit amet, consectetur adipisicing elit.
	</div>
</div>

<div class="panel panel-default">
	<div class="panel-body">
		Lorem ipsum dolor sit amet, consectetur adipisicing elit.
	</div>
	<div class="panel-footer">
		<a class="btn btn-success btn-xs pull-right">Footer Button</a>
		Panel Footer
	</div>
</div>

<div class="panel panel-default">
	<div class="panel-heading">
		<a class="btn btn-danger btn-xs pull-right">Header Button</a>
		<h2 class="panel-title">Panel Default</h2>
	</div>
	<div class="panel-body">
		Lorem ipsum dolor sit amet, consectetur adipisicing elit.
	</div>
</div>

<div class="panel panel-default">
	<div class="panel-heading panel-heading-transparent">
		<h2 class="panel-title">Panel Transparent</h2>
	</div>

	<div class="panel-body">
		Lorem ipsum dolor sit amet, consectetur adipisicing elit.
	</div>

	<div class="panel-footer panel-footer-transparent">
		Lorem ipsum dolor
	</div>
</div>

<div class="panel panel-success">
	<div class="panel-heading">
		<h2 class="panel-title">Panel Success</h2>
	</div>
	<div class="panel-body">
		Lorem ipsum dolor sit amet, consectetur adipisicing elit.
	</div>
</div>

<div class="panel panel-danger">
	<div class="panel-heading">
		<h2 class="panel-title">Panel Danger</h2>
	</div>
	<div class="panel-body">
		Lorem ipsum dolor sit amet, consectetur adipisicing elit.
	</div>
</div>

<div class="panel panel-warning">
	<div class="panel-heading">
		<h2 class="panel-title">Panel Warning</h2>
	</div>
	<div class="panel-body">
		Lorem ipsum dolor sit amet, consectetur adipisicing elit.
	</div>
</div>

<div class="panel panel-info">
	<div class="panel-heading">
		<h2 class="panel-title">Panel Info</h2>
	</div>
	<div class="panel-body">
		Lorem ipsum dolor sit amet, consectetur adipisicing elit.
	</div>
</div>

Panel with table

<div class="panel panel-default">
	<div class="panel-heading">
		<h2 class="panel-title">Panel With Table</h2>
	</div>
	<div class="panel-body">
		<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit.</p>
	</div>

	<table class="table">
		<thead>
			<tr>
				<th>#</th>
				<th>First Name</th>
				<th>Last Name</th>
				<th>Username</th>
			</tr>
		</thead>
		<tbody>
			<tr>
				<td>1</td>
				<td>Mark</td>
				<td>Otto</td>
				<td>@mdo</td>
			</tr>
			<tr>
				<td>2</td>
				<td>Jacob</td>
				<td>Thornton</td>
				<td>@fat</td>
			</tr>
			<tr>
				<td>3</td>
				<td>Larry</td>
				<td>the Bird</td>
				<td>@twitter</td>
			</tr>
		</tbody>
	</table>

</div>

<div class="panel panel-danger">
	<div class="panel-heading">
		<h2 class="panel-title">Panel With Table</h2>
	</div>
	<div class="nopadding panel-body">
		<table class="table nomargin">
			<thead>
				<tr>
					<th>#</th>
					<th>First Name</th>
					<th>Last Name</th>
					<th>Username</th>
				</tr>
			</thead>
			<tbody>
				<tr>
					<td>1</td>
					<td>Mark</td>
					<td>Otto</td>
					<td>@mdo</td>
				</tr>
				<tr>
					<td>2</td>
					<td>Jacob</td>
					<td>Thornton</td>
					<td>@fat</td>
				</tr>
				<tr>
					<td>3</td>
					<td>Larry</td>
					<td>the Bird</td>
					<td>@twitter</td>
				</tr>
			</tbody>
		</table>							
	</div>
</div>

<ul class="list-group">
	<li class="list-group-item">Lorem ipsum dolor</li>
	<li class="list-group-item">Dolor sit amet, consectetur</li>
	<li class="list-group-item">Amet, consectetur adipisicing</li>
	<li class="list-group-item">Consectetur adipisicing elit</li>
	<li class="list-group-item">Sit amet, consectetur</li>
</ul>

<div class="list-group">
	<a href="#" class="list-group-item active">Lorem ipsum dolor</a>
	<a href="#" class="list-group-item">Dolor amet, consectetur</a>
	<a href="#" class="list-group-item">Consectetur amet ipsum</a>
	<a href="#" class="list-group-item">Consectetur lorem mena</a>
	<a href="#" class="list-group-item">Sit amet, consectetur</a>
</div>

Group Custom Content

<div class="list-group">
	<a href="#" class="list-group-item active">
		<h4 class="list-group-item-heading">List group item heading</h4>
		<p class="list-group-item-text">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Dolorem, sit, reiciendis expedita voluptate fuga perferendis soluta doloribus quasi quia odio.Lorem ipsum dolor sit amet, consectetur adipisicing elit. Dolorem, sit, reiciendis expedita voluptate fuga perferendis soluta doloribus quasi quia odio.</p>
	</a>
	<a href="#" class="list-group-item">
		<h4 class="list-group-item-heading">List group item heading</h4>
		<p class="list-group-item-text">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Dolorem, sit, reiciendis expedita voluptate fuga perferendis soluta doloribus quasi quia odio.Lorem ipsum dolor sit amet, consectetur adipisicing elit. Dolorem, sit, reiciendis expedita voluptate fuga perferendis soluta doloribus quasi quia odio.</p>
	</a>
	<a href="#" class="list-group-item">
		<h4 class="list-group-item-heading">List group item heading</h4>
		<p class="list-group-item-text">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Dolorem, sit, reiciendis expedita voluptate fuga perferendis soluta doloribus quasi quia odio.Lorem ipsum dolor sit amet, consectetur adipisicing elit. Dolorem, sit, reiciendis expedita voluptate fuga perferendis soluta doloribus quasi quia odio.</p>
	</a>
</div>

List Groups - Badges

• 21 Lorem ipsum dolor sit amet
• 8 Dolorem, sit, reiciendis

<ul class="list-group col_half">
	<li class="list-group-item">
		<span class="badge">21</span>
		Lorem ipsum dolor sit amet
	</li>
	<li class="list-group-item">
		<span class="badge">8</span>
		Dolorem, sit, reiciendis
	</li>
</ul>