@charset "utf-8";
/*
 * Q-Print
 * Shop & Configurator stylesheet
 * Ralf Heumann, JANUS DIE WERBEMANUFAKTUR
 * Jan. 2011
 */


/**** Shop Step-Navigation-Bar ****/

ul#ordersteps {
	width: 736px;
	margin: 0 0 20px -33px;
	height: 54px;
	list-style: none;
	background: url(../images/orderstepsback.gif) no-repeat;
}
ul#ordersteps li {
	width: 33%;
	padding: 27px 0 0 0;
	float: left;
	font-size: 11px;
	color: #ccc;
	text-align: center;
	background: url(../images/orderdot.gif) center 9px no-repeat;
}
ul#ordersteps li.active { background-position: center -41px; }
ul#ordersteps li.active a { font-weight: bold; }

/*** Step 1 (Select Configurator) ***/

#content .shop-box p { margin-left: 0; margin-right: 0; }

.shop-box {
	height: 128px;
	margin-bottom: 22px;
	padding: 18px 20px 1px 247px;
	border: 3px solid #e9e9e9;
}
.shop-box.leiterplatten { background: url(../images/shop_leiterplatten.jpg) 1px 1px no-repeat; }
.shop-box.schablonen { background: url(../images/shop_smd-schablonen.jpg) 1px 1px no-repeat; }
.shop-box h3 { margin-bottom: 10px !important; margin-left: 0 !important; }
.shop-box p { margin-bottom: 15px !important; }

/**** Step 2 (Configurator) ****/

#config-index {
	width: 230px;
	padding-top: 20px;
	padding-left: 10px;
	float: left;
}
#config-index label {
	width: auto;
	margin-bottom: 6px;
	font-weight: bold;
	color: #094b2c;
	display: block;
	cursor: pointer;
}

#config-index input, #configurator input {
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	background: url(../images/input-shadow.png) left top no-repeat;
}

#config-index input[type=checkbox], #configurator input[type=checkbox],
#config-index input[type=radio], #configurator input[type=radio] {
	border: 0;
	background: none;
}

#config-index input {
	width: 210px;
	margin-bottom: 10px;
	padding: 3px;
	border: 1px solid #999;
	border-radius: 3px;
	display: block;
}

#config-index ul#leftnavi li.active {
	width: 230px;
	margin: -1px 0;
	padding-left: 10px;
	border: 3px solid #e9e9e9;
	border-right-color: white;
	border-radius: 3px;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	position: relative;
	left: -13px;
	background:url(../images/right_arrow.gif) no-repeat 10px 12px;
}

/* Configurator contents */

#configurator {
	width: 434px;
	min-height: 400px;
	margin-bottom: 15px;
	padding: 15px 10px 15px;
	float: right;
	border: 3px solid #e9e9e9;
}
/*#configurator h2, #configurator h3, #configurator p,
#configurator h3 { margin: 0 0 10px 0; font-size: 13px; }*/
#configurator h3 { /*width: 140px;*/ margin: 0 0 12px 0 !important; font-size: 14px; /*float: left;*/ }
#configurator h4 { margin: 0 0 12px 0 !important; padding-top: 0px; font-size: 12px; }
#configurator p { margin: 0 0 10px 0; font-size: 12px; }
#configurator .hr { margin-top: 15px; margin-bottom: 15px; }

/* Slider modifications */
#configurator .ui-slider { width: 300px; margin: 12px 0 35px 65px; }
#configurator .ui-slider-label { font-size: 11px; color: #333; white-space: nowrap; }
#configurator .ui-slider-tooltip { font-size: 10px; font-weight: bold; }

.configgrp { padding: 2px 0; position: relative; }
.configgrp.numbered { margin-left: 10px; padding-left: 30px; }
.configgrp.numbered span.nr { position: absolute; left: 0; top: 3px; }

