@media (min-resolution: 72dpi) {
	html {
	font-size:12pt;
	}
}
@media (min-resolution: 120dpi) {
	html {
	font-size:14pt;
	}
}
@media (min-resolution: 200dpi) {
	html {
	font-size:20pt;
	}
}
@media (min-resolution: 288dpi) {
	html {
	font-size:24pt;
	}
}
body {
	background-color: lightgray;
}

p {
	color: black;
}

h1 {
	font-size:2rem;
	font-family:Sans-serif;
}

.button {
	font-size:1.5rem;
}

.container {
	display: grid;
	grid-template-columns: 4rem auto 4rem;
	grid-template-rows: auto auto auto;
}

.top {
	grid-column-start: 2;
	grid-column-end: 2;
	grid-row-start: 1;
	grid-row-end: 1;
}
.centered {
	grid-column-start: 2;
	grid-column-end: 2;
	grid-row-start: 2;
	grid-row-end: 2;
}
.bottom {
	grid-column-start: 2;
	grid-column-end: 2;
	grid-row-start: 3;
	grid-row-end: 3;
}

.idea {
	font-size:1.5rem;
	font-family:Sans-serif;
}

.boxed {
	text-align:center;
	height:50rem;
	width:50%;
	min-width:500px;
}