.gallery {
  margin: -0.75rem;

  .grid-sizer {
    width: calc(25% - 1.5rem);
    margin: 0 0.75rem;
  }

  .grid-item {
    width: calc(25% - 1.5rem);
    margin: 0.75rem;
  }
}

@media (max-width: $width-content) {
  .gallery {
    margin: -0.5rem;

    .grid-sizer {
      width: calc(33% - 1rem);
      margin: 0 0.5rem;
    }

    .grid-item {
      width: calc(33% - 1rem);
      margin: 0.5rem;
    }
  }
}

@media (max-width: $width-mobile) {
  .gallery {
    margin: -0.375rem;

    .grid-sizer {
      width: calc(50% - 0.75rem);
      margin: 0 0.375rem;
    }

    .grid-item {
      width: calc(50% - 0.75rem);
      margin: 0.375rem;
    }
  }
}