/* Das ist meine Stylesheet-Datei */

/* @import url('fonts.css');

@import url('color.css'); */

:root {
	/* Farbnamen siehe https://wiki.selfhtml.org/wiki/Grafik/Farbpaletten#Farbnamen */
	/* Gladbach: clr_grundfarbton = 86; hex = #7ab92c bzw. #8dff00 fuer den Grundfarbton */
	--clr_grundfarbton: 224;
	--clr_a_link: rgb(0, 0, 139);
	--clr_a_hover: rgb(136, 206, 235);
	--clr_font_standard: rgb(0, 0, 0);
	--clr_header_title_background: rgb(192, 192, 192);
	--clr_header_title_font: rgb(240, 248, 255);
	--clr_tooltip_checked: hsl(0, 79%, 58%);
	--clr_tooltip: hsl(0, 0%, 0%);
	--clr_zes_plus: hsl(160, 90%, 35%);
	--clr_zes_minus: hsl(0, 98%, 65%);
	--clr_caption_background: rgb(100, 149, 237);
	--clr_caption_font: rgb(255, 255, 255);
	--clr_section_background: white;
	--clr_error_border: crimson;
	--clr_error_background: hsl(0, 100%, 94%);
	--clr_rollit_menu: hsl(120, 100%, 25%);
	--clr_header_title_mirror: hsl(0, 0%, 76%);
	--clr_header_br_backup: hsl(0, 45%, 70%);
	--clr_header_br_restore: hsl(120, 35%, 72%);
	--clr_header_br_notmounted: hsl(293, 99%, 43%);

	--clr_btipp_ewige_plus: palegreen;
	--clr_btipp_ewige_minus: lightpink;

	--fieldset_border_width: 1px;
	--fieldset_border_style: solid;
	--fieldset_border_radius: 3px;
	--clr_money_minus: hsl(0, 100%, 44%);
	--clr_money_plus: hsl(120, 100%, 20%);

	/* Schriftgroesse mindestens 0.4rem; maximal 2rem;
	 * ansonsten 1% der Viewport-Breite, wobei der jeweils kleinere Wert
	 * zwischen 2rem und 1.0vw gewaehlt wird. */
	/* --fontsize_standard: 0.9vw; */
	/* --fontsize_standard: max(0.4rem, min(2rem, 1.0vw)); */
	--fontsize_standard: 1rem;
	--fontfamily: hbsans, Arial, sans-serif;

	--padding_tablecell: 0.3rem;

	--media_max: 500px;
	--media_min: 502px;

	font-family: var(--fontfamily);
	font-size: var(--fontsize_standard);
}

* {
	padding: 0;
	box-sizing: border-box;
	margin: 0;
}

body {
	background-image: linear-gradient(var(--clr_body_top_background), var(--clr_body_bottom_background));
	background-repeat: repeat-x;
	background-attachment: fixed;
	background-size: 100% 100%;
}

/* Die Raute */
body.raute {
	background-color: rgb(247, 247, 247);
	background-image: url("/hbpics/vfl2.png");
	background-size: auto;
	background-repeat: repeat;
	background-blend-mode: overlay;
}

body>img {
	animation: vflrotate 10s infinite linear;
	width: 50px;
	position: absolute;
	top: 0;
	left: 0;
	opacity: 0.05;
	z-index: -1;
}

@keyframes vflrotate {
	0% {
		transform: perspective(300px) rotateY(0deg)
	}

	25% {
		transform: perspective(300px) rotateY(90deg)
	}

	50% {
		transform: perspective(300px) rotateY(180deg)
	}

	75% {
		transform: perspective(300px) rotateY(270deg)
	}

	100% {
		transform: perspective(300px) rotateY(360deg)
	}
}

body>article>span.branch {
	display: block;
	padding: 2px;
	position: fixed;
	top: 5px;
	right: 5px;
	border: 1px solid white;
	background-color: var(--clr_money_minus);
	color: white;
	box-shadow: 0 0 2em 0.2em var(--clr_tooltip_boxshadow);
	border-radius: 0.5em;
	max-width: 100%;
	max-height: 15ex;
	overflow: auto;
}

a:link {
	color: var(--clr_a_link);
	text-decoration: none;
}

a:visited {
	color: var(--clr_a_link);
	text-decoration: none;
}

a:hover {
	text-decoration: underline overline;
	background-color: var(--clr_a_hover);
}

a:active {
	text-decoration: underline overline;
	background-color: var(--clr_a_hover);
}

a:link#title {
	color: var(--clr_a_link);
	text-decoration: none;
	font-weight: bold;
}

a:visited#title {
	color: var(--clr_a_link);
	text-decoration: none;
	font-weight: bold;
}

a.piclink:hover {
	border-style: none;
	background-color: transparent;
}

a.piclink img {
	vertical-align: middle;
	border-style: none;
	width: var(--fontsize_standard);
	height: var(--fontsize_standard);
}

.picturemap {
	opacity: 0.5;
	transition: opacity 0.5s ease-in-out;
}

.picturemap:hover {
	opacity: 1.0;
}

/* label { */
/* cursor: pointer; */
/* -moz-user-select: none;
	-ms-user-select: none;
	-webkit-user-select: none;
	user-select: none; */
/* } */

span.tooltip>label {
	cursor: pointer;
}

div.highlight {
	color: var(--clr_ueberschrift);
	width: fit-content;
	text-align: justify;
	border: 1px solid var(--clr_ueberschrift);
	padding: 1ch;
	margin: 2ch auto;
}

.h1 {
	font-size: 200%;
}

.h2 {
	font-size: 150%;
}

.h3 {
	font-size: 117%;
}

.h4 {
	font-size: 112%;
}

.small {
	font-size: small;
}

article.wrapper5 {
	background-color: var(--clr_wrapper_background);
	color: var(--clr_font_standard);
	border-style: solid;
	border-color: var(--clr_wrapper_border);
	box-shadow: 0 0 2em 0.3em;
	display: inline-block;
}

/* Footer */
/* footer {
	background-color: var(--clr_header_background);
} */
footer>grid {
	font-size: small;
}

footer>grid>div {
	font-style: italic;
}

footer>grid>div:nth-child(1) {
	justify-self: start;
}

footer>grid>div a:hover {
	text-decoration: none;
	background-color: transparent;
}

footer>grid>div a>img.rotate {
	animation: vflrotate 3s infinite ease-in-out;
}

footer>grid>div a>img {
	vertical-align: middle;
	height: 16px;
}

section {
	margin: 5px 5px 0 5px;
	padding: 5px;
	border: 1px solid var(--clr_header_title_background);
	background-color: var(--clr_section_background);
	background-image: none;
	background-size: contain;
	background-repeat: no-repeat;
	background-position: center;
}

section>grid {
	row-gap: 0;
}

