a img {
	border:0;
}
.project-layout {
	display: grid;
	grid-template-columns: minmax(300px,400px) minmax(600px,1080px);
	grid-column-gap: 20px;
	align-content: start;
	align-items:start;
}


.aside {
	margin-top:10px;
}

.heroimage {
	margin-top:10px;
	object-fit: contain;
	grid-row-end: span 3;
}

.heroimage img {
	width:100%;
}

.vimeo {
margin-bottom:20px;
}

.contain {

	object-fit: contain;
}
.thumbs {
	grid-column-start: 2;
	grid-column-end: 2;
	grid-row-end: span 10;
	object-fit:cover;

}
.span-2 {
	grid-column-end: span 2;
	grid-row-end: span 2;
}

.grid-layout {
	padding:0;
	object-fit:cover;
}

.grid-item {
	background-color: transparent;
	object-fit: cover;
	overflow:hidden;
}

.grid-item img {
	width:100%;
	object-fit: cover;
}
@media only screen and (max-width : 736px) {
.project-layout {
	display: grid;
	grid-template-columns: 1fr;
	grid-column-gap: 20px;
	align-content: start;
	align-items:start;
}

.thumbs {
	grid-column-start: 1;
	grid-column-end: 1;

}

.grid-layout {

	grid-template-columns: repeat(auto-fill, minmax(20px, 1fr));
	grid-auto-rows: minmax(20px,20px);
	padding:2px;
	grid-gap:2px;
	justify-content: space-evenly;	
}

.grid-item {
	object-fit: cover;
	overflow:hidden;
}

.grid-item img {
	width:100%;
	object-fit: cover;
	overflow: hidden;
	border:0;
}

.span-2 {
	grid-column-end: span 4;
	grid-row-end: span 4;
}

}