@charset "UTF-8";
/**
 * "Yet Another Multicolumn Layout" - (X)HTML/CSS Framework
 *
 * (en) YAML core stylesheet
 * (de) YAML Basis-Stylesheet
 *
 * Don't make any changes in this file!
 * Your changes should be placed in any css-file in your own stylesheet folder.
 *
 * @copyright       Copyright 2005-2007, 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.0.4
 * @revision        $Revision: 135 $
 * @lastmodified    $Date: 2007-10-15 21:34:35 +0200 (Mo, 15 Okt 2007) $
 */

@media all
{
 /*------------------------------------------------------------------------------------------------------*/

 /**
  * @section browser reset
  * @see     http://www.yaml.de/en/documentation/css-components/base-stylesheet.html
  */

  /* (en) Global reset of paddings and margins for all HTML elements */
  /* (de) Globales Zurücksetzen der Innen- und Außenabstände für alle HTML-Elemente */
  * { margin:0; padding: 0 }

  /* (en) Correction: margin/padding reset caused too small select boxes. */
  /* (de) Korrektur: Das Zurücksetzen der Abstände verursacht zu kleine Selectboxen. */
  option { padding-left: 0.4em }

 /**
  * (en) Global fix of the Italics bugs in IE 5.x and IE 6
  * (de) Globale Korrektur des Italics Bugs des IE 5.x und IE 6
  *
  * @bugfix
  * @affected   IE 5.x/Win, IE6
  * @css-for    IE 5.x/Win, IE6
  * @valid      yes
  */
  * html body * { overflow:visible; }
  * html iframe, * html frame { overflow:auto; }
  * html frameset { overflow:hidden; }

  /* (en) Forcing vertical scrollbars in Netscape, Firefox and Safari browsers */
  /* (de) Erzwingen vertikaler Scrollbalken in Netscape, Firefox und Safari Browsern */
  html { height: 100%; margin-bottom: 1px; }
  body {
    /* (en) Fix for rounding errors when scaling font sizes in older versions of Opera browser */
    /* (de) Beseitigung von Rundungsfehler beim Skalieren von Schriftgrößen in älteren Opera Versionen */
    font-size: 100.01%;

    /* (en) Standard values for colors and text alignment */
    /* (de) Vorgabe der Standardfarben und Textausrichtung */
    color: #000;
    background: #fff;
    text-align: left;
  }

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

  /* (en) new standard values for lists, blockquote and cite */
  /* (de) Neue Standardwerte für Listen & Zitate */
  ul, ol, dl { margin: 0 0 1em 1em }
  li { margin-left: 1.5em; line-height: 1.5em; }

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

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

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

 /**
  * @section base layout | Basis Layout
  * @see     http://www.yaml.de/en/documentation/css-components/base-stylesheet.html
  *
  * |-------------------------------|
  * | #header                       |
  * |-------------------------------|
  * | #col1   | #col3     | #col2   |
  * | 200 px  | flexible  | 200px   |
  * |-------------------------------|
  * | #footer                       |
  * |-------------------------------|
  */

  #header { position:relative }

  #topnav {
    position:absolute;
    top: 10px;
    right: 10px;

    /* (en) essential for correct alignment in Opera 6 ! */
    /* (de) Erforderlich, damit im Opera 6 wirklich rechts plaziert ! */
    text-align: right;
  }

  /* (en) Backup for correct positioning */
  /* (de) Absicherung korrekte Positionierung */
  #header, #nav, #main, #footer { clear:both; }

  /* (en/de) Standard: 200 Pixel */
  #col1 { float: left; width: 200px }
  /* (en/de) Standard: 200 Pixel */
  #col2 { float:right; width: 200px }
  /* (en) Standard: center column with flexible width */
  /* (de) Standard: Flexible mittlere Spalte */
  #col3 { width:auto; margin: 0 200px }

  /* (en) Adjustment: sort #col3 behind float columns using z-index */
  /* (de) Anpassung: #col3 mittels z-index hinter die float-Spalten verschieben */
  #col1 {z-index: 3}
  #col2 {z-index: 5}
  #col3 {z-index: 1}
  #col1_content {z-index: 4}
  #col2_content {z-index: 6}
  #col3_content {z-index: 2}

  #col1_content, #col2_content, #col3_content { position:relative }

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

 /**
  * @section generic classes for layout switching | Generische Klassen zur Layoutumschaltung
  * @see     http://www.yaml.de/en/documentation/css-components/base-stylesheet.html
  *
  * .hidecol1 -> 2-column-layout (using #col2 and #col3)
  * .hidecol2 -> 2-column-layout (using #col1 and #col3)
  * .hideboth -> single-column-layout (using #col3)
  */

  .hideboth #col3 {margin-left: 0; margin-right: 0}
  .hidecol1 #col3 {margin-left: 0; margin-right: 200px}
  .hidecol2 #col3 {margin-left: 200px; margin-right: 0}

  .hideboth #col1, .hideboth #col2 {display:none}
  .hidecol1 #col1 {display:none}
  .hidecol2 #col2 {display:none}

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

 /**
  * @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 }

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

 /**
  * @section subtemplates
  * @see     http://www.yaml.de/en/documentation/practice/subtemplates.html
  */

  .subcolumns, .subcolumns_oldgecko {
    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 { float:left }

  .c50l, .c25l, .c33l, .c38l, .c66l, .c75l, .c62l {float: left; }
  .c50r, .c25r, .c33r, .c38r, .c66r, .c75r, .c62r {float: right; margin-left: -5px; }

  .c25l, .c25r { width: 25% }
  .c33l, .c33r { width: 33.333% }
  .c50l, .c50r { width: 50% }
  .c66l, .c66r { width: 66.666% }
  .c75l, .c75r { width: 75% }
  .c38l, .c38r { width: 38.2% }
  .c62l, .c62r { width: 61.8% }

  .subc  { padding: 0 0.5em }
  .subcl { padding: 0 1em 0 0 }
  .subcr { padding: 0 0 0 1em }

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

 /**
  * @section hidden elements | Versteckte Elemente
  * @see     http://www.yaml.de/en/documentation/basics/skip-links.html
  *
  * (en) skip links and hidden content
  * (de) Skip-Links und versteckte Inhalte
  */

  /* (en) classes for invisible elements in the base layout */
  /* (de) Klassen für unsichtbare Elemente im Basislayout */
  .skip, .hideme, .print {
    position: absolute;
    top: -1000em;
    left: -1000em;
    height: 1px;
    width: 1px;
  }

  /* (en) make skip links visible when using tab navigation */
  /* (de) Skip-Links für Tab-Navigation sichtbar schalten */
  .skip:focus, .skip:active {
    position: static;
    top: 0;
    left: 0;
    height: auto;
    width: auto;
  }
}

