JSFiddle - React, Tailwind, and code Playground

HTML

<link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css">
<script src="//netdna.bootstrapcdn.com/bootstrap/3.0.0/js/bootstrap.min.js"></script>
<div class="row page-header-box">
    <div class="col-md-2 col-sm-2 col-xs-3 page-header-title">Page Title</div>
    <div class="col-md-10 col-sm-10 col-xs-9 page-header-seperator">
        <div class="page-header-description"><small>Standard Text Description</small></div>
        <div class="page-header-alt"><small>Additional Text Description</small></div>
    </div>
</div>

CSS

.page-header-box {
    background-color:#3D3D3D;
    border-bottom:5px solid #b3b5b8;
    margin-bottom:10px;
}
.page-header-title { color:#f79239;text-align:right;vertical-align:middle;margin:10px 0; }
.page-header-seperator { border-left:5px solid #4e2f91;margin:10px 0; }
.page-header-description { color:#febe10; }
.page-header-alt { margin-top:5px;color:#0093b2; }