@charset "UTF-8";
/* CSS Document */

/***************************************/

/*********** HTML tag styles ***********/

/***************************************/

body {
	font-family: Helvetica, Arial, Verdana, sans-serif;
	text-align: center;
	min-width: 950px;
	font-size: small;
	line-height: 130%;
	margin-bottom: 10px;
	color: #333;
	background-attachment: fixed;
	background-color: #4FA7BD;
	background-image: url(../images/bodybg.png);
	background-repeat: repeat-x;
	background-position: top;
}

p {
	margin-bottom: 10px;
}
a {
	color: #039;
	text-decoration: none;
}
a:link {
	color: #039;
	text-decoration: none;
}
a:visited {
	color: #000066;
}
a:hover {
	text-decoration: underline;
}
h1 {
	margin-bottom: 10px;
	font-size: 130%;
}
h2 {
	font-weight: bold;
	margin-bottom: 7px;
	font-size: 120%;
	color:#000066;
}
h3 {
	font-weight: bold;
	margin-top: 5px;
	margin-bottom: 5px;
	font-size: 110%;
}
strong {
	color: #333;
	font-weight:bold;
}

/*******************************/

/*********** Layout ***********/

/*******************************/

#container {
	width: 950px;
	text-align: left;
	margin-top: 10px;
	margin-right: auto;
	margin-bottom: 10px;
	margin-left: auto;	
	background: #fff url(../images/footerBg.png) no-repeat bottom;
	overflow: hidden;
}
#wrapper {
	margin: 10px;
}
#masthead {
	width: 950px;
	position: relative;
	background: url(../images/mastheadBg.png);
}
#accessibility {
	margin-top: 15px;
}
#testaccessibility {
	float: right;
	margin-top: 10px;
}
#logo {
	padding-top: 10px;
	padding-right: 10px;
	padding-bottom: 0px;
	padding-left: 10px;
}
#staffStudents {
	float: right;
	padding-right: 20px;
	padding-bottom: 0px;
	position: absolute;
	top: 20px;
	right: 0px;
}
#teststaffStudents {
	float: right;
	padding-right: 20px;
	padding-bottom: 0px;
	position: absolute;
	top: 10px;
	right: 0px;
}
#testslogan {
	padding-right: 20px;
	padding-bottom: 0px;
		position: absolute;
	top: 10px;
	right: 300px;
}

#banner {
	width: 930px;
	padding: 0;
	margin: 0;
	margin-bottom: 10px;
}

#bannerflash {
	float: left;
	padding: 0;
	margin: 0;
	margin-bottom: 10px;
}

#bannercourses {
float: right;
padding: 0;
margin: 0;
margin-bottom: 10px;
}

#midContent {
}
#keyLinks {
	float: left;
	width: 198px;
	margin: 0;
	margin-right: 10px;
}
#news {
	float: left;
	width: 380px;
	margin: 0;
	margin-right: 10px;
}
#widgets {
	float: left;
	width: 328px;
}
#explore {
	clear: both;
	padding-bottom: 10px;
	border: 1px solid #CCCCCC;
	overflow: hidden;
}
#footerLogos {
	clear: both;
	text-align: center;
	margin-right: auto;
	margin-left: auto;
	padding-top: 10px;
	padding-right: 10px;
	padding-bottom: 0px;
	padding-left: 10px;
}

/***************************************/

/*********** Main Navigation ***********/

/***************************************/

#mainNav {
	margin: 0px;
	margin-bottom: 10px;
	padding: 0;
	list-style: none;
	width: 930px;
	float: left;
	background: #003366 url(../images/mainNavBg.png) repeat-x center;
}
#mainNav li {
	float: left;
}
#mainNav a {
	font-weight: bold;
	display: block;
	padding: 0 1.5em;
	line-height: 2.3em;
	background: url(../images/mainNavDivider.png) repeat-y right top;
	text-decoration: none;
	color: #fff;
}
#mainNav .first a{
	background: none;
}
#mainNav a:hover {
	background-color: #FF6600;
}

#home #mainNav .home a,
#courses #mainNav .courses a,
#centres #mainNav .centres a,
#employers #mainNav .employers a,
#contact #mainNav .contact a,
#downloads #mainNav .downloads a,
#jobs #mainNav .jobs a,
#help #mainNav .help a {
	background-color: #FF6600;
}

#mainNavLeft {
	margin: 0px;
	margin-bottom: 10px;
	padding: 0;
	list-style: none;
	width: 365px;
	float: left;
	background: #003366 url(../images/mainNavBg.png) repeat-x center;
}
#mainNavLeft li {
	float: left;
}
#mainNavLeft a {
	font-weight: bold;
	display: block;
	padding: 0 1.5em;
	line-height: 2.3em;
	background: url(../images/mainNavDivider.png) repeat-y right top;
	text-decoration: none;
	color: #fff;
}
#mainNavLeft .first a{
	background: none;
}
#mainNavLeft a:hover {
	background-color: #FF6600;
}

