@charset "UTF-8";

/* ============================================================================================================================
   D O K U M E N T E B E N E
   ============================================================================================================================ */
html {
	overflow-x:					hidden;
	overflow-y:					scroll;
	scrollbar-gutter:				stable;
	scroll-behavior:				smooth;

	margin:						0;
	padding:					0;

	background-color:				var(--color-background);
	color:						var(--color-foreground);

	font-size:					90%;
	line-height:					1.8;

	font-family:					Arial, sans-serif;
	font-weight:					normal;
	font-style:					normal;

	text-align:					left;
	hyphens:					auto;

	--color-foreground:				rgb(24,24,24);
	--color-background:				rgb(255,255,255);
	--color-background-fully-transparent:		rgba(255,255,255,0);
	--color-background-offset:			rgb(242,242,242);

	--color-banner-background:			rgb(61,62,67);
	--color-banner-foreground:			rgb(255,255,255);

	--color-caption-foreground:			rgb(24,24,24);

	--color-listing-background:			rgb(249,249,249);
	--color-listing-background-alt:			rgb(252,252,252);

	--color-remark-background:			rgb(204,255,227);
	--color-remark-bar:				rgb(0,196,90);
	--color-remark-fixme-background:		rgb(255,204,205);
	--color-remark-fixme-bar:			rgb(242,0,0);

	--color-ui-background-help:			rgb(212,238,247);
	--color-ui-background-warning:			rgb(255,238,204);
	--color-ui-background-error:			rgb(255,204,204);

	--color-primary:				rgb(66,157,186);
	--color-secondary:				rgb(158,139,102);

	--color-highlight:				rgb(24,24,24);
	--color-term:					rgb(24,24,24);
	--color-background-page-control:		rgb(242,242,242);

}

@media (prefers-color-scheme: dark) {
	html {
		--color-foreground:			rgb(211,211,211);
		--color-background:			rgb(24,24,24);
		--color-background-fully-transparent:	rgb(24,24,24,0);
		--color-background-offset:		rgb(61,62,67);

		--color-listing-background:		rgb(30,30,30);
		--color-listing-background-alt:		rgb(33,33,33);

		--color-caption-foreground:		rgb(211,211,211);

		--color-remark-background:		rgb(0,112,58);
		--color-remark-bar:			rgb(0,196,90);
		--color-remark-fixme-background:	rgb(122,0,2);
		--color-remark-fixme-bar:		rgb(242,0,0);

		--color-ui-background-help:		rgb(16,68,86);
		--color-ui-background-warning:		rgb(102,68,0);
		--color-ui-background-error:		rgb(102,0,0);

		--color-primary:			rgb(66,157,186);
		--color-secondary:			rgb(214,206,190);

		--color-highlight:			rgb(255,255,255);
		--color-term:				rgb(255,255,255);
		--color-background-page-control:	rgb(24,24,24);
	}
}

body {
	display:					flex;

	flex-flow:					column nowrap;
	align-items:					center;

	margin:						0 auto;
	min-width:					45rem;
	max-width:					85rem;
	min-height:					100vh;
	padding:					0;

}

body > header {
	width:						100%;
}

/* ============================================================================================================================
   B A N N E R
   ============================================================================================================================ */
#banner {
	display:					flow-root;
	position:					relative;
	z-index:					0;

	margin:						0;
	height:						108px;

	color:						var(--color-banner-foreground);
}

#banner::before {
	content:					'';

	position:					absolute;
	z-index:					-1;
	top:						0;
	right:						-100vw;
	bottom:						0;
	left:						0;
	transform:					translateX(-50%);

	background-color:				var(--color-banner-background);
}

#banner .main {
	display:					flex;

	position:					absolute;
	z-index:					2;
	top:						0;
	right:						22rem;
	bottom:						0;
	left:						0;

	flex-flow:					column nowrap;
	justify-content:				flex-end;

	padding:					0 3rem;
}

#banner .main h1 {
	font-size:					170%;
	font-weight:					normal;
	font-style:					normal;
	color:						var(--color-banner-foreground);
}

html.title-page #banner .main h1 {
	display:					none;
}