.hstretch {
	justify-content: stretch;
}

.jstart {
	justify-self: start;
}

.jend {
	justify-self: end;
}

.jcenter {
	justify-self: center;
}

.t04 {
	width: 50em;
}

.t04>h2 {
	text-align: center;
}

.t04>p {
	font-weight: normal;
	margin: 1ch 0;
}

.t09_update h3 {
	text-align: left;
}

.t12_hotlink>fieldset>grid.ua>div:last-child {
	background-color: darkkhaki;
}

.t14_auskunft>h3 {
	align-self: center;
}

.t14_bkgclr {
	background-color: var(--clr_td_background);
}

.t15>fieldset {
	margin-top: 2ch;
}

.t15_pokal {
	font-weight: bold;
	font-size: 1.5rem;
}

.t15_pokal.vflex>.hflex {
	margin: 0 0 0.5ch 0;
}

.t15_pokal>.hflex>span:first-child {
	width: 15ch;
}

.t15_pokal>.hflex>span:not(:first-child) {
	width: 10ch;
	text-align: center;
}

.t15_pokal>.hflex:nth-child(2)>span {
	background: var(--clr_header_background);
	color: var(--clr_ueberschrift);
}

.t15_spielen {
	font-size: 3rem;
	text-align: center;
	margin-top: 2ch;
}

.t15_spielen>fieldset>legend {
	font-size: 1.9em;
	text-align: center;
	margin-top: 2ch;
}

.t15_spielen>fieldset>.hflex>* {
	width: 20ch;
}

.t15_spielen>fieldset>.hflex:nth-of-type(2)>.hflex>.vflex {
	border: 1px solid var(--clr_ueberschrift);
	color: var(--clr_ueberschrift);
	width: 100%
}

.t15_spielen>fieldset>.hflex:nth-of-type(2)>.hflex>.vflex>span:not(:first-of-type) {
	font-size: 2rem;
	font-weight: normal;
	margin: 3px 0;
}

.t15_spielen>fieldset>.hflex:nth-of-type(2)>.hflex>.vflex>span:first-of-type {
	margin: 1ch 0;
}

.t15_spielen>fieldset>.hflex:nth-of-type(3)>input[type="number"] {
	font-size: 3rem;
}

.t16_update>figure {
	margin: auto;
}

.t16_update>.hflex>label {
	width: 20ch;
}

.t16_tools>fieldset {
	margin-bottom: 2ch;
}

.t16_tools>fieldset>p {
	margin: auto;
	color: var(--clr_ueberschrift);
	text-align: center;
	padding: 1ch;
}

.t16_tools>fieldset>div {
	display: flex;
	justify-content: center;
}

.t16_border1 {
	border: 1px solid black;
	box-shadow: 0em 0em 1em 0.3em rgb(50, 50, 50);
}

.t16_block1 {
	display: block;
	position: fixed;
	top: 150px;
	left: 100px;
}

.t16_block2 {
	display: block;
	position: fixed;
	top: 15px;
	right: 100px;
}

.t16_block3 {
	display: block;
	position: fixed;
	top: 150px;
	right: 100px;
}

.t16_block4 {
	display: block;
	position: fixed;
	top: 10px;
	right: 10px;
}

.t16_block5 {
	display: block;
	position: fixed;
	top: 15px;
	right: 50px;
}

.t16_box1 {
	box-shadow: 0 0 2.5em rgba(0, 0, 0, 0.5);
}

.t17>.hflex>.hflex:first-of-type>label {
	width: 13ch;
	text-align: left;
	margin-right: 1ch;
}

.t18 .hflex>label:first-child {
	width: 18ch;
}

.t21_training_list>.hflex:first-of-type {
	margin-bottom: 2ch;
}

.t21_training_list>.hflex>span:first-child {
	width: 20ch;
	text-align: left;
}

.t21_training_list>.hflex>span:nth-child(2) {
	background-color: var(--clr_btipp_ewige_minus);
	width: 4ch;
	text-align: center;
}

.t21_training_list>.hflex>span:nth-child(3) {
	background-color: var(--clr_btipp_ewige_plus);
	width: 4ch;
	text-align: center;
}

.t21_training_list>.hflex>span:nth-child(4),
.t21_training_list>.hflex>span:nth-child(5),
.t21_training_list>.hflex>a {
	font-weight: normal;
}

.t21_training_text {
	align-items: center;
	margin-bottom: 3ch;
}

.t21_training_text>*:not(:last-child) {
	margin-bottom: 2ch;
}

.t21_training_text>.hflex:first-of-type>span {
	padding: 10px;
	font-size: 2rem;
}

.t21_training_text>.hflex:first-of-type>span:first-child {
	background-color: var(--clr_btipp_ewige_minus);
}

.t21_training_text>.hflex:first-of-type>span:last-child {
	background-color: var(--clr_btipp_ewige_plus);
}

.t21_training_text>span#aufgabe {
	font-size: 2rem;
	font-weight: normal;
	border: 3px double grey;
	background-color: var(--clr_wrapper_background);
	text-align: center;
	padding: 2ch;
}

.t21_training_text>span#loesung {
	font-size: 2rem;
	font-weight: normal;
	border: 3px double grey;
	text-align: center;
	padding: 2ch;
}

.t21_training_text>span#loesung.minus {
	background-color: var(--clr_btipp_ewige_minus);
}

.t21_training_text>span#loesung.plus {
	background-color: var(--clr_btipp_ewige_plus);
}

.t21_training_text>span#comment:first-of-type {
	font-size: 2rem;
	font-weight: normal;
	border: 3px double grey;
	text-align: center;
	padding: 2ch;
}

.t21_training_text>span#comment:first-of-type.plus {
	background-color: var(--clr_btipp_ewige_plus);
}

.t21_training_text>span#comment:first-of-type.minus {
	background-color: var(--clr_btipp_ewige_minus);
}

.t21_training_text>.hflex.vier {
	margin: 0;
}

.t21_training_text>.hflex.vier>button {
	width: 60ch;
}

.t21_anzeige>.hflex>label {
	width: 10ch;
}

.t21_erfassen>.hflex>label {
	width: 10ch;
}

fieldset.t23 {
	margin: 2ch;
}

.t23_auswertung {
	display: flex;
	justify-content: center;
}

.t23_auswertung>span {
	margin: 1px;
	width: 17ch;
}

.t23_auswertung>span:first-of-type {
	width: 20ch;
}

.t23_auswertung.eins {
	margin-top: 2ch;
}

.t23_auswertung.eins>span {
	background-color: var(--clr_wrapper_background);
}

.t23_auswertung.zwei>span:first-of-type {
	background-color: var(--clr_wrapper_background);
}

.t23_auswertung.zwei>span:not(:first-of-type) {
	width: calc(17ch/2 - 1px);
	background-color: var(--clr_wrapper_background);
}

