/*Background gradient image, and background colour for the mac, positioning of the margins for opera is in the body html tag*/
body {
	margin: 0px;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	background: url(images/mainbackground.jpg) #B4D5E8 repeat-x left top;
}
/*Topbar containing the university logo and the graphic in the top right corner*/
#topBarContainer {
	background: #0075B8;
	height: 58px;
	width: 100%;
}
/*The university logo in the topbarContainer*/
.unilogo {
	width: 200px;
	float: left;
}
/*The header graphic in the top right corner, in the topbarContainer*/
.header {
	background: url(images/header.jpg) no-repeat right top;
	height: 58px;
	width: 475px;
	/*float right has to go in this style for mac*/
	float: right;
}
/*The second bar down underneath topbarContainer*/
#bluebox {
	height: 46px;
	margin: 0px 0px 0px 181px;
	padding: 0px;
	border-left: 1px solid #cccccc;
	border-left: 1px solid #cccccc;
	border-top: 1px solid #cccccc;
	background: url(images/header3.jpg) #E7F3F8 no-repeat right top;
}
.breadCrumbContainer {
	float: left;
}
.breadCrumb {
	font-weight: normal;
	font-size: 60%;
	color: #333333
}
.topLine {
	width: 100%;
	height: 6px;
	overflow: hidden;
	background: url(images/repeat.gif) repeat-x left top;
}
.topLine2 {
	width: 100%;
	height: 7px;
	overflow: hidden;
	background: #fff;
}
.header5 {
	background: url(images/header5.jpg) no-repeat right top;
	height: 6px;
	width: 350 px;
}
.header6 {
	background: url(images/header6.jpg) no-repeat right top;
	height: 7px;
	width: 350 px;
}

.header4 {
	margin: 0px 7px 0px 181px;
	background: url(http://www.le.ac.uk/cc/lts/images/header4.jpg) #D5E9F4 no-repeat right top;
	height: 47px;
	border-top: 1px solid #E6E8E9;
	border-right: 1px solid #E6E8E9;
	border-left: 1px solid #E6E8E9;
}
/*Holds all the content underneath the top two bars, this style is for mac only*/
#mainContainer {
}

