Image container

Lorem Ipsum is simply dummy text of the printing and typesetting industry.
Lorem Ipsum is simply dummy text of the printing and typesetting industry.
Lorem Ipsum is simply dummy text of the printing and typesetting industry.
    <div class="image-container">
        <img />
        <div class="overlay"> overlay text </div>
    </div>

    <div class="image-container light">
        <img />
        <div class="overlay"> overlay text </div>
    </div>

    <div class="image-container bg-color-blue">
        <img />
        <div class="overlay"> overlay text </div>
    </div>

Simple collection (16x9)

This image with overlay
Lorem Ipsum is simply dummy text of the printing and typesetting industry.
    <div class="image-collection">
        <div><img /></div>
        ...
        <div><img /></div>
    </div>

Simple collection (4x3)

This image with overlay
Lorem Ipsum is simply dummy text of the printing and typesetting industry.
    <div class="image-collection p4x3">
        <div><img /></div>
    </div>

Selected image in collection

    <div class="image-collection">
        <div class="selected"><img /></div>
    </div>

Overlay for image in collection

    <div class="image-collection">
        <div>
            <img />
            <div class="overlay">Sample text</div>
        </div>
    </div>

Empty image container

    <div class="image-collection">
        <div></div>
    </div>