/* -----------------------------------------------------------------
	Creation: 	Original:	29/10/2009
	Author:		Robert Dillon
				www.refreshingedge.com
	Contents
	-----------------------------
	00	resets
	00 	body
	02 	contentWidth
	03	 wrapper
	04 	topbar
	05 	header
		05b  page_header
	06 	main
		06b  menu
	07 	menu_left
	08 	menu_right
	09 	page_content
			09b  page_content - category page
			09c  page_content - item page
			09d  page_content - misc page
			09e  page_content - shopping cart page
			09f  tables
		10 	footer
	------------------------------
	colours:
	img border:							#d1e9ed
	section backgrounds:				#dffff8	
	contrast/link colour:				#9d00d9	
	button a/product_bg				#bef1e7
	top border line						#abebff
	bottom border line					#237380
	
	
	
	
/* 00	Resets, margins and padding */
* {
	margin: 0;
	padding: 0;
	border: 0;
	outline: none;
}
a {
	text-decoration: none;
}
h1, h2, h3 {
	text-transform: uppercase;
}
h1, h2 {
	color: #333333;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 18px;
	font-weight: 300;
	letter-spacing: -1px;
}
ul {
	list-style: none;
}



	
/*	01	body
------------------------------------------------------------------*/	
body {
	background: #000000 url(edge_aqualaris/body_bg.jpg) 50% 0 no-repeat;
	color: #333333; 
	font-family: Tahoma, Arial, Helvetica, sans-serif;
	font-size: 12px;
	line-height: 18px;
}



/*	02 	contentWidth
------------------------------------------------------------------*/	
.contentWidth {
	margin: 0 auto;
	width: 1000px;
}



/*	03	 wrapper
------------------------------------------------------------------*/	
#wrapper {
	width: 100%;
}



/*	04 	topbar
------------------------------------------------------------------*/	
#topbar { 
	overflow: hidden;
	margin: 20px auto;																													/* bottom margin relates to page_header so the repeated bg isn't visible at the top */
	width: 1100px;
}
	#topbar img {
		display: block;
		margin: 0px auto;
	}
	#topbar center {
		display: block;
		margin: 0 auto;
	}																																	
	#topbar ul { 
		background: url(edge_aqualaris/nav_bg.png) 50% 50% no-repeat;
		border-top: 1px solid #abebff;
		display: block;
		font-family: Trebuchet, Arial, Helvetica, sans-serif;
		font-size: 12px;
		height: 80px;
		margin: 20px auto -10px;
		padding:0 0 0 20px;
		overflow: auto;
		width: 1037px;
	}																																	
		#topbar ul li {  
			background: transparent url(edge_aqualaris/nav_sep.png) 100% 32px no-repeat;
			float: left;
			padding: 30px 40px 15px 20px;																						/* padding top here pushes the li down to center of the background image, whilst leaving the ul larger so border-top sits off img */
		}
			#topbar ul li:last-child {
				background: none;																										/*	remove the last seperator */
			}	
	#topbar a {
		color: #fffefe; 
		height: 100%;	
		padding: 10px;
		text-transform: uppercase;
		width: 100%;
	}
	#topbar a:hover {
		color: #9d00d9; 
	}	
	

	
/*	05 	header
------------------------------------------------------------------*/	
#header {
	color: #fffefe; 
	margin: 20px auto -20px;
	overflow: hidden;
	width: 100%;
}
	/*	05b  page_header
	------------------------------------------------------------------*/	
#page_header {
	background: transparent url(edge_aqualaris/page_header_bg.png) 50% 0 no-repeat;
	margin: -20px auto 0;										
	padding-bottom: 244px;
	width: 1060px;
}



