/*
===================================================================================
=== IMPORT EXTRENAL STYLE SHEETS ==================================================
===================================================================================
*/
@import url(../css/undohtml.css);
@import url(../css/nav.css);

/*
===================================================================================
=== GENERAL SITE STYLES ===========================================================
===================================================================================
*/
body{
	font:				70%/140% Arial, "Lucida Sans", sans-serif;
	color:				#676767;
	text-align:			center;
	background:			#CCC;
}
#container{
	position:			relative; /* Position to relative in order to allow elements contained within to be positioned absolutely within #container */
	width:				1000px;
	margin:				0 auto;
	text-align:			left;
	background:			#FFF;
}
h1, h2, h3, h4, h5, h6{
	margin:				0 0 1em 0;
	font:				bold 1.3em Arial, sans-serif;
	clear:				both;
}
p{
	margin:				0 0 1em 0;
}
a{
	color:				#055E3E;
	font-weight:		bold;
}
a:hover{
	text-decoration:	underline;
}
.left{
	float:				left;
}
.right{
	float:				right;
}
.noborder{
	border:				none!important;
}
.txtLeft{
	text-align:			left;
}
.txtRight{
	text-align:			right;
}
.txtCentre{
	text-align:			center;
}
.txtJustify{
	text-align:			justify;
}
.imgLeft{
	float:				left;
	margin:				0 10px 10px 0;
}
.imgRight{
	float:				right;
	margin:				0 0 10px 10px;
}
.imgCentre{
	display:			block;
	margin:				0 auto;
}
.floatHack{
	clear:				both;
	visibility:			hidden;
	margin:				-1px 0 0 0;
	font-size:			1px;
	line-height:		0;
}

/*
=============
=== FORMS ===
=============
*/
input, select, textarea{
	font:				1em Arial, Helvetica, sans-serif!important;
}
input[type=text], input[type=password], select, textarea, input.text{  /* [CS] */     /* See ie.css */
	width:				170px!important;
	padding:			2px!important;
	border:				1px solid #bacbda!important;
}
select{
	padding:			1px!important;
}
input[type=submit]{  /* [CS] */     /* See ie.css */
	margin:				5px 0 0 0;
	padding:			0 12px;
	color:				#fff;
	border:				1px solid #000!important;
	background:			#37A36B!important;
}

p.submit input{ /* See ie.css + ie7.css */
	margin:				3px 2px 0 0!important;
}
p.submit a{ /* [CS] */ /* Advanced search link */ /* See ie.css */
	margin:				5px 0 0 0;
	font:				normal 0.9em Arial, sans-serif;
	color:				#000;
}
p.submit a:hover{ /* [CS] */ /* Advanced search link hover */ 
	color:				#f06000;
}

/*
===================================================================================
=== HEADER ========================================================================
===================================================================================
*/
#header{
	height:				125px;
	position:			relative;
	background:			url(../images/backgrounds/header.gif) no-repeat;
	border-bottom:		2px solid #000;
}
#header #logo{
	width:				340px;
	position:			absolute;
	top:				20px;
	left:				20px;
}
#header h2{
	width:				250px;
	font-family:		"Times New Roman";
	font-style:			italic;
	font-size:			1.3em;
	color:				#429A71;
	position:			absolute;
	top:				50px;
	right:				36px;
}
#header #tell, #header #fav, #header #boss{
	display:			none;
}

