body {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	width: 1024px;
	margin: 40px auto;
}

.link-list li {
	padding-top: 1em;
}

.magic-item {
	margin: 1em;
	padding: 1em;
	border: 1px solid #cca300;
	border-radius: 20px;
	background-color: #fff5cc;
	font-size: 18px;
}

.magic-item .subtext {
	font-style: italic;
	margin-bottom: 1em;
}

.magic-item h2 {
	margin-bottom: .5em;
}

.magic-item .description::before {
	font-weight: bold;
	content: "Description";
}

.magic-item .description p,
.magic-item .notes p {
	padding-left: 1em;
}

.magic-item .notes::before {
	font-weight: bold;
	content: "Notes";
}

.table {
	display: grid;
	grid-template-columns: auto auto;
	justify-items: start;
	justify-content: start;
	grid-gap: 5px 20px;
}

.table .header {
	font-weight: bold;
	padding-bottom: 10px;
	font-size: larger;
}

.table .main {
	font-weight: bold;
}

.table .sub {
	padding-left: 20px;
}

.table .sources {
	font-style: italic;
}

h1.center {
	text-align: center;
}

.compare {
	display: grid;
	grid-template-columns: 3em 13em 22em 22em;
	justify-items: start;
	justify-content: start;
	grid-gap: 20px;
}

.compare .header {
	justify-self: center;
	font-weight: bold;
}

.compare .section {
	grid-column: 1 / span 4;
	font-weight: bold;
	text-align: center;
	justify-self: stretch;
	background-color: grey;
	padding: 5px 0;
}

.compare .level {
	justify-self: end;
}

.compare .feature {
	font-style: italic;
}

.compare ul {
	margin: 0;
}