/*
	Filename         : 	home.css
	Created by       : 	Owain Llewellyn
	Created          : 	11/01/2011
	Last Updated     : 	11/01/2011
	Comments         : 	Styling for University Worcester
*/

/*  General class definitions for global use - delete if not using any of these
************************************************************************************************************************/

.show {
	display:block;
}
.hide {
	display:none;
}
.clear {
	clear: both !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
	font-size: 1px !important;
	height: 1px !important;
	width: 1px !important;
	float: none !important;
}	


/*  General formatting definitions
************************************************************************************************************************/

html, body, input {
	font-family:Arial, Helvetica, sans-serif;
}


body {
/* Uncomment to add :hover states for tags other than anchors in IE6 - relative to html file
	behavior:url("/js/csshover3.htc");*/
	/*background:#DCD9D0;*/
	background:#FFF;
	background-image: url(../images/background.jpg);
	background-repeat: repeat-x;
	background-attachment: fixed;
} 

strong {
	font-weight:bold;
}

p {
	font-size:1.2em;
	line-height:1.55em;
	color:#333;
}

a {
	text-decoration:none;
	color:#006DAC;
	font-weight:bold;
}


	a:hover {
		text-decoration:underline;
	}


hr {

}

/* Header formatting 
************************************************************************************************************************/

#logo {
	float:left;
	margin-top:24px;
	
}
	/* Span text for accessibility */
	#logo span {
		display:block;
		position:absolute;
		text-indent:-99999px;
	}
	
	legend {
		display:none;
	}
	#searchForm label {
		display:block;
		position:absolute;
		width:0;
		height:0;
		visibility:hidden;
	}
	

/*  Layout of body and main div's
************************************************************************************************************************/

body {
	font-size:62.5%;
}

div#wrapper {
	width:1024px; /* CHANGE ME TO PAGE WIDTH YOU REQUIRE! */
	margin:0 auto;
	overflow:hidden;
	background:#FFF;
	padding-top:0;
	position:relative;
	
}

div#header {
	background:#FFF;
	border-bottom:1px solid #BAB2B5;
	height:106px;
		
}

	div#headerInner{
		width:974px;
		margin:0 auto;
		position:relative;
		z-index:6;
		
	}

div#naviBar {

	float:right;
	clear:right;
	margin:34px 0 0 0;
	width:auto;
	
}

div#main {

	padding:20px 20px 20px 20px;
	background:#FFF;
	overflow:hidden;
	* padding-top:0px;
	
}	

	
/* Layout styles - home page specific
************************************************************************************************************************/

	div.colNarrow{
	
		float:left;
		width:210px;
		margin-right:30px;
	}
	
	div.colFull {
		margin-top:22px;
		width:980px;
		overflow:hidden;
		height:1%;
	}
	
	div.colWideLeft{
		padding:14px;
		width:459px;
		float:left;
		overflow:hidden;
		height:1%;	
		border-right:1px solid #CCC;
		
	}
	
	
	
	div.colWideRight{
		padding:14px;
		width:460px;
		float:right;
		border-right:1px solid #CCC;
	}
	
	div.colFull div.colWideRight {
	
		border:0;
	}
/* Layout styles - Landing and content specific
************************************************************************************************************************/


	div#leftColNarrow{
		float:left;
		width:186px;
		margin-right:25px;
			
	}
	
	*html div#leftColNarrow{
	
		margin-right:25px;
	}
	
	div#middleCol {
	
		width:557px;
		float:left;
		overflow:hidden;
		height:1%;
	}
	
	div#rightColNarrow{
		float:right;
		width:186px;
		position:relative;
		
	}
		
	div#rightColWide{
		position:relative;
		float:left;
		width:773px;
		overflow:hidden;
	}
	div#leftColWide{
		float:left;
		width:768px;
		overflow:hidden;
		margin-right:25px;	
	}
	
	
	div#wideInnerLeftCol{
	
		float:left;
		width:369px;
		overflow:hidden;
	}	
	
	div#wideInnerRightCol{
		float:right;
		width:369px;
		overflow:hidden;
	}	

		
		
	
	div.last {
		margin-right:0!important;
	}


	div#content {
			overflow:hidden;
			/* IE6 fix*/
			*html margin-top:25px;
			position:relative;
			
	}	

