@charset "UTF-8";
/* 
ECOSTORE AUSTRALIA
AUTHOR: Peepshow || http://peepshow.co.nz
AGENCY: Tango Communications || http://tangocomms.co.nz
*/

body 
{
	background-color:#c2c2c2;
	font-family:"Tahoma", Geneva, sans-serif;
	font-size:67%;
	color:#797979;
}

p
{
	line-height:1.5em;
	margin-bottom:1.7em;
	text-align: left;
}

h2
{
	font-size:1.8em;
	color:#666;
	font-weight:normal;
	margin:0 0 10px;
}
h3
{
	font-size:1.3em;
	color:#666;
	font-weight:normal;
	margin:0 0 10px;
}

a:link, a:active, a:visited
{
	text-decoration:none;
	color:#92BB56;
	outline:none;
}

a:hover
{
	text-decoration:none;
	color:#333;
	text-align: left;
}

ol
{
	margin:0 0 0 10px;
}
ol li
{
	margin:0 0 10px 10px;
}


.main
{
	background-color:#fff;
	padding:30px 0 0;
	margin:20px auto 0;
}

.logo img
{
	margin:0 0 10px 30px;
}
.locator_bt
{
	width:230px;
	margin:0px auto;
}
	.locator_bt a:link,  .locator_bt a:visited,  .locator_bt a:active
	{
		background:url(images/ecostore_loactor_bt.png) no-repeat 0 0;
		width:230px;
		height:79px;
		display:block;
		text-indent:-9999px;
		margin:0;
	}
	.locator_bt a:hover
	{
		background:url(images/ecostore_loactor_bt.png) no-repeat 0 -79px;
	}
.chemicals_bt
{
	width:230px;
	margin:0px auto;
	padding:10px 0 0;
}
	.chemicals_bt a:link,  .chemicals_bt a:visited,  .chemicals_bt a:active
	{
		background:url(images/chemicals_bt.png) no-repeat 0 0;
		width:230px;
		height:79px;
		display:block;
		text-indent:-9999px;
		margin:0;
	}
	.chemicals_bt a:hover
	{
		background:url(images/chemicals_bt.png) no-repeat 0 -79px;
	}
.subscribe_bt
{
	width:230px;
	margin:0px auto;
	padding:10px 0 0;
}
	.subscribe_bt a:link,  .subscribe_bt a:visited,  .subscribe_bt a:active
	{
		background:url(images/subscribe_bt.png) no-repeat 0 0;
		width:230px;
		height:79px;
		display:block;
		text-indent:-9999px;
		margin:0;
	}
	.subscribe_bt a:hover
	{
		background:url(images/subscribe_bt.png) no-repeat 0 -79px;
	}
.side
{
	margin:0 0 0 30px;
}
.nzlink
{
	text-align:center;
	padding:0 50px 10px 0;
}
.competition
{
	background-color:#B1D47D;
	width:230px;
	margin:10px 0 0 30px;
}
.top_menu
{
	font-size:1.4em;
}
	.top_menu ul
	{
		list-style:none;
		margin:0;
		padding:0
	}
		.top_menu ul li
		{
			display:inline;
			margin:0 40px 20px 0;
			padding:0
		}

.header_strip
{
	margin:40px 0 0;
}

.intro_text
{
	font-size:1.2em;
	line-height:1.3em;
	color:#797979;
	margin:30px 0 20px;
}

.pull_out
{
	padding:30px;
	border:3px solid #B1D47D;
	border-left:none;
	border-right:none;
	background:#E9F1DD;
	margin:0 0 30px 0;
}

	.pull_out img
	{
		float:right;
		padding-left:40px;
	}
	.pull_out ul
	{
		list-style:square;
		margin:20px;
		padding:0;
		font-size:1.2em;
	}
		.pull_out ul li
		{
			margin:0 20px 0px 0;
			padding:6px 0 0 6px;
		}

	
#product_slide
{
	margin-left:-280px;
	margin-top:20px;
}
.products
{
	margin-top:30px;
}
	
.footer
{
	margin:30px 40px;
	overflow:auto;
	text-align: left;
}
	.footer ul
	{
		list-style:none;
		margin:0;
		padding:0;
	}
		.footer ul li
		{
			display:inline;
			margin:0 20px 0px 0;
			padding:0
		}


/* ##################################################################################### */

/* main vertical scroll */
#main {
	position:relative;
	overflow:hidden;
	height:220px;
	border:4px solid #333;
	border-left:none;
	border-right:none;
}

/* root element for pages */
#pages {
	position:absolute;
	height:20000em;
}

/* single page */
.page {
	height: 230px;
	background:#fff;
	width:900px;
}

