IMAGES

                    
<div class="sw_grid-row">
    <div class="sw_grid sw_grid-third">
        <img src="<?= $url ?>/assets/img/bg1.jpg" class="sw_img" alt="" />
        <figcaption class="sw_img-caption">Swift Image</figcaption>
    </div>

    <div class="sw_grid sw_grid-third">
        <img src="<?= $url ?>/assets/img/bg2.jpg" class="sw_img sw_rsq-2" alt="" />
    </div>

    <div class="sw_grid sw_grid-third">
        <img src="<?= $url ?>/assets/img/bg3.jpg" width="150px" height="150px" class="sw_img-fit-cover sw_round"  alt="" />
    </div>
</div>

                

                    
<div class="sw_grid-row">
    <div class="sw_grid sw_grid-half">
        <img src="<?= $url ?>/assets/img/bg1.jpg" class="sw_img sw_img-thumbnail" alt="" />
    </div>

    <div class="sw_grid sw_grid-half">
        <img src="<?= $url ?>/assets/img/bg2.jpg" class="sw_img sw_rsq-2" alt="" />
        <div class="sw_img-overlay st_align-center">
            <p class="st-white font_xd-2 sw_pd-4">Lorem ipsum dolor sit amet, consectetur adipisicing elit. Consequuntur dolores eveniet non quod tempora!
            Cumque iste modi nam nisi odio qui quibusdam sed sit unde velit. Ab dicta eveniet numquam!</p>
        </div>
    </div>
</div>

                

                    
<div class="sw_grid-row">
    <div class="sw_grid sw_grid-auto">
        <img src="<?= $url ?>/assets/img/bg1.jpg" class="sw_img-filter-sepia" width="150px" height="150px" alt="" />
    </div>

    <div class="sw_grid sw_grid-auto">
        <img src="<?= $url ?>/assets/img/bg2.jpg" class="sw_img-filter-saturate" width="150px" height="150px" alt="" />
    </div>

    <div class="sw_grid sw_grid-auto">
        <img src="<?= $url ?>/assets/img/bg1.jpg" class="sw_img-filter-blur" width="150px" height="150px" alt="" />
    </div>

    <div class="sw_grid sw_grid-auto">
        <img src="<?= $url ?>/assets/img/bg2.jpg" class="sw_img-filter-bright" width="150px" height="150px" alt="" />
    </div>

    <div class="sw_grid sw_grid-auto">
        <img src="<?= $url ?>/assets/img/bg1.jpg" class="sw_img-filter-contrast" width="150px" height="150px" alt="" />
    </div>

    <div class="sw_grid sw_grid-auto">
        <img src="<?= $url ?>/assets/img/bg2.jpg" class="sw_img-filter-gray" width="150px" height="150px" alt="" />
    </div>

    <div class="sw_grid sw_grid-auto">
        <img src="<?= $url ?>/assets/img/bg1.jpg" class="sw_img-filter-hue" width="150px" height="150px" alt="" />
    </div>

    <div class="sw_grid sw_grid-auto">
        <img src="<?= $url ?>/assets/img/bg2.jpg" class="sw_img-filter-opacity" width="150px" height="150px" alt="" />
    </div>

    <div class="sw_grid sw_grid-auto">
        <img src="<?= $url ?>/assets/img/bg1.jpg" class="sw_img-filter-shadow" width="150px" height="150px" alt="" />
    </div>

    <div class="sw_grid sw_grid-auto">
        <img src="<?= $url ?>/assets/img/bg2.jpg" class="sw_img-mask" width="150px" height="150px" alt="" />
    </div>
</div>