/* Footer styles
************************************************************************************************************************/

div#footer {

	width:984px;
	clear:both;
}

	/*div#wrapper li.last-item,*/ div#wrapper li.first-item {
		padding-top:15px;
		border:0!important;
	}

	div#footerMain{
	
		background:#222;
		padding:27px 0 21px 25px;
		overflow:hidden;
		margin-top:24px;
		height:1%;
	}
	
		div#footerMain h2{
			color:#FFF;
			font-family: Arial,Helvetica,sans-serif; font-size-adjust:0.48; font-weight:bold; font-style:normal;
			margin-top:0;
			font-size:18px;
		}
		
		div#footerMain a{
			color:#FFF;
			font-weight:normal;
		}
		
		div#footerMain ul {
			
			margin-top:27px;
		}
		
			div#footerMain ul li {
				padding:8px 0 12px 0;
				font-size:1.2em;
				border-top:1px dotted #FFF;
				float:left;
				width:218px;
				margin-right:20px;
			}
								
				div#footerMain ul li:last-child {
					border-bottom:0;
					padding-bottom:0;
				
				}
	
	div#footerSecondary{
	
		margin-top:25px;
		padding-top:25px;
		border-top:1px solid #BAB2B5;
		overflow:hidden;
	}
	
	div#footerSecondary div a {
	
		float:left;
		width:auto;
		margin-right:10px;
	}
	
		div#footerSecondary ul{
		
			
			float:left;
			width:auto;
			
		}
	
			div#footerSecondary ul li {
			
				float:left;
				display:inline;
				margin-right:30px;
				font-size:1.2em;
			}
				div#footerSecondary ul li a {
			
					color:#3F3F3F;
					font-weight:normal;
			}
			
		
		div#footerSecondary .footerCopyright{
		
			float:left;
			clear:left;
			font-size:1.1em;
			color:#A3A3A3;
			margin-top:27px;
		}
		
		*+html div#footerSecondary .footerCopyright{
		    margin-top:4px;
		}
			div#footerSecondary .footerCopyright a{
				font-weight:normal;
				color:#A3A3A3;
				
				
			}
			
		div#footerSecondary .designSig{
		
			
			float:right;
			width:auto;
			
			
		}
			div#footerSecondary .designSig a{
				font-weight:normal;
				color:#A3a3a3;
				font-size:1.1em;
			
			}
			
			
/* Content formatting 
************************************************************************************************************************/

ul {
	color:#333;
}



ol {
	list-style:decimal;
	margin-left:20px;
	color:#333;
}

blockquote {
}

div#main div#content .topHeader{
	margin-top:0;
	padding-top:0;
}


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

.noBorder{

	border:0px!important;
}

a.blockLink{
	background:#008083;
	padding:9px 12px;
	color:#fff;
	font-size:1.4em;
	margin-top:24px;
	display:inline-block;

}

div.thickBorder{
	clear:both;
	width:980px;
	height:8px;
	background-color:#222;
}

.floatLeft{

	float:left;
}


/*This is for the template list page and CAN be REMOVED once go live */
ol.templateIndexList{

	padding:20px;
}

	ol.templateIndexList li {
	
		font-size:1.2em;
		line-height:1.55em;
	}
	
	
