/* ubuntu-regular - latin */
@font-face {
    font-family: 'Ubuntu';
    font-style: normal;
    font-weight: 400;
    src: url('fonts/ubuntu-v20-latin-regular.eot'); /* IE9 Compat Modes */
    src: local(''),
    url('fonts/ubuntu-v20-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('fonts/ubuntu-v20-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
    url('fonts/ubuntu-v20-latin-regular.woff') format('woff'), /* Modern Browsers */
    url('fonts/ubuntu-v20-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
    url('fonts/ubuntu-v20-latin-regular.svg#Ubuntu') format('svg'); /* Legacy iOS */
}
/* ubuntu-500 - latin */
@font-face {
    font-family: 'Ubuntu';
    font-style: normal;
    font-weight: 500;
    src: url('fonts/ubuntu-v20-latin-500.eot'); /* IE9 Compat Modes */
    src: local(''),
    url('fonts/ubuntu-v20-latin-500.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
    url('fonts/ubuntu-v20-latin-500.woff2') format('woff2'), /* Super Modern Browsers */
    url('fonts/ubuntu-v20-latin-500.woff') format('woff'), /* Modern Browsers */
    url('fonts/ubuntu-v20-latin-500.ttf') format('truetype'), /* Safari, Android, iOS */
    url('fonts/ubuntu-v20-latin-500.svg#Ubuntu') format('svg'); /* Legacy iOS */
}



body {
 height: 100%;
 width: 100%;

 margin: 0;
 padding: 0;

 
 
} 

/* --------- Barrierefreie Texte ausblenden ------------*/
.handicapped{
 display:none;
}

body,td,textarea{
	font-family: 'Ubuntu', Arial, Helvetica, sans-serif;
	font-weight:400;
    color: #656565;
        
    /* 0.7em Schriftgroessen relativ wegen Barrierefreiheit, 
	 * wird über Style-Angabe ggf. ueberschrieben */
	font-size: 1em !important; 	 
}

/* ------------------------------------------------------------------
					Positionierung
------------------------------------------------------------------ */

/* Der Container, welcher alle Elemente umfasst.
 * Funktionen:
 * - Seite ausrichten
 * - Gesamtbreite der Seite festlegen  */
div#mainContainer{
 width: 100%;  /* 1024px - 20px fuer Scrollbars */
 text-align: left; /* wegen text-align in body */
 
 background-image:url(headerBG.gif);
 background-repeat: repeat-x;
 background-position: center top;
 
 position:relative;
}

div.mainContainerWork{
    margin-top:100px;
}
    div.mainContainerWork #adminBox{
        top:-100px;
    }

/* -----------------------------------
 *						Admin Navigation
 * -----------------------------------
 *
 * In diesem <div> befindet sich die Leiste
 * mit den Administrationsfunktionen */
div#adminBox{
    position: absolute;
    left:50%;
    top:0;
    background-color:#E5E5E5;
    
    width:1002px;
    padding:0px 10px 10px 10px;
    margin-left:-501px;
    
    /* ------------ runde Ecken ------------ */
    -moz-border-radius: 0px 0px 15px 15px;
    -webkit-border-radius: 0px 0px 15px 15px;
    border-radius: 0px 0px 15px 15px;
    
    /* ---------- Schatten ------------- */
    box-shadow:0em 0.2em 1em -0.2em #DDDDDD;
    -moz-box-shadow:0.2em 0.2em 1em -0.2em #99888E;
    -webkit-box-shadow:0.2em 0.2em 1em -0.2em #99888E;
    
    z-index: 1000;
    
    font-size:0.85em;
}

    div#adminNav{

    float:left;
    width:1002px; /* 1004 px - 2px fuer border */
    height:27px;

    background-color: #CCCCCC;
    background-image: url(systemBG.jpg);
    background-position: 50% 50%;
    border:1px solid #F24043;
    }


    /* --- Textelement in adminNav: LIS --- */
    div#adminNavText{
    float: left;
    width: 50px;

    margin:0px 5px 0px 5px;
    }

    div#adminNavText a{
    font-size: 1.7em;
    font-weight: bold;
    text-decoration: none;
    color: #FFFFFF;
    }

    div.adminNavText a:hover{
    color: #F24043;
    }


    /* --- Login Formular in adminNav --- */
    div#adminNavLoginFormContainer{
    float: left;
    width:550px;
    height: 27px;

    margin: 0;
    padding-left: 5px;
    text-align: left;

    border-left:1px solid #F24043;
    }

    /* ---- Intranet / Internet/ Administration ---- */
    /* ----- nicht ausgewählte Reiter --------- */
    .adminNavItem{
    float: right;
    height: 27px;
    width: 120px;
    border-left:1px solid #F24043;

    text-align: center;
    overflow: hidden;
    }


    /* Reiter-Links */
    .adminNavItem a:link, .adminNavItem a:visited{
    position: relative;
    top: 6px;

    color:#FFFFFF;
    font-weight:bold;
    text-decoration:none;
    }


    .adminNavItem a:hover{
    position: relative;
    top: 6px;

    color:#F24043;
    font-weight:bold;
    text-decoration:none;
    }


    /* Klasse des ausgewählten Reiters */
    .adminNavItemSelected{
    float: right;
    height: 27px;
    width: 130px;

    border-left:1px solid #F24043;

    text-align: center;

    background-color: #FFFFFF;
    background-image:url(systemBGlight.jpg);
    background-position: 50% 50%;
    color: white;
    }


    .adminNavItemSelected a:link, .adminNavItemSelected a:visited,.adminNavItemSelected a:hover{
    position: relative;
    top: 6px;

    color:#F24043;
    font-weight:bold;
    text-decoration:none;
    }



    .adminButton{
            width:170px;
            height:30px;

            float:left;

            position:relative;

            margin: 10px;
            padding: 3px;

            border:1px solid #E0E0E0;
            background-color: #E0E0E0;
            background-image: url(systemBGlight.jpg);
            background-position: 50% 50%;

            text-align:center;

            overflow:hidden;
    }

    .adminButton a{
            font-size:1.1em;
            font-weight:bold;
            text-decoration:none;
    }

    .adminButton img{
            position:absolute;
            top:3px;
            left:3px;
    }

    .adminButton span{
            position:absolute;
            top:12px;
            left:45px;
    }


    /* -----------------------------
                            System-Links
    -------------------------------- */
    div#headerSysLinks{
    clear: both; /* vorhergehendes Floating der Admin-Box aufheben */
    width:1004px;

    margin:10px 0px 2px 0px;

    text-align:right;
    }

    div#headerSysLinks a, div#headerSysLinks b{
    padding:0px 5px 0px 5px /* Abstand zwischen den einzelnen Links */
    }
    div#headerSysLinks b{
    background-color: #FFAAAA;
    }

