<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>
<div class="container">
<div class="row">
<div class="gallery col-lg-12 col-md-12 col-sm-12 col-xs-12">
<h1 class="gallery-title">Gallery</h1>
</div>
<div align="center">
<button class="btn btn-default filter-button active" data-filter="all">All</button>
<button class="btn btn-default filter-button" data-filter="hdpe">HDPE Pipes</button>
<button class="btn btn-default filter-button" data-filter="sprinkle">Sprinkle Pipes</button>
<button class="btn btn-default filter-button" data-filter="spray">Spray Nozzle</button>
<button class="btn btn-default filter-button" data-filter="irrigation">Irrigation Pipes</button>
</div>
<br/>
<div class="gallery_product col-lg-4 col-md-4 col-sm-4 col-xs-6 filter hdpe">
<img src="http://fakeimg.pl/365x365/" class="img-responsive">
</div>
<div class="gallery_product col-lg-4 col-md-4 col-sm-4 col-xs-6 filter sprinkle">
<img src="http://fakeimg.pl/365x365/" class="img-responsive">
</div>
<div class="gallery_product col-lg-4 col-md-4 col-sm-4 col-xs-6 filter hdpe">
<img src="http://fakeimg.pl/365x365/" class="img-responsive">
</div>
<div class="gallery_product col-lg-4 col-md-4 col-sm-4 col-xs-6 filter irrigation">