/* Horizontal tabbed area - powered using jquery
***********************************************************************************************************************/

	
div#leftColWide div#horizontalTabSection {

	margin-top:30px;
}
	div#horizontalTabSection ul#tabs{
		border-bottom:5px solid #227F84;
		overflow:hidden;
		margin:0;
		height:1%;
	}
	
		div#horizontalTabSection ul#tabs li {
			float:left;
			display:inline;
			padding:12px 15px 20px 15px;
			height:11px;
			background:#0E4144;
			margin-right:2px;
		
		}
		
		*html div#horizontalTabSection ul#tabs li {
			padding-bottom:10px;
		}
		
		div#horizontalTabSection ul#tabs li {
			margin-top:9px;
		}
		
			div#horizontalTabSection ul#tabs li.currentTab {
				background:#227F84;	
			}
			
				div#horizontalTabSection ul#tabs li a{
					color:#FFF;
					font-size:12px;
					line-height:1.55em;
					text-decoration:none;
					
				}
				
					div#horizontalTabSection .panel{
						padding:24px;
						border-left:1px solid #D6CCD0;
						border-right:1px solid #D6CCD0;
						border-bottom:1px solid #D6CCD0;
						visibility:hidden;
						display:none;
						height:1%;
						overflow:hidden;
					}
					
					div#horizontalTabSection .currentP{
						
							visibility:visible;
							display:block;
					}
					
					div#horizontalTabSection .panel .panelFeaturedSection{
					
						overflow:hidden;
						border-bottom:1px solid #D6CCD0;
						* height:1%;
						* float:left;
						*padding-bottom:20px;
						
					}
					
						div#horizontalTabSection .panel .panelFeaturedSection img {
						
							float:left;
							margin-right:21px;
							margin-bottom:21px;
						}
						
							div#horizontalTabSection .panel .panelFeaturedContent{
							
								float:left;
								width:510px;
							}
							
								div#horizontalTabSection .panel .panelFeaturedContent h3{
								
									font-size:1.6em;
									color:#333;
								}
								
									div#horizontalTabSection .panel .panelFeaturedContent p.summary{
									
											font-size:1.4em;
											color:#333333;
											line-height:21px;
											margin-top:7px;
									}
										div#horizontalTabSection .panel .panelFeaturedContent p{
											line-height:1.55em;
											margin-top:15px;
											font-size:1.2em;
										}
										
										div#horizontalTabSection .panel ul{
										    list-style-type: disc;
											margin: 25px 0 0 40px;
										
										}
										.panelTwoCol{
											width: 100%;
											float:left;
											margin-top:25px;
											background-image: url(../images/bg_panelTwoCol.gif);
											background-repeat: repeat-y;
											background-position: center top;

										}
										
										.panel .panelLeftCol, .panel .panelRightCol{
										
											/*margin-top:25px;*/
											width:47%;
										} 
										
										.panel .panelLeftCol div, .panel .panelRightCol div {
										
											margin-top:16px;
										}
										
										.panel .panelLeftCol div h3 + p, .panel .panelRightCol div h3 +p{
											margin-top:7px;
										}
										
										.panel .panelLeftCol div p , .panel .panelRightCol div p {
											line-height:1.55em;
											margin-top:22px;
										}
										
											.panel .panelLeftCol div img , .panel .panelRightCol div img{
												float:left;
												margin-right:16px;
												margin-bottom:10px;
											}
											
											.panel .panelLeftCol h3, .panel .panelRightCol h3{
												margin-top:0;
												font-size:1.6em;
												color:#333;
											}
											
											
											.panel .panelLeftCol div h3, .panel .panelRightCol div h3{
											
												margin-top:25px;
											}
											
											
												div#middleCol .panel .panelLeftCol ul, div#middleCol .panel .panelRightCol ul {
												
													margin-top:15px;	
													list-style:none;
													margin:15px 0 0 0;										
												}
											
													.panel .panelLeftCol ul li , .panel .panelRightCol ul li{
														font-size:1.2em;
														margin-top:8px;
													}
													
														.panel .panelLeftCol ul li a , .panel .panelRightCol ul li a{
															/*font-size:1em;*/
														}
										
										 .panel .panelLeftCol {
											float:left;
											padding-right:25px;
											/*border-right:1px solid #D6CCD0;*/
										}
										
										 .panel .panelRightCol{
											float:right;
											/*width:44%;*/
										 }
										 
										 .panel .topHeader{
										 
										 	margin-top:0;
											padding-top:0;
										 }
										 
