.card {
  flex-grow: 1;
  flex-basis: 31%;
  flex-basis: 300px;
  overflow: hidden;
  margin-bottom: 16px;
  margin-left: 16px;
  max-width: 31%;
  max-height: 290px;
  cursor: pointer;
}

.card:hover {
  background: #f8f9fa;
  transform: translateY(-8px);
}

.cardImage {
  margin: -16px -24px 16px -24px;
  width: calc(100% + 24px + 24px);
  height: 135px;
  background-position: center center;
  background-size: cover;
  background-repeat: no-repeat;
}

.cardsGrid {
  display: flex;
  flex-flow: row wrap;
  margin-left: -16px;
}

.cardList {
  margin-bottom: 1.1rem;
}

.cardListLabel {
  white-space: nowrap;
  font-weight: bold;
}

.card {
  flex-grow: 1;
  flex-basis: 31%;
  flex-basis: 300px;
  overflow: hidden;
  margin-bottom: 16px;
  margin-left: 16px;
  /*max-width: 31%;*/
  max-height: 290px;
  cursor: pointer;
}

.card:hover {
  background: #f8f9fa;
  transform: translateY(-8px);
}

.cardImage {
  margin: -16px -24px 16px -24px;
  width: calc(100% + 24px + 24px);
  height: 135px;
  background-position: center center;
  background-size: cover;
  background-repeat: no-repeat;
}

.cardsGrid {
  display: flex;
  flex-flow: row wrap;
  margin-left: -16px;
}

.cardList {
  margin-bottom: 1.1rem;
}

.cardListLabel {
  white-space: nowrap;
  font-weight: bold;
}

Make card take available space in grid
Make card take available space in grid
