@charset "UTF-8";
/* Reset
--------------------------------------------------------------------------------------- */
* {
	padding: 0;
	margin: 0;
	box-sizing: border-box;
	scrollbar-width: thin;
	scrollbar-color: #ccc #eee;
}
/* globals and typo 
--------------------------------------------------------------------------------------- */

html>body {
	font-size: 75%;
}
a:link {
	color: #006;
	text-decoration: none;
}
a:visited {
	color: #006;
	text-decoration: none;
}
a:hover {
	text-decoration: none;
	border: dotted 1px;
}
p, table, li {
	font: 1em/1.5em Tahoma, Verdana, Arial, sans-serif;
	font-weight: normal;
	margin-top: 0.5em;
	margin-bottom: 0.5em;
}

/* table basic styles
--------------------------------------------------------------------------------------- */
.tbase, table {
	border-collapse: collapse;
	border: 1px solid #99c;
	background-color: #f9f9f9;
	width: 100%;
}
.tbase th { background: linear-gradient( to bottom, #fff, #ccf ); }
.tbase th, .tbase td, th, td {
	border-left: 1px solid #99c;
	border-right: 1px solid #99c;
	padding: 1px 2px;
}
.tbase tbody tr:nth-child(even) { background-color: #ddd; }
.tbase tr:hover { background-color: #cfc; }

tr:nth-child(even) { background-color: #ddd; }
tr:hover { background-color: #cfc; }

/* Vertical rhythm based on 75% (12px) base size for floating text
--------------------------------------------------------------------------------------- */
h1 {
	font: 1.67em/1.1em Tahoma, Verdana, Arial, sans-serif;
	margin-top: 0.9em;
	margin-bottom: 0.9em;
}
h2 {
	font: 1.5em/1.2em Tahoma, Verdana, Arial, sans-serif;
	margin-top: 1em;
	margin-bottom: 1em;
}
h3 {
	font: 1.33em/1.13em Tahoma, Verdana, Arial, sans-serif;
	margin-top: 1.13em;
	margin-bottom: 1.13em;
}
h4 {
	font: 1.17em/1.29em Tahoma, Verdana, Arial, sans-serif;
    margin-right: 0.4em;
	margin-top: 1.29em;
	margin-bottom: 1.29em;
	margin-right: 0.4em;
}
hr {
	margin-top: 0.7em;
	margin-bottom: 0.7em;
}
li {
	margin: 0.3em 0 0.3em 0.3em;
	padding-left: 0.3em;
}
ul {
	list-style-type: square;
}
ol {
	list-style: none;
}
fieldset, .outline, .kal {
    border: outset 1px #999;
    margin: 0;
    background-color: #fff;
}
select {
	appearance: none;
	font: 115% Tahoma;
	border: solid 1px #999;
	border-radius: 0.3em 0.3em 0 0;
	padding: 0.1em 1.3em 0.1em 0.1em;
	background: url(/default/dn.gif) right no-repeat #eef;
}
option {
	background-color: #fff;
}
input[type=text], input[type=password], textarea {
    padding: 0.1em;
	border: outset 1px #ddd; 
}
input[type=checkbox] {
	accent-color: #dfd;
	margin-right: 0.3em;
}
input[type=submit], input[type=file], button {
	font: 100% Tahoma;
	padding: 1px 4px;
	border-radius: 0.5em;
	border: solid 1px #999;
	background: linear-gradient(to bottom, #fff, #ccc);
}
label, summary {
	cursor: pointer;
}      
input[type="radio"]:checked+label {
	text-decoration: underline;
}
/* pictures and linked pictures without frame 
--------------------------------------------------------------------------------------- */
img, a img {
	border: 0;
}
/* align elements to the left or to the right
--------------------------------------------------------------------------------------- */
.left, small {
	text-align: left;
	font-size: 90%;
}
.right {
	text-align: right;
	padding-left: 0.5em;
    white-space: nowrap;
}
.nowrap {
	white-space: nowrap;
}
.column {
	width: 50%;
	float: left;
}
.register {
	border-radius: 0.5em 0.5em 0 0;
	border: solid 1px #999;
	border-bottom: none;
}
.urlextern {
	background: url(/default/ext-link.png) no-repeat 0 center;
    padding: 0 0 0 1.5em;
	font-weight: bold;
}
.email {
	background: url(/default/email.png) no-repeat 0 center;
    padding: 0 0 0 1.67em;
}
.phone {
	background: url(/default/phone.png) no-repeat 0 center;
    padding: 0 0 0 1.5em;
}
summary::marker {
    color: darkblue;
    font-size: 125%;
}
.large { font-size: 1.13em; }
.hidden { display: none; }
.active { display: block; }
.bold { font-weight: bold; }
.zehntel { width: 10%; }
.fuenftel { width: 20%; }
.viertel { width: 25%; }
.drittel { width: 33%; }
.haelfte { width: 50%; }
.zweidrittel { width: 66%; }
.dreiviertel { width: 75%; }
.dotted { border: dotted 1px; }

input:focus, textarea:focus { border-color: #333; }
.high:hover, .kal td:hover { background-color: #cfc; }
.ggrad { background: linear-gradient( to bottom, #fff, #bfb ); }
.tgrad { background: linear-gradient( to bottom, #fff, #ccf ); }
.lgrad { background: linear-gradient( to bottom, #fff, #dad ); }
.vgrad { background: linear-gradient( to bottom, #fff, #ccc ); }
.outline { border:1px solid #99c; }
.topline { border-top:1px solid #99c; }
.marker  {  background-color: #ffb; }
.alter      { background-color: #ccf; }
.light { background-color: #f9f9f9; }
.nocol     { background-color: #fff; }
.nocol:hover { background-color: #cfc; }
.head      { background-color: #fca; }
.green      { background-color: #bfb; }
.lfloat   { float: left; margin-right: 0.8em; margin-bottom: 0.5em; }
.rfloat   { float: right; margin-left: 0.8em; margin-bottom: 0.5em; }
.nop { }
.onp { display: none }
.drop { position: relative; display: inline-block; }
.down { position: absolute; z-index: 3; display: none; }
.drop:hover .down { display: inline-block; }
.edit        { vertical-align:top; border:none; }
.list         { margin-right: 0.2em; vertical-align: bottom; border: none; }

/* styles for modal dialog
--------------------------------------------------------------------------------------- */
#dialog {
	position: absolute;
	font-size: 1.5em;
	width: 100%;
	height: 100%;
	z-index: 2;
	display: none;
	border: none;
	overflow: auto;
	transition: all 0.7s ease-in-out;
	background: rgba(128 128 128/0.5);
}
.modal {
	font-size: inherit;
	position: relative;
	width: 90%;
	margin: .5em auto;
	margin-top: .7em;
	padding: 1em;
	padding-top: 1.7em;
	border: dotted 1px;
	border-radius: .5em;
	background: #fff;
}
.printIt {
	position: absolute;
	top: .2em;
	right: 3.5em;
}
.closeIt {
	position: absolute;
	top: 0;
	right: 1em;
	border: thin;
	cursor: default;
	font-size: 1.3em;
	padding: .07em .3em;
	background: #ddd;
	z-index: 3;
}
.closeIt:hover {
	background: red;
	color: white;
}

/* styles for grid-design
--------------------------------------------------------------------------------------- */
.grid {
	display: grid;
	font-family: Tahoma, Verdana, Arial, sans-serif;
	background: #fff;
	height: 100vh; 
	width: 100vw;
	grid-template-rows: [ top ] 4em [ action ] 4em [ header-bottom ] 1fr [ footer-top ] 3.33em [ bottom ];
	grid-template-columns: [ left ] 3em [ left-bar ] 15em [ aside ] auto [ navigation ] 15em [ right-bar ] 3em [ right ];
}
header {
	background: linear-gradient( to bottom, #fff, #eee );
	position: relative;
	border: solid 1px #999;
	grid-row: top / header-bottom;
	grid-column: left / right;
}
top {
	font: 2.3em Tahoma; 
	color: darkblue;
	margin: 0.5em;
	text-align: center;
	z-index: 2;
	grid-row: top / action;
	grid-column: left / right;
}
action {
	font: 2.3em Tahoma;
	color: green;
	text-align: center;
	z-index: 2;
	grid-row: action / header-bottom;
	grid-column: left / right;
}
leftbar {
	border-left: solid 1px #999;
	border-right: solid 1px #999;
	background: snow;
	text-align: center;
	overflow: hidden;
	grid-row: header-bottom / footer-top; 
	grid-column: left / left-bar; 
}
aside {
	background: #f9f9f9; 
	z-index: 1;
	border-right: dotted 1px;
	overflow: auto;
	grid-row: header-bottom / footer-top; 
	grid-column: left-bar / aside; 
}
content {
	padding: 0 0.5em 0 0.7em;
	overflow: auto;
	grid-row: header-bottom / footer-top; 
	grid-column: aside / navigation; 
}
navigation {
	font-family: Tahoma;
	border-left: solid 1px #999; 
	background: snow;
	overflow: auto;
	z-index: 1;
	grid-row: header-bottom / footer-top; 
	grid-column: navigation / right-bar;
}
rightbar {
	z-index: 2;
	border-left: solid 1px #999;
	border-right: solid 1px #999;
	background: linear-gradient( to right, #fff, #dde );
	text-align: center;
	overflow: hidden;
	grid-row: header-bottom / footer-top; 
	grid-column: right-bar / right; 
}
footer {
	background: linear-gradient( to bottom, #fff, #dde );
	border: solid 1px #999;
	text-align: center;
	grid-row: footer-top / bottom; 
	grid-column: left / right; 
}
@media ( max-width: 45em ) {	
	.grid {
		grid-template-rows: [ top ] 2.3em [ action ] 2.3em [ header-bottom ] 1fr [ footer-top ] 3.33em [ bottom ];
		grid-template-columns: [ left ] 3em [ left-bar ] 0em [ aside ] auto [ navigation ] 0em [ right-bar ] 3em [ right ];
	}
	top, action {
		font: 1.3em Tahoma;
	}
}