@charset "utf-8";
/* CSS Document - CONTAINS ALL KEY ELEMENTS APART FROM FIXED & FLUID WIDTHS and BASE TEXT SIZE*/
/* body font 16px - x 1.125 = 18, x 0.875=14 , x 0.81255=13, x 0.75=12 , x 0.688=11 */

/* COLOUR CODES ------------------------------------------------------------------# 
# Light Grey (borders): #CCCCCC
# CCB Red (top border. main menu hilight) #cc092f
# Light blue (form buttons) #66CCFF
# Light blue/grey (left menu bg) #f0f2f2
# Bright blue (homepage college life h3 and links) #0077d4
# Hot pink (homepage Hot Links h3 and links) #d80871
# Bright Green (homepage course link) #67bf20 
# Blue-grey (bg to website credits btm right corner)#cad8dd
# Dark red (sub-menu main sections) #990000
# Mid blue (H1 and sub-menu active) #0072cf
# (H2) #cad8dd
# (H3) #003399
# (H4) #000066
*/


body {padding:0px; margin:0px; font-family:"Trebuchet MS",Verdana, Arial, Helvetica, sans-serif;}
#container {
	border-top:4px solid #cc092f;
	border-left:1px solid #CCCCCC;
	border-right:1px solid #CCCCCC;
	border-bottom:1px solid #CCCCCC;
	margin-left:auto;
	margin-right:auto;
	background-image:url(../images/container-bg.gif);
	background-repeat:repeat-y;
}

#homepage #container {background-image: none; background-repeat: no-repeat;}
p {line-height:1.3em;}
img {border:0px;}
a:hover {text-decoration:underline; color:#000000;}


/***************************** Layout and text size changes *****************************/
body.layoutfixed #container {width:980px;}
body.layoutfixed #right-col {width:700px;}
body.layoutfixed #left-bot-home {min-height:86px;}
body.layoutfixed #mid-bot-home {min-height:86px;}
body.layoutfixed #right-bot-home {min-height:86px;}
body.layoutfluid #container {width:98%;}
body.layoutfluid #left-bot-home {min-height:86px;}
body.layoutfluid #mid-bot-home {min-height:86px;}
body.layoutfluid #right-bot-home {min-height:86px;}
body.layoutfluid #right-col {width:73%;}
body.textsmall {font-size:100%;}
body.textmedium {font-size:112.5%;}
body.textlarge {font-size:125%;}

/***************************** Page header styles *****************************/
#header {min-height: 95px; background-color:#FFFFFF; width:100%;}
#page-controls {float:left; width:200px; height:30px; padding:5px;}
#tagline {float:left; width:200px; height:46px; padding:5px; clear:left;}
#logo {float:right; width:431px; text-align:left; font-size:0.875em; color: #0066cc;}
#logo img {margin-bottom:10px;}


/***************************** Menu styles *****************************/
#main-menu {clear:both; width:100%; min-height:33px; background-image: url(../images/main-menu-bg.png); background-repeat:repeat; color:#FFFFFF; background-color:#FFFFFF;}
#main-menu ul {margin: 0; padding: 0; display: inline;}
#main-menu ul li{
	color:#FFFFFF;
	font-weight:bold;
	font-size: .875em;
	margin:0;
	padding:0;
	border-left: 1px solid #fff;
	list-style: none;
	display: inline;	
	line-height:2.2em;
	margin-left:-3px;
}
	
#main-menu ul li a:link, #main-menu ul li a:active, #main-menu ul li a:visited {
	color:#FFFFFF; font-weight:bold;text-decoration:none; padding: 3px 21px;}
		
#main-menu ul li a:hover {background-color:#cc092f; font-weight:bold; text-decoration:none; padding: 3px 21px;}
#main-menu ul li.first {margin-left: 0; border-left: none; list-style: none; display: inline;}
#main-menu ul li.active a {background-color:#cc092f;}


