/* CSS Document */

/*Style sheet for the 100% width 3 column template - 

/*This style effects virtually everything within page, as all the page content sits within the body tag*/
BODY {PADDING: 0; MARGIN: 0; font-family: Verdana, Arial, Helvetica, sans-serif;}

/*This box contains the main navigation and main page content*/
.container {padding: 0; margin: 0;}

/*The widths of columnOne, columnTwo and columnThree should add up to 99% (or 99.7% for IE PC, column one is the main navigation)*/
.columnOne {FLOAT: left; WIDTH: 20%; PADDING: 0; margin: 0; font-weight: bold;}

/*padding and margin for the main navigation bars to zero*/
.columnOne ul {padding: 0; margin: 0;}

/*font size, and text alignment for the main navigation bars*/
.columnOne li {font-size: 72%; list-style: none; text-align: center;}

/*height for the main navigation bars, this is altered by adjusting the top and bottom padding, which is currently set to 5px*/
.columnOne a {display: block; text-decoration: none; padding: 5px 0 5px 0; width: 100%;}

/*The widths of columnOne, columnTwo and columnThree should add up to 99% (or 99.7% for IE PC, column two is the main page contents)*/
.columnTwo {float: left; WIDTH: 60%; PADDING: 0; margin: 0; _height: 300px; min-height: 300px; overflow: visible;}
.home-column {width: 79.2%;}

/*style for all links in the main page content*/
.columnTwo a, .columnTwo a:link, .columnTwo a:visited, .columnTwo a:active {text-decoration: underline; }	

/*indent for a bulleted list and also its font size*/
.columnTwo ul {margin: 0 10px 15px 45px; padding: 0; font-size: 72%;}
.columnTwo ul ul {margin: 2px 0 2px 18px; padding: 0; font-size: 100%;}
.columnTwo ul ol {margin: 2px 0 2px 24px; padding: 0; font-size: 100%;}

/*indent for a numbered list and also its font size*/
.columnTwo ol {margin: 0 10px 15px 53px; padding: 0; font-size: 72%;}
.columnTwo ol ol {margin: 2px 0 2px 24px; padding: 0; font-size: 100%;}
.columnTwo ol ul {margin: 2px 0 2px 18px; padding: 0; font-size: 100%;}

/*indent for a definition list and also its font size*/
.columnTwo dl {margin: 0 10px 15px 29px; padding: 0; font-size: 72%;}

/*provides a margin around the text in a numbered list*/
.columnTwo ol li {margin: 0; padding: 0; list-style-type: decimal; line-height:140%;}

/*provides a margin around the text in a bulleted list*/
.columnTwo ul li {margin: 0; padding: 0; line-height:140%;}
.columnTwo ul ol li {margin: 0; padding: 0; list-style-type: decimal; list-style-image: none; line-height:140%;}

/*indent for the first option in your definition list*/
.columnTwo dl dt {margin: 5px 0 0 0; padding: 0; font-weight: bold;}

/*indent for the second option in your definition list*/
.columnTwo dl dd {margin: 0 0 0 20px; padding: 0;}

/*The widths of columnOne, columnTwo and columnThree should add up to 99% (or 99.7% for IE PC, column three is the sub navigation)*/
.columnThree {float: left; WIDTH: 19%; _WIDTH: 19.7%; PADDING: 0; margin: 0; BORDER-STYLE: none;}
		
/*indent for the menu options to zero*/
.columnThree ul {padding: 0; margin: 0;}

/*styling for the options in the sub navigation*/
.columnThree li {font-size: 72%; list-style: none; margin: 0; padding: 4px 0 4px 15px;}

/*style for the options in the sub navigation*/
.columnThree a, .columnThree a:link, .columnThree a:visited, .columnThree a:active {text-decoration: underline;}

/*This is for mozilla only, so the background graphics for the menus shows up*/
.important {width: 100%; height: 1px; overflow: hidden; clear: both;}

/*text size for the h1 text, main heading top right hand corner*/
h1 {font-size: 200%; text-align: center; font-weight: bold; padding: 0.8em 0.2em 0 0; margin: 0; line-height: 1.1em;}

