html {margin: 0; padding: 0;}
body {font-size: 80%; /* initially set to percentage so that ems work without producing miniscule text in IE */
text-align: center; /* needed to center the container in IE5.x because it doesn't like 'margin: 0 auto' */
margin: 0 auto; padding: 0;
font-family: Arial, Geneva, Helvetica, sans-serif; font-size: 90%;
font-weight: normal; color: #2e4799;
background-color: #fff; background-image: url(images/back.gif);
background-position: 20% 0; background-repeat: no-repeat;}
/*=====divs======*/
div#wrapper {margin: 20px auto; padding: 0; width: 750px;
line-height: 1.4em; border: 1px solid #a1a1a3; background-color: #ffffff;}
div#head {margin: 0; padding: 0; height: 74px;
background-image: url(images/masthead2.jpg); background-position: 0 100%;
background-repeat: no-repeat;}
div#content {padding: 2% 5% 3% 2%; margin: 0 auto; /* centers the container */
background: white url(images/menuback.jpg) no-repeat 6000px 6000px;
text-align: left; /* resets the text alignment */
clear: left; /* Stops the content sitting next to the menu */}
div#staffcontent {padding: 2%; margin: 0 auto; /* centers the container */
background: transparent url(images/menuback.jpg) no-repeat 6000px 6000px;
text-align: left; /* resets the text alignment */}
/*div#menu {height: 1.5em; border: 1px solid #b5b5b7; border-right-width: 0;
border-left-width: 0; background: white url("images/barback.jpg") repeat-x bottom;} */
div#flash {float: right; background-color: white;
border-left: 1px solid #e1e1e3; width: 100px; clear: both;
margin: 0 10px 0 0; padding-bottom: 120px;}
div#footer {border-top: 1px solid #e1e1e3; clear: both;
background: white url("images/barback.jpg") repeat-x bottom;}
div#rightcol {float: right; background-color: white; border-left:
1px solid #e1e1e3; margin: 0 10px 10px 10px;}
div#quote {float: left; width: 30%; margin: 10px 20px; border: 1px solid #fae866;
background-image: url(images/quoteback.jpg); background-position: bottom;
background-repeat: no-repeat; font-stretch: expanded; }
div#quote.right {float: right; width: 30%; margin: 10px 20px; border: 2px solid #fae866;
background-image: url(images/quoteback.jpg); background-position: bottom;
background-repeat: no-repeat; font-stretch: expanded; }
div#quote p {text-align: left; padding: 5px 5px 5px 10px; font-weight: bold; font-size: 1em;}
div#quote p.author {text-align: right; font-style: italic; color: #8e6384; font-weight: bold;}
/* staff page divider */
div#left {float: left; width: 45%; background-color: #ffffff; padding: 20px 0 20px 30px;}
div#right {float: right; width: 45%; background-color: #ffffff; padding: 20px 30px 20px 0;}
div.hr {height: 30px; margin: 10px 0; background: #fff url(images/hr.gif) no-repeat scroll center;}
div.hr hr {display: none;}
div#imgleft {float: left; margin: 10px 20px 15px 0; padding: 5px; border: 1px solid #d4d4d6;}
div#imgright {float: right; margin: 10px 0 15px 20px; padding: 5px; border: 1px solid #d4d4d6;}
/*===========main elements==========*/
h1 {display: none;}
h2 {font-size: 1.5em; font-weight: bold; background-color: white; margin-left: 20px; font-style: italic;
border-bottom: 1px solid #e1e1e3; padding-bottom: 10px; margin-bottom: 25px;}
h3 {font-size: 1.1em; font-weight: bold; background-color: white; padding-left: 20px; font-style: normal;}
h4 {font-size: 90%; font-weight: bold; margin-bottom: 0; padding-left: 20px; padding-bottom: 5px; }
p {color: #00269e; margin: 0; text-align: justify; padding: .5em 1em .5em 20px;
line-height: 1.2em; font-size: 0.85em;}
p.index {padding: .5em 120px .5em 20px;}
img {border: none;}
a:link {color: #00269e;}
a:visited {color: #8e6384;}
a:hover a:active {color: #8e6384; text-decoration: underline;}
ul, ol, li {margin: 0; padding: 0; text-align: left;}
table.simple {margin: 10px 0 10px 20px; padding: 5px; border: 1px solid #d4d4d6; text-align: left; width: auto;
font-size: .85em;}
table.simple th tr {border-bottom: 1px solid #d4d4d6; }
/*===========navigation===========*/
#nav, #nav ul {float: left; width: 100%; list-style: none; line-height: 1.5em; font-weight: bold;
padding: 0; margin: 0; border: 1px solid #b5b5b7; border-right-width: 0; border-left-width: 0;
background: #f8fdff url("images/barback.jpg") repeat-x bottom;}
/* Style the links within the ul nav. The w\idth hack is used to control the width in older IE versions*/
#nav a {display: block; width: 11em; w\idth: 10em; text-decoration: none; padding-left: 15px; margin: 0;
font-size: 88%; font-weight: bold; color: #a1a1a3; border-right: 1px solid #e1e1e3; border-left: 1px solid #ffffff;}
/* Remove the border from the left hand side of the first link and right hand side of last link */
#nav a.first {border-left-width: 0;}
#nav a.last {border-right-width: 0;}
/* Remove the border from the right hand side of the sub lists that was added in #nav a */
#nav li li a {border-right-width: 0;}
/* Change the colour of the links on mouse over */
#nav a:hover {color: #8e6384;}
/* Width must be specified here otherwise Opera will throw it's toys out of the pram */
#nav li {float: left; padding: 0; width: 10em;}
/* Style the drop down menus to be hidden by positioning them off the page until we need them. Display: none is not used for accessibility purposes. */
#nav li ul {position: absolute; left: -999em; height: auto; width: 13em; w\idth: 11em; font-weight: normal;
margin: 0; background: url(images/menuback.gif) top left no-repeat; border: solid 1px #b5b5b7;}
/* Set the width of the sub list items and put a little top and bottom padding to separate them out as well an em on the right to give a little room after each */
#nav li li {padding: 3px 1em 3px 0; width: 10em; background-color: transparent;}
/* Style the links in the drop down list */
#nav li ul a {width: 13em; w\idth: 11em;}
/* left:auto brings the drop down menus into view */
#nav li:hover ul, #nav li.sfhover ul {left: auto;}
#nav li:hover, #nav li.sfhover {background-color: transparent;}
/*===========Control classes===========*/
img.left {float: left; margin: 10px 20px 15px 20px; padding: 5px; border: 1px solid #d4d4d6;}
img.right {float: right; margin: 10px 10px 15px 20px; padding: 5px; border: 1px solid #d4d4d6;}
img.head {float: left; margin-left: 10px;}
img.clip {border: 1px solid #e1e1e3; padding: 5px; margin: 5px;}
img.staff {float: right; margin: 10px 30px 15px 15px; padding: 5px; border: 1px solid #e1e1e3;}
h2.staff {padding: 10px 0 10px 0; margin-bottom: 20px; clear: both;}
p.clip {vertical-align: middle;}
p.clipright { vertical-align: middle; text-align: right;}
p.footer {font-size: 85%; color: #a1a1a3; margin-left: 10px;}
p.right {text-align: right; padding: 15px 20px 5px 20px; line-height: 1.2em;}
p.indent {color: #00269e; margin: 0; text-align: justify; padding: .5em 1em .5em 30px;
line-height: 1.2em; font-size: 0.85em;}
ul.wide {font-size: 0.85em; padding-left: 10px; width: 85%; margin-left: 10px;}
ul.narrow {font-size: 0.85em; padding-left: 10px; width: 350px; margin-left: 10px;}
ul.check {font-size: 0.85em; padding-left: 10px; margin-left: 15px;}
ul.narrow li {list-style-type: circle; border-bottom: 1px dotted #fae866;
list-style: inside; padding: 10px 0;}
ul.wide li {list-style-type: circle; border-bottom: 1px dotted #fae866;
list-style: inside; padding: 10px 0;}
#content span.highlight {color: #8e6384; font-weight: bold;}
li.q {font-weight: bold; list-style-type: none; border-bottom: none;
background-position: 0 8px; background-image: url(images/bullet.jpg); background-repeat: no-repeat;
padding-top: 5px; padding-left: 1.7em; vertical-align: top; margin-right: 10px;}
li.a {list-style-type: none; color: #8b8b8c; font-style: italic;
padding-top: 0; padding-left: 20px; list-style-position: outside;}
#footer a:link {color: #a1a1a3;}