:root {
	color-scheme: light dark;

	--sans-font: ui-sans-serif,system-ui,sans-serif;
	--serif-font: ui-serif,serif;
	--mono-font: ui-monospace,monospace;

	--font-size: 1.05em;
	--font-size-mono: 0.925em;

	--light-line-dark: #aaa;
	--light-line-medium: #bbb;
	--light-line-light: #ccc;
	--dark-line-dark: #555;
	--dark-line-medium: #666;
	--dark-line-light: #777;

	--bg: light-dark(#fff, #222);
	--fg: light-dark(#333, #ddd);

	--link: light-dark(#36c, #ec6);
	--link-hover: light-dark(#000, #fff);

	--link-sidebar: light-dark(#555, #ccc);
	--link-sidebar-hover: light-dark(#000, #fff);

	--link-contents: light-dark(#555, #ccc);
	--link-contents-hover: light-dark(#000, #fff);

	--navbar-bg: light-dark(#eee, #111);
	--navbar-fg: light-dark(#666, #ccc);
	--navbar-hover-bg: light-dark(#ccc, #444);
	--navbar-hover-fg: light-dark(#000, #fff);
	--navbar-right-bg: light-dark(#eee, #111);
	--navbar-right-fg: light-dark(#000, #fff);
	--navbar-right-hover-bg: light-dark(#ccc, #444);
	--navbar-right-hover-fg: light-dark(#000, #fff);

	--navbar-logo: light-dark(#000, #fff);
	--navbar-logo-dot: light-dark(#36c, #ec6);
	--navbar-logo-at: light-dark(#666, #ccc);
	
	--sidebox-bg: light-dark(#eee, #333);
	--sidebox-title-fg: light-dark(#555, #ddd);
	--sidebox-subtitle-fg: light-dark(#555, #ddd);

	--footer-bg: light-dark(#ccc, #111);
	--footer-fg: light-dark(#666, #ccc);
	--footer-link: light-dark(#333, #ccc);
	--footer-link-hover: light-dark(#000, #fff);
	--footer-copyright-fg: light-dark(#666, #999);

	--h-line: light-dark(var(--light-line-medium), var(--dark-line-medium));
	--hr-line: light-dark(var(--light-line-dark), var(--dark-line-light));

	--code-bg: light-dark(#eee, #000);
	--code-fg: light-dark(#000, #ddd);
	--kbd-border: light-dark(var(--light-line-medium), var(--dark-line-medium));

	--table-th-bg: light-dark(#ddd, #111);
	--table-th-fg: light-dark(#000, #ddd);
	--table-border: light-dark(#bbb, #555);
	--table-nth-bg: light-dark(#eee, #333);
	--table-hover-bg: light-dark(#ccc, #000);

	--dt-fg: light-dark(#000, #eee);

	--img-border: light-dark(var(--light-line-medium), var(--dark-line-medium));
	--figcaption-fg: light-dark(#666, #bbb);

	--color-gray: light-dark(#777, #aaa);
	--color-green: light-dark(#282, #8d8);
	--color-yellow: light-dark(#970, #ec9);
	--color-red: light-dark(#c33, #f88);
	--color-blue: light-dark(#05d, #8ce);

	--box-example-bg: light-dark(#eee, #333);
	--box-example-fg: light-dark(#000, #ddd);
	--box-example-border: light-dark(var(--light-line-dark), var(--dark-line-light));
	--box-info-bg: light-dark(#def, #238);
	--box-info-fg: light-dark(#000, #fff);
	--box-info-border: light-dark(#69f, #48c);
	--box-warning-bg: light-dark(#fed, #642);
	--box-warning-fg: light-dark(#000, #fff);
	--box-warning-border: light-dark(#ca0, #db0);
	--box-error-bg: light-dark(#fdd, #722);
	--box-error-fg: light-dark(#000, #fff);
	--box-error-border: light-dark(#c55, #d66);
	--box-success-bg: light-dark(#dfd, #242);
	--box-success-fg: light-dark(#000, #fff);
	--box-success-border: light-dark(#5c5, #5a5);
	--box-content-bg: light-dark(#eee, #333);
	--box-content-bg2: light-dark(#ddd, #444);

	/* Page Header (print only) */
	--print-logo-fg: #999;
	--print-logo-line: #ccc;
}


html, body {
	font-family: var(--sans-font);
	font-size: var(--font-size);
	background: var(--bg);
	color: var(--footer-fg);
	margin: 0;
	padding: 0;
	line-height: 1;
}

/* Show footer at the bottom an short pages */
body {
	min-height: 100dvh;
	display: flex;
	flex-direction: column;
}

a {
	color: var(--link);
	text-decoration: underline;
}
a:hover {
	color: var(--link-hover);
	text-decoration: underline;
	text-decoration-thickness: 2px;
}
.link-no-underline {
	text-decoration: none;
}


.print-header {
	display: none;
	padding: 0;
}

.print-header h1 {
	margin: 0;
	padding: 0.25rem 0;
	font-size: 1.5rem;
	text-align: center;
	color: var(--print-logo-fg);
	border-bottom: 2pt solid var(--print-logo-line);
}

.navbar {
	background-color: var(--navbar-bg);
	display: flex;
	flex-wrap: wrap;
	line-height: 1.2;
}

.navbar-right {
	display: flex;
	flex-wrap: wrap;
	background-color: var(--navbar-right-bg);
	margin-left: auto;
}

.navbar a, .navbar-right a {
	color: var(--navbar-fg);
	font-size: 1.15rem;
	padding: 0.6rem 1rem;
	text-decoration-line: none;
}
.navbar-right a {
	color: var(--navbar-right-fg);
}

.navbar a:hover {
	background-color: var(--navbar-hover-bg);
	color: var(--navbar-hover-fg);
	text-decoration-line: underline;
}

.navbar-right a:hover {
	background-color: var(--navbar-right-hover-bg);
	color: var(--navbar-right-hover-fg);
}

.navbar-logo {
	color: var(--navbar-logo);
	font-weight: 900;
}
.navbar-logo-dot {
	color: var(--navbar-logo-dot);
}
.navbar-logo-at {
	color: var(--navbar-logo-at);
}

.main-container {
	background-color: var(--bg);
	color: var(--fg);
}
.main-container::after {
	clear: both;
	content: "";
	display: table;
}

.main {
	box-sizing: border-box;
	float: left;
	/* overflow: hidden; */
	width: calc(100% - 350px);
}

.sidebar {
	box-sizing: border-box;
	float: right;
	width: 350px;
}

.sidebar a:not(.link-default) {
	color: var(--link-sidebar);
	text-decoration-line: none;
}
.sidebar a:not(.link-default):hover {
	color: var(--link-sidebar-hover);
	text-decoration-line: underline;
}

.sidebox {
	background-color: var(--sidebox-bg);
	padding: 0;
	margin: 1rem 0 1rem 1rem;
	line-height: 1.75;
	border-radius: 0.75rem 0 0 0.75rem;
	font-size: 0.9rem;
	border-bottom: 1px solid var(--sidebox-bg);
}

.sidebox h3 {
	border-bottom: 1px solid var(--h-line);
	color: var(--sidebox-title-fg);
	margin: 0;
	padding: 0.25rem;
	text-align: center;
	line-height: 1.5;
}

.sidebox h4 {
	color: var(--sidebox-subtitle-fg);
	margin: 1em 0 0.5em 0;
	padding: 0;
	line-height: 1;
}

.sidebox-contents p {
	line-height: 1.25;
	margin: 0.35em 0;
}

.footer {
	background-color: var(--footer-bg);
	border: 1px solid var(--footer-bg);
	color: var(--footer-fg);
	font-size: 0.9rem;
	text-align: center;
	/* Show footer at the bottom an short pages */
	margin-top: auto;
}

.footer a {
	color: var(--footer-link);
	text-decoration-line: none;
}
.footer a:hover {
	color: var(--footer-link-hover);
	text-decoration-line: underline;
}

.footer-links {
	margin: 0.5em 0;
}

.footer-links a {
	line-height: 1.75;
	margin-left: 1em;
	margin-right: 1em;
	white-space: nowrap;
}
.footer-copyright {
	font-size: 0.8em;
	color: var(--footer-copyright-fg);
	margin: 0.5em 0 0.25em 0;
}


h1 {
	font-size: 2rem;
	padding-bottom: 0.3rem;
	/* border-bottom: 2px solid var(--h-line); */
	margin: 1rem 0 2rem 0;
}

h2 {
	font-size: 1.6rem;
	padding-bottom: 0.3rem;
	border-bottom: 1px solid var(--h-line);
	margin: 3rem 0 1rem 0;
}

h3 {
	font-size: 1.4rem;
	margin: 2rem 0 1rem 0;
}

h4 {
	font-size: 1.2rem;
	margin: 2rem 0 1rem 0;
}

h5 {
	font-size: 1.1rem;
	margin: 1.75rem 0 1rem 0;
}

h6 {
	font-size: 1rem;
	margin: 1.5rem 0 1rem 0;
}


hr {
	border: 0;
	border-bottom: 1px solid var(--hr-line);
	margin: 1em 0;
}

p, blockquote, li, dt, dd, th, td, pre, samp {
	line-height: 1.5;
}

p {
  margin: 1em 0 1em 0;
}

blockquote {
	margin: 1em 0 1em 2em;
}

dt {
	color: var(--dt-fg);
}

dd {
	margin: 0.1em 0 0.5em 1.5em;
}

li {
	margin-top: 0.25em;
	margin-bottom: 0.25em;
}


code, pre, samp {
	font-family: var(--mono-font);
	font-size: var(--font-size-mono);
	background-color: var(--code-bg);
	color: var(--code-fg);
}

code, samp {
	padding: 0.05em 0.2em;
	border-radius: 0.25em;
}

pre {
	white-space: pre-wrap;
	word-wrap: break-word;
	padding: 0.5em 0.75em;
	border-radius: 0.35em;
}
pre code {
	border: 0;
	padding: 0;
	border-radius: 0;
}
.no-wrap {
	overflow: auto;
	white-space: pre;
}

.mono {
	font-family: var(--mono-font);
	font-size: var(--font-size-mono);
}

kbd {
	font-family: var(--sans-font);
	border: 1px solid var(--kbd-border);
	border-radius: 0.35em;
	padding: 0 0.4em 0 0.4em;
	margin: 0 0.2em;
	white-space: nowrap;
}


img {
	border: 0;
}

figure {
	margin: 1em 0;
}

figure pre {
	margin-top: 0;
	margin-bottom: 0;
}

figure img {
	height: auto;
	max-width: 100%;
	padding: 2px;
	border: 1px solid var(--img-border);
	border-radius: 0.35em;
}

figcaption, .figcaption {
	color: var(--figcaption-fg);
	font-style: italic;
	font-size: 0.9rem;
	margin: 0.2em 0;
	line-height: 1;
}


table {
	background-color: var(--table-border);
	border-collapse: separate;
	border-spacing: 1px;
}
table.no-border {
	border-collapse: collapse;
	border-spacing: 0;
}

table th {
	background-color: var(--table-th-bg);
	color: var(--table-th-fg);
	font-weight: bold;
	padding: 0.25em 0.5em;
	text-align: left;
}
table.th-top th {
	vertical-align: top;
}
table.th-right th {
	text-align: right;
}
table.th-center th {
	text-align: center;
}
table.th-sticky th {
	position: sticky;
	top: 0;
}

table td {
	background-color: var(--bg);
	padding: 0.25em 0.5em;
}
table.td-top td {
	vertical-align: top;
}

table.stripes tr:nth-child(odd) td { background-color: var(--table-nth-bg); }
table.hover tr:hover th, table.hover tr:hover td { background-color: var(--table-hover-bg); }

.hscroll {
	overflow-x: auto;
}


.content {
	padding: 1em;
}
.content-top {
	padding: 0 1em 1em 1em;
}
.content-top-bottom {
	padding: 0 1em;
}


.box-example {
	color: var(--box-example-fg);
	background-color: var(--box-example-bg);
	border-left: 0.35em solid var(--box-example-border);
	padding: 0.5em 0.75em;
	border-radius: 0.35em;
}

.box-info {
	color: var(--box-info-fg);
	background-color: var(--box-info-bg);
	border-left: 0.35em solid var(--box-info-border);
	padding: 0.5em 0.75em;
	border-radius: 0.35em;
}

.box-warning {
	color: var(--box-warning-fg);
	background-color: var(--box-warning-bg);
	border-left: 0.35em solid var(--box-warning-border);
	padding: 0.5em 0.75em;
	border-radius: 0.35em;
}

.box-error {
	color: var(--box-error-fg);
	background-color: var(--box-error-bg);
	border-left: 0.35em solid var(--box-error-border);
	padding: 0.5em 0.75em;
	border-radius: 0.35em;
}

.box-success {
	color: var(--box-success-fg);
	background-color: var(--box-success-bg);
	border-left: 0.35em solid var(--box-success-border);
	padding: 0.5em 0.75em;
	border-radius: 0.35em;
}



	
.contents-title {
	font-size: 1.4rem;
	font-weight: bold;
	margin: 2rem 0 1rem 0;
}

.contents-list {
	list-style-type: none;
}
.contents-list li {
	line-height: 1.25;
	margin-top: 0.5em;
	margin-bottom: 0.5em;
}
.contents-list li a {
	color: var(--link-contents);
	text-decoration-line: none;
}
.contents-list li a:hover {
	color: var(--link-contents-hover);
	text-decoration-line: underline;
}


a.link-big {
	font-size: 1.25rem;
	font-weight: bold;
}

a.link-external::after, a[rel~="external"]::after {
	content: "";
	display: inline-block;
	position: relative;
	top: 0.1em;
	width: 1em;
	height: 1em;
	margin-left: 0.2em;
	background-color: currentColor;
	-webkit-mask-image: url("/images/ui/link_external.svg");
	-webkit-mask-size: contain;
	-webkit-mask-repeat: no-repeat;
	mask-image: url("/images/ui/link_external.svg");
	mask-size: contain;
	mask-repeat: no-repeat;
}

a.link-email::before, a[href^="mailto:"]::before {
	content: "";
	display: inline-block;
	position: relative;
	bottom: 0.1em;
	width: 1em;
	height: 1em;
	margin-right: 0.2em;
	vertical-align: middle;
	background-color: currentColor;
	-webkit-mask-image: url("/images/ui/link_email.svg");
	-webkit-mask-size: contain;
	-webkit-mask-repeat: no-repeat;
	mask-image: url("/images/ui/link_email.svg");
	mask-size: contain;
	mask-repeat: no-repeat;
}

a.link-download::before {
	content: "";
	display: inline-block;
	position: relative;
	top: 0.3em;
	width: 1.25em;
	height: 1.25em;
	margin-right: 0.2em;
	background-color: currentColor;
	-webkit-mask-image: url("/images/ui/link_download.svg");
	-webkit-mask-size: contain;
	-webkit-mask-repeat: no-repeat;
	mask-image: url("/images/ui/link_download.svg");
	mask-size: contain;
	mask-repeat: no-repeat;
}

a.link-copy::before {
	content: "";
	display: inline-block;
	position: relative;
	top: 0.1em;
	width: 1em;
	height: 1em;
	margin-right: 0.2em;
	background-color: currentColor;
	-webkit-mask-image: url("/images/ui/link_copy.svg");
	-webkit-mask-size: contain;
	-webkit-mask-repeat: no-repeat;
	mask-image: url("/images/ui/link_copy.svg");
	mask-size: contain;
	mask-repeat: no-repeat;
}

a.link-copy {
	position: relative;
	display: inline-block;
}

a.link-copy::after {
	content: attr(data-tooltip);
	position: absolute;
	bottom: 1.5em;
	left: 0;
	color: white;
	background-color: green;
	padding: 0.25em 0.5em;
	border-radius: 0.2em;
	line-height: 1;
	font-size: 1em;
	white-space: nowrap;
	visibility: hidden;
	opacity: 0;
	z-index: 10;
}
a.link-copy-error::after {
	background-color: firebrick;
}
a.link-copy.visible::after {
	opacity: 1;
	visibility: visible;
}


.container-box {
	margin: 2em 0 0 0;
	overflow: auto;
}

.container-alt {
	background-color: var(--box-content-bg);
	border-radius: 0.35em;
	padding: 1px 1em;
}
.container-alt p {
	text-align: center;
}


.par {
	margin-top: 1em !important;
	margin-bottom: 1em !important;
}
.nopar {
	margin-top: 0 !important;
	margin-bottom: 0 !important;
}

.nowrap {
	white-space: nowrap;
}
.wrap {
	white-space: wrap;
}

small, .small {
	font-size: 0.85em;
}

.italic {
	font-style: italic;
}

.gray { color: var(--color-gray) !important; }
.green { color: var(--color-green) !important; }
.yellow { color: var(--color-yellow) !important; }
.red { color: var(--color-red) !important; }
.blue { color: var(--color-blue) !important; }

.text-center { text-align: center; }
.text-right { text-align: right; }
.display-none { display: none; }
.width-100p { width: 100%; }


@media (max-width: 1200px) {
	.main, .sidebar {
		width: 100%;
	}
	.sidebox {
		margin-left: 0;
		border-radius: 0;
	}
}

@media (max-width: 500px) {
	.navbar a, .navbar-right a {
		flex-grow: 1;
		text-align: center;
	}
}


@media print {
	html, body, .main-container {
		background-color: #fff;
		color: #000;
	}
	a {
		color: #36c;
		text-decoration: underline;
	}
	code, pre, samp {
		background-color: #eee;
		color: #000;
	}
	.contents-list li a {
		color: #555;
	}
	figcaption, .figcaption {
		color: #666;
	}

	table {
		background-color: #bbb;
	}
	table th {
		background-color: #ddd;
		color: #000;
	}
	table td {
		background-color: #fff;
	}
	table.stripes tr:nth-child(odd) td { background-color: #eee; }

	.box-example {
		color: #000;
		background-color: #eee;
		border-left-color: #aaa;
	}
	.box-info {
		color: #000;
		background-color: #def;
		border-left-color: #69f;
	}
	.box-warning {
		color: #000;
		background-color: #fed;
		border-left-color: #ca0;
	}
	.box-error {
		color: #000;
		background-color: #fdd;
		border-left-color: #c55;
	}
	.box-success {
		color: #000;
		background-color: #dfd;
		border-left-color: #5c5;
	}

	.gray { color: #777 !important; }
	.green { color: #282 !important; }
	.yellow { color: #970 !important; }
	.red { color: #c33 !important; }
	.blue { color: #05d !important; }


	.print-header {
		display: block;
	}
	.main {
		width: 100%;
	}
	.navbar, .sidebar {
		display: none;
	}
	.footer {
		display: none;
	}

	#container_bottom_ad, #container_content_ad {
		display: none;
	}
}