/********************************/
/* Gestaltung des Basis-Layouts */
/********************************/

/* Randbereiche & Seitenhintergrund */
body {
	background: #FFFFFF;
	padding: 0 30px;
	/*color: #E7E7E7; Def. nur wegen Validierungswarnung, keine Verwendung */
	font-family: 'Lucida Grande', 'Lucida Sans Unicode', 'Trebuchet MS', sans-serif;
	font-size: 75%;
	color: black;
    margin-top: 0px;
}

/* Zentrierung des Layouts in alten IE-versionen */
body { text-align: center; }

/* Layout: Breite, Hintergrund, Rahmen */
#page_margins {
	border-top: 10px solid #CCCCCC;
	min-width: 940px;
	max-width: 1100px; /* statt 90em, da font-size 75% nun auf body statt #page */
    margin: 0 auto; /*centers the page */
}

#page {
	margin: 0 0; /* 5px li/re entfernt - buendig (bg weiss) */
}

/* Gestaltung der Hauptelemente des Layouts */

#header {
	/*margin: 28px 0 0 0;
	padding-bottom: 2px; */
	margin-top: 28px;
	margin-bottom: 10px;
	padding-bottom: 2px;
	text-align: left;
}

#header #topnav {
	top: 0px;
	right: 0px;
}

#topnav li {
	float: right;
	margin-left: 10px;
	display: inline;
	border: 1px solid #CCCCCC;
/*	background: url(images/col_gradient.gif) repeat-x left top; */
	/*background: url(images/menu_line.gif) repeat-x left top; */
	background-color: #F7F7F7;
	min-width: 11%;
    padding: 0 5px;
}

#topnav a {
	text-decoration: none;
	color:black;
}

#topbar {
	height: 27px;
	text-align: left;
	font-size: 1.35em;
	line-height: 28px;
	font-weight: bold;
	padding-left: 0.5em;
	background: url(images/col_gradient.gif) repeat-x left top;
	border: 1px solid #CCCCCC;
	color: #4E4E4E;
	margin-bottom: 2px;
}

#navigationbar {
	height: 32px;
	text-align: left;
	padding-left: 0.5em;
	line-height: 32px;
	border-left: 1px solid #CCCCCC;
	border-right: 1px solid #CCCCCC;
	border-bottom: 1px solid #CCCCCC;
	margin-bottom: 7px;
}


#nav {
	/*margin: 0 0 1.3em 0;*/
	margin: 0 0 50px 0;
}

#main {
	border-left: 1px solid #CCCCCC;
	border-right: 1px solid #CCCCCC;
	border-bottom: 1px solid #CCCCCC;
	/* max-width: 1250px; */
}

.contentinfo {
	height: 25px;
	line-height: 25px;
	text-align: left;
	margin-left: 20%;
}


#footer {
	text-align: left;
	border-top: 1px solid #CCCCCC; 
	margin: 0.7em 0 0 0; /* 5px li/re entfernt - buendig (bg weiss) */
	font-style: italic;
	clear: both;
}

#footer ul {
	float: right;
	white-space: nowrap; 
	text-align: right;
}

#footer ul li {
	margin: 0;
	display: inline;
	white-space: nowrap; 
	list-style: none;
}

  /** Formatierung der Inhalts-Container
   * |-------------------------------|
   * | #header                       |
   * |-------------------------------|
   * | #col1   | #col3    				 |
   * | 18%     | flexible 				 |
   * |-------------------------------|
   * | #footer                       |
   * |-------------------------------|
   */

/* Linke Spalte (submenu) */
#col1 {
	width: 18%;
	float: left;
}	

#col1_content {
	border-top: 1px solid #CCCCCC;	
	padding: 38px 0 0.5em 0;
	text-align: left;
	background: url(images/col_gradient.gif) repeat-x left top;
}



/* Mittlere Spalte (content) */
#col3 {
	margin: 0 0 0 18%;
	border-left: 1px solid #CCCCCC;
}

#col3_content {
	min-height: 700px;
	text-align: left;
	margin-left: 10px;
	border-top: 1px solid #CCCCCC;	
	border-left: 1px solid #CCCCCC;
	padding: 38px 24px 0.5em 24px;
	background: url(images/col_gradient.gif) repeat-x left top;
}

#col3_breadcrumbs {
	text-align: left;
	position: relative; top:-32px;
}

#index_site_left {
		float:left;
		width: 65%;
		padding-right: 10px;
		border-right: 1px solid #CCCCCC;
		min-height: 500px;
}

#index_site_right {
		float: right;
		width: 32%;
		padding-left: 10px;
		min-height: 500px;
}


