/* ================================== */
/*  Kooperation bringts CSS : Layout Styles  */
/* ================================== */

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

body {
  background: #334143 url(../img/body-bg.png) repeat-x 0 0;
  font: 0.75em/1.5 Verdana, Tahoma, Arial, Helvetica, sans-serif;
  padding-bottom:2.75em;
}

#pagecenter {
  width: 71.5em;
  margin: 0 auto;
  background-color: #f6f7f7;
  color:#62656b;
  padding-bottom:0.5em;
}


#top {
	padding: 1.6em 2.45em 1.2em 2.45em;
}

#topleft {
	float:left;
}

#topleft p {
	font-size:1.2em;
}

#search {
	float:right;
}

#page {
	margin: 0 2.45em;
	background-color: #fff;
	color:#62656b;
	padding: 1.8em 2em;
}

#header {	
	background-color: #e96a00;
	color:#fff;
	border-bottom:1px solid #fff;
	position:relative;
}

#headerimage {
	background-color: #464747;
	float:left;
	width:41.75em;
	height:12.6em;
	border-right:1px solid #fff;
}

#startseite #headerimage {
	float:left;
	width:31em;
	height:19.08em;
	border-right:1px solid #fff;
}

#headerimage img {
	width:41.75em;
	height:12.6em;
}

#startseite #headerimage img {
	width:31em;
	height:19.08em;
}

#headertext {
	position:absolute;
	left:1em;
	bottom:1.8em;
	width:26em;
}

#headertext h2 {
	font-size: 1.6em;
	font-weight:normal;
	display:inline;
	background: url(../img/plus-grau-trans.png) no-repeat right top;
	padding-right:1em;	
}

#headertext blockquote {
	font-size:0.9em;
	margin-top:0.5em;	
}

#headertext cite {
	float:right;
	width:18em;
	font-size: 0.9em;
	color: #DE7402;
	font-style: normal;
	margin-top:1em;
}

#startseite #headertext cite {
  float: left;
  margin-left: 1.5em;
}

#headercontrols {
	position:absolute;
	left:0;
	top:0;		
}

a#startanimation {
	display:block;
	width:21px;
	height:21px;
	background: url(../img/play-button.png) no-repeat;
	position:absolute;
	left:1em;
	top:1em;
}

a#stopanimation {
	display:block;
	width:21px;
	height:21px;
	background: url(../img/stop-button.png) no-repeat;
	position:absolute;
	left:28em;
	top:16em;
}

#headernav {
	background: url(../img/orange-bg.png) no-repeat;	
	margin-left:31.01em;	
	padding:0.8em;	
	height:10.6em;
}

#mainnav {
	background-color: #6a7171;
	color: #fdf8ef;
	float:left;
	width:100%;
	border-bottom:1px solid #fff;	
}

#cols {
  background: #E96A00 url(../img/orange-bg-unten.png) no-repeat bottom right; 
  width:100%; 
  clear:left; 
}

#colnav {  	
	margin-left:41.85em;	
}

#startseite #colnav {  	
	margin-left:31.1em;	
}


#colcontent { 
  background: #fff;  
  padding-bottom: 1em;  
  float:left;
  width:41.85em; 
  min-height:48em; 
}

#startseite #colcontent { 
   width:31.1em;
	min-height:68em; 
}

/* --- Search ------------------------------------------------------------ */

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

#search label {
  font-size: 1.0em;
  color: #F6F7F7;
  vertical-align: middle;
}

#search input#searchterm {
  border: 1px solid #6A7171;
  color: #62656b;
  font-size: 1.1em;
  vertical-align: middle;
  width: 16em;
  margin: 0 0.2em;
  padding:0.1em;
}

#search input#searchterm:hover, 
#search input#searchterm:focus {
  border: 1px solid #6A7171;
} 

#search button#searchsubmit {
  background: url(../img/lupe.png) no-repeat 0 0;
  border: none;
  cursor: pointer; 
  padding: 0.7em;
  vertical-align: middle;
  width:1.7em;
  height:1.7em;
}


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


#headernav ul li a {
  display: block;
  padding:0.1em 0 0.2em 1.2em;  
  color: #fff;
  text-decoration: none;
  font-size:1.2em;  
}

#headernav ul li a:hover,
#headernav ul li a:focus,
#headernav ul li a:active, 
#headernav ul li a.active {
  background: url(../img/plus.png) no-repeat center left;  
 }

#mainnav ul {
	list-style: none;
}

#mainnav li {
	float:left;	
	position:relative;
	padding: 0 1.5em 0 4.5em;
}

#mainnav li a, #mainnav li span {
	padding:0.28em 0 0.22em 0;
	display:block;
	text-decoration:none;
	color: #fdf8ef;	
	margin-bottom:0.25em;
}

 #mainnav li a:hover, #mainnav li a:focus, #mainnav li a:active, #mainnav li a.active, #mainnav li span {
	text-decoration:underline;	
}