/* root element for horizontal scrollables */
.scrollable {
	position:relative;
	overflow:hidden;
	width: 900px;
	height: 200px;
}

/* root element for scrollable items */
.scrollable .items {
	width:20000em;
	position:absolute;
	clear:both;
}

/* single scrollable item */
.item {
	float:left;
	cursor:pointer;
	width:296px;
	height:170px;
}
.item img
{
	float:left;
	margin:-20px 0 0;
}
.item p
{
	padding:10px 0 0; 
	font-size:0.9em;
	line-height:1.2em;
}
.item .intro
{
	padding:20px 10px 20px 40px; 
	font-size:1.1em;
	line-height:1.3em;
}



#itemtabs
{
	background-color:#D6E8BA;
	height:36px;
}

/* main navigator */
ul#main_navi {
	padding:10px 2px;
	margin:0px 0 0 220px;
}

#main_navi li {
	background-color:#333;
	color:#B3DF4C;
	font-size:12px;
	list-style:none;
	padding:10px 20px;
	margin:0;
	cursor:pointer;
	display:inline;
	text-transform:uppercase;
}

#main_navi li:hover {
	background-color:#444;
	color:#fff;
}

#main_navi li.active {
	background-color:#555;
	color:#fff;
}


/* this makes it possible to add next button beside scrollable */
div.scrollable {
	float:left;	
}

/* prev, next, prevPage and nextPage buttons */
a.prev, a.next, a.prevPage, a.nextPage {
	display:block;
	width:18px;
	height:18px;
	background:url(../img/scrollable/arrow/left.png) no-repeat;
	float:left;
	margin:43px 10px;
	cursor:pointer;
	font-size:1px;
}

/* mouseover state */
a.prev:hover, a.next:hover, a.prevPage:hover, a.nextPage:hover {
	background-position:0px -18px;		
}

/* disabled navigational button */
a.disabled {
	visibility:hidden !important;		
}

/* next button uses another background image */
a.next, a.nextPage {
	background-image:url(../img/scrollable/arrow/right.png);
	clear:right;	
}



/*********** navigator ***********/


/* position and dimensions of the navigator */
div.navi {
	width:80px;
	height:20px;
	padding:10px 0px 10px 15px;
	margin:0 auto;
	background:url(images/arrows_fixed.gif) no-repeat 0 15px;
}


/* items inside navigator */
div.navi a {
	width:19px;
	height:19px;
	float:left;
	margin:3px;
	background:url(images/navigator.png) 0 0 no-repeat;
	display:block;
	font-size:1px;
}

/* mouseover state */
div.navi a:hover {
	background-position:0 -19px;      
}

/* active state (current page state) */
div.navi a.active {
	background-position:0 -39px;     
} 	



.boxgrid{ 
	width: 230px; 
	height: 260px; 
	float:left; 
	background:#161613; 
	overflow: hidden; 
	position: relative; 
}
	.boxgrid img{ 
		position: absolute; 
		top: 0; 
		left: 0; 
		border: 0; 
	}
	.boxgrid p{ 
		padding: 0; 
		color:#fff; 
		font-weight:normal;
		font-size:1.2em;
		text-align:center;
	}
	
.boxcaption{
	float: left;
	position: absolute;
	background: #000;
	height: 200px;
	width: 200px;
	opacity: .8;
	/* For IE 5-7 */
	filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=80);
	/* For IE 8 */
	-MS-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
	padding:10px 15px 0;
	top: 220px;
}
	
.boxcaption h3
{
	font-size:1.4em;
	font-weight:bold;
	color:#B1D47D;
	text-align:center;
}
	
/* the overlayed element */
.simple_overlay {
	
	/* must be initially hidden */
	display:none;
	
	/* place overlay on top of other elements */
	z-index:10000;
	
	/* styling */
	background-color:#333;
	
	width:675px;	
	min-height:200px;
	border:1px solid #666;
	
	/* CSS3 styling for latest browsers */
	-moz-box-shadow:0 0 90px 5px #000;
	-webkit-box-shadow: 0 0 90px #000;	
}

/* close button positioned on upper right corner */
.simple_overlay .close {
	background-image:url(../img/overlay/close.png);
	position:absolute;
	right:-15px;
	top:-15px;
	cursor:pointer;
	height:35px;
	width:35px;
}

form .input-bg
{
	padding:10px;
}

label {
	font-size: 1.1em;
	font-weight: bold;
	margin:10px 0 0px 10px;
}
label.error {
	color:#C00;
	font-size:1em;
	font-weight:normal;
}
input.text
{
	width:300px;
	padding:2px;
}
select
{
	width:300px;
	padding:4px;
}
input.submit-button
{
	margin:10px;
}