@charset "UTF-8";

/* Monitor */
/* HTML-Tag */
html { box-sizing: border-box; }
*, ::before, ::after { box-sizing: inherit; }
body {
 font-family: sans-serif;
 color: Black;
 background-color: White;
 min-width: 50em;
 max-width: 90em; 
 margin: 0 auto;
 padding: 1em;
 display: -webkit-flex;
 display: flex;
 -webkit-flex-flow: row wrap;
 flex-flow: row wrap;
}
header {
	-webkit-flex: 1 100%;
	flex: 1 100%;
	text-align: center;
	padding: 0.5em;
	border-top:solid 2px Tan;
  	border-left:solid 2px Tan;
  	border-right:solid 4px Maroon;
  	border-bottom:solid 4px Maroon;	
  	border-radius: 8px;
  	background-color: AntiqueWhite;
  	box-shadow: 6px 6px 6px White inset, 10px 10px 10px grey;
}
aside {
	display: block;
	padding-left: 1em;
	border-left: 2px Tan solid;		
	-webkit-flex: 1 1 0%;
	flex: 1 1 0%;
}
footer {
	-webkit-flex: 1 100%;
	flex: 1 100%;
	color: Maroon;
 	padding: 1em;  
 	vertical-align: middle;
 	text-align: center;
 	font-size: 0.9em;	
 	border-top: 1px solid Maroon; 	
}
footer a:link { text-decoration: none; }
main { 
	display: block;
	-webkit-flex: 3 1 0%;
	flex: 3 1 0%;
	padding: 1rem;
	min-height: 50vh;
}
nav { 
	-webkit-flex: 1 100%;
	flex: 1 100%; 
}
nav ul {
  display: flex;
  flex-flow: row wrap;
  list-style-type:none;
}
nav li {
	flex-basis: content;  	  
    font-size: 1em;
    text-align: center;  
    margin: 0.7em 0.5em 0.7em 0.5em;    
}
nav a {
	background-color: Maroon;
  	color: White; 
  	border-top: solid 1px; border-left: solid 1px;
    border-bottom: solid 3px; border-right: solid 3px;
    border-radius: 10px;
    border-color: BurlyWood;
    box-shadow: 1px 1px 2px Tan;
    padding: 0.5em 1em;     
}
nav a:link { text-decoration: none; }
nav a:link, nav a:visited { color: White; }
nav a:focus, nav a:hover { 
	color: Maroon;
	background-color: AntiqueWhite;
	border-bottom: solid 1px; border-right: solid 1px;
    border-top: solid 3px; border-left: solid 3px;
    border-radius: 10px;
    border-color: BurlyWood;
    box-shadow: 1px 1px 2px Tan inset;
}
nav a:active {
	color: Maroon;
	background-color: AntiqueWhite;
}
section, article { margin: 1.5em 0px; }
ul { padding: 0; }
img {  border: 0px; }
a[href^="#top"]:before{
    content:'➡';	
    display: inline-block;
    color: Maroon;
    font-size: 1.5em;
    -webkit-transform:rotate(-90deg);
    -ms-transform:rotate(-90deg);  
    transform:rotate(-90deg);	
} 

figcaption {
	font-size: 1.2em;
	color: Maroon;
}
ol.ebene1 {
  list-style-type: none;
  list-style-position: outside;
  counter-reset: oli_ebene1;  
}
ol.ebene1 li::before {
  content: counter(oli_ebene1) ".";
  counter-increment: oli_ebene1;
}
ol.ebene2 {
  list-style-type: none;
  list-style-position: outside;
  counter-reset: oli_ebene2;
}
ol.ebene2 li::before {
  content: counter(oli_ebene1) counter(oli_ebene2,lower-alpha) ".";
  counter-increment: oli_ebene2;
}
ol.buchstabe {
	padding: 0;
  list-style-type: none;
  list-style-position: outside;
  counter-reset: oli_buchstabe;
}
ol.buchstabe li { 
	margin: 0.5em 0;
}
	