/* -----------------------------
			Banner-Box
-------------------------------- */
div#adContainer{
}

/* ----------------------------------------------------------------------
			Benutzer-Login (nur auf Live-Seite)
--------------------------------------------------------------------------- */

/* FH möchte kein User-Login, weil es nicht schön aussieht */
div#userLogin{
	display:none;
}

/*
div#userLogin{
   display:block; 
   width:960px;
   height:0px;
   margin: 0px auto 0px auto;
   
   position:relative;
}
    div#userLogin form{
    	position:absolute;
    	top:85px;
    	right:0px;
    }
    
    	div#userLogin span.userName,
    	div#userLogin span.userPassword{
    		font-size:0.8em;
    		color:#999999;
    	}
    	
    	div#userLogin input.formTextField{
    		border: 1px solid #005da9;
    		color: #005da9;
    		
    		font-size:8pt;
    		
    		margin:0px;
    		padding:2px;
    		height:auto;
    	}
    	
    	div#userLogin input.userLoginButton{
    		width:auto;
    		
    		margin:0px;
    		padding:2px;
    		
    		background-color: transparent;
    		background-image:none;
    		border: 1px solid #005da9;
    		color: #005da9;
    	}
*/
    
/* -----------------------------
			Header-Box
-------------------------------- */
/* Standard-Definition für Kopfzeile */
div#headerContainer{
 clear: both;
 
 width:960px;
 height: 136px;
 margin: 0px auto 0px auto;
 
 position:relative;
 border:0px;
 
 }


/* -----------------------------
			Verlinktes Logo
-------------------------------- */
/* Quelltext enthält Blindgrafik mit Verlinkung auf Startseite 
* Diese kann hier beliebig definiert werden
*/

div#logoSpacer{
 position: absolute;
 top: 0px;
 right:0px;
  
 padding: 0px;
 margin:0px;
}
	
	/* Verlinktes Spacer-Image für das Logo */
	div#logoSpacer img{
	    width: 460px;
	    height: 110px;
	}

	
/* -----------------------------
			TopNav-Container
-------------------------------- */
/* Enthält alle Links der ersten Hierarchie-Stufe: Top-Navigation */
div#topNavContainer{
    position:absolute;
    top: 80px;
    left: 0px;
    
    width:960px;
    
    margin: 60px 0px 0px 0px;
    padding:0px;
    background-color: #005da9;
}

    ul.level0{
        margin:0px;
        padding:0px;
        
    }

    /* --- Default-Klasse für Navigationselemente --- */
    li.dropdownLevel0{
        float:left;

        width:130px; /*160 - padding*/
        
        margin:0px;
        padding: 0px;
        
        background-image: url(topNavSeparator.gif);
        background-position: right top;
        background-repeat: no-repeat;

        z-index:20000;
    }

        li.dropdownLevel0 a{
            font-family: 'Ubuntu', Arial, Helvetica, sans-serif;
            color: #FFFFFF;
            font-size:0.9em;
            font-weight: 600;   /* 700 zu fett */
            text-decoration:none;
            padding-left:10px;
            padding-right:0px;            
        }

    
        li.dropdownLevel0 a:hover{
            
        }
        
            /* dropdown-Menü kleinere Schrift */
            li.dropdownLevel0 li.dropdownLevel1 a{
                font-size:0.8em;
            }


/* --------------------------------------------------------------------
		Individuelle Übersteuerung der Top-Navigation
----------------------------------------------------------------------- 
Live und Develop-IDs                                                 */
#dropdownNavItem15927{
	display:none;
}