#configurator .options { margin-bottom: 5px; overflow: hidden; }
#configurator .options p { margin: 0 0 5px 0; }
#configurator label { width: auto; margin: 0; padding:0; display: inline; float: none; }
label.checklabel { width: auto; /* margin: 0 0 7px 0 !important; */ display: block !important; cursor: pointer; float: none; }
label.checklabel input { margin-left: 0; margin-right: 5px; margin-top: -2px; vertical-align: middle; border: 0; background: none !important; }
label.checklabel.disabled, p.disabled { color: #999; }
label.checklabel .advice { margin-top: 5px; padding-left: 18px; display: block;}
.half-col.form .offset { padding-top: 10px; padding-left: 120px; clear: both; }
.half-col.form .offset .checklabel { width: auto; }
#configurator label.checklabel {margin: 0 0 7px 0 !important;}
#configurator input { margin: 0 3px; padding: 3px 2px 2px; font-size: 12px; background-position: 0 0px; }
#configurator select { padding: 3px; margin-bottom: 8px; font-size: 12px; }
#configurator input.fileinput { margin-bottom: 20px; }

#configurator .optionlist { margin: 0; clear:both; }
#configurator .optionlist .optionwrapper { margin: 0; background: red; padding: 0; }

/* SMD stencils */

#labeling {
	padding-top: 5px;
	width: 255px;
	float: left;
}
#labeling label { width: 117px; padding-top: 3px; float: left;}
#labeling select { width: 125px; }

#labelpreview {
	width: 169px;
	height: 139px;
	margin-top: -25px;
	margin-bottom: 15px;
	background: url(../images/labeling.png) left top no-repeat;
	float: right;
	position: relative;
}

#labelpreview.label-a { background-position: -169px 0; }
#labelpreview.label-b { background-position: -338px 0; }
#labelpreview.label-c { background-position: -507px 0; }
#labelpreview.label-d { background-position: -676px 0; }

#labelpreview a {
	width: 13px;
	height: 15px;
	padding: 0 0 0 2px;
	position: absolute;
	font-size: 11px;
	text-align: center;
	color: #333;
	border-radius: 2px;
	-moz-border-radius: 2px;
	-webkit-border-radius: 2px;
}
#labelpreview a:hover, #labelpreview a.active { color: white; text-decoration: none; background: #396; }
#labelpreview a:visited { text-decoration: none; }

#label-1 { left: 40px; bottom: 39px; }
#label-2 { left: 77px; bottom: 39px; }
#label-3 { left: 114px; bottom: 39px; }
#label-4 { left: 114px; bottom: 62px; }
#label-5 { left: 114px; bottom: 85px; }
#label-6 { left: 77px; bottom: 85px; }
#label-7 { left: 40px; bottom: 85px; }
#label-8 { left: 40px; bottom: 62px; }

#labelpreview a#label-a { width: 25px; height: 30px; left: 71px; bottom: 0; background: none; }
#labelpreview a#label-a:hover { background: url(../images/labeling.png) -240px -109px no-repeat; }
#labelpreview a#label-b { width: 30px; height: 25px; right: 0; top: 57px; background: none; }
#labelpreview a#label-b:hover { background: url(../images/labeling.png) -475px -57px no-repeat; }
#labelpreview a#label-c { width: 25px; height: 30px; left: 71px; top: 0; background: none; }
#labelpreview a#label-c:hover { background: url(../images/labeling.png) -578px top no-repeat; }
#labelpreview a#label-d { width: 30px; height: 25px; left: 0; top: 57px; background: none; }
#labelpreview a#label-d:hover { background: url(../images/labeling.png) -676px -57px no-repeat; }
#labelpreview a span { display: none; }

/* Tabcontents */
.tabcontent { }

#config-footer {
	margin-bottom: 20px;
	overflow: hidden;
	clear: both;
}
#config-footer p.info, #config-footer p.warning { margin: 0 0 15px 240px !important; }

/**** Step 4 (Check'n'Purchase) ****/

/* Pricing table */
table.pricing { width: 100%; padding: 2px 0; margin: 0; border: 0;}
table.pricing tr.strong td { font-weight: bold; }
table.pricing td { padding: 1px 0; font-size: 11px; text-align: right;  }
table.pricing td.label { width: 110px; text-align: left; }
table.pricing.topline { background: url(../images/dotted.gif) left top repeat-x; }

