/* THE BIG GUYS */
* {margin:0;padding:0}
body {text-align:center;padding: 20px 0 20px;background: #fff;color:#333;font:83%/1.3 arial,tahoma,verdana,sans-serif}

/* LINKS */
a,a:link,a:link,a:link,a:hover {background:transparent;text-decoration:underline;cursor:pointer} 
a:link {color:#c00} 
a:visited {color:#999} 
a:hover,a:active {color:#069} 

a.products,a.products:link,a.products:link,a.products:link,a.products:hover {background:transparent;text-decoration:underline;cursor:pointer;margin:0 0 0 1px} 

/* FORMS */
form {margin: 0 0 1.5em}
input {font-family: arial,tahoma,verdana,sans-serif;margin: 2px 0}
fieldset {border: none}
label {display:block;padding: 5px 0}
label br {clear:left}

	/* FORMS - general classes */
	input.f-submit {padding: 1px 3px;background:#666;color:#fff;font-weight:bold;font-size:96%}
	
	/* FORMS - f-wrap-1 - simple form, headings on left, form elements on right */
	form.f-wrap-1 {width:100%;padding: .5em 0;background: #f6f6f6 url("images/featurebox_bg.gif") no-repeat 100% 100%;border-top: 1px solid #d7d7d7;position:relative}
		form.f-wrap-1 fieldset {width:auto;margin: 0 1em}
		form.f-wrap-1 h3 {margin:0 0 .6em;font: bold 155% arial;color:#c00}
		form.f-wrap-1 label {clear:left;float:left;width:100%;border-top: 1px solid #fff}
		
		/* hide from IE mac \*/
		form.f-wrap-1 label {float:none}
		/* end hiding from IE5 mac */
	
		form.f-wrap-1 label input, form.f-wrap-1 label textarea, form.f-wrap-1 label select {width:15em;float:left;margin-left:10px}
		
		form.f-wrap-1 label b {float:left;width:8em;line-height: 1.7;display:block;position:relative}
		form.f-wrap-1 label b .req {color:#c00;font-size:150%;font-weight:normal;position:absolute;top:-.1em;line-height:1;left:-.4em;width:.3em;height:.3em}
		form.f-wrap-1 div.req {color:#666;font-size:96%;font-weight:normal;position:absolute;top:.4em;right:.4em;left:auto;width:13em;text-align:right}
		form.f-wrap-1 div.req b {color:#c00;font-size:140%}
		form.f-wrap-1 label select {width: 15.5em}
		form.f-wrap-1 label textarea.f-comments {width: 20em}
		form.f-wrap-1 div.f-submit-wrap {padding: 5px 0 5px 8em}
		form.f-wrap-1 input.f-submit {margin: 0 0 0 10px}
		
		form.f-wrap-1 fieldset.f-checkbox-wrap, form.f-wrap-1 fieldset.f-radio-wrap {clear:left;float:left;width:32em;border:none;margin:0;padding-bottom:.7em}
		form.f-wrap-1 fieldset.f-checkbox-wrap b, form.f-wrap-1 fieldset.f-radio-wrap b {float:left;width:8em;line-height: 1.7;display:block;position:relative;padding-top:.3em}
		form.f-wrap-1 fieldset.f-checkbox-wrap fieldset, form.f-wrap-1 fieldset.f-radio-wrap fieldset {float:left;width:13em;margin: 3px 0 0 10px}
		form.f-wrap-1 fieldset.f-checkbox-wrap label, form.f-wrap-1 fieldset.f-radio-wrap label {float:left;width:13em;border:none;margin:0;padding:2px 0;margin-right:-3px}
		form.f-wrap-1 label input.f-checkbox, form.f-wrap-1 label input.f-radio {width:auto;float:none;margin:0;padding:0}
		
		form.f-wrap-1 label span.errormsg {position:absolute;top:0;right:-10em;left:auto;display:block;width:16em;background: transparent url(images/errormsg_bg.gif) no-repeat 0 0}
		form.f-wrap-1 label span.errormsg b {padding: 10px 0;margin: 0 10px 0 30px;color:#B30800;font-weight:bold;display:block;width:auto;float:none;line-height:1.3}

/* TYPOGRAPHY */
p, ul, ol {margin: 0 0 1.5em 1px}
h1, h2, h3, h4, h5, h6 {font-family: arial,verdana,sans-serif;margin: 1.2em 0 .3em;color:#000}
h1 {font-size: 196%;border-bottom: 1px solid #ababab;width:770px;margin: 1em 0 .6em;padding-bottom:.3em}
h2 {font-size: 136%}
h3 {font-size: 126%}
h4 {font-size: 116%}
h5 {font-size: 106%}
h6 {font-size: 96%}
.highlight {color:#E17000}
.subdued {color:#999}
.error {color:#c00;font-weight:bold}
.success {color:#390;font-weight:bold}
.caption {color:#999;font-size:11px}
.date {font: bold 82% arial;color:#bbb;display:block;letter-spacing: 1px}
small {font-size:11px}

/* LISTS */
ul {margin: .3em 0 1.5em 0;list-style-type:none}
	ul.related {margin-top: -1em}
ol {margin: .5em .5em 1.5em}
ol li {margin-left: 1.8em;padding-left: 0;background: none; list-style-type: decimal}
li {line-height: 1.4em;padding-left: 25px;background: #fff url("images/sprites_li.gif") no-repeat 0 0}
li.doc {background-position: 3px -500px}
ul.nomarker li {background:none;padding-left:0}

dl {margin: 0 0 1em 0}
dt {font-weight:bold;margin-top: 1.3em}
dl dl {margin: 0 0 1.5em 30px}

/* GENERAL */
img {border:none} 
hr {margin: 1em 0;background:#f2f2f2;height:1px;color:#f2f2f2;border:none;clear:both}
.clear {clear:both;position:relative;font-size:0px;height:0px;line-height:0px} 

/* LAYOUT - HEADER */
#header {}

	#header #site-name {}
	
	/* NAV - top horizontal nav */
	#nav, #nav ul {padding: 0;margin: 0;list-style: none}
	#nav {border-bottom: 1px solid #fff;padding-left: 20px;font-weight:bold;height:2em;font: bold 96% arial;margin: 20px 0 0;background: #c00 url("images/sprites.gif") repeat-x 0 100%}
	#nav li {z-index:100;background:none;position:relative;float: left;width: 10em;display:block;margin: 0;padding:0;border-right: 1px solid #fe9f9f}
	#nav a, #nav a:link, #nav a:visited, #nav a:hover, #nav a:active {text-decoration:none;cursor:pointer;color:#fff;display: block;padding: 3px 10px 1px}
	#nav a:hover {color:#c00;background:#fff}
	
	
	#nav li.active {z-index:99999;margin: -2px -3px -3px;background: #fff url("images/sprites.gif") no-repeat 0 -300px;padding-left:6px;border:none}
	#nav li.active a, 
	#nav li.active a:link, 
	#nav li.active a:visited, 
	#nav li.active a:hover, 
	#nav li.active a:active {color:#c00;background: #fff url("images/sprites.gif") no-repeat 100% -300px;padding: 6px 16px 3px 10px}
		

	/* hide from IE mac \*/
	#nav li {width:auto}
	/* end hiding from IE5 mac */
	
	/*#nav-secondary {font-size:86%;margin: 6px 0}*/
	#nav-secondary {font-size:86%;margin: 6px 0 0 1px}
	#nav-secondary a:link, #nav-secondary a:visited, #nav-secondary a:hover, #nav-secondary a:active {color:#c00}
	
	/* SEARCH */
	#search {color:#fff;font-weight:bold;position:absolute;top:10px;right:110px;left:auto;width:18em}
	#search form {margin:0}
	#search input {width:8em;margin: 0 0 -1px;height:1.2em}
	#search label {padding:5px 0 0;display:inline}
	#search input.f-submit {width:auto;font-size:81%;margin:0 0 -.15em;height:1.95em}
	
	/* POWERED BY - mollio logo in this case */
	#poweredby {width:96px;height:63px;position:absolute;top:-102px;right:0}

/* LAYOUT - main body of page */
#wrap {width:770px;margin: 0 auto;position:relative;text-align:left}
#content-wrap {position:relative;width:100%}
	#sidebar {float:right;width:224px;margin: 5px 0 30px 30px}

#content {font-size:86%}
	
	.featurepic {width:770px;margin: 10px 0 15px; text-align:center;}
	
	.column {width:360px}
	
	#column-1 {float:left}
	#column-2 {float:right}
	
	.column .teaser {clear:both;width:360px;margin: 0 0 10px}

	.teaser h2 {font-size:106%;margin:0}
	.teaser p {margin:0}
	.thumbnail {margin: 0 0 10px 20px;float:right;width:80px}
	.thumbnail-large {margin: 0 0 10px 20px;float:right;width:200px}
	.thumbnail img {border: none}

	.featurebox {padding: 20px 20px 1em;margin: 0 0 20px;background: #fff url("images/featurebox_bg.gif") no-repeat 0 100%}
	.featurebox h2 {padding: 20px;background: #fff url("images/featurebox_bg.gif") no-repeat 0 0;margin: -20px -20px -15px}
	
	.download h2 img {float:right;width:46px;position:relative;height:49px;margin: 0 0 10px 10px}
	
	.download-button a:link, 
	.download-button a:visited, 
	.download-button a:hover, 
	.download-button a:active {position:relative;margin: -5px -20px -30px;display:block;width:224px;height:56px;background: #fff url("images/sprites.gif") no-repeat 0 -400px}
	
	.download-button a:hover {background: #fff url("images/sprites.gif") no-repeat 0 -500px}
	
	.download-button span {display:none}
	
	.volumes-available ul {margin:0}
	.volumes-available br {clear:left}
	.volumes-available li {margin:0 15px 0 0;padding:0;text-align:center;font-weight:bold}
	.litres-5, .litres-25, .litres-210 {display:block;float:left;width:55px;height:110px;background: #fff url("images/sprites.gif") no-repeat 0 -580px}
	.litres-5 {background-position: -140px -580px}
	.litres-25 {background-position: -70px -580px}
	.litres-1000 {display:block;width:156px;height:150px;background: #fff url("images/sprites.gif") no-repeat 0 -700px}
	
	
	/* TABLES */
	.table1 {border: 2px solid #900;border-collapse:collapse;width:100%}
		.table1 td {background: #fff url("images/sprites.gif") repeat-x 0 -1600px;padding:3px;border: 1px solid #fff}
		.table1 th {text-align:left;border: 1px solid #fff}
		.table1 thead th {color:#fff;font-size:145%;background: #900 url("images/sprites.gif") repeat-x 0 -1300px;padding: 10px 6px}
		.table1 tbody th {color:#fff;font-size:115%;background: #88b8db url("images/sprites.gif") repeat-x 0 -1400px;padding: 6px}
		.table1 tbody th.sub {font-size:100%;color:#000;background: #efefef url("images/sprites.gif") repeat-x 0 -1500px;padding: 6px}


/* LAYOUT - FOOTER */
#footer {margin: 15px 0;background: #fff url("images/sprites.gif") no-repeat -10px 0;clear:both;border-top: 1px solid #ababab;padding: 60px 0 30px;font-size:86%;color:#444;width:770px}
	#footer p {margin:0 0 10px}
	#footer a:link {color:#000}

	
.featureProduct {width:200px;height:200px;float:left;text-align:center;}
.featureImage {height:172px;}
.featureImage img {vertical-align:bottom;}

span.win { color: #00b050; }