/* ------------------------------------------------------
                Dropdown- Untermenüs
------------------------------------------------------- */
.sf-menu ul {
    
    margin:0px;
    padding:0px;

    /* ---------- Schatten ------------- */
    box-shadow: 10px 10px 17px -7px #99888e;
    -moz-box-shadow: 10px 10px 17px -7px #99888e;
    -webkit-box-shadow: 10px 10px 17px -7px #99888e;
	
}




/* *** Ebene 1 ******/
.dropdownLevel1 a,
.dropdownLevel1 a:hover{
	text-align: left;       
}

.dropdownLevel0 ul{
	margin-top:0px;
	padding-top:0px;
	
    width:170px;
}


/* *** Ebene 2 ******/


ul.sf-menu li li:hover ul,
ul.sf-menu li li.sfHover ul {
	left: 148px; /* Versatz 2. Ebene >> match ul width */
}

.dropdownLevel2 a,
.dropdownLevel2 a:hover{
	
}
.dropdownLevel1 ul{
	margin-top:1px;
	padding-top:0px;
	
	margin-left:10px;
	padding-left:12px;
	
	
	width:170px;
}



/* -----------------------------------------------------
						Content-Container
----------------------------------------------------- */
/* der Container umfasst leftbar, content, rightbar, footer */
div#contentContainer{
 margin:0px;
 padding:0px;
 
 background-image: url(footerBoxBG.gif);
 background-position: center bottom;
 background-repeat: repeat-x;
 }



/* -------------------------------
		Linke Leiste: Navigation
---------------------------------- */
div#leftbar {
 position:absolute;
 top:0px;
 right:0px;
 left:0px;
 
 width:960px;
 height:0px;
 margin-left:auto;
 margin-right:auto;
 
}
    div#leftbar .leftNavTopPage{
        display:none;
    }
    
    div#leftbar ul.leftNav{
        display:none;
    }
    
    div#naviBox{
       display:none;
    } 
    
        div#naviBox a{
            display:none;
        }

/* -------------------------------
		Content
---------------------------------- */
div#content {
 width:960px;
 min-height:400px;
 
 font-size:0.9em !important;
 
 margin: 35px auto 40px auto;
 
 position: relative;
 top:20px;
}

/* Für Editor maximieren */
body#content{
    background-color:#FFFFFF;
    
    font-size:0.8em !important;
}
/* -------------------------------
		Rechte Leiste: Infos
---------------------------------- */
div#rightbar {
    position: absolute;
    top:5px;
    left:0px;
    right:0px;
    
}


/* -------------------------------
		Footer
---------------------------------- */
div#footer{
 clear:both;
 
 width:960px;
 height:275px;
 
 margin: 50px auto 0px auto;
 
 padding: 0px;
 
 position:relative;
 top:25px;
 }
    
    div#footerTop{
        display:none;
    }
    
    div#footerContent{
        position:relative;
    }
    div#footerInfo{
        margin: 20px 0px 30px 0px;
    }
        div#footerInfo table.footerTable{
        	height:275px;
        }
        
        div#footerInfo table.footerTable td H4{
            margin:0px 0px 20px 0px ;
            font-size:1.2em;
            font-weight:600;
            color: #005da9 !important;
        }
        
        div#footerInfo table.footerTable td{
            color: #656565 !important;
            font-size:0.8em !important;
            line-height: 1.2em;
            vertical-align:top;
            width:33%;
        }
        
        div#footerInfo table.footerTable a{
            color: #656565 !important;
            text-decoration:none;            
        }
        
    div#footerInfo table.bottomTable td{
        color: #005da9;
        font-size:0.8em !important;
    }

    	div#footerInfo table.bottomTable td a{
	        color: #005da9;
	        text-decoration:none;
	    }   
        
        
    
    div#footerSysLinks{
        display:none;
    }
    
        div#footerSysLinks a{}
           
        div#footerSysLinks a:hover{}
        
        div#footerSysLinks .startPage{}
        
        div#footerSysLinks .feedback,
        div#footerSysLinks .printPage,
        div#footerSysLinks .sitemap,
        div#footerSysLinks .conditions,
        div#footerSysLinks .imprint
        {}
        



/* -------------------------------------------------
		Inhalt der linken Navigation
------------------------------------------------- */

/* -------- Box mit aktueller Top-Page  --------- */
div.leftNavTopPage{
 display:none;
}


/* ------------------------------------------------------------------
					Content: Seiteninhalte
------------------------------------------------------------------ */

/* ------------------------------------------------------------------
					Schrift
------------------------------------------------------------------ 
/* tabellen-Schriftgroessen in IE auf 100% der Haupt-Schriftgröße, da sonst
	Prozent-Zahlen aufsummiert werden.
	Wird vom Firefox nicht benötigt/ignoriert.
*/
td{
	font-size:1em;
}


/* ------------------------------------------------------------------
					Überschriften
------------------------------------------------------------------ */
h1{
    font-family: 'Ubuntu', Arial, Helvetica, sans-serif;
    font-size:1.7em;     /* eigentlich 1.5em; aber content ist schon 0.8em verkleinert */
    font-weight: 600;
    color: #005da9;
    margin: 0px -10px 15px -10px;
    padding: 0px 10px 0px 10px;
    border-bottom: 3px solid #f5e5bf;
}