#home #mainNavLeft .home a,
#courses #mainNavLeft .courses a,
#centres #mainNavLeft .centres a,
#employers #mainNavLeft .employers a,
#contact #mainNavLeft .contact a,
#downloads #mainNavLeft .downloads a,
#jobs #mainNavLeft .jobs a,
#help #mainNavLeft .help a {
	background-color: #FF6600;
}

#mainNavRight {
	margin: 0px;
	margin-bottom: 10px;
	padding: 0;
	list-style: none;
	width: 355px;
	float: right;
	background: #003366 url(../images/mainNavBg.png) repeat-x center;
}
#mainNavRight li {
	float: right;
}
#mainNavRight a {
	font-weight: bold;
	display: block;
	padding: 0 1.5em;
	line-height: 2.3em;
	background: url(../images/mainNavDivider.png) repeat-y right top;
	text-decoration: none;
	color: #fff;
}
#mainNavRight .first a{
	background: none;
}
#mainNavRight a:hover {
	background-color: #FF6600;
}

#home #mainNavRight .home a,
#courses #mainNavRight .courses a,
#centres #mainNavRight .centres a,
#employers #mainNavRight .employers a,
#contact #mainNavRight .contact a,
#downloads #mainNavRight .downloads a,
#jobs #mainNavRight .jobs a,
#help #mainNavRight .help a {
	background-color: #FF6600;
}
/*********************************/

/*********** Key Links ***********/

/*********************************/

#keyLinks h1 {
	background: #003366 url(../images/mainNavBg.png) repeat-x center;
	color: #FFF;
	padding: 7px;
	margin: 0;
}
#keyLinks li {
	
}	
#keyLinks a {
	font-size: 110%;
	line-height: 150%;
	border-top-width: 2px;
	border-top-style: solid;
	border-top-color: #FFFFFF;
	display: block;
	padding: 5px;
	background-color: #D8EAF7;
}

#keyLinks a:hover {
	text-decoration: none;
	background-color: #0060bf;
	color: #ffffff;
}
#keyLinks ul ul li a {
	font-size: 100%;
	border-bottom: 1px dotted #ccc;
	background: none;
	padding-left: 20px;
	padding-bottom: 3px;
	padding-top: 3px;
}
#keyLinks ul ul li a:hover {
	background: none;
	color:#0000CC;
}
#keyLinks a.sectionHeadLink{
	border: none;
	background: url(../images/downArrow.png) no-repeat 175px .5em;
	color: #000066;
}

.socialMediaLinks a {
	font-size: 110%;
	line-height: 150%;
	border-top-width: 2px;
	border-top-style: solid;
	border-top-color: #FFFFFF;
	display: block;
	padding: 5px;
	
}

.socialMediaLinks a:hover {
	text-decoration: none;
	background-color: #0060bf;
	color: #ffffff;
}
.socialMediaLinks ul ul li a {
	font-size: 100%;
	border-bottom: 1px dotted #ccc;
	background: none;
	padding-left: 20px;
	padding-bottom: 3px;
	padding-top: 3px;
}
.socialMediaLinks ul ul li a:hover {
	background: none;
	
}
	
/**************************************************/	

/*********** Front Page News and Events ***********/

/**************************************************/

#news h1 {
	background: #003366 url(../images/mainNavBg.png) repeat-x center;
	color: #FFF;
	padding: 7px;
	margin: 0;
}
.newsStory {
	clear: both;
	padding: 0;
}
.newsStory:hover {
	background-color: #E8E8E8;
}
.newsStory img {
	float: left;
	border: 1px solid #333333;
	margin-top: 5px;
	margin-right: 10px;
	margin-bottom: 5px;
	margin-left: 0;
}
.newsStory h3 {
	font-weight: bold;
	margin-bottom: 3px;
	margin-top: 3px;
	padding-top: 3px;
}
.newsStory p {
	font-size: 95%;
}

/***************************************************/

/*********** Front Page Student Profiles ***********/

/***************************************************/

.studentProfile {
	clear: both;
}
.studentProfile img {
	float: left;
	border: 1px solid #333333;
	margin-top: 5px;
	margin-right: 10px;
	margin-bottom: 5px;
	margin-left: 0;
}
.studentProfile h3 {
	color: #333333;
	font-weight: bold;
	margin-bottom: 3px;
	margin-top: 3px;
}
.studentProfile p {
	color: #333333;
	font-size: 95%;
}

/************************************************/

/*********** Front Page College Blogs ***********/

/************************************************/

