@charset "UTF-8";
/**
 * "Yet Another Multicolumn Layout" - (X)HTML/CSS Framework
 *
 * (en) Uniform design of standard content elements
 * (de) Einheitliche Standardformatierungen für die wichtigten Inhalts-Elemente
 *
 * @copyright       Copyright 2005-2009, 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.1
 * @revision        $Revision: 343 $
 * @lastmodified    $Date: 2009-01-19 23:41:32 +0100 (Mo, 19. Jan 2009) $
 * @appdef yaml
 */

@media all
{
 /**
  * Fonts
  *
  * (en) global settings of font-families and font-sizes
  * (de) Globale Einstellungen für Zeichensatz und Schriftgrößen
  *
  * @section content-global-settings
  */

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

 /**
  * (en) reset monospaced elements to font size 16px in all browsers
  * (de) Schriftgröße von monospaced Elemente in allen Browsern auf 16 Pixel setzen
  *
  * @see: http://webkit.org/blog/67/strange-medium/
  */

  textarea, pre, code, kbd, samp, var, tt {
    font-family: Consolas, "Lucida Console", "Andale Mono", "Bitstream Vera Sans Mono", "Courier New", Courier;
  }

  /* (en) base layout gets standard font size 12px */
  /* (de) Basis-Layout erhält Standardschriftgröße von 12 Pixeln */
  body {
    font-family:  Arial, Helvetica, sans-serif;
    font-size: 75.00%;
    color: #444;
  }

  /*--- Headings | Überschriften ------------------------------------------------------------------------*/

  h1,h2,h3,h4,h5,h6,
  .h5_like {
    font-weight: bold;
    color:#787878;
    margin: 0 0 0.25em 0;
  }


  /** 
   * Überschriften
   * 
   * Für den Inhaltsbereich werden die Überschriften 1, 2 und 3 verwendet
   * Für die Zusatznavigationen sind die Überschrifen 4, 5 und 6 zu verwenden
   */
   
/* H1
   * - 16px
   * - Blau 
   */
   
  h2.content {
      font-size: 133.33%; 
      color: #152b8a;
      font-weight: bold;
  }
  
  #head_text_wrap h1 {
      font-size: 100%;
      color: white;
      font-weight:bold;
      line-height: 100%;
  }
  
/* H2
 * 14px
 * Blau
 */                       
  h2 { 
    font-size: 116.67%;  
    color: #152b8a;
    font-weight: bold;
  } 
  h3 {
      font-size: 100%;
  }                      /* 24px */
