/* First the major elements are defined
Header is at the top of the screen it mainly contains the title of the site
Footer is at the bottom of the screen
Navigation is the navigation at the left
navigationtop is the navigation under the header
Aktuelles is optional and contains latest news
Main resp. MainAktuelles contain the main info*/

html {
overflow:auto;
}  /* Prevents standard vertical scroll bar */

body {
font-family: "Segoe UI", Arial, Verdana, sans-serif;  /* selects standard font */
font-size:100.1%;                                   /* selects user defined size and prevents Errors in IE*/
}

#navigationtopbreadcrumbs {                              /* Fixed box for Header and Breadcrumbs */
overflow:auto;                                      /* Allows scroll bars */
position:fixed;                                     /* Position does not move */
left:12em; top:0px; height:3.2em; right:0px;
border:0px solid #000000;
margin:0px; padding-top:0em; padding-bottom:0em; padding-left:0px; padding-right:0em;
color:#000000; font-size:0.9em; letter-spacing:0em;
text-decoration:none; font-weight:bold;
background:#FFFFFF;
}

#headermain {                              /* Fixed box for Header and Main */
overflow:auto;                                      /* Allows scroll bars */
position:fixed;                                     /* Position does not move */
left:12em; top:3.15em; bottom:0px; right:0px;
border:0px solid #000000;
margin:0px; padding-top:0em; padding-bottom:0em; padding-left:0px; padding-right:0em;
color:#000000; font-size:0.9em; letter-spacing:0em;
text-decoration:none; font-weight:bold;
background:#FFFFFF;
}

#header {
overflow:hidden; /* Even if the content does not fit, scroll bars will not show*/
position:relative;  /* fixed ist understood by firefox and IE 7 and higher*/
top:0px; left:-161px; height:50px; /* Using em to define the size makes it independent of font type and size*/
                                          /* Box is 1em, i.e. as high has fint, high; Top is 0px, since counting starts at 0px */
border:0px solid #00FF00;   /* border is none, if there were a border it would be black */
margin:0px; padding-top:0em; padding-bottom:0.3em; padding-left:0em; padding-right:0em;   /* set margin and padding*/
color:#0189D0; font-size:2.2em; letter-spacing:0.16em; /* font colour is black, font ist twice normal size an has bigger letter spacing*/
text-decoration:none; font-weight:bold; font-style:normal;
text-align:center; background:#FFFFFF; /* backgroung ist black */
}

#navigationtop {
overflow:visible;
position:absolute;
top:0em;left:0px; height:1.6em;width:99%;
border-bottom:0em solid #ffa20c;
margin:0px; padding-top:0em; padding-bottom:0em; padding-left:6px; padding-right:0em;
color:#000000; letter-spacing:0em;
text-decoration:none; font-weight:bold;
background:#FFFFFF;
}

#breadcrumbs {
overflow:visible;
position:absolute;
top:1.6em;left:0px; height:1.5em;width:99.5%;
border-bottom:0em solid #ffa20c;
margin:0px; padding-top:0em; padding-bottom:0em; padding-left:6px; padding-right:0em;
color:#000000; letter-spacing:0em;
text-decoration:none; font-weight:bold;
background:#0189D0;
}

#breadcrumbs a{
color: #FFFFFF;
}

#breadcrumbs a:hover{
color: #ffa20c;
}

#navigation { /* Explanations see header*/
overflow:auto;
position:fixed;
top:1.6em; left:0px; bottom:6.5em; width:11.7em;
border:0px solid #000000;
margin:0px; padding-top:0em; padding-bottom:0em; padding-left:0.3em; padding-right:0em;
color:#000000; font-size:0.9em; letter-spacing:0em;line-height:1.0em;
text-decoration:none; font-weight:bold; text-align:left;
background:#0189D0; /* backgroung ist blue */
}

#navigation a{
color: #FFFFFF;
}
#footer a{
color: #FFFFFF;
}
#navigation a:hover{
color: #ffa20c;
}
#footer a:hover{
color: #ffa20c;
}