h2{
    font-family: 'Ubuntu', Arial, Helvetica, sans-serif;
    font-size:1.3em;   /* eigentlich 1.25em; aber content ist schon 0.8em verkleinert */
    font-weight: 600;
    color: #005da9;
    margin-bottom:5px;
}

h3{
    font-family: 'Ubuntu', Arial, Helvetica, sans-serif;
    font-size:1.1em;  /* eigentlich 1em; aber content ist schon 0.8em verkleinert */
    font-weight: 400;
    color: #005da9;
    margin-bottom:5px;
}


h4{
    font-family: 'Ubuntu', Arial, Helvetica, sans-serif;
    font-size:1em;
    font-weight: 400;
    color: #005da9;
    margin-bottom:5px;
}

/* ------------------------------------------------------------------
					Links
------------------------------------------------------------------ */
#content a,
div#userLogin a{
    color: #ff9933;
    text-decoration: none;
    font-weight: 400;
}


#content a:hover{
 text-decoration: underline;
}


/* ------------------------------------------------------------------
					weitere Standard-Tags
------------------------------------------------------------------ */
p{
 margin:5px 0 5px 0;
 padding:0;
}

b{
}

/* Editor fügt z.T. automatisch <p> in <td>s ein, daher margin auf 0 setzen
* sonst unschöner Abstand 
*/ 
table tr td p {
 margin:0px;
}

img{
 border:none;
}

hr{
 height:1px;
 border:0px;
}

form,div{
 margin: 0;
 padding: 0;
}

ul li{
 margin: 0px 0px 0px 25px;
 list-style-type:disc;
}

ol li{
 margin: 0px 0px 0px 25px;
 list-style-type:decimal;
}

.highlightText{
 font-weight:bold;
}

.boldText{
 font-weight:bold;
}




/* -----------------------------------------
		Tree - Navigations-Baumstruktur - Sitemap
-------------------------------------------- */
.treeInactive, .treeInactive a, .treeInactive span{
 color: #AAAAAA;
}


/* --------------- Ebene 0 ------------------- */
.tree0{
 margin: 0;
 padding: 0;
}

.tree0, .tree0 a, .tree0 span{
 padding: 10px 0 0 0px;
 font-size: 1.2em;
 font-weight: bold;
 text-decoration:none;
}

/* --------------- Ebene 1 ------------------- */
.tree1{
 margin: 0;
 padding: 0;
}

.tree1, .tree1 a, .tree1 span{
 padding: 4px 0 0 12px;
 font-size: 1.1em;
 font-weight: normal;
 text-decoration:none;
}

/* --------------- Ebene 2 ------------------- */
.tree2{
 margin: 0;
 padding: 0;
}

.tree2, .tree2 a, .tree2 span{
 padding: 4px 0 0 24px;
 font-size: 1.0em;
 font-weight: normal;
 text-decoration:none;
}

/* --------------- Ebene 3 ------------------- */
.tree3{
 margin: 0;
 padding: 0;
}

.tree3, .tree3 a, .tree3 span{
 padding: 2px 0 0 36px;
 font-size: 1.0em;
 font-weight: normal;
 text-decoration:none;
}

/* --------------- Ebene 4 ------------------- */
.tree4{
 margin: 0;
 padding: 0;
}

.tree4, .tree4 a, .tree4 span{
 padding: 2px 0 0 48px;
 font-size: 1.0em;
 font-weight: normal;
 text-decoration:none;
}


/* -----------------------------------------
		BreadCrumbs / Brotkrumen
-------------------------------------------- */
div.breadCrumbBox{
    
    padding: 10px 0px 0px 1px;
    height:24px;
    position:relative;
    
    top:-20px;
    
    color: #999999;
    
}

    div.breadCrumbBox b{
    }

    div.breadCrumbBox a{
        text-transform:none !important;
        text-decoration:none;
        
        font-weight: 200 !important;
        font-size: 0.8em !important;
        
        color:#999999 !important;
    }


/* ------------------------------------------------------
*				Toggle
* Wechsel des Hintergrunds bei Auflistungen
* ----------------------------------------------------- */
div.toggle1{
 margin:0px;
 padding:0px;
 border: 1px solid #FEFEFE;
 background-color:#FEFEFE;
}

div.toggle2{
 margin:0px;
 padding:0px;
 border:1px solid #FAFAFA;
 background-color:#FAFAFA;
}

/* ------------------------------------------------------
*				Listen-Tabellen
* Tabellen in denen Objekte aufgelistet werden.
* ----------------------------------------------------- */
/* Die Tabelle selbst */
.listTable{
 table-layout: fixed;
 width: 620px;
 border-collapse: collapse;
}


/* border über border-collapse zusammenlegen und dann für jede einzelne Zelle border setzen */
.listTable tr td{
 border: 1px solid #EEEEEE;
 margin: 0;
}


.listTable a{
 text-decoration: none;
}


/* KopFzeile der Tabelle */
.listTableHeader{
 padding: 6px 3px 6px 3px;
 border-top: 1px solid #ECF2E4;

 vertical-align: middle;
 color: #000000;
 background-color: #D4DEE7;
 font-weight: bold;
}