/* Submenu */

 .menu {
    overflow: hidden;
	 padding: 0 4px 0 3px;
    margin: 0;
    list-style-type: none;
  }
  
  .menu ul { 
	  list-style-type: none; 
	  margin:0; 
	  padding: 0;  
  }
  
  .menu li,
  .menu span { 
	  float: left; 
	  width: 100%; 
	  margin:0; 
	  padding: 1px 0 1px; 
	 /* border-bottom: 1px solid #b2b2b2; */ 
  }

  .menu a {
    display: block;
    width: 100%;
    padding: 3px 0px 3px 0;
    text-decoration: none;
    color: #444;
  }


  /* Level 1 */
  .menu li span {
	  display: block; 
	  line-height: 1.3em;
	  padding: 1px 0 2px;
  }
  
  .menu li.active span {
	  padding-bottom: 2px;
  }
  
  .menu li.active {
    padding: 3px 0px 3px 0;
    border-bottom: 1px solid #b2b2b2;
  }
   
  
  .menu li a { 
    padding: 0 4px 0 3px; 
    margin: 0 -4px 0 -3px;
    background: url(/style/images/nav_arrow.gif) no-repeat right; 
    color: #000; 
    line-height: 1.3em;
  }
  
  .menu li a.notree  { 
    background: none !important; 
  }
 
  .menu li.active a {
	  background: #e4e7ec url(/style/images/nav_active_arrow.gif) no-repeat right;
  }
  
  .menu li span.active.notree {
	 color: #073e99;
    padding-bottom: 0;
    background: none !important; 
  } 
  
  .menu li span.active {
    background: #e4e7ec url(/style/images/nav_active_arrow.gif) no-repeat right;
	 color: #073e99;
  } 
  
  .menu li span.active a {
	 color: #073e99;
    background: none !important; 
  } 
  
  .menu li a.active,
  .menu a:hover {
  	color: #073e99;
  }
    
  .menu .active ul {
	  display: block; 
  }

  
  /* Level 2 */
  .menu ul li {
	  border: none; 
	  padding: 0 0 0 2%; 
	  line-height: 1.3em;
	  width: 98%;
  }

  .menu ul li a {
  	background: none !important; 
   padding: 0 4px 0 10px; 
   margin: 0 -4px 0 -4px;
  }
  
  .menu ul li a.active,
  .menu ul li a:hover {
  	color: #073e99; 
  }
  
  .menu ul li span.active.notree {
    color: #073e99;
    padding-bottom: 0;
    background: none !important; 
  }
  
    .menu ul li span.active {
    color: #073e99;
    padding-bottom: 0;
    background: none !important; 
  }


  /* Level 3 */
  .menu ul li ul li {
  	border: none; 
  	padding-left: 4%; 
  	line-height: 1.3em;
  	width: 96%;
  }
  .menu ul li ul li a {
  	background: none !important; 
  }
  .menu ul li ul li a.active,
  .menu ul li ul li a:hover {
  	color: #073e99;
  }
  
  .menu ul li ul li span.active.notree {
    color: #073e99;
    padding-bottom: 0;
    background: none !important; 
  }
  
    .menu ul li ul li span.active {
    color: #073e99;
    padding-bottom: 0;
    background: none !important; 
  }

  /* Level 4 */
  .menu ul li ul li ul li {
  	border: none; 
  	padding-left: 6%; 
  	line-height: 1.3em;
  	width: 94%;
  }
  .menu ul li ul li ul li a {
  	background: none !important; 
  }
  .menu ul li ul li ul li a.active,
  .menu ul li ul li ul li a:hover {
  	color: #073e99;
  }
  
  .menu ul li ul li ul li span.active.notree {
    color: #073e99;
    padding-bottom: 0;
    background: none !important; 
  }


/***************/
/* Links       */
/***************/

