/*    JTL-Shop3 Tiny Theme "Dark" 
 * 
 *    @author JTL-Software.de
 * 
 *    Dieses Theme basiert auf dem Theme "Lucid". Die Themes sind im Layout sehr ähnlich, haben aber grundsätzlich verschiedene Farben. 
 *    Die folgenden CSS-Regeln werden nach den CSS-Regeln vom Lucid-Theme geladen. 
*/


/* 	JTL-Shop3 Tiny Theme "Lucid" 
** 
** 	@author JTL-Software.de
**	
*/

/* ------------------- adapted for mumbojumboshop by extractdesign -------------------- */

body { 
	color: #CCC; background: #000 url(images/body_bg.jpg) repeat-x top center; 
	font-family: Arial, Helvetica, sans-serif; 
	}
a, a:visited, a:link { color: #FFF; text-decoration: none; 	cursor: pointer; }
a:hover, a:focus { color: #FF0; }
#content { border: none;  }
#contentmid { border: none; }
h1, h2 { 
	text-transform: inherit;
	font-family : Arial, Helvetica, sans-serif;
	color: #CCC;
} 

#content H3 { 
	text-transform: uppercase; font-weight: normal; 
	border-bottom: 1px dotted #CCC; padding-bottom: 3px; margin-bottom: 3px; 
	}
	
#content .p50_left { width: 45%; margin-right: 30px; }	
	
em { color:#CCC; }
span.vat_info a {	color: #FFF; }

.float_clear { clear:both; }

/* Tiny-Styles zuruecksetzen */
#headlinks, #headlinks.active { background-color: #DDD; height: 35px; border: none; }
#headlinks ul li > a, #headlinks ul li > a:hover, #headlinks li.basket > a, #headlinks li.basket > a:hover { background-color: transparent;  margin: 0; padding: 0; -moz-border-radius: 0; border-radius: 0; }
#headlinks li { padding: 0; }
#speciallinks { display: none; }
#headlinks_wrapper { margin-left: 0; }
.form fieldset select, .form fieldset textarea, .form fieldset input[type="text"], .form fieldset input[type="password"] { 
	padding: 0.25em;
	font-size: 1em; 
	background-color: #666; color: #FFF; 
	border: 1px solid #999; }
	
#styled_view li.gallery { width: 220px; margin-left: 6px; margin-bottom: 5px}
#styled_view li.gallery.first { margin-left: 0px;}
#styled_view li.gallery .image_overlay_wrapper { height: 260px; }

/* Base Styles */
.page_width { width: 980px; }
#page { background: transparent none; }
#content { background: none transparent; padding: 20px; -moz-border-radius:0px 0px 0px 0px; }
.sidebox { background: none; }

#breadcrumb { border-bottom: 1px dotted #CCC; }
/* #breadcrumb, #breadcrumb a { color: #999; } */
#breadcrumb a.last { color: #FF0; }

#logo { z-index: 200; }
#logo a { position:relative; display: block; margin-top: 15px; z-index: 999; }
#logo img { position: inherit; top: 0; }
#headlinks ul li > a { font-weight: bold;  color: #000 !important; text-transform:uppercase; text-shadow:0 0 2px #AC5F24; }

#content_footer { border-top: 1px dotted #CCC; }

#page_wrapper { background: #222 url(images/content_bg.jpg) no-repeat;  }

/* --------------- runde Ecken zurücksetzen ------------ */

.form fieldset,
.category_wrapper, 
#styled_view li .article_wrapper,
#content, 
.sidebox, 
#footer, 
#footer .footer_box,
#footer .master,
.financing, .comment, .differential_price,
#article .article_matrix, 
#article fieldset.article_buyfield,
#article fieldset.article_buyfield .choose_quantity,
.change_quantity a, .change_quantity a:link, .change_quantity a:active, .change_quantity a:visited,
#article .article_images img,
#headlinks li.basket div.articles
	{

   border: 0px solid transparent;
   border-radius: 0px;
   -moz-border-radius: 0px;
   -webkit-border-radius: 0px;
   -khtml-border-radius: 0px;
	}

/*
 * message boxes
 */

.box_info,
.box_error,
.box_success {
	border: 0px;
	margin: 0 0 1em 0;
	padding: 0.5em 30px 0.5em 0em;
	background-color: transparent;
	}
.box_info {		background: url('images/box_info.png') right center no-repeat; }
.box_error {	background: url('images/box_error.png') right center no-repeat;}
.box_success {	background: url('images/box_success.png') right center no-repeat;}

/* ----------- Buttons & Links ---- */

a.link_back { background: url(images/arrow_left.png) left center no-repeat; padding-left: 10px; }


/* Eigene Header-Styles */

#header, #header_wrapper { height: 120px; position: relative; }
#style, #settings { top: 15px; right: 300px;  }

/* Suche */
#search { background:none repeat scroll 0 0 transparent; padding:0; position:relative; text-align:right; top:-100%; }
#search-form { width:300px; padding-right:10px; position:absolute; right:0; top:0; height: 40px; padding: 15px 0 0 0; }
#search input[type="text"], #submit_search { vertical-align: top; }
#search input[type="text"] { width:180px; border: none; background: transparent url(images/search_input_bg.png) top left no-repeat; height: 25px; line-height: 25px; padding: 0 10px; }
#submit_search { width: 76px; border: none; background: transparent url(images/search_button_bg.png) top left no-repeat; height: 25px; line-height: 25px; padding: 0 20px 0 0px; font-size: 12px; }
#submit_search:hover span, #submit_search:focus span { text-decoration: underline; }

/* Headlinks */
#headlinks UL { padding-left: 280px; }
#headlinks ul li > a, #headlinks ul li > a > span { line-height: 35px; height: 35px; display: block; }
#headlinks ul li > a, #headlinks ul li.basket { background: #DDD; padding-right: 0; }
#headlinks ul li > a:hover, #headlinks ul li > a:focus, #headlinks ul li.current > a { background-position: 0 96px !important; }

#headlinks ul li.first > a { background-position: top left; }
#headlinks ul li.first > a:hover, #headlinks ul li.first > a:focus, #headlinks ul li.first.current > a { background-position: 0 192px !important; }
#headlinks ul li > a > span { padding-right: 20px; }

#headlinks ul li.basket { position: relative; left: -10px; background-position: 9px 144px; }
#headlinks ul li.basket > a, #headlinks ul li.basket > a:hover { padding-left: 10px; position: relative; left: 10px; background: transparent url(images/main_backgrounds.png) top right !important; }
#headlinks li.basket.items > a { padding-right: 0; }
#headlinks ul li.basket > a > span { padding-left: 20px; background: transparent url(images/cart.png) no-repeat 0px 10px; }
#headlinks ul li.basket > a:hover, #headlinks ul li.basket > a:focus, #headlinks ul li.basket.current > a { background-position: right 192px !important; }

#headlinks li.basket div { top: 35px; }
#headlinks li.basket div.articles { right: -10px;  }

/* Sidepanels */
.panel_left #sidepanel_left { width: 250px; margin-top: 38px; }
.panel_left #content { margin-left: 260px; padding: 20px; }
.panel_right #content { margin-right:210px; }

/* Sideboxes */
.sidebox { padding-top: 0px; border: none; width: 220px; margin-left: 0px; }
.sidebox h3 { 
	background: transparent none; padding: 0 0 2px 20px; margin-bottom: 5px; border-bottom: 1px dotted #555; 
	color: #555;
	font-family: Arial, Helvetica, sans-serif; font-weight: normal;  
	font-size: 10px; 
	text-transform: uppercase; }

.sidebox div.sidebox_content { margin-left: 20px;  border: none; padding:0px; }

.sidebox div.sidebox_content .article_image { width:200px; height: 200px; overflow: hidden; margin-bottom: 5px;  }
.sidebox div.sidebox_content .article_name  { font-size:11px; text-transform: uppercase; }

.sidebox_categories div.sidebox_content { margin-left: 0px; width: 220px; }
.sidebox_categories h3 { display: none;  }

/* --- header search --- */
#submit_search { background-image: url(images/search_button_bg.png); }

#headlinks ul li > a { text-shadow:0 0 2px #000; }
#headlinks, #headlinks.active, #headlinks ul li > a, #headlinks ul li.basket, #headlinks ul li.basket > a, #headlinks ul li.basket > a:hover { background-image: none !important; }

/* --- footer --- */
#footer_wrapper { background: transparent none; }
#footer { background: #333; color: #ccc; padding: 0px;} 
#footer > ul {  padding: 10px; }
#footer a { color: #ccc; }

#footer .footer_box,
#footer .master { background-color: transparent; margin:0px; }
#footer .footer_box {  padding: 0px; text-align: right; }

#footer H2,
#footer .footer_box h2 { border-bottom: 1px dotted #CCC; font-size: 14px; padding: 2px 0px; margin-bottom: 5px; font-family: inherit; }

#footer ul.lnkgroup li { line-height: 1.5em; border-bottom: 0px;}

#footer a.link_lang.eng,
#settings a.link_lang.eng {	background-image: url("images/flags/eng.png"); background-position: left center; }
#footer a.link_lang.ger,
#settings a.link_lang.ger {	background-image: url("images/flags/ger.png"); background-position: left center; }

#footer p.jtl { background-image: none; padding-right: 0px; }

/* --- settings --- */
#settings > ul > li > span, #settings > ul > li > a { color: #ccc; }
#settings a.expander {  
	background-color: transparent; border: 0px;  }
#settings a.expander.active, #settings a.expander:hover { 
	background-color: transparent; border: 0px; color: #FF0; }
	
#settings .expander_box,
#headlinks li.basket:hover div.articles,
#headlinks table.articles tbody tr.bottom  { border: 0px; background-color: #444; }
#headlinks table.articles tbody tr.bottom  TD { border-top: 1px dotted #555; }

#headlinks li.basket > a {
   background: #transparent;
}


#headlinks ul li > a, .submit { text-shadow: none; text-transform:uppercase; !important; }

#headlinks ul li > a:hover, #headlinks ul li > a:focus, #headlinks ul li.current > a { color: #bc1313 !important; }

.submit { background: url(images/main_backgrounds.png) -15px -10px repeat-y; border-color: #bc1313; color: #fff; font-family: inherit; }
a.submit, a.submit:visited { color: #fff !important; }
.submit:hover, a.submit:hover { background-position: -10px 96px !important; color: #bc1313 !important;}

/* ----------- sonstige Text-Styles zurücksetzen -------- */

span.price { color: #CCC; font-size: 12px; font-weight: bold; }

ul.rowsel li  {
	margin: 0px;
	padding: 3px 0px;
	vertical-align: middle;
}

ul.rowsel li:hover {
	background-color: #333;
}

#versand table, #versand table th, #versand table td { border:1px solid #777; }

/* ----------- FX ----------------------------- */

#simplemodal-container {

	background-color: #333;
}

.jcarousel-skin-tiny .jcarousel-container { background-color: #333; border: 1px solid #555; }
.jcarousel-skin-tiny .article_wrapper a:hover { background-color: #222; }

.jcarousel-skin-tiny .jcarousel-prev-horizontal,
.jcarousel-skin-tiny .jcarousel-next-horizontal { background-color: #555; }
.jcarousel-skin-tiny .jcarousel-prev-horizontal:hover,
.jcarousel-skin-tiny .jcarousel-next-horizontal:hover { background-color: #666; }

.jcarousel-skin-tiny span.desc .text { color: #CCC; }

/* ----------- category sidebox --------------- */

.sidebox_categories { border-bottom: 1px dotted #CCC; }

ul.categories li a:hover,
ul.categories li.active a,
ul.categories li.active,
 
ul.categories span,
ul.categories li.node span,
ul.categories ul.subcat span {
	background: transparent none;
	}
/* --- Ebenen --- */
ul.categories li {
	text-transform: uppercase;
	border-top: 1px dotted #CCC;
	font-size: 20px;
	}
ul.categories ul.subcat li {
	border-top: 1px dotted #888;
	font-size: 12px;
	}
ul.categories ul.subcat ul.subcat li {
	border-top: 1px dotted #555;
	text-transform: none;
	}	
	
ul.categories li span,
ul.categories li.node span {
	padding-left: 20px; 
	}
ul.categories ul.subcat span {
	padding-left: 40px; 
	}
ul.categories ul.subcat ul.subcat span {
	padding-left: 60px; 
	}	

/* --- active --- */
ul.categories a	{
	}
ul.categories li.active a span,
ul.categories ul.subcat > .active > a > span, ul.categories ul.subcat ul.subcat > .active > a > span { 
	font-weight: normal;
	color: #FF0;
	}
ul.categories li.active UL LI A span {
	color: #FFF;
	}	
ul.categories li.active UL LI A:hover span {
	color: #FF0;
	}
	
/* --------------- categories in content --- */

.category_wrapper {
   padding: 0px;
   overflow: hidden;
	}
	
.category_wrapper ul.category_item li.desc {
	position: absolute;
	margin: 20px 50px 20px 240px;
	font-size: 0.9em;
	color: #333; 
	line-height: 1.2em;
	text-align:justify;
}

.category_subcategories li.p33 {
	width: 220px;
	overflow: hidden; 
	margin-left: 10px;
	margin-bottom: 8px;
	}
.category_subcategories li.p33.first {
	margin-left: 0px; 
	}	
.category_subcategories li.p33 .category_wrapper {
	padding: 0px; margin: 0px; 
	/*
	width: 220px;
	*/
	}
UL.category_item  { position:relative; }	
.category_subcategories .category_wrapper ul.category_item li.desc {
	position: absolute;
	margin-left: 20px;
	}
.category_wrapper.child h2 a {
	text-transform: uppercase;
	font-size: 18px;
	font-weight: normal; 
	}

.category_item li.img { width: 100%; height: 100%; }
.category_item .image_empty { background: url(images/image_empty_bg.jpg); width: 100%; }
.category_item .image_empty H1 { padding: 20px }	

/* -------------------- FORMS -------------------- */
.form fieldset {

border-top: 0px dotted #555; 
padding-top: 5px;
padding-right: 0px;
padding-bottom: 5px;
padding-left: 0px;

margin-top: 0pt;
margin-right: 0pt;
margin-bottom: 0.5em;
margin-left: 0pt;

}

.form fieldset legend {
	text-transform: uppercase; 
	color: #999;
	padding: 0px;
	}

.form fieldset label {  display: block; }
.form fieldset label.active {
   color: #CCC;
}

.input_block, UL.input_block, .address ul.input_block { margin:0px; padding:0px; }
.input_block LI { display: block; float: none; padding:0px; margin: 0px;  }
ul.input_block .clear { padding:0px; margin: 0px;  }

.form_default LI,
.form_default .input_block LI { clear: both; height: 30px; }
.form_default label,
.form_default INPUT,
.form_default TEXTAREA,
.form_default SELECT,
.form_default .leftside, 
.form_default .rightside  { float: left;  }
.form_default label, 
.form_default .leftside { width: 200px;  }
.form_default INPUT,
.form_default TEXTAREA  { width: 290px; }
.form_default INPUT[type="submit"],
.form_default button.submit,
.form_default .rightside, 
.form_default SELECT { width: 300px;  }

.form_default label { padding: 0.1em 0em; }

.form_default .leftside, 
.form_default .rightside { margin-top: 5px; } 

.form_default .radioselect { margin-bottom: 10px; }
.form_default .radioselect INPUT { clear: left; width: 30px; margin-left: 170px; height: 10px;  }
.form_default .radioselect LABEL { width: 400px; text-align:left; }


.form fieldset .error_block { background-color: transparent; }
.form fieldset .error_text { color: #FF0000; }
.form fieldset .error_block select, .form fieldset .error_block textarea, .form fieldset .error_block input[type="text"], .form fieldset .error_block input[type="password"] { border-color: #F00; }

/* --- FORMS spezielles --- */

form#improve_search fieldset legend,
form#rechnungsdaten fieldset legend,
form#kundendaten fieldset legend {
	display: none;
	}
	
form#improve_search { }
form#improve_search fieldset .container { margin:0px; padding: 5px 0px;  border-bottom: 1px dotted #CCC;}
form#improve_search fieldset select { padding: 0px; }

#article_filter select { margin: 0px; }

/* -------------------- article list / styled view ------------- */

#styled_view li.gallery .article_wrapper  {
	margin: 0px 0px 5px 0px;
	padding: 0px;
	}
#styled_view li .article_wrapper,
#styled_view li.gallery .article_price,
#styled_view li.gallery .article_price span.price {
	color: #333; 
	}
#styled_view li .article_wrapper A {
	color: #666;
	}
#styled_view li .article_wrapper:hover { border: 0px; }	

.image, a .image, a:hover .image { border: 0px; }

#styled_view .article_info_wrapper { background-color: #CCC; padding: 5px; }
#styled_view li.gallery H3,
#styled_view li.gallery H3 A { text-transform: uppercase; font-size: 11px; color: #000; text-align: left; margin: 0px; border:0px;}

#styled_view li.gallery .article_price { text-align: left;  }
#styled_view li.gallery .article_price UL LI { float: left; margin-right: 10px; }

#styled_view li ul li { margin: 0px; }

#styled_view span.vat_info { display: block; clear: both; }

/* ----------------- article details ---------------------- */

#article .prev_article { width: 40%; background: url(images/arrow_left.png) left center no-repeat; padding-left: 10px; }
#article .next_article { width: 40%; background: url(images/arrow_right.png) right center no-repeat; padding-right: 10px; }

#article .article_images  { border: 0px; padding: 0px; margin-top: 5px; }

#article .article_images img { border: 2px solid transparent; margin: 0px; }
#article .article_images img.active,
#article .article_images a:hover img { border: 2px solid #999; }


.financing, .comment, .differential_price, #article .article_matrix, #article fieldset.article_buyfield,
#article fieldset.article_buyfield .choose_quantity,
#attribute_list .item,
#attribute_list ul.values 
	{
	background: transparent none;
	padding: 0px;
	margin: 0px;
	}
	

#article #article_buyfield { border-top: 1px dotted #999; border-bottom: 1px dotted #999; margin: 10px 0px; padding:10px 0px;}
#article fieldset.article_buyfield { padding: 0px; }
#article #article_variations { border-bottom: 1px dotted #444;  padding: 5px 0px; }

#article_variations UL LI { float: left; margin-right: 10px; }

#article fieldset.article_buyfield .choose_quantity { padding-top: 10px; }
#article fieldset.article_buyfield .choose_quantity label{ float: left; }	
#article fieldset.article_buyfield .choose_quantity .button_submit { float: right; }

#article_variations UL LI.label,
#article fieldset.article_buyfield .choose_quantity label { text-transform: uppercase; padding-right: 10px; font-weight: normal; }

.change_quantity a, .change_quantity a:link, .change_quantity a:active, .change_quantity a:visited {
 width: 1.5em; height: 1.5em; padding:0.25em; border: 1px solid #CCC; }
/*	
#article .article_navigator { border-bottom: 1px dotted #CCC; padding-bottom: 5px; }
*/
#article .article_details .article_list_price { margin-bottom: 20px; }
#article .article_details .article_list_price .price { font-size: 2em; color: #CCC; }
#article .article_details .article_list_price span.price_label { vertical-align: bottom; }

button.notification,
button.question,
button.wishlist,
button.compare {
   color: #CCC; 
   }
   
   
/* ------------- BASKET --- */

table.tiny thead tr,
table.tiny.positions thead tr,
table.tiny.positions tr.sums td,
#basket_price_wrapper {
   background-color: transparent;
}

table.tiny,
table.tiny.positions { 
	border-top: 1px solid #444; 
	border-left: 1px solid #444;
	}
table.tiny th,
table.tiny td,
table.tiny.positions th,
table.tiny.positions td {
	border-top: 0px;
	border-left: 0px;
   border-bottom: 1px solid #555;
   border-right: 1px solid #555;
}

/*
 *  checkout steps
 */
#checkout_steps {
   margin: 0 0 1em 0;
   position: relative;
   height: 42px;
   background: #CCC url(images/checkout_steps_bg.jpg) no-repeat;
   color: #000;
}

#checkout_steps li a {
   text-decoration: none;
}

#checkout_steps li {
   list-style-type: none;
   list-style-position: inside;
   float: left;
   padding: 10px 30px 10px 25px;
   height: 22px;
   line-height: 22px;
   position: relative;
   margin-left: -20px;
   left: 20px;
   background: transparent url(images/checkout_steps.png) top right repeat-y;
   vertical-align: middle;
}

#checkout_steps a {
   color: #000;
}

#checkout_steps .first {
   padding-left: 10px;
}

#checkout_steps .state3 {
   background-position: right -200%; color: #000;
}

#checkout_steps .state2 {
   background-position: right -100%; color: #000;
}

#checkout_steps .state1 {
   font-weight: normal;
}


/* ----------------------------- Bestellvorgang --------------------------- */

form#order_register_or_login { margin-top: 50px; }

#bestellvorgang .accountwahl_option { position: relative; width: 229px; height: 200px; float: left; border-left: 1px dotted #CCC; }
#bestellvorgang .accountwahl_option#order_customer_login { width: 218px; border-right: 1px dotted #CCC; }

#bestellvorgang .accountwahl_option .inner { position: absolute; bottom: 0px; padding: 10px 10px; }

#bestellvorgang .accountwahl_option input { width: 200px; padding: 0.25em 0em;  }
#bestellvorgang .accountwahl_option a.submit { display: block; }

#bestellvorgang a.button_edit {
	font-size: 1em;
	}