Photo Collage

@supports (display: grid) and (grid-template-columns: repeat(3, 1fr))
and (grid-row-gap: 1%) and (grid-gap: 1%) and (grid-column-gap: 1%) {
  .c-photo-collage {
    display: grid;
    grid-gap: 1.5rem 2.4390244%;
  }
  .c-photo-collage > :nth-child(1) {
    grid-column: 1 / span 3;
    grid-row: 1;
  }
  .c-photo-collage > :nth-child(2) {
    grid-column: 2;
    grid-row: 2;
  }
  .c-photo-collage > :nth-child(3) {
    grid-column: 4;
    grid-row: 1;
    align-self: flex-end;
  }
  .c-photo-collage > :nth-child(4) {
    grid-column: 3 / span 2;
    grid-row: 2 / span 2;
  }};