#leftColWide div#horizontalTabSection .panel .panelFeaturedSection {
	width: 100%;
}

#leftColWide div#horizontalTabSection .panel .panelFeaturedContent {
	width: 100%;
	float: none;
	padding-bottom: 1em;
	display: block;
}
#rightColWide div#horizontalTabSection .panel .panelFeaturedContent {
	width: 100%;
	float: none;
	padding-bottom: 1em;
	display: block;
}

#leftColWide div#featuredArea {
	margin-top:26px;
}
#leftColWide div#featuredAreaContent p {
	margin-bottom: 1em;
	line-height:1.3em;
}
#leftColWide div#featuredAreaContent p.summary {
	color:#000;
	font-family:"Clarendon FS Bold", Georgia, 'Times New Roman', Times, serif; font-size-adjust:0.48; font-weight:bold; font-style:normal;
	font-size:1.8em;
}
#leftColWide div#featuredAreaContent a {
	color:#000;
}



										 
.panel .panelLeftCol div#events ul#eventsList li{
	border-top:1px dotted #999;
	margin-top:12px;
}

.panel .panelLeftCol div#events ul#eventsList li:first-child{
	border:0;
	margin-top:0;
}

.panel .panelLeftCol div#events ul#eventsList li:last-child{
	border-bottom:1px dotted #999;
	padding-bottom:12px;
	
}

.panel .panelLeftCol div#events ul#eventsList li span {

	display:block;
}

			.panel .panelLeftCol div#events ul#eventsList li span.eventTitle{
				margin-top:12px;
			}
			
			div#horizontalTabSection .panel .panelLeftCol div#events ul#eventsList li span.eventDate{
				margin-top:8px;
			}
			
						
				div#horizontalTabSection .panelFooter{
					float:left;
					clear:both;
					height:48px;
					width:764px;
					background:url(../images/bg_tab_section_bottom.png) top center no-repeat;
					margin-top:0px;					
					
				}
			
				div#middleCol div#horizontalTabSection .panelFooter {
					float:left;
					width:557px;
					height:30px;
				}


div#middleCol div#viewsSection{
	float:left;
	overflow:hidden;
	width:100%;
}


	
	
	div#middleCol div#viewsSection div{
		margin-top:0px;
	}
	
	*html div#middleCol div#viewsSection div{
		margin-top:10px;
	}
	
	*+html div#middleCol div#viewsSection div{
		margin-top:12px;
	}
	
		
		div#middleCol div#viewsSection h2{
			font-family:"Clarendon FS Bold", Georgia, 'Times New Roman', Times, serif; font-size-adjust:0.48; font-weight:bold; font-style:normal;
			border-bottom:8px solid #227F84; 
			padding-bottom:12px;
			margin-top:0;
		}
	
		div#middleCol div#viewsSection h3{
		
			margin-top:7px
	
		}
		
		div#middleCol div#viewsSection p{
			margin-top:10px;
		}

div.scrollingImagesSection {
	position:relative;
	overflow:hidden;
	clear:both;
	margin-top:30px;
	float:left;
	width:100%;
	
}
	div#middleCol div.scrollingImagesSection h2{
	
		font-size:1.6em;
	}

	div.scrollingImagesSection a.left{
		position:absolute;
		display:block;
		top:0;
		left:0;
		background:url(../content_images/img_jquey_prev.gif) 0 0 no-repeat;
		width:30px;
		height:119px;
		z-index:2;
	}
	
	div.scrollingImagesSection a.right{
		position:absolute;
		top:0;
		z-index:2;
		right:0;
		display:block;
		background:url(../content_images/img_jquery_next.gif) 0 0 no-repeat;
		width:30px;
		height:119px;
	}
	
div.scrollingImagesSection div {

	margin-top:4px;
}

