.grid {
  display: grid;
}

.grid-2 {
  grid-template-columns: repeat(2, 1fr);
}

.grid-3 {
  grid-template-columns: repeat(3, 1fr);
}

.grid-4 {
  grid-template-columns: repeat(4, 1fr);
}


.grid-1-2 {
  grid-template-columns: 1fr 2fr;
}

.grid-2-1 {
  grid-template-columns: 2fr 1fr;
}

.grid-2-3 {
  grid-template-columns: 2fr 3fr;
}

.grid-3-2 {
  grid-template-columns: 3fr 2fr;
}

@media screen and (max-width: 640px) {
.grid.m-grid-1 {
  grid-template-columns: 1fr !important;
}
.grid.m-grid-2 {
  grid-template-columns: repeat(2, 1fr) !important;
}
}

.gap {
  gap: 1em;
}