.collegeBlogs {
	clear: both;
}

.collegeBlogs img {
	float: left;
	border: 1px solid #333333;
	margin-top: 5px;
	margin-right: 10px;
	margin-bottom: 5px;
	margin-left: 0;
}
.collegeBlogs h3 {
	color: #333333;
	font-weight: bold;
	margin-bottom: 3px;
	margin-top: 3px;
}
.collegeBlogs p {
	color: #333333;
	font-size: 95%;
}

/***************************************************/

/*********** Front Page College Podcasts ***********/

/***************************************************/

.collegePodcasts {
	clear: both;
}

.collegePodcasts img {
	float: left;
	margin-top: 5px;
	margin-right: 10px;
	margin-bottom: 5px;
	margin-left: 0;
}
.collegePodcasts h3 {
	color: #333333;
	font-weight: bold;
	margin-bottom: 3px;
	margin-top: 3px;
}
.collegePodcasts p {
	color: #333333;
	font-size: 95%;
}

/*************************************************/

/*********** Front Page College Videos ***********/

/*************************************************/

.collegeVideo {
	clear: both;
}

.collegeVideo img {
	float: left;
	border: 1px solid #333333;
	margin-top: 5px;
	margin-right: 10px;
	margin-bottom: 5px;
	margin-left: 0;
}
.collegeVideo h3 {
	color: #333333;
	font-weight: bold;
	margin-bottom: 3px;
	margin-top: 3px;
}
.collegeVideo p {
	color: #333333;
	font-size: 95%;
}

/***********************************/

/*********** Explore CCB ***********/

/***********************************/

#explore h1 {
	background: #003366 url(../images/mainNavBg.png) repeat-x center;
	color: #FFF;
	padding: 7px;
	margin: 0;
}
.exploreLinks {
	float: left;
	width: 24%;
	padding-left: 5px;
}
.exploreLinks h2 {
	font-size: 110%;
	font-weight: bold;
	padding-bottom: 5px;
	padding-top: 10px;
}
.exploreLinks a {
	font-size: 95%;
	color: #666666;
	padding-bottom: 3px;
}
.exploreLinks a:hover {
	color:#333333;
	text-decoration: underline;
}

/*********** Bits to sort out hovers ***********/

.clearboth {
	display:block;
	clear:both;
	margin:0;
	padding:0;
}

/*********** Main Content Lists ***********/

#mainContent ul {
	list-style-position: inside;
	list-style-type: disc;
	margin-left: 10px;
}
#mainContent li {
	line-height: 150%;
}	

/*********** Table styles ***********/

table {
	color: #333333;
	padding: 0px;
	width: 99%;
	margin: 0px;
	border: 0px;
}

.tableStyle th {
	font-weight: bold;
	color: #FFFFFF;
	background: #003366 url(../images/mainNavBg.png) repeat-x center;
	padding: 3px;
	text-align:center;
}

.tableStyle td {
	padding: 5px;
	margin: 2px;
	vertical-align: top;
}

.tableStyle {
	border: 1px solid #CCCCCC;
}

.lightGrey {
	background-color: #FAFAFA;
	margin-bottom: 1px;
}
.darkGrey {
	background-color: #EDEDED;
	margin-bottom: 1px;
}

/*********** Ambassador styles ***********/

td.ambassadorPhoto {
	width: 150px;
}

/*************************************/

/*********** Image styles ***********/

/*************************************/

.imgLeft {
	float: left;
	margin: 5px;
}
.imgRightBorder {
	float: right;
	margin-left: 10px;
	border: 1px solid #666;
}
.imgRightAlign {
	float: right;
	margin-left: 10px;
}
.imgPad {
	margin: 5px;
	border-bottom: 2px solid #cccccc;
	border-right: 2px solid #cccccc;
}

.imgCaption {
	float: right;
	margin-top: 10px;
	margin-right: 0px;
	margin-bottom: 10px;
	margin-left: 10px;
}

.caption {
	width: 300px;
	text-align: center;
	color: #000066;
}

/*****************************************************/

/*************** Polaroid Image Styles ***************/

/*****************************************************/

.polaroid {
	float: right;
	padding: 5px;
}

.polaroidleft {
	float: left;
	padding: 5px;
}

/**************************************************/

/*********** Centre Details Page Styles ***********/

/**************************************************/

#centreDetailsLeft {
	float: left;
	width: 350px;
	padding-right: 10px;
	
}
#centreDetailsRight {
	float: right;
	width: 350px;
}

/*****************************************/

/*********** Content Pages Box ***********/

/*****************************************/

.contentBox {
	background-color: #FBFBFB;
	width: 75%;
	margin-right: auto;
	margin-left: auto;
	border: 1px solid #999999;
	padding-left: 10px;
	padding-top: 5px;
	padding-right: 10px;
	padding-bottom: 5px;
	margin-top: 10px;
	margin-bottom: 10px;
}
.contentBox li {
	list-style: none;
}