/***************************** Search boxes and top images *****************************/
#top-content {height:117px; width:100%; border-top:3px solid #FFFFFF; padding-bottom:3px; border-bottom:1px solid #CCCCCC;background-color:#FFFFFF;} 
#top-search {float:left; height:117px; width:244px; background-image:url(../images/search-bg.jpg); background-repeat:repeat-x;}
#search-form {margin: 12px 0 0 15px;}
#search-form label {font-weight:bold; font-size: 0.875em; line-height:0.85em; margin: 0; padding: 0px;}
#search-form td {vertical-align: bottom;}
/*#top-images {float:right; width: 493px; height:117px; border-right:4px solid #fff;}*/
#promo-top-left {float:right; width: 239px; height:117px; border-right: 5px solid white;}
#promo-top-middle {float:right; width: 239px; height:117px; border-right: 5px solid white;}
#promo-top-right {float:right; width: 239px; height:117px; border-right: 3px solid white;}
#promo-upper-left {margin-top:10px;}
#promo-upper-left img {border:2px solid #FFF;}
#promo-lower-left {margin-top:3px;}
#promo-lower-left img {border:2px solid #FFF;}
/*Commented by Paul 9/12/2008 as they don't seem to be applicable any more*/
/*body.homepage #top-search {float:left; height:117px; width:24.7%; background-image:url(../images/search-bg.jpg); background-repeat:repeat-x;}*/
/*body.homepage #top-images-home {float:right; width: 738px; height:117px;}*/


/***************************** Left column and sub menu on normal pages *****************************/
#left-col {width:244px; float:left; background-image:url(../images/left-col-home-bg.jpg); background-repeat:repeat-x; margin-top:3px;}
#sub-menu {background-color: #f0f2f2; margin:11px 3px 3px 3px; padding:5px;}
#sub-menu ul {margin: 0 10px; padding: 0;}
#sub-menu ul li {border-bottom: 1px dotted #CCCCCC; list-style: none; padding-bottom:5px;}
#sub-menu ul li a:link, #sub-menu ul li a:active, #sub-menu ul li a:visited {font-family: Georgia, "Times New Roman", Times, serif; font-size: 0.875em; color: #990000; text-decoration:none;}
#sub-menu ul li a:hover {text-decoration:underline;}
#sub-menu ul li ul li {border-bottom: 1px dotted #db7093; border-collapse:collapse; margin-left:10px; line-height:1em; padding:4px 0;}
/*Sub-sub sections don't have a bottom border*/
#sub-menu ul li ul li ul li {border-bottom: 0;}
/*An attempt at showing/hiding submenus and sub-submenus*/
#sub-menu ul li ul {display: none;}
#sub-menu ul li.active ul, #sub-menu ul li ul.activesection {display: block;}
#sub-menu ul li a.listhaskids {padding-right: 10px; background: url(../images/menu-arrow-right.gif) no-repeat center right;}
#sub-menu ul li.active a.listhaskids {background-image: url(../images/menu-arrow-down.gif);}
#sub-menu ul li.active ul li a.listhaskids {background-image: none;} /*Remove the arrow in the second level*/
/*#sub-menu ul li.activesection ul li ul {display: none;}*/
/*#sub-menu ul li.activesection ul li.activesection ul {display: block;}*/
				
#sub-menu ul li ul li a:link, #sub-menu ul li ul li a:active, #sub-menu ul li ul li a:visited {
	font-family:"Trebuchet MS",Verdana, Arial, Helvetica, sans-serif;
	font-size: 0.75em;
	color: #000;
	text-decoration:none;
}
#sub-menu ul li ul li a:hover {text-decoration:underline;}
#sub-menu ul li.active a {color:#0072cf;}
#sub-menu ul li ul li.active a {color:#0072cf;}
#sub-menu ul li ul li.active ul li a {color:#000000;} /*colour of sub sub menus*/

