/* *** Product Wizard Start *** */

/* common classes */
div#second_col {  /* redefine, because for the wizard #second_col is inside #content_copy */
  top: 190px;  
}

div#second_col_result {  /* second box only on result page */
  position: relative;
  top: 50px;
  left: 0px;
  z-index: 0;
  float: right;
  margin-bottom: 65px;  

  width: 170px;
  margin: 0px 0px 65px 0px;
  padding: 2px 0px 5px 10px;
  /*background-color: #F0F4F7;*/
  border-left: 1px solid #66324b; 
}

* html div#content_copy {  /* IE up to 6 */
  margin-top: 163px;
}
*+html div#content_copy {  /* IE7 */
  padding-top: 40px;
}

div#content_copy {
  width: auto;    /* GJ 01.05.2007 - was 500px */
}

.bottomBorder {
  border-bottom: 1px dotted #999999;
}

div.rightAlignCont {
  float: right;
}

div.floatTerminator {
  clear:both;   /* to set the parent container's height to the bottom of the last float item */
}


/*  Wizard Progressbar */
#wizardProgressbar {
  height: 20px;  /* float items do not increase the size of the container, so we set it explicite */
}

#wizardProgressbar .wizardProgressItem, #wizardProgressbar .wizardProgressItemActive {
  float: left;
  font-family: Verdana;
  font-size: 10px;
  font-weight: normal;  
  margin-right: 2px;
  width: 78px; height: 12px;     /* for IE */
  w\idth: 81px; hei\ght: 15px;   /* IE hack due to the other box-model */
  border-bottom-style: solid;
  border-bottom-width: 3px;
}

#wizardProgressbar .wizardProgressItem {
  color: #AAAAAA;
	border-bottom-color: #AAAAAA;
}

#wizardProgressbar .wizardProgressItemActive {
  color: #330000;
	border-bottom-color: #330000;
}

#wizardProgressbar img {
  margin: 5px 0px 0px -3px;
}

html>body #wizardProgressbar img {
  margin: 5px 0px 0px 0px;
}


/*  Wizard Title + Info */
#wizardTitle {
  font-family: Verdana;
  font-size: 11px;
  font-weight: bold;
  color: #330000;
  border-top-style: dotted;
  border-bottom-style: dotted;
  border-top-width: 1px;
  border-bottom-width: 1px;
  border-top-color: #999999;
  border-bottom-color: #999999;
  line-height: 24px;
  margin-top: 20px;
  margin-bottom: 20px;
  width: 497px;
}

#wizardInfo {
  font-family: Verdana;
  font-size: 11px;
  color: #000000;
  width: 497px;
  margin-bottom: 20px;
}


/*  Wizard Content and its elements */
#wizardContent {
  font-family: Verdana;
  font-size: 11px;
  font-weight: bold;
  color: #333333;
  border: 1px dotted #999999;
  padding: 2px;
  width: 486px;  /* for IE */
  w\idth: 490px; /* IE hack due to the other box-model */
  margin-bottom: 20px;
}

/* list of radio buttons with labels - ul - not used */
#wizardContent ul { 
  list-style-type: none;
  text-align: left;
  margin: 0px;
  padding: 0px 0px 0px 0px;
}

#wizardContent ul li { 
  margin-top: 5px;
}

#wizardContent li label { 
  position: relative;
  left: 25px;
  display: block;
  top: -17px;
  margin-bottom: -10px; 
  width: 100px;
  cursor: pointer;
}

/* list of radio buttons with labels - table */
#wizardContent table { 
  width: 100%;
  border: none;
  border-collapse:collapse;
  border-spacing: 0px;
}

#wizardContent td.radiocheck { 
  padding: 5px 0px 5px 0px;
  vertical-align: top;
  width: 20px;    
}

#wizardContent td.label { 
  padding: 7px 0px 5px 5px;
  text-align: left;
  vertical-align: top;    
}

#wizardContent td label {
  cursor: pointer;
}

/* selectbox with label */
#wizardContent div.selectBox {
 margin: 9px 0px 7px 5px;
}
html>body #wizardContent div.selectBox {
 margin: 7px 0px 7px 5px;
}


#wizardContent div.label {
  float: left;
  width: 50%;
  margin: 2px 0px 2px 0px;
/*  margin: 9px 0px 9px 5px;*/

}