/*style for the page heading*/
h2 {font-size: 100%; font-weight: bold ; padding: 15px 10px 3px 0; margin: 20px 10px 20px 10px;}

/*style for sub-headings*/
h3 {font-size: 80%; font-weight: bold; padding: 10px 0 0 0; margin: 15px 10px 10px 10px;}

/*styles for H4, H5, H6, H7, H8, H9, H10*/
h4, h5, h6, h7, h8, h9, h10 {font-size: 72%; font-weight: bold; margin: 15px 10px 10px 10px;}

/*style for paragraph text*/
P {PADDING: 0; MARGIN: 7px 10px 13px 10px; font-size: 72%; line-height:140%;}

/*set a border of zero for all images*/
img {border: 0;}

/*sets the font style to bold*/
.bold {font-weight: bold;}

/*sets a div to clear any divs above it*/
.clear {CLEAR: both;}

/*floats the div to the right*/
.right {float: right;}

/*floats the div to the left*/
.left {float: left;}

/*sets the form margins to zero*/
.form {margin: 0; padding: 0;}

/*sets the height of a break*/
.br {height: 20px;}

/*style used for placing photos when used with a div*/
.photo {margin: 0 10px 10px 10px; /* hide from IE mac \*/ _margin: 0 5px 10px 5px; /*End hide*/ padding: 10px; width: auto; height: auto;}

/*style used to highlight text when used with a paragraph*/
.highlight {padding: 5px;}



/*Styles used to control the breadcrumbs, to be used as an alternative navigation and to show what section you're in*/
.breadcrumbs {font-size: 68%; margin: -15px 10px 20px 10px;}

/*This is the style used for the gallery*/
.gallery {margin: 0 0 10px 10px;}
.gallery ul {margin: 0; padding: 0;}
.gallery ul li {margin: 0; padding: 0 20px 20px 0; display: block; float: left; list-style-type: none;}

/*This style controls the image on the home page*/
.home-image {margin: 0 5px 10px 10px; display: block;}

/*This is for the third level heading on the home page, the right hand margin needs to be around 20px bigger than the image used on the home page*/
.special {margin: 0 380px 0 10px;}


#title {background-color: #999999;
	text-align: center;
	
	font-color: gray;
	font-size: 180%;}

/*This is the grey bar that runs across the very top of the website*/
.topBar {width: 100%; height: 60px;}


/*positioning of the university logo*/
.logo {padding: 5px 0px 5px 5px; float: left;}



/*This is the box for the website title (H1) which sits in the very top right corner*/
.header {height: 56px; width: 400px;}








/*THIS IS FROM THE FOOTER CSS PAGE*/

/*Overflow is used for mozilla and netscape, so the container box increases in height when browser is resized*/
.bottomNav {overflow: auto; margin: 10px 0 0 0 !important;}

/*margin and padding for the bottom navigation bars to zero*/
.bottomNav ul {list-style: none; padding: 0; margin: 0;}

/*some of the elements for the boxes in the bottom navigation*/
.bottomNav li {display: block; float: left; padding: 0; margin: 0; font-size: 65%; font-weight: bold; text-transform: uppercase;}

/*set this width for the number of options in your list, so 5=20% 4=25% 3=33% etc, IE can't divide properly so a -0.1% margin has to be used*/
.bottomNav ul li {width: 20%; margin: 0 -0.1% 0 0;}

/*some of the elements for the boxes in the bottom navigation*/
.bottomNav a {display: block; padding: 3px 0 3px 0; text-align: center; margin: 0 2.2% 0 2.2%;}

.bottomNav a:link, .bottomNav a:visited, .bottomNav a:active {text-decoration: none;}

.bottomNav a:hover {text-decoration: none;}

/*container box for the maintainer and updated date, at the very bottom of the screen*/
.maintainer {font-size: 65%; font-weight: bold; clear: both; height: 20px; padding: 0; margin: 10px 0 0 0;}
/*container box for the updated date*/
.maintainerLeft {float: left; padding: 4px 0 3px 5px;}
/*container box for the maintainer text*/
.maintainerRight {float: right; padding: 4px 5px 3px 0;}

