/* -- Stylesheet fuer duesselsprinter.de ------- */
/* -- Allgemeine Festlegungen           -------- */
/* -- Autor: Lothar Soens               -------- */
/* -- Version: 3.0.4-1 x 23.03.2024     -------- */

/* -- Textfarbe: #2200a1 = grape/Weintraube ---- */
body {
	/* Desktop: schmaler und mittig */
	max-width: 60em;
	margin-left: auto;
	margin-right: auto;
	font-weight: normal;
	font-family: helvetica, arial, verdana, sans-serif;
	color: #2200a1;
	/* grape */
	/*-webkit-font-smoothing: antialiased;*/
	/*-moz-osx-font-smoothing: grayscale; */
}

/* Webkit-Darstellungen wegnehmen (iPhone etc.)*/
textarea, input[type="text"], input[type="button"], input[type="submit"]
	{
	appearance: none;
	-webkit-appearance: none;
}

/* For Firefox */
input[type="number"] {
	appearance: textfield;	
	-moz-appearance: textfield;
}

/* Webkit browsers like Safari and Chrome */
input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button
	{
	margin: 0;
	appearance: none;
	-webkit-appearance: none;
}

/* -- Projekt-Einstellungen -------------------- */
/* -- Inhaltsbox - schmaler Rand relativ ------- */
/* -- umfasst header, main, footer, nicht nav -- */
div.inhalt {
	margin: 8px;
	padding: 0;
	border: none;
	min-width: 16em;
	/* Mindestbreite (der Ueberschrift) 			*/
	/* verhindert Anzeigefehler in modernen Browsern*/
	font-size: 1.0em;
	background-color: white;
}

h1 {
	margin: 0;
	font-size: 2.0em;
	font-weight: bold;
	vertical-align: baseline;
	text-align: left;
}

h2 {
	font-size: 1.6em;
	margin: 0;
}

h3 {
	font-size: 1.1em;
	margin: 0.8em 0;
}

p {
	font-size: 1.0em;
	margin: 0.5em 0;
}

a:link {
	color: green;
}

a:visited {
	color: maroon;
}

a:active {
	color: gray;
}

a:hover {
	color: maroon;
	background-color: #ffff66;
	/* gelblich */
}

/* ---- Unterklassen von #inhalt' -------------- */
/* -- Infobox - horizontal --------------------- */
div.A_info {
	margin: 0.5em 0;
	padding: 0.5em 1.0em;
	border: 1px solid #48d1cc;
	/* mediumturquoise */
	font-size: 1.0em;
	background-color: #f5fffa;
	/* mintcream */
}

/* -- Hilfebox - horizontal ----------------- */
div.A_help {
	margin: 0.5em 0;
	padding: 0.5em 1.0em;
	border: 1px solid #da70d6;
	/* orchid */
	font-size: 1.0em;
	background-color: #ffe4e1;
	/* mistyrose */
}

/* -- Fusszeile ----------------------------- */
div#fuss {
	float: left;
	color: #00008b;
	background-color: white;
	font-size: 0.9em;
	font-style: italic;
	vertical-align: top;
	border-collapse: collapse;
	margin-top: 0;
}

/* -- horiz. Linien -------------------------- */
p.linie {
	clear: both;
	margin: 0 0;
	vertical-align: middle;
	border-bottom: 2px solid gray;
}

p.dotlinie {
	clear: both;
	/*font-size: 1.0em;*/
	margin: 0 0;
	vertical-align: middle;
	border-bottom: 1px dotted silver;
}

/* -------- Images ---------------------------- */
img.A_w3c {
	float: right;
	border: none;
	height: 31px;
	width: 88px;
	margin: 2px;
	padding: 0;
	vertical-align: top;
}

/* ---- Buttons -------------------------------- */
input.A_button0 {
	width: 6.0em;
	height: 2.0em;
	/*26px*/
	margin: 0;
	padding: 0 0.8em;
	font-size: 1.0em;
	font-weight: normal;
	color: maroon;
	/* braun */
	background-color: #cfcfcf;
	/* default */
	border: 1px solid;
	border-left-color: white;
	/* 3D    */
	border-top-color: white;
	border-right-color: black;
	/* 3D    */
	border-bottom-color: black;
}

input.A_button0:hover {
	color: maroon;
	background-color: #ffff66;
	/* gelblich */
}

/* -------- Elementklassen ------------------- */
.normal {
	padding: 0;
	font-weight: normal;
	font-size: 1.0em;
	border: none;
}

.bigger {
	padding: 0;
	font-weight: normal;
	font-size: 1.2em;
	border: none;
}

