/* attributeGroup */

#configurator .attributeGroup
{
  width: 400px;
  margin-bottom: 20px;
}

#configurator .attributeGroupName
{
  width: 400px;
  height: 30px;
}

#configurator .groupName
{
  position: absolute;
  top: 0;
  left: 0;
  width: 370px;
  height: 27px;
  background: #dee6f1 url(../media/configurator/groupName_bg.jpg) repeat-y;
}

#configurator .groupName .groupNameText
{
  font: bold 14px Arial;
  color: #fff;
  line-height: 25px;
  padding-left: 3px;
}

#configurator .groupNameButton
{
  position: absolute;
  top: 0;
  left: 373px;
  width: 27px;
  height: 27px;
  background: #7fa1c9 url(../media/configurator/groupNameButton_bg.jpg) repeat-y;
}

/* attribute */

#configurator .attribute
{
  margin-bottom: 3px;
}

#configurator .color-0 .attributeData, .color-0 .attributeButton
{
  background-color: #ebf0f7;
}

#configurator .color-1 .attributeData, .color-1 .attributeButton
{
  background-color: #d8e2ef;
}

#configurator .attributeData
{
  width: 352px;
  padding: 1px 9px;
}

#configurator .attributeButton
{
  width: 27px;
  height: 27px;
  position: absolute;
  top: 0;
  left: 373px;
}

#configurator .attributeButton
{
  background-image: url(../media/configurator/info_button.png);
  background-repeat: no-repeat;
  background-position: 2px 2px;
}

#configurator .groupNameButton .open
{
  background-image: url(../media/configurator/group_button_open.gif);
  background-repeat: no-repeat;
  background-position: 8px 8px;
}

#configurator .groupNameButton .close
{
  background-image: url(../media/configurator/group_button_close.gif);
  background-repeat: no-repeat;
  background-position: 8px 8px;
}

#configurator .attributeImg
{
  border: 1px solid #759ac5;
  margin-right: 5px;
  margin-bottom: 3px;
}

#configurator .attributeDescriptionSmall
{
  width: 170px;
  margin-left: 9px;
}

#configurator .attributeDescriptionBig
{
  width: 340px;
}

#configurator .attributeDescription
{
  font: normal 11px Arial;
  color: #3f4042;
}

#configurator .attributeDescription h2
{
  font: bold 12px Arial;
  color: #004494;
  letter-spacing: 0.1em;
}

#configurator .attributeName
{
  width: 270px;
  float: left;
  min-height: 20px;
  padding-top: 5px;
}

#configurator .attributeValue
{
  width: 80px;
  float: left;
  text-align: right;
  color: #759ac5;
  padding-top: 5px;
}

#configurator .attributeDetails
{
  padding-bottom: 8px;
  font: normal 11px Arial;
  color: #3f4042;
}

#configurator .zoomHolder
{
  display: block;
  position: absolute;
  top: 1px;
  left: 1px;
  width: 20px;
  height: 20px;
  background: #fff;
  border-right: 1px solid #759AC5;
  border-bottom: 1px solid #759AC5;
}

#configurator .zoomIcon
{
  margin-top: 2px;
  margin-left: 2px;
}


.cursel {
  position: absolute;
  width: 65px;
  top: 0;
  right: 0;
  text-align: right;
}



/* sidebar */

.sidebar h3
{
  font-family: Arial,Verdana,Helvetica,sans-serif;
  font-size: 12px;
  color: #004494;
  margin-bottom: 5px;
  letter-spacing: 1px;
  font-weight: bold;
}

.sidebar #configurator-compilation *
{
  line-height: 1.3em;
}

.sidebar .attributeGroup
{
  padding-bottom: 8px;
}

.sidebar .attribute
{
  padding: 3px 0;
}

.sidebar .attributeName
{
  font-family: Arial,Verdana,Helvetica,sans-serif;
  font-size: 12px;
  color: #cb2d3d;
}

.sidebar .price
{
  font-family: Arial,Verdana,Helvetica,sans-serif;
  font-size: 11px;
  color: #7e7e7e;
}

.sidebar .hintText
{
  font-family: Arial,Verdana,Helvetica,sans-serif;
  font-size: 10px;
  color: #7698c0;
}

.sidebar .totalPrice
{
  font-family: Arial,Verdana,Helvetica,sans-serif;
  font-size: 12px;
  font-weight: bold;
  color: #004494;
}

.sidebar .print-button
{
  margin-top: 15px;
  height: 48px;
}

.sidebar .print-button a
{
  font: bold 12px Arial;
  color: #004494;
}






/* print-template */

#configurator-print h2
{
  font-size: 35px;
  font-weight: normal;
  margin: 0;
  
}

#configurator-print h3
{
  font-family: Arial,Verdana,Helvetica,sans-serif;
  font-size: 12px;
  color: #004494;
  margin-bottom: 5px;
  letter-spacing: 1px;
  font-weight: bold;
}

#configurator-print h4
{
  font-family: Arial,Verdana,Helvetica,sans-serif;
  font-size: 14px;
  color: #004494;
  margin-bottom: 5px;
  letter-spacing: 1px;
  font-weight: bold;
}

