/* Body Styles */

body {
	display: grid;
	grid-template-rows: auto;
	grid-template-columns: 100%;
	grid-template-areas:
	"headergrid"
	"sectiongrid"
	"footergrid";
}

main {
	grid-area: sectiongrid;
}

.GalleryImg {
	/* shout out to Chris Coyier's pen https://codepen.io/chriscoyier/pen/PXGNom which let me finally build a  masonry layout */
	display: flex;
	flex-wrap: wrap;
	gap: 1vw;
}

main img, main video {
	/* row height has to be set here because wrapped flex rows don't take up height for some reason */
	height: 33vh;
	object-fit: cover;
	flex: 1 0 auto;

}

/* Media queries for mobile */

@media screen and (max-width:37.5rem){
	main {
		grid-template-columns: auto;
		margin: 0 2vw;
		gap: 3vw;
	}
}