@media all
{
html {background-image:url(../static/bg_html.jpg);height:100%;}
  /* (de) Globales Zurücksetzen der Innen- und Außenabstände für alle HTML-Elemente */
  * { margin:0; padding:0; }

  /* (de) Korrektur:Das Zurücksetzen der Abstände verursacht zu kleine Selectboxen. */
  option { padding-left:0.4em; } 
  select { padding:1px; }

 /* (de) Globale Korrektur des Italics Bugs des IE 5.x und IE 6  */
  * html body * { overflow:visible; }
  * html iframe, * html frame { overflow:auto; }
  * html frameset { overflow:hidden; }

  /* (de) Alle Schriftgrößen auf Standardgröße (16 Pixel) zurücksetzen */
  html * { font-size:100.01%; }

  body {
	/* (de) Beseitigung von Rundungsfehler beim Skalieren von Schriftgrößen in älteren Opera Versionen */
    font-size:100.01%;
	text-align:left;
	/* (de) Basis-Layout erhält Standardschriftgröße von 12 Pixeln */
    font-family:Arial, Helvetica, sans-serif;
	font-size:75.00%;
	color:#333333;
	background-image:url(../static/bg_body.jpg);
	background-repeat:repeat-x;
	border-top:4px solid #006dd2;
	height:100%;
  }

  /* (de) Vermeidung sichtbarer Outline-Rahmen in Webkit-Browsern */
  div { outline:0 none; }

 /* (de) Schriftgröße von monospaced Elemente in allen Browsern auf 16 Pixel setzen */
  textarea, pre, code, kbd, samp, var, tt {
    font-family:Consolas, "Lucida Console", "Andale Mono", "Courier New", Courier;
  }

  /* (de) Rahmen für <fieldset> und <img> Elemente löschen */
  fieldset, img { border:0 solid; }

  /* (de) Neue Standardwerte für Listen & Zitate */
  ul, ol, dl { 
	margin:0 0 1em 0;
	line-height:1.5em;
  } 

  ul ul { margin-bottom:0; }

  ol ol { margin-bottom:0; }

  li {
    line-height:1.5em;
    margin-left:1.5em; 
  }

  dt { font-weight:bold; }
  dd { margin:0; } 

  blockquote { margin:0 0 1em 0.8em; } 


  /*--- Headings | Überschriften ------------------------------------------------------------------------*/
  h1,h2,h3,h4,h5,h6 {
    font-weight:normal;
    margin:0 0 0.25em 0;
    color:#00439a;
  }

  h1 { font-size:140%; font-family: 'Asap', sans-serif;font-weight:400; font-style:italic;}
  h2 { font-size:130%; }
  h3 { font-size:120%; }
  h4 { font-size:100%; }
  h5 { font-size:100%; }
  h6 { font-size:100%; }

  #col3 h1 {
	font-family:Arial, Helvetica, sans-serif;
	font-size:160%;
	font-weight:bold;
}
  
  /* --- general text formatting | Allgemeine Textauszeichnung ------------------------------------------ */
  blockquote { margin:0 0 1em 1.6em; color:#666; }

  strong,b { font-weight:bold; }
  em,i { font-style:italic; }

  acronym, abbr {
    border-bottom:1px #aaa dotted;
    font-variant:small-caps;
    letter-spacing:.07em;
    cursor:help;
  }

  hr {
    color:#fff;
    background:transparent;
    margin:0 0 0.5em 0;
    padding:0 0 0.5em 0;
    border:0;
    border-bottom:1px #eee solid;
  }

  p { line-height:1.5em;  }

  /*--- Links ----------------------------------------------------------------------------------------- */
  a { color:#00439a; text-decoration:none; outline: none;
 }

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

 /* (de) Generische Klassen für die Tabellenbreite und Gestaltungsvorschriften für Tabellen  */
  table { width:auto; border-collapse:collapse; margin-bottom:0.5em; }
  table caption { font-variant:small-caps; }

  th,td { padding:0.1em; vertical-align:top; text-align:left; }
  thead th { }
  tbody th { }

  tbody th {text-align:left; }
  tbody td { }

 /*------------------------------------------------------------------------------------------------------*/

 /* @section clearing methods  */

  .clear {
    clear:both;
    content:".";
    display:block;
    font-size:0;
    height:0;
    visibility:hidden;
  }

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

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

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

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

@media screen, projection
{

  /* (de) Erzwingen vertikaler Scrollbalken in IE8, Firefox, Webkit & Opera */
  body { overflow-y: scroll; }

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

  #head {
	position:relative;
    padding: 0;
	height:245px;
	padding-top:11px;
	background-image:url(../static/bg_head.jpg);
	background-repeat:no-repeat;
	background-position:left top;
  }

  #headerimage {
    	padding: 10px;	
  }
  
    #headerimage img {
	-moz-border-radius:10px;
	-webkit-border-radius:10px;
	border-radius:10px;
  }
  /* (de) Absolute Positionierung erfolgt nur innerhalb von #header */

  #hilfsnav { 	
	position:absolute;
	top:30px;
	right:35px;
	width:auto;
 }

  #hilfsnav a { color: #00439a; font-size:90%; font-weight:bold; background:transparent; text-decoration:none; }
  #hilfsnav a:focus,
  #hilfsnav a:hover,
  #hilfsnav a:active { text-decoration:underline; background-color: transparent; }

  #teaser {
	position:absolute;
	top:55px;
	right:26px;
	padding:12px 10px 10px 65px;
	width:198px;
	height:46px;
	background-image:url(../static/bg_teaser.png);
	background-repeat:no-repeat;
 }

  #teaser h1 {
	color:#c90000;
	font-weight:700;
	font-size:160%;
	font-style:italic;
}

  #teaser a {
	color:#c90000;
	font-weight:bold;
	background-image:url(../static/bg_mehr_lesen.png);
	background-repeat:no-repeat;
	background-position:left 1px;
	padding-left:15px;
}

 #logo {
	position:absolute;
	top:163px;
	right:30px;
	width:auto;
 }

  
  .page_margins {
	text-align:left;
	margin: 0 auto;
	position:relative;
	min-height:100%;
	background-image:url(../static/bg_page.png);
	background-repeat:repeat-y;
}

  /* (de) Layout: Breite, Hintergrund, Rahmen */
  .page_margins {
	width: 990px;
}
  .page {

}

  /* (de) Anpassung der Hauptnavigation */
  #topnav {
	/* (de) Einfassen der Floats im IE */
	overflow:hidden;
	/* (de) Einfassen der Floats in allen anderen Browsern */
    float:left;
	display:inline;
	/* (en|de) Bugfix:IE - collapsing horizontal margins */
    position:absolute;
    width:100%;
	height:49px;
	top:247px;
	left:0;
	background-image:url(../static/bg_topnav.png);
	background-repeat:no-repeat;
	background-position:left top;
	line-height:0;
  }

  #topnav ul {
    margin:0;
    padding:0;
    /* (en|de) Bugfix:IE - Doubled Float Margin Bug */
    display:inline;
    float:left; 
    list-style-type:none;
	padding:8px 20px 8px 10px;
  }

  #topnav ul li {
    /* (en|de) Bugfix:IE - Doubled Float Margin Bug */
    display:inline;
    float:left; 
    margin:0;
    padding:0;
	line-height:33px;
	height:33px;
	background-image:url(../static/bg_topnav_li.png);
	background-repeat:no-repeat;
	background-position:right top;
  }

  #topnav ul li.act {
	background-image:url(../static/bg_topnav_li_act.png);
  }

  #topnav ul li a {
	display:block;
	font-size:110%;
	margin:0;
	padding:0 17px 0 37px;
	text-decoration:none;
	white-space:nowrap;
	color:#333;
	background-image:url(../static/bg_topnav_a.png);
	background-repeat:no-repeat;
	background-position:17px 13px;
  }

  #topnav ul li a:hover,
  #topnav ul li a:active,
  #topnav ul li a.act { 
	text-decoration:none; 
  }
  

  #main {
	  padding:0;
	  width: 100%;
	  float:left;
	  background-image:url(../static/bg_main.png);
	  background-repeat:no-repeat;
	  background-position:10px top;
  }

  #breadcrumb {
	padding-left:27px;
	padding-top:52px;
	padding-bottom:10px;
	color:#a0a0a0;
	font-size:95%;
  }
  
  #breadcrumb a { 
	color:#a0a0a0;
	background-image:url(../static/bg_breadcrumb_a.gif);
	background-repeat:no-repeat;
	background-position:10px center;
	padding-left:15px;
	padding-right:5px;
	text-decoration:none;
  }

  #headline {
	padding-left:27px;
  }
    
  #headline h1 {
	font-size:220%;
	font-family: 'Asap', sans-serif;
	font-style:italic;
	font-weight:400;
  }

  .col1_content h1.csc-firstHeader {
	font-size:220%;
	font-family: 'Asap', sans-serif;
	margin-bottom:20px;
	font-style:italic;
	font-weight:400;
}
    
  .col1_content .box_content h1 {
	font-size:220%;
	font-family: 'Asap', sans-serif;
	margin-bottom:20px;
	font-style:italic;
	font-weight:400;
}
    
  #footer {
  }

  #footer a { color: #999; font-weight: bold; text-decoration:none; }
  #footer a:focus,
  #footer a:hover {text-decoration:underline; }

  /**
   * (de) Formatierung der Inhalts-Container
   *
   * |-------------------------------|
   * | #head                         |
   * |-------------------------------|
   * | #col2   | #col1     | #col3   |
   * | 25%     | 50%       | 25%     |
   * |-------------------------------|
   * | #footer                       |
   * |-------------------------------|
   */

  /* #col1 becomes the middle column | #col1 wird zur mittleren Spalte */
  #col1 {
	width: 460px;
	float:left;
	margin-left: 260px;
}
  #col1_inner {padding-top:8px; padding-bottom:20px;}

  /* #col2 becomes the left column | #col2 wird zur linken Spalte */
  #col2 {
	width: 240px;
	float:left;
	margin-left: -720px;
}
  #col2_inner {padding-top:8px;padding-left:20px;}

  /* #col3 becomes the right column | #col3 wird zur rechten Spalte */
  #col3 {
	float:right;
	width: 250px;
	margin-left: -5px;
	margin-right: 0%;
}
  #col3_inner {padding-top:8px;padding-right:20px;}

  /* in Entwurfsphase auskommentieren */
  #col1_inner, #col2_inner, #col3_inner { position:relative }

  /*------------------------------------------------------------------------------------------------------*/

  #col1 .box_content {
	background-image:url(../static/bg_col1_box_content.jpg);
	background-repeat:no-repeat;
	padding:10px 15px 0 15px;
	}

  #col1 .box_bottom {
	background-image:url(../static/bg_col1_box_bottom.jpg);
	background-repeat:no-repeat;
	height:45px;
	margin-top:-30px;
	}

  .col1_content {padding-bottom:1.5em;}  
  
  #col1 #tx_odsajaxmailsubscription_pi1 input {
	margin-top:5px;
	border:1px solid #333;
	width:166px;
	padding-left:5px;
	float:left;
	height:26px;
	line-height:26px;
	background-color:#fff;
}

  #col1 #tx_odsajaxmailsubscription_pi1 input.absenden {
	width:20px;
	margin-left:8px;
	background-image:url(../static/col1_newsletter_absenden.gif);
	background-repeat:no-repeat;
	border:0px none;
	height:28px;
  }

  #col2_content_inner {}

  .col2_content,
  .col2_content_fest {padding-bottom:15px;}

  .col2_content .box_content {
	background-image:url(../static/bg_col2_box_content.jpg);
	background-repeat:no-repeat;
	padding:8px 15px 0 15px;
	}

  .col2_content .box_bottom {
	background-image:url(../static/bg_col2_box_bottom.jpg);
	background-repeat:no-repeat;
	height:45px;
	margin-top:-30px;
	}
  .col2_content_fest .box_content {
	background-image:url(../static/bg_newsletter_content.jpg);
	background-repeat:no-repeat;
	padding:15px 0 0 7px;
	color:#fff;
  }
  
  .col2_content_fest .box_content h1 {color:#fff;padding-bottom:12px; padding-left:5px;}
  .col2_content_fest .box_content p {padding-left:5px;}  
  
  .col2_content_fest .box_content input {
	margin-top:7px;
	border:0 none;
	font-style:italic;
	color:#fff;
	width:166px;
	padding-left:5px;
	float:left;
	height:26px;
	line-height:23px;
	background-color:#094d8e;
	background-image:url(../static/newsletter_input.jpg);
	background-repeat:no-repeat;
	background-position:left 1px;
}

  .col2_content_fest .box_content input.absenden {
	width:30px;
	margin-left:3px;
	background-image:url(../static/newsletter_absenden.jpg);
	background-repeat:no-repeat;
	height:28px;
	}

  .col2_content_fest .box_bottom {
	background-image:url(../static/bg_newsletter_bottom.jpg);
	background-repeat:no-repeat;
	height:12px;
	clear:both;
}

  .col3_content_aidshilfe {
	padding:8px 10px 8px 10px;
	border-bottom:1px solid #e3e9ed;
}

  .col3_content_aidshilfe a {
	color:#333;
	font-family: 'Asap', sans-serif;
	font-size:140%;
	line-height:26px;
	height:26px;
	background-image:url(../static/deutsche_aidshilfe_link.jpg);
	background-repeat:no-repeat;
	background-position:right center;
	display:block;
}

  .col3_content {
	padding:5px 10px 8px 10px;
  }
  
    	
  /* (de) Absicherung korrekte Positionierung */
  #head, #topnav, #main, #footer { clear:both; }
  
 /*------------------------------------------------------------------------------------------------------*/

 /**
  * @section subtemplates
  * @see     http://www.yaml.de/en/documentation/practice/subtemplates.html
  */
  .subcolumns { width:100%; overflow:hidden; }

  /* (en) alternative class for optional support of old Mozilla/Netscape browers */
  /* (de) Alternative Klasse zur optionalen Unterstützung alter Mozilla/Netscape-Brower */
  .subcolumns_oldgecko { width:100%; float:left; }

  div.cl {float:left; width:50%;}
  div.cr {float:right; margin-left:-5px; width:50%; }

  .c33l, .c33r { width:33.333%; }
  .c50l, .c50r { width:50%; }

  .subc  { padding:0 10px 0 0; }
  .subcl { padding:0 10px 0 0; }
  .subcr { padding:0; }

  .equalize, .equalize .subcolumns { overflow:visible; display:table; table-layout:fixed; }

  .equalize > div {
    display:table-cell;
    float:none; 
    margin:0; 
    overflow:hidden;
    vertical-align:top;
  }

 /*------------------------------------------------------------------------------------------------------*/

/****************************************/
/* navleft */
/****************************************/

#navleft_top {
	width:100%;
	background-image:url(../static/bg_navleft_top.png);
	background-repeat:repeat-y;
	background-position:left top;
	height:8px;
}

