Fancy box
Fancy box 1
<div class="fancy-box-1">
<a href="#">
<img src="../assets/images/col-2.jpg" alt="">
<div class="content">
<span>Top text</span>
</div>
</a>
</div>
<div class="fancy-box-1">
<a href="#">
<img src="../assets/images/col-2.jpg" alt="">
<div class="content middle">
<span>Middle text</span>
</div>
</a>
</div>
<div class="fancy-box-1">
<a href="#">
<img src="../assets/images/col-2.jpg" alt="">
<div class="content bottom">
<span>Bottom text</span>
</div>
</a>
</div>
Fancy box 2
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.
<div class="fancy-box-2">
<img src="../assets/images/col-2.jpg" alt="">
<div class="hover-content">
<p>Lorem ipsum dolor sit amet...</p>
</div>
</div>
Fancy box 3
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus.
<div class="fancy-box-3">
<img src="../assets/images/col-2.jpg" alt="">
<div class="content">
<p>Lorem ipsum dolor sit amet...</p>
</div>
<div class="hover-content">
<a class="button button-lg button-outline-white-2" href="#">Button</a>
</div>
</div>