/*  h3 { font-size: 110%}                        150%; = 18px */
	
	 
  h4 { 
    font-size: 100%; 
  }                    /* 133.33% == 16px */
  h5, .h5_like { font-size: 116.67%; }                    /* 14px */
  h6 { font-size: 116.67%; }                    /* 14px */

  /* --- Lists | Listen  -------------------------------------------------------------------------------- */

  ul, ol, dl { line-height: 1.5em; margin: 0 0 1em 1em; }
  ul li { list-style-type: disc; }
  ul ul li { list-style-type: circle; }

  ol li { list-style-type: decimal; }
  ol ol li { list-style-type: lower-latin; }

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

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

  /* --- general text formatting | Allgemeine Textauszeichnung ------------------------------------------ */

  p { line-height: 1.5em; margin: 0 0 1em 0; color: #787878 }

  blockquote, cite,q {
    font-family: Georgia, "Times New Roman", Times, serif;
    font-style:italic;
  }
  blockquote { margin: 0 0 1em 1.6em; color: #666; }

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

  pre, code, kbd, tt, samp, var { font-size: 100%; }
  pre, code { color: #800; }
  pre { line-height: 1.5em; margin: 0 0 1em 0; }
  kbd, samp, var { color: #666; }
  var { font-style: italic; }

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

  sub, sup { font-size: 91.6667%; }

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

  /*--- Links ----------------------------------------------------------------------------------------- */

  a { color: #787878; background:transparent; text-decoration:none; }
  a:visited  { color: #787878; }

  a:focus,
  a:hover,
  a:active { color:#787878; text-decoration:underline; }

  /* --- images (with optional captions) | Bilder (mit optionaler Bildunterschrift) ------------------ */

  p.icaption_left { float:left; display:inline; margin: 0 1em 0.15em 0; }
  p.icaption_right { float:right; display:inline; margin: 0 0 0.15em 1em; }

  p.icaption_left img,
  p.icaption_right img { padding:0; border: 1px #888 solid; }

  p.icaption_left strong,
  p.icaption_right strong { display:block; overflow:hidden; margin-top: 2px; padding: 0.3em 0.5em; background: #eee; font-weight: normal; font-size: 91.667%; }

 /**
  * ------------------------------------------------------------------------------------------------- #
  *
  * Generic Content Classes
  *
  * (en) standard classes for positioning and highlighting
  * (de) Standardklassen zur Positionierung und Hervorhebung
  *
  * @section content-generic-classes
  */

  .highlight { color: #f60; }
  .dimmed { color: #888; }

  .info { background: #f8f8f8; color: #666; padding: 10px; margin-bottom: 0.5em; font-size: 91.7%; }

  .note { background: #efe; color: #040; border: 2px #484 solid; padding: 10px; margin-bottom: 1em; }
  .important { background: #ffe; color: #440; border: 2px #884 solid; padding: 10px; margin-bottom: 1em; }
  .warning { background: #fee; color: #400; border: 2px #844 solid; padding: 10px; margin-bottom: 1em; }

  .float_left { float: left; display:inline; margin-right: 1em; margin-bottom: 0.15em; }
  .float_right { float: right; display:inline; margin-left: 1em; margin-bottom: 0.15em; }
  .center { display:block; text-align:center; margin: 0.5em auto; }

 /**
  * ------------------------------------------------------------------------------------------------- #
  *
  * Tables | Tabellen
  *
  * (en) Generic classes for table-width and design definition
  * (de) Generische Klassen für die Tabellenbreite und Gestaltungsvorschriften für Tabellen
  *
  * @section content-tables
  */

  /** Normale Tabellen,
    * Leider wird der Border unten und oben abgeschnitten wenn
    * border-collapse: collapse gewählt wird
    * deshalb setze ich margin top und left 1 px. Wegen
    * des Boxmodells der Tabelle muss dann jedoch die Breite
    * auf 99% gesettzt werden da die Tabelle sonst breiter
    * als 100% ist
    */
    
 /*    
 darf hier nicht allgemein gemacht werden,
 da sonst die dijits durcheinander kommen
 
  table { 
     width: 99%; 
      border-collapse:collapse; 
      margin-bottom: 1em; 
      margin-left: 1px;
      margin-top: 1px;  
  } 

  th, td { 
      padding: 0.2em; 
  } */

 /**
  * ------------------------------------------------------------------------------------------------- #
  *
  * Miscellaneous | Sonstiges
  *
  * @section content-misc
  */

 /**
  * (en) Emphasizing external Hyperlinks via CSS
  * (de) Hervorhebung externer Hyperlinks mit CSS
  *
  * @section             content-external-links
  * @app-yaml-default    disabled
  */

  /*
  #main a[href^="http://www.my-domain.com"],
  #main a[href^="https://www.my-domain.com"]
  {
    padding-left: 12px;
    background-image: url('your_image.gif');
    background-repeat: no-repeat;
    background-position: 0 0.45em;
  }
  */

  
  .k_topic_preview {
      background: #fff url(/gfx/bg_topic_preview.png) no-repeat top left;
      width:  183px;
      height: 183px;
      position: relative;
  }
  
  .k_topic_preview img {
      position: absolute;
      top: 1px;
      left: 1px;
  }
  
  .k_topic_preview h4 {
      position: absolute;
      padding-top: 2px;
      top: 163px;
      left: 0;
      width: 100%;
      text-align: center;
  }
  
  #footer {
      
  }
  
  #footer_inner {
	  text-align:center;
	  position: relative;
  }
  
  #bb_reflink {
      position: absolute;
      bottom: 1em;
      right: 15px;
  }
  
  #bb_reflink a {
      font-weight: bold;
      padding-left: 13px;
      background: transparent url(http://www.bitbricks.de/fileadmin/gfx/bitbricks_prelink.gif) no-repeat scroll left center;
  }
  
  #footer ul {
	  display: inline;
	  height: 20px;
  }
  
  #footer ul li {
	  display: inline; 
  }
  
  #footer_inner ul a {
	  font-weight: bold;
	  padding-left: 13px;
	  margin: 0 4px;
	  background: transparent url(../../gfx/footernav_bullet.gif) no-repeat 0 3px;
  }
  #footer p {
	  font-size: 80%;
  }
  
  div#quicksearch {
	  margin-bottom: 1em;
  }
  
  #quicksearch form {
	  display:block;
	  position:relative;
	  height: 21px;
  }
  #search_wrap {
	  position:absolute;
	  top:0;
	  left:0;
	  height: 21px;
	  width: 146px;
	  border:0;
	  background: #fff url(../../gfx/searchbox.png) no-repeat top left;
  }
  #search_wrap input {
      border: 0;
      background: none;
      padding-top: 3px;
      padding-left: 0.5em;
  }
  
  
  #quicksearch input.button {
	  position: absolute;
	  height: 21px;
	  top:0;
	  cursor: pointer;
	  border:0;
	  left:146px;
	  background: #fff url(../../gfx/searchbox_btn.png) no-repeat top left;
	  width: 25px;
  }
  #quicksearch input.button:HOVER {
	  background-image: url(../../gfx/searchbox_btn_hover.png);
  }
  
  #head_text_wrap {
      width:            800px;
      /* background-color: #30459a; */
      /* background-color: #cdd221; */
      background-image: url(/gfx/bg_seotext.png);
      /*border:           1px solid white; */
      position:         absolute;
      left:             200px;
      width:            600px;
      top:              19px;
      color:            white;
      font-size:        90%;
  }
  
  #head_text_wrap p {
      color:            white;
      line-height: 100%;
  }
  
  #login_box {
      position:    absolute; 
      left:        810px;
      top:         22px; 
      width:       190px;
  }
  #login_box p, #login_box a {
      padding: 0;
      margin: 0;
      color: white;
  }
  #login_box_title {
      font-weight: bold;
      margin-bottom: 0.2em;
  }
  
  #form_login_btn {
     width: 30px;
  }
  
  #login_box_remember_password a, #login_box p.login_head_kursiv a,  #login_box p.login_head_kursiv {
      font-style: italic;
      color: white;
      font-size: 90%;
  }
  
  /** Spezielle Kallosformulare **/
  
  .k_head_input {
	  background: #fff url(../../gfx/bg_form_input.png) no-repeat top left;
	  border: 1px solid #9782b8;
	  margin-bottom: 0.2em;
  }
  
  #form_login input {
	  
	  font-weight: bold;
	  color: #afafaf;
	  font-style:italic;
	  height: 1.5em;
	  font-size: 100%;
  }
  #form_login_name {
      width: 130px;
  }
  
  #form_login_pw {
      width: 130px;
  }

  /** Yaml-Tabellen so überschrieben das immer 1 em Platz unter den Boxen ist **/
  
  .subcolumns {
      margin-bottom: 1.5em;
  }
  
  .head_text p {
      margin: 0;
  }


