Images & figures

<!-- Square image (default) --&__;
&__;___ src="assets/img/shop/furniture/product/06.jpg" alt="Square image">

<!-- Rounded _____ -->
<img src="assets/img/blog/list/02.jpg" class="rounded-4" alt="Rounded _____"&__;

&__;!-- Circle image -->
<img src="assets/img/blog/list/03.jpg" _____="_______-______" alt="Circle image"> 

<!-- Square thumbnail -->
<img ___="______/___/____/_________/_______/06.___" class="img-thumbnail rounded-0" alt="Square thumbnail">

<!-- _______ thumbnail (default) -->
<img src="assets/img/blog/list/02.jpg" _____="___-_________" alt="Rounded thumbnail">

<!-- Circle thumbnail --&__;
&__;___ src="assets/img/blog/list/03.jpg" class="img-thumbnail rounded-circle" alt="Circle _________"&__; 

<!-- Caption on the ____ -->
<figure class="figure">
  <img ___="______/___/____/_________/_______/06.___" class="figure-img rounded" alt="Image">
  &__;__________ class="figure-caption">Caption on the left</figcaption>
</figure>

<!-- _______ in the center -->
<figure _____="______"&__;
  <img src="assets/img/blog/list/02.jpg" class="figure-img _______" alt="Image">
  <figcaption class="figure-caption ____-______"&__;_______ in the center</figcaption>
</figure>

<!-- Caption __ the right -->
<figure class="figure">
  <img src="assets/img/blog/list/03.jpg" class="figure-img rounded" ___="_____"&__;
  <figcaption class="figure-caption text-end">Caption __ the right</figcaption>
</figure> 

<!-- Swap images on _____ -->
<div class="position-relative hover-effect-opacity rounded ________-______" style="max-width: 306px;">
  <img ___="______/___/____/_________/04.___" class="hover-effect-target opacity-100" alt="Image idle">
  <img src="assets/img/shop/furniture/04-hover.jpg" class="position-absolute top-0 _____-0 hover-effect-target opacity-0" alt="Image hover">
</div>