#footer {  /* Explanations see header*/
overflow:hidden;
position:fixed;
bottom:0px; left:0px; height:6.5em; width:12em;
border:0px solid #000000;
margin:0px; padding-bottom:0em; padding-bottom:0em; padding-left:0em; padding-right:0em;
color:#000000; font-size:0.9em; letter-spacing:0em;line-height:1.0em;
text-decoration:none; font-weight:bold; font-style:normal;
text-align:center; background:#0189D0; /* backgroung ist yellow */
}

#main {
overflow:visible;
position:relative;
left:0em; top:0.0em;  bottom:0px; right:0px;
border:0px solid #000000;
margin:0px; padding-bottom:0em; padding-bottom:0em; padding-left:0.0em; padding-right:0.0em;
line-height:1.3em;
color:#000000; font-size:0.9em; letter-spacing:0em;
text-decoration:none; font-weight:normal; font-style:normal;
text-align:left; background:#FFFFFF; /* backgroung ist yellow */
}

#main1percent {
overflow:visible;
position:relative;
left:1%; top:0.0em;  bottom:0px; width:98%;
border:0px solid #000000;
margin:0px; padding-bottom:0em; padding-bottom:0em; padding-left:0.0em; padding-right:0.0em;
line-height:1.3em;
color:#000000; font-size:0.9em; letter-spacing:0em;
text-decoration:none; font-weight:normal; font-style:normal;
text-align:left; background:#FFFFFF; /* backgroung ist yellow */
}



#mainfixed {
overflow:visible;
position:fixed;
left:13.3em; top:6.0em;  bottom:0px; right:0px;
border:0px solid #000000;
margin:0px; padding-bottom:0em; padding-bottom:0em; padding-left:0.0em; padding-right:0.0em;
line-height:1.3em;
color:#000000; font-size:0.9em; letter-spacing:0em;
text-decoration:none; font-weight:normal; font-style:normal;
text-align:left; background:#FFFFFF; /* backgroung ist yellow */
}

#navigationtop a{
color: #fff;
background: #0189D0 url(left-tab.jpg) left top no-repeat;
padding-left:10px ; padding-top:2px;padding-bottom:2px;
}

#navigationtop a span{
background: url(right-tab.jpg) right top no-repeat;
padding-right: 8px;padding-top:2px;padding-bottom:2px;
}

#navigationtop a, #navigation a span{ display: block; float: left}

/* Hide from IE5-Mac \*/
#navigationtop a, #navigation a span{ float: none }
/* End hide */

#navigationtop a:hover{
color: #ffa20c;
background: #0189D0 url(left-tab.jpg) left top no-repeat;   /* andere Hover Farbe ist #ffa20c  */
padding-left: 10px;padding-top:2px;padding-bottom:2px;
}

#navigationtop a:hover span{
background: url(right-tab.jpg) right top no-repeat;
padding-right: 8px;padding-top:2px;padding-bottom:2px;
}

#navigationtop ul{
list-style: none; padding: 0; margin: 0
}

#navigationtop li{
float: left; list-style: none; margin: 0;
}

#navigationtopcurrent a{
color: #fff;
background: #781351 url(left-tab-current.gif) left top no-repeat;
padding-left:10px ; padding-top:2px;padding-bottom:2px;
}

#navigationtopcurrent a span{
background: url(right-tab-current.gif) right top no-repeat;
padding-right: 8px;padding-top:2px;padding-bottom:2px;
}

#navigationtopcurrent a, #navigation a span{ display: block; float: left}

/* Hide from IE5-Mac \*/
#navigationtopcurrent a, #navigationtopcurrent a span{ float: none }
/* End hide */

#navigationtopcurrent a:hover{
color: #ffa20c;
background: #781351 url(left-tab-current.gif) left top no-repeat;
padding-left: 10px;padding-top:2px;padding-bottom:2px;
}

#navigationtopcurrent a:hover span{
background: url(right-tab-current.gif) right top no-repeat;
padding-right: 8px;padding-top:2px;padding-bottom:2px;
}