.listTableHeaderLeft{
 width:120px;
 padding: 4px 3px 4px 3px;
 border-top: 1px solid #ECF2E4;

 vertical-align: top;
 color: #000000;
 
 font-weight: bold;
 
}


.listTableHeaderFirstField{
 border-left: 1px solid #ECF2E4;
}


.listTableHeader a, .listTableHeaderLeft a{
}


.listTableHeader img, .listTableHeaderLeft img{
 border: none;
 margin-left: 0;
}


/* Bei Auflistungen wechseln sich die beiden
 * folgenden Klassen in jeder Reihe ab */
.listTableRow1{
 background-color: #FFFFFF;
}
.listTableRow2{
 background-color: #EAEFF5;
}


/* Inhalt eines Tabellenfeldes */
.listTableContent{
 padding: 3px;
 margin: 0;

 vertical-align:top;
 color: #003300;
}


.listTableContent a{
 font-weight:normal;
 text-decoration:underline;
}


.listTableContentCentered{
 text-align: center;
}


.tableBold tr td{
 font-weight:bold;
}

/* Die Spalte mit den Aktionsbuttons (Löschen,Bearbeiten...) */
.editCol{
 width:25px;
 margin:1px;
 vertical-align:top;
 text-align:center;
}

/* ------------------------------------------------------------------
					Eingabe-Tabellen
Die folgenden Klanssen beschreiben Tabellenelemente, 
welche Formularelemente enthalten, z.B. Kontakt-Formular
------------------------------------------------------------------ */

.inputTable, .editTable{
 width:630px;
 margin:0;
 border-collapse:collapse;
}


.inputTable tr td, .editTable tr td{
 vertical-align:top;
}/* margin und padding darf hier nicht global gesetzt werden! */


/* --- Zwischen-Überschrift --- */
td.inputTableSubHeading, td.editTableSubHeading{
 padding:1px;

 font-size:1.0em;
 font-weight:bold;
 color:#4879a6;

 border-bottom: 1px solid #4879a6;
 padding:20px 0 2px 0;
}


td.inputTableHeader, td.editTableHeader{
 margin:2px;
 padding:1px;

 font-weight:bold;
 width:150px;
 vertical-align:top;
 padding:2px 0 2px 0;
}


td.inputTableContent, td.editTableContent{
 margin:2px;
 padding:1px;

 vertical-align:top;
 padding:2px 0 2px 0;
}




/* -------------------------------------------------
*				 Formular-Elemente
* -------------------------------------------------- */
.formRadioButton{

}


.formCheckbox{
 margin:0;
 padding:0;
}


/* Klasse für Textfelder (<input type="text"> und <textarea>)*/
.formTextField{
 width:270px;
 border-width:1px;
 padding:1px 2px 0 2px;
 margin: 3px 0 1px 0;
 color: #004CAE;
 font-size:1.0em;
}

/* smallPart und widePart sind für doppelte Eingabe-Felder in einer Zeile 
*  addon für formTextField
*  z.B. plz + ort oder strasse + housenr
*/
.smallPart{
 width: 35px;
}

.widePart{
 width: 225px;
}

/* Input Textfelder */
input.formTextField{
  height:18px;
}


/* Textarea Textfelder */
textarea.formTextField{
 height:100px;
}


/* SelectBox mit variabler Breite */
.formSelectBoxVariable{
 border-width:1px;
 border-color: #73A145 #CCE1B8 #CCE1B8 #73A145;
 background-color: #FFFFFF;
 color: #F24043;
}


/* SelectBox mit fixer Breite */
.formSelectBox{
 width:270px;
 border-width:1px;
 background-color: #FFFFFF;
 color: #F24043;
}


/* "Doppelte Auswahlbox" */
.formSwitchBox{
 width:260px;
 height:150px;
 border-width:1px;

 background-color: #FFFFFF;
 color: #F24043;
 font-size:0.9em;
}


/* SelectBox, in welcher Elemente angeordnet werden können */
.formOrderBox{
 width:260px;
 height:150px;

 border-width:1px;
 background-color: #FFFFFF;
 color: #F24043;
 font-size:0.9em;
}


/* Button für die Anordnung der Elemente ind formOrderBox */
.formOrderBoxButton{
 margin: 2px;
 padding: 0px;

 width:20px;
 height:20px;

 border:1px solid #F24043;
 text-align:center;
 vertical-align:middle;
}


/* Klasse für Formular-Buttons */
.formButton{
 width: 80px;
 height: 20px;

 border:1px solid #D3DEE7; /*#F24043;*/
 background-color: #D3DEE7;
 background-image:url(systemBGButton.jpg);
 background-position: 50% 50%;
 
 font-size: 8pt;
 font-weight:bold;
 color: #777777;
 
 cursor:pointer;
}

/* Klasse für Schrift-Groessen-Buttons */
.fontSizeButton{
 
 border:1px solid #F24043;
 background-color: #D3DEE7;
 font-size: 1.0em;
 font-weight:bold;
 color: #000000;
}

