@CHARSET "UTF-8";

/**
 *     CONFIGURATOR DEFAULT STYLE
 *  Based on: #configurator
 *  Overwrite: #configurator #configuratorID
 */
 
html,
body {
	height: 100%;
}

/* the mighty clearfix */
.clearfix:after {  /* für Firefox, IE8, Opera, Safari, etc. */
    content: ".";  
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}
* + html .clearfix { /* für IE7 */
    display: inline-block;
}
* html .clearfix { /* für IE6 */
    height: 1%;
}

/**
 *     ITEM DEFAULT CI 
 */
body {
    padding: 0;
    margin: 0;
}

body #configurator {
    font-family: Arial,Helvetica,Verdana,sans-serif;
    font-size: 11px;
    font-style: normal;
    font-weight: normal;
    line-height: 17px;
    text-align: left;
    color: #333333;
    height: 100%;
}

#configurator h1 {
    font-size: 32px;
    line-height: 48px;
    color: #666;
}

#configurator .headline,
#configurator h2, #configurator h3 {
    font-size: 16px;
    line-height: 18px;
    font-weight: bold;
    color: #666666;
}

#configurator .subline,
#configurator h4, #configurator h5, #configurator h6 {
    font-weight: bold;
}

#configurator a {
    color: #666666;
}

#configurator table tr td {
    line-height: 1.5em;
}
/* overwrite styles.css */
#configurator td {
    color: #333333;
}

#configurator .thin {
    font-size: 11px;
    /*line-height: 17px;*/
    font-weight: normal;
}

#configurator .overlay,
#cadOverlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: #666666;
    opacity: 0.8;
    z-index: 10000;
}
#configurator .closeButton {
    position: absolute;
    top: 10px;
    right: 10px;
    width: 16px;
    height: 16px;
    padding: 0;
    margin: 0;
    cursor: pointer;
    background: transparent url('img/close.png') scroll no-repeat 0 0;
}

#configurator .selHead {
    font-weight: bold;
    line-height: 19px;
    margin-bottom: 20px;
}
#configurator .selHead .explaination {
    font-weight: normal;
    color: #666666;
    font-size: 10px;
    line-height: 17px;
    text-align: left;
}

#configurator div.buttons {
    margin-top: 10px;
}
#configurator div.buttons .icon:HOVER {
    color: #ed1c29;
}

/** 
 *     OVERWRITTEN STYLES FROM stylesheets.css 
 */
ul {
    font-size: inherit !important;
}

/**
 *      HEADER 
 */
#configurator .conf_header {
    min-width: 855px !important;
    white-space: nowrap;
}
#configurator .conf_header .left {
    display: block;
    height: 75px;
    width: 300px;
}
#configurator .conf_header .text {
    color: #666;
    float: left;
    height: 75px;
    margin: 0 0 0 10px;
}
#configurator .conf_header .text h1 {
    margin: 19px 0;
}

/**
 *     LEFT-NAVIGATION
 */
#configurator #content_left {
    float: left;
    width: 280px;
    padding: 10px;
    margin: 0 10px 10px 0;
    background-color: #EFEFEF;
}

#configurator #content_left ul.config {
    padding: 0;
    margin: 0;
}
#configurator #content_left ul.config li {
    margin-left: 0;
}
#configurator #content_left ul.config li.head {
    line-height: 15px;
    list-style: none outside none;
    padding: 3px 0;
    margin: 0 0 0 15px;
    font-size: 11px; /* for IE 6*/
    border-bottom: 1px solid #CCCCCC;
}
#configurator #content_left ul.config li.head a:hover {
    color: #ed1c29;
    font-weight: bold;
}
#configurator #content_left ul.config li.head span {
    display: inline-block;
    vertical-align: top;
    width: 49%;
}
#configurator #content_left li.head.act {
    color: #ed1c29;
    list-style: none outside url('img/MenutreeOpened_silverStyle.png') !important;
}
#configurator #content_left li.head.act .stepValue,
#configurator #content_left li.head.act .thin {
    font-weight: bold;
    color: #ed1c29;
    vertical-align: top;
}
#configurator #content_left li.head a {
    display: block;
    color: #666;
    text-decoration: none;
}
#configurator #content_left li.head.act a {
    font-weight: bold;
    color: #ed1c29;
}
#configurator #content_left ul.config li ul {
	margin-left: 0;
}
#configurator #content_left ul.config li ul.field-properties {
	padding-left: 1.5em;
	margin: 0 0 4px;
}
#configurator #content_left ul.config li ul.field-properties li {
	list-style: none outside none;
}
#configurator #content_left ul.config li a:hover ul.field-properties li {
	color: #ed1c29;
}
#configurator #content_left ul.config li ul.field-properties li .stepValue,
#configurator #content_left ul.config li ul.field-properties li .thin {
    font-weight: bold;
    /*color: #666;*/
}
#configurator #content_left .head {
    font-weight: bold;
    margin: 0 0 5px; 
}

