@import url("basic.css");
@import url("Navigation.css");
@import url("contentItems.css");
@import url("Links.css");
@import url("Forms.css");
@import url("Structure.css");

/* Changeable */

/* Background of site and font */
body {
	font-family: Arial, Helvetica, sans-serif;
	background-color: #EDEDED;
	margin-top: 0;
	margin-bottom: 10px;
}

/* Width control */
#wrapper {
	width: 58em;
	background-color: #FFFFFF;
/*	background-image:  url(../images/middleBack.jpg); */
	background-repeat: no-repeat;
	background-position: center bottom;
}

/* Headings */
H1, H2, H3, H4, H5, H6 {
	font-family: Arial, Helvetica, sans-serif;
	color: #99CC00;
}

H1 {
	font-size: 150%;
}

H2 {
	font-size: 140%;
}

H3 {
	font-size: 120%;
}

H4 {
	font-size: 110%;
}

H5 {
	font-size: 100%;
}

H6 {
	font-size: 90%;
}

/* Horizontal Rules */

hr {
	bottom-border: #99CC00; /* Change Colour */
}
	
	
/* Paragraphs */	
p {
	font-family: Arial, Helvetica, sans-serif;
}
#mainContent ul li {
	background-image: url(../images/greenBullet.png);
	font-size: 80%;
	color: #1A1A1A;
}

/* Top Banner */
#branding {
	background-color: #FFFFFF;
	/* Optional can be removed */
	background-image: url(../images/banner.jpg);
	background-repeat: no-repeat; /* Needed if you have an image can be set to no-repeat, repeat-x or repeat-y */
	background-position: right center; /* Needed if you have an image can be set to left, right, center and top, center, bottom */
	width: 100%;
}

/* Top Navigation */
#topNav {
	background-color: #808080;
	border-top-width: 2px;
	border-bottom-width: 2px;
	border-top-style: solid;
	border-bottom-style: solid;
	border-top-color: #99CC00;
	border-bottom-color: #99CC00;
}

/* Middle Section Wrapper Options if using faux column effect on the right, plus background colour*/	
#middleWrapper {	
	background-color: transparent;
/* Optional can be removed */
	background-image:  url(../images/navFauxCol.jpg);
	background-repeat: repeat-y;
	background-position: 19% 0;
}
/*How the make a Faux column that reaches the bottom of the page
The column colour/background is actually an image, this needs to be 
created on a transparent background as follows.

Create a transparent graphic 2000px wide. If it is just a repeating 
image make it small in depth e.g. 5px.

Create your image within the 2000px (100%) depending on the width of your column 
e.g. Column 600px (30%). Save and place in style for the column wrapper 
(div that is containing the column) as per the stylesheet in this example.

The percentage of the column should match the percentage positioning of the
background style. If the column is on the right it is reversed e.g. the column 
is 30% wide so the positioning is 70% */


/* Size of middle and right sections combined N.B. if you add to this number you MUST take from #mainNav */	

#rightWrapperNews {
	background-image:  none; 
	width: 79%;
}

#rightWrapper {
	width: 79%;
	background-image:  url(../images/rightBackground.jpg); 
	background-repeat: repeat-y;
	background-position: right top;
}


#rightWrapperHome {
	width: 100%;
}

/* Size of left navigation column N.B. if you add to this number you MUST take from #rightWrapper */	
#mainNav {
	width: 21%;
}

/* Size of middle section N.B. if you add to this number you MUST take from #secondaryContent */	
#mainContent, #mainContentHome {
	width: 100%;
	padding-bottom: 0px;
	margin-bottom: 0px;
}

/* Footer*/	
#footer {
	background-color: #FFFFFF;
	border-top-width: 2px;
	border-bottom-width: 2px;
	border-top-style: solid;
	border-bottom-style: solid;
	border-top-color: #99CC00;
	border-bottom-color: #99CC00;
}
#footerLeft {
	padding-bottom: none;
	margin-bottom: none;
}

/* Navigation*/
	
/* Top Bar Navigation*/	
ul.horiz a, ul.horiz a:visited {
	color: #FFFFFF;
}

ul.horiz a:hover, ul.horiz a:active {
	color: #99CC00;
}