#banner .product-logo {
	position:					absolute;
	z-index:					1;
	top:						0;
	right:						0;
	bottom:						0;
	transform:					translateX(calc( 475px - 21rem ));

	width:						475px;

	background-repeat:				no-repeat;
	background-position:				right bottom;
	background-size:				contain;
}


html.anynode #banner .product-logo {
	background-image:				url("banner/product_logo_anynode.svg");
}

html.xzwo #banner .product-logo {
	background-image:				url("banner/product_logo_xzwo.svg");
}



/* ============================================================================================================================
   H A U P T B E R E I C H
   ============================================================================================================================ */
body > main {
	display:					flex;

	flex-flow:					row nowrap;
	align-items:					stretch;

	width:						100%;
	padding-top:					3rem;
}


/* ============================================================================================================================
   N A V I G A T I O N S - S I D E B A R
   ============================================================================================================================ */
#sidebar {
	order:						1;

	flex:						0 0 20rem;

	padding:					0 1em;
	font-size:					80%;
}

#sidebar h2 {
	border-bottom:					1px solid var(--color-secondary);

	font-size:					120%;
	font-weight:					bold;
	font-style:					normal;
	text-transform:					uppercase;
	color:						var(--color-secondary);
}

#sidebar ol {
	padding:					0;
}

#sidebar nav ol ol {
	padding-left:					1rem;
}

#sidebar li {
	display:					block;
	padding-bottom:					.3rem;
}


#sidebar nav > ol > li > a {
	display:					block;

	margin:						.2rem 0;
	border-radius:					.4rem;
	width:						calc( 100% - 1.2rem );
	padding:					.3rem .6rem;

	background-color:				var(--color-background-offset);

	color:						var(--color-primary);
}

#sidebar nav > ol > li.this > a {


	background-color:				var(--color-secondary);
	color:						var(--color-background);

}

#sidebar nav > ol > li ol > li.this > a {
	color:						var(--color-secondary);
}

#sidebar nav > ol > li ol > li.this > a[href]::hover {
	transition:					color .5s;
	font-weight:					bold;

	color:						var(--color-secondary);
}


html.multi-page #sidebar nav > ol > li > ol {
	display:					none;
}

html.multi-page #sidebar nav > ol > li.parent > ol,
html.multi-page #sidebar nav > ol > li.this > ol {
	display:					block;
}


#sidebar nav.go-to-top {
	position:					fixed;

	width:						20rem;
	padding-top:					2rem;
	bottom:						0px;

	background:					linear-gradient(180deg, var(--color-background-fully-transparent) 0, var(--color-background) 2rem);
}

#sidebar nav.go-to-top ol > li > a::before {
	font-family:					"Font Awesome 6 Free";
	margin-right:					.4em;
	content:					"\F0AA";
}


/* ============================================================================================================================
   I N H A L T
   ============================================================================================================================ */
#content {
	flex:						1 1 0;
	padding:					0 3rem;
}

#content > .page-control {
	font-size:					80%;
}

#content > .page-control > ol > li:nth-child(2) {
	text-align:					right;
}
#content > .page-control > ol > li:nth-child(1) > a::before {
	font-family:					"Font Awesome 6 Free";
	margin-right:					.4em;
	content:					"\F0A8";
}

#content > .page-control > ol > li:nth-child(2) > a::after {
	font-family:					"Font Awesome 6 Free";
	margin-left:					.4em;
	content:					"\F0A9";
}
#content > .page-control > ol > li > a:hover {
	  text-decoration:				none;
	  font-weight:					bold;
}

#content > .page-control > ol {
	display:					flex;

	flex-flow:					row nowrap;
	justify-content:				space-between;

	margin:						0;
	padding:					0;
}

#content > .page-control > ol > li {
	display:					inline-block;
}

#content > .page-control > ol > li > a {
	display:					inline-block;

	width:						16rem;
	margin:						2rem 0;
	border-radius:					.4rem;
	padding:					.4rem .6rem;
	background-color:				var(--color-background-page-control);

	background-image:				linear-gradient(to bottom, rgba(255,255,255,.2) 0, rgba(255,255,255,.01) 100%);

	color:						var(--color-primary);
}