/* -----------------------------------------------------
*				 Listen-Navigation
* Die folgenden Klassen bestimmen das Aussehen der
* Navigationselemente, die sich über mehrseitigen Suchergebnissen
* befinden (u.a. die beiden Navigationspfeile, die 
* Seitenzahlen und die SelectBox)
* ------------------------------------------------------ */

/* Enthält die Listen-Navigation */
div.queryNavigation{
 margin: 10px 0 0 0;
}


/* Navigationspfeile */
.queryNavigationButton{
 height:15px;
 vertical-align:middle;
 margin:0;
 padding: 0 3px 0 3px;
 background-color: #80B24D;

 border-style:solid;
 border-width: 1px;
 border-color: #9BC373 #405927 #405927 #9BC373;
}


/* Inaktive Navigationspfeile */
.queryNavigationButtonInactive{
 background-color: #CCCCCC;

 border-style:solid;
 border-width: 1px;
 border-color: #EEEEEE #AAAAAA #AAAAAA #EEEEEE;
}


/* Seitenzahlen */
a.queryNavigationPage{
 padding: 0 1px 0 1px;
 font-weight: bold;
 text-decoration: none;
}


/* Link der ausgewählten Seite */
a:link.queryNavigationPageSelected, a:visited.queryNavigationPageSelected{
 font-weight: bold;
 color: #F24043;
 
}


/* Textzeile, welche die Anzahl der gefunden Suchergebnisse angibt:
*  "Ergebnisse X von Y insgesamt Z" */
.queryNavigationInfoRow{
 margin: 4px 0 0 0;
}


/* Enthält die SelectBox, mit welcher die 
*  Anzahl der anzuzeigenden Suchergebnisse
*  pro Seite ausgewählt werden kann */
div.queryNavigationObjectsPerPage{
 text-align:right;
}


/* Die SelectBox, mit welcher die 
 * Anzahl der anzuzeigenden Suchergebnisse
 * pro Seite ausgewählt werden kann */
.queryNavigationSelectBox{
 width:150px;
 background-color:#FFFFFF;
 color: #444444;
 border-width:1px;
 margin:0 1px 1px 0;
}




/* ----------------------------------------------------------
				Alphabetische Listen
------------------------------------------------------------ */
.alphabetBox{
 margin:20px 0px 10px 0px;
 text-align:center;
}

.alphabetBox a:link, .alphabetBox a:hover, .alphabetBox a:visited{
 font-size:1.3em;
 text-decoration:none;
 padding:2px;
}


/* nicht vorhandener Buchstabe */
.alphabetNavInactive, .alphabetNavInactive:link, .alphabetNavInactive:hover, .alphabetNavInactive:visited{
 color:#CCCCCC;
}

/* vorhandener Buchstabe */
.alphabetNavActive, .alphabetNavActive:link, .alphabetNavActive:hover, .alphabetNavActive:visited{
 color:red;
 font-weight: bold;
}

/* Buchstabe als Zwischenüberschrift */
.alphabetHeader{
 float:left;
 width:100%;
 margin: 10px 0px 5px 0px;
 
 border-bottom: 1px solid red;
}

/* div mit Buchstabe (innerhalb alphabetHeader) */
.alphabetLetter{
 width:100px;
 float:left;
 
 font-size:1.5em;
 font-weight:bold;
}

/* div mit Link, um zum Seitenanfang zu kommen (innerhalb alphabetHeader) */
.alphabetTopAnchor, .alphabetTopAnchor a{
 width:100px;
 float:right;
 
 font-size:0.9em;
 text-align:right;
}




/* ----------------------------------------------------------
				Gruppierte Listen
------------------------------------------------------------ */
.groupBox{
 margin:20px 0px 10px 0px;
 text-align:center;
}

.groupBox a:link, .groupBox a:hover, .groupBox a:visited{
 padding:4px;
 
 font-size:1.1em;
 text-decoration:none;
 font-weight: bold;
}

/* Buchstabe als Zwischenüberschrift */
.groupHeader{
 float:left;
 width:100%;
 margin: 10px 0px 5px 0px;
 
 border-bottom: 1px solid red;
}

/* div mit Buchstabe (innerhalb alphabetHeader) */
.groupName{
 width:500px;
 float:left;
 
 font-size:1.5em;
 font-weight:bold;
}

/* div mit Link, um zum Seitenanfang zu kommen (innerhalb alphabetHeader) */
.groupTopAnchor, .groupTopAnchor a{
 width:100px;
 float:right;
 
 font-size:0.9em;
 text-align:right;
}


/* ----------------------------------------------------------
				Fotogalerie
------------------------------------------------------------ */
/* --- umrahmt die gesamte Fotogalerie --- */
div.photogalleryBox{
 width:550px;
 margin:10px 0px 0px 0px;
 padding:0px;
}

/* --- umrahmt jeweils ein einzelnes Bild --- */
div.photoBox{
 float:left;
 
 width:102px;
 height:102px;
 margin:2px;
 border: 1px solid #009391;
  
 text-align:center;
 line-height:102px;
 vertical-align:middle;
}

img.photo{
 vertical-align:baseline;
}


/* ----------------------------------------------------------
			RSS-Feed
---------------------------------------------------------- */
div.rssBox{
 margin: 10px 0px 5px 0px; 
}

