﻿/* Globals */
div.hidden {
      visibility: hidden;
      }

/*  Header, Headlines etc. */
div.header{
      font-size:20px;
      font-weight: bold;
      line-height: 20px;
      }

div.subheadline {
      font-size:16px;
      font-weight: bold;
      font-family: Arial,Geneva,Helvetica,sans-serif;
      line-height: 16px;
      margin-top: 20px;
      margin-bottom: 7px;
      }

p.instruction{
      color:            #999999;
      font-size:        14px !important;
      font-weight:      normal;
      line-height:      18px !important;
       margin-bottom:    13px;
      }

input.single {
      text-align:right;
      font-family: Arial,Geneva,Helvetica,sans-serif;
      }
select.combo {
      text-align: left;
      font-family: Arial,Geneva,Helvetica,sans-serif;
      }

/*  Linker Block  */
div.left_content
      {
      float:              left;
      width:              490px;
       }
div#attribute_list{
	overflow: scroll; 
	overflow-x: hidden; 
	height: 510px;
	}
div.atgroup {
      border-left:        2px solid #DDD;
      border-right:       2px solid #DDD;
      border-bottom:      2px solid #DDD;
      width:              486px;
      }

div.atgroup-placeholder
/*  wird benötigt, damit slide-Effekte richtig funktionieren  */
      {
      padding-top:        8px;
      }

div.attr {
      width:              490px;
      height:             24px;
      line-height:        16px;
      margin:             2px
      padding-top:        0px;
      font-size:          13px;
      font-family:        Arial,Geneva,Helvetica,sans-serif;
      }
div.minmax {	
      margin--bottom:      10px;
      margin-top:         -3px;
      }

    div.minmax span
          {
          font-size:          11px;
          color:              #777;
          }

    a.minmax {
          color:              #777;
          }

div.title {
      background-color:   #DDDDDD;
      cursor:             pointer;
      margin-top:         0px;
      border:		  1px solid #ccc;
      }

div.characteristic {
      background-color:   #FFFFFF;
      margin-top:         3px;
      margin-bottom:      3px;
      font-size:	  12px;
      height:		  42px;
      }

div.input {
      padding-bottom:     3px;
      }

div.go {
      height:             40px;
      }

span.placeholder {
      width:              20px;
      float:              left;
      text-align:         center;
      }

div span.level1 {
      margin-left:        20px;
      }


div span.level2 {
      margin-left:        35px;
      }

div span.level3 {
      margin-left:        50px;
      }

div span.level4
      {
      margin-left:        65px;
      }

div.title span.level1 + span {
      font-weight: 	  bold;      
      }

div.title span.level2 + span {
      color: 	  	  #666;      
      }

div.title span.level3 + span {
      font-weight: 	  bold;      
      }

div.title span.level4 + span {
      color: 	  	  #666;      
      }

div span.content
      {
/*  margin-left: 5px; //verursacht "Zitter"-Effekt im IE  */
      float:              left;
      position:           relative;
      top:                2px;
      }
div span.input
      {
      float:		  left;
      margin-right:	  5px;
      display:		  block
      }
div span.unit
      {
      float:              left;
      margin-right:       10px;
      width:              75px;
      display:            block;
      }
div span.go
      {
      margin-top:         5px;
      float:              right;
      margin-right:       10px;
      }
img.title
      {
      text-align: center;
      vertical-align: middle;
      }
img.setRange
      {
      padding-right:      5px;
      position:           relative;
      top:                1px;
      }
/*  Rechter Block  */
div.product-list-wrapper {
      height: 578px;
      overflow-y: scroll;
      overflow-x: hidden;
      }
div.product-wrapper
      {
      width:              457px;
      min-height:         150px;
      border:             1px solid #CCCCCC;
      margin-bottom:      8px;
      padding-left:       8px;
      }
div.product-wrapper:hover
      {
      background-color:   #EEE;
      }
div#no-products {
      padding-bottom:     40px;
      padding-top:        40px;
      min-height:         0px;
      }
div.product-title
      {
      margin-bottom:         5px;
}
div.product-title h3
      {
      line-height:        20px;
      font-size:          13px;
      font-weight:        bold;
      margin-top:         5px;
      font-size:          13px;
      font-family:        Arial,Geneva,Helvetica,sans-serif;
      }
div.product-subtitle
      {
      font-weight:        normal;
      margin-bottom:      10px;
      color:              #AAA;
      font-size:          12px;
      font-family:        Arial,Geneva,Helvetica,sans-serif;
      }
div.marketing-content {}
div.marketing-text{
      min-height:         110px;
      padding-right:      10px;
      font-size:          11px;
      font-family:        Arial,Geneva,Helvetica,sans-serif;
      padding:		  5px;
      margin-top:         17px;
      line-height:        12px;
      }
div.product-content
      {
      min-height:         68px;
      }
img.product-img
      {
      float:              left;
      display:            inline;
      border:             1px solid #CCCCCC;
      margin :            3px;
      width:              100px;
      height:             100px;
      margin-right:	  11px;
      }
span.product-text
      {
      line-height:        22px;
      font-size:          13px;
      padding-right:      15px;
      position:           relative;
      left:               13px;
      font-size:          11px;
      font-family:        Arial,Geneva,Helvetica,sans-serif;
      }
div.product-infos
      {
      line-height:        22px;
      font-size:          13px;
      height:             50px;
      padding-right:      8px;
      padding-bottom:     5px;
      }