/* hide from IE mac \*/
#mainContainer {
	clear: both;
}
/*end hide*/
/*Contains the main menu on the left hand side*/
.leftContainer {
	float: left;
	font-weight:bold;
	height: 320px;
	width: 170px;
	margin: 0px 0px 10px 4px;
}
/*Main menu indent set to zero*/
.leftContainer ul {
	padding: 0;
	margin: 0;
}
/*Main menu list tag*/
.leftContainer li {
	font-size: 70%;
	border-bottom: 1px solid #EFEFF5;
	list-style: none;
	background-color: #0075B8;
	text-align: center;
	line-height: 20px;
}
/*Main menu items*/
.leftContainer a {
	display: block;
	text-decoration: none;
	color: #ffffff;
	padding: 0px 3px 0px 3px;
	width: 164px;
}
/*Main menu hover*/
.leftContainer a:hover, #selected {
	color: #0075B8;
	background: #ffffff;
}
#selectedLine {
	border-top: 1px solid #ccc;
	color: #0075B8;
	background: #ffffff;
}
/*This contains the main content for the page, including the transparency settings for IE Windows only*/
.rightContainer {
	/*This height is for opera/mozilla, so the submenu bar and text fits in the main box*/
	min-height: 275px;
/*End*/
/*This height is for IE PC only\*/
	_height: 275px;
/*End*/	
	background: url(images/header2.jpg) #fff no-repeat right top;
	filter:alpha(opacity=70);
	border-right: 1px solid #cccccc;
	border-bottom: 1px solid #cccccc;
	border-left: 1px solid #cccccc;
	padding: 0px 0px 10px 10px;
	margin: 0px 7px 10px 181px;
}
/*Wildcard used for.rightContainer so that elements within.rightContainer don't inherit the transparency*/
/*The underscore infront of position means that only IE will see this tag*/
.rightContainer * {
	_position: relative;
}
/*Paragraph font for main section*/
.rightContainer p {
	font-size: 70%;
	color: #333333;
	margin: 10px 0px 0px 0px;
	padding: 0px 10px 0px 0px;
}
.rightContainer li {
	font-size: 70%;
	color: #333333;
	margin: 10px 0px 0px 0px;
	padding: 0px 10px 0px 0px;
	list-style-image: url(images/bullet.gif);
}
.rightContainer ul {
	margin: 0px 0px 0px 26px;
	padding: 0px;
}
.rightContainer ol li {
	font-size: 70%;
	color: #333333;
	margin: 10px 0px 0px 0px;
	padding: 0px 10px 0px 0px;
	list-style-type: decimal;
	list-style-image: url(http://www.le.ac.uk/cc/lts/lts.css);
}
.rightContainer a:active, .rightContainer a:link, .rightContainer a:visited   {
	color: #333333;
}
.rightContainer a:hover {
	color: #479BCC;
}
/*Blue bar that contains graphic on the right and H2 on the left*/

/*Learning Technology Section heading in the topbarContainer*/
H1 {
	font-size: 120%;
	font-weight: bold;
	color: #3D4C5A;
	margin: 0px;
	padding: 26px 5px 0px 0px;
	text-align: right;
}
/*H2 within header4*/
H2 {
	margin: 10px 0px 0px 10px;
	padding: 0px;
	font-size: 120%;
	font-weight: bold;
	color: #479BCC;
}
/*Heading 3*/
H3 {
	margin: 0px;
	padding: 0px;
	font-size: 100%;
	font-weight: bold;
	color: #479BCC;
}

/*Hack to get the HR tag to work, set to display HR as invisible*/
div.line hr{ /* take out the troublemaking HR */
display:none; 
}
/*This div holds HR tag*/
div.line {
	background: transparent url(images/gradient.gif) no-repeat;
	height: 30px;
	padding: 0px;
	margin-left: 0px;
}
/*Used as a space holder instead of a BR tag*/
.space {
	height: 15px;
}
.bigspace {height: 40px;}
/*Used as a space holder instead of a BR tag*/
.smallSpace {
	height: 5px;
/*overflow:hidden allows the height of a div to be less than 20px (or the height of the font)*/
	overflow: hidden;
	color: #ffffff;
}
/*Set form margin and padding to zero*/
form {
padding: 0px;
margin: 0px;
}
.outlineBox {
	background-color: #D5E7F1;
	/*End from MAC\*/
	_background-color: #ffffff;
	/*END*/
	margin: 10px 10px 10px 0px;
	padding: 5px 5px 5px 5px;
	font-size: 70%;
	line-height: normal;
}
.box {float: left; width: 100%;}
.photo {
	background: #E7F3F8;
	margin: 0px 10px 10px 10px;
	/* hide from IE mac \*/
	_margin: 0px 5px 10px 5px;
	/*End hide*/
	padding: 10px;
	width: auto;
	height: auto;
}
.photoLeft {background: #D5E7F1; float: left; margin: 0px 10px 10px 10px; /*HIDE MAC\*/_margin: 0px 10px 10px 5px;/*END*/ padding: 10px; width: auto; height: auto;}


.bold {
	font-weight: bold;
}
.clear {
	clear: both;
}
.right {
	float: right;
}
.left {
	float: left;
}
.help {
	cursor: help;
}
.normal {
	font-weight: normal;
}
.white {background: #fff;}

/*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;}

/*This sets the margin and padding for the bottom navigation bars to zero*/
.bottomNav ul {list-style: none; padding: 0; margin: 0;}

/*This sets 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;}

/*This sets 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%; background: #0075b8; border: 1px solid #fff;}

.bottomNav a:link, .bottomNav a:visited, .bottomNav a:active {text-decoration: none; color: #fff;}

.bottomNav a:hover {text-decoration: none; background: #fff; color: #333;}

/*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; background: #fff; color: #333; height: 33px;}
/*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,.maintainerLeft a:link, .maintainerLeft a:visited, .maintainerLeft a:active {text-decoration: underline; color: #333;}
.maintainerRight a:hover, .maintainerLeft a:hover {color: #479BCC;}
/*sets the font style to normal*/
.normal {font-weight: normal;}
.approved {font-size: 65%; padding: 0 0 10px 5px; clear: both;}


.portfolio {width: 33%; text-align: center; font-size: 72%;}
.portfolio-container {background: #D5E7F1; height: 140px; margin: 0 10px 0 0; padding: 15px 0 0 0;}

.gallery ul {margin: 0; padding: 0;}
.gallery ul li {margin: 0; padding: 0; list-style-image: url(http://www.le.ac.uk/cc/lts/lts.css); float: left; list-style-type: none; height: 150px; text-align: center; line-height: 140%;}
.gallery a {width: 200px; display: block;}