@charset "iso-8859-1";

/*
 *	global.css
 *
 *	CSS-Struktur der obersten Ebene und der globalen Eigenschaften
 *
 *	Struktur
 *	<div id="container">
 *		<div id="container-content">
 *			<div id="header"><rs:template name="MainmenuNew" topic="[mainTopic]" /></div>
 *			<div id="subnavigation"><rs:template name="SubmenuNew" topic="[topic]" contentTopic="[submenuTopic]" /></div>
 *			<div id="content"><rs:template name="[templateName]" topic="[contentTopic]" document="[document]" /></div>
 *			<div id="footer"><rs:template name="Footer" topic="[topic]"/></div>
 *		</div>
 *	</div>
 *
 *	Hinweise:
 *		Bei mehrspaltigen Layouts besteht immer das Problem, dass die per div definierten Spalten gleich lang sein sollen,
 *		die div's aber nichts voneinander wissen und eine feste Größe nicht immer vorgegeben werden kann.
 *		Die Lösung funktioniert über das float-Attribut im Eltern-Container. Es scheint sich aber nur der 2. Container dem
 *		Ersten anzupassen, falls dieser länger ist - umgekehrt aber nicht. Hier müssen dann andere Muster (faux-column etc)
 *		herhalten.
 */
 
/* 
 * Übergeordnet 
 */
* {
  margin: 0;
  padding: 0;
  border: none;
}

html, body {
  height: 100%;
}

/* 
 *	Body 
 */
body {
  padding: 0px;
  background-color: #1f88cc; /*#89b6f9;*/
  text-align: center;
  font-family: Verdana, Arial, Helvetica, sans-serif;
  font-size: 12px;
}

/* 
 *	Der gesamte Inhalt wird in einem Container zusammengefasst; 
 *	dies erlaubt z.B. die zentrierte Darstellung auf der Seite
 */
 #container {
  margin-left: auto;
  margin-right: auto;
  margin-top: 0px;
  margin-bottom: 0px;
  width: 916px;
}

/* 
 *	Ein zweiter alles umfassende Container erlaubt z.B.:
 *		- ein zweites Hintergrundbild
 *		- gleich Spaltenlänge von beinhalteten Float-Elementen durch "float" im umgebenden Block
 */
#container-content {
  margin-top:0;
  margin-bottom:0;
  width: 916px;
  float: left;
  overflow: hidden;
  color: #444444;
  text-align: left;
  background: #FFFFFF;
}
 
/* 
 *	Kopfbereich mit Hauptnavigation
 *	in diesem Fall oben über die gesamte Breite
 *	NB: Es wird nur eine Container-Ebene "über alles" benutzt;
 *	  der gesamte Hindergrund muss daher in einem Bild enthalten sein
 *	  Hintergrund wird über CMS als Inline Style gesetzt
 */
#header {
  position: relative;
  width: 916px;
  margin:0;
  padding:0;
	border-bottom: 5px solid #2e4057;
  /* height: set dynamically depending on the bgimage size */
}

/* 
 *	Getrennte Subnavigation 
 *	in diesem Fall links per "float"
 */
#subnavigation {
  margin: 0px 30px 0 0;
  padding: 10px 0 0 0;
  width: 210px;
  height: 100%;
  float: left;
  margin-bottom: -4000px;
  padding-bottom: 4000px;
  background-color: #E7EBED;
  vertical-align: top;
}

/* 
 *	Der eigentliche Inhalt 
 *	in diesem Fall rechts neben der Subnavigation
 */
#content {
  margin: 0 0 0 240px;
  padding: 0 33px 0 0;
  width: 643px !important;
  width /**/: 673px;
  min-height: 900px;
  height:auto !important;  /* for modern Browser */
  height: 900px;  /* for IE */
  line-height: 1.5;
  background-color: #FFFFFF;
  vertical-align: top;
}

/* 
 *	Fußzeile/-bereich 
 */
#footer {
  clear: both;
  margin-top: 20px;
  margin-left: 240px;
  padding: 10px 33px 10px 0px;
  width: 643px !important;
  width /**/: 673px;
  height: 30px;
  vertical-align: middle;
  font-size: 10px;
  background-color: #FFFFFF;
}

/* 
 *	content in a separate window 
 */
#stand_alone_content {
  margin: 20px;
  padding: 10px;
  width: 460px !important;
  width /**/: 480px;
  height: 640px;
  font-size: 11px;
  line-height: 15px;
  background-color: #FFFFFF;
  text-align: left;
  vertical-align: top;
}


/*
 *	clear element
 */
.clear {
  content:".";
  display:block;
  clear:both;
  height:0;
  font-size:0;
  line-height:0;
  visibility:hidden;
  overflow:hidden;
}

/*
 *	Systemweite Definition von HTML-Elementen
 */
/*
    Content - headings
 */
h1, h2, h3, h4 {
  padding: 5px 0;
  color: #666;
  /* font-weight: bold; */
}
h1 {
  font-size: 150%;
}
h2 {
  margin-top: 0;
  font-size: 1.3em;
}
h3 {
  font-size: 1.1em;
}
h4 {
  font-size: 1em;
}

a {
  text-decoration: none;
  color: #444444;
}
a:hover {
  text-decoration: underline;
}
a:active {
  color: #444444;
}
a:visited {
  color: #444444;
}
a img   {
  border: none;
}

img   { border: none; }

img.landscape_small { width: 100px; }
img.landscape_medium { width: 200px; }
img.landscape_large { width: 400px; }
img.landscape_auto { width: auto; height: auto; }

img.portrait_small { width: 75px; }
img.portrait_medium { width: 150px;  }
img.portrait_large { width: 300px; }
img.portrait_auto { width: auto; height: auto; }

p {
  padding: 2px 0 2px 0;
}

table td {
  font-family: Verdana, Arial, Helvetica, sans-serif;
  font-size: 12px;
  font-weight: normal;
  color: #444444;
  text-align: left;
}
#back_button {
  display: block;
  font-size: 11px;
  font-weight: bold;
  letter-spacing: 0.05em;
  margin: 20px 0 0 0;
  padding: 2px 15px;
  background: #e6e6e6;
  border: 1px solid #cccccc;
  cursor: pointer;
}