.t23_auswertung.drei>span:first-of-type {
	background-color: var(--clr_wrapper_background);
}

.t23_auswertung.drei>span:not(:first-of-type) {
	width: calc(17ch/2 - 1px);
	background-color: var(--clr_wrapper_background);
}

.t23_auswertung.summe1>span:first-of-type {
	background-color: var(--clr_header_title);
}

.t23_auswertung.summe1>span:not(:first-of-type) {
	width: calc(17ch/2 - 1px);
	background-color: var(--clr_header_title);
}

.t23_auswertung.summe2 {
	margin-bottom: 2ch;
}

.t23_auswertung.summe2>span {
	background-color: var(--clr_header_title);
}

.t23_auswertung>span.rot {
	color: var(--clr_money_minus);
}

.t23_auswertung>span.gruen {
	color: var(--clr_money_plus);
}

.t23_search>.hflex {
	margin: 0;
}

.t23_search>.hflex>.hflex:first-child>label {
	width: 15ch;
}

.t23_summen {
	align-items: center;
}

.t23_summen>.hflex:first-of-type>fett:nth-child(2),
.t23_summen>.hflex:first-of-type>span {
	color: var(--clr_money_plus);
}

.t23_summen>.hflex:nth-of-type(2)>fett:nth-child(2) {
	border-bottom: 1px solid black;
}

.t23_summen>.hflex:nth-of-type(2)>fett:nth-child(2),
.t23_summen>.hflex:nth-of-type(2)>span {
	color: var(--clr_money_minus);
}

.t23_summen>.hflex>fett:nth-child(1) {
	width: 20ch;
}

.t23_summen>.hflex>fett:nth-child(2) {
	width: 15ch;
	text-align: right;
}

.t23_summen>.hflex>span {
	width: 15ch;
	font-weight: normal;
	text-align: right;
}

.t23_ewige_plus {
	background-color: var(--clr_btipp_ewige_plus);
}

.t23_ewige_minus {
	background-color: var(--clr_btipp_ewige_minus);
}

.t32>.hflex>.vflex>fieldset {
	margin: 1ch;
	padding: 0 1ch;
}

.t32>.hflex>.vflex>fieldset:focus-within {
	border: 1px solid var(--clr_wrapper_border);
	background-color: var(--clr_fieldset_focus_background);
}

.t32>.hflex>.vflex>fieldset>.hflex>.hflex>label {
	width: 10ch;
}

.t32>.hflex input[type="checkbox"] {
	align-self: center;
}

.t33>fieldset {
	align-self: stretch;
	font-weight: normal;
}

.t33>fieldset>.hflex {
	flex-wrap: wrap;
}

.t33>fieldset>p.highlight {
	max-width: 80ch;
}

.t33>fieldset input[type="checkbox"].hack {
	display: none;
}

.t33>fieldset input[type="checkbox"].hack~p {
	display: none;
}

.t33>fieldset input[type="checkbox"].hack+legend>label {
	color: var(--clr_a_link);
}

.t33>fieldset input[type="checkbox"].hack+legend>label:hover {
	background-color: var(--clr_a_hover);
	text-decoration: underline;
}

.t33>fieldset input[type="checkbox"].hack:checked~p {
	display: block;
	margin: 1ch auto;
	width: fit-content;
	font-weight: normal;
	font-size: 0.9rem;
}

.t33>fieldset:not(:last-child) {
	margin-bottom: 2ch;
}

.t33>fieldset.color>.hflex,
.t33>fieldset.fenster>.hflex {
	align-items: center;
}

.impressum {
	padding: 2ch;
	font-weight: normal;
	max-width: 100ch;
}

.impressum>*:not(:last-child) {
	margin-bottom: 1ch;
}

.impressum>p {
	padding-left: 2ch;
	padding-right: 2ch;
	text-align: justify;
}

.fixsearch {
	display: flex;
	justify-content: center;
	align-items: center;
	margin: 1em 0;
}

.fixsearch>span {
	font-weight: bold;
}

.fixsearch>* {
	margin: 0 1ch 0 0;
}

.fixsearch>*:last-child {
	margin: 0;
}

.fixsearch>a.reload {
	font-size: 1.5rem;
	text-decoration: none;
}

.fixsearch>a:hover.reload {
	background-color: transparent;
}

.fixsearch>button:last-of-type:not(:last-child) {
	margin-right: 1ch;
}

.commitmsg {
	background-color: var(--clr_commitmsg_background);
	border: 1px solid var(--clr_commitmsg_border);
	border-radius: 1ch;
	box-shadow: 0 0 19px 4px grey;
	margin: 5ex auto;
	font-weight: bold;
	font-size: 1.3rem;
	max-width: fit-content;
}

form #error {
	border: 1px solid red;
}

form input[type="text"],
form input[type="password"],
form input[type="tel"],
form input[type="email"],
form input[type="url"],
form input[type="number"],
form input[type="date"],
form input[type="time"],
form textarea,
form select {
	border: 1px solid var(--clr_wrapper_border);
	border-radius: 0.3em;
	/*
	padding: 1px;
*/
	font-family: var(--fontfamily);
	font-size: 1rem;
}

form input[type="file"] {
	font-weight: bold;
	color: var(--clr_ueberschrift);
}

form textarea {
	resize: vertical;
}

form input[type="text"]:focus,
form input[type="password"]:focus,
form input[type="tel"]:focus,
form input[type="email"]:focus,
form input[type="number"]:focus,
form input[type="date"]:focus,
form input[type="time"]:focus,
form textarea:focus {
	outline: none;
}

form input[type="password"]:invalid,
form input[type="tel"]:invalid,
form input[type="email"]:invalid,
form input[type="number"]:invalid,
form input[type="date"]:invalid,
form input[type="text"]:invalid,
form input[type="time"]:invalid {
	border: 1px solid var(--clr_error_border);
}

input[readonly="readonly"],
textarea[readonly="readonly"] {
	background-color: var(--clr_wrapper_background);
}

input[type="submit"],
button,
a.button_notactive,
a.button_active,
label.button {
	padding: 0 var(--padding_tablecell);
	/* margin: 5px; */
	text-shadow: 2px 2px 5px var(--clr_button_textshadow);
	border-radius: 0.3vw;
	border: 1px solid var(--clr_button_border);
	background: var(--clr_button_background);
	font-family: var(--fontfamily);
	font-size: 1rem;
	font-weight: bold;
	text-decoration: none;
	color: var(--clr_button);
	cursor: default;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	box-shadow: 1px 1px 5px 0px var(--clr_button_border);
}

button>img {
	vertical-align: middle;
}

input[type="submit"]:hover,
button:hover,
a.button_notactive:hover,
label.button:hover {
	background: var(--clr_header_background);
	transition: background-color 1.5s;
}