span.product-links
      {
      float:              right;
      margin-right:       12px;
      }
a.link.configure
      {
	background: url(../ico/configure_A.gif) no-repeat scroll 0 0 transparent; 
        margin-left: -4px; 
        margin-top: -4px; 
        padding: 0 0 0 15px;

       }
span.product-qualification
      {
      float:              left;
      margin-left:        5px;
      }
ul.qualification li {
      background: url("../ico/arrow_B_right.gif") no-repeat scroll 0 4px transparent;
      padding-left: 11px;
      }
/* Links für Buttons  */
a.next
   {
   display:               block;
   height:                21px;
   width:                 65px;
   color:                 #FFFFFF !important;
   background-color:      #999999 !important;;
   cursor:                pointer;
   text-align:            center;
   text-decoration:       none;
   padding-right          3px;
   padding-left:          3px;
   -moz-border-radius:    5px;
   }
 p.close
   {
   display:               block;
   height:                21px;
   width:                 65px;
   cursor:                pointer;
   text-align:            center !important;
   text-decoration:       none;
   padding-right          3px;
   -moz-border-radius:    5px;
   position:              relative;
   top:                   2px;
   color:                 #FFFFFF !important;
   }
/* Layer-Zeugs  */
div.layer
      {
      z-index:            999;
      font-size:          12px;
      width:              220px;
      height:             110px;
      border:             1px solid #AAAAAA;
      background-color:   #FFFFFF;
      position:           absolute;
      visibility:         hidden;
      padding:            4px;
      font-family:        Arial,Geneva,Helvetica,sans-serif;
      line-height:        16px;
      }
div.layer-range
      {
      width:              280px;
      }
div#layer-share
      {
      height:             60px;
      }
span.layer-share{
      width:              200px !important;
      float:              left;
      }
span.share-close * img{
      border:             1px solid #AAAAAA;
      margin-right:       -5px;
      margin-top:         -5px;
      padding:            5px;
      }
span.layer-setRange{
      width:              280px !important;
      }
span.layer-setRange-left{
      float:              left;
      width:              260px !important;
      height:             120px;
      }
span.layer-setRange-right {
      float:              right;
      }
span.layer-setRange-right img{
      border:             1px solid #AAAAAA;
      margin-right:       -5px;
      margin-top:         -5px;
      padding:            5px;
      }
div.layer-min {
      margin-top:         20px;
      width:              260px;
      display:            inline-block;
      }
div.layer-max {
      position:           relative;
      top:                5px;
      width:              260px
      display:            inline-block;
      }
div.layer-apply {
      width:              260px;
      position:           relative;
      top:                14px;
      display:            inline-block;
      }
span.layer-text {
      width:              60px;
      float:              left;
      margin-left:        8px;
      }
span.layer-input {
      float:              left;
      margin-left:        5px;
      }
span.layer-unit {
      float:              left;
      margin-left:        5px;
      }
span.share-item {
      float:              left;
      display:            block;
      width:              190px;
      margin-top:         8px;
      }
span.share-item a {
      color:              black !important;
      }
img.share-email {
      padding-left:       10px;
      padding-right:       10px;
      }
img.share-fav {
      padding-left:       10px;
      padding-right:       16px;
      }
p.share-img {
      width:              30px;
      float:              left;
      padding-left:       15px;
      }
p.share-text {
      float:              left;
      padding-left:       5px;
      }
a.share-text {
      float:              right;
      margin-top:         4px;
      }
span.share-close {
      float:              right;
      }
/* Bottom Toolbar */
div.toolbar-left {
    float:                left;
    width:                490px;
}
div#toolbar-left {
  position: absolute;
  top: 688px;
  left: 55px;
}
div.bottom-toolbar-right {
    float:                left;
    margin-left:          22px;
    width:                500px;
}
span.bottom-toolbar-button {
    float:                right;
    padding-right:        45px;
}
a.bottom-toolbar-button {
    width:                100px;
    font-size:            12px;
}
p.button-text {
    position:             relative;
    top:                  2px;
    color:                #FFFFFF;
    text-align:           center !important;
    font-size:            13px !important;
}
/* Überschreiben von Standard-CSS  */
div#content-zone {
     margin-top: 2px;
}
div.left-content {
    width:                490px;
     margin-top:           0px;
     margin-left:          10px;
}
div.right-content {
    width:                485px;
     margin-top:           0px;
     margin-left:          15px;
    }
body.with-page-tools div#footer-zone {
     margin-top: 62px;
     padding: 2px 22px 0 44px;
}
body.with-page-tools div#footer-position-placeholder {
     height: 660px;
}
div#footer-position-wrapper {
    min-width: 1010px;
}
.tableMainCalc td{
    padding: 2px !important;
    border:none;
    border-top:1px solid #999;
}
.tableMainCalc th{
    padding: 2px !important;
    border:none;
    vertical-align: top;
}
#printDiv {
    width:        97%;
    padding:      5px;
    height:       10px;
    border-top:   1px solid #999;
    top:          495px;
    position:     absolute;
}
.legendItem {
    width:        9px;
    height:       9px;
    float:        left;
    border:       1px solid;
    margin-top:   2px;
}
.legendText {
    font-size:    11px;
    line-height:  16px;
    text-align:   left;
    float: left;
    padding-left: 4px;
}
.legendTitle {
    font-size:    11px;
    line-height:  16px;
    text-align:   left;
    float: left;
}
.redBox {
    background-color : #FF9999;
    }