/* Shopping cart */
table.cart { margin-bottom: 0; }
/*table.cart tr:hover, */table tr.active { background-color: #396; }
/*table.cart tr:hover td, */table tr.active td,
table.cart tr.active td.quantity input { color: white; }
table.cart tr.active:hover td.quantity input { color: black; }
/*table.cart tr:hover td a, */table tr.active td a { color: white; }
/*table.cart tr:hover td .wrap a, */table tr.active td .wrap a { color: #000; }
table.cart tr td.quantity input { width: 30px; padding: 3px; float: right; text-align: right; border:0; background: transparent; border-radius: 3px; -moz-border-radius: 3px; -webkit-border-radius: 3px; }
/*table.cart tr:hover td.quantity input {
	width: 30px;
	background: url(../images/input-shadow.png) left top no-repeat;
}*/
table.cart tr td select { width: 80px; }
table.cart tr .nopadding { padding: 0; }
table.fullcol.cart tr td { padding-top: 10px; padding-bottom: 10px; }

/*table.cart tr.cart-details:hover, table.cart tr tr:hover { background-color: transparent; }
table.cart tr.cart-details:hover td { color: #333; }
table.cart tr.cart-details:hover td a { color: #396; }
table.cart tr.cart-details:hover td .wrap a { color: #000; }*/
table tr.cart-details td { border-left: 3px solid #396; border-right: 3px solid #396; border-bottom: 3px solid #396; }
table tr.cart-details td h4 { font-size: 13px !important; }
table tr.cart-details td div.left { width: 380px; }
table tr.cart-details td div.right { width: 280px; }
table tr.cart-details td .wrap.right { margin-bottom: 15px; width: auto; }
table tr.cart-details table { width: 100%; border: 0; }
table tr.cart-details table tr { background: url(../images/dotted.gif) left bottom repeat-x; }
table tr.cart-details table td {
	padding: 2px 10px 4px !important;
	border: 0;
	font-size: 11px;
	line-height: 15px;
	vertical-align: top;
}
table tr.cart-details table td.label { font-weight: bold; width: 50%; }
table tr.cart-details table td img { margin-right: 5px; vertical-align: middle; }
table .tab_desc { width: 38%; }
table .tab_delete { width: 5%; text-align: left; }
table .tab_delete input { margin-left: 0; border: 0; }
table .tab_delete input { margin-left: 0; border: 0; }
table .tab_tools { width: 14%; padding-right: 0; padding-left: 10px !important; }
table .tab_more { width: 9%; padding-right: 0; padding-left: 10px !important; }
table .tab_pos { width: 3%; text-align: right; padding-right: 0 !important; padding-left: 0 !important; }
table.cart td .button, .address .button { padding: 0 5px; }
table.cart td .input.small-int { width: 20px; }

table.clickable { margin-bottom: 15px; }

.cart-footer { margin-bottom: 20px; padding: 10px !important; background:#f5f5f5; overflow: hidden; }
.cart-footer .one-col { margin-bottom: 0 !important; }
.cart-footer table.pricing td { font-size: 12px; }
.cart-footer table.pricing td.label { text-align: right; }
.cart-footer p.checktext { margin-left: 0 !important; margin-bottom: 8px !important; }
.cart-footer p.checktext label { cursor: default; }


p.voucher { padding: 5px 20px 5px 20px; }
p.voucher label { font-weight: bold; color: #094b2c; }

/* Option - Lists */
#content ul.optionlist, #content ul.navilist { margin: 0 0 20px 0; list-style: none; }
#content ul.optionlist li, #content ul.navilist li { list-style: none; list-style-image: none; }
div.optiontrigger, #content ul.navilist li {
	/*margin-bottom: 1px;
	padding: 6px 8px;
	font-size: 12px;
    background: #e9e9e9;
    border-bottom: 2px solid #d6d6d6;
    border-top: 1px solid #e7e7e7;
	background-image: none;*/
	margin-left: 10px;
	margin-right: 10px;
	cursor:pointer;
}
#content ul.navilist li { padding: 0; font-weight: bold; background: #e9e9e9 url(../images/arrow.gif) 13px 11px no-repeat; }
#content ul.navilist li a { padding: 6px 10px 6px 30px; text-decoration: none; display: block; }
#content ul.navilist li p { font-weight: normal; }

div.optionwrapper { padding-top: 10px; padding-bottom: 10px; }
ul.optionlist li:last-child div.optionwrapper .half-col { margin-bottom: 0 !important; }
#content ul.optionlist li label.optionlabel { float: none; cursor: pointer; }
input.checkbox { margin-top: 1px; margin-right: 8px; float: left; border: 0; }

/* Special formats */
p.checktext { margin-bottom: 0; overflow: hidden; }
p.checktext .checkbox { margin: 2px 10px 0 0; float: left; }
p.checktext span, p.checktext label { padding-right: 120px; display: block; overflow: hidden; }
p.checktext label { padding: 0; margin: 0; cursor: pointer; }
.half-col.form p.checktext { /* padding-top: 10px; */ }
.half-col.form p.checktext label { width: auto !important; }
input#securitycode { width: 130px; }