/* input[type="submit"]:first-of-type, */
/* button:first-of-type, */
/* a.button_notactive,
a.button_active {
	margin-left: 0;
}

input[type="submit"]:last-of-type, */
/* button:last-of-type, */
/* a.button_notactive,
a.button_active {
	margin-right: 0;
} */

a.button_notactive>img,
a.button_active>img {
	vertical-align: middle;
}

a.button_active {
	pointer-events: none;
	background: var(--clr_button_active);
	font-weight: bold;
}

/* Allgemeine styles */
._center {
	text-align: center;
}

._fett {
	font-weight: bold;
}

._justify {
	text-align: justify;
}

._vtop {
	vertical-align: top;
}

._vmiddle {
	vertical-align: middle;
}

._vbottom {
	vertical-align: bottom;
}

._vsuper {
	vertical-align: super;
}

._unterstrich {
	text-decoration: underline;
}

._durchstrich {
	text-decoration: line-through;
}

fett {
	font-weight: bold;
}

underline {
	text-decoration: underline;
}

._font050 {
	font-size: 0.5rem;
}

._font080 {
	font-size: 0.8rem;
}

._font110 {
	font-size: 1.1rem;
}

._font130 {
	font-size: 1.3rem;
}

._font150 {
	font-size: 1.5rem;
}

._font180 {
	font-size: 1.8rem;
}

._font200 {
	font-size: 2rem;
}

._font250 {
	font-size: 2.5rem;
}

._font200p {
	font-size: 200%;
}

._normal {
	font-weight: normal;
	font-style: normal;
	white-space: normal;
}

._fsnormal {
	font-style: normal;
}

._kursiv {
	font-style: italic;
}

._colormoneyminus {
	color: var(--clr_money_minus);
}

._colormoneyplus {
	color: var(--clr_money_plus);
}

._colordarkblue {
	color: darkblue;
}

._colordarkred {
	color: darkred;
}

._colordarkgreen {
	color: darkgreen;
}

._colorblue {
	color: blue;
}

._colorblack {
	color: black;
}

._colorbrown {
	color: #7C5800;
}

._colorwhite {
	color: white;
}

._colorred {
	color: red;
}

._colordarkred {
	color: darkred;
}

._colorgreen {
	color: green;
}

._colorgreenalt {
	color: hsl(120, 51%, 52%);
}

._bkcolorhellblau {
	background-color: hsl(228, 100%, 90%);
}

._bkcolordarkred {
	background-color: darkred;
}

._border1sb {
	border: 1px solid blue;
}

._w90p {
	width: 90%;
}

._w95p {
	width: 95%;
}

._w20px {
	width: 20px;
}

._w16px {
	width: 16px;
}

._w200px {
	width: 200px;
}

._w300px {
	width: 300px;
}

._w70p {
	width: 70%;
}

._w50max {
	max-width: 50ex;
}

._noborder {
	border: 0;
}

._borderblack {
	border: 1px solid black;
}

._borderred {
	border: 1px solid red;
}

._floatleft {
	float: left;
	width: 20ex;
}

._hidden {
	visibility: hidden;
}

._boxshadow1 {
	box-shadow: 0em 0em 2em 0.5em;
}

.class01 {
	position: fixed;
	top: 10px;
	left: 10px;
	z-index: 100;
}

.class02 {
	border: 1px solid black;
	position: absolute;
	left: 0;
	top: 0;
}

._vertical {
	border: 0;
	background-color: var(--clr_section_background);
}

._vertical>div {
	transform: rotate(300deg);
	width: 2rem;
}

._vertical>div>span {
	padding: 1ch 1ch;
}

._links {
	text-align: left;
}

._mitte {
	margin-left: auto;
	margin-right: auto;
}

._display_none {
	display: none;
}

._display_block {
	display: block;
}

.bktransparent {
	background-color: transparent;
}

._basecolor50 {
	background-color: hsla(var(--clr_grundfarbton), 35%, 50%, 0.5);
}

._basecolor30 {
	background-color: hsla(var(--clr_grundfarbton), 35%, 50%, 0.3);
}

._basecolor10 {
	background-color: hsla(var(--clr_grundfarbton), 35%, 50%, 0.1);
}

._g1 {
	background-color: rgb(0, 255, 0) !important;
}

._g2 {
	background-color: rgb(0, 225, 0) !important;
}

._g3 {
	background-color: rgb(0, 195, 0) !important;
}

._g4 {
	background-color: rgb(0, 165, 0) !important;
}

._g5 {
	background-color: rgb(0, 135, 0) !important;
}

._rot50 {
	background-color: hsla(0, 100%, 50%, 0.5) !important;
}

._rot30 {
	background-color: hsla(0, 100%, 50%, 0.3) !important;
}

._rot10 {
	background-color: hsla(0, 100%, 50%, 0.1) !important;
}

._gelb50 {
	background-color: hsla(60, 100%, 50%, 0.5) !important;
}

._gruen30 {
	background-color: hsla(120, 100%, 50%, 0.3) !important;
}

._gruen10 {
	background-color: hsla(120, 100%, 50%, 0.1) !important;
}

._blau5 {
	background-color: hsla(240, 100%, 50%, 0.05) !important;
}

._blau10 {
	background-color: hsla(240, 100%, 50%, 0.1) !important;
}

._blau20 {
	background-color: hsla(240, 100%, 50%, 0.2) !important;
}

._dezimal {
	text-align: right;
	font-family: hbubuntumono;
}

._monospace {
	font-family: hbubuntumono;
}

._rechts {
	text-align: right;
}

._nowrap {
	white-space: nowrap;
}

._br {
	border-right: 1px solid black;
}

._lhbreit {
	line-height: 2em;
}

._pad0 {
	padding: 0px;
}

._pad0ou {
	padding-top: 0px;
	padding-bottom: 0px;
}

._pad2 {
	padding: 2px;
}

._pad2lr {
	padding-left: 2px;
	padding-right: 2px;
}

._pad2ou {
	padding-top: 2px;
	padding-bottom: 2px;
}

._pad5 {
	padding: 5px;
}

._pad5lr {
	padding-left: 5px;
	padding-right: 5px;
}

._pad5ou {
	padding-top: 5px;
	padding-bottom: 5px;
}

._pad10 {
	padding: 10px;
}

._pad15 {
	padding: 15px;
}

._pad10lr {
	padding-left: 10px;
	padding-right: 10px;
}

._pad10ou {
	padding-top: 10px;
	padding-bottom: 10px;
}

._pad20 {
	padding: 20px;
}

._pad20lr {
	padding-left: 20px;
	padding-right: 20px;
}

._pad20ou {
	padding-top: 20px;
	padding-bottom: 20px;
}

._pad50 {
	padding: 50px;
}

