.grid { max-width: 1900px; width:100%; list-style: none; margin: 30px auto 200px; padding: 0; }
	.grid li { display: block; float: left; width: 33%; opacity: 0; }
		.grid li.shown, .no-js .grid li, .no-cssanimations .grid li { opacity: 1; }
			.grid li a { padding:10px; display:block; position:relative; }
			.grid li a, .grid li img { outline: none; border: none; display: block; max-width: 100%; transition:all 500ms ease 0s; }
			.grid li img:hover { transform:scale(0.98); opacity:0.6; }

			.grid.effect-1 li.animate { -webkit-animation: fadeIn 0.65s ease forwards; animation: fadeIn 0.65s ease forwards; }

@-webkit-keyframes fadeIn {
	0% { }
	100% { opacity: 1; }
}

@keyframes fadeIn {
	0% { }
	100% { opacity: 1; }
}

@media screen and (max-width: 900px) {
	.grid li { width: 50%; }
}
@media screen and (max-width: 400px) {
	.grid li { width: 100%; }
}