div.scrollingImagesSection h2 {
	margin:0;
}

div#middleCol div.scrollingImagesSection p {
	margin-top:9px;
}



/* Social media icon area styles
************************************************************************************************************************/

div#social {
	float:right;
	clear:both;
	width:187px;
	margin-top:26px;
	height:1%;
}
	div#social span {
		line-height:16px;	
		float:left;
		color:#333;
		font-size:1.2em;
		margin-right:0px;
		margin-top:0px;
	}
	
*html .stButton{
	position:static!important;
}

	div#social ul {
	
		float:right;
	}
	
		div#social ul li {
		
			float:left;
			margin-right:7px;
		}
		
			div#social ul li:last-child {
				margin:0;
			}
			div#social span.st_sharethis span.sharethis{
       
				padding:0px 16px 0 0;
				width:1px!important;
				height:20px;
				background:url(../images/icon_share_this.gif) 0 0 no-repeat;
			}
			
/* Image block - Styles for right hand column promo image box
************************************************************************************************************************/
	
div.campusPromoCol{
	margin-top:25px;
}

*html div.campusPromoCol{
}

	div.campusPromoCol .topMargin{
	
		margin-top:29px;
	}
	
	div.campusPromoCol div.promoOverlay{
		position:absolute;
		left:0;
		top:9px;
		padding:4px 8px 6px 8px;
		background:#FFF;
		
	}	
		div.campusPromoCol div.promoOverlay h4{
			margin:0;
			padding:0;
			font-family: Arial,Helvetica,sans-serif;
			font-size-adjust:0.48; font-weight:bold; font-style:normal;
			font-size:1.6em;
			line-height:17px;
			color:#333;
		}
		
			div.promoOverlay h4 a{
				color:#333!important;
				text-decoration:none!important;
			}
	
/* list box - Styles for right hand column list box
************************************************************************************************************************/	
		
.listBox {
	margin-top:12px;
	padding:17px 9px 8px 9px;
	border-left:1px solid #D6CCD0;
	border-right:1px solid #D6CCD0;
	border-bottom:1px solid #D6CCD0;
	background:url(../images/bg_listBox_teal.gif) 0 0 no-repeat;
}

	
	.listBox p {
		
		margin-top:5px;
		line-height:1.55em;
	}

div#skipContent{

	display:none;
	visibility:hidden;
}


div#main div#content div#rightColNarrow h2.topHeader{
	
		margin-top:68px;
	}


/* "Call to action - Apply now" button style and social media link styles
***********************************************************************************************************************/


div#pageOptionsArea {

	overflow:hidden;
	clear:both;
	margin-top:24px;
	float:left;
	/*width:100%;*/
	width:984px;
}

	div#pageOptionsArea div#social {
		clear:right;
	}
	
a.applyButton {

	width:auto;
	display:block;
	float:left;
	font-size:1.8em;
	color:#fff;
	background:#006EAD;
	font-weight:bold;
	padding:10px 17px;
	
}

div.dropDownContent h2 a{

	color:#FFF;

}

/* Extra styles to be added in after update
***********************************************************************************************************************/

/* --- Sitemap Styler --- */

#sitemap, #sitemap ul, #sitemap li{
	margin:0;
	padding:0;
	list-style:none;
}
#sitemap a {
	font-weight: normal;
}
#sitemap{
	background:url(../images/line1.gif) repeat-y;
	font-size: 1.4em;
	margin: 30px;
}
#sitemap li{
	line-height:25px;
	margin-top:1px;
	position:relative;
	width:100%;
}
/* IE leaves a blank space where span is added so this is to avoid that */
* html #sitemap li{
	float:left;
	display:inline;
}

#sitemap li a{padding-left:28px;}
#sitemap li span{float:left;position:absolute;top:5px;left:5px;width:13px;height:13px;cursor:auto;font-size:0;}
#sitemap li span, #sitemap li span.collapsed{background:url(../images/collapsed.gif) no-repeat 0 0;} 
#sitemap li span.expanded{background:url(../images/expanded.gif) no-repeat 0 0;}