._pad50lr {
	padding-left: 50px;
	padding-right: 50px;
}

._pad50ou {
	padding-top: 50px;
	padding-bottom: 50px;
}

._margin0 {
	margin: 0px;
}

._margin0ou {
	margin-top: 0px;
	margin-bottom: 0px;
}

._margin2 {
	margin: 2px;
}

._margin2lr {
	margin-left: 2px;
	margin-right: 2px;
}

._margin2ou {
	margin-top: 2px;
	margin-bottom: 2px;
}

._margin5 {
	margin: 5px;
}

._margin5lr {
	margin-left: 5px;
	margin-right: 5px;
}

._margin5ou {
	margin-top: 5px;
	margin-bottom: 5px;
}

._margin10 {
	margin: 10px;
}

._margin10lr {
	margin-left: 10px;
	margin-right: 10px;
}

._margin10ou {
	margin-top: 10px;
	margin-bottom: 10px;
}

._margin20 {
	margin: 20px;
}

._margin20lr {
	margin-left: 20px;
	margin-right: 20px;
}

._margin20ou {
	margin-top: 20px;
	margin-bottom: 20px;
}

._margin50 {
	margin: 50px;
}

._margin50lr {
	margin-left: 50px;
	margin-right: 50px;
}

._margin50ou {
	margin-top: 50px;
	margin-bottom: 50px;
}

form.misc_login {
	padding: 2ch 0 1ch 0;
	border-radius: 0.5ch;
	box-shadow: 0 0 2em 0.7em var(--clr_body_bottom_background);
	max-width: fit-content;
	margin: 5% auto;
}

.baustelle {
	position: fixed;
	left: 1ex;
	top: 1ex;
}

h1.table_notfound {
	color: var(--clr_ueberschrift);
	margin: 1ch;
}

fieldset {
	border-width: var(--fieldset_border_width);
	border-style: var(--fieldset_border_style);
	border-color: var(--fieldset_border_color);
	border-radius: var(--fieldset_border_radius);
	box-shadow: 0px 0px 15px #666;
	padding: 1ch;
}

fieldset:hover {
	background-color: var(--clr_fieldset_produkte_background);
}

fieldset>legend {
	background-color: var(--clr_wrapper_background);
	border-width: var(--fieldset_border_width);
	border-style: var(--fieldset_border_style);
	border-color: var(--fieldset_border_color);
	border-radius: var(--fieldset_border_radius);
	color: var(--clr_wrapper_border);
	font-weight: bold;
	padding: 0 0.5em;
	margin-left: auto;
	margin-right: auto;
	font-size: 1.2em;
}

fieldset>p {
	margin-top: 0;
	margin-bottom: 0;
	margin: 0;
}

div.faqhack {
	text-align: left;
	font-weight: bold;
	color: darkblue;
	width: 100ch;
	padding: 1ch;
}

div.faqhack>label {
	cursor: pointer;
}

div.faqhack input[type="checkbox"] {
	display: none;
}

div.faqhack input[type="checkbox"]+div {
	display: none;
}

div.faqhack input[type="checkbox"]:checked+div {
	display: block;
	font-weight: normal;
	color: black;
	margin-left: 3ch;
}

div.faqhack input[type="checkbox"]:checked+div ul,
div.faqhack input[type="checkbox"]:checked+div ol {
	margin-left: 3ch;
}

.tooltip>input[type="checkbox"] {
	display: none;
}

.tooltip>input[type="checkbox"]+label {
	color: var(--clr_a_link);
}

.tooltip>input[type="checkbox"]+label+span {
	display: none;
}

.tooltip>input[type="checkbox"]+label>span>img {
	width: 12px;
}

/* .tooltip > input:checked + label + span::before { content: '[<a href="/"]>kjdfk</a>]'; } */
.tooltip>input:checked+label+span {
	display: block;
	padding: 2px;
	position: fixed;
	top: 5px;
	left: 5px;
	border: 1px solid var(--clr_tooltip_border);
	background-color: var(--clr_tooltip_background);
	color: var(--clr_tooltip);
	box-shadow: 0 0 2em 0.7em var(--clr_tooltip_boxshadow);
	border-radius: 0.5em;
	max-width: 96%;
	max-height: 95%;
	overflow: auto;
}

.tooltip>input:checked+label {
	color: var(--clr_tooltip_checked);
}

.tooltip>input:checked+label>img {
	border: 1px solid var(--clr_tooltip_checked);
}

/* Das ist fuer das kleine X zum Schliessen des Fensters (siehe hb_tooltip()) */
.tooltip label+span>input[type="checkbox"] {
	display: none;
}

.tooltip>input+label>span:hover {
	text-decoration: overline underline;
	background-color: var(--clr_a_hover);
}

div.caption {
	text-align: center;
	font-size: 1.5rem;
	background-color: var(--clr_caption_background);
	color: var(--clr_caption_font);
	font-weight: bold;
	letter-spacing: 0.4em;
	padding: 5px 0;
}

/* Hilfe */
grid.help {
	grid-template-columns: auto;
	max-width: 50em;
	justify-items: center;
	justify-content: start;
	text-align: justify;
	margin: 3ex;
}

grid.help>div {
	display: inline-grid;
}

grid.help>div>ol,
grid.help>div>ul {
	margin-left: 2em;
}

grid.help.paragraph {
	counter-reset: para;
	max-width: 50vw;
}

grid.help.paragraph .hb::before {
	content: "[HB] ";
}

grid.help.paragraph .hb {
	font-weight: normal;
	font-size: 0.9rem;
	color: red;
	padding: 0 2ex;
}

grid.help.paragraph>div>ul {
	list-style: none;
	margin: 1em 0 0 0;
	font-size: 1.3rem;
	font-weight: bold;
	counter-increment: para;
}

grid.help.paragraph>div>ul::before {
	content: "§ " counter(para) ": ";
}

grid.help.paragraph>div>ul>ul {
	counter-increment: none;
	list-style: initial;
	margin: 0 2ex;
	font-size: inherit;
	font-weight: initial;
}

grid.help.paragraph>div>ul>ul::before {
	content: none;
}

grid.help.paragraph>div>ul>li {
	padding-top: 3px;
	padding-left: 0;
	font-size: initial;
	font-weight: normal;
}

grid.t14_anlage {
	grid-template-columns: 5em minmax(auto, 63ch);
	align-items: start;
	justify-items: left;
}

grid.t14_info {
	row-gap: 0;
}

grid.t14_anlage>div {
	text-align: justify;
}

grid.help>div>ol>li,
grid.help>div>ul>li {
	padding-left: 0.5em;
}

grid.help frage {
	font-style: italic;
	font-weight: bold;
	margin: 10px 0 0 0;
	align-self: flex-start;
}

grid.help>div>h3>img {
	vertical-align: middle;
}