#further-info {padding-left: 15px;}
#further-info H3 {
	font-family: Georgia, "Times New Roman", Times, serif;
	color: #000;
	font-size:.875em;
	font-weight:normal;
	border-bottom:1px solid #000;
	margin:15px 14px 5px 0px;
	padding:0;
}	
#further-info li {font-size:0.75em;}
#further-info ul {list-style-type:none; padding:0px; margin:10px 0 5px 5px;}
#further-info ul li {
	background-image: url(../images/bullet-red-square.gif);
	background-repeat: no-repeat;
	padding:0 0 8px 24px;
	line-height:.875em;
}
#further-info ul li a:link, #further-info ul li a:active, #further-info ul li a:visited {color:#666666; text-decoration:none;}
#further-info ul li a:hover {color:#000; text-decoration:underline;}


/***************************** Right column on normal pages *****************************/
/* The width controlled by layout-fixed and layout-fluid.css*/
#right-col {float:left; padding:15px; /*border-left: 1px solid #CCCCCC;*/}	
#breadcrumb {font-size: 0.75em; color:#990000; text-decoration:none;}
#breadcrumb a:link, #breadcrumb a:active, #breadcrumb a:visited {text-decoration:none;}
.level1 {color:#999999;}
.level2 {color: #666666;}
.level3 {color: #333333;}
	
#right-col H1 {
	font-family: Georgia, "Times New Roman", Times, serif;
	color: #0072cf;
	font-size:2em;
	font-weight:normal;
	margin:7px 0 0 0;
	padding:0 0 5px 0;
}
#right-col H2 {
	font-family: Georgia, "Times New Roman", Times, serif;
	color: rgb(90,167,227);
	font-size:1.5em;
	font-weight:normal;
	font-style: normal;
	margin:0 0 10px 0;
	padding:0 0 7px 0;
	border-bottom: 1px dotted rgb(90,167,227);
}
#right-col H3 {
	font-family: Georgia, "Times New Roman", Times, serif;
	color: #0072cf;
	font-size:1em;
	font-weight:bold;
	margin:13px 0 6px 0;
	padding:0;
}
#right-col H4 {
	font-family: Georgia, "Times New Roman", Times, serif;
	color: #0072cf;
	font-size:1em;
	font-weight:normal;
	font-style: normal;
	margin:10px 0 6px 0;
	padding:0;
}

#right-col H5 {
	font-family: Georgia, "Times New Roman", Times, serif;
	background: rgb(90,167,227);
	color: #fff;
	font-size:1em;
	font-weight:normal;
	font-style: normal;
	margin:25px 0 10px 0;
	padding:7px;
	clear:both;
}

#right-col p {font-size:0.81255em; padding:0px; margin: 0 0 9px 0; line-height:1.4em;}
#right-col li {font-size:0.81255em;}
#right-col ul {list-style-type:none; padding:0px; margin:15px 0 15px 20px;}
#right-col ul li {
	background-image: url(../images/bullet-red-square.gif);
	background-repeat: no-repeat;
	padding:0 0 5px 16px;
	line-height:1.2em;
}
#right-col ol {padding:0px; margin:15px 0 15px 36px;}
#right-col ol li {
	padding:0 0 4px 4px;
	line-height:1.2em;
}
#right-col blockquote {
	font-size:0.875em;
	font-style:italic;
	background-color: #f0f2f2;
	padding:20px;
	margin: 10px 50px 8px 30px;
	border-left: 20px #336699 solid;
}
#right-col blockquote p {
	font-size:0.875em;
}

/*These were added by Paul 31/7/2008 as the paragraphs looked too close together on the cousre pages*/
body.page-courseview #right-col p {margin-top: 2px; margin-bottom: 1.2em;}
body.page-courseview #right-col ul {margin-top: 2px; margin-bottom: 1.2em;}