/*
===================================================================================
=== MAIN MENU =====================================================================
===================================================================================
*/
#header #mainMenu{
	width:				100%;
	position:			absolute;
	bottom:				0;
	text-align:			left;
	background:			url(../images/backgrounds/mainMenu.gif) repeat-x bottom;
}
#header #mainMenu ul#topmenu{
	width:				auto;
	height:				auto;
	padding-left:		12px;
	background:			transparent;
}
#header #mainMenu ul#topmenu li{
	height:				35px;
	display:			block;
	float:				left;
	position:			relative;	
	padding:			7px 0 5px 0;
	margin-bottom:		-1px;
}
#header #mainMenu ul#topmenu a{
	padding: 			9px 24px 9px 20px; /* Make sure the left padding is 4px greater than the right padding (if you want the text to be central) */
	color:				#FFF;
	font-weight:		normal;
	display:			block;
	border-right:		1px solid #116F49;
}
#header #mainMenu ul#topmenu a:hover{
	background:			url(../images/backgrounds/mainMenuOver.gif) repeat-x bottom;
}
#breadcrumbs, .breadcrumbs{
	display:			none;
}

/*
====================================================================================
=== CONTENT ========================================================================
====================================================================================
*/
#homeBannerArea{
	height:				222px;
	padding-bottom:		5px;
	background:			#FFF;
}

#content{
	text-align:			left;
	border-top:			1px solid #000;
	border-bottom:		2px solid #FFF;
	background:			#FFF;
}

#content #sitenav{
position:relative;
	width:				auto;
	height:				180px;
	padding:			10px 0;
	background:			#FFF;

}
#content #sitenav div.section{
	width:				190px;
	height:				180px;
	float:				left;
	margin:				0 4px;
	position:			relative;
	background:			url(../images/backgrounds/sitenavMiddle.gif) repeat-y right;
}
#content #sitenav div.section .header{
	height:				40px!important;
	background:			url(../images/backgrounds/sitenavTop.gif) no-repeat top right #FFF;
}
#content #sitenav div.section .header h2{
	padding:			12px 0 0 0;
	margin:				0;
	font-family:		Arial;
	font-size:			1.1em;
	text-align:			center;
	color:				#FFF;
	overflow:			hidden;
}
#content #sitenav div#bankingInvestment.section .header h2{
	padding:			0;
}
#content #sitenav div.section .header h2 a{
	display:			block;
	padding:			5px 0 10px 0;
	color:				#FFF;
}
#content #sitenav div.section:hover .header{
	height:				40px;
	background:			url(../images/backgrounds/sitenavTopOver.gif) no-repeat top right;
}
#content #sitenav div.section p.bottomLink{
	padding:			0;
	position:			absolute;
	bottom:				1px;
	right:				7px;
	background:			transparent;
}
#content #sitenav div.section p.bottomLink a{
	display:			block;
	width:				40px!important;
	height:				40px!important;
}
#content #sitenav div.section p.bottomLink a:hover{
	text-decoration:	none;
}
#content #sitenav div.section .content{
	height:				145px;
	background:			url(../images/backgrounds/sitenavBottom.gif) no-repeat bottom right;
}
#content #sitenav div.section .content .main{
	height:				140px;
	background:			url(../images/backgrounds/sitenavMain.gif) no-repeat 129px 80px;
}
#content #sitenav div.section .content .main p{
	padding:			5px 40px!important;
	line-height:		1.2em;
	background:			transparent!important;
}

#homepage #content #newsInc{
	width:				788px;
	height:				36px;
	margin:				10px 10px;
	background:			url(/images/backgrounds/newsLineMain.gif) no-repeat top right;
}
#homepage #content #newsInc h2{
	width:				96px;
	height:				34px;
	padding:			6px 0 0 4px;
	font-family:		"Times New Roman";
	font-size:			1.6em;
	font-weight:		bold;
	color:				#10513B;
	float:				left;
	background:			url(/images/backgrounds/newsLineHeader.gif) no-repeat top left;
}
#homepage #content #newsInc dl{
	background:			url(/images/backgrounds/newsLineMain.gif);
}
#homepage #content #newsInc dt,
#homepage #content #newsInc dd{
	padding:			10px 0 0 10px;
	float:				left;
}
#homepage #content #newsInc dd,
#homepage #content #newsInc dt a{
	color:				#055E3E;
	font-weight:		normal;
	text-decoration:	underline;
}
#homepage #viewAll{
	width:				165px;
	height:				25px;
	position:			absolute;
	top:				565px;
	right:				20px;
	text-align:			center;
	border:				1px solid #000;
	background:			url(../images/backgrounds/viewAll.gif) repeat-x;
}
#homepage #viewAll a{
	color:				#FFF;
	font-weight:		bold;
	text-decoration:	underline;
	position:			relative;
	top:				3px;
}