#wizardContent select { 
/*  margin-top: 7px;*/
}

#wizardContent a.titleLink, #wizardContent a.titleLink:link, #wizardContent a.titleLink:visited, #wizardContent a.titleLink:hover {
  font-size: 12px;
  font-weight: bold;
  color: #000000;  
  text-decoration: none;
}

/* numeric input box with label */
#wizardContent div.numericInputBox { 
 margin: 9px 0px 7px 5px;
}
html>body #wizardContent div.numericInputBox {
 margin: 7px 0px 7px 5px;
}

#wizardContent .numericInputBox input { 
  font-size: 11px;
  font-weight: normal;
  color: #666666;  
}

#wizardContent .numericInputBox .error { 
  font-size: 11px;
  font-weight: normal;
  color: #D94B52;  
  text-decoration: none;
}


/*  Wizard Buttons */
#wizardButtons {
  width: 497px;
  height:20px;  /* float items do not increase the size of the container, so we set it explicite */
  margin-top: 40px;
}

#wizardButtons .wizardButton {
  float:left;  /* could be done with display:inline, but then width and height dont work, only margin and padding */
  width: 77px; height: 12px;   /* for IE */
  margin: 0px 0px 0px 5px;
  padding: 1px 2px 4px 2px;
  font-size: 11px;
  text-align: center;
  color: #999999;
  background-color:  #001932; /* #24110D; */
  border: 1px solid #8F8F8F;
  cursor: pointer;
}
html>body #wizardButtons .wizardButton {
  width: 80px; height: 15px;
  padding: 2px;
}

/*  Wizard Themes List */
#wizardThemes {
  margin: 5px 0px 5px 0px;
}

#wizardThemes div {
  font-weight: bold;
  margin-bottom: 5px;
}

#wizardThemes ul {
  padding: 0px;
  margin: 0px; 
}

#wizardThemes li {
  display: block;
  margin-bottom: 5px; 
  padding-left: 13px;
  line-height: 15px;
  color: #666666;	  
  background: url(../upload/bilder/linkPfeil.gif) no-repeat 0px 5px; 
}

#wizardThemes a, #wizardThemes a:link, #wizardThemes a:visited, #wizardThemes a:hover {
  color: #66324b;
  text-decoration: none;
}

#wizardThemes li.active {
  font-weight: bold;
  background: url(../upload/bilder/linkPfeilAktiv.gif) no-repeat 0px 5px; 	
}

#wizardThemes li.active a, #wizardThemes li.active a:hover {
  font-weight: bold;
}


/*  Wizard Progress (History+Ahead) List */
#wizardProgress {
  margin: 20px 0px 0px 0px;
}

#wizardProgress .header {
	font-weight: bold;
  margin-bottom: 5px;
}

#wizardProgress a, #wizardProgress a:link, #wizardProgress a:visited, #wizardProgress a:hover {
  color: #66324b;
  text-decoration: none;
}

#wizardProgress .progressItem {
  margin-bottom: 5px; 
  line-height: 15px;
}

#wizardProgress .progressItem .num {
  float: left;
  width: 20px;
  color: #666666;
}

#wizardProgress .progressItem .label {
  width: 140px;
  margin-left: 20px;
  text-align: left;
  color: #666666;
}


/* Wizard Result Item */
.wizardResultItem {
  position: relative;
  border: 1px solid #999999;
  padding: 0px;
  margin: 0px 0px 20px 0px;
  color: #000000;
  width: 495px;
}

.wizardResultItem .wizardResultItemMeta {
  float: left;
  width: 120px;
  height: 220px;
  border-right: 1px solid #999999;
}

.wizardResultItem .wizardResultItemMeta .wizardResultMetaItem {  
  border-bottom: 1px solid #999999;
  padding-bottom: 0px;
  margin: 5px;
  font-size: 10px;
  font-weight: normal;  
}
html>body .wizardResultItem .wizardResultItemMeta .wizardResultMetaItem {  
  padding-bottom: 4px;
}

.wizardResultItem .wizardResultItemMetaLabel {
  float: left;
  padding-left: 3px;
}

.wizardResultItem .wizardResultItemMetaValue {
  float: right;
  padding-right: 15px;
}

