<div class="row">
<div class="col-md-8 col-md-offset-2 col-sm-10 col-sm-offset-1 text-center">
<h4 class="uppercase mb16">Captioned Images <span class="label">New in v1.7.4</span></h4>

<p class="lead mb80">These captionable images are controlled using a 'data-caption' attribute and '.image-caption' class. You can also add the class '.hover-caption' to reveal the caption on hover.</p>
</div>
</div>

<div class="row mb64 mb-xs-32">
<div class="col-sm-6">
<div class="image-caption cast-shadow mb-xs-32"><img alt="Captioned Image" src="/sites/default/files/images/home7.jpg" />
<div class="caption">
<p><strong>Note:</strong> Here is an image caption</p>
</div>
</div>
</div>

<div class="col-sm-6">
<div class="image-caption cast-shadow hover-caption"><img alt="Captioned Image" src="/sites/default/files/images/home8.jpg" />
<div class="caption">
<p><strong>Note:</strong> Here is a hoverable image caption</p>
</div>
</div>
</div>
</div>