/* ============================================================================================================================
   T I T E L
   ============================================================================================================================ */
#title-block .title {
	font-size:					210%;
	font-weight:					bold;
}

#title-block .subtitle {
	font-size:					150%;
	font-weight:					bold;
}

#title-block .contributors {
	font-style:					italic;
}




/* ============================================================================================================================
   R E V I S I O N S H I S T O R I E
   ============================================================================================================================ */
ul.revision-history .revision,
ul.revision-history .date {
	font-weight:					bold;
}

ul.revision-history .contributors {
	font-style:					italic;
}




/* ============================================================================================================================
   S T R U K T U R E B E N E
   ============================================================================================================================ */
#content section {
	display:					flow-root;
	clear:						both;
	margin-bottom:					3em;
}

#content > section h2  {
	font-size:					200%;
	font-weight:					bold;
	color:						var(--color-highlight);
}

#content > section section h2  {
	font-size:					120%;
}

#content .billboard {
	width:						100%;
	border						:none;
}


/* ============================================================================================================================
   T E X T E B E N E
   ============================================================================================================================ */

/* -[ Zwischenüberschrift ]---------------------------------------------------------------------------------------------------- */
#content > section h3  {
	font-size:					120%;
	font-weight:					bold;
	color:						var(--color-highlight);
}

/* -[ Beschriftete Elemente ]-------------------------------------------------------------------------------------------------- */
#content .captioned {
	display:					block;
	margin:						0;
	line-height:					1.0;
}

#content .caption {
	display:					block;

	padding-bottom:					3em;

	text-align:					left;
	font-style:					normal;
	font-size:					80%;
	color:						var(--color-caption-foreground);
}

/* -[ Bilder ]----------------------------------------------------------------------------------------------------------------- */
#content img {
	display:					block;
	margin:						1rem auto;
	max-width:					100%;
	border:						1px solid var(--color-foreground);
}

#content img.width100 {
	max-width:					100%;
	display:					inline-block;
}

#content img.width75 {
	max-width:					75%;
	display:					inline-block;
}

#content img.width50 {
	max-width:					50%;
	display:					inline-block;
}

/* -[ Lightbox für Bilder ]---------------------------------------------------------------------------------------------------- */
#content .lightbox {
	display:					none;
	overflow:					auto;

	position:					fixed;
	z-index:					999;
	top:						0;
	left:						0;
	right:						0;
	bottom:						0;

	padding:					2em;

	background:					rgba(0,0,0,.7);
}

#content .lightbox > img {
	margin:						0;
	max-width:					100%;
	max-height:					100%;
}

#content .lightbox > img {
	position:					fixed;
	background-color:				white;
	margin:						0;
	padding:					0;
	max-height:					90%;
	max-width:					90%;
	top:						50%;
	left:						50%;
	margin-right:					-50%;
	transform:					translate(-50%, -50%);
	box-shadow:					0 0 20px black;
}

#content .lightbox.horizontal > img {
	max-width:					none;
	max-height:					90%;
}

#content .lightbox.vertical> img {
	max-width:					90%;
	max-height:					none;
}

#content .lightbox:target {
	display:					flex;
	align-items:					center;
}

/* -[ Video-Links ]------------------------------------------------------------------------------------------------------------ */
#content .video {
	display:					grid;

	grid-template-columns:				1fr auto;
	grid-template-areas:				"description billboard";
	column-gap:					1rem;

	margin:						1rem 0;

	border-top:					1px solid var(--color-foreground);
	border-bottom:					1px solid var(--color-foreground);

	padding:					1rem;
}

#content .video.billboardLeft {
	grid-template-columns:				auto 1fr;
	grid-template-areas:				"billboard description";
}

#content .video.billboardRight {
}

#content .video > .billboard {
	display:					block;
	grid-area:					billboard;

	min-width:					180px;
	min-height:					180px;
}

#content .video > .billboard > a {
	display:					block;
	position:					relative;
}


