<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 ----------> <div class ="container"> <div class="row"> <div class="col-md-4"> <div class="media"> <div class="media-left padding20"> <a href="#"><span style="font-size: 55px" class="glyphicon glyphicon-cog orange"></span></a> </div> <div class="media-body"> <h2 class="subtitle">Discovery & Strategy</h2> <p>Excepteur sint occaecat cupi datat non proidt, sunt in culpa qui offi cia deserunt</p> </div> </div> </div> <div class="col-md-4"> <div class="media"> <div class="media-left padding20"> <a href="#"><span style="font-size: 55px" class="glyphicon glyphicon-cog orange"></span></a> </div> <div class="media-body"> <h2 class="subtitle">Discovery & Strategy</h2> <p>Excepteur sint occaecat cupi datat non proidt, sunt in culpa qui offi cia deserunt</p> </div> </div> </div> <div class="col-md-4"> <div class="media"> <div class="media-left padding20"> <a href="#"><span style="font-size: 55px" class="glyphicon glyphicon-cog orange"></span></a> </div> <div class="media-body"> <h2 class="subtitle">Discovery & Strategy</h2> <p>Excepteur sint occaecat cupi datat non proidt, sunt in culpa qui offi cia deserunt</p> </div> </div> </div> </div> <div class="row"> <div class="col-md-4"> <div class="media"> <div class="media-left padding20"> <a href="#"><span style="font-size: 55px" class="glyphicon glyphicon-cog orange"></span></a> </div> <div class="media-body"> <h2 class="subtitle">Discovery & Strategy</h2> <p>Excepteur sint occaecat cupi datat non proidt, sunt in culpa qui offi cia deserunt</p> </div> </div> </div> <div class="col-md-4"> <div class="media"> <div class="media-left padding20"> <a href="#"><span style="font-size: 55px" class="glyphicon glyphicon-cog orange"></span></a> </div> <div class="media-body"> <h2 class="subtitle">Discovery & Strategy</h2> <p>Excepteur sint occaecat cupi datat non proidt, sunt in culpa qui offi cia deserunt</p> </div> </div> </div> <div class="col-md-4"> <div class="media"> <div class="media-left padding20"> <a href="#"><span style="font-size: 55px" class="glyphicon glyphicon-cog orange"></span></a> </div> <div class="media-body"> <h2 class="subtitle">Discovery & Strategy</h2> <p>Excepteur sint occaecat cupi datat non proidt, sunt in culpa qui offi cia deserunt</p> </div> </div> </div> </div> </div> <div class="container"> <h2>Create your snippet's HTML, CSS and Javascript in the editor tabs</h2> <hr> <div class="row"> <div class="col-md-4"> <a href="#"><span style="font-size: 55px" class="glyphicon glyphicon-cog orange"></span></a> <h2 class="subtitle">Insights</h2> <p>Excepteur sint occaecat cupidatat non proidt, sunt in culpa qui officia deserunt mollit <br>animidest laborum.</p> </div> <div class="col-md-4"> <span style="font-size: 55px" class="glyphicon glyphicon-cog orange"></span> <h2 class="subtitle">Design</h2> <p>Excepteur sint occaecat cupidatat non proidt, sunt in culpa qui officia deserunt mollit <br>animidest laborum.</p> </div> <div class="col-md-4"> <span style="font-size: 55px" class="glyphicon glyphicon-cog orange"></span> <h2 class="subtitle">Growth</h2> <p>Excepteur sint occaecat cupidatat non proidt, sunt in culpa qui officia deserunt mollit <br>animidest laborum.</p> </div> </div> <div class="row"> <div class="col-md-4"> <span style="font-size: 55px" class="glyphicon glyphicon-cog orange"></span> <h2 class="subtitle">Insights</h2> <p>Excepteur sint occaecat cupidatat non proidt, sunt in culpa qui officia deserunt mollit <br>animidest laborum.</p> </div> <div class="col-md-4"> <span style="font-size: 55px" class="glyphicon glyphicon-cog orange"></span> <h2 class="subtitle">Insights</h2> <p>Excepteur sint occaecat cupidatat non proidt, sunt in culpa qui officia deserunt mollit <br>animidest laborum.</p> </div> <div class="col-md-4"> <span style="font-size: 55px" class="glyphicon glyphicon-cog orange"></span> <h2 class="subtitle">Insights</h2> <p>Excepteur sint occaecat cupidatat non proidt, sunt in culpa qui officia deserunt mollit <br>animidest laborum.</p> </div> </div> </div> <div class="container "> <h2>Create your snippet's HTML, CSS and Javascript in the editor tabs</h2> <hr> <div class="row text-center"> <div class="col-md-4 "> <span style="font-size: 55px" class="glyphicon glyphicon-cog orange"></span> <h2 class="subtitle">Insights</h2> <p>Excepteur sint occaecat cupidatat non proidt, sunt in culpa qui officia deserunt mollit <br>animidest laborum.</p> </div> <div class="col-md-4"> <span style="font-size: 55px" class="glyphicon glyphicon-cog orange"></span> <h2 class="subtitle">Design</h2> <p>Excepteur sint occaecat cupidatat non proidt, sunt in culpa qui officia deserunt mollit <br>animidest laborum.</p> </div> <div class="col-md-4"> <span style="font-size: 55px" class="glyphicon glyphicon-cog orange"></span> <h2 class="subtitle">Growth</h2> <p>Excepteur sint occaecat cupidatat non proidt, sunt in culpa qui officia deserunt mollit <br>animidest laborum.</p> </div> </div> <div class="row text-center"> <div class="col-md-4"> <span style="font-size: 55px" class="glyphicon glyphicon-cog orange"></span> <h2 class="subtitle">Insights</h2> <p>Excepteur sint occaecat cupidatat non proidt, sunt in culpa qui officia deserunt mollit <br>animidest laborum.</p> </div> <div class="col-md-4"> <span style="font-size: 55px" class="glyphicon glyphicon-cog orange"></span> <h2 class="subtitle">Insights</h2> <p>Excepteur sint occaecat cupidatat non proidt, sunt in culpa qui officia deserunt mollit <br>animidest laborum.</p> </div> <div class="col-md-4"> <span style="font-size: 55px" class="glyphicon glyphicon-cog orange"></span> <h2 class="subtitle">Insights</h2> <p>Excepteur sint occaecat cupidatat non proidt, sunt in culpa qui officia deserunt mollit <br>animidest laborum.</p> </div> </div> </div>

.orange { color:#e52214; } .subtitle { font-size: 20px; font-weight: 700; } .padding20 { padding:20px; }

<link href="//maxcdn.bootstrapcdn.com/font-awesome/4.1.0/css/font-awesome.min.css" rel="stylesheet">