﻿/* CSS Document */

/*Style sheet for the 2 column static template - CSS written by david wickins of the LTS Univeristy of Leicester dw75@le.ac.uk">*/

/*This style effects virtually everything within page, as all the page content sits within the body tag*/
html,body {
	height: 100%;
}

body {
	padding: 0;
	margin: 0;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	background-color: black;
	position:relative;
}

/*This box contains the main page content*/
.container {
	margin: 0 auto;
	width: 700px;
	padding: 0;
	min-height: 100%;
	position: absolute;
	height: auto;
}

.container_full {
	margin: 0 auto;
	width: 700px;
	padding: 0;
	min-height: 100%;
	position: absolute;
	height: 100%;
}

#container{
	position: relative;
	margin: 0 auto;
	width: 100%; /* VERY important */
	top: 0px; /*whatever you want */
	left: 0px; /* VERY important */
}

#content {
	position: absolute;
	width: 700px; /* free of choice */
	background-color: white;
	left: 50%;
	margin-left: -350px;
}

/*The widths of columnOne and columnTwo should add up to 740px , column one is for the main navigation*/
.columnOne {
	FLOAT: left;
	WIDTH: 444px;
	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;}

/*This sets font size, and text alignment*/
.columnOne li {font-size: 72%; list-style: none; text-align: center;}

/*This sets the style for the  main navigation bars, the height can be altered by adjusting the top and bottom padding, which is currently set to 5px*/
.columnOne a:link, .columnOne a:visited, .columnOne a:active {display: block; text-decoration: none; padding: 5px 0 5px 0; width: 100%;}

/*The widths of columnOne and columnTwo should add up to 740px , column two is for the main page contents*/
.columnTwo {
	float: left;
	WIDTH: 296px;
	PADDING: 0;
	margin: 0;
	overflow: visible;
}

/*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;}

/*this is for the bottom of the screen, so that the background image for the menu shows up*/
.bottom {clear: both; overflow: hidden; width: 100%; height: 1px;}

/*sets the text size for the h1 text, main heading top right hand corner*/
h1 {font-size: 120%; text-align: right; font-weight: bold; padding: 0.8em 0.2em 0 0; margin: 0; line-height: 1.1em;}

/*sets the style for the page heading*/
h2 {font-size: 100%; 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: 5px;
	margin: 15px 10px 10px 10px;
}

/*sets the 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;}

/*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 5px 10px 5px; /*End hide*/
	;
	padding: 10px;
	width: auto;
	height: auto;
	margin-top: 0;
	margin-right: 5px;
	margin-bottom: 5px;
	margin-left: 0;
}

/*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 10px 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;}

/*These styles control the latest news panel on the home page*/
.latest {width: 190px; height: auto; border: 1px solid #ccc; padding: 5px; margin: 0 0 15px 0;}
.latest-width {width: 196px;}

/*These styles control the menu on the right of the home page*/
.columnThree  ul {margin: 5px  0 0 20px; padding: 0; font-size: 70%; font-weight: normal; line-height: 140%;}
.columnThree  ul li {margin: 0; padding: 0 5px 2px 0; text-align: left;}
.columnThree {width: 200px; padding: 0 10px 0 10px; margin: 5px 0 0 0; text-align: center;}
.columnThree P {padding: 0; margin: 0 0 5px 0; font-size: 70%; line-height: 140%; }

/*These styles control the quick links panel on the home page*/
.quick-links-header {font-weight: bold; text-align: center; list-style-type: none;}
.quick-links {width: 35%; padding: 0; margin: 0 7px 10px 20px;}
.quick-links ul {margin: 0; padding: 0;}
.quick-links ul li {margin: 0 ; padding: 2px; display: block;}
.quick {padding: 5px; margin: 3px 0 3px 0;}
.quick-header {padding: 3px; font-size: 80%; font-weight: bold;}
.quick-width {
}

/*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 student profiles*/
.profiles {margin: 10px;}
.profile-photo {
	margin: 0 10px 5px 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 {
	border: 1px #808080 solid;
	margin: 0;
	padding: 5px;
}

/*The widths of columnOne and columnTwo should add up to 740px , column two is for the main page contents*/
.column {
	background: url('images/blue/shadow.gif') repeat-x;
	float: left;
	margin: 0;
}
/*This is the style for all links in the main page content*/
.column a, .column a:link, .column a:visited, .column a:active {text-decoration: underline;}	

/*This sets the indent for a bulleted list and also its font size*/
.column ul {margin: 0 10px 15px 45px; padding: 0; font-size: 72%;}
.column ul ul {margin: 2px 0 2px 18px; padding: 0; font-size: 100%;}
.column 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*/
.column ol {margin: 0 10px 15px 53px; padding: 0; font-size: 72%;}
.column ol ol {margin: 2px 0 2px 24px; padding: 0; font-size: 100%;}
.column 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*/
.column dl {margin: 0 10px 15px 29px; padding: 0; font-size: 72%;}

/*This provides a margin around the text in a numbered list*/
.column ol li {margin: 0; padding: 0; list-style-type: decimal; line-height:140%;}

/*This provides a margin around the text in a bulleted list*/
.column ul li {margin: 0; padding: 0; line-height:140%;}
.column 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*/
.column dl dt {margin: 5px 0 0 0; padding: 0; font-weight: bold;}

/*This sets the indent for the second option in your definition list*/
.column dl dd {margin: 0 0 0 20px; padding: 0;}