#content .video > .billboard > a::before {
	content:					"▶";
	display:					block;
	opacity:					.6;
	transform:					translate(-50%, -50%);
	transition:					color 1.6s;

	position:					absolute;
	top:						50%;
	left:						50%;

	text-align:					center;
	font-size:					100px;
	color:						white;

	filter:						drop-shadow( .2rem .2rem .2rem rgb(0,0,0) );
}

#content .video > .billboard > a:hover::before {
	opacity:					.9;
	color:						var(--color-secondary);
}

#content .video > .billboard > a::after {
	content:					none;
}

#content .video > .description {
	grid-area:					description;

	min-width:					18em;

	font-style:					italic;
	text-align:					right;
	hyphens:					none;
}

#content .video.billboardLeft > .description {
	text-align:					left;
}

#content .video.billboardRight > .description {
}

/* -[ Listings ]--------------------------------------------------------------------------------------------------------------- */
#content .listing {
	margin:						1rem 0;
}

/* -[ Hinweiskästen ]---------------------------------------------------------------------------------------------------------- */
#content .hintbox {
	display:					flow-root;
	position:					relative;

	margin:						3rem 0;

	border-left:					4px solid var(--color-primary);

	padding:					0 2rem;

	background-color:				var(--color-background-offset);
}

#content .hintbox::before {
	content:					"i";

	display:					block;

	position:					absolute;
	left:						calc(-.75rem - 2px);
	top:						1rem;

	width:						1.5rem;
	height:						1.5rem;

	border-radius:					100%;

	background-color:				var(--color-primary);

	font-weight:					bold;
	font-size:					1rem;
	text-align:					center;
	color:						white;
}

#content .hintbox.warning {
	border-left:					4px solid red;
}

#content .hintbox.warning::before {
	content:					"!";
	background-color:				red;
}

/* -[ Anmerkungen ]------------------------------------------------------------------------------------------------------------ */
#content .remark {
	display:					flow-root;
	margin:						1rem 0;

	border-left:					4px solid var(--color-remark-bar);

	padding:					0 2rem;

	background-color:				var(--color-remark-background);
}

#content .remark.fixme {
	border-left:					4px solid var(--color-remark-fixme-bar);
	background-color:				var(--color-remark-fixme-background);
}


/* -[ Leerraum ]--------------------------------------------------------------------------------------------------------------- */
#content hr.space {
	border:						none;
}

#content hr.space.small {
	margin-bottom:					3em;
}






/* ============================================================================================================================
   B E N U T Z E R S C H N I T T S T E L L E
   ============================================================================================================================ */

/* -[ Gruppendefinitionen ]---------------------------------------------------------------------------------------------------- */
#content .ui-group-def {
	display:					flow-root;

	margin:						1rem 0;
	padding:					0 1rem;

	background-color:				var(--color-background-offset);
}

#content .ui-group-def > .ui-group-id {
	margin:						.5lh 0;
	font-weight:					bold;
}

#content .ui-group-def > .ui-label {
}

#content .ui-group-def > .ui-label > span:first-child {
	margin-right:					2em;
	font-size:					70%;
}

#content .ui-group-def > .ui-label > span:not(:first-child) {
	font-family:					monospace;
}

/* -[ Gruppen(inhalte) ]------------------------------------------------------------------------------------------------------- */
#content .ui-group {
	margin:						1rem 0;
}

#content .ui-group > .ui-group-id {
	margin:						1rem 0;
	font-size:					70%;
}

#content .ui-group > .ui-group-id::before {
	content:					'→';
	margin-right:					1em;
}

#content .ui-group > .ui-constant {
	display:					flow-root;
	margin:						1rem 0;
	padding:					0 1rem;
	background-color:				var(--color-background-offset);
}

#content .ui-group > .ui-constant > .ui-label {
	float:						left;
	margin-top:					1.2lh;
	margin-right:					2em;

	font-size:					70%;
}

#content .ui-group > .ui-constant.help {
	background-color:				var(--color-ui-background-help);
}

#content .ui-group > .ui-constant.warning {
	background-color:				var(--color-ui-background-warning);
}

#content .ui-group > .ui-constant.error {
	background-color:				var(--color-ui-background-error);
}




