/************************** Basic Page Setup ***************************/ #carConfigurator { font-size: 11px; line-height: 133.33%; color: #434343; } #carConfigurator ul, #carConfigurator ol, #carConfigurator li { float: left; margin: 0px; padding: 0px; border: none; } /* * standard links are underlined and hover without underline, */ #carConfigurator li.section a { color: #141414; font-size: 11px; text-decoration: underline; } #carConfigurator li.section a:hover { text-decoration: none; } /****** Inits on js available ****** * the class jsReady is applied to * * the body tag by JS on DOM ready, * * which makes it an indicator for * * the availability of JS */ noscript { display: block; padding: 70px 37px 20px 37px; font-size: 14px; } noscript h1 { font-size: 18px; font-weight: bold; color: red; margin: 0em 0em 1em; } noscript p { margin: 0em 0em 1em; } /* Hide the noscript area if JS is available * (IE seems to reserve space for the noscript when * set to display: block, even if JS is on) */ .jsReady noscript { display: none; } #carConfigurator { visibility: hidden; } /* show the carConfigurator if, and only if JS is up and ready */ .jsReady #carConfigurator { visibility: visible; } /************************** Button Groups ***************************/ #carConfigurator ul.buttonGroup { list-style-type: none; padding: 0px; margin: 0px 0px 20px;} #carConfigurator ul.buttonGroup li { padding: 0px; float: none; } #carConfigurator #carPicWrp ul.buttonGroup { width: 250px; list-style-type: none; padding: 0px; margin: 0px;} #carConfigurator #carPicWrp ul.buttonGroup li a { float: left; clear: left; } #carConfigurator #carPicWrp ul.buttonGroup .button.cta1 .corner { background-image: url(/assets/images/global/buttons/cta1/corners-cta1-configurator.gif); } #carConfigurator #carPicWrp ul.buttonGroup .button.cta2 .corner { background-image: url(/assets/images/global/buttons/cta2/corners-cta2-configurator.gif); } #carConfigurator #carConfFooter ul.buttonGroup { float: right; text-align: right; width: 426px; } #carConfigurator #carConfFooter ul.buttonGroup .button { float: right; clear: right; } #carConfigurator #carConfFooter .service { width: 926px; } #carConfigurator #carConfFooter .service li { margin-left: 45px; margin-right: 0px; float: right; } /* * Formular Definitionen */ #carConfigurator label { margin-left: 0px; vertical-align: top; } #carConfigurator input.checkbox, #carConfigurator input.radio { float: left; margin-left: 6px; margin-right: 9px; margin-top: 1px; } /************************** Module Definitionen ***************************/ #carConfigurator .module { float: left; } #carConfigurator .module { margin-left: 37px; } /* module widths */ #carConfigurator .full { width: 926px; } #carConfigurator .half { width: 444px;} /**************************** CarConfigurator Components *****************************/ /* Picture Wrapper */ #carConfigurator #carPicWrp { width: 1000px; height: 340px; background-image: url(/assets/images/global/carconfigurator/bg/bg_slider.gif); padding: 0px; margin-bottom: 20px; position: relative; } /* prices */ #carConfigurator .xPrice { color: #6D6D6F; } #carConfigurator #carPicWrp .price span { display: block; } #carConfigurator #bottomSum .price { float: right; line-height: 50px; margin-right: 20px; } #carConfigurator #bottomSum .price span { float: right; } #carConfigurator #bottomSum .price .xPrice { margin-right: -8px; } /* sums */ #carConfigurator .sum h1, #carConfigurator .sum h1 .price { font-size: 18px; font-weight: bold; } #carConfigurator .sum h1 em { font-style: normal; } /* top sum */ #carConfigurator #topSum { padding: 70px 37px 20px 37px; } #carConfigurator #topSum h1 { line-height: 120%; margin-bottom: 20px; } /* bottom Sum */ #carConfigurator #bottomSum h1 { height: 46px; line-height: 50px; margin: 0px 0px 10px 0px; border: 2px solid #909090; border-width: 2px 0px; background-color: #f5f5f5; } #carConfigurator #bottomSum h1 span { margin-left: 10px; float: left; } #carConfigurator #bottomSum h1 span.info { font-size: 11px; font-weight: normal; float: right; line-height: 54px; } /* Headline and Links */ #carConfigurator #configHead { margin-bottom: 18px; } #carConfigurator #configHead h2 { font-size: 11px; font-weight: bold; float: left; } #carConfigurator #configHead .links { float: right; } /* Service Links */ #carConfigurator .service { float: right; margin: 0px 37px 0px 0px; } #carConfigurator .service ul { float: right; background-image: none; } #carConfigurator .service ul li { margin-right: 45px; float: left; } #carConfigurator .service ul li.last { margin-right: 0px; } #carConfigurator .service ul a { display: block; line-height: 16px; } #carConfigurator #carConfFooter .service ul { margin-bottom: 20px; } #carConfigurator .mail { background: url(/assets/images/global/carconfigurator/icons/icon_sendconfig.gif) no-repeat 0px 50%; padding-left: 22px; } #carConfigurator .print { background: url(/assets/images/global/carconfigurator/icons/icon_printconfig.gif) no-repeat 0px 50%; padding-left: 25px; } /* expand/collapse-all links */ #carConfigurator .toggleListView { float: left; margin-bottom: 10px; } #carConfigurator .toggleListView li { float: left; } #carConfigurator .toggleListView li.first { margin-right: 55px; } #carConfigurator .toggleListView span.utilityLink { visibility: hidden; } /* car image */ #carConfigurator #rimLayer { position: absolute; top: 70px; right: 150px; z-index: 11; display: none; } #carConfigurator .car { position: absolute; top: 70px; right: 150px; display: none; z-index: 10; } #carConfigurator .show #rimLayer { display: block; } #carConfigurator .show .car { display: block; } /* car perspective navigation */ #carConfigurator #carNavigation { position: absolute; bottom: 11px; right: 37px; z-index: 15; } #carConfigurator #carNavigation div { float: left; cursor: pointer; background-image: url(/assets/images/global/carconfigurator/carnavi/carNavigation.gif); background-repeat: no-repeat; overflow: hidden; } #carConfigurator #carNavigation #frontViewBtn { width: 40px; height: 23px; } #carConfigurator #carNavigation #sideViewBtn { width: 59px; height: 23px; background-position: -40px 0px; } #carConfigurator #carNavigation #backViewBtn { width: 39px; height: 23px; background-position: -99px 0px; } #carConfigurator #carNavigation .active { cursor: auto;} #carConfigurator #carNavigation #frontViewBtn.active { background-position: 0px -23px; } #carConfigurator #carNavigation #sideViewBtn.active { background-position: -40px -23px; } #carConfigurator #carNavigation #backViewBtn.active { background-position: -99px -23px; } /* carConfFooter */ #carConfigurator #carConfFooter { float: none; } /************** Sections ***************/ #carConfigurator .config { width: 926px; overflow: hidden; } #carConfigurator .config li { float: left; width: 100%;} #carConfigurator .section h1.sectionHead { font-size: inherit; line-height: 30px; height: 30px; background-color: #E0E0E0; border-top: 1px solid #909090; border-bottom: 1px solid #909090; border-width: 1px 0px; margin: 0px; } #carConfigurator .section h1.sectionHead span { font-size: 11px; float: right; margin-right: 20px; } #carConfigurator .section h1.sectionHead span.xPrice { float: right; margin-right: 10px; } #carConfigurator .section h1.sectionHead .sectionName { padding-left: 19px; margin-left: 7px; margin-right: 10px; background-image: url(/assets/images/global/carconfigurator/icons/icon_li_carconfigurator_open.gif); background-position: 0px 8px; background-repeat:no-repeat; float: left; } #carConfigurator .section h1.sectionHead .info { font-weight: normal; overflow: hidden; height: 25px; padding-right: 20px; display: block; float: none; } #carConfigurator .section { margin-bottom: 10px; } #carConfigurator .section.closed { margin-bottom: 3px; } #carConfigurator .section.closed h1.sectionHead span.sectionName { background-image: url(/assets/images/global/carconfigurator/icons/icon_li_carconfigurator_closed.gif); } #carConfigurator .section .sectionContent { margin-top: 10px; margin-bottom: 0px; float: left; padding-left: 5px; } #carConfigurator .sectionContent h3 { font-size: 11px; color: #626262; font-weight: bold; margin: 10px 10px 0px 20px; padding: 0px 1px 10px;} /* section partitions */ #carConfigurator .sectionContent .third, #carConfigurator .sectionContent .twothird, #carConfigurator .sectionContent .full { float: left; overflow: hidden; padding: 0px; margin: 0px; } #carConfigurator .sectionContent .third { width: 300px; } #carConfigurator .sectionContent .twothird { width: 600px; } #carConfigurator .sectionContent .full { width: 900px; } /************* Features **************/ #carConfigurator .features { float: left; padding-bottom: 10px; } #carConfigurator .features li { width: 284px; margin: 0px 0px 10px 16px; } #carConfigurator .features li, #carConfigurator .features li img, #carConfigurator .features li input { float: left; } #carConfigurator .features li.last { margin-bottom: 0px; } #carConfigurator .features li label img { margin-right: 6px; } /* create a block formatting context for all labels and textWrappers, allowing an optional floated image with variable width (text stays next to it as one block) */ #carConfigurator .features li label .txtWrp { padding-right: 6px; } #carConfigurator .features li label, #carConfigurator .features li label .txtWrp { display: block; overflow: hidden; cursor:pointer; } #carConfigurator .features li strong { font-weight: normal; margin-right: 7px;} #carConfigurator .features li.selected strong { font-weight: bold; } #carConfigurator .features li.selected .description { font-weight: normal; } /* subgrouped feature lists */ #carConfigurator .features li.group { } /* main price */ #carConfigurator .features li span { } /* main price */ #carConfigurator .features li span.xPrice { color: #6D6D6F; } /* additional currencies */ /* Full width features */ #carConfigurator .sectionContent .fullWidth .features li { width: 884px; } #carConfigurator .sectionContent .fullWidth .features li li { width: 100%; } /* Deaktivierte Features */ #containerGlobal #carConfigurator .features li.disabled, #containerGlobal #carConfigurator .features .disabled, #containerGlobal #carConfigurator .features .disabled * { color: #AAA; cursor: default !important; } #containerGlobal #carConfigurator .features .disabled img { opacity: 0.4; } /********************** *** Section Content *** ***********************/ #carConfigurator .selected { font-weight: bold; color: #343434; } /* Info messages */ #carConfigurator .sectionContent .infoMessage { float:left; margin: 0px 20px 0px 44px; width: 862px; padding-bottom: 10px; color: #959595; } /* Engine Table */ #carConfigurator #engine { margin-left: -5px; width: 926px; } #carConfigurator #engine th, #carConfigurator #engine td { border-top: 1px solid #b2b2b2; text-align: left; } #carConfigurator #engine th { font-weight: bold; border-top: none; vertical-align: middle; height: 29px; } #carConfigurator #engine td { padding-top: 7px; padding-bottom: 6px; vertical-align: top; } #carConfigurator #engine td label { height: 29px; } #carConfigurator #engine td label span { line-height: 29px; } #carConfigurator #engine td .radio { margin-top: 2px; margin-right: 0px;} #carConfigurator #engine .col0 { width: 27px; padding-left: 20px; } #carConfigurator #engine .col1 { width: 120px; padding-right: 10px; } #carConfigurator #engine .col2 { width: 140px; padding-right: 10px; } #carConfigurator #engine .col3 { width: 170px; padding-right: 10px;} #carConfigurator #engine .col4 { width: 140px; padding-right: 10px;} #carConfigurator #engine .col5 { width: 140px; padding-right: 10px;} #carConfigurator #engine .col6 { width: 108px; } #carConfigurator #engine .col6 span { display: block; } /* EngineType Features */ #carConfigurator #engineTypes ul.features { padding-left: 5px; } #carConfigurator #engineTypes .sectionContent .full { width: 926px; margin-left: -5px; padding: 10px 0px 0px; border-top: 2px solid #b2b2b2; } #carConfigurator #engineTypes .features li label .txtWrp { display: inline; } /* Colors & Rims */ #carConfigurator #rims .features li, #carConfigurator #colors .features li { margin-bottom: 3px; } #carConfigurator #colors .features input { margin-top: 7px; } /* #carConfigurator #rims .features li label .txtWrp { margin-top: 0px; } #carConfigurator #colors .features li label .txtWrp { margin-top: 0px; } */ /* optional equipment */ #optionalEquipment ul.group { overflow: hidden; margin-left: -5px; } #optionalEquipment ul.group li { margin-top: -1px;} #optionalEquipment ul.group ul.features li { margin-top: 0px; } #carConfigurator #optionalEquipment ul.group ul.features li.group { margin-left: 23px; width: auto; } #carConfigurator #optionalEquipment ul.group ul.features li.group li { width: 861px; } #optionalEquipment ul.group li.group { border-top: 1px solid #909090; padding-left: 5px } #optionalEquipment ul.group li li.group { border: none; padding-left: 0px} /* Accessories & warranties */ #carConfigurator #accessories .sectionContent li img { float: right; height: 143px; width: 444px; border: 1px solid #909090; margin-left: 10px; } #carConfigurator #accessories .features br, #carConfigurator #warranties .features br { display: none; } #carConfigurator #warranties .features li strong, #carConfigurator #warranties .features li .txtWrp, #carConfigurator #accessories .features li .txtWrp, #carConfigurator #accessories .features li strong { font-weight: bold; } #carConfigurator #accessories .features, #carConfigurator #warranties .features { margin-top: 10px; } #carConfigurator #seatCover .features li label img { float: none; } #carConfigurator #seatCover .features li label img, #carConfigurator #accessories .features li label img { margin-right: 0px;} /* * Conflicts */ #carConfigurator .sectionContent span { font-size: 11px; } #carConfigurator .sectionContent .conflict { background-color: #bb061c; padding-top: 3px; } #carConfigurator .sectionContent .conflict label { color: #ffffff; font-weight: bold; margin-bottom: 3px; margin-right: 3px; } #carConfigurator .sectionContent .conflict .message { clear: left; background-color: #ffffff; font-weight: normal; color: #434343; margin: 0px 3px 3px 3px; overflow: hidden; } #carConfigurator .sectionContent .conflict .message { padding: 5px 10px 5px 25px; line-height: 167%; } #carConfigurator .sectionContent .conflict .message .conflictSource { font-weight: bold; } #carConfigurator .sectionContent .conflict .message span { margin: 0px; float: none; display: inline; } #carConfigurator .sectionContent .conflict span.xPrice { color: #ffffff; } /* additional currencies */ /* hide tooltip icons inside conflict messages */ #carConfigurator .conflict span.tooltip { display: none; } #carConfigurator .conflict ul.conflictSources { float: left; margin-left: 0px; } #carConfigurator .conflict ul.conflictSources li { margin: 0px 0px 0px 0px; } #carConfigurator .conflict ul.conflictSources li, #carConfigurator .third .conflict ul.conflictSources li, #carConfigurator .twothird .conflict ul.conflictSources li { width: 100%; } /* * Tooltip icons */ #carConfigurator span.tooltip { display: inline-block; background: url(/assets/images/global/carconfigurator/icons/icon_info.gif) no-repeat 0px 0px; width: 14px; height: 14px; cursor: pointer; margin: 0px 5px -2px; } #carConfigurator .conflict span.tooltip { background-image: url(/assets/images/global/carconfigurator/icons/icon_info_conflict.gif); margin-top: 3px; margin-bottom: 3px; } #conflictTestBtns button { float: left; margin-right: 10px; } #conflictTestBtns p { float: left; clear: left; } #sectionBtns { display: none; } #conflictTestBtns .show { display: block; } .lpgFeature td { color: #5da913 !important; border:none !important; } /***************** disabled utilityLinks: *****************/ #carConfigurator .service { display: none; }