/******************************************************************
* Basisformatierungen - Rahmenlayout:
******************************************************************/

html {
   color: #000;
   background: #fff url(../img/layout/hg_html5.jpg) repeat-x;
}
body {
   font: normal 82% "Trebuchet MS", "Myriad Web", Tahoma, Geneva, Arial, Helvetica, sans-serif;
   margin: 0 auto;
   padding: 4em 10px 0;
} 
a {
   /*font-weight: bold;*/
   color: #003399;
   background-color: transparent;
}
a:visited {
   color: #5F7BB3;
   background-color: transparent;
}
a:hover,
a:active,
a:focus {
   color: #003366;
   background-color: transparent;
   text-decoration: none;
} 
/*h1, h2, h3, strong {
	color: #333;
	background-color: inherit;
}
* strong {
	color: inherit;
	background-color: inherit;
}*/

hr {
   position: absolute;
   left: -1000px;
   width: 0;
} 
/* Top-Anker */
#anfang {
   position: absolute;
   top: 0;
}

/* Hilfsnavigation für No-Stlye-UAs:
----------------------------------------------------------*/
#zusatznavigation {
   position: absolute;
   left: -1000em;
   width: 0;
   overflow: hidden;
   
}

/* Utility-Links wie "Home", "Hilfe", "Kontakt", "Impressum":
----------------------------------------------------------*/
#utilitylinks {
   text-align: right;
   color: #ccc;
   background: #f3eed1 url(/img/layout/hg_leisten.jpg) repeat-x left bottom;
   position: absolute;
   top: 0;
   left:0;
   right: 0;
   z-index: 10;
   padding: 3px 10px 3px;
   border-top: 1px solid #fff;
   border-bottom: 1px solid #CBC8A9;
   /*min-width: 676px;*/
}
/* Trennlinien zw. Menüpunkten */
#utilitylinks span {
   display: inline;
   margin: 0 3px;
   letter-spacing: -1em;
   border-left: 1px solid #CBC8A9;
   border-right: 1px solid #fff;
   vertical-align: bottom;
   /* für Opera: */
   display: inline-block;
   width: 0;
   overflow: hidden;
}
#utilitylinks a {
   font-weight: normal;
   text-decoration: none;
   color: #333;
   background-color: transparent;
   padding: 0px 7px;
   margin: 0;
   vertical-align: middle;
   -moz-border-radius: 4px;
   -webkit-border-radius: 4px;
   /*-moz-border-radius-bottomleft: 5px;
   -moz-border-radius-bottomright: 5px;*/
}
#utilitylinks a:hover,
#utilitylinks a:active,
#utilitylinks a:focus {
   text-decoration: none;
   color: #000;
   background-color: #f1efe1;
   padding: 1px 6px;
   margin-top: -1px;
   margin-bottom: -1px;
   border: 1px solid;
   border-color: #fff #CBC8A9 #CBC8A9 #fff;
   /*-moz-appearance: toolbarbutton;*/
}
#utilitylinks a:active,
#utilitylinks a:focus {
   color: #000;
   background-color: #e5e4dd;
   border-color: #CBC8A9 #fff #fff #CBC8A9;
}
#utilitylinks a:active {
   outline: none;
   -moz-outline: none;
}

#utilitylinks a#ul-admin {
   position: absolute;
   left: 1%;
   top: 4px;
   color: #ce4d0e!important;
}
#utilitylinks a#ul-admin:hover,
#utilitylinks a#ul-admin:active,
#utilitylinks a#ul-admin:focus {
   top: 3px;
}

#utilitylinks a#ul-extensions {
   position: absolute;
   top: 4px;
   left:120px;
   /*padding: 3px 10px 3px;*/
   color: #ce4d0e!important;
}
#utilitylinks a#ul-extensions:hover,
#utilitylinks a#ul-extensions:active,
#utilitylinks a#ul-extensions:focus {
   top: 3px;
} 

#utilitylinks p {
   margin: 0;
}

/* Anmeldung im Fußbereich 
----------------------------------------------------------*/
#anmeldeleiste {
   font-size: .95em;
   text-align: left;
   position: fixed;
   left:0;
   right: 0;
   bottom: 0;
   z-index: 7;
   color: #333;
   background: #f3eed1 url(/img/layout/hg_leisten.jpg) repeat-x left bottom;
   padding: 4px 0 3px 0;
   margin: 0;
   border-top: 1px solid #fff;
   border-bottom: 1px solid #CBC8A9; 
   /*min-width: 676px;*/
	display: none;
}
#anmeldeleiste form,
#anmeldeleiste p {
   margin: 0 0 0 1.5%;
   /*display: table;*/
}
#anmeldeleiste fieldset {
   /*display: table-row;*/
}
#anmeldeleiste label,
#anmeldeleiste span {
   /*display: table-cell;*/
   padding-right: 9px;
   white-space: nowrap;
}
#anmeldeleiste input {
   font-size: .9em;
   /*vertical-align: middle;*/
}
#anmeldeleiste input[type="text"] {
}
#anmeldeleiste p {
   padding: 1px 0 3px;
}

