



#flexbox {
  display: flex;
  flex-wrap: wrap;
  padding: 0 4px;
  margin: 0;
  width:100%;
    box-sizing: border-box;
  margin: 0;
}

.column {
  flex: 25%;
  max-width: 25%;
  padding: 4px 4px;
    box-sizing: border-box;

}

.column img {
  vertical-align: middle;
  margin-top: 8px;
  filter: grayscale(70%);
    box-sizing: border-box;
	cursor:pointer;

}

.column img:hover {
	 filter: grayscale(0);
	transition: all 1s;
	}

.column:nth-child(even) {
  display: flex;
  flex-direction: column-reverse;
}



@media screen and (max-width: 800px) {
  .column {
    flex: 50%;
    max-width: 50%;
  }
}

