/* ================================== */
/*  Arbeit und Behinderung CSS : Layout Styles  */
/* ================================== */

/* --- Basic Layout -------------------------------------------------------- */

body {
  background-color: #fff;
  color:#000;
  font: 0.75em/140% Verdana, Arial, Helvetica, sans-serif;
  padding-bottom:2.75em;
}

#pagecenter {
  width: 74em;
  background: #fff url('../img/ui/top.jpg') no-repeat 0 2em;
  /*margin: 0 0 0 4em;  wenn nicht zentriert werden soll */
  margin:0 auto;
}

#top {
  padding: 0;
  margin:1em 0 0 0;
}

#topleft {
  float:left;
  height:21em;
  width:40%;
}

#topleft a,
#topleft span {
  display:block;
  padding: 2.5em 4em 6em 12em;
}

#topright {
  float:right;
}

#metanav {
  text-align:right;
}

#page {
  padding: 0;
}

#cols {
  width:100%;
  clear:both;
}

#colnav {
  float:left;
  width:18.3em;
}

#colcontent {
  margin-left:20em;
  padding-bottom: 1em;
}

/* Metanavigation */

#metanav ul li {
  display:inline;
  padding: 0.6em 0 0.6em 0.6em;
}

#metanav a {
  color: #cc0c00;
  text-decoration:none;
}

#metanav a:hover, #metanav a:focus, #metanav a:active {
  color: #cc0c00;
  background-color: #fff;
  text-decoration:underline;
}

/* Search  */

#search {
  text-align: right;
  padding-top:2.0em;
  float:right;
}

#search input#searchterm {
  border: 2px solid #818386;
  color: #818386;
  font-size: 1.25em;
  font-family:Verdana;
  vertical-align: top;
  width: 16em;
  margin-right: 0;
  padding: 0.2em 0.3em 0.2em 0.3em;
}

#search input#searchterm:hover,
#search input#searchterm:focus {
  background-color: #f9f9f9;
  color:#000;
}

#search button#searchsubmit {
  background: url('../img/ui/lupe.png') no-repeat 0 0;
  border: none;
  cursor: pointer;
  vertical-align: top;
  width:2.95em;
  height:2.6em;
}

/* --- Navigation --------------------------------------------------------- */

#nav {
  margin-top:1.4em;
}

#nav ul {
  list-style: none;
  overflow:hidden;
  border-top: 1px solid #fcde97;
  margin-bottom: 5em;
}

#nav ul ul, #nav ul ul ul {
  border-top: 0;
  background-color: #FEFBC5;
}

#nav ul li  {
  border-bottom: 1px solid #fcde97;
}



#nav ul li ul {
  margin-bottom:0;
}

#nav ul li ul li {
  border-top: 1px solid #fcde97;
  border-bottom:0;
}

#nav ul li a {
  color:#000;
  background-color:#fff;
  display:block;
  text-decoration: none;
  padding:0.6em 0.6em 0.6em 0.8em;
}

#nav ul li span {
  background-color: #fcef97 !important;
  color:#000;
  display:block;
  text-decoration: none;
  padding:0.6em 0.6em 0.6em 0.8em;
}

#nav ul li.kampagne {
  border-top: 1px solid #fcde97;
  margin-top:5em;
}

#nav ul li.kampagne a,
#nav ul li.kampagne span {
  background: #fff url('../img/ui/kampagne-menu-kl.png') no-repeat right;
  padding:1.2em 100px 1.2em 0.8em;
  font-weight:bold;
}

#nav ul li.kampagne li a,
#nav ul li.kampagne li span {
  background-color: #fefbc5;
  background-image:none;
  padding:0.6em 0.6em 0.6em 0.8em;
  font-weight:normal;
}

#nav ul ul a,
#nav ul ul span {
  padding:0.6em 0.6em 0.6em 2em;
  background:0;
  display:block;
}

#nav ul ul ul a,
#nav ul ul ul span {
  padding:0.6em 0.6em 0.6em 3em;
  background:0;
  display:block;
  font-size:0.9em;
}

/* fuer parent-links im aufgeklappten Zustand des Menues, wenn aktiver Menuepunkt mit <span> versehen ist */

#nav ul a.level1active,
#nav ul ul a.level2active,
#nav ul ul ul a.level3active {
  background-color: #FEFBC5;
  color:#000;
  font-weight:bold;
}

