<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="//code.jquery.com/jquery-1.11.1.min.js"></script> <!------ Include the above in your HEAD tag ----------> <link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" integrity="sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN" crossorigin="anonymous"> <div class="container"> <div class="row"> <div class="col-lg-4"> <div class="bs-callout bs-callout-info" id="callout-helper-bg-specificity"> <h4>Alert Schedule <i class="fa fa-info-circle help" data-toggle="tooltip" data-placement="top" title="Yada yada"></i></h4> <div class="row"> <div class="col-lg-4"> <ul style="list-style:none;"> <li><strong>Announcements</strong></li> <li><strong>Discussions</strong></li> <li><strong>Documents</strong></li> <li><strong>Wikis</strong></li> </ul> </div> <div class="col-lg-6"> <ul style="list-style: none;"> <li>Daily @ 2:30pm</span></li> <li>Immediate</li> <li>Daily @ 2:30pm</li> <li>Daily @ 2:30pm</li> </ul> </div> </div> </div> </div> </div> </div>

.bs-callout { padding: 10px 10px 10px 10px; margin: 20px 0; border-left: 5px solid #eee; border-radius: 0; } .bs-callout-info { border-left-color: #1b809e; } .bs-callout h4 { margin-top: 0; margin-bottom: 5px; color: #1b809e; } .bs-callout ul { padding-left: 20px; }