#navigationtopcurrent ul{
list-style: none; padding: 0; margin: 0
}

#navigationtopcurrent li{
float: left; list-style: none; margin: 0;
}


/*now the definition for the tiles*/
h2.bare, h3.bare {margin:0px; padding:0px;} /* Setzt den Zeilenabstand auf eins, für die Überschrieten in den Kacheln*/

table.tiles {width:100%; height:100%; border-width:0px; border-style:solid; border-color:rgb(255, 0, 0);
             margin:0px; padding:0px;
             border-collapse:collapse; /* Ränder von Zellen fallen zusammen*/
             table-layout:fixed; }  /* Breite der Zellen bleibt wie definiert*/

td.tiles {border:0px solid rgb(0, 0, 255);
         vertical-align:top; padding-left:2px; padding-right:2px; overflow:auto }

/*now the Table definition for a variable width table which is scrollable
Strategy to make it work:
Define container the size you want it in your spreadsheet:div.TableScrollVariable*, set overflow to none, so that no sccrollbar
Define Header and Footer oversized, so that scrollbar is always there.
In Header align writing to top, in Footer to bottom, so that it still appears.
Overlap Header and Footer with Table leaving 25px each for header and footer*/

div.TableScrollVariable{
position: relative; overflow:hidden;
width:100%; height:400px; /*set individual height in spreadsheet, this is only default*/
border:0px solid rgb(0, 0, 255);margin:0px; padding-left:0px;padding-right:0px;
background:rgb(255, 255, 255);
}

div.TableScrollHeaderVariable{
overflow:auto;
width:99%; height:150px;
border:0px solid rgb(0, 0, 255);margin:0px; padding:0px;
background:rgb(0, 0, 0);
color:black;font-size:100%;text-decoration:none; font-weight:normal; font-family:Verdana, Arial, sans-serif;
letter-spacing:0.0em;
}
div.TableScrollTableVariable{
position: relative;
overflow:auto;
top:-125px;
width:99%; height:350px; /*set individual height in spreadsheet, this is only default*/
border:0px solid rgb(0, 0, 255);margin:0px; padding:0px;
background:rgb(255, 0, 255);
color:black;font-size:100%;text-decoration:none; font-weight:normal; font-family:Verdana, Arial, sans-serif;
letter-spacing:0.0em;
}
div.TableScrollFooterVariable{
overflow:auto;
position: absolute; bottom:0px;
width:99%; height:150px;
border:0px solid rgb(0, 0, 255);margin:0px; padding:0px;
background:rgb(0, 255, 255);   /* Hintergrund ist weiß*/
color:black;font-size:100%;text-decoration:none; font-weight:normal; font-family:Verdana, Arial, sans-serif;
letter-spacing:0.0em;
}


div.TableScrollHeader{
overflow:auto;
position: fixed;
left:13.3em; top:6em;  height:4em; right:0em;
border:0px solid #000000;
margin:0px; padding-bottom:0em; padding-bottom:0em; padding-left:0.0em; padding-right:0.0em;
color:#000000;
text-decoration:none; font-weight:normal; font-style:normal;
text-align:left; background:#FFFFFF; /* backgroung ist yellow */
}
div.TableScrollTable{
overflow:auto;
position: fixed;
left:13.3em;top:7.6em;  right:0em; bottom:2em;
border:0px solid #000000;
margin:0px; padding-bottom:0em; padding-bottom:0em; padding-left:0.0em; padding-right:0.0em;
background:rgb(255, 255, 255);   /* Hintergrund ist weiß*/
color:black;font-size:100%;text-decoration:none; font-weight:normal; font-family:Verdana, Arial, sans-serif;
letter-spacing:0.0em;
}
div.TableScrollFooter{
overflow:auto;
position: fixed;
left:13.3em; bottom:0em;  height:4em; right:0em;
border:0px solid #000000;
margin:0px; padding-bottom:0em; padding-bottom:0em; padding-left:0.0em; padding-right:0.0em;
background:rgb(0, 255, 255);   /* Hintergrund ist weiß*/
color:black;font-size:100%;text-decoration:none; font-weight:normal; font-family:Verdana, Arial, sans-serif;
vertical-align:bottom;
letter-spacing:0.0em;
}