a { color: #063675; text-decoration: underline; }

a:link { color: #063675; }
a:active { color: #073E99; }
a:visited { color: #66778A; }
a:hover { color: #073E99; }

a img { border: 0 none; }


/**************************************************/
/* Seiten-Titel, Titel-Foto, Seitenbeschreibung   */
/**************************************************/

div#title_image {
	margin: 0 -12px;
	border-bottom: 1px solid #CCCCCC;
	height: 90px;
	overflow: hidden;
}


/*************************/
/* Ueberschriften        */
/*************************/

h1#page_title { /* nur fuer Content (col3_content) - siehe unten */
	margin: 1em 0 1.5em 0;
	border-bottom: 1px solid #CCCCCC;
	padding: 0 0 0.5em 0;
	color: #32404D;
	font-size: 1.5em;
	font-weight: bold;
}

h1#page_title img#print { /*druck-icon fuer page-title*/
  display:inline;
  float:right;
  margin-top:-1.2em;
  padding-right:0.2em;
}

h1 { /* auch h1 wegen ev. HTML-Verwendung im ZMS */
	margin: 1.1em 0 0.25em 0;
	padding: 0.25em 0;
	color: #495664;
	font-size: 1.4em;
	font-weight: bold;
}

h2 { /* auch h1 wegen ev. HTML-Verwendung im ZMS */
	margin: 1.1em 0 0.25em 0;
	padding: 0.25em 0;
	color: #495664;
	font-size: 1.2em;
	font-weight: bold;
}

h3 {
	margin: 0.9em 0 0.25em 0;
	padding: 0.25em 0;
	color: #32404D;
	font-size: 1.1em;
	font-weight: bold;
	font-style: italic;
}

h4 {
	margin: 0.7em 0 0.25em 0;
	padding: 0.25em 0;
	color: #32404D;
	font-size: 1em;
	font-weight: bold;
}

h5 {
	margin: 0.5em 0 0.25em 0;
	padding: 0.25em 0;
	color: #32404D;
	font-size: 1em;
	font-weight: normal;
}

/* Moeglich ist h1-h6, h6 ist reserviert fuer Seitenbereichsueberschriften bzw. Skip-Links! */

  
/**************************************/
/* Absaetze und Hervorhebung im Text  */
/**************************************/

/* Block-Elemente */
p { margin: 0 0 1em 0; }

p.caption {
	font-style: italic;
}

p.emphasis {
	margin-left: 1.5em;
	margin-right: 2em;
	padding: 0.1em 0.3em;
	background-color: #F7F7F7;
}

blockquote { /* Zitat verwendet fuer Einzug, besser waere p.indent! */
	margin-left: 1.5em;
	margin-right: 2em;
	padding: 0;
}

pre {
	overflow: auto;
	margin-left: 0;
	padding: 0;
	font-family: Monaco, 'Courier New', monospace;
	font-size: 0.9em;
	color: #32404D;
}

/* Inline-Elemente */
em {
	font-style: normal;
	font-weight: bold;
}

strong {
	font-weight: bold;
	background: #EFEFEF;
}

sup {
	font-size: 0.8em;
	vertical-align: super;
	line-height: 70%;
}

sub {
	font-size: 0.8em;
	vertical-align: sub;
	line-height: 70%;
}

abbr, acronym { border-bottom: 1px dotted #000000; }

code {
	font-family: Monaco, 'Courier New', monospace;
	font-size: 0.9em;
	color: #32404D;
}

/**************************/
/* Team-Seiten, Institute */
/**************************/

ul.institutes {
	font-style: italic;
	float: left;
	padding-left: 0px;

}

ul.institutes li {
	list-style-type: square;
}

ul#team, ul#team.alphabetical {
	margin: 0.7em 0 1.5em 0;
	padding: 0;
	width: 100%;
}

ul#team li {
	margin: 0;
	padding: 0;
	list-style-type: none;
}

ul#team li h2 {
	margin: 0;
	border-bottom: 1px solid #808080;
	padding: 0.1em 0.3em 0 0.3em;
	background-color: #DCE0E6;
	color: #32404D;
	font-size: 1em;
	font-weight: normal;
}

ul#team li ul.team_group, ul.team_group {
	margin: 0;
	padding: 0;
}

ul.team_group {
	margin: 1em 0;
}

ul#team li ul.team_group li, ul.team_group li, ul#team.alphabetical li {
	border-bottom: 1px solid #FFFFFF;
	/* background: #F7F7F7; */ /* vertikale Linie per url(/fs_resources/img/dot.gif) repeat-y 50% top geht nicht, da an verschiedener Position je nach Fensterbreite */
}

ul#team li ul.team_group li div.team_employee, ul.team_group li div.team_employee, ul#team.alphabetical li div.team_employee {
	margin: 0;
	width: 45.5%;
	float: left;
	background: none;
}

div.team_employee {
	margin: 1em 0 2em 0;
	padding: 1em;
	background: #F7F7F7;
}

div.team_employee img {
	float: left;
	margin-right: 0.8em;
	margin-bottom: 0.3em;
	background-color: #EEEEEE;
}

div#col3_content div.team_employee p {
	margin: 0;
	line-height: 1.2em;
}


/***************/
/* Tabellen    */
/***************/