/****************************************/

/*********** Pull quotes Box ************/

/****************************************/

#blockquote {
	float: right;
	width: 198px;
	background: #e1e1e1 url(../images/pullquote_top2.gif) no-repeat;
	position: relative;
	margin-top: 0;
	margin-right: 10px;
	margin-bottom: 20px;
	margin-left: 20px;
	padding-left: 0px;
	border-left-width: 20px;
	border-left-style: solid;
	border-left-color: #FFFFFF;
}

#body > blockquote {
	margin-right: -60px;
}
p.quotebody {
	color: #363636;
	font-size: 120%;
	line-height: 1.2em;
	font-weight: bold;
	text-align: center;
	background: url(../images/quotemark_bottom2.gif) bottom right no-repeat;
	width: 150px;
	/* Box Model Hack for IE 1.5*/
	voice-family: "\"}\"";
	voice-family: inherit;
	width: 150px;
	padding-top: 20px;
	padding-right: 10px;
	padding-bottom: 10px;
	padding-left: 25px;
}
p.quotecite {
	color: #000066;
	font-size: 80%;
	font-weight: bold;
	text-align: right;
	padding-right: 15px;
	padding-bottom: 15px;
	background: url(../images/pullquote_bottom2.gif) left bottom no-repeat;
	margin-bottom: 0;
}

/**************************************/

/*********** Gallery styles ***********/

/**************************************/

div.gallery
  {
	margin: 3px;
	border: 1px solid #EEE;
	height: auto;
	width: auto;
	float: left;
	text-align: center;
	background-color: #FFF;
  }
div.gallery img
  {
	display: inline;
	margin: 3px;
	border: 1px solid #666;
  }
div.gallery a:hover img
  {
	border: 1px solid #DCDCDC;
	text-decoration: none;
  }
div.desc
  {
	text-align: center;
	width: 130px;
	margin: 2px;
  }

/***************************************************/

/*********** Profile Details page styles ***********/

/***************************************************/

#video {
	width: 330px;
	margin-right: 20px;
	float: left;
}

#videoDetails {
	margin-left: 350px;
}

/******************************************/

/*********** Awards page styles ***********/

/******************************************/

.awardsLeft {
	float: left;
	width: 100px;
	padding-right: 10px;
}

.awardsRight {
	float: right;
	width: 600px;
	padding-bottom: 10px;
}

/*****************************************/

/*********** Staff page styles ***********/

/*****************************************/

.staffLeft {
	float: left;
	width: 460px;
}

.staffRight {
	float: right;
	width: 460px;
}


/*******************************************/

/*********** Podcast page styles ***********/

/*******************************************/

.podcastItem {
	clear: both;
	margin-bottom: 5px;
	border: 1px dotted #CCCCCC;	
}

.podcastItem img {
	float: left;
	margin: 5px;
}

.podcastItem div {
	background-color:#FAFAFA;
	margin-left: 110px;
	padding: 5px;
}

/********************************************************************/

/*********** Governance board members details page styles ***********/

/********************************************************************/

#memberPhoto {
	width: 200px;
	margin-right: 20px;
	float: left;
}

#memberDetails {
	margin-left: 230px;
}


/********************************************************************/

/****************** Temporary courses table styles ******************/

/********************************************************************/

.courseTableLabel {
	font-weight: bold;
	text-align: right;
	width: 150px;
	padding-right: 20px;
	background-color:#ECECEC;
	border: #FFFFFF 2px solid;
}

/********************************************************************/

/****************** Temporary courses table styles ******************/

/********************************************************************/

.screenshotItem {
	clear: both;
	margin-bottom: 10px;
}

.screenshotItem img {
	float: left;
	margin: 5px;
	border: 1px solid #999999;
}

.screenshotItem div {
	margin-left: 185px;
	padding: 5px;
}

/**************************************************/

/*************** Skip Navigation style ***********/

/*************************************************/

a.skip {
	position: absolute; 
	left: -1000em; 
	width: 20em;
}

/**************************************/

/*********** Photo Gallery styles ***********/

/**************************************/

div.photoGallery
  {
	margin: 5px;
	border: 1px solid #EEE;
	height: auto;
	width: auto;
	float: left;
	text-align: center;
	background-color: #FFF;
  }
div.photoGallery img
  {
	display: inline;
	margin: 3px;
	border: 1px solid #666;
  }
div.gallery a:hover img
  {
	border: 1px solid #DCDCDC;
	text-decoration: none;
  }
div.photoDesc
  {
	text-align: center;
	width: 160px;
	margin: 2px;
  }