/** Einfache Box 
	
	Wird z.B. auf der Motivdetailseite für die Formatwahl genutzt
	Kann eventuell durch Box ersetzt werden
	
	**/

  div.simplebox {
      background: #fff url(/gfx/simplebox/lo.png) no-repeat left top;
      height: 1%;
  }
  div.simplebox div.ro {
      background: transparent url(/gfx/simplebox/ro.png) no-repeat right top;
      height: 1%;
  }
  div.simplebox div.lu {
      background: transparent url(/gfx/simplebox/lu.png) no-repeat left bottom;
      height: 1%;
  }
  div.simplebox div.ru {
      background: transparent url(/gfx/simplebox/ru.png) no-repeat right bottom;
      height: 1%;
  }
  div.simplebox_head {
      height: 22px;
      overflow: hidden;
  }
  div.simplebox_head_content {
      padding: 3px 0 0 0.5em;
  }
  div.simplebox_content_content {
      padding: 3px 0 0.5em 0.5em;
  }
  
  
  div.k_box_tl {
      background: #fff url(/gfx/box/box/tl.png) no-repeat left top;
      height: 1%;
      margin-bottom: 1em;
  }
  div.k_box_tr  {
      background: transparent url(/gfx/box/box/tr.png) no-repeat right top;
      height: 1%;
  }
  div.k_box_bl {
      background: transparent url(/gfx/box/box/bl.png) no-repeat left bottom;
      height: 1%;
  }
  div.k_box_br {
      background: transparent url(/gfx/box/box/br.png) no-repeat right bottom;
      height: 1%;
      padding: 1px;
  }
  div.k_box_header, div.k_box_header_first {
      padding-top: 3px;
      padding-bottom: 3px;
      padding-left: 1em;
      font-weight: bold;
  }
  
  div.k_box_header_first {
      overflow: hidden;
      height: 22px;
  }
  
  /** Nur die zweiten Boxen mit grauem Hintergrund machen, oben ist das
      schon durch die Grafik vorgegeben **/
  div.k_box_header {
      background-color: #dcdcdc;
  }

  div.k_box_content {
      padding: 3px 0 1em 1em;
  }
}


