.block-gallery {
  .gallery-posts {
    display: grid;
    grid-gap: 0.5rem;
    grid-template-columns: repeat(12, 1fr);
    .card {
      grid-column: span 4;
      > a {
         display: block;
         object-fit: cover;
         height: 100%;
       }

       img.card-img-top {
         width: 100%;
         height: 100%;
         object-fit: cover;
         display: block;
       }
    }
  }

  .gallery-posts.mosaic {
    .card:nth-child(1) {
      grid-column: span 8;
      grid-row: span 1;
    }

    .card:nth-child(2) {
      grid-column: span 4;
      grid-row: span 2;
    }

    .card:nth-child(3) {
      grid-column: span 4;
      grid-row: span 1;
    }

    .card:nth-child(4) {
      grid-column: span 4;
      grid-row: span 2;
    }

    .card:nth-child(5) {
      grid-column: span 4;
      grid-row: span 1;
    }

    .card:nth-child(6) {
      grid-column: span 4;
      grid-row: span 1;
    }
  }

  /* specialisations for gallery with 'n' posts */
  .gallery-posts.mosaic[data-gallery-posts-count="5"]{
    .card:nth-child(2){
      grid-column: span 4;
      grid-row: span 4;
    }
  }

  .gallery-posts.mosaic[data-gallery-posts-count="3"]{
    .card:nth-child(2){
      grid-column: span 4;
      grid-row: span 1;
    }

    .card:nth-child(3){
      grid-column: span 12;
      grid-row: span 1;
    }
  }

  @media (max-width: 767px) {
    .card {
      grid-column: span 12 !important;
      grid-row: span 1 !important;;
    }
  }
}