@charset "utf-8";
/**
 * Shop CSS
 *
 * @project		Stuttgarter Hofbräu
 * @author		Boris Bojic <bojic@devshack.biz>
 * @copyright	Copyright (c) 2010, Boris Bojic (DevShack)
 * @version		Mon, 02 Aug 2010 02:03:58 +0200
 *
 */

/*
--- Generelles ------------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------------------------
*/

#maincol .forceclear{
	clear: both;
}

#maincol h2{
	font-size: 1em;
}

#maincol h3{
	padding: 0 25px 1em 25px;
	margin: 0;
	font-size: .8em;
	line-height: 1.5;
	background-color: transparent;
	color: #333;
	cursor: auto;
}

#maincol h4{
	padding: 0 0 .8em 0;
	font-size: .75em;
	line-height: 1.5;
	color: #333;
}

#maincol p{
	padding: 0 0 .8em 0;
}

#maincol p.right{
	padding-right: 10px;
	text-align: right;
}

#maincol p.center{
	text-align: center;
}

/* Spezialfarben zum Markieren */
#maincol .redcolor{
	color: #c00;
}

#maincol .bluecolor{
	color: #00c;
}

#maincol .greencolor{
	color: #0c0;
}

#maincol p.smalltext{
	font-size: .7em;
}

#maincol p.shop-infotext{
	padding: 0 0 20px 10px;
	margin-top: -15px;
	font-size: .7em;
}

	#maincol p.successmessage,
	#maincol p.errormessage{
		padding: 10px 10px 10px 45px !important;
		margin: 10px;
		font-weight: bold;
		color: #264409;
		border: 2px solid #C6D880;
		background: #E6EFC2 url('/cms/design/icons/success.png') 8px 40% no-repeat;		
	}

	#maincol p.errormessage {
		border-color: #FBC2C4;
		color: #8a1f11;
		background:  #FBE3E4 url('/cms/design/icons/error.png') 8px 50% no-repeat;
	}

#maincol address{
	font-style: normal;
	padding: 0 0 1em 0;
	font-size: 1em;
}

#maincol hr.blindclear{
	margin: 0;
	padding: 0;
	visibility: hidden;
	clear: both;
}

/*
--- Artikel / Kategorieansicht --------------------------------------------------------------------------
---------------------------------------------------------------------------------------------------------
*/

/* Artikelbox */
#maincol .art_box{
	width: 670px;
	margin: 0 auto;
	padding-bottom: 1em;
}

	/* Obere Reiter */
	#maincol .art_box ul.tabnav{
		clear: both;
		padding: 0;
		font-size: .8em;
		font-weight: bold;
	}

		#maincol .art_box ul.tabnav li{
			float: left;
			width: 270px;
			line-height: 28px;
			padding: 0 10px;
			border: 1px solid #E5CA7D;
			border-bottom-color: #fff;
			border-width: 1px 1px 1px 0;
			background: #fff url('./img/shop/artikel/art-nav-back.png') repeat-x;
			color: #594511;
		}

	#maincol .art_box .art_wrap{
		background: #fff;
	}

	/* Artikelbild */
	#maincol .art_box .art_pic{
		float: left;
		width: 180px;
		height: 130px;
		background-repeat: no-repeat;
		background-position: 50% 50%;
		background-color: #fff;
		text-indent: -9999em;
	}

		#maincol .art_box .art_pic a{
			display: block;
			height: 130px;
			outline: none;
		}

	/* Artikelbeschreibung */
	#maincol .art_box .art_desc{
		float: right;
		width: 490px;
		min-height: 125px;
		padding-bottom: 5px;
		background: #fff;
	}

		#maincol .art_box .art_desc p{
			padding: 10px 10px 0 10px;
			line-height: 1.5;
		}

	/* Untere Artikelleiste */
#maincol .art_box .art_form_bar input,
#maincol .art_box .art_form_bar select{
	border: 1px solid #E5CA7D;
	background: #fff;
	font-size: 1em;
}

#maincol .art_box .art_form_bar select{
	width: 110px;
}

	#maincol .art_box .art_form_bar{
		clear: both;
		background: #EFDEAB url('./img/shop/artikel/art-bar-back.png') repeat-x;
	}

	#maincol .art_box .art_form_bar ul{
		line-height: 26px;
		padding: 0 10px;
		font-size: .7em;		
	}

		#maincol .art_box .art_form_bar ul li{
			float: left;
			width: 160px;
			padding: 0;
		}
		
		#maincol .art_box .art_form_bar ul li.bar_price{
			font-weight: bold;
		}
		
		#maincol .art_box .art_form_bar ul li.bar_amount{
			width: 100px;
		}

		#maincol .art_box .art_form_bar ul li.bar_amount input{
			width: 25px;
			padding: 0 3px;
		}

		#maincol .art_box .art_form_bar ul li.bar_basket{
			width: 220px;
			text-align: right;
		}

		#maincol .art_box .art_form_bar ul li.bar_basket input{
			padding: 0 5px;
			text-align: center;
			background: #c3a85b;
			color: #fff;
			cursor: pointer;
		}