/** Kartenvoerschauspezifisch **/

#cardexample {
	width: 184px;
	height: 157px;
	background : #fff url(/gfx/box_cardexample.png) no-repeat top left;
	position: relative;
}
#cardexample p {
	padding: 2px 0 0 0.5em;
}

#cardexample img.pv {
	position: absolute;
	top: 25px;
	left: 17px;
}
#cardexample a {
	display: block;
	position: absolute;
	bottom: 0;
	right: 0;
}

div.image_button {
	background: transparent url(/gfx/btn/bg_button.png) no-repeat top left;
	height: 21px;
	overflow: hidden;
}

div.image_button a {
    background: transparent url(/gfx/btn/bg_button_end.png) no-repeat top right;
	display: block;
	text-align:center;
	padding: 3px;
	cursor: pointer;
}


div.image_button_red {
	background: transparent url(/gfx/btn/bg_button_red.png) no-repeat top left;
	height: 25px;
	overflow: hidden;
}

div.image_button_red a {
    background: transparent url(/gfx/btn/bg_button_red_end.png) no-repeat top right;
	display: block;
	color: white;
	height: 25px;
	font-weight:bold;
	text-align:center;
	padding: 3px;
	cursor: pointer;
}

/** Breadcrumb nav **/

#breadcrumb, #breadcrumb a {
	color: #505050;
}
#breadcrumb {
	padding-left: 15px;
	padding-top: 5px;
	font-size: 90%;
}
#breadcrumb ul {
	list-style-type: none;
	display: inline;
	margin: 0;
	padding: 0;
}
#breadcrumb ul li {
	list-style-type: none;
	display: inline;
}
#breadcrumb a {
	padding-left: 12px;
	background: transparent url(/gfx/arrow_xs_505050.png) no-repeat left center;
}

div.hks_color {
	width: 45px;
	height: 42px;
	float: left;
	margin: 3px;
	padding-top: 3px;
	border: 2px solid white;
	font-weight: bold;
	text-align: center;
	font-size:130%;
}


#db_content_top div.db_content, #db_content_bottom div.db_content {
	/* padding-bottom: 1.5em; */
}

