
/* courtesy of positioniseverything.net */
.clearfix:after {
	content: ".";
	display: block;
	height: 0; 
	clear: both; 
	visibility: hidden;
}

.clearfix {display:inline-block;}
.clearfix {display:block;}

/******** TAGS ********/

html {
	height:100%;
}
body {
	background:#F2F2F1;
	color:#333333;
	font-family: Tahoma, Helvetica, Arial;
	font-size:75%;
	height:100%;
}

html > body {
	font-size:12px;
}

/* TODO: visited style */
a:link { color:#CC0000; text-decoration:none; }
a:focus { color:#CC0000; text-decoration:underline; }
a:active { color:#CC0000; text-decoration:underline; }
a:visited { color:#CC0000; text-decoration:none; }
a:hover { color:#CC0000; text-decoration:underline; }

h1 {
	display:block;
	font-size:2em;
	margin-bottom:0.5em;
}

h2 {
	display:block;
	font-size:1.5em;
	margin-top:1em;
	margin-bottom:0.25em;
}

h3 {
	display:block;
	font-size:1.25em;
	font-weight:bold;
	margin-bottom:0.5em;
}

p {
	margin-bottom:0.75em;
	line-height:1.5em;
}

ul {
	list-style-type:disc;
	margin:0px 0px 0.75em 20px;
}

li {
	padding:0.2em 0em;
	line-height:1.5em;
}

table {
	width:100%;
	margin-bottom:0.75em;
}

td {
	padding:0.2em;
}


/******** STRUCTURE ********/

#wrapper {
	/*background:#FFFFFF;*/
	background: transparent url(../images/bg.gif) 0px 0px repeat-y;
	/*border-left:1px solid #666666;*/
	/*border-right:1px solid #666666;*/
	min-height:800px;
	height: 800px;
	margin:0 auto;
	padding:0 15px 0 215px;
	position:relative;
	width:530px;
}


html[xmlns] #wrapper {
	height: auto;	
}

#content {
	padding:15px 0 100px 0;
}

#sidebar {
	/*background:#F2F6F6 url('../images/sidebar_background.gif') top right repeat-y;*/
	height:100%;
	position:absolute;
		left:1px;
		top:0px;
	width:199px;
}

#header_logo {
	margin-bottom:15px;
}

#footer {
	background:url('../images/red_lines.gif') top left repeat-x;
	padding:13px 0 0 0;
	
	position:absolute;
		bottom:15px;
		width:530px;
}

/******** MAIN MENU ********/

ul#mainmenu {
	border-bottom:1px solid #D3D6D6;
	margin:100px 0px 0px 0px;
	width:100%;
	list-style-type:none;
}
	ul#mainmenu li {
		background-color:#E0EDED;
		border-top:1px solid #D3D6D6;
		line-height:2em;
		margin-right:1px;
		padding:0em;
	}
		ul#mainmenu li.current {
			background-color:#FFFFFF;
			margin-right:0px;
		}
		/* ul#mainmenu li a:hover, ul#mainmenu li a:focus,  */
		ul#mainmenu li.hover {
			background-color:#E8F2F2;
		}
	
	ul#mainmenu li a, ul#mainmenu li span {
		display:block;
		padding:0px 0px 0px 20px;
	}


ul#mainmenu ul.submenu {
	padding-bottom:0.5em;
	margin:0px 0px 0px 0px;
	list-style-type:none;
}
	ul#mainmenu ul.submenu li {
		background-color:transparent;
		border-top:0px;
		line-height:1.5em;
	}
	ul#mainmenu ul.submenu li a, ul#mainmenu ul.submenu li span {
		margin:0 0 0 20px;
	}


/******** TESTIMONIAL ********/

.testimonial {
	background: url('../images/quote_open.gif') top left no-repeat;
	margin:0px 10px 0px 10px;
}
	.testimonial .testimonialText {
		background: url('../images/quote_close.gif') bottom right no-repeat;
		font-size:1.5em;
		line-height:1.25em;
		margin-bottom:0;
		padding:10px 10px 10px 10px;
	}

	.testimonial .testimonialCite {
		float:right;
		font-style:italic;
	}

/******** FOOTER ********/

#footer p {
	margin:2px 0 2px 0;
}

#footerContactDetails {
	text-align:right;
}
	#footerContactDetails strong {
		float:left;
		text-align:left;
	}

#copyright {
	font-size:0.9em;
}

#copyright a  {
	float: right;
	font-size:1.0em;
}

/******** CONTENT ********/



/******** PAGES: HOME ********/

#content .thumbnails {
	margin-left:;
	position:relative;
	width:546px;
	list-style-type:none;
	margin:0px 0px 0px -5px;
	
}
	.thumbnails li {
		float:left;
		position:relative;
		padding:0em;
	}
	.thumbnails img, .thumbnails a:visited img {
		border:1px solid #CC0000;
		clear:both;
		margin:0 0 4px 0;
		/*width:164px;*/
	}
	
	.thumbnails a {
		background:#FFFFFF 4px 4px no-repeat;
		border:1px solid #FFFFFF;
		display:block;
		margin:5px 6px 0px 0px;
		padding:4px;
	}
	
		.thumbnails img.imageStateOne, .thumbnails a:hover img.imageStateTwo {
			display:block;
		}
		.thumbnails img.imageStateTwo, .thumbnails a:hover img.imageStateOne {
			display:none;
		}
		
		.thumbnails img.imageStateOne:hover {
			display:none;
		}
		
		.thumbnails a:hover {
			background-color:#F2F6F6;
			border:1px solid #CCCCCC;
			text-decoration:none;
		}

/******** PAGES: PRODUCTS ********/

.catlist {

}
	.catlist li {
		float:none;
	}
	
	.catlist p {
		color:#333333;
	}

	.catlist img, .catlist a:visited img {
		clear:none;
		float:right;
	}
	
	
.productlist li {
	margin:5px 6px 0px 0px;
	padding:4px;
}	



.productlist li ul {
	list-style-type:disc;
	margin:0px 0px 0px 20px;
}

.productlist li ul li {
	padding:0.2em 0em;	
}

/******** CONTACT FORM ********/

ul.vcard {
	list-style-type:none;
	margin:1em;
	position:relative;
}
	ul.vcard li {
		padding-left:8em;
		margin-bottom:0.5em;
		line-height:1.5em;
	}
	ul.vcard .org {
		display:none;
	}
	ul.vcard strong {
		width: 5em;
		float:left;
		margin-left:-8em;
	}




form {

	}

	ul.fieldList {
		background-color:#F2F6F6;
		border:1px solid #D3D6D6;
		list-style:none;
		padding:4px 0px 4px 0px;
		margin-left:0px;
		}
		ul.fieldList li.formField {
			padding:4px 15px 4px 15px;
			}
			.formField label {
				padding-top:2px;
				width:100px;
				float:left;
				display:block;
				line-height:1.2em;
				}
			.formField .text {
				width:200px;
				}
			.formField p {
				margin:0;
				}
			textarea, input {
				font-family:Tahoma, Arial;
				padding:1px;
				font-size:12px;
				}
			.formField input.action {
				padding:0px 4px 0px 4px;
				}
			
			.fieldList li.error {	/* if I write this as .formField.error, the bg colour doesn't show up in ie */
				background-color:#F9D8D8;
				color:#FF0000;
				}
				.fieldList li.error label.error {
					margin-left:100px;
					font-size:90%;
					padding-top:0px;
					width:auto;
					float:none;
					display:block;
					}	
				


	.formField textarea.wide, .formField input.wide {
		width:392px;
		}
