:root {
	--text-color: #262626;
	--text-color-light: #666666;
	--primary-color: #0888d4;
}

body {
	font-family: 'Literata', serif;
	font-optical-sizing: auto;
	font-weight: normal;
	font-style: normal;
	line-height: 27px;
	font-size: 1em;
	color-scheme: light;

	width: 100vw;
	overflow-x: hidden;
	margin: 5em auto;
	color: var(--text-color, #262626);
}

.ctn {
	overflow-x: visible;
	padding: 0 1em;
	width: calc(100% - 2em);
}

.ctn * {
	max-width: 800px;
	margin-left: auto;
	margin-right: auto;
}

.ctn table {
	max-width: max(80vw, 800px);
	min-width: min(80vw, 800px);
}

h1 *,
h2 *,
h3 *,
h4 *,
h5 *,
h6 * {
	font-weight: bold;
}

table {
	border-collapse: collapse;
}

th,
td {
	border: 1px solid var(--text-color, #262626);
	padding: 0.5em;
}
th {
	background-color: #f0f0f0;
	font-weight: bold;
}

a {
	color: var(--primary-color, #0888d4);
	text-decoration: none;
}
a:hover {
	text-decoration: underline;
}

ul {
	padding-left: 0;
	list-style-position: inside;
	list-style-type: '-  ';
}

li + li {
	margin-top: 0.5em;
}

em {
	font-style: italic;
	color: var(--text-color-light, #666666);
}

strong {
	font-weight: bold;
}