a.rssTitle{
 margin: 0px 0px 3px 0px;
 font-size:1.1em;
 font-weight:bold;
 text-decoration:none;
}

div.rssDescription{
}

div.rssSource{
 text-align:right;
}

div.rssSource a{
 font-size:0.9em;
}

/* ----------------------------------------------------------
				SuchSeite
------------------------------------------------------------ */
div.searchBox{
    
 margin:5px 0px 10px 0px;
 
 z-index:1;
}

div.searchHeader{
 background-color:#F5F5F5;
 padding:2px;
}

div.searchHeader a{
 font-weight:bold;
 font-size:1.0em;
 text-decoration:none;
}

div.searchContent{
 
}

div.searchInfo{
 margin:5px 0px 0px 0px;
 height:15px;
 overflow:hidden;
 border-bottom: 1px solid #D4DEE7;
 
 color:#999999;
 font-size:0.9em;
}



/* ----------------------------------------------------------
			Elemente der Sidebar
---------------------------------------------------------- */
/* alle div-Elemente in der Sidebar mit margin versehen,
* um boxmodel-problem (padding zu umgehen)	*/
div#handicappedBox,
div#searchBox,
div#searchBoxPerson,
div#languageBox,
div#fileServer,
div#scrollerBox,
div#contactBox,
div#sidebarInfoBox,
.rightbox{
	
}

/*------------BarriereFreiheit ----------*/
div#handicappedBox{
 display:none;
}

/*------------- Suchbox --------------*/
div#searchBox{
    display:none;
    
}
    

/*------------- Suchbox Ansprechpartner --------------*/
div#searchBoxPerson{
    display:none;
}

/* ----------------- Sprachen ------------------------- */
div#languageBox{
    display:none;
}

   

/* -------- Dateiserver -------------- */
div#fileServer{
    display:none;
}


/* -------------- Scroller ------------------- */
div#scroller{
 display:none;
}
	
/* -------------- Anschrift ------------------- */
div#contactBox{
 display:none;
}




/* ----------------------------------------------------------
			Sonstiges
---------------------------------------------------------- */

.highlight{
 background-color: #FFDC00;
}

/*
*	wird bei Fehlermeldungen (z.B. Formularfeldern mit ungültigem Inhalt) angehängt
*	 myField.className += " redBorder";
*/
.redBorder {
 border: 1px solid #ff0000;
}

.msgError{
 color: #ff0000;
}

.msgOK{
 color: #00aa00;
}

/*
*	Backlink auf Detailseite
*/
div.backlink {
 margin-top: 30px;
}


fieldset{
	padding:10px;
}

legend{
	font-size:1.3em;
	font-weight:bold;
	margin-bottom:10px;
}

/* ----------------------------------------------------------
					Gästebuch
---------------------------------------------------------- */
.guestbookBox{
 margin:5px 0px 5px 0px;
 border:1px solid #DDDDDD;
}

.guestbookHeader{
 background-color:#EEEEEE;
 padding:2px;
}

.guestbookName{
 font-weight:bold;
 color:red;
}

.guestbookMessage{
 padding:2px;
}

/* ----------------------------------------------------------
					Shop-Produkte und Warenkorb
---------------------------------------------------------- */
/* ---------- Warenkorb-Funktionen beim Produkt ------------- */
.shopProductName{
	font-size:1.2em;
	font-weight:bold;
	clear:both;
}
.shopProductOrder p{
	float:right;
	clear:both;
}

.shopCartButton{
	width:80px;
	background-image: url("cart.gif");
	background-repeat: no-repeat;
	background-position: 5px center;
	padding:3px 3px 3px 30px;
	
	border: 1px solid #DDDDDD;
	background-color:#EEEEEE;
	font-weight:bold;
	cursor:hand;
}

.shopCartButton a{
	text-decoration:none;
}

/* ---------- Warenkorb in der Sidebar ------------ */
#cart{
	border-top: 0px;
	background-color:#fafafa;
	padding:3px;	
}

#cart .cartTitle{
	color:#b5c1d1;
	font-weight:bold;
	font-size:1.2em;
	margin:5px 0px 10px 0px;
	
	padding-left: 30px;
	background-image: url("cart.gif");
	background-repeat: no-repeat;
	background-position: left center;
}


#cart .cartProduct .cartProductName{
	margin:5px 0px 0px 0px;
	font-weight:bold;
	font-size:0.9em;
}

#cart .cartProduct .cartAmount{
	margin:0px;
	font-size:0.9em;
}

#cart .cartProduct .cartPrice{
	margin:0px;
	text-align:right;
	font-size:0.9em;
}

#cart .cartSum{
	border-top: 1px solid #b5c1d1;
	font-weight:bold;
	text-align:right;
}

#cart .doOrder{
	margin:20px;
	
	background-image: url("cart.gif");
	background-repeat: no-repeat;
	background-position: 5px center;
	padding:3px 3px 3px 35px;
	
	border: 1px solid #DDDDDD;
	background-color:#EEEEEE;
	font-weight:bold;
	cursor:hand;
}

#cart .doOrder a{
	text-decoration:none;
}

#cart .cartPriceInfo{
	font-size:0.8em;
	color:#AAAAAA;
}


