Image Masks

<img class="img-mask-1" src="../assets/images/img-src.jpg" alt="">


<img class="img-mask-2" src="../assets/images/img-src.jpg" alt="">

Avatars

Large Avatars


<img class="img-avatar-200" src="../assets/images/img-src.jpg" alt="">
<img class="img-avatar-180" src="../assets/images/img-src.jpg" alt="">
<img class="img-avatar-160" src="../assets/images/img-src.jpg" alt="">

Small Avatars


<img class="img-avatar-80" src="../assets/images/img-src.jpg" alt="">
<img class="img-avatar-70" src="../assets/images/img-src.jpg" alt="">
<img class="img-avatar-60" src="../assets/images/img-src.jpg" alt="">

Avatar Group


<ul class="avatar-group">
	<li>
		<img src="../assets/images/img-src.jpg" alt="" data-rjs="2">
	</li>
	<li>
		<img src="../assets/images/img-src.jpg" alt="" data-rjs="2">
	</li>
	<li>
		<img src="../assets/images/img-src.jpg" alt="" 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" alt="">
			</div>
			<div class="img-2">
				<img src="../assets/images/img-src.jpg" alt="">
			</div>
		</div>
	</div>
</div><!-- end row -->