<link href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//netdna.bootstrapcdn.com/bootstrap/3.0.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 ----------> <div class="row"> <div class="col-md-4 -services1"> <span class="glyphicon glyphicon-user icon"></span> <h3>24*7 faculty</h3> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. In congue pretium placerat. </p> </div> <div class="col-md-4 -services2"> <span class="glyphicon glyphicon-user icon"></span> <h3>24 hours labs</h3> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. In congue pretium placerat. </p> </div> <div class="col-md-4 -services3"> <span class="glyphicon glyphicon-user icon"></span> <h3>Online training</h3> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. In congue pretium placerat. </p> </div> <div class="clearfix"></div> </div>

.icon { font-size :60px; padding-top : 40px; color:white; } .-services1 { text-align: center; background: #f47441; color:#333; min-height: 294px; } .-services1 p { font-family: 'Open Sans', sans-serif; letter-spacing: 2px; line-height: 1.8em; } .-services1 h3 { line-height: 1.8em; color: #fff; font-family: 'Montserrat Alternates', sans-serif; letter-spacing: 2px; } .-services2 { text-align: center; background: #19d8ad; min-height: 294px; } .-services2 h3 { color: #fff; line-height: 1.8em; font-family: 'Montserrat Alternates', sans-serif; letter-spacing: 2px; } .-services2 p { font-family: 'Open Sans', sans-serif; letter-spacing: 2px; line-height: 1.8em; } .-services3 { text-align: center; background:#13eaec; min-height: 294px; } .-services3 h3 { line-height: 1.8em; color: #fff; font-family: 'Montserrat Alternates', sans-serif; letter-spacing: 2px; } .-services3 p { font-family: 'Open Sans', sans-serif; letter-spacing: 2px; line-height: 1.8em; }