#wizardResults a.textLink, #wizardResults a.textLink:link, #wizardResults a.textLink:visited, #wizardResults a.textLink:hover {
  font-size: 10px;
  font-weight: normal;
  color: #000000;  
  text-decoration: none;
  padding-left:13px;
  background: url(../upload/bilder/link_arrow.gif) no-repeat 0px 2px; 
}
  
.wizardResultItem .wizardResultImgsL {
  margin: 5px;  
}

.wizardResultItem .wizardResultItemContent {
  margin-left: 120px;
  padding: 15px;
  border-left: 1px solid #999999;
}

.wizardResultItem .wizardResultItemTitle {
  font-size: 12px;
  font-weight: bold;
  border-bottom: 1px solid #999999;
  padding-bottom: 3px;
  margin-bottom: 5px;
}

#wizardResults a.titleLink, #wizardResults a.titleLink:link, #wizardResults a.titleLink:visited, #wizardResults a.titleLink:hover {
  font-size: 12px; 
  font-weight: bold;
  color: #000000;  
  text-decoration: none;
}

.wizardResultItem .wizardResultItemInfo {
  font-size: 10px;
  font-weight: normal;
  margin-bottom: 30px;
}
.wizardResultItem .wizardResultItemPropLabel {
  font-size: 11px;
  font-weight: bold;
}
.wizardResultItem .wizardResultItemPropValue {
  font-size: 10px;
  font-weight: normal;
  margin-bottom: 15px;
}

.wizardResultAccessoryPhoto {
  float: left;
  width: 120px;
  height: 90px;
}

.wizardResultAccessoryTitle {
  font-size: 12px;
  font-weight: bold;
  border-bottom: 1px solid #999999;
  padding-bottom: 3px;
  margin-bottom: 5px;
  margin-left: 135px;
}

.wizardResultAccessoryInfo {
  font-size: 10px;
  font-weight: normal;
  margin-bottom: 5px;
  margin-left: 135px;
}


/* Wizard Result Item as value with label only */
div.resultValueBox { 
  position: relative;
  width: 475px;
  margin: 0px 0px 20px 0px;
  padding: 5px 10px 5px 10px;
  color: #000000;
  border: 1px dotted #999999;  
}

div.resultValueBox .resLabel { 
  font-size: 12px;
  font-weight: bold;
  color: #D94B52;  
}

div.resultValueBox .resValue { 
  margin-left: 20px;
  font-size: 12px;
  font-weight: bold;
  color: #D94B52;  
}


/* Wizard Result Box */
.wizardResultBox {
  border-top: 1px solid #999999;
  border-left: 1px solid #999999;
  border-right: 1px solid #999999;
  border-bottom: none;
  width: 495px;
  margin-bottom: 20px;
}

.wizardResultBox .wizardResultBoxTitle {
  border-bottom: 1px solid #999999;
  background-color: #CCCCCC;
  padding: 5px 10px 5px 10px;  
}

.wizardResultBox .wizardResultBoxContent {
  position: relative;
  border-top: 1px solid #FFFFFF;  /* without it IE doesn't show the bottom border */
  border-bottom: 1px solid #999999;
  padding: 10px 5px 10px 5px;  
}

.wizardResultBox .wizardResultBoxContent table { 
  border: none;
  border-collapse:collapse;
  border-spacing: 0px;
}

.wizardResultBox .wizardResultBoxContent td {
  vertical-align: top;
}


/* Wizard Result Config */
#wizardResultConfig {
  margin-top: 15px;
  position: relative;
}

#wizardResultConfig .wizardResultBoxContent .row {
  clear: left;  /* GJ 01.05.2007 - was both */
  position: relative;
  margin: 5px 5px 5px 5px;
}

#wizardResultConfig .wizardResultBoxContent .configLabel {
/*  position: absolute; */
  float: left;
  top: 0px;
  left: 0px;
  width: 155px;
  font-size: 10px;
  font-weight: normal;
  color: #999999;
  line-height: 12px;
  margin-top: 1px;
  margin-bottom: 2px;
}
html>body #wizardResultConfig .wizardResultBoxContent .configLabel {
  margin-bottom: 7px;
}

#wizardResultConfig .wizardResultBoxContent .configValue {
/*  position: relative; */
  padding-left: 160px;
  font-size: 10px;
  font-weight: normal;
}

