<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/2.3.2/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/2.3.2/css/bootstrap.min.css">
<style>
.carousel {background:#115599;margin:0;padding:0;}
.carousel-control {left:-20px;}
.carousel-control.right {right:-20px;}
.carousel-indicators {right: 50%;top: auto;bottom: 0px;margin-right:9px;}
.carousel-indicators li {background: #A11111;}
.carousel-indicators .active {background: #FFFF00;}
</style>
<script>
$(document).ready(function() {
$('#myCarousel').carousel({
interval:3000})});
</script>
<div class="container"><div class="row"><div class="span12"><div class="well">
<div id="myCarousel" class="carousel slide">
<ol class="carousel-indicators">
<li data-target="#myCarousel" data-slide-to="0" class="active"></li>
<li data-target="#myCarousel" data-slide-to="1"></li>
<li data-target="#myCarousel" data-slide-to="2"></li>
</ol>
<div class="carousel-inner"><div class="item active"><div class="row-fluid">
<div class="span3"><a href="#x" class="thumbnail"><img src="http://i.imgur.com/fiVofHIm.jpg" width="248" height="155" alt="Image" style="max-width:100%;" /></a></div>
<div class="span3"><a href="#x" class="thumbnail"><img src="http://i.imgur.com/rcivwQJm.jpg" width="248" height="155"alt="Image" style="max-width:100%;" /></a></div>
<div class="span3"><a href="#x" class="thumbnail"><img src="http://i.imgur.com/0nyxX2Lm.jpg" width="248" height="155" alt="Image" style="max-width:100%;" /></a></div>
<div class="span3"><a href="#x" class="thumbnail"><img src="http://i.imgur.com/gptb8xnm.jpg" width="248" height="155" alt="Image" style="max-width:100%;" /></a></div>
</div></div>
<div class="item">
<div class="row-fluid">
<div class="span3"><a href="#x" class="thumbnail"><img src="http://i.imgur.com/oSC4D7Rm.jpg" width="248" height="155" alt="Image" style="max-width:100%;" /></a></div>
<div class="span3"><a href="#x" class="thumbnail"><img src="http://i.imgur.com/9GqSG9am.jpg" width="248" height="155" alt="Image" style="max-width:100%;" /></a></div>
<div class="span3"><a href="#x" class="thumbnail"><img src="http://i.imgur.com/7X4wjWSm.jpg" width="248" height="155" alt="Image" style="max-width:100%;" /></a></div>
<div class="span3"><a href="#x" class="thumbnail"><img src="http://i.imgur.com/kbCkBYem.jpg" width="248" height="155" alt="Image" style="max-width:100%;" /></a></div>
</div></div>
<div class="item">
<div class="row-fluid">
<div class="span3"><a href="#x" class="thumbnail"><img src="http://i.imgur.com/XZLp5MAm.jpg" width="248" height="155" alt="Image" style="max-width:100%;" /></a></div>
<div class="span3"><a href="#x" class="thumbnail"><img src="http://i.imgur.com/uFoNudkm.jpg" width="248" height="155" alt="Image" style="max-width:100%;" /></a></div>
<div class="span3"><a href="#x" class="thumbnail"><img src="http://i.imgur.com/DgCJJQem.jpg" width="248" height="155" alt="Image" style="max-width:100%;" /></a></div>
<div class="span3"><a href="#x" class="thumbnail"><img src="http://i.imgur.com/1Yul3Hvm.jpg" width="248" height="155" alt="Image" style="max-width:100%;" /></a></div>
</div></div></div>
<a class="left carousel-control" href="#myCarousel" data-slide="prev">‹</a>
<a class="right carousel-control" href="#myCarousel" data-slide="next">›</a>
</div></div></div></div></div>
