/**
 * "Yet Another Multicolumn Layout" - (X)HTML/CSS Framework
 *
 * (en) Template for designing a screen layout
 * (de) Gestaltungsvorlage für die Erstellung eines Screenlayouts
 *
 * @copyright       Copyright 2005-2011, Dirk Jesse
 * @license         CC-A 2.0 (http://creativecommons.org/licenses/by/2.0/),
 *                  YAML-C (http://www.yaml.de/en/license/license-conditions.html)
 * @link            http://www.yaml.de
 * @package         yaml
 * @version         3.3.1
 * @revision        $Revision:392 $
 * @lastmodified    $Date:2009-07-05 12:18:40 +0200 (So, 05. Jul 2009) $
 */

@media screen, projection
{
  /** 
   * (en) Forcing vertical scrollbars in IE8, Firefox, Webkit & Opera 
   * (de) Erzwingen vertikaler Scrollbalken in IE8, Firefox, Webkit & Opera 
   *
   * @workaround
   * @affected IE8, FF, Webkit, Opera
   * @css-for all
   * @valid CSS3
   */

  body { overflow-y:scroll; }

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

 /**
  * Design of the Basic Layout | Gestaltung des YAML Basis-Layouts
  *
  * @section layout-basics
  */

  /* Page margins and background | Randbereiche & Seitenhintergrund */
  body { background: url("../../images/header_bg.jpg") repeat-x; }

  /* Layout:Width, Background, Border | Layout:Breite, Hintergrund, Rahmen */
  .page_margins { width: 1024px; margin: 0 auto; top: 100px; }
  .page{ }

  /* Design of the Main Layout Elements | Gestaltung der Hauptelemente des Layouts */
  #header { height: 100px; width: 1024px; position: absolute; top: -100px; }
   
  #main { height: 100%; }

  #footer { clear: both; }

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

 /**
  * Formatting of the Content Area | Formatierung der Inhaltsbereichs
  *
  * @section layout-main
  */

  #col1 { width: 226px; }
  #col1_content { padding: 0 0 0 22px; z-index: 5; }

  #col2 { width: 226px; }
  #col2_content { padding: 0 20px 0 20px; }

  #col3 { width: 570px; margin: 0 227px 0 227px; }
  #col3_content { padding: 0 90px 35px 40px; overflow: hidden; }


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

 /**
  * Design of Additional Layout Elements | Gestaltung weiterer Layoutelemente
  *
  * @section layout-misc
  */
  
  #logo { position: absolute; left: 20px; top: 20px; }
  #logo img { width: 202px; }
  
  #topnav { position: absolute; right: 16px; bottom: 32px; font-size: 10px; }
  #topnav ul { margin: 0; }
  #topnav ul li { list-style-type: none; float: left; margin-left: 3px; }
  #topnav .seperator { position: relative; top: -1px; left: 0;}

  #nav { position: relative; }
  #nav ul { margin: 0; }
  #nav ul li { list-style-type: none; margin: 0;  line-height: 18px; padding: 0; }
  #nav ul li.active { font-weight: bold; }
  #nav ul li a { line-height: 14px; display: block; margin-right: 20px; border-top: 1px solid #cccccc; padding: 3px 0 3px 0; }
  #nav ul li a:hover { font-weight: bold; }
  #nav ul li.first a { border: none; } 
  #nav ul li.last a { border-bottom: 1px solid #cccccc; } 
  #nav ul li.active a { border-bottom: none; }
  #nav ul li ul li.active { background-color: #333333; }
  #nav ul li ul li a { padding-left: 16px; border: none; font-weight: normal; background: url("../../images/list_square.png") no-repeat 6px 9px; }
  #nav ul li ul li a:hover { font-weight: normal; text-decoration: underline; }
  #nav ul li.last ul li a { border: none; }
  #nav ul li.last ul li.last a { border-bottom: 1px solid #cccccc; }
  #nav ul li ul li.active a { color: #ffffff; font-weight:bold; background: url("../../images/list_square_white.png") no-repeat 6px 9px; }
  #nav ul li ul li.active ul li { padding-left: 10px; background-color: #ecf2fb; position: relative; }
  #nav ul li ul li.active ul li a { color:#003a80; font-weight: normal; background: url("../../images/list_square.png") no-repeat 6px 9px; }
  #nav ul li ul li.active ul li div.single_arrow { background: url("../../images/single_arrow.png") no-repeat 5px 5px #ecf2fb; position: absolute; width: 20px; height: 20px; top: 0px; right: 0px; }
  #nav ul li ul li.active ul li ul { position: absolute; left: 204px; top: 0; width: 204px; display: none; }
  #nav ul li ul li.active ul li ul li { border-bottom: 2px solid #ffffff; border-left: 4px solid #ffffff; }
  #nav ul li ul li.active ul li.active a { font-weight: bold; }
  #nav ul li ul li.active ul li.active ul li a { font-weight: normal; }
  #nav ul li ul li.active ul li.active ul li.active a { font-weight: bold; }
  
  #search { margin: 40px 0 0 0; }
  #search input[type=text] { border: 1px solid #003a80; width: 166px; height: 14px; color: #666666; }
  #search input[type=submit] { cursor: pointer; border: none; background: url("../../images/double_arrow.png") no-repeat; width: 12px; height: 12px; position: relative; top: 3px; left: 2px; }
  #search h3 { margin: 0 0 0.25em 0; }
  
  #quick_access { margin: 43px 0 20px 0; }  
  #quick_access h3 { margin: 0 0 0.25em 0; }
  #quick_access ul { border-top: 2px solid #8e97ca; border-bottom: 2px solid #8e97ca; background-color: #ecf2fb; margin: 0 20px 0 0; padding: 3px 0 3px 0; }
  #quick_access ul li { list-style-type: none; margin: 0 0 0 5px; padding: 3px 0 3px 0; }
  #quick_access ul li.active { font-weight: bold; }
  #quick_access ul li a:hover { text-decoration: underline; }

  #print { position: absolute; top: 0; right: 20px; font-size: 10px; }
    
 /**
  * ------------------------------------------------------------------------------------------------- #
  *
  * Skiplinks 
  *
  * (en) Visual styling for skiplink navigation
  * (de) Visuelle Gestaltung der Skiplink-Navigation
  *
  * @section content-skiplinks
  */
  
  #skiplinks a.skip:focus,
  #skiplinks a.skip:active { 
  color:#fff; 
  background:#333; 
  border-bottom:1px #000 solid;
  padding:10px 0;
  text-decoration:none;
  }  
}