@font-face {
  font-family: 'Old Standard TT';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/resources/fonts/OldStandardTT-Regular.woff2') format('woff2');
  unicode-range: U+0000-00FF,U+0100-024F,U+1E00-1EFF,U+2018-201E;
}

@font-face {
  font-family: 'Old Standard TT';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url('/resources/fonts/OldStandardTT-Italic.woff2') format('woff2');
  unicode-range: U+0000-00FF,U+0100-024F,U+1E00-1EFF,U+2018-201E;
}

@font-face {
  font-family: 'Old Standard TT';
  font-style: normal;
  font-weight: bold;
  font-display: swap;
  src: url('/resources/fonts/OldStandardTT-Bold.woff2') format('woff2');
  unicode-range: U+0000-00FF,U+0100-024F,U+1E00-1EFF,U+2018-201E;
}

:root {
	--panel-background-color: #ffffff;
	--border-color: #efe9e9;
	--button-color: #eee;
	--button-color-hover: #e0b0b0;
	--button-color-toggled: #e6b0b0;
	--site-background-color: #f9f9ee;
	--panel-text-color: #000000;
	--panel-text-color-muted: #333333;
	--overlay-background-color: rgba(249, 249, 249, .7);
	--overlay-background-color-strong: rgba(249, 249, 249, .8);
	--top-bar-title-height: 75px;

	/* Variables used for the actual page content. */
	--content-background-color: #ffffff;
	--content-border: #efe9e9;
	--content-hover: #e0b0b0;
	--content-text-color: #000000;
	--content-text-color-muted: #222222;
	--rubric: red;
	--native-scheme: light;
}

[data-theme="dark"] {
	--panel-background-color: #202126;
	--border-color: #3a3b44;
	--button-color: #26272c;
	--button-color-hover: #313239;
	--button-color-toggled: #393a42;
	--site-background-color: #1a1a1e;
	--panel-text-color: #cfcbbc;
	--panel-text-color-muted: #85816f;
	--overlay-background-color: rgba(26, 26, 30, .7);
	--overlay-background-color-strong: rgba(26, 26, 30, .85);

	--content-background-color: #e8e1d0;
	--content-border: #c9c0a8;
	--content-hover: #c9a0a0;
	--content-text-color: #2a2a26;
	--content-text-color-muted: #544f42;
	--rubric: #cc2819;
	--native-scheme: dark;
}

html {
  /* Fix safari resizing text */
	-webkit-text-size-adjust: 100%;
	text-size-adjust: 100%;
}

body {
	margin: 0;
	padding: 0;
	background-color: var(--site-background-color);
}

#site-wrapper {
	width: 100%;
}

/* Top bar and its items' style */
#top-bar-title {
	position: fixed;
	top: 0;
	width: 100%;
	height: var(--top-bar-title-height) !important;
	background-color: var(--panel-background-color);
	border-bottom: 1px solid var(--border-color);
	z-index: 2;
}

/* Menu for picking language manually. Lives in the sidebar nav's footer
   (sidemenu.tpl), alongside the dark mode toggle. */
#locale-selector {
	height: 35px;
	font-family: times;
	font-size: 16px;
	background-color: var(--button-color);
	border-radius: 3px;
	border: none;
	color: var(--panel-text-color);
	cursor: pointer;
	padding: 0 10px;
}

#locale-selector:hover {
	background-color: var(--button-color-hover);
}

/* Site-wide dark mode toggle. Lives in the sidebar nav's footer alongside
   the locale selector. */
#dark-mode-toggle {
	height: 35px;
	width: 35px;
	padding: 7px;
	border-radius: 3px;
	background-color: transparent;
	color: var(--panel-text-color);
}

#dark-mode-toggle:hover {
	background-color: var(--button-color-hover);
}

/* Logo stuff */
#project-logo {
	width: 100%;
	height: 100%;
}

#logo-link-wrapper {
	width: fit-content;
	height: 100%;
	margin: 0 auto;
}

#logo {
	object-fit: contain;
	width: auto;
	height: 100%;
}

/* Side bar which is opened from the top bar */
#sidebar-nav-toggle-wrapper {
	position: fixed;
	height: 40px;
  width: 40px;
	margin-top: 18px;
	margin-left: 18px;
	background-color: transparent;
}

#sidebar-nav-toggle {
	height: 100%;
}

#sidebar-nav {
	position: fixed;
	top: calc(var(--top-bar-title-height) + 1px);
	left: 0;
	min-width: 160px;
	height: calc(100% - var(--top-bar-title-height) - 1px);
	box-sizing: border-box;
	background-color: var(--panel-background-color);
	display: flex;
	flex-direction: column;
	align-items: center;
	padding-top: 20px;
	padding-bottom: 20px;
	border-right: 1px solid var(--border-color);
	z-index: 3;
	gap: 10px;
}

