.grid-container {
  display: grid;
  grid-gap: 20px;
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
}

.grid-container__1,
.grid-container__2,
.grid-container__3,
.grid-container__4,
.grid-container__5 {
  grid-template-columns: 100%;
}

.center-align-grid {
    align-items: center;
}

@media only screen and (min-width: 680px) {

.grid-container__2,
.grid-container__3,
.grid-container__4,
.grid-container__5,
.grid-container__6 {
  grid-template-columns: repeat(2, minmax(0, 0.5fr));
}

}

@media screen and (min-width: 768px) {


.grid-container__4, .grid-container__6 {
  grid-template-columns: repeat(3, minmax(0, 0.33fr));
}

}

@media only screen and (min-width: 960px) {

.grid-container__3 {
  grid-template-columns: repeat(3, minmax(0, 0.3333fr));
}

.grid-container__4 {
  grid-template-columns: repeat(4, minmax(0, 0.25fr));
}

.grid-container__5 {
  grid-template-columns: repeat(5, minmax(0, 0.2fr));
}

.grid-container__6 {
  grid-template-columns: repeat(4, minmax(0, 0.25fr));
}

}

@media only screen and (min-width: 1200px) {

.grid-container__6 {
  grid-template-columns: repeat(6, minmax(0, 0.18fr));
}

}

@media only screen and (min-width: 1400px) {

}