#mainnav img {
	position:absolute;
	left: 1.5em;
	top:0.25em;
	width:2.6em;
	height:2.6em;	
}



/* --- Subnavigation ---------------------------------------------------------------- */

#nav {  
  background: #464747;
  padding: 2.1em 1em 2.5em 1em;  
}

#startseite #nav {  
  padding: 2em 1.5em 2.5em 2em;  
}


#nav h3 {
  color: #de7402;  
  font-size: 1.5em;
  margin-bottom:0.5em;
  font-weight:normal;  
}

#startseite #nav h3 {  
  font-size: 2.0em;
  margin-bottom:0.5em;  
}

#nav p {
  color:#fff;
  margin-bottom:1em;
}

#nav ul {
	list-style:none;
}

#nav ul li a, #nav ul li span {
  color: #FCECD3;
  display: block;
  padding:0.4em 0.3em 0.4em 1.7em;
  text-decoration: none; 
  background: url(../img/plus-grau-bg.png) no-repeat 0 0.6em;   
}

#nav ul li a:hover,
#nav ul li a:focus,
#nav ul li a:active,
#nav ul li a.active,
#nav ul li span
 {
  text-decoration:underline;
 }

#nav ul li span, #nav ul li a.active {
	color: #DE7402;
} 
 
#subnav {
	color: #3C3B36;
	color: #fff;
	padding: 2.1em 1em 2.5em 1em;
}

#subnav .badgeBox {
  background: #e55F00 url(../img/badgebox-bg.png) repeat-x scroll left top;
  border:1px solid #D15100; /*fcc99e*/
  margin-bottom: 1.5em;
  margin-top: 1.5em;
  padding-top: 3.2em;
  position: relative;
}

#subnav .badge {
  height: 50px;
  left: -10px;
  position: absolute;
  top: -15px;
  width: 50px;
}

#subnav .thema {
  background: transparent url(../img/thema.png) no-repeat left top;
}

#subnav .info {
  background: transparent url(../img/info.png) no-repeat left top;
}

#subnav .play {
  background: transparent url(../img/play.png) no-repeat left top;
}

#subnav h3 {  
  font-size: 1.1em;
  margin:0 0.5em 1em 1.2em;
  font-weight:bold; 
}

#subnav p {
	margin:0 1em 1.5em 1.5em;	
}

#subnav ul {
	list-style:none;
	margin-bottom:2em;
}

#subnav ul li a, #subnav ul li span {
  color: #fff;
  display: block;
  padding:0.5em 0.3em 0.5em 1.5em;
  text-decoration: underline;
}

#subnav ul li a:hover,
#subnav ul li a:focus,
#subnav ul li a:active,
#subnav ul li span {
  text-decoration:underline;
  color: #222;
 }

 #subnav a {
 	color: #fff;  	
  	text-decoration: underline;
 }
 
#subnav a:hover,
#subnav a:focus,
#subnav a:active {
  text-decoration:underline;
  color: #222;
 } 
 
 
#tools {
	color: #3C3B36;
	color: #fff;
	padding: 1.5em 1.5em 1.5em 2em;
}

#tools h3 {  
  font-size: 2.0em;
  margin-bottom: 0.3em;
  font-weight:normal;
}

#tools ul {
	list-style:none;
}

#tools ul li a {
  color: #fff;
  display: block;
  padding:0.3em 0.3em 0.3em 1.5em;
  text-decoration: none;
  font-size:1.2em;
  background: url(../img/plus.png) no-repeat 0 0.6em;   
}

#tools ul li a:hover,
#tools ul li a:focus,
#tools ul li a:active {
  text-decoration:underline;
 }
 
/* --- Content  ------------------------------------------------------------ */

#content {
	padding: 2em 2.5em 2.5em 0.9em;
}

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

#footer {	
	clear:both;
	text-align:right;
	position:relative;	
	margin: 1em 2.4em 1em 1.3em;
}

#footer ul { 
	list-style:none;
	float:left;
	margin:1.8em 0 0 0;
}

#footer ul li {
  display:inline; 
}

#footer a, #footer span {
  color:#62656b;  
  padding:0.3em 0 0.3em 1.2em;
  text-decoration: none; 
}

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

#ubitlogo {
	/*position:absolute;
	top:-9em;
	right:3em;	*/
	float:right;
	
}


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

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

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

#skiplinks p a {
  display: block;
  height: 0;
  left: -999em;
  position: absolute;
  overflow: hidden;
  top: -999em;
  width: 0;
  background-color: #f6f7f7;
  color: #62656b;
}

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

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

.hidden, #zieleform label, #partnerform label, #selbstpruefungform label {
  display: block;
  height: 0;
  left: -999em;
  position: absolute;
  overflow: hidden;
  top: -999em;
  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 */