table, table.ZMSTable, table.long, table.rowgroup {
	margin: 0 0 1em 0; /*Abstand oben wurde herausgenommen, da er ansonsten einen Abstand zwischen der Tabelle mit Tabreitern verursacht.*/
	padding: 0;
	width: 100%;
	font-size: 100%;
}

caption {
	position: relative; /* Noetig, sonst Anzeigefehler! Pos. Browser-abhaengig! */
	caption-side: bottom; /* Verhinderung v. problematischer Ausrichtung left/right! */
	margin-top: 0;
	margin-bottom: 1.2em;
	padding-left: 0.5em;
	text-align: left;
	vertical-align: top;
	font-size: 1.0em;
	font-style: italic;
	
}

th, tr.even th, table.ZMSTable th { /* table.ZMSTable th, um Style aus zms.css zu ueberschreiben - noch noetig? */
	border-bottom: 1px solid #808080;
	padding: 0.1em 0.3em 0 0.3em;
	background-color: #DCE0E6;
	font-weight: normal;
	text-align: left;
	vertical-align: bottom;
}

th p, td p { margin: 0; }

td, tr.even td, tr.odd td {
	background-color: #FAFAFA; 
	padding: 0.1em 0.3em 0.1em 0.3em;
	vertical-align: top;
}

/* Tabellen mit alternierenden Zeilenfarben (fuer lange Tabellen in spez. Objekten) */
table.long tr.odd td {
	background-color: #FAFAFA;
	color: #000000;	
}

table.long tr.even td, .darkcell { /* .darkcell wegen Webshop */
	background-color: #F0EDED;
	color: #000000;	
}

table.long tr:hover.even td, table.long tr:hover.odd td {
	background-color: #DCE0E6; /* allgemein wegen unerwuenschtem Effekt im VKAL auskommentiert */ 
}

/* Zeilengruppen-Tabellen (in spez. Objekten) */
th.rowgroup {
	border-top: 0 none;
	border-bottom: 1px solid #DCE0E6;
	border-left: 0.5em solid #DCE0E6;
	padding: 0.1em 0.7em 0 0.7em;
	background-color: #EEF2F2;
	color: #32404D;
	font-weight: normal;
}


/**************************************************/
/* Uebersicht (Seitenelement Zweigverzeichnis)    */
/**************************************************/

ul.toc {
	margin: 0.8em 0 1.8em 0;
	border-bottom: 1px solid #CCCCCC;
	padding: 0 0 0.5em 0;
}

ul.toc li {
	margin: 2.5em 0 0 0;
	padding: 0;
	list-style: none;
}

ul.toc li.first {
	margin-top: 0;
}

ul.toc li h3 {
	position: relative;
	margin: 0;
	border-bottom: 1px solid #CCCCCC;
	padding: 0 0.5em 0 0;
}

ul.toc li h3 span {
	position: absolute;
	left: 0;
	bottom: 0;
	width: 33%;
	height: 1.4em;
	overflow: hidden;
	background-color: #ECECEC;
}

ul.toc li h3 a {
	margin-bottom: 0.1em;
	margin-left: 35.3%;
	display: block;
	text-decoration: none;
	font-style: normal;
	line-height: 1.2em;
}

ul.toc li h3 a:hover {
	text-decoration: underline;
}

ul.toc li p {
	width: 33%;
	float: left;
	margin-top: 0.2em;
	margin-bottom: 0.3em;
}

#col3_content ul.toc li p {
	line-height: 1.3em;
}

ul.toc li.notree p {
	width: 100%;
}

ul.toc li ul {
	margin-left: 35%;
	display: block;
}

ul.toc li ul li {
	margin: 0.2em 0 0 0;
	padding: 0;
	list-style-type: none;
	line-height: 1.2em;
}


 /**
  * @section clearing methods
  * @see     http://yaml.de/en/documentation/basics/general.html
  */

  /* (en) clearfix method for clearing floats */
  /* (de) Clearfix-Methode zum Clearen der Float-Umgebungen */
   .clearfix:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
  }

  /* (en) essential for Safari browser !! */
  /* (de) Diese Angabe benötigt der Safari-Browser zwingend !! */
  .clearfix { display: block; }

  /* (en) overflow method for clearing floats */
  /* (de) Overflow-Methode zum Clearen der Float-Umgebungen */
  .floatbox { overflow:hidden; }

  /* (en) IE-Clearing: Only used in Internet Explorer, switched on in iehacks.css */
  /* (de) IE-Clearing: Benötigt nur der Internet Explorer und über iehacks.css zugeschaltet */
  #ie_clearing { display: none; }