/*#############################################################
Name: jaycreate.co.uk
Date: 06-10-2008
Author: Jason Newton
URL: http://www.watfordwindscreens.co.uk
#############################################################*/

/* standard elements */
* {
	margin: 0;
	padding: 0;
}
html {
	margin: 0px;
	padding: 0px;
}

body {
	margin: 0;
	padding: 0;
	text-align: left;
}

h1,h2,h3,h4,h5,h6 {
	font-size:100%;
	font-weight:normal;
}

h1 {
	margin: 0px;
	padding: 5px;
	color: #263c7e;
	font-family: "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
	font-size: 14px;
}

h2 {
	margin-top: 0px;
	padding: 5px 0px;
	color: #263c7e;
	font-family: "Lucida Grande", Lucida, Verdana, sans-serif;
	font-size: 20px;
}

li {
	list-style:none;
}

img {
	border:0;
}

.containerTop {
	width: 820px;
	margin: 0px auto;
	padding-top: 8px;
}

.containerMiddle {
	width: 820px;
	margin: 0px auto;
}

.containerFoot {
	width: 820px;
	margin: 0px auto;
}

.headerWrapper {
	margin: 0px;
	padding: 0px;
	width: 100%;
	height: 268px;
	background-image: url(/images/ww-bodybackgroundTop.jpg);
	background-repeat: repeat-x;
	background-position: 0px 0px;
}

.contentWrapper {
	margin: 0px;
	padding: 0px;
	height: auto;
	min-height: 375px;
	background-image: url(/images/ww-bodybackgroundBottom.jpg);
	background-repeat: repeat-x;
	background-position: bottom;
}

.footerWrapper {
	margin: 0px;
	padding: 0px;
	width: 100%;
	height: 144px;
}

.columnContainer {
	margin: 0px auto;
	padding: 0px 0px 25px 0px;
	width: 820px;
	clear: both;
	/*height: 300px;
	overflow: hidden;*/
}

.columnContainer p {
	font: 12px/16px "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
	margin-bottom: 1.2em;
	
}

.columnContainer li {
	font: 12px "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
	list-style-image: url(/images/bluebullet.gif);
	margin-left: 13px;
	line-height: 18px;
}

.contentContainer {
	margin: 0px;
	padding: 0px 0px 0px 12px;
	color: #777777;
}

.topBorder {
	width: 100%;
	height: 28px;
	background-image:url(/images/ww-tc.jpg);
	background-repeat:repeat-x;
}

.topLeft {
	background-image:url(/images/ww-tl.jpg);
	background-repeat:no-repeat;
	float: left;
	width: 28px;
	height: 28px;
}

.topCentre {
	float: left;
	width: auto;
	height: 28px;
}

.topRight {
	background-image:url(/images/ww-tr.jpg);
	background-repeat:no-repeat;
	background-position: top right;
	float: right;
	width: 28px;
	height: 28px;
}

.bottomBorder {
	margin: 0px;
	padding: 0px;
	width: 100%;
	height: 42px;
	background-image:url(/images/ww-bc.jpg);
	background-repeat:repeat-x;
	background-position: bottom;
}

.bottomLeft {
	margin: 0px;
	padding: 0px;
	background-image:url(/images/ww-bl.jpg);
	background-repeat:no-repeat;
	background-position: bottom left;
	float: left;
	width: 28px;
	height: 42px;
}

.bottomCentre {
	margin: 0px;
	padding: 0px;
	float: left;
	width: auto;
	height: 42px;
}

.bottomRight {
	margin: 0px;
	padding: 0px;
	background-image:url(/images/ww-br.jpg);
	background-repeat:no-repeat;
	background-position: bottom right;
	float: right;
	width: 28px;
	height: 42px;
}

.header {
	clear: both;
	margin: 0px;
	padding: 0px;
	height: 240px;
	width: 820px;
	text-align: left;
}

.headerLeft {
	width: 28px;
	height: 248px;
	float: left;
	background-image:url(/images/ww-lb.jpg);
	background-repeat:repeat-y;
}

.headerNav {
	/*padding-left: 10px;*/
	width: 175px;
	float: left;
}

.headerRight {
	width: 617px;
	height: 248px;
	float: left;
	background-image:url(/images/ww-rb.jpg);
	background-repeat:repeat-y;
	background-position: top right;
}

.logo {
	/*padding-left: 10px;*/
	padding-bottom: 30px;
}

.headerImage {
	background-image: url(/images/ww-headerImage.jpg);
	background-repeat: no-repeat;
	width: 574px;
	height: 233px;
}

