.grid {
	position: relative;
	max-width: 1500px;
 	margin: 0 auto;
}
.js .grid::after {
	content: '';
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	pointer-events: none;
	background: #252323 url(../img/loading.svg) no-repeat 50% 75px;
	background-size: 60px auto;
	-webkit-transition: opacity 0.3s;
	transition: opacity 0.3s;
}

.js .grid--loaded::after {
	opacity: 0;
}

.grid__sizer,
.grid__item {
	width: 200px;
	padding: 10px;
}

.grid__item--current {
	opacity: 0 !important;
}

.img-wrap {
	display: block;
}

.img-wrap:focus,
.img-wrap:hover {
	outline: none;
}

.img-wrap img {
	display: block;
	max-width: 100%;
}
@media screen and (max-width: 640px) {
	.grid__sizer,
	.grid__item {
		width: 200px;
	}
 }
 
 @media screen and (min-width: 640px) and (max-width: 1280px) {
	.grid {
		max-width: 1800px;
	}
	.grid__sizer,
	.grid__item {
		width: 250px;
	}
 }
 
 @media screen and (min-width: 1280px) {
	.grid {
		max-width: 1800px;
	}
	.grid__sizer,
	.grid__item {
		width: 300px;
	}
 }
