<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>
<link href="https://fonts.googleapis.com/css?family=Paytone+One" rel="stylesheet">
<script src="https://use.fontawesome.com/a152d19b3e.js"></script>
<section id="service" class="social-section">
<div class="container" >
<div class="row" style="padding-top:70px" id="tabs">
<a href="#"><div class="col-md-4 col-sm-4 col-xs-4 hover">
<img src="http://via.placeholder.com/380x200" class="img-responsive"/>
<h3 style="color:#2C9ED7">Title 1</h3>
Column 1 - span 4 columns in desktops <br/>
something interesting.<br/>
#lol #TODD<br/>
<i class="fa fa-instagram fa-3x" aria-hidden="true"></i>
</div></a>
<a href="#"><div class="col-md-4 col-sm-4 col-xs-4 hover">
<img src="http://via.placeholder.com/380x200" class="img-responsive"/>
<h3 style="color:#4C8F90">Title 2</h3>
Column 2 - span 4 columns in desktops <br/>
dead turtle is a great drink! <br />
#lol #MYNAMEISTODD<br/>
<i class="fa fa-instagram fa-3x" aria-hidden="true"></i>
</div></a>
<a href="#"><div class="col-md-4 col-sm-4 col-xs-4 hover">
<img src="http://via.placeholder.com/380x200" class="img-responsive"/>
<h3 style="color:#CF5045">Title 3</h3>
Column 3 - span 4 columns in desktops <br/>
written something here!<br />
#lol #deadturtleshot<br/>
<i class="fa fa-instagram fa-3x" aria-hidden="true"></i>
</div></a>
</div>