.t14_bemerkungen>div {
	justify-self: flex-start;
	text-align: start;
}

.hilfe.t14>div.anlage {
	align-self: flex-start;
	width: 100%;
	margin-top: 2em;
	border-top: 1px solid grey;
}

.hilfe.t14>div.anlage>h3 {
	margin-top: 1ex;
}

.hilfe.t14>div.anlage>div.hflex {
	margin: 5px 0;
}

.hilfe.t14>div.anlage>div.hflex+h2 {
	text-align: center;
	margin-top: 1em;
}

.hilfe.t14>div.anlage>div.hflex>span:first-of-type {
	font-weight: bold;
	width: 5em;
}

.hilfe.t14>div.anlage>div.hflex>span:first-of-type:not(:empty) {
	margin-top: 0.5ex;
}

.hilfe.t14>div.anlage>div.hflex>span:nth-of-type(2):empty {
	width: 5em;
}

grid.help {
	grid-template-columns: auto;
	max-width: 50em;
	justify-items: center;
	justify-content: start;
	text-align: justify;
	margin: 3ex;
}

grid.help>div>ol,
grid.help>div>ul {
	margin-left: 2em;
}

grid.help>div>ol>li,
grid.help>div>ul>li {
	padding-left: 0.5em;
}

grid.help frage {
	font-style: italic;
	font-weight: bold;
	margin: 10px 0 0 0;
	align-self: flex-start;
}

grid.help>div>h3>img {
	vertical-align: middle;
}

/* Fehlermeldung (hb_message_inside) */
div.message {
	margin: 5px;
	padding: 3px;
	text-align: left;
}

div.rot.message {
	border: 1px solid var(--clr_error_border);
	background-color: var(--clr_error_background);
}

div.gruen.message {
	border: 1px solid hsl(120, 82%, 22%);
	background-color: hsl(120, 81%, 93%);
}


div.td .formular {
	padding: 5px;
}

nav.homemenu {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	align-items: center;
	list-style: none;
	width: inherit;
	padding: 5px;
}

nav.homemenu>h2 {
	margin-bottom: 1em;
	color: var(--clr_ueberschrift);
}

nav.homemenu>li:last-of-type {
	margin-bottom: 0px;
}

/* Logo mit Schalter fuer Hauptmenue */

/* Header */
header.main5 {
	background-image: linear-gradient(var(--clr_wrapper_border), var(--clr_wrapper_background));
	border-style: none;
}

header.main5>grid {
	margin: 0;
	grid-template-columns: auto;
	justify-content: left;
}

header.main5>grid>a {
	font-family: hbtypewriter;
	font-weight: bold;
	font-size: 200%;
	padding-left: 1ch;
}

header.main5>grid>a:hover {
	color: var(--clr_a_link);
	text-decoration: none;
	background-color: transparent;
}

header.main5>grid>a>span {
	color: var(--clr_wrapper_background);
	text-shadow: 2px 2px 6px var(--clr_wrapper_border);
}

header.main5>grid>input#menu {
	display: none;
}

header.main5>grid>input#menu+label {
	display: inline;
}

header.main5>grid>input#menu:checked~nav.hauptmenu {
	/* Hauptmenue einschalten */
	display: inline;
	list-style: none;
	padding: 0 5px;
	margin-right: 1ch;
	align-self: end;
	opacity: unset;
}

/* checkbox-hack */

/* Hauptmenu in Kopfzeile */
nav.hauptmenu {
	/* display: none; */
	opacity: 0;
}

/* default ausgeschaltet */
nav.hauptmenu>ul>li {
	display: inline;
	margin-right: 10px;
}

nav.hauptmenu>ul>li:last-of-type {
	margin-right: 0;
}

nav.hauptmenu>ul a:hover {
	color: var(--clr_a_link);
	text-decoration: underline;
	background-color: transparent;
}

nav.hauptmenu>ul>li.dropdown {
	position: relative;
}

/* Dropdown */
nav.hauptmenu>ul>li.dropdown>span {
	z-index: 2;
	position: relative;
	cursor: pointer;
	color: var(--clr_a_link);
	font-weight: normal;
}

/* Nur das erste <span> in der Dropdown-Liste */
nav.hauptmenu>ul>li.dropdown>span::after {
	content: " \0025BE";
}

nav.hauptmenu>ul>li.dropdown>span+ul {
	display: none;
	padding: 0 30px 5px 10px;
	margin: 10px 10px 10px 20px;
}

nav.hauptmenu>ul>li.dropdown:hover {
	text-decoration: underline;
}

nav.hauptmenu>ul>li.dropdown:hover>span+ul {
	display: flex;
	flex-direction: column;
	background: var(--clr_hauptmenu_background);
	border-radius: 5px;
	border: 1px solid var(--clr_hauptmenu_border);
	padding-top: 10px;

	position: absolute;
	top: 0.5em;
	left: -20px;

	z-index: 1;
}

nav.hauptmenu li.sub span {
	font-weight: bold;
	color: var(--clr_a_link);
}

/* Alle anderen Sub-Spans (Untermenues) fett */
nav.hauptmenu>ul>li.dropdown ul:nth-of-type(1) {
	padding-left: 20px;
}

nav.hauptmenu>ul>li.dropdown ul:nth-of-type(2) {
	padding-left: 40px;
}

nav.hauptmenu>ul>li.dropdown ul:nth-of-type(3) {
	padding-left: 60px;
}

nav.hauptmenu>ul>li.dropdown ul li {
	list-style: none;
	text-align: left;
	padding: 3px 0;
	white-space: nowrap;
}

.navigation_caption {
	letter-spacing: 0.4em;
	color: var(--clr_navigation_caption);
	text-align: left;
	font-size: min(6vw, 2rem);
	font-weight: bold;
	text-shadow: 2px 2px 10px var(--clr_navigation_caption_shadow);
}

a.mylink,
a.mylink:hover,
a.mylink:link,
a.mylink:visited,
a.mylink:active {
	text-decoration: none;
	background-color: transparent;
	vertical-align: text-top;
}

grid {
	display: grid;
	gap: var(--padding_tablecell);
	align-items: center;
	justify-content: center;
	margin: 0.4em;
}

/* Fuer diesen Grid-Container sind keine Spalten und Zeilen
 * vorgegeben. Je nach Groesse des Elternfensters verteilen
 * sich die Zellen in Spalten und Reihen. */
grid.caption {
	grid-template-columns: auto;
	font-weight: bold;
	margin: 2ex 0 0 0;
}

grid.releasehistory {
	grid-template-columns: 2em auto auto;
	justify-items: start;
	align-items: start;
	max-width: 50em;
	font-family: hbfira;
}

grid.releasehistory>div.dt {
	font-weight: bold;
}

grid.releasehistory>div.dd {
	text-align: left;
}

