path: root/includes/www.css

@media screen {
	body {
		max-width: 50em;
	}

	hr {
		color: var(--white);
	}

	a:link {
		color: var(--slate);
	}

	a:visited {
		color: var(--charcoal);
	}

	a:visited code {
		color: var(--slate);
	}

	header a:link,
	header a:visited,
	header a:active,
	nav a:link,
	nav a:visited,
	nav a:active {
		background-color: var(--balboa);
		color: var(--white);
		text-decoration: underline solid var(--balboa);
	}

	a:hover {
		transition: 0.25s;
		color: var(--white);
	}

	nav a:hover {
		transition: 0.25s;
		text-decoration: underline solid var(--slate);
	}

	p code {
		background-color: var(--charcoal);
		border-radius: var(--box-radius);
	}

	pre {
		white-space: pre-wrap;
		display: block;
		background-color: var(--charcoal);
		padding: 1em;
		border-radius: var(--box-radius);
		border-left: var(--box-border);
		border-right: var(--box-border);
		overflow: auto;
	}

	.description {
		background-color: var(--ruby);
		padding: 1em;
		border-radius: var(--box-radius);
		border-left: var(--box-border);
		border-right: var(--box-border);
	}

	h1,
	blockquote {
		font-style: oblique;
	}

	ul {
		list-style: none;
		padding: 0;
		margin: 0;
	}

	article ul li {
		padding: 0.5em;
	}

	ul li:before {
		content: "▸";
		padding-right: 0.5em;
	}

	article ol li {
		padding: 0.5em;
	}

	p img {
		border-left: var(--box-border);
		border-radius: var(--box-radius);
		border-right: var(--box-border);
		display: block;
		height: auto;
		margin-left: auto;
		margin-right: auto;
		margin-top: 1em;
		max-width: 75%;
	}

	iframe {
		aspect-ratio: 16 / 9;
		border-left: var(--box-border);
		border-radius: var(--box-radius);
		border-right: var(--box-border);
		display: block;
		margin-bottom: 1em;
		margin-left: auto;
		margin-right: auto;
		width: 75%;
	}

	.list {
		overflow-x: auto;
	}

	.list table {
		width: 100%;
	}

	.list td,
	th {
		padding: 0.5em;
		text-align: left;
		border-bottom: 1px solid var(--charcoal);
	}

	.form {
		text-align: center;
	}

	.form input {
		font-size: 1em;
		margin-top: 1em;
		border-radius: 3em;
		box-sizing: border-box;
		padding: 0.5em;
		border: 0;
	}

	.form .description {
		display: none;
	}

	footer p {
		font-size: 0.75em;
	}

	.centered {
		text-align: center;
	}

	a.donation,
	a.donation:visited {
		background-color: var(--ruby);
		border-radius: var(--box-radius);
		padding: 1em;
		text-decoration: none;
		color: var(--slate);
		border-left: var(--box-border);
		border-right: var(--box-border);
	}

	a.donation:hover {
		color: var(--white);
	}

	button {
		background-color: var(--white);
		color: var(--balboa);
		border-radius: var(--box-radius);
		font-size: 1.5em;
		font-family: "Iosevka Slab";
	}
}

.row {
	display: flex;
	justify-content: space-between;
}

.set {
	display: flex;
	justify-content: space-evenly;
}

@media print {
	body {
		font-size: 10pt;
	}

	body, a {
		color: #195970;
	}

	* {
		margin: 6px;
	}

	.printhide {
		display: none;
	}
}