:root {
	/* Rosé Pine Dawn */
	--rp-base: rgb(250, 244, 237);
	--rp-surface: rgb(255, 250, 243);
	--rp-overlay: rgb(242, 233, 222);
	--rp-muted: rgb(152, 147, 165);
	--rp-subtle: rgb(121, 117, 147);
	--rp-text: rgb(87, 82, 121);
	--rp-love: rgb(180, 99, 122);
	--rp-gold: rgb(234, 157, 52);
	--rp-rose: rgb(215, 130, 126);
	--rp-pine: rgb(40, 105, 131);
	--rp-foam: rgb(86, 148, 159);
	--rp-iris: rgb(144, 122, 169);
	--rp-highlight-low: rgb(244, 237, 232);
	--rp-highlight-med: rgb(223, 218, 217);
	--rp-highlight-high: rgb(206, 202, 205);
	--sizeUnit: 8px;
}

@media (prefers-color-scheme: dark) {
	:root {
		/* Rosé Pine */
		--rp-base: rgb(25, 23, 36);
		--rp-surface: rgb(31, 29, 46);
		--rp-overlay: rgb(38, 35, 58);
		--rp-muted: rgb(110, 106, 134);
		--rp-subtle: rgb(144, 140, 170);
		--rp-text: rgb(224, 222, 244);
		--rp-love: rgb(235, 111, 146);
		--rp-gold: rgb(246, 193, 119);
		--rp-rose: rgb(235, 188, 186);
		--rp-pine: rgb(49, 116, 143);
		--rp-foam: rgb(156, 207, 216);
		--rp-iris: rgb(196, 167, 231);
		--rp-highlight-low: rgb(33, 32, 46);
		--rp-highlight-med: rgb(64, 61, 82);
		--rp-highlight-high: rgb(82, 79, 103);
	}
}

body {
	background: var(--rp-base);
	color: var(--rp-text);
	font-family: Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif;
	margin: var(--sizeUnit) auto;
	max-width: 900px;
}

#divbodyholder {
	padding: var(--sizeUnit);
	background-color:var(--rp-base);
	width: 100%;
	max-width: 874px;
	margin: calc(var(--sizeUnit) * 3) auto;
}

#divbody {
	border: solid 1px var(--rp-highlight-high);
	background-color: var(--rp-base);
	padding: 0px calc(var(--sizeUnit) * 6) calc(var(--sizeUnit) * 3) calc(var(--sizeUnit) * 6);
	top: 0;
}

.headerholder {
	background-color: var(--rp-highlight-med);
	border-top: solid 1px var(--rp-highlight-high);
	border-left: solid 1px var(--rp-highlight-high);
	border-right: solid 1px var(--rp-highlight-high);
}

.header {
	width: 100%;
	max-width: calc(var(--sizeUnit) * 100);
	margin: 0px auto;
	padding-top: calc(var(--sizeUnit) * 3);
	padding-bottom: var(--sizeUnit);
}

.content { margin-bottom: 5%; }

.nomargin { margin: 0; }

.description {
	margin-top: var(--sizeUnit);
	border-top: solid 1px var(--rp-pine);
	padding: var(--sizeUnit) 0;
}

h3 {
	font-size: 20pt;
	width: 100%;
	font-weight: bold;
	margin-top: calc(var(--sizeUnit) * 4);
	margin-bottom: 0;
}

.clear{ clear: both; }

#footer {
	padding-top: 10px;
	border-top: solid 1px var(--rp-pine);
	color: var(--rp-text);
	text-align: center;
	font-size: small;
	font-family: Roboto,Helvetica Neue,Arial,Noto Sans,sans-serif;
}

a {
	text-decoration: none;
	color: var(--rp-love) !important;
}

a:visited {
	text-decoration: none;
	color: var(--rp-iris) !important;
}

blockquote {
	background-color: var(--rp-base);
	border-left: solid calc(var(--sizeUnit) * 0.5) var(--rp-foam);
	margin-left: calc(var(--sizeUnit) * 1.5);
	padding: calc(var(--sizeUnit) * 1.5) calc(var(--sizeUnit) * 1.5) calc(var(--sizeUnit) * 1.5) calc(var(--sizeUnit) * 3);
}

blockquote img {
	margin: calc(var(--sizeUnit) * 1.5) 0px;
}

blockquote iframe {
	margin: calc(var(--sizeUnit) * 1.5) 0px;
}