<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<link rel="stylesheet" href="//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.min.css">
<div class="container">
<div class="panel panel-default panelwrapper">
<div class="panel-heading panelHeading">
<span>Line 2 Production ERP Data <i class="fa fa-gears pull-right"></i></span>
</div>
<div class="panel-body panelbody">
<dl class="dl-horizontal">
<p class="lead topbottom">Shift 1</p>
<hr class="topbottom">
<dt class="listHeading"># of Units:</dt>
<dd class="listText">342</dd>
<dt class="listHeading">OEE:</dt>
<dd class="listText">88%</dd>
<dt class="listHeading">RF:</dt>
<dd class="listText">100%</dd>
<dt class="listHeading">RV:</dt>
<dd class="listText">88%</dd>
<dt class="listHeading">RQ:</dt>
<dd class="listText">100%</dd>
<hr class="topbottom">
<div class="badgeContainer">
<span class="badge badgeItems">Baguette</span>
<span class="badge badgeItems">Full grain</span>
<span class="badge badgeItems">Sliced wrapped</span>
</div>
<hr class="topbottom">
<div class="alert alert-info"><strong>Belt Info:</strong> 1 warning in the last day</div>
</dl>
<hr class="topbottom">
<button type="button" class="btn btn-primary pull-right">Details <i class="fa fa-external-link"></i></button>
