Image Masks
<img class="img-mask-1" src="../assets/images/img-src.jpg" >
<img class="img-mask-2" src="../assets/images/img-src.jpg" >
Avatars
Large Avatars
<img class="img-avatar-200" src="../assets/images/img-src.jpg" >
<img class="img-avatar-180" src="../assets/images/img-src.jpg" >
<img class="img-avatar-160" src="../assets/images/img-src.jpg" >
Small Avatars
<img class="img-avatar-80" src="../assets/images/img-src.jpg" >
<img class="img-avatar-70" src="../assets/images/img-src.jpg" >
<img class="img-avatar-60" src="../assets/images/img-src.jpg" >
Avatar Group
<ul class="avatar-group">
<li>
<img src="../assets/images/img-src.jpg" data-rjs="2">
</li>
<li>
<img src="../assets/images/img-src.jpg" data-rjs="2">
</li>
<li>
<img src="../assets/images/img-src.jpg" data-rjs="2">
</li>
</ul>
Image Overlap
<div class="row">
<div class="col-12 col-md-10 offset-md-1 col-lg-8 offset-lg-2 col-xl-6 offset-xl-3">
<div class="img-overlap">
<div class="img-1">
<img src="../assets/images/img-src.jpg" >
</div>
<div class="img-2">
<img src="../assets/images/img-src.jpg" >
</div>
</div>
</div>
</div><!-- end row -->