/* ============================================================================================================================
   A B S A T Z E B E N E
   ============================================================================================================================ */
#content section > p {
	text-align:					justify;
}

#content ul.tight p,
#content ol.tight p {
	margin:						.3em 0;
}





/* ============================================================================================================================
   Z E I C H E N E B E N E
   ============================================================================================================================ */

/* -[ Feststehende Begriffe ]-------------------------------------------------------------------------------------------------- */
#content .termpath {
}

#content .term {
	font-weight:					bold;
	color:						var(--color-term);
}

#content .term.button {
	margin:						.2rem 0;
	border:						1px solid #A6ABB4;
	border-radius:					3px;

	padding:					2px 8px;

	font-family:					Arial, Verdana, sans-serif;
	font-size:					10pt;
	font-weight:					normal;

	background-color:				rgb(232,232,232);
	color:						black;
}


#content .term.marker {
	display:					inline-block;

	min-width:					1.5em;
	height:						1.5em;

	padding:					.2em;

	background-color:				rgb(209,16,115);

	font-size:					80%;
	font-weight:					bold;
	text-align:					center;
	vertical-align:					middle;
	color:						rgb(255,255,255);
}

#content .term.tag {
	display:					inline-block;

	margin:						0px;

	border:						1px solid;
	border-radius:					7px;

	padding:					0 .3em;

	background-color:				rgb(255,255,255);
	border-color:					rgb(203,203,203);
	color:						rgb(0,0,0);

	font-size:					80%;
}

#content .term.tag.red					{ background-color: rgb(255,201,201); border-color: rgb(203,160,160); }
#content .term.tag.orange				{ background-color: rgb(255,232,201); border-color: rgb(203,185,160); }
#content .term.tag.yellow				{ background-color: rgb(255,255,201); border-color: rgb(203,203,160); }
#content .term.tag.green				{ background-color: rgb(201,255,201); border-color: rgb(160,203,160); }
#content .term.tag.blue					{ background-color: rgb(201,255,255); border-color: rgb(160,203,203); }
#content .term.tag.indigo				{ background-color: rgb(201,232,255); border-color: rgb(160,185,203); }
#content .term.tag.violet				{ background-color: rgb(232,201,255); border-color: rgb(185,160,203); }
#content .term.tag.white				{ background-color: rgb(255,255,255); border-color: rgb(203,203,203); }
#content .term.tag.grey					{ background-color: rgb(232,232,232); border-color: rgb(185,185,185); }
#content .term.tag.black				{ background-color: rgb(180,180,180); border-color: rgb(143,143,143); }

/* -[ Code ]------------------------------------------------------------------------------------------------------------------- */
#content code {
	padding:					0 .4em;

	background-color:				var(--color-background-offset);

	font-family:					monospace;
}


/* -[ Hyperverweise ]---------------------------------------------------------------------------------------------------------- */
a[href] {
	font-weight:					normal;
	text-decoration:				none;
	color:						var(--color-primary);
}

a[href^="http://"]::after,
a[href^="https://"]::after {
	font-family:					"Font Awesome 6 Free";
	font-size:					smaller;
	margin-left:					.4em;
	content:					"\F08E";
}

a[href]:visited {
	color:						var(--color-primary);
}

a[href]:hover {
	transition:					color .5s;
	font-weight:					normal;

	color:						var(--color-secondary);
}

a[href]:active {
	color:						var(--color-secondary);
}




/* ============================================================================================================================
   T Y P O G R A P H I E
   ============================================================================================================================ */
.numbering {
}

#content .caption .numbering {
	text-decoration:				underline;
}

#content .caption .numbering::after {
	content:					":";
}




/* ============================================================================================================================
   A D O R N M E N T S
   ============================================================================================================================ */
#content .adorned::before {
	display:					inline-block;
	vertical-align:					middle;
	margin:						0px 4px;
	filter:						var(--filter-bw);

	--filter-bw:					;
	--filter-color:					;
}

@media (prefers-color-scheme: dark) {
	#content .adorned::before {
		--filter-bw:				invert();
		--filter-color:				drop-shadow( 0 0 2px rgba(255,255,255,.5) );
	}
}


