/*
***************
* grid container
***************
*/
.grid-container {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: auto;
}

.grid-container-75-25-sm {
  grid-template-columns: minmax(0, 3fr) minmax(0, 1fr);
}

.grid-container-66-33-sm {
  grid-template-columns: minmax(0, 2fr) minmax(0, 1fr);
}

.grid-container-50-50-sm {
  grid-template-columns: repeat(2, 1fr);
}

.grid-container-33-33-33-sm {
  grid-template-columns: repeat(3, 1fr);
}

.grid-container-25-25-25-25-sm {
  grid-template-columns: repeat(4, 1fr);
}

.grid-container-33-66-sm {
  grid-template-columns: minmax(0, 1fr) minmax(0, 2fr);
}

.grid-container-25-75-sm {
  grid-template-columns: minmax(0, 1fr) minmax(0, 3fr);
}

@media (min-width: 768px) {
  .grid-container-75-25-lg {
    grid-template-columns: minmax(0, 3fr) minmax(0, 1fr);
  }

  .grid-container-66-33-lg {
    grid-template-columns: minmax(0, 2fr) minmax(0, 1fr);
  }

  .grid-container-50-50-lg {
    grid-template-columns: repeat(2, 1fr);
  }

  .grid-container-33-33-33-lg {
    grid-template-columns: repeat(3, 1fr);
  }

  .grid-container-25-25-25-25-lg {
    grid-template-columns: repeat(4, 1fr);
  }

  .grid-container-33-66-lg {
    grid-template-columns: minmax(0, 1fr) minmax(0, 2fr);
  }

  .grid-container-25-75-lg {
    grid-template-columns: minmax(0, 1fr) minmax(0, 3fr);
  }
}