grid.checklist {
	grid-template-columns: repeat(auto-fill, minmax(20ch, 1fr));
	grid-auto-rows: 2em;
	justify-items: left;

	font-weight: normal;
	margin: 5px;
}

grid div>input[type="checkbox"] {
	margin-right: 0.5em;
}

grid div>input[type="checkbox"],
grid div>input[type="checkbox"]+label {
	vertical-align: middle;
}

grid.gap2em {
	gap: 2em;
}

grid.gap1em {
	gap: 1em;
}

grid.gap5px {
	gap: 5px;
}

grid.gap10px {
	gap: 10px;
}

grid.gap0 {
	gap: 0;
}

/* Dieser Grid zeigt ein Standardformular.
 * Linke Zelle = Label
 * alle anderen Zellen = Fields
 * Die Anzahl der Spalten muss in --columns stehen */
grid.formular {
	grid-template-columns: repeat(var(--columns), auto);
}

grid.formular.footerline {
	justify-content: start;
	margin: 7px 0 7px 3px;
}

grid.formular.footerline input[type="text"],
grid.formular.footerline select {
	align-self: center;
}

grid.formular select,
grid.formular input[type="date"] {
	max-width: fit-content;
}

grid.formular label {
	font-weight: bold;
	justify-self: end;
	align-self: start;
}

grid.formular label.second {
	font-weight: normal;
	justify-self: start;
	align-self: start;
}

grid.formular>input,
grid.formular>select {
	align-self: start;
}

grid.formular>div>input[type="radio"]+label {
	font-weight: normal;
	margin-left: 0.7em;
	margin-right: 1em;
}

grid.formular label.navigation_caption {
	justify-self: start;
}

/* Dieser Grid ist für die Anordnung der <fieldlist>-
 * Items z.B. in den Einstellungen zuständig. */
grid.ContentList {
	grid-template-columns: auto;
	gap: 2ex;
	/* margin: 2ex 3ex; */
}

grid.ContentList.t22 {
	max-width: min-content;
}

grid.ContentList.t04,
grid.ContentList.t14 {
	max-width: 50em;
}

grid.ContentList.t32 {
	grid-template-columns: auto auto;
	align-items: stretch;
}

grid.formular.t19_szenario>label {
	justify-self: start;
	font-weight: bold;
}

grid.formular.t14_phase1 {
	grid-template-columns: auto auto;
}

grid.formular.t14_phase1 label {
	font-weight: normal;
}

grid.formular.t14_phase1>input[type="text"],
grid.formular.t14_phase2>input[type="text"] {
	width: 4em;
	text-align: right;
}

grid.formular.t14_phase1>div {
	justify-self: start;
}

grid.formular.t14_phase2 label {
	font-weight: normal;
}

grid.formular.t14_phase2>label.head {
	justify-self: center;
}

grid.formular.t31_quellen_update>* {
	align-self: center;
}

grid.ContentList.t24 {
	max-width: 50em;
}

grid.ContentList.t29>fieldset p {
	font-weight: bold;
}

grid.ContentList.t33>fieldset>p.highlight {
	max-width: 80ch;
}

grid.ContentList.t33>fieldset input[type="checkbox"].hack {
	display: none;
}

grid.ContentList.t33>fieldset input[type="checkbox"].hack~p {
	display: none;
}

grid.ContentList.t33>fieldset input[type="checkbox"].hack+legend>label {
	color: var(--clr_a_link);
}

grid.ContentList.t33>fieldset input[type="checkbox"].hack+legend>label:hover {
	background-color: var(--clr_a_hover);
	text-decoration: underline;
}

grid.ContentList.t33>fieldset input[type="checkbox"].hack:checked~p {
	display: block;
	margin: 1ch auto;
	width: fit-content;
	font-weight: normal;
	font-size: 0.9rem;
}

._grid_column_span_2 {
	grid-column: span 2;
}

._align_self_center {
	align-self: center;
}


/* Grid fuer die Buttonmenueleiste 
 * [anzahl] wird im PHP-Modul gesetzt. */
grid.buttons {
	grid-template-columns: repeat(var(--columns), auto);
	width: fit-content;
	margin-left: auto;
	margin-right: auto;
}

grid.buttons>button,
grid.buttons a {
	cursor: pointer;
}

grid.buttons>select {
	margin-left: 3em;
}

grid.buttons.t31_main>div>a>button>img {
	width: 64px;
}

grid.buttons.big {
	width: 100%;
	max-width: initial;
	grid-template-columns: 1fr;
}

grid.buttons.big>button {
	font-size: 1.5em;
}

/* Das Grid ordnet das Hauptmenü von Koprov an. */
grid.homemenu {
	grid-template-columns: 1fr;
	grid-template-rows: auto;
	margin: 1ex 0;
	font-size: 1.17em;
	font-weight: bold;
}

grid.homemenu>div>h2 {
	margin: 1ex 0;
}

/* Ab hier die Grid-Anpassungen für die Anwendungen und Formulare */
grid.t05_desc {
	grid-template-columns: 1fr;
	grid-template-rows: auto;
	gap: 3px;
	justify-items: start;
	margin: 1em 3em;
	max-width: 50em;
}

grid.t05_desc>div {
	justify-self: start;
	text-align: left;
}

grid.t06.summe {
	grid-template-columns: auto auto;
	justify-content: space-between;
	color: var(--clr_money_minus);
	margin: 0;
	font-style: italic;
}

grid.t06.uebersicht {
	grid-template-columns: auto auto auto;
	align-items: center;
}

grid.t06.neusparer {
	grid-template-columns: repeat(7, auto);
}

grid.t06.neusparer>* {
	align-self: center;
}

grid.t06.abrechnung {
	grid-template-columns: repeat(6, auto);
	justify-content: space-between;
	font-weight: bold;
	margin-left: 3em;
	margin-right: 3em;
}

grid.t06.abrechnung>* {
	justify-self: start;
}

grid.t06.abrechnung>div:nth-of-type(odd) {
	color: darkred;
}

grid.t06.settings {
	grid-template-columns: auto auto;
	row-gap: 2ex;
}

grid.t06.settings>select {
	width: fit-content;
	justify-self: center;
}

grid.t06.settings>div>input[type="checkbox"] {
	width: fit-content;
	margin-right: 0.5em;
}

grid.t19_ewige>div>a.button_notactive,
grid.t19_ergebnisse>div>a.button_notactive {
	font-family: monospace;
}

grid.table.t19_tipptabelle>div.nl.header>div {
	padding-top: 2rem;
}

grid>div.t19ewig_green>span {
	font-weight: bold;
	background-color: var(--clr_btipp_ewige_plus);
}

grid>div.t19ewig_red>span {
	font-weight: bold;
	background-color: var(--clr_btipp_ewige_minus);
}

grid.ContentList.settings>fieldset {
	max-width: 60em;
}