#anmeldeleiste form label:first-child::before {
  /*content: url(/img/extern/logo_puzzle_20x20.png);*/
  content: url(/favicon.ico);
  vertical-align: bottom;
  margin: 0 5px 0 0;
}

#anmeldeleiste a.benutzeranzeige {
   color: #039;
   background-color: inherit;
   text-decoration: underline;
	font-weight: bold;
   margin: 0 0 0 .2em;
}
#anmeldeleiste a.benutzeranzeige:hover,
#anmeldeleiste a.benutzeranzeige:active,
#anmeldeleiste a.benutzeranzeige:focus {
   text-decoration: none;
   color: #036;
   background-color: inherit;
}
#anmeldeleiste .log-button {
   padding: 1px;
   -moz-border-radius: 2px;
   -webkit-border-radius: 2px;
   /*-moz-appearance: toolbarbutton;*/
   vertical-align: middle;
}
/*#anmeldeleiste a.log-button {
   padding: 0 3px 2px !important;
   margin-left: 10px;
}*/
#anmeldeleiste .log-button:hover,
#anmeldeleiste .log-button:active,
#anmeldeleiste .log-button:focus {
   color: inherit;
   background-color: #f1efe1;
   padding: 0;
   border: 1px solid;
   border-color: #fff #CBC8A9 #CBC8A9 #fff;
} 
/*#anmeldeleiste a.log-button:hover,
#anmeldeleiste a.log-button:active,
#anmeldeleiste a.log-button:focus {
   padding: 0 2px 2px !important;
}*/
#anmeldeleiste .log-button:active,
#anmeldeleiste .log-button:focus {
   color: inherit;
   background-color: #e5e4dd;
   border-color: #CBC8A9 #fff #fff #CBC8A9;
} 
#anmeldeleiste .log-button:active {
   -moz-outline: none;
   outline: none;
}

/*#anmeldeleiste a.log-button img {
   vertical-align: middle;
}*/
   #anmeldeleiste form.angemeldet .log-button {
      margin-left: 10px;
   }

#anmeldeleiste abbr {
	text-decoration: none;
	outline: none;
	border: none;
}


/* Kopfbereich:
----------------------------------------------------------*/
#kopf {
   margin: 0 auto 3.2em;
   min-width: 660px;
   max-width: 69.9em;
   min-height: 110px;
}
#seitentitel {
   position: relative;
   color: #000;
   background: #f3eed1 url(../img/layout/hg_kopf3.jpg) repeat-x right bottom;
   border: 1px solid;
   border-color: #fff #CBC8A9 #CBC8A9 #fff;
   min-height: 3.5em;
   -moz-border-radius-topleft: 8px;
   -moz-border-radius-topright: 8px;
   -webkit-border-top-left-radius: 8px;
   -webkit-border-top-right-radius: 8px;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	/*width: 100%;
	overflow: hidden;*/
}
#seitentitel h1 {
   position: relative;
   z-index: 9;
   font-size: 3em;
   font-weight: normal;
   line-height: normal;
   color: #CE4D0E;
   background: transparent url(../img/layout/hg_txt_beta.png) 335px 0 no-repeat;
   margin: 10px 0 12px;
}
#seitentitel h1 a {
   font-weight: normal;
   color: #ce4d0e;
   background: transparent url(../img/layout/txt_erweiterungen-de2.png) no-repeat 58px 7px;
   padding: 0;	
   margin-left: 10px;
   display: block;
   width: 364px;
   height: 48px;
}
#seitentitel h1 strong {
   position: absolute;
   margin-left: -500em;
}
/* Logoicon */
#seitentitel h1 a img {
   /*width: 64px;
   height: 64px;*/
   position: absolute;
   top: 0;
}
#seitentitel h2 {
   font-weight: normal;
   font-size: 1.6em;
   padding: 15px 20px 15px 76px;
   margin: 0;
   z-index: 2;
   display: none;
}
#seitentitel h2 em {
   font-style: normal;
   line-height: 110%;
}
#seitentitel h2 br {
   display: none;
}

/* Hautpmenü für Programmrubriken:
----------------------------------------------------------*/
#programme {
	display: table;
   color: inherit;
   background: #DFE6E6 url(../img/layout/hg_programmauswahl2.gif) repeat-x bottom;
	background-color: #d6dddd;
   font-weight: bold;
   text-align: right;
   line-height: normal;
   padding: 1px 6px 2px;
   border: 1px solid;
   border-color: #fff #C5CACA #C5CACA #fff;
   -moz-border-radius-bottomleft: 9px;
   -moz-border-radius-bottomright: 9px;
   -webkit-border-bottom-left-radius: 9px;
   -webkit-border-bottom-right-radius: 9px;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	width: 100%;
}
#programmauswahl {
	display: table-row;
}
#programmauswahl li,
#programmauswahl h2 {
   line-height: normal;
   /*display: inline;*/
   margin: 0;
}