.maintainerRight a:link, .maintainerRight a:visited, .maintainerRight a:active {text-decoration: underline;}
/*sets the font style to normal*/
.normal {font-weight: normal;}
.approved {font-size: 65%; padding: 0 0 10px 5px; clear: both;}










/*THIS SETS ALL THE COLOURS   ---------------------------------   THE BLUE CSS */





/*colour of the bar that runs across the very top of the website*/
.topBar {background: #666666; border-bottom: solid 1px #FFFFFF;}


/*colour of the bar containing the bottom navigation */
.bottomNav {background: #666666;}
/*colour of the five boxes*/
.bottomNav a {background: #666666; border: 1px solid #FFFFFF;}
/*colour of the text within the five boxes*/
.bottomNav a:link, .bottomNav a:visited, .bottomNav a:active {color: #FFFFFF;}
/*colour of the five boxes and text within, when the mouse is rolled over*/
.bottomNav a:hover {color: #333333;	background: #FFFFFF;}


/************************ Styles used by the templates to add the grey box background behind the bottom navigation **************************/

.bottomNav {margin: 0;}
.bottomNav ul {width: 100%;}
.bottomNav a {margin: 6px 2.2% 6px 2.2%;}
.maintainer {margin: 0;}

/********************************************************************************************************************************************/


/*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;}


/*This sets the background image for the main navigation on the left hand side
((((((( changed this )))))))))) original = #46A3FF put this anywhere that has gray*/

.leftMenu {BACKGROUND-color:gray  ;}




/*background image for right hand side navigation, the percentage for rightMenu needs to be the same as columnOne and columnTwo added together*/
.rightMenu {BACKGROUND-color:gray   ;}   

.homeMenu {BACKGROUND-color:gray   ;}   


/*background colour for the main navigation bars*/
.columnOne li {background: gray;}

/*text colour for the main navigation bars*/
.columnOne a:link, .columnOne a:visited, .columnOne a:active {color: #ffffff; border-bottom: 1px solid #ffffff;}

/*background colour and text colour for the rollover state, and also to show what section you are in*/
.columnOne a:hover, .columnOne a#current {color: #333333; background: #ffffff;}

/*text colour and background colour for the main content area and also adds the top shadow*/
.columnTwo {COLOR: #333333; background:  #ffffff repeat-x; border-right: 1px solid #cccccc;}
.home-column {border: 0 solid #fff;}

/*colour for all links in the main page content area*/
.columnTwo a, .columnTwo a:link, .columnTwo a:visited, .columnTwo a:active {color: #330099;}	

/*colour for all links in the main page content area when the mouse is rolled over*/
.columnTwo a:hover {color: #3366cc; text-decoration: none;}



/*background colour for the sub navigation ((((((I HAVE CHANGED THIS))))*/
.columnThree {background: gray;}



/*text colour for the options in the sub navigation*/
.columnThree a, .columnThree a:link, .columnThree a:visited, .columnThree a:active {text-decoration: underline; color: #333333;}

/*text colour for the options in the sub navigation when the mouse is rolled over*/
.columnThree a:hover, #current {color: #ffffff;}

/*This is for mozilla only, so the background graphics for the menus shows up*/
.important {background: #ffffff;}

/*text colour for the h1 text, main heading top right hand corner */
h1 {color: #ffffff;}






/*style for the page heading in the main content area*/
h2 {color: red; border-top: 1px solid black;}

/*style for sub-headings in the main content area*/
h3 {color: #333333; border-top: 1px solid #CCCCCC;}

/*colour for the border arounds images*/
.photo {background: #E6F2FF;}

/*highlight box colour*/
.highlight {background: #E6F2FF;}

/*cell border colour for tables*/
td {border: 1px solid #E6F2FF;}

/*table heading colour*/
th {background: #E6F2FF;}

/*background colour for all odd rows in a table*/
.odd {background: #E6F2FF;}

/*background colour for all even rows in a table*/
.even {background: #ffffff;}



/*Controls the colours of the  breadcrumbs*/
.breadcrumbs {color: #46A3FF;}
.breadcrumbs a {color: #46A3FF !important;}
.breadcrumbs a:hover {color: #0059B3 !important;}
# topadd { position: center;}