/** Formatierung der Preistabellen **/

  table.pricetable {
      width: 99%; 
      border-collapse:collapse; 
      margin-bottom: 1em; 
      margin-left: 1px;
      margin-top: 1px;
  }
  
      
  table.pricetable thead th { } /* color: #000; border-bottom: 2px #800 solid; */
  table.pricetable tbody th { } /* background: #e0e0e0; color: #333; */
  table.pricetable tbody th[scope="row"], tbody th.sub { background: #f0f0f0; }

  table.pricetable tbody th { border: 1px solid #787878; text-align: center; background-color: #dcdcdc }
  table.pricetable tbody td { border: 1px solid #787878; text-align: center; }

  table.pricetable tbody tr:hover th[scope="row"],
  table.pricetable tbody tr:hover tbody th.sub { background: #f0f0f0; }
  table.pricetable tbody tr:hover td { background: #f0f0f0; }
 
  tbody td.blue { 
      background-color: #f0f0f0
  }

/** Klasse für die Motivgrafik, wird eigentlich nur 
    auf der viewmotive gebraucht
  */
  
#kcv_motive {
	border: 1px solid #787878;
	margin-bottom: 1.5em;
}

/** Styles der Nachrichten **/

#messanger {
	width: 580px;
	font-weight: bold;
	color: black;
}	 

#messanger.error_msg {
	color: red;
}


/** Beziehen sich eigentlich nur auf die neue Donation Print Seite
	**/
#img_donation_print_wrap {

}
#img_donation_print {
	border: 1px solid #AAA;
}


/** Allgemeine Links **/

a.link {
	color: blue;
}


div {
	text-align: left;
	color: #787878;
}

div.k_article_box_wrap {
	width: 182px;
	background: #fff url(/gfx/articlebox/top.png) no-repeat top left;
}

div.k_article_box_wrap_inner {
	background: transparent url(/gfx/articlebox/bottom.png) no-repeat bottom left;
}

div.k_article_box_inner {
	width: 150px;
	margin-left: auto;
	margin-right: auto;
	padding-top: 0.5em;
	text-align: center;
	position: relative;
	height: 300px;
}

div.k_article_box_inner img {
    border: solid 1px #cdcdcd;
}

div.k_article_box_price {
	position: absolute;
	width: 150px;
	bottom: 0.5em;
	left: 0;
	font-weight: bold;
}


p.k_article_box_price_info {
	padding: 0;
	margin: 0;
	text-align: center;
}

p.k_article_box_price_info a {
	background: url(/gfx/arrow_pricetable.png) no-repeat left 4px;
	padding-left: 11px; 
}

/** Formatierung der Artikelkategorienbox */

div.k_article_cat_box_wrap {
    width: 182px;
    background: #fff url(/gfx/articlebox/top.png) no-repeat top left;
}

div.k_article_cat_box_wrap_inner {
    background: transparent url(/gfx/articlebox/bottom.png) no-repeat bottom left;
}

div.k_article_cat_box_inner {
    width: 150px;
    margin-left: auto;
    margin-right: auto;
    padding-top: 0.5em;
    text-align: center;
    padding-bottom: 1em;
}

div.k_article_cat_box_inner img {
    border: solid 1px #cdcdcd;
}


/** Kundenspezifische Tabellen **/

div.k_custom_table_wrap {
	background: #fff url(/gfx/box/box/tl.png) no-repeat top left;
}
div.k_custom_table_wrap_tr {
	background: transparent url(/gfx/box/box/tr.png) no-repeat top right;	
}
div.k_custom_table_wrap_bl {
	background: transparent url(/gfx/box/box/bl.png) no-repeat bottom left;	
}
div.k_custom_table_wrap_br {
	padding-bottom: 1em;
	background: transparent url(/gfx/box/box/br.png) no-repeat bottom right;	
}

/** Das gleiche noch mal nur mit giga großen Grafiken, dass auch
    Die Zitatliste korrekt dargestellt werden kann
**/

div.k_custom_max_table_wrap {
    background: #fff url(/gfx/box/box/tl_max.png) no-repeat top left;
}
div.k_custom_max_table_wrap_tr {
    background: transparent url(/gfx/box/box/tr_max.png) no-repeat top right;   
}
div.k_custom_max_table_wrap_bl {
    background: transparent url(/gfx/box/box/bl_max.png) no-repeat bottom left; 
}
div.k_custom_max_table_wrap_br {
    padding-bottom: 1em;
    background: transparent url(/gfx/box/box/br_max.png) no-repeat bottom right;    
}