#wizardResultConfig a, #wizardResultConfig a:link, #wizardResultConfig a:visited, #wizardResultConfig a:hover {
  font-size: 10px;
  font-weight: normal;
  color: #666666;
  text-decoration: none;
}


/* Wizard Result Items */

table#wiz_productlist {
   width: 715px;
   text-align: left;
   vertical-align: top;   
   color: #000000;
   background-color: #BCC0CF;
}

table#wiz_productlist .head {
   color: white;
   background-color: #BCC0CF; 
   white-space: nowrap;
   padding: 5px;
   border: 1px solid #BCC0CF;
}

table#wiz_productlist .head_extra {
  display: none;
}

table#wiz_productlist .image {
   background-color: #F4F5F9;   
   padding: 5px;
   border-left: 1px solid #BCC0CF;
   border-right: 1px solid #BCC0CF;
   border-bottom: 1px solid #BCC0CF;
}

table#wiz_productlist .articletext {
   width: 100%;
   padding: 5px;
   background-color: #F4F5F9;   
   border-bottom: 1px solid #BCC0CF;
}

table#wiz_productlist .articletext a, table#wiz_productlist .articletext a:hover {
  color: #000000;
  font-weight: bold;
}

table#wiz_productlist .articletext .flow_text {
  min-height: 45px;
  padding-bottom: 5px;
}

table#wiz_productlist .articletext .icons {
  clear: both;
  margin-bottom:5px;
}

table#wiz_productlist .articletext .icons img {
  margin-right:5px;
}

table#wiz_productlist .min_height {  /* emulate min-height by putting an invisible div */
  height: 45px;
  float:  left;
  width:  0px;
  display: block;
  visibility: hidden;
}
* html table#wiz_productlist .min_height {  /* IE up to 6 */   /*  IE does not display elements with width=0 */
  width: 1px;
}
*+html table#wiz_productlist .min_height {  /* IE7 */
  width: 1px;
}

#wiz_productlist .article_508a_p {
  display: none;
}

#wiz_productlist .icons_p  {
  display: none;
}


table#wiz_productlist .artnr {
   white-space: nowrap; 
   font-weight: bold;
   padding: 5px;   
   color: #000000;
   background-color: #F4F5F9;
   border-left: 1px solid #BCC0CF;
   border-right: 1px solid #BCC0CF;
   border-bottom: 1px solid #BCC0CF;
}

table#productlist .new_article {
}

#productlist .new_article {
  margin-left: 0px;
  margin-top: 4px;
}

#productlist .article_508a {
  margin-top: -10px;
  margin-left: 0px;
}


/* Wizard Result Legend */
#wizardResultLegend .wizardResultBoxContent p {
  margin: 12px 5px 12px 5px;
}

#wizardResultLegend .wizardResultBoxContent .legendSymbol {
  padding-left: 6px;
  margin: 2px 5px 2px 5px;
  background-color: #999999;
  color: #FFFFFF;
  font-size: 10px;
  font-weight: normal;
  width: 51px;
}
html>body #wizardResultLegend .wizardResultBoxContent .legendSymbol {
  width: 50px;
}

#wizardResultLegend .wizardResultBoxContent .legendText {
  font-size: 10px;
  font-weight: normal;
  line-height: 11px;
  width: 160px;
  margin-top: 4px;
}


/* Wizard Result Batch */
div.wizardBatch {
  height: 35px;
  font-size: 10px;
  font-weight: normal;
  line-height: 11px;
  color: #666666;
  text-align: center;
  margin-bottom: 10px;
}

div.wizardBatch .batchItems {
  height: 18px;
  margin: auto;  
}

div.wizardBatch .batchItems .batchItem {
  float: left;
  width: 22px;
  height: 13px;
  margin-right: 5px;
  text-align: center;
  vertical-align: middle;
  border: 1px solid #CCCCCC;
  cursor: pointer;
}

div.wizardBatch .batchItems .batchItemSelected {
  border-color: #330000;
  background-color: #330000;
  color: #FFFFFF;
}

div.wizardBatch .batchItems div.batchImgItem {
  float: left;
  height: 15px;
  margin-right: 5px;
  border: none;
}
div.wizardBatch .batchItems div.batchImgItem img {
  border: none;
}

div.wizardBatch .batchInfo {
  clear: both;
  height: 15px;
  margin-right: 5px;
  margin-top: 1px;
}


/* *** Product Wizard End *** */