* { box-sizing: border-box; }

body { font-family: sans-serif; }

/* ---- grid ---- */

.grid {
  background: #EEE;
  /* center */
  margin: 0 auto;
}

/* clearfix */
.grid:after {
  content: '';
  display: block;
  clear: both;
}

/* ---- grid-item ---- */

/* .grid-item {
  width: 180px;
  height: 120px;
  float: left;
  background: #D26;
  border: 2px solid #333;
  border-color: hsla(0, 0%, 0%, 0.5);
  border-radius: 5px;
} */

.grid-item {
  /* column-count: 6; */
  width: 24%;
  column-gap: 0px;
  /* border: 2px solid hsla(0, 0%, 0%, 0.5); */
  /* float: center; */
}

/* .grid-item--height2 { height: 200px; } */
/* .grid-item--height3 { height: 260px; } */

/* .grid-item--width2 { width: 200px; } */
/* .grid-item--width3 { width: 260px; } */

/* .grid-item--height2 { }
.grid-item--height3 { }
.grid-item--width2 { }
.grid-item--width3 { } */