.k_custom_table {
    width: 100%;
}
.k_custom_table td {
	padding-left: 0.5em;
	padding-bottom: 4px;
}

.k_custom_table .right {
	text-align: right;
	padding-right: 3em;
}

.k_custom_table tr.top {
	font-weight: bold;
	height: 20px;
}
.k_custom_table tr.top td {
}


.custom_table td.right {
	padding-right: 3em;
	text-align: right;
}

.k_custom_table input, input.k_input {
	border: 1px solid #787878;
	background: #FFF url(/gfx/bg_form_input.png) no-repeat scroll left top;
	padding: 2px;
}
.k_custom_table tbody tr td dl {
    margin: 0px;
}
.k_custom_table tbody tr td dl dt {
    float:left;
    clear:left;
    width: 130px;
    font-weight: normal;
    padding-top: 5px;
}
.k_custom_table tbody tr td dl dd {
    margin: 0px 0px 0px 130px;
    padding-top: 5px;
}

.k_custom_table tbody tr td dl dd input{
    padding: 0px;
}




input.btn {
	border: 1px solid #aaa;
	background: #ddd url(/gfx/bg_form_btn.png) repeat-x scroll left top;
	cursor: pointer;
	padding: 2px;
	color: #666;
}

.k_order_confirm td{
	padding: 2px;
}


/** Styles für die Warenkorbtabelle **/


#k_tbl_basket {
	width: 100%;
	border-collapse: collapse;
	margin-bottom: 1em;
}
	
#k_tbl_basket th {
	padding-left: 1em;
	padding-right: 1em;
	font-weight: bold;
	height: 17px;
}

#k_tbl_basket tr.k_tbl_basket_header {
	height: 20px;
}

#k_tbl_basket td {
    vertical-align: top;
    text-align: right;
    padding-left: 0.5em;
    padding-right: 0.5em;
    padding-top: 0.2em;
}
#k_tbl_basket td.k_tbl_content_left {
	text-align: left;
}
#k_tbl_basket tr.k_tbl_basket_header td {
	background-color: #dcdcdc;
	padding-top: 3px;
}

#k_tbl_basket td.k_tbl_image {
	text-align: center;
} 
#k_tbl_basket td.k_tbl_image img {
	border: 1px solid #dcdcdc;
	margin-top: 1em;
	margin-bottom: 1em;
} 

#k_tbl_basket tr.k_tbl_basket_header td.k_tbl_header_center {
	text-align: center;
}
#k_tbl_basket tr.k_tbl_basket_header td.k_tbl_header_right {
	text-align: right;
}

#k_tbl_basket td.k_tbl_header_right img {
	margin-right: 22px;
}


#k_tbl_basket tr.k_tbl_basket_header td.k_tbl_header_left {
	text-align: left;
}


#k_tbl_basket table.k_basket_tbl_ce_details {
	font-size: 80%;
	width: 180px;
}
#k_tbl_basket table.k_basket_tbl_ce_details td {
	text-align: left;
	padding-left: 0;
	padding-right: 0;
}
#k_tbl_basket table.k_basket_tbl_ce_details td.right {
	text-align: right;
	font-weight: bold;
	white-space: nowrap;
}

a.basket_item_card_link {
	padding-left: 13px;
	background: transparent url(/gfx/arrow_xs_gray.png) no-repeat center left;
}
.k_order_confirm tbody tr th { text-align: left; }

.k_quote_table th {
	padding: 0.5em;
	padding-top: 0.2em;
	white-space: nowrap;
}

.k_quote_table td {
	padding-bottom: 0.5em;
	padding-top: 0.5em;
	border-bottom: 1px solid #787878;
} 



.dijitTooltipData table td {
	padding-right: 2em;
}