#configurator #content_left div.preview {
    position: relative;
    margin: 0 auto 20px;
    width: 150px;
    height: 150px;
    overflow: hidden;
    border: 1px solid #E1E1E1;
    background: none no-repeat scroll 0 0 #FFFFFF;
}
#configurator #content_left div.preview img {
    position: absolute;
    top: 0;
    left: 0;
    width: 150px;
    height: 150px;
}

#configurator #content_left .box {
    border: none;
    margin: 0 0 10px; 
}
#configurator #content_left .box td.left {
    text-align: right; 
    font-weight: bold;
}
#configurator #content_left .box td.right {
    float: none;
    font-size: 10px;
    vertical-align: bottom;
}

#configurator #content_right {
    min-width: 525px !important;
    padding: 10px;
    margin-left: 310px;
    border-bottom: 1px solid #E1E1E1;
    border-left: 1px solid #E1E1E1;
    border-top: 1px solid #E1E1E1;
    background: none repeat scroll 0 0 #FFFFFF;
}
#configurator #content_right > * {
    max-width: 932px !important;
}
#configurator #content_right .prod_head {
    display: block;
    font-weight: bold;
    margin: 0 0 10px;
}
#configurator th {
    text-align: left;
    font-weight: bold;
    margin: 0 0 10px;
}

#configurator .footer_text {
    margin: 1em 0;
}
#configurator .footer_text.left {
    padding: 0 0 0 10px;
    clear: both;
}
#configurator .footer_text.right {
    padding: 0 10px 0;
}

/* default clickable elements */
#configurator label, 
#configurator a, 
#configurator select, 
#configurator button, 
#configurator input,
#configurator .clickable {
    cursor: pointer;
}

/**
 *     FOOBAR 
 */
#configurator .links {   
    background: none repeat scroll 0 0 #EFEFEF;
    border: 1px solid #666;
    color: #666;
    font-size: 12px;
    font-weight: bold;
    overflow: hidden;
    margin: 0 0 20px;
    padding: 5px 5px 0;    
}

#configurator .links input,
#configurator .links a,
#configurator .icon {
    color: #666;
    display: block;
    float: left;
    font-size: 11px;
    font-weight: normal;
    height: 18px;
    line-height: 18px;
    margin: 0 12px 5px 0;
    padding: 0 0 0 24px;
    background-repeat: no-repeat;
    background-attachment: scroll;
    background-position: 0 0;
    background-color: transparent;
}

#configurator .icon.disabled {
    opacity: 0.5;
}

#configurator .icon.reset {
    background: url("img/icon/small/arrow_redo.png") no-repeat scroll 0 0 transparent;
}
#configurator .icon.save {
    background: url("img/save_config.gif") no-repeat scroll 0 0 transparent;
}
#configurator .icon.save.deactivated {
    cursor: default;
    cursor: no-drop;
}
#configurator .icon.cadButton {
    background: url("../cadBox/img/icon_cad_cube.gif") no-repeat scroll 0 0 transparent;
}
#configurator .icon#addAccessory {
    background-image: url("img/icon_add_basket.png");
}
#configurator .icon.finish {
    float: right;
    background-image: url("img/flag_finish.png");
}

#configurator .links a:hover {
    color: #ed1c29;
}

#configurator .left {
    float: left;
}
#configurator .right {
    float: right;
}

/**
 *     LANGSWITCHER
 */
form#change_lang {
    display: block !important;
}
form#change_lang select {
    float: right;
    width: 50%;
}
form#change_lang span {
    float: left;
}
.langswitcher.active {
    font-weight: bold;
}

/**
 *     DOWNLOADCENTER
 */
