* { box-sizing: border-box; }

section {
	background-color: royalblue;

	counter-reset: grid-item;

	> * {
		background-color: gold;
		padding: 10px;
		font-family: Consolas, 'Courier New', Courier, monospace;
		font-size: 0.8rem;
		text-align: center;
		counter-increment: grid-item;
		display: flex;
		align-items: center;
		justify-content: center;
	}

	span {
		background-color: crimson;
		color: white;
	}

	div, span {
		&::before {
			content: counter(grid-item);
		}
	}
}

pre {
	text-align: center;
}

button {
	background-color: gold;
	border: none;
	border-radius: 20px;
	padding: 10px;
	margin-bottom: 10px;
	cursor: pointer;

	&:nth-of-type(2) {
		float: right;
	}
}