/* CSS LAYOUT DETAILS */

body {min-width: 800px; 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: 19%; _width: 19%; padding: 0; margin: 0; font-weight: bold;}

/*This sets the padding and margin for the main navigation bars to zero
.columnOne ul {padding: 0; margin: 0 0 0 40px; _margin: 0 0 0 0px;}

/*This sets the font size, and text alignment for the main navigation bars
.columnOne li {font-size: 72%; list-style: none; text-align: center;}

/*This sets the 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: 7px 0 7px 0; width: 60%;}*/

/*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: 55%; padding: 0; margin: 0; _min-height: 500px; min-height: 500px; overflow: hidden; clip: rect(auto 10% auto auto);}
.home-column {width: 79%;}

/*This is the style for all links in the main page content*/
.columnTwo a, .columnTwo a:link, .columnTwo a:visited, .columnTwo a:active {text-decoration: underline;}	

/*This sets the 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%;}

/*This sets the 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%;}

/*This sets the indent for a definition list and also its font size*/
.columnTwo dl {margin: 0 10px 15px 29px; padding: 0; font-size: 72%;}

/*This provides a margin around the text in a numbered list*/
.columnTwo ol li {margin: 0; padding: 0; list-style-type: decimal; line-height:140%;}

/*This 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%;}

/*This sets the indent for the first option in your definition list*/
.columnTwo 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 {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: 24%; padding: 0; margin: 0; border-style: none; overflow: hidden; clip: rect(auto 5% auto auto);}
		
/*sets the indent for the menu options to zero*/
.columnThree ul {padding: 20px 0px 0px 20px; margin: 0;}

/*sets the styling for the options in the sub navigation*/
.columnThree li {font-size: 72%; list-style: none; margin: 0; padding: 5px 0px 5px 15px;}

/*sets the style for the options in the sub navigation*/
.columnThree a, .columnThree a:link, .columnThree a:visited, .columnThree a:active {text-decoration: underline;}

/*style used for placing photos in column Three*/
.photoThree {margin: 0px; /* hide from IE mac \*/ _margin: 0px; /*End hide*/ padding: 0px; width: auto; height: auto;}

/*This is for mozilla only, so the background graphics for the menus shows up*/
.important {width: 100%; height: 1px; overflow: hidden; clear: both;}

/*sets the text size for the main headings*/
h1 {font-size: 150%; font-weight: bold; padding: 15px 10px 5px 0px; margin: 20px 10px 20px 10px;}

/*sets the style for the page heading*/
h2 {font-size: 120%; font-weight: bold; padding: 15px 10px 3px 0; margin: 20px 10px 20px 10px;}

/*sets the style for sub-headings*/
h3 {font-size: 80%; font-weight: bold; padding: 10px 0 0 0; margin: 15px 10px 10px 10px;}

/*sets the styles for column 3 headings*/
h4 {font-size: 100%; font-weight: bold; padding: 10px 0 0 20px; margin: 10px; color: #CC0000}

/*sets the styles for H5*/
h5 {font-size: 72%; font-weight: bold; margin: 15px 10px 10px 30px;}

/*sets the styles for H6, H7, H8, H9, H10*/
h6, h7, h8, h9, h10 {font-size: 72%; font-weight: normal; margin: 15px 30px 10px 30px;}

/*sets the style for paragraph text*/
P { padding: 0; margin: 7px 10px 13px 10px; font-size: 72%; line-height:140%;}

/*sets 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;}

/*sets the style for tables*/
table {border: 0; margin: 10px; padding: 0; border-collapse: collapse; font-size: 72%; width: 95%; text-align: center;}

/*Sets the size of paragraphs used within tables*/
table p {font-size: 100%; line-height:140%; padding: 0; margin: 0;}

/*sets the style for table headings*/
th {padding: 5px; font-weight: bold;}

/*sets the style for cells within a table*/
td {padding: 5px;}

/*sets the style for blockquotes*/
blockquote { font-size: 72%;}

/*a div needs to be added to the blockquote to add the quote graphic on the right hand side*/
blockquote div {padding: 0 48px;}

/*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;}

/*Styles used for the a-z listings on the home page*/
.listings {border: 1px solid #ccc; margin: 0 0 0 10px; min-height: 70px; width: 400px;}
.listings ul {margin: 0 0 0 10px; padding: 0;}
.listings ul li {margin: 10px 0 10px 0; padding: 0; width: 30px; float: left; list-style-type: none; list-style-image: none !important; font-size: 100%; font-weight: bold;}

/*Styles used for staff profiles*/
.staff-profiles {margin: 10px;}
.profile-photo {margin: 0 10px 10px 0; font-size: 70%;}
/*The width for this style should be 10px less than the photo above it*/
.photo-caption {margin: 5px 0 0 0; width: 146px; text-align: center; padding: 5px;}
/*Style used for student profile quote box*/
.profile-quote {width: 200px; margin: 0 0 5px 10px;}
.profile-quote p {margin: 0; padding: 5px;}