/*
--- Stöbern ---------------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------------------------
*/
#maincol dl.shop-stoeb{
	float: left;
	width: 82px;
	margin: 0 0 15px 18px;
	font-size: .7em;
}

#maincol dl.shop-stoeb dt{
	border: 1px solid #E5CA7D;
	background: #fff;
}

#maincol dl.shop-stoeb dt a{
	display: block;
	width: 80px;
	height: 80px;
	opacity: 0.65;
}

#maincol dl.shop-stoeb dt a:hover{
	opacity: 1;
}

#maincol dl.shop-stoeb dt img{
	display: block;
}

#maincol dl.shop-stoeb dd{
	color: #c00;
	padding: 3px 4px 0 0;
	text-align: right;
}

/*
--- Warenkorb -------------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------------------------
*/

/* Obere Warenkorb Navi */
#maincol ul.basketagb-nav{
	clear: both;
	width: 625px;
	padding: 0;
	margin: 0 auto 1px auto;
}


	#maincol ul.basketagb-nav li{
		width: 124px;
		margin-left: 1px;
		float: left;
		padding: 5px 0;
		text-align: center;
		background: #F8EFD7;
	}

		#maincol ul.basketagb-nav li#first{
			width: 125px;
			margin-left: 0;
		}

	#maincol ul.basketagb-nav li a{
		display: block;
		color: #BB0037;
		text-decoration: none;
	}

	#maincol ul.basketagb-nav li a:hover{
		color: #f77;
		text-decoration: underline;
	}

#maincol #basket-overview{
	clear: both;
	margin: 0 auto;
	width: 625px;
	background-color: #F1E3B8;
	margin: 0 auto;
}

	#maincol #basket-overview p{
		padding: 5px 0;
		text-align: center;
	}

/* Tabelle für Warenkorb */
#maincol .basket-wrap{
	clear: both;
	margin: 0 auto 20px auto;
	background: #fff url('./img/shop/warenkorb/basket-top-back.png') repeat-x;
	padding-top: 27px;
	border: 1px solid #E5CA7D;
	border-width: 1px 0;
}

#maincol .basket-wrap table{
	width: 640px;
	margin: 0 10px 25px 10px;
	font-size: .7em;
	line-height: 1.5;
	color: #333;
}

#maincol .basket-wrap table th{
	text-align: left;
}

#maincol .basket-wrap table th,
#maincol .basket-wrap table td{
	padding: 5px 3px;
	border: 1px solid #E5CA7D;
	border-width: 0 1px 1px 0;
}

#maincol .basket-wrap table th.lastcell,
#maincol .basket-wrap table td.lastcell{
	border-right: 0 none;
}

#maincol .basket-wrap table th.halfcell{
	width: 50%;
	border-right: 0 none;
}

#maincol .basket-wrap table th.cntcell,
#maincol .basket-wrap table td.cntcell{
	text-align: center;
}

#maincol .basket-wrap table th.rgtcell,
#maincol .basket-wrap table td.rgtcell{
	text-align: right;
}

#maincol .basket-wrap table tr.bottomcell th,
#maincol .basket-wrap table tr.bottomcell td{
	border: 0 none;
	padding: 15px 3px;
	vertical-align: top;
	font-weight: bold;
}

#maincol .basket-wrap table tr.bottomcell small,
#maincol .basket-wrap table tr.bottomcell small{
	font-weight: normal;
}

	/* Ändern / Löschen Buttons */
	#maincol .basket-wrap table a.basket-but{
		display: block;
		width: 5em;
		padding-left: 2em;
		margin: 5px 0;
		color: #BB0037;
		background: #F8F0CB;
		border: 1px solid #E5CA7D;
		text-align: left;
		text-decoration: none;
	}

		#maincol .basket-wrap table a.basket-but:hover{
			background-color: #E5CA7D;
			color: #900;
		}

	#maincol .basket-wrap table a.del{
		background: #F8F0CB url('./img/shop/warenkorb/del-icon.png') 8px 50% no-repeat;		
	}	

	#maincol .basket-wrap table a.edit{
		background: #F8F0CB url('./img/shop/warenkorb/edit-icon.png') 6px 50% no-repeat;		
	}

/* Zeile für die Lösch-Bestätigung */
#maincol .basket-wrap table tr#askconfirm td{
	background: #F8F0CB;
	color: #BB0037;
	text-align: center;
}

/* Input und Selects in der Tabelle */
#maincol .basket-wrap table input,
#maincol .basket-wrap table select{
	width: 25px;
	padding: 0 3px;
	border: 1px solid #E5CA7D;
	background: #fff;
}

#maincol .basket-wrap table select{
	width: 45px;
	padding: 0;
}

#maincol .basket-wrap table input#submit{
	padding: 2px 5px;
	width: auto;
	color: #BB0037;
	background: #F8F0CB;
	border: 1px solid #E5CA7D;
	cursor: pointer;
}

