{% include 'quarks/_loadCssComponent' with {
    name: '_galleryLightbox'
  } only %}
<div class="row g-3 gy-4 galleryLightbox pb-5 {{ setClass ?? null }}">
    {% for img in images %}
      <section class="col-12 col-md-6 col-lg-4">
        <a href="{{
          img.url({
            format: format
          })
          }}"
          data-type="image"
          data-fslightbox
          class="galleryLightbox--item glightbox">
          <img data-src="{{
            img.getUrl({
              mode: 'crop',
              quality: 96,
              position: 'top-center',
              format: format,
              width: 650,
              height: 220
            })
            }}"
            alt="{{ img.title }}"
            loading="lazy"
            class="lazyload img-fluid imgAbsolute"
            src="" />
        </a>
      </section>
    {% endfor %} 
</div>
  {% include 'quarks/_loadJsComponent' with {
    name:  '_galleryLightbox'
  } only %}