/* import screen layout | Screen-Layout einbinden */
/**
 * "Yet Another Multicolumn Layout" - (X)HTML/CSS framework
 * (en) stylesheet for screen layout
 * (de) Stylesheet für das Bildschirm-Layout
 *
 * @creator     YAML Builder V1.0 beta1 (http://builder.yaml.de)
 * @file        basemod.css
 */

@media all
{
  /*-------------------------------------------------------------------------*/

  /* (en) Marginal areas & page background */
  /* (de) Randbereiche & Seitenhintergrund */
  body { background: #3b69ad none; padding: 10px 0; }

  /* Layout Alignment | Layout-Ausrichtung */
  #page_margins { margin: 0 auto; }

  /* Layout Properties | Layout-Eigenschaften */
  #page_margins { width: 1000px; background: #fff; }
  #page { padding: 10px 15px 10px 10px; }
  #header { padding: 45px 2em 1em 20px; color: #000; background: #fff; }
  #topnav { color: #aaa; background: transparent; }
  
  .homepage td { border: 0 !important; vertical-align: top; }
  
  /* Tabs */
  .ui-helper-hidden { display: none; }
  .ui-helper-hidden-accessible { position: absolute; left: -99999999px; }
  .ui-helper-reset { margin: 0; padding: 0; border: 0; outline: 0; line-height: 1.3; text-decoration: none; font-size: 100%; list-style: none; }
  .ui-helper-clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
  .ui-helper-clearfix { display: inline-block; }
  * html .ui-helper-clearfix { height:1%; }
  .ui-helper-clearfix { display:block; }
  .ui-helper-zfix { width: 100%; height: 100%; top: 0; left: 0; position: absolute; opacity: 0; filter:Alpha(Opacity=0); }
  .ui-state-disabled { cursor: default !important; }
  .ui-icon { display: block; text-indent: -99999px; overflow: hidden; background-repeat: no-repeat; }
  .ui-widget-overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
  .ui-widget input, .ui-widget select, .ui-widget textarea, .ui-widget button { font-family: Verdana,Arial,sans-serif; font-size: 1em; }
  .ui-widget-content { background: #ffffff url(../gfx/tabs/ui-bg_flat_75_ffffff_40x100.png) 50% 50% repeat-x; color: #222222; }
  .ui-widget-header a { color: #222222; }
  .ui-state-default, .ui-widget-content .ui-state-default { border: 1px solid #d3d3d3; background: #e6e6e6 url(../gfx/tabs/ui-bg_glass_75_e6e6e6_1x400.png) 50% 50% repeat-x; color: #555555; outline: none; }
  .ui-state-default a, .ui-state-default a:link, .ui-state-default a:visited { color: #336699; text-decoration: none; outline: none; }
  .ui-state-hover, .ui-widget-content .ui-state-hover, .ui-state-focus, .ui-widget-content .ui-state-focus { border: 1px solid #999999; background: #dadada url(../gfx/tabs/ui-bg_glass_75_dadada_1x400.png) 50% 50% repeat-x; color: #336699; outline: none; }
  .ui-state-hover a, .ui-state-hover a:hover { color: #336699; text-decoration: none; outline: none; }
  .ui-state-active, .ui-widget-content .ui-state-active { border: 1px solid #aaaaaa; background: #ffffff url(../gfx/tabs/ui-bg_glass_65_ffffff_1x400.png) 50% 50% repeat-x; color: #336699; outline: none; }
  .ui-state-active a, .ui-state-active a:link, .ui-state-active a:visited { color: #336699; outline: none; text-decoration: none; }
  .ui-state-highlight, .ui-widget-content .ui-state-highlight {border: 1px solid #fcefa1; background: #fbf9ee url(../gfx/tabs/ui-bg_glass_55_fbf9ee_1x400.png) 50% 50% repeat-x; color: #363636; }
  .ui-state-highlight a, .ui-widget-content .ui-state-highlight a { color: #363636; }
  .ui-state-error, .ui-widget-content .ui-state-error {border: 1px solid #cd0a0a; background: #fef1ec url(../gfx/tabs/ui-bg_glass_95_fef1ec_1x400.png) 50% 50% repeat-x; color: #cd0a0a; }
  .ui-state-error a, .ui-widget-content .ui-state-error a { color: #cd0a0a; }
  .ui-state-error-text, .ui-widget-content .ui-state-error-text { color: #cd0a0a; }
  .ui-state-disabled, .ui-widget-content .ui-state-disabled { opacity: .35; filter:Alpha(Opacity=35); background-image: none; }
  .ui-priority-secondary, .ui-widget-content .ui-priority-secondary { opacity: .7; filter:Alpha(Opacity=70); }
  .ui-icon { width: 16px; height: 16px; background-image: url(../gfx/tabs/ui-icons_222222_256x240.png); }
  .ui-widget-content .ui-icon {background-image: url(../gfx/tabs/ui-icons_222222_256x240.png); }
  .ui-widget-header .ui-icon {background-image: url(../gfx/tabs/ui-icons_222222_256x240.png); }
  .ui-state-default .ui-icon { background-image: url(../gfx/tabs/ui-icons_888888_256x240.png); }
  .ui-state-hover .ui-icon, .ui-state-focus .ui-icon {background-image: url(../gfx/tabs/ui-icons_454545_256x240.png); }
  .ui-state-active .ui-icon {background-image: url(../gfx/tabs/ui-icons_454545_256x240.png); }
  .ui-state-highlight .ui-icon {background-image: url(../gfx/tabs/ui-icons_2e83ff_256x240.png); }
  .ui-state-error .ui-icon, .ui-state-error-text .ui-icon {background-image: url(../gfx/tabs/ui-icons_cd0a0a_256x240.png); }
  .ui-corner-tl { -moz-border-radius-topleft: 4px; -webkit-border-top-left-radius: 4px; }
  .ui-corner-tr { -moz-border-radius-topright: 4px; -webkit-border-top-right-radius: 4px; }
  .ui-corner-bl { -moz-border-radius-bottomleft: 4px; -webkit-border-bottom-left-radius: 4px; }
  .ui-corner-br { -moz-border-radius-bottomright: 4px; -webkit-border-bottom-right-radius: 4px; }
  .ui-corner-top { -moz-border-radius-topleft: 4px; -webkit-border-top-left-radius: 4px; -moz-border-radius-topright: 4px; -webkit-border-top-right-radius: 4px; }
  .ui-corner-bottom { -moz-border-radius-bottomleft: 4px; -webkit-border-bottom-left-radius: 4px; -moz-border-radius-bottomright: 4px; -webkit-border-bottom-right-radius: 4px; }
  .ui-corner-right {  -moz-border-radius-topright: 4px; -webkit-border-top-right-radius: 4px; -moz-border-radius-bottomright: 4px; -webkit-border-bottom-right-radius: 4px; }
  .ui-corner-left { -moz-border-radius-topleft: 4px; -webkit-border-top-left-radius: 4px; -moz-border-radius-bottomleft: 4px; -webkit-border-bottom-left-radius: 4px; }
  .ui-corner-all { -moz-border-radius: 4px; -webkit-border-radius: 4px; }
  .ui-widget-overlay { background: #aaaaaa url(../gfx/tabs/ui-bg_flat_0_aaaaaa_40x100.png) 50% 50% repeat-x; opacity: .30;filter:Alpha(Opacity=30); }
  .ui-widget-shadow { margin: -8px 0 0 -8px; padding: 8px; background: #aaaaaa url(../gfx/tabs/ui-bg_flat_0_aaaaaa_40x100.png) 50% 50% repeat-x; opacity: .30;filter:Alpha(Opacity=30); -moz-border-radius: 8px; -webkit-border-radius: 8px; }
  .ui-tabs { padding: 2px; zoom: 1; border-bottom: 1px solid #B1B3B4}
  .ui-tabs .ui-tabs-nav { list-style: none; position: relative; padding: .2em .2em 0; }
  .ui-tabs .ui-tabs-nav li { position: relative; float: left; border-bottom-width: 0 !important; margin: 0.2em 0.2em -3px 0; padding: 0; }
  .ui-tabs .ui-tabs-nav li a { float: left; text-decoration: none; padding: .5em 1em; }
  .ui-tabs .ui-tabs-nav li.ui-tabs-selected { padding-bottom: 1px; border-bottom-width: 0; }
  .ui-tabs .ui-tabs-nav li a, .ui-tabs.ui-tabs-collapsible .ui-tabs-nav li.ui-tabs-selected a { cursor: pointer; } /* first selector in group seems obsolete, but required to overcome bug in Opera applying cursor: text overall if defined elsewhere... */
  .ui-tabs .ui-tabs-panel { padding: 1em 1.4em; display: block; border-width: 0; background: none; border: 1px dotted #CCCCCC; }
  .ui-tabs .ui-tabs-hide { display: none !important; }
  
  #main { margin: 10px 0; background: #fff; }
  #footer { padding: 10px 20px; color:#666; background: #f9f9f9; border-top: 5px #efefef solid; }

  #nav { padding-top: 10px; }
  #nav ul { margin-left: 160px; }
  #nav ul { font-weight: 700; }
  
  .box { border: 1px solid #B1B3B4; padding: 10px; }

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

  /**
   * (en) Formatting content container
   * (de) Formatierung der Inhalts-Container
   *
   */

  #col1 { float: left; width: 220px}
  #col2 { display:none}
  #col3 { width: auto; margin: 0 0 0 200px}
  #col1_content { padding: 0 10px 0 20px }
  #col3_content { padding: 0 20px 0 10px }
	
  /*-------------------------------------------------------------------------*/

  #page_margins {
    border: 0 none;
    background-image:  url(../gfx/border/border_left.gif);
    background-repeat:repeat-y;
    background-position:left;
  }

  #page {
    border: 0 none;
    margin: 0 0 0 5px; padding: 10px 15px 10px 10px;
    background-image:  url(../gfx/border/border_right.gif);
    background-repeat:repeat-y;
    background-position:right;
  }


  #border-top {
    overflow:hidden;
    width: auto;
    height: 20px;
    font-size:0;
    margin-bottom: -15px;
    background-image:  url(../gfx/border/border_top.gif);
    background-repeat:repeat-x;
    background-position:top left;
  }

  #border-bottom {
    overflow:hidden;
    width: auto;
    height: 20px;
    margin-top: -15px;
    font-size:0;
    background-image:  url(../gfx/border/border_bottom.gif);
    background-repeat:repeat-x;
    background-position:bottom left;
  }

  #edge-tl {
    float:left;
    width: 20px;
    height: 20px;
    font-size:0;
    background-image:  url(../gfx/border/corner_tl.gif);
    background-position: top left;
  }

  #edge-tr {
    position:relative; /* IE Fix | z-index */
    float:right;
    width: 20px;
    height: 20px;
    font-size:0;
    background-image:  url(../gfx/border/corner_tr.gif);
    background-position: top right;
  }

  #edge-bl {
    float:left;
    width: 20px;
    height: 20px;
    background-image:  url(../gfx/border/corner_bl.gif);
    background-position: bottom left;
  }

  #edge-br {
    position:relative; /* IE Fix | z-index */
    float:right;
    width: 20px;
    height: 20px;
    background-image:  url(../gfx/border/corner_br.gif);
    background-position: bottom right;
  }

}

#header {
  padding-top: 10px;
}

body, td {
  font-family: verdana;
  font-size: 10pt;
}

#footer {
  border-top:3px solid #b1b3b4;
  background: #f2f2f2;
  text-align: center;
}
a {
  color: #336699;
}
a:hover {
  color: red;
}

#col1 ul {
  margin-top: 20px;
  margin-bottom: 20px;
  list-style: none;
  margin-left: 0px;
}

#col1 ul li {
  padding: 0px;
  margin: 0px;
}
#col1 ul li a {
  display: block;
  background-color: #f2f2f2;
  padding: 10px 0 10px 10px;
  border-left: 5px solid #f2f2f2;
  border-top: 1px solid #ffffff;
  border-bottom: 1px solid #b0b0b0;
  text-decoration: none;
}

#col1 ul li ul {
  margin: 0px;
  margin-left: 10px;
}

#col1 ul li a:hover {
  border-left: 5px solid #b1b3b4;
}
#col3 {
  padding: 10px;
}
h1 {
  font-size: 14pt;
  padding-bottom: 10px;
}
#col3 img {
  padding: 5px;
}
#col3 td {
  padding-top: 5px;
  padding-bottom: 5px;
}
.product {
  text-align: center;
  width: 70%;
  margin: auto;
  border: 1px solid #b1b3b4;
  background-color: #f2f2f2;
  padding: 5px;
  margin-bottom: 10px;
  height: 375px;
}
.product h1 {
  padding: 0px;
}
a.hidden {
  text-decoration: none;
  color: black;
}
thead td {
  border-bottom: 2px solid #b1b3b4;
  background-color: #f2f2f2;
  font-weight: 700;
}
tbody td {
  border-bottom: 1px solid #b1b3b4;
}
.lastline {
  border-top: 3px solid #b1b3b4;
}
.ar {
  text-align: right;
}
td.desc {
  text-align: right;
  width: 40%;
  border-bottom: 0px;
  padding-right: 5px;
}
td.input {
  border-bottom: 0px;
}

h1 a { font-size: 14pt; }

h2 { font-size: 11pt; margin-bottom: 0.5em;}

div>a { font-size: 10pt; }

/* import print layout | Druck-Layout einbinden */
/*@import url(../yaml/print/print_003_draft.css); */




#lightbox{
	position: absolute;
	left: 0;
	width: 100%;
	z-index: 100;
	text-align: center;
	line-height: 0;
	}