#itemCadBoxDownloadCenter {
    behavior: url(PIE.htc); /* for border-radius on this elem */
    
    display: none;
    width: 800px;
    height: 600px;
    padding: 10px;
    position: absolute;
    top: 0;
    left: 0;
    overflow: hidden;
    background-color: #FFFFFF;
    border: 1px solid #CCCCCC;
    -webkit-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
    z-index: 10001;
}
#itemCadBoxDownloadCenter iframe {
    position: relative;
    top: 0;
    left: 20px;
    width: 750px;
    height: 590px;
    padding: 0;
    margin: 5px;
    border: none;
}
#itemCadBoxDownloadCenter .closeButton {
    position: absolute;
    top: 10px;
    right: 10px;
    width: 16px;
    height: 16px;
    padding: 0;
    margin: 0;
    cursor: pointer;
    background: transparent url('../cadBox/img/close.png') scroll no-repeat 0 0;
    z-index: 10002;
}

/* THE HIDDEN DATA-TUNNEL FOR DOWNLOADCENTER-DOWNLOAD-COUNTER */
iframe#downloadCenterFrame {
    position: absolute;
    top: -10000px;
    left: -10000px;
}

/**
 *     USER-OPTIONS
 */
#configurator #content_left .box ul.user-options {
    padding: 0;
    margin: 0;
}
#configurator #content_left .box ul.user-options li {
    padding: 0;
    margin: 0;
    line-height: 18px;
    list-style: none outside none;
}
#configurator #content_left .box ul.user-options a.btn {
	width:221px;
}
.user-options .button-wrap {
	/*display:block;*/
	border: none;
}
.user-options .button-wrap a {
    position:relative;	
}
.user-options #mycounter-wrap {
    background-color: #888888;
    border-radius: 11px;
    color: #FFFFFF;
    font-size: 0.8em;
    font-weight: bold;
    padding: 1px 8px;
    position: absolute;
    right: 19px;
    top: -5px;
}

/* CONFIG-MANAGEMENT */
#configurator #confmgr-interface {
    display: none;
    position: absolute;
    width: 420px;
    padding: 10px; 
    margin: 0;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    border: 1px solid #666666;
    background-color: #FFFFFF;
}
#configurator #confmgr-interface .button.icon-forward {
    margin-left: 15px;
    float: right;
}
#configurator #confmgr-interface .head {
    font-weight: bold;
    margin: 0 0 5px; 
}
#configurator .box.confmgr-box {
    font-size: 11px;
    line-height: 17px;
    padding: 0 0 10px;
}
#configurator .box.confmgr-box p {
    padding: 0;
    margin: 17px 0;
}

div#errors {
	border: 1px solid red;
	background: none repeat scroll 0 0 #EFEFEF;
	padding: 10px;
	margin: 0 0 20px;
}
#errors div.head {
	margin: 0 0 5px 0;
}
#errors ul {
	list-style: none outside none;
    margin: 0;
    padding: 0;	
}
#errors ul li {
	margin: 0;
}
#errors ul li .key {
    
}
#errors ul li .value {
    
}

/**
 *     ICONS
 */
#configurator .loader {
    display: inline-block;
    width: 16px;
    height: 16px;
    padding: 0;
    margin: 0;
    background: url("/configurator/img/loading.gif") scroll no-repeat 0 0 transparent;
}

#configurator .radiotable {
    /*clear: both;*/
    display: block;
    /*height: 150px;*/
    margin: 0 20px 20px 0;
    width: 405px;
}
#configurator .radiotable > img,
#configurator .radiotable > div.img_space {
    display: block;
    float: left;
    /*height: 150px;*/
    width: 150px;
    margin: 0 10px 0 0;
}
#configurator .radiotable div.radio {
    float: left;
}
#configurator .radiotable div.radio > label {
    
}
#configurator .radiotable div.radio.disabled > label {
    color: #999999;
}
#configurator .radiotable div.radio > input[type="checkbox"],
#configurator .radiotable div.radio > input[type="radio"] {
    border: 0 none;
}

/**** THE INFO POPUP ****/
#configurator .iIP_Button {
    background: url("./img/icon/small/information.png") no-repeat scroll center center transparent;
    border: none;
    display: block;
    float: right;
    font-weight: bold;
    height: 16px;
    text-align: center;
    width: 16px;
    margin-top: 5px;
}
#configurator .iIP_Button.absolute {
    position: absolute;
    right: 20px;
    top: 15px;
}
#configurator .prod_title .iIP_Button {
	padding: 0 5px 0;
}
#configurator label.high .iIP_Button {
    margin: 8px -5px 0 0;
    padding: 0;
}
#configurator .boxImg .iIP_Button {
    padding: 1px;
    border: 1px solid #EFEFEF;
    
    float: none;
    position: absolute;
    bottom: 3px;
    right: 3px;
}