/* -------------- Warenkorb in der Bestell-Übersicht -------------- */
.cartDeleteProduct{
	width:15px;
	height:15px;
	background-image: url("delete.gif");
	background-repeat: no-repeat;
	background-position: center center;
	padding:0px;
	cursor:hand;
}




/* ----------------------------------------------------------
			Popup-Boxen für Autocomplete
---------------------------------------------------------- */

.ul_james {
	margin: 0;
	padding: 0px;
	height:100px;
	overflow:auto;
	min-width:150px;
	width:expression("150px");	/*IE-Hack*/
	
	border-color: #CCCCCC;
	border-width: 1px 1px 1px 10px;
	border-style:solid;
    list-style-position: outside;
    list-style: none;
	background-color:#FAFAFF;
}

.li_james {
	padding:2px;
	cursor: pointer;
	white-space:nowrap;    
}

.li_james_hovered {
    padding:2px;
	background-color:#FFF5B3;
}



/* ----------------------------------------------------------
					Veranstaltungen
---------------------------------------------------------- */
/* ------------------ Such-Formular ---------------------*/
table.searchEvent{
	border-top: 1px solid #EEEEEE;
	border-bottom: 1px solid #EEEEEE;
	margin: 30px 0px 30px 0px;
}

td.searchEventHeader{
	font-weight:bold;
	width:20%;
}

td.searchEventInput{
	width:50%;
}

td.searchEventDatePicker{
	width:250px;
}


/* ------------------- Übersichtsliste ----------------- */
.event{
	margin-top:10px;
}

.eventToggle1{
	background-color:#FAFAFA;
}

.eventToggle2{
	background-color:#FCFCFC;
}

	.event .eventInfo{
		width:130px;
		float:left;
	}
		.event .eventCategory{
			font-weight:bold;
			color:#AAAAAA;
			font-style:italic;
		}
		
		.event .eventLocation{
			font-size:0.9em;
			font-style:italic;
		}
	
	.event .eventContent{
		width:800px;
		float:left;
	}
		.event .eventTitle{
			font-size:1.1em;
				
		}

/* ------------------- Detailseite ----------------- */
.eventDetail{
	margin-top:20px;
}
	.eventDetail .eventDetailContent{
		width:800px;
		float:left;	
	}
		.eventDetail .eventTitle{
			font-size:1.4em;
			font-weight:bold;	
		}
	
	.eventDetail .eventDetailInfo{
		width:130px;
		float:right;
		background-color:#F1F1F1;
		padding:5px;
	}
	
	.eventDetail .eventDetailInfo div{
		margin:5px;
	}
	
	.eventDetail .eventDetailInfo .eventCategory{
		font-weight:bold;
	}

/* ---------------------------------------------------------------------------------------
 *							Weitere eigene Seiten mit eigener Struktur
 * ---------------------------------------------------------------------------------------
 * z.B. Toppage, Editfenster, Popupfenster, usw.
*/


/* -----------------------------------------
		Layout für Popup-Fenster
-------------------------------------------- */
div#popupBody{
	margin:0px;
}

div#popupHeader{
 height:30px;

 font-size: 0.9em;
 font-weight:bold;

 padding:0px;
 margin:0px;
 border:0px;

 background-color: #D4DEE7;
}

/* Container, der ggf. Navigation und Content beinhaltet */
div#popupContainer {
 padding: 0;
 
 background-color: #FFFFFF;
 text-align:left;
}



/* linke Navigations-Spalte */
div#popupLeftBar{
 float: left;
 width: 145px;

 margin:2px;
 padding:0px;
 text-align:left;
}

/* Content-Bereich */
div#popupContent {
 float: left;
 height:600px;
 overflow:auto;
 margin:2px;
 padding:0px;
}

/* Footer */
div#popupFooter{
 clear:both;
 height:30px;

 font-size: 1.0em;
 font-weight:bold;

 padding:0px;
 margin:0px;
 border:0px;

 background-color: #D4DEE7;
 text-align:center;
}


.ui-dialog{
    z-index:100000 !important;
    font-size: 0.8em !important;
}

/* -----------------------------------------------------------------
                        specials 
----------------------------------------------------------------- */

/* --------------- 2 Spalten --------------- */
.grid2{
    float:left;
    width:  440px;
    padding: 10px 10px;
    margin:   10px 10px 10px 10px;
}

/* --------------- 3 Spalten --------------- */
.grid3{
    float:left;
    width: 300px;
    padding: 0px;
    border:  0px;
    margin:  0px 20px 0px 0px;
    /* Bildbreite inkl. Rahmen 300px */
}

/* --------------- 4 Spalten --------------- */
.grid4{
    float:left;
    width: 206px;
    padding: 10px 7px;
    margin:  10px 10px 10px 10px;
}

iframe.JaSchedule{
	width:960px;
	height:600px;
}




/* ----------- cookie consent (freeprivacypolicy) overwrite ------------*/
.cc_dialog.simple {
    left: 25%;
    right: 25%;
    top: 5em;
    bottom: auto;
    max-width: auto;
    position: fixed;
}

@media screen and (max-width: 600px){
    .cc_dialog.simple {
        top: 0;
        left:0;
        right:0;
        max-width: 100%;
    }
}