#programmauswahl li {
	display: table-cell;
	/*width: 14.25%;*/
	width: 12.4%;
	text-align: center;
}

#programmauswahl a, 
#programmauswahl span.inaktiv {
	display: block;
   text-decoration: none;
   line-height: normal;
	white-space: pre;
   padding: 1px 9px 1px 4px;
   -moz-border-radius: 4px;
   -webkit-border-radius: 4px;
	/*height: 2.4em;*/
}
#programmauswahl span.inaktiv {
	color: #999;
	background-color: transparent;
}
#programmauswahl a:hover,
#programmauswahl a:active,
#programmauswahl a:focus {
   color: inherit;
   background-color: #F3F3EC;
   padding: 0px 8px 0px 3px;
   border: 1px solid;
   border-color: #fff #C5CACA #C5CACA #fff;
   /*-moz-appearance: toolbarbutton;*/
}
#programmauswahl a:active,
#programmauswahl a:focus {
   color: inherit;
   background-color: #e5e4dd;
   border-color: #C5CACA #fff #fff #C5CACA;
}
#programmauswahl a:active {
   -moz-outline: none;
   outline: none;
}
#programmauswahl a img,
#programmauswahl span img {
   margin: 0 auto -18px auto;
   /*margin: 0 auto 0 auto;*/
}

/*#programmauswahl li#menue-gesamt {
   float: left;
} */

/* Suchfunktion im Kopfbereich:
----------------------------------------------------------*/
#sitesearch {
   position: absolute;
   top: 8px;
   right: 0;
   z-index: 9;
   text-align: left;
   color: #000;
   padding: 1px 10px 1px 10px;
   margin: auto;
   text-align: right;
}
#sitesearch label {
   color: #333;
   background-color: transparent;
   vertical-align: middle;
}
#sitesearch input[type=text] {
   color: inherit;
   background: #fff url(../img/icons/ico_lupe16.png) no-repeat left center;
   margin-right: 2px;
   margin: 2px 2px 2px 0;
   padding-left: 20px;
   vertical-align: middle;
}
#sitesearch button {
   color: #333;
   background-color: transparent;
   padding: 0;
   margin: 1px;
   border: 0;
   outline: none;
   -moz-outline: none;
   /*-moz-appearance: toolbarbutton;*/
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
}
#sitesearch button:hover {
   color: #000;
   background-color: #f1efe1;
   border: 1px solid;
   border-color: #fff #CBC8A9 #CBC8A9 #fff;
	/*margin: -1px 0 -1px -1px;*/
	margin: 0;
}
#sitesearch button:focus,
#sitesearch button:active {
   color: #000;
   background-color: #e5e4dd;
   border-color: #CBC8A9 #fff #fff #CBC8A9;
	/*margin: -1px 0 -1px -1px;
	padding-right: 0;*/
	margin: 0;
}
#sitesearch button img {
   margin: 2px;
   padding: 0;
	vertical-align: middle;
}
/* Link "erweiterte Suche": */
#sitesearch a {
   font-weight: normal;
   text-decoration: none;
   color: #333;
   background-color: transparent;
   padding: 1px 6px 1px 6px;
	margin: 1px 0 1px 1px;
	margin: 1px;
   position: relative;
   top: 3px;
   -moz-border-radius: 3px;
   -moz-border-radius-bottomleft: 4px;
   -moz-border-radius-bottomright: 4px;
   -webkit-border-radius: 3px;
   -webkit-border-bottom-left-radius: 4px;
   -webkit-border-bottom-right-radius: 4px;
	/* Fuer Opera: */
	display: inline-block;
}
#sitesearch a::before {
   content: url(../img/layout/pfeil_lnr.png)"  ";
   vertical-align: baseline;
}
#sitesearch a:hover,
#sitesearch a:active,
#sitesearch a:focus {
   text-decoration: none;
   color: #000;
   /*padding: 1px 6px 1px 6px;*/
	margin: 0 -1px 0 0;
	margin: 0;
   background-color: #f1efe1;
   border: 1px solid;
   border-color: #fff #CBC8A9 #CBC8A9 #fff;
   /*-moz-appearance: toolbarbutton;*/
}
#sitesearch a:active,
#sitesearch a:focus {
   color: #000;
   background-color: #e5e4dd;
   border-color: #CBC8A9 #fff #fff #CBC8A9;
} 
#sitesearch a:active {
   -moz-outline: none;
   outline: none;
} 

