HTML-Prototype der OTH-Regensburg

<div class="c-gallery o-grid o-grid-1-1 o-grid-1-1-1@tablet o-grid-1-1-1-1@desktop o-grid-1-1-1-1-1@desktop-wide"><a class="c-lightbox" id="lightbox-1" href="https://picsum.photos/id/1003/1200/800" title="Bild vergrößern" data-group="gallery">
    <picture>
      <source srcset="https://picsum.photos/id/1003/208/208" media="(min-width:768px)"/>
      <source srcset="https://picsum.photos/id/1003/160/160" media="(min-width:500px)"/>
      <source srcset="https://picsum.photos/id/1003/120/120" media="(min-width:0)"/><img class="image__default" src="https://picsum.photos/id/1003/208/208" alt="Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa." width="208" height="208"/>
    </picture></a><a class="c-lightbox" id="lightbox-2" href="https://picsum.photos/id/1004/1200/800" title="Bild vergrößern" data-group="gallery">
    <picture>
      <source srcset="https://picsum.photos/id/1004/208/208" media="(min-width:768px)"/>
      <source srcset="https://picsum.photos/id/1004/160/160" media="(min-width:500px)"/>
      <source srcset="https://picsum.photos/id/1004/120/120" media="(min-width:0)"/><img class="image__default" src="https://picsum.photos/id/1004/208/208" alt="Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa." width="208" height="208"/>
    </picture></a><a class="c-lightbox" id="lightbox-3" href="https://picsum.photos/id/1005/1200/800" title="Bild vergrößern" data-group="gallery">
    <picture>
      <source srcset="https://picsum.photos/id/1005/208/208" media="(min-width:768px)"/>
      <source srcset="https://picsum.photos/id/1005/160/160" media="(min-width:500px)"/>
      <source srcset="https://picsum.photos/id/1005/120/120" media="(min-width:0)"/><img class="image__default" src="https://picsum.photos/id/1005/208/208" alt="Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa." width="208" height="208"/>
    </picture></a><a class="c-lightbox" id="lightbox-4" href="https://picsum.photos/id/1006/1200/800" title="Bild vergrößern" data-group="gallery">
    <picture>
      <source srcset="https://picsum.photos/id/1006/208/208" media="(min-width:768px)"/>
      <source srcset="https://picsum.photos/id/1006/160/160" media="(min-width:500px)"/>
      <source srcset="https://picsum.photos/id/1006/120/120" media="(min-width:0)"/><img class="image__default" src="https://picsum.photos/id/1006/208/208" alt="Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa." width="208" height="208"/>
    </picture></a><a class="c-lightbox" id="lightbox-5" href="https://picsum.photos/id/1011/1200/800" title="Bild vergrößern" data-group="gallery">
    <picture>
      <source srcset="https://picsum.photos/id/1011/208/208" media="(min-width:768px)"/>
      <source srcset="https://picsum.photos/id/1011/160/160" media="(min-width:500px)"/>
      <source srcset="https://picsum.photos/id/1011/120/120" media="(min-width:0)"/><img class="image__default" src="https://picsum.photos/id/1011/208/208" alt="Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa." width="208" height="208"/>
    </picture></a><a class="c-lightbox" id="lightbox-6" href="https://picsum.photos/id/1012/1200/800" title="Bild vergrößern" data-group="gallery">
    <picture>
      <source srcset="https://picsum.photos/id/1012/208/208" media="(min-width:768px)"/>
      <source srcset="https://picsum.photos/id/1012/160/160" media="(min-width:500px)"/>
      <source srcset="https://picsum.photos/id/1012/120/120" media="(min-width:0)"/><img class="image__default" src="https://picsum.photos/id/1012/208/208" alt="Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa." width="208" height="208"/>
    </picture></a><a class="c-lightbox" id="lightbox-7" href="https://picsum.photos/id/1015/1200/800" title="Bild vergrößern" data-group="gallery">
    <picture>
      <source srcset="https://picsum.photos/id/1015/208/208" media="(min-width:768px)"/>
      <source srcset="https://picsum.photos/id/1015/160/160" media="(min-width:500px)"/>
      <source srcset="https://picsum.photos/id/1015/120/120" media="(min-width:0)"/><img class="image__default" src="https://picsum.photos/id/1015/208/208" alt="Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa." width="208" height="208"/>
    </picture></a><a class="c-lightbox" id="lightbox-8" href="https://picsum.photos/id/1018/1200/800" title="Bild vergrößern" data-group="gallery">
    <picture>
      <source srcset="https://picsum.photos/id/1018/208/208" media="(min-width:768px)"/>
      <source srcset="https://picsum.photos/id/1018/160/160" media="(min-width:500px)"/>
      <source srcset="https://picsum.photos/id/1018/120/120" media="(min-width:0)"/><img class="image__default" src="https://picsum.photos/id/1018/208/208" alt="Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa." width="208" height="208"/>
    </picture></a>
</div>