* {font-family: arial, verdana, sans-serif, serif; font-size: x-small;}

body {background: #282828 url(/UI/images/topBodyShadow.png) repeat-x; margin: 0; padding: 0;}
#docWrap {background: #1e1e1e url(/UI/images/topBodyShadow.png) repeat-x; max-width: 96em; margin: 0 auto;}

#docPadding {padding: 0 4em 6.1em; min-height: 66em;}

fieldset, img, form {border: none; margin: 0; padding: 0;}
.col {float: left;}
.row, .cb {clear: both;}

/* -- top -- */
#top {padding: 3.2% 0 1em; position: relative;}
#top div {position: absolute;}
#top ul {margin: 0; padding: 5.5% 0 6em 9%; list-style: none;}
#top ul li {float: left; margin:0 3.2% 0 0;}
#top a {text-transform: uppercase; color: #d0cec4; text-decoration: none; font-size: 1.8em;}
#top a.active {color: #ffb424;}
/* -- /top -- */

/* -- main -- */
#main {clear: both; padding: 0;}

#main .startImage {margin-bottom: 2em;}
#main .startImage img {
	margin-bottom: 5px;
	box-shadow: 5px 5px 5px #000;
	-moz-box-shadow: 5px 5px 5px #000;
	-webkit-box-shadow: 5px 5px 5px #000;
}
#main .startImage p {font-size: 1.4em; padding: 0; margin: 0;}

#main .startImage a {
	text-decoration: none;
}

#main .fullWidthImage {margin-bottom: 2em;}
img {max-width: 100%;}
	
	/* -- article -- */
	#main #article {width: 69%; padding-right: 1%;}
	
	#main #article * {color: #a9a79b;}
	#main #article h1, #main #article h2 {margin: 0.8em 0 0.2em;}
	#main #article h1 {font-size: 2.2em;}
	#main #article h2 {font-size: 1.7em;}
	#main #article p {font-size: 1.4em; margin: 0 0 0.5em;}
	#main #article p * {font-size: 1em;}
	#main #article > p,
	#main #article > h2 {padding-right: 2em;}	
	#main #article img {margin-top: 15px}
	#main #article p.imageText {font-size: 1.2em;}
	
	#main .left {margin-right: 4.5%;}
	
	.product #main #article h1,
	.contact #main #article h1,
	.order #main #article h1 {margin-top: 0;}
	.contact #main #article fieldset,
	.order #main #article fieldset {
		background: url(/UI/images/contactForm_bg.jpg) no-repeat;
		margin-top: 2em;
		padding: 2.5em 13.4em 6em 4.1em;
	}
	.contact #main #article fieldset label {display: block; text-align: center; margin-top: 0.8em;}
	.contact #main #article fieldset span,
	.contact #main #article fieldset input,
	.contact #main #article fieldset textarea {font-size: 1.2em; width: 48%; display: inline-block;}
	.contact #main #article fieldset span {text-align: right; vertical-align: top; padding: 0.2em 1% 0 0;}
	/* -- /article -- */

	/* -- aside -- */
	#main #aside {width: 30%;}
	#main #aside p {font-size: 1.2em; margin: 0.5em 0 0;}
	#main #aside p * {font-size: 1em;}
	#main #aside img.small {margin-top: 30px;}
	
	/*.start #main #aside {background: url(/images/orderForm_bg.jpg) repeat-x;}*/
	.product #main #aside {background: url(/UI/images/bira_bg.png) no-repeat center center; min-height: 69em}
	
	#main #aside * {color: #a9a79b;}
	.start #main #aside * {color: #cac8c0;}
	
	#main #aside fieldset {padding: 1em;}
	.order #main #article fieldset {padding: 2em 5em 2em 2em; min-height: 24em;}
	.order #main #article fieldset div.fsTop *{display: inline-block;}
	#main #aside fieldset div h2 {font-size: 1.6em; margin: 0;}
	.order #main #article fieldset div h2 {float: left;}
	#main #aside fieldset div div,
	.order #main #article fieldset div div {font-weight: bold; font-size: 1.2em; float: right;}
	#main #aside fieldset div div span,
	.order #main #article fieldset div div span {font-weight: normal; font-size: 1em; padding-top: 0.3em;}
	
	#main #aside fieldset label,
	.order #main #article fieldset label {display: block; clear: both; padding-top: 0.8em;}
	#main #aside fieldset label *,
	.order #main #article fieldset label * {font-size: 1.2em;}
	.order #main #article fieldset label span {float: left;}
	.order #main #article fieldset label input {width: 4em; float: right; color: #000 !Important; text-align: right;}
	
	.start label * {display: block;}
	
	#main fieldset .sendButton {text-align: right; padding-top: 1.5em; clear: both;}
	.start #main fieldset .sendButton {text-align: left;}
	#main fieldset .sendButton input {
		color: #ffb424 !Important; font-size: 1.2em; font-weight: bold; border: none; vertical-align: middle;
		background: url(/UI/images/add_button_bg.png) repeat-x; padding: 0.3em 0.8em; width: auto !Important;
		border-radius: 3px;
		-moz-border-radius: 3px;
		-webkit-border-radius: 3px;
	}
	
	#main #aside #contact {margin-top: 2em; padding-left: 2em;}
	#main #aside #contact h2 {font-size: 1.6em; margin: 0 0 0.3em;}
	#main #aside #contact .vcard {margin-bottom: 1.6em;}
	#main #aside #contact .vcard div {font-size: 2.4em; font-weight: bold;}
	#main #aside #contact .vcard div * {font-size: 1em;}
	#main #aside #contact .vcard .email {font-size: 1.4em; text-decoration: none;}
	
	.contact #main #aside #contact,
	.order #main #aside #contact {padding-left: 0;}
	/* -- /aside -- */

/* -- /main -- */

.beerList {padding: 0; margin: 20px 0 0 0; list-style: none;}
.beerList li {clear: both;}
.beerList li > * {float: left;}
.beerList li > div {width: 70%; margin-left: 2em;}
#main #article .beerList li h2 {margin: 0 0 0.5em 0;}
#main #article .beerList li > div > p {margin-bottom: 1em;}

.beerList li .price {background: url(/UI/images/medalj.png) no-repeat center left; padding: 12px 0 12px 35px;}

#main #article .beerList li > div.cb {width: auto; margin: 0; height: 1.5em;}