/*Added by Paul 30/10/2008 for the new automatic captioning done by CcbPage::GetMain. It can override the float and width.*/
/*It has a background in case it's displayed over a blockquote in the news section*/
div.image-container {float:right; width: 150px; border: 1px solid #CCCCCC; margin: 8px 0 15px 10px; *margin: 8px 0 5px 10px; padding: 10px 10px 0 10px; background: white;}
div.image-container p {font-variant: small-caps; clear: both; padding:0 10px 0 8px; text-align:center;}
	
	
/*For the course pages, added by Paul 2/7/2008*/
table.coursecosts th, table.coursecosts td {text-align: left; vertical-align: top; font-size:0.81255em;}
p.courselogos {}
p.coursestamps {}
p.courselink {}
p.course-download-pdf {float: right; margin: 8px 0 15px 10px;}
p.course-download-pdf a[href$=".pdf"] {background-image: none;}

/*Added by Paul 28/11/2008 for the learning support form*/
#learning-support-form {background: #eeeeee; padding: 5px;}
#learning-support-form p {margin-top: 35px;}
#learning-support-form td {vertical-align: top; font-size: 0.8em;}




/***************************** Footer on normal pages *****************************/
#footer {
	width: 100%;
	clear:both;
	border-top: 1px solid #CCCCCC;
	min-height:80px;
	background-image: url(../images/footer-bg-new.gif);
	background-position:right;
	background-repeat:repeat-y;
	background-color:#FFFFFF;
}
#footer-left {float:left; width:560px; margin:20px 0 5px 15px;}
#footer-right-a {float:right; width:170px; text-align:left; padding:15px 5px 5px 10px; font-size:.75em;}
#footer-right-b {float:right; width:200px; text-align:left; padding:15px 5px 5px 10px; font-size:.75em;}
#footer-print {display: none;} /*This is only shown on the printed versions of pages, enabled in print.css*/



/* HOME only ######################################################################################################### */
#left-col-home {
float:left;
width: 25%;
background-image:url(../images/left-col-home-bg.jpg);
background-repeat:repeat-x;
/*border-right: 1px solid #CCCCCC;*/
margin-top:3px;
min-height:270px;}

/* -------------------------------------- */		
#mid-col {
float:left;
width: 50%;
margin-top:3px;
background-image:url(../images/mid-col-home-2-bg.jpg);
background-repeat:repeat-x;
border-left:1px solid #CCCCCC;}
/* -------------------------------------- */	
#mid-col-home-1 {
float:left;
width: 49.5%;
background-image:url(../images/mid-col-home-1-bg.jpg);
background-repeat:repeat-x;
border-right: 1px solid #CCCCCC;
min-height:270px;}

	#course-list-home {
	list-style-type:none;
	padding:0px;
	margin:0px;
	font-family: Georgia, "Times New Roman", Times, serif;}
	
	#course-list-home li
		{
			background-image: url(../images/bullet-green-arrow.gif);
			background-repeat: no-repeat;
			padding:0 0 8px 24px;
			line-height:.85em;
			}
			
			#course-list-home li a:link, #course-list-home li a:active, #course-list-home li a:visited {
			color:#000000;
			text-decoration:none;}
			
	#big-green-bold a:link, #big-green-bold a:active, #big-green-bold a:visited{
		font-family: Georgia, "Times New Roman", Times, serif !important;
		font-size:1.05em !important;
		color:#67bf20 !important;
		padding-left:24px;
		text-decoration:none;}
	#big-green-bold a:hover{
		font-family: Georgia, "Times New Roman", Times, serif !important;
		font-size:1.05em !important;
		color:#67bf20 !important;
		padding-left:24px;
		text-decoration:underline;}
/* -------------------------------------- */	
#mid-col-home-2 {
float:left;
width: 49.5%;
background-image:url(../images/mid-col-home-2-bg.jpg);
background-repeat:repeat-x;}

	#mid-col-home-2 h3 {
	color: #0077d4;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-weight:normal;
	font-size:0.875em;
	padding:0px;
	margin:0px;
	}
	#mid-col-home-2 a:link, #mid-col-home-2 a:active, #mid-col-home-2 a:visited	{
	color:#0077d4;
	text-decoration:none;
	}	