/* Pinned to the bottom of the sidebar's flex column regardless of how many
   nav links precede it. */
#sidebar-nav-footer {
	margin-top: auto;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
}

.nav-element-link {
	min-width: 100px;
	height: 40px;
	padding: 12px 5px 0 5px;
	display: block;
	text-align: center;
	font-family: times;
	font-size: 20px;
	color: var(--panel-text-color);
	text-decoration: none;
}

.nav-element-link:hover {
	background-color: var(--button-color-hover);
}

.red {
	color: var(--rubric) !important;
}

@font-face {
	font-family: 'Versiculum';
	font-style: normal;
	font-weight: normal;
	src: url(data:application/font-woff;charset=utf-8;base64,d09GRgABAAAAAAn8AA4AAAAAEkwAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAABGRlRNAAABRAAAABwAAAAcc0/wCkdERUYAAAFgAAAAHQAAACAARAAET1MvMgAAAYAAAAA7AAAAYHmSKOhjbWFwAAABvAAAAH8AAAGaDGJ07Gdhc3AAAAI8AAAACAAAAAj//wADZ2x5ZgAAAkQAAAUBAAAJkLWTnchoZWFkAAAHSAAAAC8AAAA2CUBabWhoZWEAAAd4AAAAGwAAACQFYQI1aG10eAAAB5QAAAA2AAAAXBsQAABsb2NhAAAHzAAAABgAAAAwKAIptm1heHAAAAfkAAAAGAAAACAAGwErbmFtZQAAB/wAAAGLAAADuDm6iBZwb3N0AAAJiAAAAGwAAADIm7BxhXdlYmYAAAn0AAAABgAAAAZbWld2AAAAAQAAAADMPaLPAAAAANN2QWIAAAAA05wL2HjaY2BkYGDgA2IJBhBgYmAEQjEgZgHzGAAFPABJAAAAeNpjYGIMYJzAwMrAwqCBAU8woAJGZI5TZlEKgwMD7wMGZuP/xgwMTGUMZxiYIGqAbBBQYGAEAJMzCRUAeNpjYGBgZoBgGQZGBhCYAuQxgvksDBVAWopBACjCBWTxMigw6DEkMhQxlClwKegrxKv+ecDw/z9YF7IcA5Ic4/+v/x//v/Z/yf8p/yc+4Lj/5P7WW5IKYlC7cABGNga4AkYmIMGErgDiZARgYSAZsKILAC1lYGcYLAAAegkeuQAAAAAB//8AAnjahZW7chxFFIan79eZ6Z7p2dmrpL1Itgsj2dIaQQSBqILERfEQIiKEZ4A3oBxCxgs4IaSKxAQ8AEVMEZMCf+9qjSRbdvfWXma7T59z+v/OKWhR/PuMPCsuC1XEojg/PUvdYrlWp/P1k8VysUxnX7y4/PXsWxKXH1++uLz45iIuLhZFwbDvU/on/br4i0TyoCierM/fe9s8O+0HL+fVsyfre0f/z906zKt1XeqSkpiD/pWZ/1ku7h0tF9vPrQ83LC6Wea/sZPdy18Ya1i+v1rz0PMeL9dsdm13p9eec4zliyV6ebnbuTltv12ynWN+MemdFSVdZpzEsN8a5snTOGNZR6oTWQnDOGWcEb4Q7W9dGc0GosyE0MTbeM0uoNqW1hBAah8NBH4KSVbXnrLNWaaFxunYuVAJemMPZbBxDGHqpRr3RlPF8AOWiJDQ5JwUh1vrSO0kplRKbKbX4CUuUKuF9WwWlh02l8l7BGONajbRWSpsUYzdMKV/QT5QyUVUBw1AqqMoBSkk5hZdYmn+S57Bv4GPAaYrREEZt0yqZ4+VcKecb3XXj8d5sPEmdftQqL7EDfuDgcVlSP5muVuNxaJwT09gYxwWFfW5zDuG4lDHMZsfSmEF3dPjReDLp+za51jutxCZuroRg2CM4IhVIGBLrS+clDNGTvf02wb1hVRmrjVe4GKsEljRxMBiF1I6G+wf3KeECufbOq1prQxnTkjECLxn7BfeGe5FGNv0gpbrmhBIWkaPUph8jvEQWpUISrBrFWJbFjqXnYOkPYsj8Fkvb72s8W19Xdl6z1d9WX1eUbOZ1vu5k7NFrGLvF2U6x93Y27+bn6PoJWwZg9Q5S23TFzSse5v833qQuM5vuYkjKsrFOqHz7m5E/JW6lHWvl2qN2Pv/wbD4PR9ZUVR1svh0T6gjV2nnbGkjUZqDaEMqSGUKNLq2DFfDUD0KtVdMeNlCVRCANDvaMhTgdYoBFQu1GNFkzErgpwqz3uFto2hOmyrIqy1LqpolMcJEl4F0HKK0FSE3qR8N++r0Fz6GGkpVSUnMuZV31w4NQZrDJD0AXI6OioK4Qxk3bCrEpDwIlxEWV0nQ6n6/mHecRHmshBWfCA1FE5+LiZNKmstQ6B0+b0WhSxdBcHJ9M9+paT5tob+OjZAh7s2NlzWh8fPLZ4f5enzlPIXLCmDKCa53eAEgajQ8QftsOBm0yHsCDMxFWq3d6mYPgwmROcnHzoIJm7HEhyF2ubTVsCu5Z6SN4iaH0v72el9yzPqHf0a+K34u/iyKut/rYsbDT8tv7zPlp/4Yuc7t73STv1fOuzw011+euo7y9C93cd0TuIAAZqScQZJeaWoq+ylWSUKadrzvvhcxVHVmFxLznlpKNwNlO31I1zQoVXEI0nOWhkGO0D6t1FgVlRkNScNF3ZdlOBj1uEyXdjUJsmy6NVqhszBgoDgWeZUkqRSHN1uEOyd2AUKZ0WfbeAxFUZVOVY5ilABpitypu12zVTn7W0AjCgqqtgnpk7jmD2XR5PD8YIEoFEecewHYihhZzHZAxTjcyHg7fffg0Nk0IzqPnEWAd+348GaJp+Yj6nbsCBVQEr1y/qdDQpKzr1f7jx+9/fv9BZhDHMuuqumkaabR9OJ21jTWqvwaBU4I5G+OgHzWpm06XS1C2jz6GfOXOysU/X2aSEZCEXxkhiNkXBSl2A13gA/YfVCTREgAAAHjaY2BkYGAA4qtPlvrF89t8ZeBmYQCBy3O4byLo/x5ML5nKgFwOBiaQKABTOQu3AHjaY2BkYGAq+28CJF8yMIBJRgZUIA4AWycDmwB42mOSZ4ADRhEIzfQSiHcB8QygmDWQLkPQDJeAeC4QZ0KxPxDXAbEylAbKMX4BqgUyAXXvCSMAAHjaY2BgkIFBxkPMUSwH8MATLCcAAbUN/XjaY2BkYGAQZ9RiYGYAAUYGNAAABzYASHjaxVHNSkJREP7usT+FhEBcuDpEi2phGiVxV0UgFIKQUJs2V72ZpF3Lq9imB4ieoEUP0rJVf4to13v0AH1n7iklhNrFMMw3f9+cmQNgDm+IwZmIAxhQI+wgRS/CCklcWxxDATcWT2ABrxZPIoMPi6eQcpIWT+PQmbc4Du1cWpzAwLm1eBbLKm1xEmtq0+IHpFVo8SNy6sriJ8yoO4ufkVD3EX6PIaNesI0AHVzgHE00cIwQGouoYYl2FTnkKRpVVmhUmPXRp57S68MTu0eGAHVGs/S20KLoEb6ueD6tT2u666zcF6/Lqhp67OihTSafPcbzmBudFs0aTnLJOY7BHRvVP5iHNYFskOd7ciLjusczNmUvjxoy68mr2sJ+wliAoz/d67eK//qdCnZQYqbM6RFfUW5l5pfkEiZqegxHyCoXK5QuM4a7I8xZuVqLNmC0wXyZPCUcsK/KC30xRvcvSqfGrlxZS1wzvkFu8zcuN17/3rvAO/uUjnBHPzl8YwVnZGkyY3ZrfQJxz5QAAHjabc25EkFBAETRvvPw7EvkN8YwlpjyBwKhgCqJzO/jMR26VV0nbAX9er+E/jVvhoIqzXTQSWcCFS3adKjp0qPPgCEjxkyY1s/HPcUY7cImu7Qrm+3abuzW7uylmG7FXMzH/ddr8/cBAnokJAABV3ZbWQAA) format('woff');
}

tspan[style="font-family:'Exsurge Characters';fill:#f00;"] {
	font-family: 'Versiculum'!important;
	font-variant:normal;
	font-size: 130%;
	text-transform: lowercase;
}

@media print {
	#top-bar-title {
		display: none;
	}

	#content-container {
		margin: 0;
	}
}

[x-cloak] { display: none !important; }

button {
	font-family: times;
	background-color: var(--button-color);
	border-radius: 3px;
	color: var(--panel-text-color);
	cursor: pointer;
	border: none;
}
