/* Content */
.content {
	/*position: relative;
	padding: 2em;*/
	--pieces-width: 200px;
}

.grid .pieces {
	grid-area: 1 / 1 / 3 / 2;
	width: var(--pieces-width);
	height: calc(var(--pieces-width) * 1.3157);
	max-width: 100%;
	position: relative;
	justify-self: end;
}

/*.grid .pieces {
	grid-area: 1 / 1 / 3 / 2;
	max-width: 250px;
	position: relative;
	justify-self: end;
	margin: 15px auto;
}*/

.grid .piece {
	pointer-events: none;
	filter: grayscale(1);
}

/*
@media screen and (min-width: 60em) {
	.demo-grid .pater {
		bottom: auto;
		top: 12em;
		position: absolute;
	}
}

@media screen and (max-width: 60em) {
	.content__header {
		display: block;
	}
	.content__title {
		margin-bottom: 0.75em;
		font-size: 5em;
	}
	.content__subtitle {
		padding: 0;
	}
	.grid {
		grid-template-columns: auto;
		--pieces-width: 60vw;
	}
	.grid__item:nth-child(odd) {
		grid-column: 1;
	}
	.grid__item-title {
		font-size: 1.5em;
	}
	.grid__item-deco {
		font-size: 7em;
	}
}*/