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

.grid {
  background: #EEE;
  width:96%;
  border: 1px solid #02c2c9 ;
  margin-left:auto;
  margin-right:auto;
}

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

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

.grid-sizer,
.grid-item {
  width: 32%;
		 -webkit-box-sizing: border-box;
		 -moz-box-sizing: border-box;
		  box-sizing: border-box;
		  margin:.3125em;
}

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

.grid-item--width2 { width:  64%; }
.grid-item--width3 { width:  99%; }
/*.grid-item--width4 { width:  96%; }*/

.grid-item--height2 { height: 290px; }
.grid-item--height3 { height: 435px; }
/*.grid-item--height4 { height: 500px; }}*/