/* -------------------------------------- */	
#right-col-home {
float:right;
width: 24.7%;
background-image:url(../images/right-col-home-bg.jpg);
background-repeat:repeat-x;
border-left: 1px solid #CCCCCC;
margin-top:3px;
min-height:270px;}

	#right-col-home h3 {
	color: #d80871;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-weight:normal;
	font-size:0.875em;
	padding:0px;
	margin:0px;
	}
	#right-col-home a:link, #right-col-home a:active, #right-col-home a:visited	{
	color:#d80871;
	text-decoration:none;
	}
/* -------------------------------------- */	
.home-col-content {
	margin: 20px 5px 10px 15px;
	}
	.home-col-content p{
	font-size:0.75em;
	padding:0px;
	margin:0px;
	}
	
	.home-col-content a:link, .home-col-content a:link, .home-col-content a:link {
	text-decoration:none;}
	.home-col-content a:hover {
	text-decoration:underline;
	color:#000000 !important;}

/*-----------------------------------------*/
#home-bottom{
width:100%;
clear:both;}

#left-bot-home {
/*height controlled via layout-fluid.css*/
float:left;
width: 25%;
background-image:url(../images/left-bot-home-bg.jpg);
background-repeat:repeat;
border-right: 1px solid #CCCCCC;}

#mid-bot-home {
/*height controlled via layout-fluid.css*/
float:left;
width: 50%;
background-image:url(../images/mid-bot-home-bg.jpg);
background-repeat:repeat;}


#right-bot-home {
/*height controlled via layout-fluid.css*/
float:right;
width: 24.7%;
background-color: #cad8dd;
border-left: 1px solid #CCCCCC;}

	#right-bot-home p {
	margin: 5px 5px 10px 15px;
	font-size:0.688em;
	padding:0px;
	
	}

.home-bot-content {
	margin: 5px 5px 5px 15px;
	}
.home-bot-content p{
	font-size:0.75em;
	padding:0px;
	margin:0px;
	}


#footer-home {
width: 100%;
clear:both;
background-color:#FFFFFF;
min-height:80px;
}

	#footer-home-left {
	float:left;
	width:40%;
	margin:25px 0 5px 15px;
	}
	
	#footer-home-right {
	float:right;
	text-align:right;
	margin:5px 15px 5px 0;
	}

	
/* END HOME only ###################################################################### */



/* Misc styles ###################################################################### */

.white-heading {
color:#FFFFFF;
font-family: Georgia, "Times New Roman", Times, serif;
font-weight:normal;
font-size:1.125em;
margin: 6px 0 0 15px; }

	.white-heading a:link, .white-heading a:active, .white-heading a:visited{
	color:#FFFFFF;
	text-decoration: none; }
	.white-heading a:hover{
	color:#FFFFFF;
	text-decoration: underline; }

