/* CSS Document */

/*Style sheet for the header and footer template*/

/*This sets the colour of the bar containing the bottom navigation */
.bottomNav {background: transparent;}
/*This sets the colour of the five boxes*/
.bottomNav a {background: transparent; border: 1px solid #8A1444;}
/*This sets the colour of the text within the five boxes*/
.bottomNav a:link, .bottomNav a:visited, .bottomNav a:active {color: #8A1444;}
/*This sets the colour of the five boxes and text within, when the mouse is rolled over*/
.bottomNav a:hover {color: #fff;	background: #8A1444; border: 1px solid #8A1444;}


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


/*This style effects virtually everything within page, as all the page content sits within the body tag*/
BODY {color: #333; padding: 0; margin: 0; font-family: Verdana, Arial, Helvetica, sans-serif; background: url("../images/gradient.jpg") #fff repeat-x 0 0 fixed;}
h1 {font-size: 110%; text-align:right; color: #fff; padding: 12px 5px 0 0; margin: 0;}
h2 {font-size: 110%; color:#87C24B; padding: 25px 0 0 0; margin: 0 0 10px 0; font-weight: bold;}
h3 {font-size: 80%; color:#8A1444; padding: 10px 0 0 0; margin: 0; font-weight: bold;}
h4 {font-size: 80%; font-weight: bold; padding: 10px 0 0 0; margin: 15px 10px 10px 0; color: #ff0000; border-top: 1px solid #e7e7e7;}
.h4-useful {padding: 10px 0 0 0; margin: 5px 0 -5px 0; color: #999; border-top: 1px solid #e7e7e7;}
p {font-size: 70%; line-height: 140%; padding: 0 15px 0 0; margin: 0 0 8px 0;}

.top {margin: 0 auto; width: 730px; padding: 0; height: 131px; background: url(../images/header.jpg) transparent no-repeat 0 0;}
.top2 {margin: 0 auto; width: 730px; padding: 0; height: 131px; background: url(../images/header_2.jpg) transparent no-repeat 0 0;}
.top3 {margin: 0 auto; width: 730px; padding: 0; height: 131px; background: url(../images/header_3.jpg) transparent no-repeat 0 0;}
.top4 {margin: 0 auto; width: 730px; padding: 0; height: 131px; background: url(../images/header_4.jpg) transparent no-repeat 0 0;}
.top5 {margin: 0 auto; width: 730px; padding: 0; height: 131px; background: url(../images/header_5.jpg) transparent no-repeat 0 0;}
.top6 {margin: 0 auto; width: 730px; padding: 0; height: 131px; background: url(../images/header_6.jpg) transparent no-repeat 0 0;}
.top7 {margin: 0 auto; width: 730px; padding: 0; height: 131px; background: url(../images/header_7.jpg) transparent no-repeat 0 0;}

.main {margin: 0 auto; width: 730px; background: #fff;}
.box {border: 1px solid #e7e7e7; padding: 10px 10px 5px 10px; text-align: center; margin: 0 15px 10px 0;}
.columnOne {width: 200px; margin: 0 0 0 10px;}
.columnTwo {margin: 0; padding: 20px 30px 10px 30px; width: 410px; _width: auto;}
.wider {margin: 0; padding: 20px 30px 10px 30px; width: 94%;}
.important {height: 1px; overflow: hidden;}

/*This sets the indent for a bulleted list and also its font size*/
.columnTwo ul, .wider ul {margin: 0 10px 5px 20px; padding: 0; font-size: 70%;}
.columnTwo ul ul, .wider ul ul {margin: 2px 0 2px 18px; padding: 0; font-size: 100%;}
.columnTwo ul ol, .wider ul ol {margin: 2px 0 2px 24px; padding: 0; font-size: 100%;}

/*This sets the indent for a numbered list and also its font size*/
.columnTwo ol, .wider ol {margin: 0 10px 15px 45px; padding: 0; font-size: 70%;}
.columnTwo ol ol, .wider ol ol {margin: 2px 0 2px 32px; padding: 0; font-size: 100%;}
.columnTwo ol ul, .wider ol ul {margin: 2px 0 2px 18px; padding: 0; font-size: 100%;}

/*This sets the indent for a definition list and also its font size*/
.columnTwo dl, .wider dl {margin: 0 10px 15px 29px; padding: 0; font-size: 70%;}

/*This provides a margin around the text in a numbered list*/
.columnTwo ol li, .wider ol li {margin: 0; padding: 0; list-style-type: decimal; line-height:140%;}
.columnTwo ol ol li, .wider ol ol li {margin: 0; padding: 0; list-style-type: lower-roman; line-height:140%;}

/*This provides a margin around the text in a bulleted list*/
.columnTwo ul li, .wider ul li {margin: 0; padding: 2px 0 2px 15px; line-height:140%;}
.columnTwo ul ol li, .wider ul ol li {margin: 0; padding: 0; list-style-type: decimal; list-style-image: none; line-height:140%;}
.columnTwo a, .columnTwo a:link, .columnTwo a:visited, .columnTwo a:active, .wider a, .wider a:link, .wider a:visited, .wider a:active {color: #333333;}	
/*This sets the text colour for all links in the main page content area when the mouse is rolled over*/
.columnTwo a:hover, .wider a:hover {color: #87C24B;}
/*This sets the image used for bullets in the main page content area*/
.columnTwo ul li, .wider ul li {background:  url(../images/bullet.gif) transparent no-repeat 7px 9px; list-style: none;}

/*This sets the indent for the first option in your definition list*/
.columnTwo dl dt, .wider dl dt {margin: 5px 0 0 0; padding: 0; font-weight: bold;}

/*This sets the indent for the second option in your definition list*/
.columnTwo dl dd, .wider dl dd {margin: 0 0 0 20px; padding: 0;}

table {font-size: 70%; text-align: left; width: 98%;}
/*This sets the cell border colour for tables*/
td {border-bottom: 1px solid #ccc; background: #fff; padding: 7px 5px 7px 5px;}
/*This sets the table heading colour*/
th {background: #e7e7e7; padding: 5px; font-weight: bold; text-align: center;}
.courses td {line-height: 140%;}

.left {float: left;}
.right {float: right;}
.clear {clear: both;}
.space {height: 20px}
form {margin: 0 0 10px 0; padding: 0;}

.floater {width: 250px;  margin: 0 0 20px 10px; padding-top: 0 0 30px 0; float: right; background: #fff;}
.floater ul {margin: 40px 0 20px 0; padding: 0;}
.floater ul li {margin: 0; font-size: 80%; border-bottom: 1px solid #ccc; width: 240px; line-height: 140%; list-style-type: none; padding: 5px 0 5px 0;}
.floater a {color: #8A1444; background:   url("../images/arrow.gif") transparent no-repeat 0px 6px; padding: 0 0 0 10px; display: block; text-decoration: none;}
.floater a:hover, #current {color: #87C24B !important; background:   url("../images/arrow_on.gif") transparent no-repeat 0px 6px !important; padding: 0 0 0 10px; display: block; text-decoration: none ;}
.bordernone {border: none !important;}

blockquote {background:  url(../images/quoteleft.gif) left top no-repeat; margin: 0; padding: 0;}
blockquote div {padding: 20px 0 20px 10px; background:  url(../images/quoteright.gif) no-repeat right bottom; margin: 30px 0 0 0; line-height: 180%; color:#999999; font-size: 72%;}
.highlight {background: #e7e7e7; padding: 10px 0 10px 0; text-align: center; width: 475px; margin: 20px 0 0 0;}

.asterisk {margin: 20px 0 8px 0;}

.bordernone {border: none;}
.textarea {width: 211px; height: 60px;}
.dropdown {width: 218px;}
.text-right {text-align: right; padding: 5px 10px 5px 0 !important;}
.bodernone {border-bottom: none; padding: 10px 5px 0 0;}
.colour {color: #ff0000;}
.red-background {background: #8A1444; color: #fff; border-top: 1px solid #fff !important;}
.homepage:link, .homepage:visited, .homepage:active {color: #8A1444 !important; font-weight: bold;}
.padding {margin: 20px 0 8px 0;}