ol.buchstabe li::before {
  content: counter(oli_buchstabe,lower-alpha) ") ";
  counter-increment: oli_buchstabe;
  list-style-position: outside;
}
dfn {
	font-style: normal;
	color: DarkSlateBlue; 
}
details {
	display: block;
	background-color: OldLace;
	padding: 5px;
}
table.linkliste {
	margin: 2em;
	border: none;
	width: 90%;	
	box-shadow: 0 0 .1em LightGrey;
}
table.linkliste caption {
  color: Black;
  background: OldLace;
  font-size: 1.2em;
  border: thin solid Maroon;
  border-radius: 0 0 10px 0;
  box-shadow: .2em .2em .2em 0 Grey;
  padding: .2em;
}
table.linkliste a { text-decoration: none; }
table.linkliste a:hover { background-color: Maroon; color: White; }
table.linkliste tbody tr:nth-child(even) { background-color: LightGrey; } 
table.linkliste th { color: Maroon; background-color: #EFEFEF; padding: .3em;}
table.linkliste td { box-shadow: 6px 6px 6px White inset; padding: 0.5em 1em; }
table.linkliste td:nth-child(2) { 
 text-align: center;
 border-left: thin solid DarkGrey;
 border-right: thin solid DarkGrey;
}

table.var1 {
  box-shadow: 0 0 .1em LightGrey;
  padding: .3em .5em;
  margin-top: 2em;
  width: 90%;	
}
table.var1 tbody tr:nth-child(even) { background-color: LightGrey; } 
table.var1 th { color: Maroon; background-color: #EFEFEF; padding: .3em; }
table.var1 td {  box-shadow: 6px 6px 6px White inset; padding: .8em; }
table.var1 td:nth-child(2) {
 border-left: thin solid DarkGrey;
 border-right: thin solid DarkGrey;
}
table.var1 caption {
  color: Black;
  background: OldLace;
  font-size: 1.2em;
  border: thin solid Maroon;
  border-radius: 0 0 10px 0;
  box-shadow: .2em .2em .2em 0 Grey;
  padding: .2em;
}
table.var2 {
  box-shadow: 0 0 .1em LightGrey;
  padding: .3em .5em;
  margin-top: 2em;	
}
table.var2 tbody tr:nth-child(even) { background-color: LightGrey; } 
table.var2 th { color: Maroon; background-color: #EFEFEF; padding: .3em; }
table.var2 td {  box-shadow: 6px 6px 6px White inset; padding: .8em; }
table.var2 td:nth-child(2) {
 border-left: thin solid DarkGrey;
 border-right: thin solid DarkGrey;
}
table.var2 caption {
  color: Black;
  background: OldLace;
  font-size: 1.2em;
  border: thin solid Maroon;
  border-radius: 0 0 10px 0;
  box-shadow: .2em .2em .2em 0 Grey;
  padding: .2em;
}
table.var3 {
  box-shadow: 0 0 .1em LightGrey;
  padding: .3em .5em;
  margin-top: 2em;	
  border: collapse;
}
table.var3 tbody tr:nth-child(even) { background-color: LightGrey; } 
table.var3 th { color: Maroon; background-color: #EFEFEF; padding: .3em; }
table.var3 td {
 border: thin solid DarkGrey;
 padding: .6em;
}
table.var3 caption {
  color: Black;
  background: OldLace;
  font-size: 1.2em;
  border: thin solid Maroon;
  border-radius: 0 0 10px 0;
  box-shadow: .2em .2em .2em 0 Grey;
  padding: .2em;
}

/* eigene Elemente */
.asoben {
	display: block;
	padding-left: 1em;
	border-left: 2px Tan solid;		
	-webkit-flex: 1 1 0%;
	flex: 1 1 0%;
	-webkit-align-self: center;	
	align-self: center;
}
#breadcrumb {
  flex: 1 100%; 	
}
#breadcrumb ul {
  padding: 1px 8px;
  list-style: none;
}
#breadcrumb li {
  display: inline;
  font-size: 0.9em;
  color: Black;
}
#breadcrumb li+li:before {
  padding: 5px;
  color: black;
  content: '➡';
}
#breadcrumb li a {
  color: Maroon;
  text-decoration: none;
}
#breadcrumb li a:focus {
  color: Maroon;
  text-decoration: underline;
}
#breadcrumb li a:hover {
  color: Maroon;
  text-decoration: underline;
}
.hoch {
	float: right;
	text-align: center;
	border: 1px solid Maroon;
	background-color: AntiqueWhite;
	border-radius: 4px;
	box-shadow: 2px 2px 2px White inset, 5px 5px 5px grey;
}
.menurahmen {
	display: flex;
	border-bottom: 1px solid Maroon;
	padding-bottom: 1em;
	flex-wrap: wrap;
}
.menu { 
	flex-basis: content;
	font-size: 1.1em;
	border: 1px solid Gainsboro;
	border-radius: 8px;	
	padding: 0.5em 0.5em 0.2em 0.5em;
	margin: 5px;
	background-color: OldLace;
}
.menu ul { 	list-style-type: none; }
.menu li { padding: 0.3em 1em; }
.menu a {
	text-decoration: none;
	color: Maroon;
}
.menu a:hover { text-decoration: underline; }
.links {
	float: left;
	vertical-align: top;
	margin-right: 2em;
	border: thin solid Gainsboro;
	box-shadow: .2em .2em .2em 0 Tan;
}
.box {
	display: -webkit-flex;
    display: flex;
    -webkit-flex-flow: row wrap;
    flex-flow: row wrap;
	padding: 0.3em;
	margin: 1em;
	justify-content: space-around;
}
.boxitem {
	flex-basis: content;
	border: thin solid DarkGrey;
	box-shadow: .2em .2em .2em 0 Tan;
	padding: 1em;
	margin: 0.7em;
}
.inaktiv { 	color: Grey; }
.allg { margin-left: 2em; }
.allg ul { padding: 0.3em 0; }
.allg li { margin: 1em 0; } 
.allg > a { font-size: 1.2em; }
.rahmen {
	border: thin solid DarkGrey;
	padding: 0.2em;
	box-shadow: .2em .2em .2em 0 Tan;
}
.wichtig {
	background-color: Gainsboro;
	border-radius: 5px;
	color: FireBrick;
	line-height: 1.5em;
	padding: 1em;
	fornt-size: 1.2em;
}
.hline {
	background-color: Gainsboro;
	border-radius: 5px;
	color: White;
	padding: 1em;
	font-size: 1.2em;
	text-align: center;	
	text-transform: uppercase;
	letter-spacing: 0.1em;
	text-shadow:
	1px  1px 2px Maroon,
     1px -1px 2px Maroon,
    -1px  1px 2px Maroon,
    -1px -1px 2px Maroon;
}
.zorab {
	margin: 5%;
	width: 300px;
	height: 204px;
}
.zoraw {
	margin: 5%;
	width: 233px;
	height: 300px;
}
.zorat { color: Maroon; font-size: 1.2em; text-align: center;}
.achtung {
	background-image: url("../image/achtung.png");
	width: 50px;
	height: 50px;
}
.buch {
	background-image: url("../image/buecher.png");
	width: 100px;
	height: 81px;
}
.stift {
	background-image: url("../image/stift.png");
	width: 50px;
	height: 50px;
}
.dokdown {
	background-image: url("../image/dokdown.png");
	width: 50px;
	height: 50px;
}
.schloss {
	background-image: url("../image/sicher.png");
	width: 50px;
	height: 50px;
}
.termin {
	background-image: url("../image/kalender.png");
	width: 50px;
	height: 50px;
}
.licht {
	background-image: url("../image/birne.png");
	width: 50px;
	height: 50px;
}
.hziffer {
	font-weight:bold;
	color: DarkSlateBlue;
	background-color: Gainsboro;
	font-size: 1.5em;
	margin-right: 5px;
}
.hervor {
	font-style: italic;
	font-weight: bold;
}
.neu {
	color: Darkgreen;
	font-style: italic;
	margin-left: 1em;
}
.mitte { text-align: center;}
.bild {
	margin: 0;
	border: 1px solid BurlyWood;
	box-shadow: 1px 1px 2px Tan;
	vertical-align: middle;
	padding: 0.4em;
}
.bildmr { margin: 1em 1em; }
.spalte0 { width: 55%; }
.spalte1 { width: 30%; }
.spalte2 { width: 20%; }
.spalte3 { width: 15%; }
.erledigt{ 	background-color: honeydew; }
.fasterledigt {background-image: linear-gradient(to right, honeydew 40%,white);}
.tooltip { position: relative; }
.tooltip span[role=tooltip] { display: none; }
.tooltip:hover span[role=tooltip] {
  display: block;  
  position: absolute; 
  bottom: 2em;
  left: -6em;
  width: 15em;
  padding: 0.5em;
  z-index: 100;
  color: Black; 
  background-color: AntiqueWhite;
  border: solid 1px Maroon;
  border-radius: 0.3em;
}
.tabeinfach { width: 90%; border-collapse: collapse; margin: 0.7em 1em; }
.tabeinfach td {border: solid 1px Maroon;}
.tabeinfach td:nth-child(even) {text-align: center;}
.tabeinfach td:nth-child(odd) {text-align: center;}
.tabeinfach td:nth-child(1) {text-align: left;}
/* Maskierung */
span#weg { display: none; }
span#mask1::before { content: "sc"; }
span#mask1::after { content: "hule\40sabinesrei.de"; }
span#mask2::before { content: "lk"; }
span#mask2::after { content: "mbt\40sabinesrei.de"; }