/*	06 	main
------------------------------------------------------------------*/	
#main {
	background: transparent url(edge_aqualaris/page_repeat_bg.png) 50% 0 repeat-y;
	margin: 0px auto 0;									
	padding: 10px 0 0 0;
	width: 1060px;
}
	#main:after {																												/* float fix (all containers are floated) */
		content: ".";
		display: block;
		height: 0;
		visibility: hidden;
		clear: both;
	}
	#main a {
		color: #4c4c4c;
	}
		#main a:hover {
			color: #9d00d9;
		}
	/*	06b  menu
	------------------------------------------------------------------*/	
	#menu {
		margin: 20px auto 0;
	}
		#menu ul ul li {
			border-bottom: none;		
			list-style-position: inside;
			list-style-type: disc;
		}
	#menu .cart .fright {																												/* this is part of the right menu, shows what's in the cart */
		float: right;
		text-align: right;
		width: 50%;
	}
	


/*	07 	menu_left
------------------------------------------------------------------*/	
#menu_left { 	
	float: left;
	height: 100%;
	margin: -244px 0 0 20px;																										/* pull content back over graphic -244px with 30px "padding" */		
	padding: 0 20px 0 28px;						
	width: 170px;
}
	#menu_left h1 {
		line-height: 34px;
		margin: 0 0 10px -21px;
		padding-left: 20px;
		width: 190px;		
	}
		#menu_left #menu ul li {
			line-height: 20px;		
			margin-left: -10px;																											/*  pull it over to the very edge */
			padding-left: 10px;																											/* push the content back */
		}		
			#menu_left #menu ul li:hover {
				padding-left: 15px;																										/* push the content back */
			}			
		#menu_left #menu ul li a {
			display: block;
			height: 100%;
			width: 100%;
		}
		#menu_left #menu ul ul li a {																									/* this has to go here to prevent inherited behaviour, nested ul doesn't like the display block */
			display: inline;
		}	

		
	
/*	08 	menu_right
------------------------------------------------------------------*/	
#menu_right {  
	float: right;
	height: 100%;
	margin: -244px 20px 0 0;																										/* pull content back over graphic -244px with 30px "padding" */						
	padding: 0 30px 0 10px;						
	width: 170px;
}
	#menu_right h1 {
		line-height: 34px;
		margin: 0 0 10px -9px;
		padding-left: 10px;		
		width: 200px;		
	}
		#menu_right  #track input {																									/* track box */
			background: #dffff8;
			border: 1px solid #d1e9ed;
			float: left;
			height: 18px;
			margin: 0 5px 10px 0;
			width: 130px;
		}		
		#menu_right  #track .button {
			background: #dffff8;
			border: 1px solid #d1e9ed;
			height: 21px;
			width: 15%;
		}		

			

