<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 ----------> <link href="//maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css" rel="stylesheet"> <div class="icons-left-3boxes-section secpaddingTB60 "> <div class="container"> <div class="row "> <div class="col-md-12 text-center"> <h2 class="section-title ">Icon Boxes</h2> <h4 class="section-titlepara">Sign up for our newsletter</h4> </div> <div class="border text-center"></div> <div class="row"> <div class="col-md-4"> <div class="icon-box"> <div class="icon-left"> <i class="fa fa-cogs"></i> </div> <h3>Lorem ipsum dolor</h3> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla convallis egestas rhoncus.</p> </div> </div> <div class="col-md-4"> <div class="icon-box"> <div class="icon-left"> <i class="fa fa-android"></i> </div> <h3>Lorem ipsum dolor</h3> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla convallis egestas rhoncus.</p> </div> </div> <div class="col-md-4"> <div class="icon-box"> <div class="icon-left"> <i class="fa fa-apple"></i> </div> <h3>Lorem ipsum dolor</h3> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla convallis egestas rhoncus.</p> </div> </div> <div class="col-md-4"> <div class="icon-box"> <div class="icon-left"> <i class="fa fa-cogs"></i> </div> <h3>Lorem ipsum dolor</h3> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla convallis egestas rhoncus.</p> </div> </div> <div class="col-md-4"> <div class="icon-box"> <div class="icon-left"> <i class="fa fa-android"></i> </div> <h3>Lorem ipsum dolor</h3> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla convallis egestas rhoncus.</p> </div> </div> <div class="col-md-4"> <div class="icon-box"> <div class="icon-left"> <i class="fa fa-apple"></i> </div> <h3>Lorem ipsum dolor</h3> <p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla convallis egestas rhoncus.</p> </div> </div> </div> </div> </div> </div>

.secpaddingTB60 { padding-top:60px; padding-bottom:60px; } .section-title { font-weight:400; letter-spacing:.5px; text-transform:none; color:#000; } .section-titlepara { font-weight:400; text-transform:none; color:#636363; } .border { background: #e2e2e2; height: 1px; width: 265px; margin-left: auto; margin-right: auto; margin-bottom: 25px; } i { font-size : 36px; padding-right: 10px; color: #aece61; } .icon-box { position: relative; margin-top: 20px; padding: 0 0 0 80px; } .icon-left { display: block; position: absolute; width: 64px; height: 64px; top: 0; left: 0; } .icon-left i:hover { color:#; }