#navleft_bottom {
	width:100%;
	background-image:url(../static/bg_navleft_bottom.png);
	background-repeat:repeat-y;
	background-position:left top;
	height:12px;
	margin-bottom:20px;
}

#col2_navleft {
	width:100%;
	background-image:url(../static/bg_navleft.png);
	background-repeat:repeat-y;
	background-position:left top;
}

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

/****************************************/
/* navleft 1.Ebene */
/****************************************/

#col2_navleft  ul li {
	margin: 0;
	padding: 0;
	background-image:url(../static/bg_navleft_li.png);
	background-repeat:no-repeat;
	background-position:left bottom;
  }

#col2_navleft ul li a {
	display:block;
	padding-left:30px;
padding-right:5px;
	text-decoration: none;
	background-image:url(../static/bg_navleft_a.png);
	background-repeat:no-repeat;
	background-position:18px 9px;
	padding-top:6px;
	padding-bottom:8px;
	font-size:110%;
	color:#333;
  }


#col2_navleft  ul li a:hover,  
#col2_navleft  ul li a.act {
	color:#00439a;
	background-image:url(../static/bg_navleft_a_act.png);
  }

/****************************************/
/* navleft 2.Ebene */
/****************************************/
#col2_navleft  ul li ul {
padding-bottom:5px;
}

#col2_navleft  ul li ul li {
	background-image:none;
  }
  
#col2_navleft ul li ul li a {
	padding-left:40px;
	padding-top:3px;
	padding-bottom:5px;
	background-image:none;
font-size:100%;
line-height:1em;
  }

#col2_navleft  ul li ul li a:hover,
#col2_navleft  ul li ul li a.act {
	background-image:none;
  }

/****************************************/
/* navleft 3. und folgende Ebenen       */
/****************************************/

#col2_navleft  ul li ul li ul li {
  }

  
#col2_navleft ul li ul li ul li a {
	padding-left:50px;
  }

#col2_navleft  ul li ul li ul li a.act {
  }

#col2_navleft  ul li ul li ul li ul li {
  }

  
#col2_navleft ul li ul li ul li ul li a {
	padding-left:40px;
  }

#col2_navleft  ul li ul li ul li ul li a.act {
  }


}