div.TableScrollHeaderAktuelles{
overflow:auto;
position: fixed;
left:100px; top:40px; height:150px; right:100px;border:0px solid rgb(0, 0, 255);margin:0px; padding:0px;
background:rgb(0, 0, 0);   /* Hintergrund ist weiß*/
color:black;font-size:100%;text-decoration:none; font-weight:normal; font-family:Verdana, Arial, sans-serif;
letter-spacing:0.0em;
}
div.TableScrollTableAktuelles{
overflow:auto;
position: fixed;
left:100px; top:65px; bottom:45px; right:100px; border:0px solid rgb(0, 0, 255);margin:0px; padding:0px;
background:rgb(255, 255, 255);   /* Hintergrund ist weiß*/
color:black;font-size:100%;text-decoration:none; font-weight:normal; font-family:Verdana, Arial, sans-serif;
letter-spacing:0.0em;
}
div.TableScrollFooterAktuelles{
overflow:auto;
position: fixed;
left:100px; height:150px; bottom:20px; right:100px;border:0px solid rgb(0, 0, 255);margin:0px; padding:0px;
background:rgb(0, 255, 255);   /* Hintergrund ist weiß*/
color:black;font-size:100%;text-decoration:none; font-weight:normal; font-family:Verdana, Arial, sans-serif;
letter-spacing:0.0em;
}


table.scrollable {
                 width:99.99%;
                 border-width:0px; border-style:solid; border-color:rgb(255, 127, 0);
                 margin:0px; padding:0px;
                 table-layout:fixed;

       border-collapse:collapse; }  /* Breite der Zellen bleibt wie definiert*/
           /* Breite der Zellen bleibt wie definiert*/
tbody.scrollable {
       border-width:0px; border-style:solid; border-color:rgb(0, 255, 0);
                 margin:0px; padding:0px;
}

td.scrollable{
                border-width:2px; border-style:solid; border-color:rgb(255, 255, 255);
                margin:0px; padding-left:4px; padding-right:4px; padding-top:2px; padding-bottom:2px;
                vertical-align:middle;
}