.smaller {
	padding: 0;
	font-weight: normal;
	font-size: 0.9em;
	border: none;
}

.small {
	padding: 0;
	font-weight: normal;
	font-size: 0.8em;
	border: none;
}

.winzig {
	padding: 0;
	font-weight: normal;
	font-size: 0.6em;
	border: none;
}

.fett {
	font-weight: bold;
}

.kursiv {
	font-style: italic;
}

.rot {
	color: #DC143C;
	/*crimson */
}

.blue {
	color: blue;
}

.gray {
	color: #696969;
	/*dimgray*/
}

.gruen {
	color: green;
}

.orange {
	color: #FF4500;
	/*orangered*/
}

.sky {
	color: #00bff0;
	/*deepskyblue*/
}

.hidden {
	visibility: hidden;
}

.noselect {
	/* nicht markierbar, anwendbar auf Text */
	user-select: none;
	-moz-user-select: none;
	-webkit-user-select: none;
	-ms-user-select: none;
}

/*
#nonsense {
	
}
*/


/* -------- Navigation ----------------- */

label.naviToggle {
	margin: 0 8px;
	display: block;
	/*background: #fff;*/
	width: 30px;
	height: 40px;
	position: relative;
	border-radius: 4px;
	z-index: 2;
	border: none;
}

input#naviToggle {
	display: none;
}

.xline {
	z-index: 2;
	position: absolute;
	left: 2px;
	height: 2px;
	width: 25px;
	background: #2200a1;
	/* grape */
	border-radius: 2px;
	display: block;
	transition: 0.5s;
	transform-origin: center;
}

.xline:nth-child(1) {
	top: 10px;
}

.xline:nth-child(2) {
	top: 18px;
}

.xline:nth-child(3) {
	top: 26px;
}

#naviToggle:checked ~.naviToggle .xline:nth-child(1) {
	z-index: 2;
	transform: translateY(8px) rotate(-45deg);
}

#naviToggle:checked ~.naviToggle .xline:nth-child(2) {
	z-index: 2;
	opacity: 0;
}

#naviToggle:checked ~.naviToggle .xline:nth-child(3) {
	z-index: 2;
	transform: translateY(-8px) rotate(45deg);
}

ul#naviMenu {
    /* zunächst unsichtbar */
	display: none;
	user-select: none;
	z-index: 1;
	position: absolute;
	min-width: 120px;
	margin-top: -40px;
	/* top oberhalb Toggle */
	padding: 1.0em;
	padding-top: 50px;
	color: #00bff0;
	/*deepskyblue*/
	/*background: #ffffe0;*/
	/*#ededed;*/
	background: #efefef;
	list-style-type: none;
	/*-webkit-font-smoothing: antialiased;*/
	/* to stop flickering of text in safari */
	border: 2px solid #00bfff;
	/*deepskyblue*/
	border-radius: 2px;
}

ul#naviMenu li {
	padding: 0.2em 0;
	font-size: 1.2em;
	font-weight: normal;
}

ul#naviMenu a {
	/*nicht unterstreichen*/
	text-decoration: none;
	padding: 0 0.2em; 
}

/* -- Elemente: Button/Textfarbe --------------- */
ul#naviMenu a:link {
	/* hat Link */
	color: #2200a1;
}

ul#naviMenu a:visited {
	/* besucht  */
	color: #2200a1;
}

ul#naviMenu a:hover {
	/* beruehrt */
	color: black;
	background-color: yellow;
}

ul#naviMenu a:active {
	/* sucht    */
	color: white;
	background-color: #708090;
	/* slategrey */
}

#naviToggle:checked ~ul#naviMenu {
    /* Menü jetzt anzeigen */ 
   	display: block;
}


/* -- Button: Sprung nach oben ------------ */
#topButton {
	display: none;
	/* Hidden by default */
	position: fixed;
	bottom: 30px;
	right: 30px;
	z-index: 2000;
	/* Make sure it does not overlap */
	border: 1px solid green;
	border-radius: 10px;
	/* Rounded corners */
	outline: none;
	padding: 12px;
	/* background-color: #ddd;*/
	cursor: pointer;
	/* Add a mouse pointer on hover */
	opacity: 0.5;
}

#topButton:hover {
	/* background-color: #ccc;*/
	/* dark-grey */
	opacity: 0.8;
}

#topButton::after {
	content: "\039B";
	/* Lambda gross */
	font-weight: bold;
	font-style: normal;
	font-size: 16px;
	line-height: 10px;
	color: green;
}