/* Untere Navigation im Warenkorb */
#maincol ul.basket-nav{
	font-size: .79em;
	padding: 0;
	line-height: 26px;
	background: #fff url('./img/shop/warenkorb/basket-bottom-back.png') left bottom repeat-x;	
	border-top: 1px solid #E5CA7D;
}

#maincol ul.basket-nav li{
	padding: 0;
	width: 100px;
}

#maincol ul.basket-nav li.leftnav{
	float: left;
	padding-left: 10px;
}

#maincol ul.basket-nav li.rightnav{
	float: right;
	text-align: right;
	padding-right: 10px;
}

/* Bissel Abstabd im Korb */
#maincol .basket-wrap p{
	padding-left: 15px;
}


/* Kasse / Bestellung */

#maincol .basket-wrap table tr.noborder td{
	border: 0 none;
	padding: 2px 3px;
}

#maincol .basket-wrap table tr.topvalign td{
	vertical-align: top;
}

#maincol .basket-wrap table tr.extrapad td{
	padding-top: 15px;
}

#maincol .basket-wrap table tr.lastrow td{
	padding-bottom: 0;
}

#maincol .basket-wrap table tr td.bigtext{
	font-size: 1.2em;
}


#maincol input.basket-submit{
	font-size: 1em;
	padding: 2px 10px;
	color: #BB0037;
	background: #F8F0CB;
	border: 1px solid #E5CA7D;
	font-weight: bold;
	cursor: pointer;	
}

#maincol .basket-wrap h6{
	color: #333;
	font-size: .79em;
	padding: 5px 3px;
	margin: 0 10px 1em 10px;
	border-bottom: 1px solid #E5CA7D;
}

#maincol .basket-wrap h6 em{
	color: #BB0037;
	font-weight: normal;
}

/* Formulare */
#maincol ul.address-list{
	padding: 0 15px 25px 15px;
}

	#maincol ul.address-list li{
		float: left;
		width: 310px;
		padding: 4px 0;
	}

		#maincol ul.address-list li.full{
			clear: both;
			width: 600px;
		}

#maincol ul.hideit{
	display: none;
}

#maincol ul.showit{
	display: block;
}

#maincol ul.address-list label{
	float: left;
	width: 80px;
	padding-top: 3px;
	font-size: .79em;
}

#maincol ul.address-list input,
#maincol ul.address-list textarea{
	float: left;
	width: 200px;
	margin-left: 2px;
	padding: 3px;
	border: 1px solid #E5CA7D;
	background: #fff;
	font-size: .79em;
}

#maincol ul.address-list textarea{
	width: 550px;
}

	#maincol ul.address-list input:hover,
	#maincol ul.address-list input:focus,
	#maincol ul.address-list textarea:hover,
	#maincol ul.address-list textarea:focus{
		background: #F8F0CB;
	}

#maincol ul.address-list input#strasse,
#maincol ul.address-list input#liefer_strasse{
	width: 150px;
}

#maincol ul.address-list input#hausnr,
#maincol ul.address-list input#liefer_hausnr{
	width: 40px;
}

#maincol ul.address-list input#plz,
#maincol ul.address-list input#liefer_plz,
#maincol ul.address-list input#anrede{
	width: 50px;
}

#maincol ul.address-list input#ort,
#maincol ul.address-list input#liefer_ort{
	width: 140px;
}

#maincol dl.option-list{
	font-size: .75em;
	color: #333;
	line-height: 1.5;
	padding: 0 15px 25px 15px;
}

	#maincol dl.option-list dt{
		width: 20px;
		float: left;
	}

	#maincol dl.option-list dd{
		padding-left: 25px;
	}

#maincol dl.option-list em{
	color: #c00;
	font-style: normal;
}

#maincol dl.option-list a{
	color: #c00;
	text-decoration: none;
}

#maincol dl.option-list a:hover{
	color: #f44;
	text-decoration: underline;
}

/*
--- CSS3 Schlagschatten ---------------------------------------------------------------------------------
---------------------------------------------------------------------------------------------------------
*/
#maincol ul.basketagb-nav,
#maincol #basket-overview,
#maincol .art_box ul.tabnav li,
#maincol .art_box .art_wrap,
#maincol .art_box .art_form_bar,
#maincol .basket-wrap,
#maincol dl.shop-stoeb dt{
	box-shadow: 2px 2px 2px #9F8A59;			/* CSS3 + Opera */
	-moz-box-shadow: 2px 2px 2px #9F8A59;		/* Mozilla */
	-webkit-box-shadow: 2px 2px 2px #9F8A59;	/* Webkit, Safari, Chrome */
}

/*
--- CSS Autoclear ---------------------------------------------------------------------------------------
---------------------------------------------------------------------------------------------------------
*/

#maincol ul#shop-uebersicht:after,
#maincol .art_box ul:after,
#maincol .art_box .art_wrap:after,
#maincol .art_box .art_form_bar ul:after,
#maincol ul.basket-nav:after,
#maincol ul.basketagb-nav:after,
#maincol ul.address-list:after,
#maincol ul.address-list li:after,
#maincol dl.option-list:after{
	content: ".";display: block;height: 0;clear: both;visibility: hidden;
}