.white-text {
color:#FFFFFF;}
.grey-text {
color: #666666;}
	.grey-text a:link, .grey-text a:active, .grey-text a:visited {
	color: #666666;
	text-decoration:none;}
	.grey-text a:hover {
	text-decoration:underline;
	color:#000000;} 

.input-small {
			font-size: .688em;
			font-family:Arial, Helvetica, sans-serif;
			border: 1px solid  #999999;
			padding: 1px 3px;
			margin-top:2px;
			color: #999999;}

.blue-submit {font-size: .688em;
			font-family:Arial, Helvetica, sans-serif;
			font-weight:bold;
			border: 1px solid  #999999;
			padding:0px 0px;
			margin-left:5px;
			background-color:#66CCFF;
			}

.hide {
visibility:hidden;}

.float-left {
float:left;
padding:2px;}

.clear-both {
	clear:both;
}

.image-left, .image-left img {
	border: 1px solid #CCCCCC;
	padding: 6px;
	margin: 5px 10px 10px 0;
	float:left;
}


.image-container-right {
float:right;
width: 280px;
margin-left:20px;
}

	.image-container-right p {
	font-variant: small-caps;
	clear: both;
	padding:0 10px 0 8px;
	text-align:center;
	}
	
.image-container-right-150 {
	float:right;
	width: 150px;
	border: 1px solid #CCCCCC;
	margin: 8px 0 15px 10px;
	*margin: 8px 0 5px 10px;
	padding: 10px 10px 0 10px;
}

	.image-container-right-150 p {
	font-variant: small-caps;
	clear: both;
	padding:0 10px 0 8px;
	text-align:center;
	}
	
	.image-container-right-200 {
	float:right;
	width: 200px;
	border: 1px solid #CCCCCC;
	padding: 10px 10px 0 10px;
	margin: 8px 0 15px 10px;
	*margin: 8px 0 5px 10px;
}
.image-container-left-200 {
	float:left;
	width: 200px;
	border: 1px solid #CCCCCC;
	padding: 10px 10px 0 10px;
	margin: 5px 10px 15px 0;
	*margin: 5px 10px 5px 0;
}
.image-container-right-200 p, .image-container-left-200 p {
	font-variant: small-caps;
	clear: both;
	padding:0 10px 0 8px;
	text-align:center;
	}
.image-container-right-partners {
	float:right;
	width: 100px;
	border: 1px solid #CCCCCC;
	padding: 2px;
	margin: 0 10px 0 10px;
}
.image-container-right-partners p {
	font-variant: small-caps;
	clear: both;
	padding:0 5px 0 4px;
	text-align:center;
	}
.image-container-right-students {
	background: #fff;
	float:right;
	width: 80px;
	border: 1px solid #CCCCCC;
	padding: 2px 2px 0 2px;
	margin: 0 0 0 10px;
}
.image-container-right-students p {
	font-variant: small-caps;
	margin: 0px;
	clear: both;
	padding:0px;
	text-align:center;
	}
.image-container-left-small {
 float:left;
 width: 150px;
	border: 1px solid #CCCCCC;
	padding: 10px;
	margin:0 10px 10px 0;
}
.image-container-left-small p {
	font-variant: small-caps;
	clear: both;
	padding:0 10px 0 8px;
	text-align:center;
	}
.highlight-box-pale {
	clear: right;
	font-style:italic;
	background-color: #f0f2f2;
	text-align: center;
	padding: 15px 10px 10px 10px;
	*padding: 5px 0 10px 0;
	margin: 10px;
	border: 1px dashed #66CCFF;
	}
	
.highlight-box-right {
	float:right;
	width: 220px;
	background-color: #86C7DF;
	text-align: center;
	padding: 15px;
	margin-bottom: 10px;
	margin-left: 10px;
	border: 1px dotted #0066CC;
	}
object {
	margin-top: 10px;
	margin-bottom: 10px;
}

/* Make sure the icons are not cut */
a[href^="mailto:"], a[href$=".pdf"], a[href$=".doc"] {
  padding:2px 22px 2px 0;
  margin:-2px 0;
  background-repeat: no-repeat;
  background-position: right center;
}

/* External links */
a[href^="mailto:"] { background-image: url(http://www.ccb.ac.uk/public/images/icons/email.png); }
.no-mail-image { background-image: none !important; }

/* Files */
a[href$=".pdf"] { background-image: url(http://www.ccb.ac.uk/public/images/icons/pdf.png); }  
a[href$=".doc"] { background-image: url(http://www.ccb.ac.uk/public/images/icons/doc.png); }

/* MAIN PAGE TABLES */

caption {		
	font-family: Georgia, "Times New Roman", Times, serif;
	color: #003399;
	font-size:1.1em;
	font-weight:normal;
	margin:12px 0 0px 0;
	padding:0 0 10px 0;
	text-align:left
}
.tableStyle {
	width: 100%;
	margin: 1em 0 1em 0;
	border: solid #666;
	border-width: 1px 0 0 1px;
	border-collapse: collapse;
}
.tableStyle th, .tableStyle td {	border: solid 1px #666;	border-width: 0 1px 1px 0;	padding: 0.6em; text-align:left; font-size: 0.875em}
.blueScheme, .blueScheme th, .blueScheme td {	border-color: #069;}
.blueScheme .even {	background-color: #E3F6FE;}
.blueScheme th, .blueScheme thead td {	background-color: #69F;}
.blueScheme th.firstColumn {	background-color: #9CF;}