grid.ContentList.settings>fieldset>p {
	padding: 5px;
	font-weight: bold;
	color: var(--clr_ueberschrift);
}

grid.ContentList.settings>fieldset>grid>div {
	justify-self: start;
}

grid.ContentList.settings>fieldset>grid>div>input+label {
	font-weight: normal;
}

grid.ContentList.settings fieldset>textarea {
	width: 95%;
	height: 5em;
	margin-top: 0.5em;
}

grid.formular.t33>div {
	justify-self: center;
}

grid.formular.t33>div.left {
	justify-self: start;
}

grid.formular.t33 label {
	align-self: auto;
	font-weight: normal;
}

grid.t03.view {
	max-width: 100ch;
	font-size: 3ex;
	/* grid-template-columns: 30ch; */
	/* justify-items: center;
	justify-content: start;
	text-align: justify;
	margin: 3ex; */
}

grid.t03.view>div>ol {
	text-align: initial;
	margin-left: 3rem;
}

grid.formular.t03 {
	grid-template-columns: auto 40vw auto;
}

form>grid.formular.t03 textarea {
	resize: both;
}

grid.formular.t03 select.s03 {
	max-width: inherit;
}

grid.formular.t03 input[type="number"] {
	width: 7ch;
}

grid.formular.t03>div.img_gericht>figure>img {
	max-width: 400px;
	max-height: 400px;
}

grid.formular.t03>div.img_gericht>figure>img+figcaption {
	font-weight: bold;
	font-style: italic;
	font-size: 0.8rem;
}

grid.table.t03 img {
	max-width: 8rem;
	max-height: 8rem;
}

grid.formular.fixsearch>* {
	align-self: center;
}

grid.formular.fixsearch>div>a:hover.reload {
	background-color: transparent;
}

grid.formular.fixsearch>div>a.reload {
	font-size: 1.5rem;
	text-decoration: none;
}

@media (max-width: 500px) {
	grid.table {
		gap: 0;
		margin-left: auto;
		margin-right: auto;
		max-width: fit-content;
		align-items: stretch;
		font-family: hbfira;
		grid-template-columns: 1fr !important;
		border: none;
	}

	grid.table>div.header {
		display: none !important;
	}

	grid.table>div.nl {
		display: contents;
		/* Generiert keine eigene Box. */
	}

	grid.table>div.nl.body>div.table-card {
		padding: var(--padding_tablecell);
		display: grid;
		align-content: center;
		justify-content: start;
		grid-template-columns: 1fr 2fr;
		grid-auto-rows: 1rem;
		gap: var(--padding_tablecell);
		margin: calc(var(--padding_tablecell) * 2);
		border: 2px solid var(--clr_wrapper_border);
		/* Farbiger Rahmen */
		box-shadow: 0 4px 20px var(--clr_wrapper_border);
		/* Farbiger Schatten */
		border-radius: 10px;
		/* Abgerundete Ecken */
	}

	grid.table>div.nl.body>div.table-card>div.cardlabel {
		font-weight: bold;
		justify-self: start;
	}

	grid.table>div.nl.body>div.table-card>div.cardlabel+div {
		justify-self: end;
	}

	grid.table>div.nl.body>div.table-card>div>grid.buttons {
		margin-top: 0;
		margin-bottom: 0;
	}
}

@media (min-width: 501px) {
	grid.table {
		gap: 0;
		margin-left: auto;
		margin-right: auto;
		max-width: fit-content;
		align-items: stretch;
		border-top: 1px solid var(--clr_datatable_border);
		border-left: 1px solid var(--clr_datatable_border);
		border-bottom: 1px solid var(--clr_datatable_border);
		font-family: hbfira;
	}

	grid.table>div.nl {
		display: contents;
		/* Generiert keine eigene Box. */
	}

	grid.table>div.nl.header>div {
		background-color: var(--clr_thead_background);
		font-weight: bold;
		padding: 5px;
		border-right: 1px solid var(--clr_datatable_border);
	}

	grid.table>div.nl div>a:hover {
		background-color: transparent;
	}

	grid.table>div.nl.body>div.table-card {
		display: contents;
	}

	grid.table>div.nl.body>div.table-card>div.cardlabel {
		display: none;
	}

	grid.table>div.nl>div.table-card img:hover {
		border-style: none;
		background-color: transparent;
	}

	grid.table>div.nl>div.table-card img {
		border-style: none;
		margin: auto;
		max-width: fit-content;
		vertical-align: middle;
	}

	grid.table>div.nl.body:nth-child(odd).dk>div.table-card>div {
		background-color: var(--clr_datatable_line_odd);
	}

	grid.table>div.nl.body:nth-child(even).dk>div.table-card>div {
		background-color: var(--clr_datatable_line_even);
	}

	grid.table>div.nl.body.rowhover:hover>div.table-card>div {
		background-color: var(--clr_datatable_rowhover);
	}

	grid.table>div.nl.body div>div.buttonline>grid.buttons {
		margin: 0;
	}

	grid.table>div.nl.body>div.table-card>div>div.buttonline {
		justify-content: start;
	}

	grid.table>div.nl>div.table-card>div {
		display: flex;
		flex-direction: column;
		justify-content: center;
	}

	grid.table>div.nl.body>div.table-card>div>div.buttonline>grid.buttons>div>div>input[type="checkbox"] {
		margin-right: 0;
	}

	grid.table>div.nl.body>div.table-card>div:first-child {
		padding-left: calc(var(--padding_tablecell) * 2);
		padding-right: var(--padding_tablecell);
		padding-top: var(--padding_tablecell);
		padding-bottom: var(--padding_tablecell);
	}

	grid.table>div.nl.body>div.table-card>div {
		padding: var(--padding_tablecell);
		border-right: 1px solid var(--clr_datatable_border);
	}

	grid.table>div.nl.body>div.table-card>div:last-child {
		padding-right: calc(var(--padding_tablecell) * 2);
		padding-left: var(--padding_tablecell);
		padding-top: var(--padding_tablecell);
		padding-bottom: var(--padding_tablecell);
	}

	grid.table>div.nl.body:nth-child(odd).dk>div {
		background-color: var(--clr_datatable_line_odd);
	}

	grid.table>div.nl.body:nth-child(even).dk>div {
		background-color: var(--clr_datatable_line_even);
	}

	grid.table>div.nl.body.rowhover:hover>div {
		background-color: var(--clr_datatable_rowhover);
	}

	grid.table>div.nl.body div>grid.buttons {
		margin: 0;
		grid-template-columns: repeat(var(--columns), 1fr);
	}

	grid.table>div.nl.body>div>div {
		justify-content: start;
	}

 	grid.table>div.nl.body>div>grid.buttons>div>input[type="checkbox"] {
		margin-right: 0;
	}
}