/*
Author: Tim Portner
Author URI: http://www.timportner.de
*/

@import "css/reset.css";
@import "css/tools.css";


/* base
------------------------------------------------------------------ */
html { background: #000 url(../image/bg_html.jpg) top center no-repeat; text-align:center; }
body,html { width: 100%; }


/* container
------------------------------------------------------------------ */
#page { width:940px; text-align:left; margin:0 auto; display: block; position: relative; }
#contentbox { padding: 340px 0 0 0; }

select, textarea, input { background: #1a1a1a; border: 1px solid #8d8d8d; padding: 2px; }

table.cartconfirm td div { padding: 5px 5px 25px 5px; }
table.cartconfirm td div h3 { background: none!important; margin-bottom: 10px!important; border-bottom: 1px solid #8D8D8D}
table.cartconfirm td div a.edit { background: url(../image/edit_03.gif) bottom left no-repeat; padding: 10px 0 0 20px; display: inline-block; }

div.gutschein { border: 1px solid #8d8d8d;background: #1a1a1a; padding: 10px; margin: 20px 0;}
div.gutschein input { padding: 5px; margin: 0 4px 0 0;}

div.sort {border-bottom:1px solid #262626; padding: 7px 0 10px 0; margin: 0 0 10px 0; color: #808080; }
div.sort div.pagination { float:right; margin: -2px 0 0 0; }
div.sort select { margin-left: 5px; }

div.sort div.links { float:right; }
div.sort div.results { float:left; white-space: nowrap; display: block; padding: 2px 10px 2px 0; }

div.sort div.links b { display: inline-block; background: #1a1a1a; border: 1px solid #808080; padding: 2px 4px; color: #fff}
div.sort div.links a { display: inline-block; background: #1a1a1a; border: 1px solid #808080; padding: 2px 4px; color: #808080; margin: 0 1px;}

div.sortbottom {background: url(../image/bg_h.gif) top repeat-x; padding: 15px 0; }

div.productoption { display: none; margin: 5px 0; }
div.productoption span { display: block; float: left;border: 1px solid #8D8D8D; padding: 2px 6px; margin: 0 3px 0 0; cursor: pointer; }
div.productoption span.current { background: #000 url(../image/bg_option.png) top center no-repeat; color: #fff; border-color: #fff; border-top: none; padding-top: 3px; }

#review_box h3 { margin: 30px 0 10px 0!important; }
#review_box p.input label { display: block; float: left; width: 120px; padding: 0 0 2px 0;}
#review p.author { color: #fff; }

.warning { color: red; padding: 0 0 5px 0; font-weight: 700; }
.success { color: #fff; padding: 0 0 5px 0; font-weight: 700; }
.success { color: green; padding: 5px 0; font-weight: 700; }

a.image span {border: 1px solid #363636; margin: 1px; display: block;}
a.image img {display:block}
a.image {border: 1px solid #363636; display: inline-block; background: #1a1a1a;}

table.list { width: 100%; margin: 0 0 20px 0; }
table.list td { width: 222px;}
table.list td.td2 { padding: 0 18px 15px 18px; }
table.list td div { position: relative; height:45px; }
table.list td a.name { font-size: 17px; text-decoration:none; display: block; padding: 0 0 0 0; margin: 0 0 5px 0; border-bottom: 1px solid #363636; }
table.list td span.price {display:block; font-size: 15px; }
table.list td span.right { text-align: right; position: absolute; bottom: 0; right: 0; color: #808080; }
table.list td span.right a { color: #808080; }

.stock_on,.stock_off { padding: 2px 0 0 13px; }
.stock_on { background:url(../image/icon_stock_on.png) left top no-repeat; }
.stock_off {background:url(../image/icon_stock_off.png) left top no-repeat; }

div.box_options .stock_on, div.box_options .stock_off { float: left; padding: 2px 0 0 25px; }
div.box_options .stock_on { background:url(../image/icon_stock_on_options.png) left top no-repeat; }
div.box_options .stock_off {background:url(../image/icon_stock_off_options.png) left top no-repeat; }

.quantity { border: 1px solid #8D8D8D!important; width: 60px; height: 27px; margin: 0 3px 0 0; float: left }
.quantity option { padding: 2px 0 2px 0; }

#breadcrumb { position: absolute; top: 338px; left: 240px; }
#breadcrumb a { color: #808080; background: url(../image/icon_arrow.png) right center no-repeat; padding: 0 8px 0 0; margin: 0 5px 0 0}
table.cart {	border-collapse: collapse;	width: 100%;	border: 1px solid #545454;	margin: 0 0 20px 0;}
table.cart th {	background: #1a1a1a;	padding: 5px;	font-weight: normal;	border-bottom: 1px solid #8d8d8d;}
table.cart td {	padding: 5px;	vertical-align: top;	background: #1a1a1a;}
table.cart tr.even td { background: #000 }
td.footer { border-top: 1px solid #8d8d8d; }
.buttons table {	width: 100%;	border-collapse: collapse;}
.buttons table td {	vertical-align: middle;}

form#guest, form#create, form.form { margin: 20px 0 0 0; }
form#guest td, form#create td, form.form td { padding: 5px 0; }

.error { color: #ebcd0e; padding-left: 5px; }
.button { background: #1a1a1a; border: 1px solid #8d8d8d; padding: 3px 8px; text-transform: uppercase; color: #fff; display: inline-block; cursor: pointer; }

#content { margin-top:0px; padding: 0px 20px 40px 20px; float: left; }

.col_1_3 { width: 460px; }
.col_1_2 { width: 700px; padding-right: 0!important; padding-top: 27px!important; }

.product #images { width: 300px; float: left; overflow: hidden }

.product #images a span {border: 1px solid #363636; margin: 1px; display: block;}
.product #images a img {display:block}
.product #images a {border: 1px solid #363636; display: inline-block;}
.product #right { width: 380px; float: right; color: #808080; }

#content h1, #content h2, #content h3{background: url(../image/bg_h.gif) bottom repeat-x; padding: 0 0 5px 0; margin: 0 0 5px 0; color: #fff}

#content h1 { font-size: 25px; padding: 0 0 10px 0; }
#content h2 {font-size: 20px; margin: 30px 0 5px 0; }

.product #right .box_options { background: #1a1a1a; border: 1px solid #8d8d8d; padding: 10px; margin: 20px 0 0 0; }
.product #right .box_options select { background: #1a1a1a; border: 1px solid #363636; }
.product #right .box_options .price { display: block; margin: 5px 0 5px 0; padding-bottom: 10px; background: url(../image/bg_h.gif) bottom repeat-x; }
.product #right .box_options .price strong { color: #fff; font-size: 25px; font-weight: normal; padding-right: 5px;}
.product #right .box_options .select_options { background: url(../image/bg_h.gif) bottom repeat-x; padding-bottom: 15px }
.product #right #add_to_cart { background: url(../image/icon_cart_button.gif) left center no-repeat; padding-left: 33px;}

#content ul, #content ol { padding-left:15px; margin: 10px 0 10px 15px;}
#content ol li,#content ul li { margin-bottom:5px; line-height: 1.3em; }
#content ul li { list-style: square; }

.sum {border-top: 1px solid #545454; padding: 5px 0; display: block; }
.no_1,.no_3 { border-top: none; }
.no_3 { border-bottom: 1px solid #545454; margin-bottom: 1px;}

.price_100ml { float: right; margin-top: 6px;}


/* div#header
------------------------------------------------------------------ */
a#logo { position: absolute; top: 40px; left:0; width: 390px; height: 110px; display: block; text-decoration: none; }


/* div#nav
------------------------------------------------------------------ */
#nav { position: absolute; top: 205px; left: 0;width: 940px; }

#nav ul { clear: both;}
#nav ul li { float: left; }
#nav ul li.first { background: none!important; padding-left: 0!important }
#nav ul li a { text-decoration: none; }
#nav ul li a:hover { text-decoration: underline; }


#nav ul.cat li { background: url(../image/bg_nav_li.png) center left no-repeat; padding: 0 12px 0 18px; }
#nav ul.cat li a { color: #fff; font-size:25px; text-transform: uppercase; }

#nav ul.pages { padding: 18px 0 0 0 }
#nav ul.pages li { background: url(../image/bg_subnav_li.png) center left no-repeat; padding: 0 13px 0 17px; }
#nav ul.pages li a { color: #808080; font-size:15px; text-transform: uppercase; }

#nav ul.cart {position: absolute;top: 55px; right: 0; }
#nav ul.cart li a { background: url(../image/icon_cart.png) left center no-repeat; color: #808080; font-size:15px; text-transform: uppercase; padding: 0 0 0 20px; }


#search {position: absolute;top: 210px; right: 0; background: url(../image/bg_search.png) no-repeat; width: 219px; height:27px; display: block;}
#search p { padding: 0; }
#search p input {background: none; border: none;}
#search input#filter_keyword { width: 176px; padding: 3px 5px; font-size: 15px; color: #858585; }
#search input.send { width: 28px; height: 28px; float: right; cursor: pointer; }

#subnav { position: absolute;top: 175px; right: 0;} 
#subnav ul li.first { background: none!important; padding-left: 0!important }
#subnav ul li.lang { background: none!important; padding: 0!important }
#subnav ul li { float: left; background: url(../image/bg_subnav_li.png) center left no-repeat; padding: 0 8px 0 12px; }
#subnav ul li a { text-decoration: none;font-size:15px; }
#subnav ul li a:hover { text-decoration: underline; }


/* div#sidebar
------------------------------------------------------------------ */
#sidebar_left { width: 220px; float: left; padding: 5px 0 0 0; }

#sidebar_right {width: 220px;float: right; }

.box { margin: 0 0 30px 0}
.box span { color: #808080; }
.box h3 { color: #808080; font-size: 20px; border-bottom: 1px solid #262626;padding: 0 0 5px 0 }
.box ol {width: 220px; border-top: 1px solid #262626; margin: 1px 0 0 0; padding: 5px 0 0 0 }
.box ol li { color: #808080;list-style-type: decimal; border-bottom: 1px solid #262626;list-style-position: inside; width: 215px; padding: 2px 0 2px 5px; }
.box ol li a { text-decoration: none;}
.box ol li a:hover { text-decoration: underline; }

#sidebar ul { }
#sidebar ul li { }
#sidebar ul li a { }

/* div#footer
------------------------------------------------------------------ */
#footer { width: 100%; background: url(../image/bg_footer.jpg) center bottom no-repeat; height: 180px; text-align:center; }
#footer .inner { width: 940px; padding: 15px 0; margin: 0 auto; text-align:left; color: #808080; }

#footer a { color:#fff; text-decoration: none; padding: 0 2px; } 
#footer p.first a { padding-left: 0; }
#footer a:hover {text-decoration: underline;}

#footer .left { width:500px; float:left }
#footer .right { width:400px; float:right; text-align: right; }

#footer .right p span { background: url(../image/icon_logo.png) right top no-repeat; display: block; padding: 0 75px 0 0 }


/* tools
------------------------------------------------------------------ */
#stoerer { background: url(../image/stoerer.png) top left no-repeat; width: 180px; height:180px; position: fixed; top: 0; left: 0; }


/* typography
------------------------------------------------------------------ */
body,input,select,th,td,textarea { font: 13px/1.5 Georgia, Arial, Helvetica, sans-serif; color:#fff; }

h1,h2,h3,h4,h5,h6 { font-family: Georgia, Arial, Helvetica, sans-serif; line-height:1.1em; letter-spacing: 0.05em; color: #fff; font-weight: normal; }

h1 { font-size: 24px; }
h2 { font-size: 21px; }
h3 { font-size: 18px; }
h4 { font-size: 15px; }

.small,small { font-size: 11px; color:#999999 }

p { padding: 7px 0; }


/* links
------------------------------------------------------------------ */
a:link,a:visited { color:#fff; }
a:hover { text-decoration:none; }