/* sub levels */

#sitemap li ul{	
	margin-left:28px;
	background:url(../images/line1.gif) repeat-y;
}
#sitemap li li{	
	background:url(../images/line2.gif) no-repeat 0 0;
}

/* etc. */

/* float fix */

#sitemap:after, #sitemap ul:after{
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}
#sitemap, #sitemap ul{display:block;}
/*  \*/
#sitemap, #sitemap ul{min-height:1%;}
* html #sitemap, * html #sitemap ul{height:1%;}
 /*  */
#sitemap ul{display:none;}

/* --- A to Z styles --- */

#aToZlinks a, #aToZlinks span {
    text-transform: uppercase;
    text-align: center;
    font-weight: bold;
    color: #fff;
    text-decoration: none;
    display: block;
	float: left;
    font-size: 0.8em;
    padding: 1px 0;
    width: 1.7em;
    margin: 1px;
    background-color: #0E4144;
    border: solid 1px #565F2F;    
}
#aToZlinks span {
    background-color: #eee;
    color: #ccc;
}
#aToZlinks a:hover {
    background-color: #565F2F;
    color: #fff;
}
#aToZ h2 {
    padding-top: 10px;
	clear: left;
}

/* --- Search results in middle column --- */

div#middleCol div#searchResultsList {
	padding: 20px;
}
div#middleCol div#searchResultsList ul {
	list-style-type: none;
	font-size: 1em;
	margin: 0;
}
div#middleCol div#searchResultsList ul li {
	margin-top: 5px;
	padding-bottom: 10px;
}
div#middleCol div#searchResultsList ul li p {
	margin-top: 5px;
}
div#middleCol div#searchResultsList ul {
	margin: 0;
}
/* --- Search results in right wide column --- */

div#rightColWide div#searchResultsList {
	padding: 20px;
}
div#rightColWide div#searchResultsList ul {
	list-style-type: none;
	font-size: 1em;
	margin: 0;
}
div#rightColWide div#searchResultsList ul li {
	margin-top: 5px;
	padding-bottom: 10px;
}
div#rightColWide div#searchResultsList ul li p {
	margin-top: 5px;
}
div#rightColWide div#searchResultsList ul {
	margin: 0;
}
/* --- PDF Download icon --- */
a.pdfDownload {
	background: transparent url(../images/pdf_download_icon.jpg) no-repeat left top;
	display: block;
	float: right;
	color: #666;
	font-size: 1.2em;
	padding: 5px 5px 20px 50px;
}

/* --- Last Updated --- */
#lastUpdated {
	color:#A3A3A3;
	float:right;
	font-size:1.1em;
}
.gray {
	display:none;
}
.applyNowText{
	display:block;
	float:left;
	margin-left:5px;
	color:#666666;
	padding-top:12px;
}
.boxcaption a, .boxcaption a:visited {
    color: #FFFFFF;
    font-weight: normal;
    text-decoration: none;
}
/*Auto Complete*/
.ac_results {
    padding: 0px;
    border: 1px solid black;
    background-color: white;
    overflow: hidden;
    z-index: 99999;
}
.ac_results ul {
    width: 100%;
    list-style-position: outside;
    list-style: none;
    padding: 0;
    margin: 0;
}
.ac_results li {
    margin: 0px;
    padding: 2px 5px;
    cursor: default;
    display: block;
    /* 
    if width will be 100% horizontal scrollbar will apear 
    when scroll mode will be used
    */
    /*width: 100%;*/
    font: menu;
    font-size: 12px;
    /* 
    it is very important, if line-height not setted or setted 
    in relative units scroll will be broken in firefox
    */
    line-height: 16px;
    overflow: hidden;
}
.ac_loading {
    background-color: #FFF;
}
.ac_odd {
    background-color: #eee;
}
.ac_over {
    background-color: #0A246A;
    color: white;
}
/*End Auto Complete*/