#content .adorned.controlCheckbox::before		{ width: 13px; content: url(adornments/control_checkbox.svg); }
#content .adorned.controlCheckboxChecked::before	{ width: 13px; content: url(adornments/control_checkbox_checked.svg); }
#content .adorned.controlCheckboxTristate::before	{ width: 13px; content: url(adornments/control_checkbox_tristate.svg); }
#content .adorned.controlLockClosed::before		{ width: 13px; content: url(adornments/control_lock_closed.svg); }
#content .adorned.controlLockOpen::before		{ width: 13px; content: url(adornments/control_lock_open.svg); }
#content .adorned.controlRadio::before			{ width: 13px; content: url(adornments/control_radio.svg); }
#content .adorned.controlRadioChecked::before		{ width: 13px; content: url(adornments/control_radio_checked.svg); }

#content .adorned.infoError::before			{ width: 16px; content: url(adornments/info_error.svg); filter: var(--filter-color); }
#content .adorned.infoHelp::before			{ width: 16px; content: url(adornments/info_help.svg); filter: var(--filter-color); }
#content .adorned.infoInfo::before			{ width: 16px; content: url(adornments/info_info.svg); filter: var(--filter-color); }
#content .adorned.infoOkay::before			{ width: 16px; content: url(adornments/info_okay.svg); filter: var(--filter-color); }
#content .adorned.infoQuestion::before			{ width: 16px; content: url(adornments/info_question.svg); filter: var(--filter-color); }
#content .adorned.infoWarning::before			{ width: 16px; content: url(adornments/info_warning.svg); filter: var(--filter-color); }

#content .adorned.listAdd::before			{ width: 15px; content: url(adornments/list_add.svg); }
#content .adorned.listDelete::before			{ width: 15px; content: url(adornments/list_delete.svg); }
#content .adorned.listEdit::before			{ width: 16px; content: url(adornments/list_edit.svg); }
#content .adorned.listEditMain::before			{ width: 18px; content: url(adornments/list_edit_main.svg); }
#content .adorned.listEditWindow::before		{ width: 18px; content: url(adornments/list_edit_window.svg); }
#content .adorned.listMoveDown::before			{ width: 15px; content: url(adornments/list_move_down.svg); }
#content .adorned.listMoveUp::before			{ width: 15px; content: url(adornments/list_move_up.svg); }

#content .adorned.miscClipboardEdit::before		{ width: 16px; content: url(adornments/misc_clipboard_edit.svg); }
#content .adorned.miscClipboardEmpty::before		{ width: 16px; content: url(adornments/misc_clipboard_empty.svg); }
#content .adorned.miscClipboardText::before		{ width: 16px; content: url(adornments/misc_clipboard_text.svg); }
#content .adorned.miscEdit::before			{ width: 16px; content: url(adornments/misc_edit.svg); }
#content .adorned.miscEye::before			{ width: 16px; content: url(adornments/misc_eye.svg); }
#content .adorned.miscFunnel::before			{ width: 16px; content: url(adornments/misc_funnel.svg); }
#content .adorned.miscObject::before			{ width: 16px; content: url(adornments/misc_object.svg); }
#content .adorned.miscRefresh::before			{ width: 16px; content: url(adornments/misc_refresh.svg); }

