#grid {
	display: grid;
	grid-template-columns: repeat(12, 1fr);
	grid-gap: 16px; // obsolete
	gap: 16px;
}

#grid-col-1 {
	grid-column: 1 / span 12;
}

#grid-col-2 {
	grid-column: 1 / span 6;
}

#grid-col-3 {
	grid-column: 7 / span 6;
}

#grid-col-4 {
	grid-column: 1 / span 4;
}

#grid-col-5 {
	grid-column: 5 / span 8;
}


@media screen and (max-device-width: 992px) {
	#grid {
		grid-template-columns: repeat(2, 1fr);
	}

	 #grid .grid-col {
		grid-column: auto;
		aspect-ratio: 1;
	}
}

@media screen and (max-device-width: 768px) {
	#grid {
		grid-template-columns: repeat(1, 1fr);
	}
}