.masonry
  column-gap: 30px
  column-fill: initial

  @media only screen and (min-width: 1024px)
    column-count: 4

  @media only screen and (max-width: 1023px) and (min-width: 768px)
    column-count: 3

  @media only screen and (max-width: 767px) and (min-width: 540px)
    column-count: 2

  @media only screen and (max-width: 539px)
    .brick
      width: 100%
      margin: 0 auto
      text-align: center
      img
        margin: 0 auto .5rem

.item
  background-color: #eee
  display: inline-block
  margin: 0 0 1em
  width: 100%

.brick
  margin-bottom: .5rem
  display: inline-block
  vertical-align: top

  img
    width: 100%
    max-width: 300px
    margin: 0 auto 1rem