ul.horiz a.thispage, ul.horiz a.thispage:visited {
	color: #99CC00;
}

ul.horiz a.thispage:hover, ul.horiz a.thispage:active {
	color: #FFFFFF;
}

ul.horiz a.thispage, ul.horiz a.thispage:visited {
	font-size: 80%;
	background-image: url(../images/greenBullet.png);
}

ul.horiz a, ul.horiz a:visited {
	font-size: 80%;
	background-image: url(../images/whiteBullet.png);
}

/* Bottom Bar Navigation*/	

ul.horizBottom a, ul.horizBottom a:visited {
	color: #111111;
}

ul.horizBottom a:hover, ul.horizBottom a:active {
	color: #555555;
}

ul.horizBottom a.thispage, ul.horizBottom a.thispage:visited {
	color: #000000;
}

ul.horizBottom a.thispage:hover, ul.horizBottom a.thispage:active {
	color: #555555;
}

ul.horizBottom a, ul.horizBottom a:visited, ul.horizBottom a.thispage, ul.horizBottom a.thispage:visited {
	font-size: 70%;
}

/* Side Navigation*/	

#mainNav ul.bar a, #mainNav ul.bar a:visited {
	color: #1A1A1A;
	border-bottom-color: #99CC00;
}

#mainNav ul.bar a:hover, #mainNav ul.bar a:active {
	color: #99CC00;
}

#mainNav ul.bar a.thispage:link, #mainNav ul.bar a.thispage:visited {
	color: #99CC00;
	border-bottom-color: #AAAAAA;
}

#mainNav ul.bar a.thispage:hover, #mainNav ul.bar a.thispage:active {
	color: #000000;
}

#mainNav ul.bar a, #mainNav ul.bar a:visited {
	font-size: 80%;
	background-color: transparent;
	background-image: url(../images/greenBulletSide.png);
}

#mainNav ul.bar a.thispage:link, #mainNav ul.bar a.thispage:visited {
	font-size: 80%;
	background-color: transparent;
	background-image: url(../images/greyBulletSide.png);
}

/* Side Navigation Subpages*/	

#mainNav ul li.subBar a, #mainNav ul li.subBar a:visited {
	color: #1A1A1A;
	border-bottom-color: #99CC00;
}

#mainNav ul li.subBar a:hover, #mainNav ul li.subBar a:active {
	color: #99CC00;
}

#mainNav ul li.subBar a.thispage:link, #mainNav ul li.subBar a.thispage:visited {
	color: #99CC00;
	border-bottom-color: #99CC00;
}

#mainNav ul li.subBar a.thispage:hover, #mainNav ul li.subBar a.thispage:active {
	color: #000000;
}

#mainNav ul li.subBar a, #mainNav ul li.subBar a:visited {
	font-size: 70%;
	background-color: transparent;
	background-image: url(../images/greenBulletSideSm.png);
}

#mainNav ul li.subBar a.thispage:link, #mainNav ul li.subBar a.thispage:visited {
	font-size: 70%;
	background-color: transparent;
	background-image: url(../images/greyBulletSideSm.png);
}

/* Links */	

h1 a:link, h2 a:link, h3 a:link, h4 a:link, h5 a:link, h6 a:link, h1 a:visited, h2 a:visited, h3 a:visited, h4 a:visited, h5 a:visited, h6 a:visited, a.DocumentLink:link, a.DocumentLink:visited, a:link, a:visited  {
	color: #000000; /* Change colour of links */
}

h1 a:hover, h2 a:hover, h3 a:hover, h4 a:hover, h5 a:hover, h6 a:hover, h1 a:active, h2 a:active, h3 a:active, h4 a:active, h5 a:active, h6 a:active, a.DocumentLink:hover, a.DocumentLink:active, a:hover, a:active { 
	color: #99CC00; /* Change colour links on rollover */
}

/* Forms */	

input.btn {
	color: #FFFFFF; /* Colour of text on submit button */	
	border: 1px solid #99CC00;
	background-color: #99CC00;
}

input.btnhov {
	color: #FFFFFF; /* Colour of text on submit button on rollover */
	border: 1px solid #666666;
	background-color: #666666;
}

legend {
	color: #000000; /* Colour of title of form */
}