/* ident wie levelxactive, nur noetig, wenn aktive Menuepunkte verlinkt sind statt mit <span> versehen, fuer parent-links

#nav ul a.level1highlight,
#nav ul ul a.level2highlight,
#nav ul ul ul a.level3highlight {
  background-color: #FEFBC5;
  color:#000;
  font-weight:bold;
}
*/

#nav ul li a:hover,
#nav ul li a:active,
#nav ul li a:focus,
#nav ul ul li a.level2active {
  background-color: #FCEF97;
  color:#000;
}

#nav ul li.kampagne a:hover,
#nav ul li.kampagne a.level1active:hover,
#nav ul li.kampagne a:active,
#nav ul li.kampagne a:focus,
#nav ul li.kampagne span {
  color:#000;
  background: #FCEF97 url('../img/ui/kampagne-menu-kl-aktiv.png') no-repeat right;
}

#nav ul li.kampagne a.level1active  {
  color:#000;
  background: #fefbc5 url('../img/ui/kampagne-menu-kl-highlight.png') no-repeat right;
}

#nav ul li.kampagne li a:hover,
#nav ul li.kampagne li a:active,
#nav ul li.kampagne li a:focus,
#nav ul li.kampagne li a.level2active,
#nav ul li.kampagne li span {
  background-image:none;
}


/* Breadcrumbtrail */

#content #breadcrumbs {
  position:absolute;
  font-size:0.9em;
  margin-top:-5em;
}

#content #breadcrumbs ul  li {
  background:transparent url('../img/ui/breadcrumb.gif') no-repeat scroll left 60%;
  float:left;
  padding:0 0.8em;
}

#content #breadcrumbs ul li.firstitem {
  background:transparent none repeat scroll 0 0;
  padding-left:0;
}

#colcontent #breadcrumbs a {
  color:#000;
}

#colcontent #breadcrumbs a:hover, #colcontent #breadcrumbs a:focus, #colcontent #breadcrumbs a:active {
  color:#CC0C00;
}

/* Glossar Menü */

#glossarmenu, #practicemenu {
  margin:0 0 2em 0;
  width:100%;
  float:left;
}

#glossarmenu ul {
  padding:0;
  margin:0;
  font-size:1.0em;
  list-style: none;
  line-height:100%;
  width:100%;
  border-top:1px solid #FCDE97;
  border-bottom:1px solid #FCDE97;
  float:left;
}

#glossarmenu ul li {
  float:left;
  text-align:left;
  background:none !important;
  padding:0  !important;
  margin:0  !important;
}

#glossarmenu a {
  text-decoration: none !important;
  display:block;
  color:#000;
  background-color: #fff;
  font-weight:bold;
  padding:0.4em 0.69em;
  margin:0;
}

#glossarmenu span, #glossarmenu a.level1active {
  text-decoration: none !important;
  display:block;
  color:#000;
  background-color: #FCEF97;
  font-weight:bold;
  padding:0.4em 0.7em;
}


#glossarmenu a:hover, #glossarmenu a:active, #glossarmenu a:focus {
  background-color:#FEFBC5  !important;
  color:#000  !important;
}

/* --- Footer -------------------------------------------------------------- */

#footer {
  clear:both;
  font-size:0.9em;
  margin:1em 0 0 0;
  border-top: 1px solid #d4d4d4;
  padding-top:1em;
}

p.toplink {
  float:right;
}

p.copyright {
  float:left;
}

#footer a {
  color:#CC0C00;
  text-decoration:none;
}

#footer  a:hover,
#footer  a:focus,
#footer  a:active {
  text-decoration:underline;
 }


/* === Special Function Elements =========================================== */

/* --- skiplinks ----------------------------------------------------------- */

#skiplinks {
  width: 74em;
  margin: 0 auto;
  position: relative;
}

#skiplinks p a {
  display: block;
  position: absolute;
  left: -999em;
  overflow: hidden;
  width: 0;
  height: 0;
  background-color: #fff;
  color: #CC0C00;
}

#skiplinks p a:focus,
#skiplinks p a:hover,
#skiplinks p a:active {
  display: block;
  height: auto;
  left: 12em;
  padding: 0.2em 0.5em;
  position: absolute;
  overflow: visible;
  text-decoration:underline;
  top: 0;
  white-space: nowrap;
  width: auto;
  z-index: 100;
}

/* --- hidden elements ----------------------------------------------------- */

.hidden {
  display: block;
  height: 0;
  left: -999em;
  position: absolute;
  overflow: hidden;
  width: 0;
}

.none {
  display:none !important;
}

/* --- clearfix ------------------------------------------------------------ */

.clearfix:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}

.clearfix {display: inline-block;}

/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */