/*** stylesheet from the new grad rec website  ***/
/*** copied on 12/Oct/2009 to get same look and feel ***/
/*** then modified to get it working with existing app form css ***/
/**********************
	general styles 
***********************/
.clear {clear:both;}

body{
	font-family:Arial, Helvetica, sans-serif;
	color:#6f6f6f;
	text-align:center;
	margin:0 auto;
	font-size:75%;
background:#e2e2e2 url(../images/home-main-bg2.gif) top left repeat-x;
	}

img{
	border:0;
	}

a{
	text-decoration:none;
	}
	
#main-wrapper{
	
	/*width:1280px;*/
	margin:0 auto;
	/*background:#e2e2e2;*/
	}

#body-wrapper{
	width:960px;
	margin:0 auto;
	padding-top:15px;
	text-align:left;
	}

img#logo{
	float:left;
	margin-left:40px;
	}
	
a#logoanchor
{
		/*float:left;*/
}

ul#head-nav{
	float:right;
	/*width:345px;*/
	}

ul#head-nav li{
	float:left;
	border-right:1px solid #000;
	}

ul#head-nav li.last{
	border:none;
	}

ul#head-nav li a{
	color:#e1e1e1;
	display:block;
	text-decoration:underline!important;
	padding:0 10px;
	}

ul#head-nav li.last a{
	padding-right:0;
	}

#main-top-nav{
	clear:both;
	text-align:center;
	display:block;
	padding-top:24px;
	}

#main-top-nav ul{
	vertical-align:middle;
	width:960px;
	height:46px;
	float:left;
	display:block;
	}

#main-top-nav ul li{
	float:left;
	/*height:46px;*/
	}

#main-top-nav ul li a{
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	display:block;
	width:120px;
	background-color:#333;/*accecibility*/
	float:left;
	color:#e1e1e1;
	line-height:13px;
	height:46px;
	}

#main-top-nav ul li.home{
	border-top:5px solid #670907;
	
	}

#main-top-nav ul li.home a{
	padding:5px 0 0px 0; /* not 14 14 */
	background:url(../images/nav-home-bg.jpg) top left repeat-x;	
	
	}

#main-top-nav ul li.about{
	border-top:5px solid #00608e;
	}
	
#main-top-nav ul li.about a{
	padding:5px 0 0px 0;/* not 14 14 */
	background:url(../images/nav-about-bg.jpg) top left repeat-x;	
	}

#main-top-nav ul li.programme{
	border-top:5px solid #b80b19;
	}
	
#main-top-nav ul li.programme a{
	padding:5px 0 0px 0; /* not 6 10 */
	background:url(../images/nav-programme-bg.jpg) top left repeat-x;
	}

#main-top-nav ul li.after-programme{
	border-top:5px solid #d6880a;
	}

#main-top-nav ul li.after-programme a{
	padding:5px 0 0 0; /* not 6 10 */
	background:url(../images/nav-after-prog-bg.jpg) top left repeat-x;
	/* fix height so box works with any text */
	/*height: 41px;*/
	}
	
#main-top-nav ul li.our-people{
	border-top:5px solid #79747b;
	}

#main-top-nav ul li.our-people a{
	padding:14px 0 14px 0;
	background:url(../images/nav-people-bg.jpg) top left repeat-x;
	}

#main-top-nav ul li.locations{
	border-top:5px solid #258d5a;
	}

#main-top-nav ul li.locations a{
	padding:14px 0 14px 0;
	background:url(../images/nav-locations-bg.jpg) top left repeat-x;
	}

#main-top-nav ul li.recruitment{
	border-top:5px solid #8f5892;
	}

#main-top-nav ul li.recruitment a{
	background:url(../images/nav-recruitment-bg.jpg) top left repeat-x;
	padding:6px 0 10px 0;
	/* fix height so box works with any text */
	/*height: 41px;*/
	}
	
#main-top-nav ul li.events{
	border-top:5px solid #5d81bd;
	}

#main-top-nav ul li.events a{
	background:url(../images/nav-events-bg.jpg) top left repeat-x;
padding:14px 0 14px 0;
	}
		
#main-top-nav ul li a:hover, #main-top-nav ul li a.active{/*Apply to all navigation tabs*/
	background:url(../images/nav-over-bg.jpg) top left repeat-x;
	color:#333;
	}

#footer{
	clear:both;
	background:#2e2e2e;
	height:30px;
	text-align:center;
	color:#e1e1e1;
	padding-top:20px;
	}

#footer div{
	width:900px;
	text-align:left;
	margin:0 auto;
	}

#footer ul li{
	display:inline;
	padding:0 5px 0 5px;
	}

#footer ul li a{
	color:#e1e1e1;
	text-decoration:underline;
	padding:0 10px 0 0px;
	/*border-right:1px solid #e1e1e1;*/
	}

/*
#footer ul.fr{
	width:490px;
	}


#footer ul li a.last{
	border:none;
	}
*/


#bottom-content{
	background:white url(../images/content-bottom-bar.jpg) left bottom no-repeat;
	padding-bottom:50px;
}

#top-image{/*used for all top main images*/
	clear:both;
	width:960px;
	height:229px;
	display:block;
	float:left;
	margin-top:-1px;
	}

#top-image h1{/*, #top-image h2, #top-image h3, #top-image p{
	position:absolute;
	top:-9999px;
	height:1px;
	width:1px; */
	position:relative;
	top:175px;
	left:50px;
	width:850px;
	color:#FFFFFF;
	}
	
	
#top-image h1{
	font-family:Arial, Helvetica, sans-serif;
	font-size:300%;
	font-weight:normal;
	padding-bottom:10px;	
	}	

#top-image h2{
	font-size:160%;
	padding:0px 0 15px 50px;
	font-weight:normal;
	}
	
#top-image p{
	padding-left:50px;
	}
	
#left-nav{
	float:left;
	display:block;
	width:175px;
	padding-top:25px;
	padding-bottom:15px;
	}

#left-nav ul{
	margin-left:10px;
	}

#left-nav ul li{
	padding:0;
	margin:0 0 5px 0;
	}


	
#left-nav ul li a{
	padding:8px 0px 8px 5px;
	display:block;
	}


#left-nav ul li ul li{ /* sub nav*/
	margin:5px 0 0 0px;
	}	
	
#left-nav ul li a.active, #left-nav ul li a.active:hover{
	background:#e2e2e2;
	}

#left-nav ul li a:hover{
	background:#FFFFFF;
	}

#mid-col, #our-people-wide {
	display:block;
	float:left;
	width:500px;
	height:auto;
	margin:35px 35px 0 35px;
	}

#our-people-wide {
	width:720px;/*overwrite above*/
	margin-right:0;
	}

#mid-col-wide {
display:block;
float:left;
width:710px;
height:auto;
margin:35px 0 0 35px;
}

#wide-left{
	width:710px;
	float:left;
	padding:35px 35px 0 0;
	}


#mid-col a, #wide-left a, #mid-col-wide a {
	color:#f26522;
	text-decoration:underline;
	}

.locations table{
	width:500px;
	}

.locations table th{
	background:#197b2e;
	color:#FFFFFF;
	text-align:left;
	border:1px solid #666666;
	}	
	
#mid-col h2, .our-people-wide h2, #wide-left h2, #mid-col-wide h2 {
	color:#252525;
	padding-bottom:10px;
	font-size:200%;
	font-family:Arial, Helvetica, sans-serif;
	font-weight:normal;
	clear:both;
	display:block;
	}

#mid-col h3, .our-people-wide h3, #wide-left h3, #mid-col-wide h3 {
	clear:both;
	padding:15px 0 20px 0;
	margin:0;
	display:block;
	font-family:Arial, Helvetica, sans-serif;
	font-size:170%;
	font-weight:normal;
	}

#mid-col h4, .our-people-wide h4, #wide-left h4, #mid-col-wide h4 {
	color:#111111;
	padding:0 0 10px 15px;
	font-family:Arial, Helvetica, sans-serif;
	font-size:135%;
	clear:left;
	}
	
#mid-col h5, #wide-left h5, #mid-col-wide h5 {
	color:#252525;
	font-family:Arial, Helvetica, sans-serif;
	font-size:115%;
	padding-bottom:20px;	
	}	
	
#mid-col p, #wide-left p, #mid-col-wide p {
	line-height:17px;
	margin-bottom:10px;
	color:#555555;
	}
	
#mid-col img, #wide-left img{
	float:left;
	margin:5px 15px 15px 0;
	}
#right-text {
width:300px;
float:left;
}

sup {
	font-size:.7em;
	font-weight:bold;
	color:#990000;
	}


#right-col{
	float:left;
	display:block;
	width:215px;
	margin-top:35px;
	}

#right-col h4{
	font-size:115%;
	display:block;
	background:#fff;
	padding:10px;
	margin-bottom:10px;
	}

#right-col p{
	padding:0 10px 20px 10px;
	color:#555555;
	line-height:17px;
	}

#right-col img{
	width:195px;
	margin:0 0 10px 10px;
	}

#right-col a.more{
	color:#F26522;
	padding-top:7px!important;
	padding-bottom:30px;
	margin:0 0 10px 10px!important;
	}

/*	
table{
	margin:15px 0;
	width:650px;
	background:#FFFFFF;
	border-left:1px solid #666;
	border-right:1px solid #666;
	border-bottom:1px solid #666;
	}

td{
	border-bottom:1px solid #666;
	border-right:1px solid #666;
	padding:2px 2px 2px 5px;
	}	

th{
	padding:5px 2px 5px 5px;
	}

*/	




#wide-left h4{
	background:url(../images/h4-red-bg.jpg) 0px 1px no-repeat;
	}


#menu{
	margin-bottom:20px;
	color:#555555;
	}
	
#menu li h3{
	padding:5px 0 5px 10px;
	margin:0 0 5px 0;
	display:block;
	background:url(../images/h3-faqs-bg.gif) top left no-repeat;
	}


#wide-left #menu li ol{

	margin-left:20px;
	padding-left:10px;
	}	
	
#menu li ol li{
	margin:0px;
	list-style:decimal;
	}
	

#menu li h3 a{
	text-decoration:none;
	padding-left:12px;
	display:block;
	color:#111111;
	font-size:90%;	
	background:url(../images/h4-red-bg.jpg) center left no-repeat;
	}

/********************
	common classes
*********************/

.long-bg{
	background:#e2e2e2 url(../images/home-main-bg.gif) top left repeat-x;
	}

/*.short-bg{
	background:#e2e2e2 url(../images/short-bg.jpg) top left repeat-x;
	}
*/
a.more{
	background:url(../images/orange-arrow.gif) 0px 3px no-repeat!important;
	padding:6px 0 10px 20px!important;
	display:block;
	border:0!important;
	text-decoration:none;
	}

.clr{
	clear:both;
	display:block;
	}	
	
.fl{
	float:left;
	}	

.fr{
	float:right;
	}


.no-bg{
	background:none!important;
	}

.missing-img{	/*this is to indicate the missing images. Delete when all the correct images are in place*/
	border:1px solid red;
}
	
#footer ul li a.faceboock_fan{
	border:1px solid #fff;
	padding:0px 20px 0px 2px;
	width:80px;
	position:relative;
	top:-2px;
	text-decoration:none!important;
	background:url(../images/facebook_btn.gif) top right no-repeat;
	}

#footer ul li a.faceboock_fan:hover{
	background:#4565a1 url(../images/facebook_btn.gif) top right no-repeat;
	border:1px solid #4565a1;
	color:#FFFFFF;
	}


#mid-col ul.no-style, #wide-left ul.no-style{
	background:none!important;
	border:none!important;
	padding:0;
	margin:0px 0 10px 0;
	clear:both;
	}

#mid-col ul.no-style li, #wide-left ul.no-style li{
	background:none;
	border:0;
	padding:0 0 10px 20px;
	line-height:17px;
	display:block;
	}
	
#mid-col ul.no-style li h5, #wide-left ul.no-style li h5{
	padding:0;
	margin:0;	
	}

#mid-col ul.blue li, #wide-left ul.blue li{
	background:url(../images/blue-arrow.gif) 0px 4px no-repeat ;	
	}
	
	
#mid-col ul.green li, #wide-left ul.green li{
	background:url(../images/green-arrow.gif) 0px 4px no-repeat ;	
	}
	
#mid-col ul.purple li, #wide-left ul.purple li{
	background:url(../images/purple-arrow.gif) 0px 4px no-repeat ;	
	}	
	
blockquote{
	display:block;
	font-style:italic;
	line-height:normal;
	margin-bottom:5px;
	}
	
cite{
	display:block;
	font-weight:bold;
	color: #666666;
	font-style:normal;
	margin-bottom:25px;
	}


	
/****************
	Float hack
*****************/
.clearfix:after {
	content: ".";
	display: block;
	clear: both;
	visibility: hidden;
	line-height: 0;
	height: 0;
}
 
.clearfix {
	display: inline-block;
}
 
html[xmlns] .clearfix {
	display: block;
}
 
* html .clearfix {
	height: 1%;
}