img {
  width: 100%;
}

img:hover {
opacity: 0.7;
cursor: pointer;
}

.mItem {

}

.masonry {
	column-count: 4;
	column-gap: 16px;
	margin: 20px;
}

.masonry .mItem {
  display: inline-block;
  margin-bottom: 16px;
  width: 100%;
}

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

.masonry {
    column-count: 6;
}
  
    .wrapper {
	display: grid;
}
}


@media only screen and (max-width: 768px) {
  
  .wrapper {
  	grid-template-columns: 1fr;
  	margin: 0 auto;	
  }
  
  .masonry {
    column-count: 3;
  }

.imagebox {
	grid-column: 1;
	grid-row: 3;
}
}



@media only screen and (max-width: 480px) {
  
.wrapper {
display: grid;
grid-template-columns: 1fr;
justify-content: center;
width: 100%;
}

.imagebox {
	grid-column: 1;
	grid-row: 3;
}
  
  .masonry {
    column-count: 1;
}
}