#content .adorned.statusCalls::before			{ width: 16px; content: url(adornments/status_calls.svg); }
#content .adorned.statusCallsWarning::before		{ width: 16px; content: url(adornments/status_calls_warning.svg); filter: var(--filter-color); }
#content .adorned.statusCallsCritical::before		{ width: 16px; content: url(adornments/status_calls_critical.svg); filter: var(--filter-color); }
#content .adorned.statusCpu::before			{ width: 16px; content: url(adornments/status_cpu.svg); }
#content .adorned.statusCpuWarning::before		{ width: 16px; content: url(adornments/status_cpu_warning.svg); filter: var(--filter-color); }
#content .adorned.statusCpuCritical::before		{ width: 16px; content: url(adornments/status_cpu_critical.svg); filter: var(--filter-color); }
#content .adorned.statusDisk::before			{ width: 17px; content: url(adornments/status_disk.svg); }
#content .adorned.statusDiskWarning::before		{ width: 17px; content: url(adornments/status_disk_warning.svg); filter: var(--filter-color); }
#content .adorned.statusDiskCritical::before		{ width: 17px; content: url(adornments/status_disk_critical.svg); filter: var(--filter-color); }
#content .adorned.statusRam::before			{ width: 17px; content: url(adornments/status_ram.svg); }
#content .adorned.statusRamWarning::before		{ width: 17px; content: url(adornments/status_ram_warning.svg); filter: var(--filter-color); }
#content .adorned.statusRamCritical::before		{ width: 17px; content: url(adornments/status_ram_critical.svg); filter: var(--filter-color); }
#content .adorned.statusRecording::before		{ width: 17px; content: url(adornments/status_recording.svg); }

#content .adorned.tagDelete::before			{ width: 12px; content: url(adornments/tag_delete.svg); }
#content .adorned.tagManageDelete::before		{ width: 13px; content: url(adornments/tag_manage_delete.svg); }
#content .adorned.tagManageEdit::before			{ width: 6px; content: url(adornments/tag_manage_edit.svg); }
#content .adorned.tagRewriteSet::before			{ width: 14px; content: url(adornments/tag_rewrite_set.svg); }
#content .adorned.tagRewriteDelete::before		{ width: 14px; content: url(adornments/tag_rewrite_delete.svg); }
#content .adorned.tagRewritePassthrough::before		{ width: 14px; content: url(adornments/tag_rewrite_passthrough.svg); }

#content .adorned.telMatchAnything::before		{ width: 14px; content: url(adornments/tel_match_anything.svg); }
#content .adorned.telMatchDigits::before		{ width: 12px; content: url(adornments/tel_match_digits.svg); }
#content .adorned.telMatchDiscard::before		{ width: 16px; content: url(adornments/tel_match_discard.svg); }
#content .adorned.telRewriteAdvanced::before		{ width: 14px; content: url(adornments/tel_rewrite_advanced.svg); }
#content .adorned.telRewriteCapture::before		{ width: 16px; content: url(adornments/tel_rewrite_capture.svg); }





/* ============================================================================================================================
   V O R F O R M A T I E R U N G
   ============================================================================================================================ */

/* -[ Vorformatierter Block ]-------------------------------------------------------------------------------------------------- */
#content .pre {
	display:					table;

	margin:						1rem 0;
	width:						100%;

	background-color:				var(--color-listing-background);
}


/* -[ Zeile ]------------------------------------------------------------------------------------------------------------------ */
#content .pre > div {
	display:					table-row;
}

#content .pre > div:before {
	content:					'\00A0';
	user-select:					none;
}

#content .pre > div:nth-child(2n+0) {
	background-color:				var(--color-listing-background-alt);
}

#content .pre > div.lsn {
}

#content .pre > div.lsi {
	font-weight:					bold;
}


/* -[ Zeilennummer ]----------------------------------------------------------------------------------------------------------- */
#content .pre .ln {
	display:					table-cell;
	user-select:					none;

	padding-left:					.5rem;

	font-size:					50%;
	text-align:					right;
	vertical-align:					top;
}

/* -[ Zeileninhalt ]----------------------------------------------------------------------------------------------------------- */
#content .pre .lc {
	display:					table-cell;

	width:						100%;

	padding-left:					.5rem;
	padding-right:					.5rem;

	font-family:					monospace;
	white-space:					nowrap;
}

#content .pre .lc > span {
	display:					inline;

	margin:						0;
	padding:					0;

	font-family:					monospace;
	white-space:					pre;

	vertical-align:					top;
}

#content .pre .lc > .lcs {
	overflow-wrap:					break-word;
	word-break:					break-all;
	white-space:					pre-wrap;
}

/* -[ Segmentstile ]----------------------------------------------------------------------------------------------------------- */
#content .pre .lc > .lcp {
	display:					inline-block;

	margin-right:					.25rem;

	font-weight:					normal;
	user-select:					none;
}