#lightbox a img{ border: none; }

#outerImageContainer{
	position: relative;
	background-color: #fff;
	width: 250px;
	height: 250px;
	margin: 0 auto;
	}

#imageContainer{
	padding: 10px;
	}

#loading{
	position: absolute;
	top: 40%;
	left: 0%;
	height: 25%;
	width: 100%;
	text-align: center;
	line-height: 0;
	}
#hoverNav{
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	width: 100%;
	z-index: 10;
	}
#imageContainer>#hoverNav{ left: 0;}
#hoverNav a{ outline: none;}

#prevLink, #nextLink{
	width: 49%;
	height: 100%;
	background: transparent url(../images/blank.gif) no-repeat; /* Trick IE into showing hover */
	display: block;
	}
#prevLink { left: 0; float: left;}
#nextLink { right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover { background: url(../images/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(../images/nextlabel.gif) right 15% no-repeat; }


#imageDataContainer{
	font: 10px Verdana, Helvetica, sans-serif;
	background-color: #fff;
	margin: 0 auto;
	line-height: 1.4em;
	overflow: auto;
	width: 100%	
	}

#imageData{	padding:0 10px; color: #666; }
#imageData #imageDetails{ width: 70%; float: left; text-align: left; }	
#imageData #caption{ font-weight: bold;	}
#imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em;	}			
#imageData #bottomNavClose{ width: 113px; float: right;  padding-bottom: 0.7em;	}	
		
#overlay{
	position: absolute;
	top: 0;
	left: 0;
	z-index: 90;
	width: 100%;
	height: 500px;
	background-color: #000;
	}