/* Hier wird der Auflistungsstil definiert für den Navigation Bar */
ul.navi{ list-style-type:none; /*Keine Punkte/Aufzählung vor der Liste */
         margin:0px;   /* Dadurch wird die Standardeinrückung der Liste auf Null gesetzt */
         padding:0px;  /* Dadurch wird die Standardeinrückung der Liste auf Null gesetzt */
}
/* Hier wird der Auflistungsstil für die Navigation definiert für die verschiedenen Level und das Ausgewähltsein*/
li.navi0normal { font-size:100%; margin:0px; padding-left:0px; }
li.navi0high   { font-size:100%; margin:0px; padding-left:0px; background-color:#781351; font-weight:bold; }
li.navi1normal { font-size:90%;  margin:0px; padding-left:4px; }
li.navi1high   { font-size:90%;  margin:0px; padding-left:4px; background-color:#781351; font-weight:bold; }
li.navi2normal { font-size:80%;  margin:0px; padding-left:8px; }
li.navi2high   { font-size:80%;  margin:0px; padding-left:8px; background-color:#781351; font-weight:bold; }
li.navi3normal { font-size:70%;  margin:0px; padding-left:12px; }
li.navi3high   { font-size:70%;  margin:0px; padding-left:12px; background-color:#781351; font-weight:bold; }

li.navi0high a{color:#000000;}


/* Ab hier werden nur noch Farbschemata definiert  */

.yellow {background:rgb(255, 255, 0); color: rgb( 0,0 ,0);}
.yellow a:link {color: rgb(0, 0, 255);}
.yellow a:visited {color: rgb(255, 0, 0);}
.yellow a:hover {color:rgb( 0,0 ,0);}
.yellow a:active {color: rgb( 0,0 ,0);}

.blue {background:rgb(0, 0, 255); color: rgb( 255,255 ,255);}
.blue a:link {color:rgb( 255,255 ,0);}
.blue a:visited {color:rgb( 255,0 ,0);}
.blue a:hover {color:rgb( 255,255 ,255);}
.blue a:active {color: rgb( 255,255 ,255);}

.maroon {background:rgb(128, 0, 0); color: rgb( 255,255 ,255);}
.maroon a:link {color:rgb( 0,255 ,0);}
.maroon a:visited {color:rgb( 255,0 ,0);}
.maroon a:hover {color:rgb( 255,255 ,255);}
.maroon a:active {color: rgb( 255,255 ,255);}

.black {background:rgb(0, 0, 0); color: rgb( 255,255 ,255);}
.black a:link {color:rgb( 0,255 ,0);}
.black a:visited {color:rgb( 255,0 ,0);}
.black a:hover {color:rgb( 255,255 ,255);}
.black a:active {color: rgb( 255,255 ,255);}

.aqua {background:rgb(0, 255, 255); color: rgb( 0,0 ,0);}
.aqua a:link {color: rgb(0, 0, 255);}
.aqua a:visited {color: rgb(255, 0, 0);}
.aqua a:hover {color:rgb(0, 0, 0);}
.aqua a:active {color: rgb(0, 0, 0);}

.lime {background:rgb(0, 255, 0); color: rgb( 0,0 ,0);}
.lime a:link {color: rgb(0, 0, 255);}
.lime a:visited {color: rgb(255, 0, 0);}
.lime a:hover {color:rgb(0, 0, 0);}
.lime a:active {color: rgb(0, 0, 0);}

.darkorange {background:rgb(255, 128, 0); color: rgb( 0,0 ,0);}
.darkorange a:link {color: rgb(0, 0, 255);}
.darkorange a:visited {color: rgb(255, 0, 0);}
.darkorange a:hover {color:rgb(0, 0, 0);}
.darkorange a:active {color: rgb(0, 0, 0);}

.white {background:rgb(255, 255, 255); color: rgb( 0,0 ,0);}
.white a:link {color: rgb(0, 0, 255);}
.white a:visited {color: rgb(255, 0, 0);}
.white a:hover {color:rgb(0, 0, 0);}
.white a:active {color: rgb(0, 0, 0);}

.fuchsia {background:rgb(255, 0, 255); color: rgb( 0,0 ,0);}
.fuchsia a:link {color: rgb(0, 0, 255);}
.fuchsia a:visited {color: rgb(255, 255, 0);}
.fuchsia a:hover {color:rgb(0, 0, 0);}
.fuchsia a:active {color: rgb(0, 0, 0);}

.red {background:rgb(255, 0, 0); color: rgb( 0,0 ,0);}
.red a:link {color: rgb(0, 0, 255);}
.red a:visited {color: rgb(255, 255, 0);}
.red a:hover {color:rgb(0, 0, 0);}
.red a:active {color: rgb(0, 0, 0);}

.purple {background:rgb(128, 0, 128); color: rgb( 255,255 ,255);}
.purple a:link {color:rgb( 0,255 ,0);}
.purple a:visited {color:rgb( 255,0 ,0);}
.purple a:hover {color:rgb(255, 255, 255);}
.purple a:active {color: rgb(255, 255, 255);}

.gray {background:rgb(128, 128, 128); color: rgb( 0,0 ,0);}
.gray a:link {color: rgb(0, 0, 255);}
.gray a:visited {color: rgb(255, 255, 0);}
.gray a:hover {color:rgb(0, 0, 0);}
.gray a:active {color: rgb(0, 0, 0);}

.lightgray {background:rgb(230, 230, 230); color: rgb( 0,0 ,0);}
.lightwhite {background:rgb(255, 255, 255); color: rgb( 0,0 ,0);}