<article class="post">
  <h1 class="uk-text-center">A Simple UIkit lightbox</h1>
  <div class="uk-container">
    <div class="uk-child-width-1-2@s" uk-grid>
      <div>
        <figure>
          <a href="https://assets.codepen.io/162656/ireland1.jpg" data-caption="Ring of Kerry, County Kerry, Ireland" data-alt="Ring of Kerry, County Kerry, Ireland">
            <img width="1920" height="1280" data-src="https://assets.codepen.io/162656/ireland1.jpg" alt="Ring of Kerry, County Kerry, Ireland" uk-img>
          </a>
        </figure>
      </div>
      <div>
        <figure>
          <a href="https://assets.codepen.io/162656/ireland2.jpg" data-caption="Fintown, Ireland" data-alt="Fintown, Ireland">
            <img width="1920" height="1280" data-src="https://assets.codepen.io/162656/ireland2.jpg" alt="Fintown, Ireland" uk-img>
          </a>
        </figure>
      </div>
      <div>
        <figure>
          <a href="https://assets.codepen.io/162656/ireland3.jpg" data-caption="Anne Street, Dublin, Ireland" data-alt="Anne Street, Dublin, Ireland">
            <img width="1920" height="1280" data-src="https://assets.codepen.io/162656/ireland3.jpg" alt="Anne Street, Dublin, Ireland" uk-img>
          </a>
        </figure>
      </div>
      <div>
        <figure>
          <a href="https://assets.codepen.io/162656/ireland4.jpg" data-caption="Doonagore Castle, Doolin, Ireland" data-alt="Doonagore Castle, Doolin, Ireland">
            <img width="1920" height="1280" data-src="https://assets.codepen.io/162656/ireland4.jpg" alt="Doonagore Castle, Doolin, Ireland" uk-img>
          </a>
        </figure>
      </div>
    </div>
  </div>
</article>

<footer class="page-footer">
  <span>made by </span>
  <a href="https://georgemartsoukos.com/" target="_blank">
    <img width="24" height="24" src="https://assets.codepen.io/162656/george-martsoukos-small-logo.svg" alt="George Martsoukos logo">
  </a>
</footer>

body {
  margin: 40px 0;
}


/* FOOTER STYLES
–––––––––––––––––––––––––––––––––––––––––––––––––– */
.page-footer {
  position: fixed;
  right: 0;
  bottom: 20px;
  display: flex;
  align-items: center;
  font-size: 1rem;
  padding: 5px;
  background: rgba(255, 255, 255, 0.65);
}

.page-footer a {
  display: flex;
  margin-left: 9px;
}

UIkit.lightbox(".post");