/* CSS COLOUR VARIATIONS */

/*TOP BAR - This sets the colour of the bar that runs across the very top*/
.topBar {background: #FFFFFF; border-top-color: #FFFFFF; border-top-width: 1px; border-top-style: solid;}

/*This sets the background image for COLUMN ONE*/
.leftMenu {background-image: url("../Images/left_green.gif"); background-color: Transparent; background-position: 0% 0; background-repeat: repeat-y;}
/*This sets the background image for right hand side navigation, the percentage for rightMenu needs to be the same as columnOne and columnTwo added together*/
.rightMenu {background-image: url("../Images/right_grey.gif"); background-color: #CCCCCC; background-position: 74% 0; background-repeat: repeat-y;}
.homeMenu {background-image: url("../Images/right_grey.gif"); background-color: #FFFFFF; background-position: 74% 0; background-repeat: repeat-y;}

/*TEMPORARY COLOUR SETTINGS FOR COLUMN ONE UNTIL NAVMENU WORKS*/
/*This sets the text colour and background colour for COLUMNN ONE*/
.columnOne {COLOR: #606B5F; background: #606B5F; border-right: 0px solid #CCCCCC;}
/*Column ONE NAV BAR - This sets the colour of column one navigation bar*/
.columnOne {background: #606B5F;}
/*This sets the colour of the boxes*/
.columnOne a {background: #606B5F; border: 1px solid #FFFFFF;}
/*This sets the colour of the text within the boxes*/
.columnOne a:link, .columnOne a:visited, .columnOne a:active {color: #FFFFFF;}
/*This sets the colour of the boxes and text within, when the mouse is rolled over*/
.columnOne a:hover {color: #334D55;	background: #FFFFFF;}

/*This sets the text colour and background colour for COLUMNN TWO and also adds the top shadow*/
.columnTwo {COLOR: #333333; background: #FFFFFF; border-right: 0px solid #CCCCCC;}
.home-column {border: 0 solid #FFFFFF;}
/*This sets the colour for all links in the main page content area*/
.columnTwo a, .columnTwo a:link, .columnTwo a:visited, .columnTwo a:active {color: #CC0000;}	
/*This sets the colour for all links in the main page content area when the mouse is rolled over*/
.columnTwo a:hover {color: #000000;}
/*This sets the image used for bullets in the main page content area*/
.columnTwo ul li {list-style-image:   url("../Images/bullet_dk_red.gif");}

/*This sets the background colour for the COLUMN THREE*/
.columnThree {background: #CCCCCC;}
/*This sets the image used for bullets in the sub navigation*/
.columnThree li {background-image: url("../Images/dohnut.gif"); background-repeat:no-repeat; background-position:top left;
     /*hide from IE mac*/_background-image: url("../Images/dohnut1.gif"); background-repeat: no-repeat; background-position: 0 0; /*stop hide*/
      border-bottom: 1px dotted #CCCCCC;}
/*This sets the text colour for the options in the sub navigation*/
.columnThree a, .columnThree a:link, .columnThree a:visited, .columnThree a:active {color: #CC0000; text-decoration: underline; }
/*This sets the text colour for the options in the sub navigation when the mouse is rolled over*/
.columnThree a:hover, #current {color: #000000;}

/*This is for mozilla only, so the background graphics for the menus shows up*/
.important {background: #FFFFFF;}
/*HEADINGS - This sets the text colour for the main heading*/
h1 {color: #FF0000;}
/*This sets the style for the page heading in the main content area*/
h2 {color: #606B5F; border-bottom: 5px solid #CC0000;}
/*This sets the style for sub-headings in the main content area*/
h3 {color: #CC0000; border-top: 1px solid #CCCCCC;}

/*IMAGES - This sets the colour for the border arounds images*/
.photo {background: #FFFFFF;}

/*HIGHLIGHT - This sets the highlight box colour*/
.highlight {background: #FFCCCC;}

/*TABLES - This sets the cell border colour for tables*/
td {border: 1px solid #FF0000;}
/*This sets the table heading colour*/
th {background: #FFFFFF;}
/*sets the background colour for all odd rows in a table*/
.odd {background: #FFCCCC;}
/*sets the background colour for all even rows in a table*/
.even {background: #FFFFFF;}

/*BLOCKQUOTES - sets the style for blockquotes when used with a div*/
blockquote {background:  url("../Images/quoteleft.gif") left top no-repeat;}
/*a div needs to be added to the blockquote to add the quote graphic on the right hand side*/
blockquote div {background:  url("../Images/quoteright.gif") no-repeat right bottom;}

/*BREADCRUMBS - Controls the colours of the  breadcrumbs*/
.breadcrumbs {color: #CC0000;}
.breadcrumbs a {color: #CC0000 !important;}
.breadcrumbs a:hover {color: #000000 !important;}

/*STAFF PROFILE - Controls the colours for the staff profile*/
.photo-caption {background: #CCCCCC;}
.profile-quote {background: #FFCCCC;}

/*BOTTOM NAV BAR - This sets the colour of the bottom navigation bar*/
.bottomNav {background: #606B5F;}
/*This sets the colour of the five boxes*/
.bottomNav a {background: #606B5F; border: 1px solid #FFFFFF;}
/*This sets the colour of the text within the five boxes*/
.bottomNav a:link, .bottomNav a:visited, .bottomNav a:active {color: #FFFFFF;}
/*This sets the colour of the five boxes and text within, when the mouse is rolled over*/
.bottomNav a:hover {color: #334D55;	background: #FFFFFF;}

/*MAINTAINER - This sets the colour for the bar underneath the bottom navigation*/
.maintainer {background: #CCCCCC; color: #333333;}
/*This sets the colour of the text for the updated date*/
.maintainerLeft {color: #333333;}
/*This sets the colour of the text for the maintainer text*/
.maintainerRight a:link, .maintainerRight a:visited, .maintainerRight a:active {color: #333333;}
/*This sets the colour of the text for the maintainer text, when the mouse is rolled over*/
.maintainerRight a:hover {color: #CF0026;}
/*This sets the colour of the approved text at the very bottom of the screen*/
.approved {color:#333333;}