/* Navigation "Extras" (Gesamtliste, Kalemder etc.):
----------------------------------------------------------*/
div#extras {
	/*display: table;*/
	border-collapse: separate;
	border-spacing: 1px;
	list-style: none;
	text-align: center;
	margin: auto;
	padding: 0;
   border: solid #c9c7bc;
   border-width: 1px 0;
   min-width: 660px;
   max-width: 69.9em;
	top: -15px; 
	position: relative;
}
div#extras ul {
	display: table;
	width: 100%;
}
div#extras li {
	display: inline;
	display: table-cell;
	/*width: 16.6%;*/
	font-weight: normal;
	margin: 0;
	padding: 1px 0;
}

div#extras li a {
	display: block;
	font-weight: normal;
	text-decoration: none;
	padding: 1px 5px;
	white-space: nowrap;
   -moz-border-radius: 3px;
   -webkit-border-radius: 3px;
	-moz-box-sizing: border-box;
}
div#extras li a:hover,
div#extras li a:active,
div#extras li a:focus {
   color: #ce4d0e;
	background: #f1f1ea url(../img/layout/hg_toolbarbutton_aktiv2.gif) no-repeat;
	padding: 0px 4px;
   border: 1px solid;
   /*border-color: #e6e4d7 #CBC8A9 #CBC8A9 #e6e4d7;*/
   border-color: #f4f2e4 #CBC8A9 #CBC8A9 #f4f2e4;
	/*-moz-appearance: toolbarbutton;*/
}
div#extras li a:active,
div#extras li a:focus {
   color: inherit;
   background: #f2f1ea url(../img/layout/hg_toolbarbutton_aktiv2.gif) no-repeat;
	padding: 0px 4px;
   border-color: #C5CACA #e6e5de #e6e5de #C5CACA;
}
div#extras li a:active {
   -moz-outline: none;
   outline: none;
}
div#extras li a::before {
   content: url(../img/layout/pfeil_lnr.png)"  ";
   vertical-align: baseline;
	margin-left: -7px;
}

div#extras li a img {
	vertical-align: -5px;
	margin: 2px 3px 2px 0;
	display: none;
}

/* Rahmen-Container um mittleren Inhaltsbereich (Inhalt + Spalten):
----------------------------------------------------------*/
#koerper {
   margin: auto;
   min-width: 660px;
   max-width: 69.9em;
} 

/* Innenrahmen-Container um Inhalt + linke Spalten (wg. Floats):
----------------------------------------------------------*/
#inhalt {
   min-height: 400px;
   /* -> weiteres siehe "inhalt.css" */
} 

/* Seitenspalten links & rechts:
----------------------------------------------------------*/
.spalte {
   -moz-border-radius: 8px;
   -webkit-border-radius: 8px;
   /* -> weiteres siehe "seitenspalten.css" */
}

/* Hauptinhaltsbereich,  :
----------------------------------------------------------*/
#text {
   padding: 0 0 2em;
   margin: 0 0 1em;
   width: 72%; 
   position: relative;
   float: right;
   clear: right;
   -moz-border-radius: 8px;
   -webkit-border-radius: 8px;
   /* -> weiteres siehe "inhalt.css" */
}

/* Fussbereich (Copyrights, Toplink) :
----------------------------------------------------------*/
#fuss {
   text-align: center;
   color: #666;
   background-color: inherit;
   margin: 3em auto;
   padding: .75em 2%;
   border-top: 1px solid #c9c7bc;
   max-width: 67em;
   clear: both;
} 
#fuss p {
   font-size: .85em;
   margin: 0;
   padding: 0;
}

p#toplink {
   /*position: fixed;*/
	position: static;
   right: 1%;
   bottom: 6px;
   z-index: 8;
   margin: 0;
	text-align: right;
}
p#toplink a {
   white-space: nowrap;
   padding: 1px 4px 3px;
   margin: 0 1%;
   /*-moz-appearance: toolbarbutton;*/
   -moz-border-radius: 4px;
   -webkit-border-radius: 4px;
}
p#toplink a:hover,
p#toplink a:active,
p#toplink a:focus {
   color: inherit;
   background-color: #f1efe1;
   padding: 0 3px 2px;
   border: 1px solid;
   border-color: #fff #CBC8A9 #CBC8A9 #fff;
} 
p#toplink a:active,
p#toplink a:focus {
   color: inherit;
   background-color: #e5e4dd;
   border-color: #CBC8A9 #fff #fff #CBC8A9;
   outline: none;
   -moz-outline: none;
} 
p#toplink a img {
   vertical-align: text-bottom;
}

/* "Unsichtbare" Elemente, screenreader-freundlich versteckt */
body .aus {
   position: absolute!important;
   left: -1000px!important;
   width: 0!important;
} 