#configurator #itemInformationPopup {
    padding: 15px 0;
}
#configurator #itemInformationPopup .left {
    float: left;
    width: 222px;
    padding: 5px 0; 
    background-color: #EFEFEF;
}
#configurator #itemInformationPopup .left img {
    width: 200px;
    margin: 5px 10px;
    border: 1px solid #FFFFFF;
}
#configurator #itemInformationPopup .right,
#configurator #itemInformationPopup .desc {
    float: none;
    padding: 10px;
    border: 1px solid #E1E1E1;
    border-style: solid none solid solid;
    margin-left: 232px;
    
    color: #666;
    font-weight: bold;
}
#configurator #itemInformationPopup .desc {
    margin-left: 15px;
}
#configurator #itemInformationPopup p {
    padding: 0;
    margin: 0;
}
#configurator #itemInformationPopup ul {
    list-style: none outside none;
    margin: 0 0 10px 0;
    padding: 0;
}
#configurator #itemInformationPopup ul li {
    background: url("/images/icons/mainContent-li-bg-square.gif") no-repeat scroll 0 6px transparent;
    padding: 0 0 0 10px;
    margin: 0;
}
#configurator #itemInformationPopup h3 {
    font-weight: bold;
    text-align: center;
    color: #333333;
}
#configurator #itemInformationPopup h4 {
    background-color: #EF1C25;
    color: #FFFFFF;
    display: inline-block;
    font-weight: bold;
    padding: 4px 8px;
    margin-bottom: 10px;
}

/*********************************************/

/** CONTENT BOXES ****************************/

#configurator .contentBox {
    border: 1px solid #CCCCCC;
    border-radius: 5px 5px 5px 5px;
    overflow: hidden;
}

#configurator .contentBox-headline {
    background: linear-gradient(#FFFFFF, #DDDDDD) repeat scroll 0 0 rgba(0, 0, 0, 0) !important;
    border-bottom: 1px solid #CCCCCC;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
    height: 29px;
}

#configurator .contentBox-headline h1 {
    display: inline-block;
    font-size: 12px;
    font-weight: bold;
    height: 17px;
    margin: 5px 0 0 8px;
    line-height: normal;
}

#configurator .contentBox .contentBox-content .contentBox-contentInnerWrap {
    display: inline-block;
    margin: 10px;
    overflow: hidden;
}

#configurator .contentBox label {
    display: block;
    margin: 0 !important;
    width: auto !important;
}

#configurator .contentBox input {
    width: 260px !important;
    float: none !important;
    margin: 0 !important;
    font-size: 11px !important;
    
}

#configurator .contentBox fieldset {
    border: 0 none;
    margin: 0;
    padding: 0 0 10px;
    width: 265px !important;
}

#configurator .contentBox ul {
	list-style: none inside none;
    margin: 0;
    padding: 0;
}

#configurator .contentBox ul li {
    margin: 0;
    padding: 0 0 0 20px;
    background: url("./img/mainContent-li-bg.gif") no-repeat scroll 0 0.1em rgba(0, 0, 0, 0);
}

/*********************************************/


/** Custombox modal window *******************/

.custombox-modal {
	background-color: #fff;
	border: 1px solid #000;
	border-radius: 10px;
	box-shadow: 0 8px 6px -6px black;
	/*display: none;*/
}

.custombox-modal button.close {
	background: none repeat scroll 0 0 rgba(0, 0, 0, 0);
	border: 0 none;
	cursor: pointer;
	padding: 0;
}

.custombox-modal .close {
	position: absolute;
	right: 4px;
	top: -1px;
	color: #000;
	float: right;
	font-size: 36px;
	font-weight: 700;
	line-height: 1;
	opacity: 0.2;
	text-shadow: 0 1px 0 #fff;
}

.custombox-modal .close:focus,
.custombox-modal .close:hover {
	color: #000;
	cursor: pointer;
	opacity: 0.5;
	text-decoration: none;
}

.custombox-modal .sr-only {
	border: 0 none;
	clip: rect(0px, 0px, 0px, 0px);
	height: 1px;
	margin: -1px;
	overflow: hidden;
	padding: 0;
	position: absolute;
	width: 1px;
}

.custombox-modal .title {
	/*border-bottom: 1px solid #ccc;*/
	font-size: 18px;
	line-height: 18px;
	padding: 20px 20px 15px;
}

.custombox-modal iframe {
	border: 0 none;
}

.custombox-modal .iframe_wrapper {
	padding-bottom: 20px;
}

/*********************************************/