#homepage #content p{
	margin-bottom:		0px;
	padding:			0 20px 10px 20px;
	background:			#EFEEEE;
}
#content h1,
#JBcontent h1{
	font-family:		"Times New Roman";
	font-size:			1.6em;
	font-weight:		bold;
	color:				#10513B;
	padding:			10px 20px 0 20px;
	margin:				0;
	background:			#EFEEEE;
}

.SubPage #content,
.SubPage #JBcontent{
	padding:			10px 60px;
}
.SubPage #content h1,
.SubPage #JBcontent h1{
	padding:			5px 10px;
	margin:				-10px -60px 10px -60px;
}
.SubPage #content h2{
	margin-top:			20px;
	margin-bottom:		5px;
}

/*
====================================================================================
=== CUSTOM JB CONTENT ==============================================================
====================================================================================
*/
/* JB TABLE/BOX HEADER BACKGROUND COLOUR */
#JBcontent .savedsearch h2, #JBcontent form.styled fieldset h2, #JBcontent form.styled fieldset h3,
#JBcontent table.results th, #JBcontent table.CMSEmailEditor thead, #JBcontent form.styled fieldset h2,
#JBcontent form.styled fieldset h3, #JBcontent table.results th{
	background:			#999;
}
 
/*
===================================================================================
=== FOOTER ========================================================================
===================================================================================
*/
#footer{
	clear:				both;
	font-size:			0.9em;
	height:				50px;
	padding:			5px;
	border-top:			3px solid #353535;
	background:			#FFF;
}
#footer p{
	padding:			2px 6px 0 6px;
}
#footer li{
	float:				left;
	padding:			0px 7px!important;
	border-right:		1px solid #888;
}
#footer li a{ /* [CS] */  
	color:				#555;   
}
#footer li a:hover{ /* [CS] */     
	text-decoration:	underline;
}



#footer ul li{
	height:				20px;
	padding:			12px 20px 8px 20px;
	font-size:			0.9em;
}


#footer li.lastItem, #footer li.CMSlogout{
	border-right:		none;
}
#footer li.CMSlogout{
	position:			absolute;
	bottom:				-25px;
	left:				-6px;
}
#footer li.CMSlogout a{
	display:			block;
	padding:			3px 10px;
	font-weight:		bold;
	font-size:			1.1em;
	color:				#fff;
	background:			#c40000
}
#footer li.CMSlogout a:hover{
	text-decoration:	none;
	background:			#820000;
}

/*
===================================================================================
=== DEBUG =========================================================================
===================================================================================
*/
/*
#container{
	background:			yellow!important;
}
#left{
	background:			red!important;
}
#content, #JBcontent{
	background:			mediumturquoise!important;
}
#right{
	background:			blue!important;
}
#header{
	background:			blue!important;
}
#mainMenu ul#topmenu{
	background:			darkblue!important;
}
#abovecontent{
	background:			mediumslateblue!important;
}
#main{
	background:			lightgray!important;
}
#footer{
	background:			magenta!important;
}
.LatestVacanciesCol2 span.jobs_JobTitle{
	background:			#C5D9E1;
}
.LatestVacanciesCol2 span.jobs_Area{
	background:			#C5DECC;
}
.LatestVacanciesCol2 span.jobs_JobDescription{
	background:			#E1E0C5;
}
.LatestVacanciesCol2 span.jobs_Salary{
	background:			#DFC5E1;
}
/**/