/*	09 	page_content
------------------------------------------------------------------*/	
#page_content {
	float: right;
	height: 100%;
	margin: -214px auto 0;																											/* pull content back over graphic -244px with 30px "padding" */		
	padding: 0;						
	width: 590px;
}
	#page_content p a {		
		color: #9d00d9;
	}
	#page_content h1 {		
		clear: both;
		font-size: 24px;
		margin-bottom: 10px;	
	}
	#page_content h2 {		
		clear: both;
		margin-top: 50px;	
	}	
		/*	09b  page_content - category page/related item (they're the same)
		------------------------------------------------------------------*/	
		#products_a, #products_b, #products_c {
			background: #bef1e7 url(edge_aqualaris/product_bg.jpg) 0 0 repeat-x;
			border: 1px solid #d1e9ed;
			display: block;
			float: left;
			margin: 10px 10px 10px 0;
			padding: 8px;
		}
			#products_a h1, #products_b h1, #products_c h1, #products_a h2, #products_b h2, #products_c h2 {	
				background: none;
				line-height: inherit;
			}
			#products_a h1, #products_b h1, #products_c h1 {	
				display: block;
				letter-spacing: 0px;
				font-size: 14px;
				margin-bottom: 0.3em;	
			}
		#products_a {
			width: 95%;
		}
			#products_a img {
				float: left;
				height: auto;
				margin-right: 10px;
			}
			#products_a .desc { 
				float: left;
				width: 400px; 
				height: 75px; 
			}	
			#products_a .price {
					clear: both;
					float: left;
					margin: 5px 0 0 0;
					width: 100%;
			}	
			#products_a .link {
					float: right;
					text-align: right;
					width: 50%;
			}			
		#products_b {
			width: 45%;																													/*	width adjusted to take into condiseratio padding and margin */
		}
			#products_b img {
				float: left;
				height: auto;
				margin-right: 5px;
			}
			#products_b .desc { 
				float: left;
				width: 150px;
				height: 56px; 
			}	
				#products_b .price {
					clear: both;
					float: left;
					margin: 5px 0 0 0;
					width: 100%;
				}	
				#products_b .link {
					float: right;
					text-align: right;
					width: 50%;
				}	
		#products_c {
			width: 28%;																													/*	width adjusted to take into condiseration padding and margin */
		}
			#products_c img {
				float: left;
				height: auto;
				margin-right: 5px;
			}
				#products_c .price {
					clear: both;
					float: left;
					margin: 5px 0 0 0;
					width: 100%;
				}	
				#products_c .link {
					color: red;
					float: right;
					text-align: right;
					width: 50%;
				}	
			#products_c .desc { 
				height: 35px; 
			}
		/*	09c  page_content - item page
		------------------------------------------------------------------*/	
		#page_content p {
			padding: 0.5em 0 0.5em 0;
		}
		#page_content img:first-child  {
			border: 2px solid #d1e9ed;
		}		
		#page_content img {
			border: 6px solid #d1e9ed;
		}		
			#page_content img:first-child:hover {
				border-color: #9d00d9;
			}	
		/*	09d  page_content - misc page
		------------------------------------------------------------------*/	
		#page_content ul {
			margin-left: 15px;
			width: 98%;
		}
			#page_content ul li {
				list-style-type: disc;
				margin: 0.5em 0 0.5em 0;
			}	
		/*	09e  page_content - shopping cart page
		------------------------------------------------------------------*/	
		#page_content #cart td {
			background: #dffff8;
			padding: 0.25em 1em 0.25em 1em;
		}
			#page_content #cart td img {
				border: 0;
			}
		#page_content p img:first-child {
			border: 0;
			margin: 10px 0 10px 0;
		}
		/*	09f  tables
		------------------------------------------------------------------*/	
		#page_content form {
			margin-bottom: 10px;
		}				
			#page_content table.shadow td {																						/* buy section styling */																						
				padding: 0.25em 1.5em 0.25em 1.5em;
			}			
			#page_content td {																												/* table styling */
				background-color: #dffff8;
				padding: 0.5em ;
			}			
			#page_content .button {
				margin-top: 10px;
				padding: 0.5em 0 0.5em 0;
			}
				#page_content .button input {
					border: 1px solid #e9f1f8;
					margin-right: 5px;
				}
				#page_content .button a, #page_content form p input {												/*  add to cart & checkout */		
					background: #bef1e7;
					padding: 0.25em 1em 0.25em 1em;
				}	
		#page_content form#track input {																							/* tracking */
			background-color: #dffff8;
			border: 1px solid #d1e9ed;
			padding: 0.1em;
		}			

		

/*	10 	footer
------------------------------------------------------------------*/	
#footer { 
	background: transparent url(edge_aqualaris/page_footer_bg.png) 50% -60px no-repeat;
	color: #ccc;
	clear: both;
	margin: 0 auto 0;																														/* bottom margin relates to page_header so the repeated bg isn't visible at the top */
	padding: 200px 10px 30px 10px;
	width: 1060px;
}
	p.byLine {
		border-top: 1px solid #237380;
		font-size: 10px;
		padding: 20px 20px 5px 20px;
		text-align: center;
		margin: 0 auto;
		width: 1060px;
	}
			#footer a {
				color: #9d00d9;
			}
			p.byLine a {
				color: #97ff00;
			}