.navBar {
	padding: 15px 0px 15px 0px;
	font-family: "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
	font-weight:normal;
	font-size: 12px;
}

.column1 {
	margin: 0px;
	padding: 0px;
	float: left;
	width: 200px;
	height: 380px;	
	background-image:url(/images/ww-lb.jpg);
	background-repeat:repeat-y;
}

.column2 {
	margin: 0px;
	padding: 0px;
	float: left;
	width: 583px;
}

.column3 {
	margin: 0px;
	padding: 0px;
	float: right;
	width: 37px;
	height: 380px;
	background-image: url(/images/ww-rb.jpg);
	background-repeat: repeat-y;
	background-position: right;
}

.footer {
	clear: both;
	width: 820px;
	margin-top: 30px;
	margin-left: 28px;
}

.footerLeft {
	width: 250px;
	margin-right: 50px;
	float: left;
}

.footerCentre {
	width: 250px;
	float: left;
}

.footerRight {
	width: 200px;
	float: left;
}

.footer p {
	font: bold 14px "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
	text-align: left;
	color: #263c7e;
}

ul {
	list-style: none;
	margin: 0px;
	padding: 0px;
}


/* Navigation */
	
.navBar li {
	width: 159px;
	height: 37px;
}

.navBar li a {
	color: #263c7e;	
	display: block;
	text-decoration: none;
	text-indent: 15px;
	line-height: 37px;
}

.navBar li a:hover {
	color: #ffffff;	
	display: block;
	text-decoration: none;
	text-indent: 15px;
	line-height: 37px;
}

/*This line creates the navigation feature that will highlight the currently viewed page. For this to work you
// must give each individual page a unique id on the html's <body> tag. eg, <body id="page1">
*/ 


#page1 #navItem1 a {
	background-image: url(/images/ww-navbuttonhighlight.jpg);
	background-repeat: no-repeat;
	color: #ffffff;	
}

#page1 #navItem2 a, #page1 #navItem3 a {
	background-image: url(/images/ww-navbutton.jpg);
	background-repeat: no-repeat;
	color: #263c7e;	
}

#page1 #navItem2 a:hover, #page1 #navItem3 a:hover {
	background-image: url(/images/ww-navbuttonhighlight.jpg);
	background-repeat: no-repeat;
	color: #ffffff;	
}

#page2 #navItem2 a {
	background-image: url(/images/ww-navbuttonhighlight.jpg);
	background-repeat: no-repeat;
	color: #ffffff;
}

#page2 #navItem1 a, #page2 #navItem3 a {
	background-image: url(/images/ww-navbutton.jpg);
	background-repeat: no-repeat;
	color: #263c7e;	
}

#page2 #navItem1 a:hover, #page2 #navItem3 a:hover {
	background-image: url(/images/ww-navbuttonhighlight.jpg);
	background-repeat: no-repeat;
	color: #ffffff;	
}

#page3 #navItem3 a {
	background-image: url(/images/ww-navbuttonhighlight.jpg);
	background-repeat: no-repeat;
	color: #ffffff;
}

#page3 #navItem1 a, #page3 #navItem2 a {
	background-image: url(/images/ww-navbutton.jpg);
	background-repeat: no-repeat;
	color: #263c7e;	
}

#page3 #navItem1 a:hover, #page3 #navItem2 a:hover {
	background-image: url(/images/ww-navbuttonhighlight.jpg);
	background-repeat: no-repeat;
	color: #ffffff;	
}

/* Other Styles */

#mapContainer {
	margin: 0px 0px 10px 0px;
	padding: 0px;
	width:560px; 
	height: 325px;
}

.mapContainer p {
	text-align: right;
}

.mapContainer a {
	color: #0d2841;
	font-size: .75em;
	text-decoration: none;
}

.mapContainer a:hover {
	color: #0e2a42;
	text-decoration: underline;
}

.callout {
	font: bold 12px "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
	color: #777777;
}

.numbers {
	font: bold 18px "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
	color: #263c7e;
	margin-top: 5px;
}

.highlight {
	font: bold 12px/16px "Helvetica Neue", Arial, Helvetica, Geneva, sans-serif;
	color: #263c7e;
}

/* Changing Header Images 

#page1 .header {
	background-image: url(images/header-1.jpg);
	background-repeat: no-repeat;
}

#page2 .header {
	background-image: url(images/header-2.jpg);
	background-repeat: no-repeat;
}

#page3 .header {
	background-image: url(images/header-3.jpg);
	background-repeat: no-repeat;
}*/