#configurator-print #configurator-compilation *
{
  line-height: 1.3em;
}

#configurator-print #configurator-compilation div:first-child
{
  border-top: none !important;
}

#configurator-print .attributeGroup
{
  /*padding-bottom: 8px;*/
  border-top: 2px solid #000;
}

#configurator-print .attribute
{
  padding: 3px 0;
  border-top: 1px solid #000;
}

#configurator-print .attributeGroup h4 + div.attribute
{
  border-top: none !important;
}

#configurator-print .attributeName
{
  font-family: Arial,Verdana,Helvetica,sans-serif;
  font-size: 14px;
  color: #cb2d3d;
}

#configurator-print .price
{
  font-family: Arial,Verdana,Helvetica,sans-serif;
  font-size: 12px;
  color: #7e7e7e;
  float: right;
}

#configurator-print .attributeDescription
{
  font-family: Arial,Verdana,Helvetica,sans-serif;
  font-size: 12px;
  color: #7e7e7e;
  /*float: left;*/
}

#configurator-print .hintText
{
  font-family: Arial,Verdana,Helvetica,sans-serif;
  font-size: 10px;
  color: #7698c0;
}

#configurator-print .totalPrice
{
  font-family: Arial,Verdana,Helvetica,sans-serif;
  font-size: 16px;
  font-weight: bold;
  color: #004494;
  margin-top: 5px;
}

#configurator-print .totalSum
{
  text-align: right;
}

#configurator-print img
{
  display: none;
}

#configurator-print .attributeImage img
{
  display: inline-block;
}








/* Modal */

.modal {
  width: 410px;
  margin-left: 10px;
  margin-top: 10px;
}

.modal .selected-attribute {
  margin-bottom: 10px;
  padding: 10px;
}

.modal .selected-attribute h4 {
  color: #004494;
  font: bold 12px Arial;
}

.modal .selected-attribute span.small {
  color: #004494;
  font: bold 10px Arial;
}

.modal .selected-attribute span.small-hint {
  color: #2e312f;
  font: bold 10px Arial;
}

.modal .description {
  color: #cb2d3d;
  font: 11px Arial;
}

.modal .hint {
  color: #2e312f;
  font: bold 11px Arial;
}

.modal .required-attribute {
  background: #e5f3eb;
  width: 390px;
  margin-bottom: 10px;
  padding: 10px;
}

.modal .attribute-name {
  color: #2e312f;
  font: bold 12px Arial;
}

.modal .price {
  color: #7a827d;
  font: 10px Arial;
}

.modal .excluded-attribute {
  background: #faeaeb;
  width: 390px;
  margin-bottom: 10px;
  padding: 10px;
}

.modal .submit {
  background: #013a7d;
  border: 1px solid #013068;
  color: #fff;
}

.modal .line {
  margin: 8px 0;
}

.modal .modalMessageField {
  color: #cb2d3d;
  font: 11px Arial;
}



/* --------------------------------------------------------------- */
.configuratorFormHolder {
  padding: 15px;
}

/* Schriftart ---------------------------------------------------- */
form * {
  font-family: Arial;
}

input, textarea {
  font-family: Arial;
  font-size: 12px;
  color: #265681;
}

/* Größenangaben ------------------------------------------------- */

input.normal {
  width: 190px;
  height: 16px;
  padding: 5px;/*
  width: 200px;
  height: 26px;*/
}

input.button {
  width: 200px;
  height: 26px;
}

textarea.big {
  width: 410px;
  height: 150px;
}

/* Formularblöcke ------------------------------------------------ */

.input-box {
  float: left;
  margin-right: 10px;
  margin-bottom: 15px;
  display: inline;
}

.normal-box {
  width: 200px;
}

/* Darstellung der Felder ---------------------------------------- */
/*
input.text {
  padding: 5px;
}
*/
.input-box.required label, .input-box.soft label {
  font-size: 10px;
  /*text-transform: uppercase;*/
}

.input-box.required label {
  color: #265681;
}

.input-box.soft label {
  color: #92aac0;
}

.input-box.required input, .input-box.required textarea, img.captcha {
  border: 1px solid #b7c6d5;
}

.input-box.soft input, .input-box.soft textarea {
  border: 1px solid #dbe2ea;
}

input.button
{
  padding: 3px 7px;
  background: #e9eef2;
  cursor: pointer;
  line-height: 100%;
  text-transform: uppercase;
  letter-spacing: 0.5em
}

/* Fehlerbehandlung ---------------------------------------------- */

.input-box input.error {
  border: 1px solid #CC0006;
}

.input-box label.error {
  color: #CC0006;
  display: block;
}

.msg
{
  color: #CC0006;
  /*font-weight: bold;*/
}



/* Bitte warten Screen */

#waiting
{
  /*display: none;*/
  width: 200px;
  height: 150px;
  background: #fff;
  position: absolute;
  top: 50%;
  left: 50%;
  margin-top: -50px;
  margin-left: -50px;
}