/**
 *	Top Gear Recruitment
 *	Stylesheet
 *
 *	@pages			all
 *	@browsers		all
 *	@media			all
 *	@copyright		2010 Phil Thompson
 *	@author			Phil Thompson
 *	@since			26/04/2010
 *	@lastmodified	16/05/2010
 *
 *	Contents
 *	
 *	1 Reset
 *	2 HTML tags
 *	3 Common classes
 *	4 Layout
 *		4.1 container
 *		4.2 header
 *		4.3 content
 *		4.4 footer
 *	5 Page specific styles
 *		5.1 Common pages
 *			5.1.1 About Top Gear
 *			5.1.2 News
 *		5.2 Home-page
 *		5.3 Workers
 *			5.3.1 Home
 *			5.3.2 Branches
 *			5.3.3 Working in the UK
 *			5.3.4 What our workers say
 *			5.3.5 Current vacancies > More details
 *          5.3.6 Links
 *          5.3.7 Apply (Upload C.V.)
 *		5.4 Employers
 *			5.4.1 Home
 *				5.4.1.1 Why Top Gear?
 *			5.4.2 The Right Industrial worker
 *				5.4.2.1 The Right Industrial worker > Recruiting Great Workers
 *			5.4.3 The Right Drivers
 *				5.4.3.1 The Right Drivers > Assessing Drivers
 *			5.4.4 Performance Reviews
 *			5.4.5 Managed Services
 *				5.4.5.1 Managed Services > Benefits of Managed services
 *			5.4.6 TempID
 *				5.4.6.1 WRS Compliance
 *				5.4.6.2 Subcontractors
 *				5.4.6.3 Invoicing
 *				5.4.6.4 Biometics
 *				5.4.6.5 Link to SAGE
 *				5.4.6.6 Management Reporting
 *			5.4.7 Testimonials
 *			5.4.8 FAQs
 *			5.4.9 Milestones
 *			5.4.10 Download Brochure
 *			5.4.11 Newsletter subscription
 *			5.4.12 Branches/Managed Services
 *		5.5 Careers
 *			5.5.1 Home 
 *			5.5.2 Why Top Gear? 
 *			5.5.3 News 
 *			5.5.4 Milestones
 *			5.5.5 Apply (Upload C.V.)
 *          5.5.6 Current vacancies > More details
 *		5.6 Admin
 */
 
 
 
/**
 * 	 1 Reset
 */
 
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	background: transparent;
	border: 0;
	font-size: 100%;
	margin: 0;
	padding: 0;
	vertical-align: baseline;
}

/**
 *	1.1 HTML elements 
 */
aside, 
footer, 
header, 
nav, 
section{
	display: block;
}
 
/**
 * 	 2 HTML tags
 */
 
html{ 
	overflow-y: scroll;
}
 
body{
	background: #FFF url(/images/layout/body.jpg) center 91px no-repeat;
	color: #000;
	font: 12px/1.3 	'Segoe UI',Verdana,Arial;
	width: 100%;
}

/* Link styles */
a{
	color: #1C92D0;
	text-decoration: none;
}

	a:visited{
		color: #551A8B;
	}
	
	a:hover,
	a:focus{
		color: #00F;
		text-decoration: underline;
	}
	
	a:active{
		color: #F00;
		outline: none;
	}

/* Headings h1-6 */	
h1, h2, h3, h4, h5, h6{
	color: #000;
	font-weight: bold;
	line-height: 1.05;
	padding: 20px 20px 15px;
}

h1{
	color: #069;
	font-size: 18px;
	letter-spacing: 0.01em;
	line-height: 21px;
	padding: 0 20px 15px;
}

h2{
	color: #069;
	font-size: 14px;
	letter-spacing: 0.01em;
	line-height: 18px;
	padding: 9px 20px 15px;
}


h3, h4, h5, h6{
	
}

h1 + h2,
h2 + h3{
	padding-top: 0;
}


p{
	line-height: 16px;
	padding: 0 20px 8px;	
}

/* Lists */
ul, ol{
	padding: 10px 20px;
}

	li{
		margin: 0 0 .1em 1em;
	}

dl{
	padding: 7px 20px 10px 35px
}

	dt{
		display: list-item;
		font-size: 13px;
		font-weight: bold;
		letter-spacing: 0.05em; /* IE doesn't understand non-px values */
	}
	
	dd{
		line-height: 16px;
		padding-bottom: 11px;
	}
	
	dd abbr.a{
		border: none;
		font-weight: bold;
	}

h2 + ul, h2 + ol, h2 + dl,
h3 + ul, h3 + ol, h3 + dl{
	padding-top: 0;
}
	
	

/* Misc elements: hr, abbr, blockquote etc */
hr{
	background: #E8E8E8;
	border: 0;
	clear: both;
	color: #E8E8E8;
	height: 1px;
	margin: 30px 20px;
}

abbr{
	border-bottom: 1px dotted #999;
}

blockquote p{
	line-height: 16px;
}


	blockquote cite{
		color: #000;
		display: block;
		font-style: normal;
		padding: 0 25px 0;
		text-align: right;
	}

/* Code style text */
code, kbd, tt, samp, tt{
	font-family:  Monaco, "Lucida Console", Courier, "Courier New", monospace;
}

img{
	display: block;
	position: relative;
}

strong{
	font-weight: bold;
}

/* Forms */
form{
	clear: both;
	padding: 5px 20px 20px 20px;
}

	form fieldset{
		padding: 0 0 33px;
	}

	form legend{
		font-size: 14px;
		font-weight: bold;
		letter-spacing: 0.01em; /* IE can't understand non px values */
		padding: 0 0 5px;
	}
	
	/* Allows <legend> to wrap when very long */
	form legend span{
		display: block;
		width: 400px; 
	}

	form label{
		display: block;
	}

	form input,
	form select,
	form textarea, 
	form button{
		display: block;
		font-family: Arial, Helvetica, sans-serif;
	}
	
	form button{
		background: #1766AB;
		border: none;
		color: #FFF;
		float: right;
		font-weight: bold;
		padding: 0;
		text-align: center;
		width: auto;
	}
	
		form button:hover,
		form button:focus{
			cursor: pointer;
		}
		
	
	
	form fieldset div.fields{
		background: #CCE0EB url(/images/layout/form.gif) 0 0 no-repeat;
		float: left;
		padding: 2px 0;
		width: 399px; /* or 397px - CHECK THIS */
	}
	
	form fieldset div.fields label{
		color: #069;
		float: left;
		font-weight: bold;
		letter-spacing: 0.01em; /* IE only understands px as units here */
		padding: 5px 0 0;
		width: 85px;
	}
	
		form fieldset div.fields label span.required{
			color: #E50207;
			font-weight: bold;
			margin-left: -.35em;	
		}
		
		form fieldset div.fields label.extra{
			width: 245px;
		}
		
		form fieldset div.fields span.extra{
			color: #069;
			font-weight: bold;
			padding-right: 5px;
		}
		
		form fieldset div.fields label .optional{
			font-weight: normal;
		}
		
    form fieldset div.fields textarea {
		float: left;
        width: 260px;
        height: 150px;
	}

    form fieldset div.fields input,
    form fieldset div.fields select{
        float: left;
        width: 260px;
    }
	
	form fieldset div.fields select{
		font-size: 13px;
		width: 200px; 
	}
	
	form fieldset div.fields input.less{
		width: 100px;
	}
	
	form fieldset div.fields div.field{
		float: left;
		padding: 5px 15px 0 18px;
	}
	
	form fieldset label.instructions{
		color: #000;
		font-weight: normal;
	}

	/* Same as label.instructions but used becasue IE6+7 does't like CSS3's + selctor */
	form fieldset label.after-fields{
		background: transparent url(/images/layout/form.gif) -399px -20px no-repeat;
		clear: both;
		padding-top: 13px;
		width: 399px;
	}
	

	/* Checkboxes / Radio buttons - input followed by inline label */
	form fieldset div.fields div.field div.field-radio{
		padding-top: 0;
	}
	
		form fieldset div.fields div.field-checkbox{
			padding-left: 8px;
		}
	
		form fieldset div.field-radio input,
		form fieldset div.field-checkbox input{
			display: inline;
			margin-right: 5px;
			vertical-align: middle;
			width: auto;
		}
		
		form fieldset div.field-radio label,
		form fieldset div.field-checkbox label{
			display: inline;
			padding-top: 2px;
			width: auto;
		}
		
	form fieldset.buttons{
		margin-top: -23px;
	}
	
	form button#search-button{
		background: transparent url(/images/layout/form.gif) -798px 0 no-repeat;
		float: right;
		height: 27px;
		width: 368px;
	}
	
	
	 /* ERROR MESSAGES */
	 
	 /* 
    	TIP : Save space by combining these rules into a single .message 
    	class then style a success and error message colours with an extra class
    	e.g.
    	.message{
    		stuff
    	}
    	
    	.success{
    		green
    	}
    	
    	.error{
    		red
    	}
    */
	 
	div.message{
		clear: both;
        color: #000;
        float: left;
        margin: 0 0 10px 12px;  /* Remember to fix IE6 double margin float bug */
        padding: 10px; /* TIP : try to put horizontal padding on any inline elements inside this div - for IE6's box model */   
        width: 352px;	
	}

    div.error {
        background: #FCC;
        border: 1px solid #900;       
    }
    
    div.success {
        background: #CCFFCC;
        border: 1px solid #006633;
    }
    
    

	
		
	

/* Tables */
table{
	border-collapse: collapse;
	border-spacing: 0;
	margin: 20px;
}
 

 
/**
 * 	 3 Common classes
 */

/* Accessibility/show-hide content */ 
.off-screen{
	left: -99999px;
	position: absolute;
	top: -99999px;
}

.hide{
	display: none;
}

/* Image replacement */
.replace{
	text-indent: -99999px;
}

	.replace a:focus, 
	a.replace:focus{
		outline: none;
	}

/* Layout */
.clear{
	clear: both;
}
 
.clearfix:after{
	visibility: hidden;
	display: block;
	font-size: 0;
	content: " ";
	clear: both;
	height: 0;
}

/* Allow page backgrounds to go full width but content centralised */
.inner{
	margin: 0 auto;
	position: relative;
	width: 960px;
}


.column{
	float: left;
	position: relative;
	width: 326px;
}

/* paginator */
.paginator{
    text-align: center;   
}

.paginator-right{
    text-align: right;   
}
.paginator-current{
    font-size: 110%;
    font-weight: bold;
}

/* Images */
.center,
.centre{
	margin: 0 auto;
}

.left{
	float: left;
	margin: 0 20px 20px 0;
}

.right{
	float: right;
	margin: 0 0 20px 20px;
}


/* List that don'es look like lists */
ul.block, 
ol.block{
	
}

	ul.block li, 
	ol.block li{
		clear: both;
		display: block;
		list-style: none;
		margin: 0;
	}
	

	.block li h2,
	.block li h3,
	.block li p{
		padding-left: 0;
		padding-right: 0;
	}


/* Big paragraph */
p.intro{
	font-size: 14px;
	letter-spacing: 0.01em;
	line-height: 19px;
	padding-bottom: 19px;
}

	p.intro + h2{
		padding-top: 0;
	}

/* Blue arrow next to text */
.arrow{
	background: transparent url(/images/icons/arrow.gif) 20px 12px no-repeat;
	font-weight: bold;
	padding-left: 33px;
}

	p.arrow{
		background-position: 20px 3px;
	}

/* Branch listings - list and contact details */

/* Branch contact details */
div.branch{
	background: #B2D1E0 url(/images/layout/branch.gif) -274px 0 no-repeat;
	color: #000;
	margin: 0 0 19px;
}

	div.branch div.adr{
		padding: 0 32px;
	}
	
	div.branch h3,
	div.branch h4{
		color: #FFF;
		font-size: 14px;
		padding: 20px 32px 5px;
	}
	
	div.branch h3{
		padding-bottom: 10px;
	}
	
	div.branch p{
		padding: 0 32px 10px;
	}
	
		div.branch span.tel,
		div.branch a.email{
			color: #069;
			line-height: 1;
		}
		
		div.branch span.tel{
			font-size: 30px;
		}
	
		div.branch div.map a{
			background: #237EBE url(/images/layout/branch.gif) -827px bottom no-repeat;
			color: #FFF;
			display: block;
			padding: 5px 32px 6px;
			text-decoration: none;
		}
	
	/* Red version AKA managed services */	
	div.branch-managed-service{
		background-color: #EBB7B7;
		background-position: -551px 0;
	}
		
		div.branch-managed-service span.tel,
		div.branch-managed-service a.email{
			color: #1C92D0;
		}
	
		div.branch-managed-service div.map a{
			background-color: #B31418;
			background-position: -1103px bottom;
		}


/* List of branches - users click to view contact details of one they want */
div.branch-listing{
	float: left;
	width: 100%;
}

	div.branch-listing h2{
		background: transparent url(/images/layout/branch-listing-h2.gif) 18px 0 no-repeat;
		float: left;
		line-height: 1.3;
		min-height: 73px;
		padding: 0 0 0 33px;
		width: 154px;
	}
	
	div.branch-listing ul{
		/*clear: left; IE6+7 ignore this so let's remove it */
		float: right;
		margin: 0 22px 0 0;
		padding: 0 0 40px;
		position: relative;
		top: 47px;
		width: 214px;
	}
	
		div.branch-listing ul li{
			line-height: 23px;
			list-style: none;
			margin: 0;
		}
		
			div.branch-listing ul li a{
				color: #9BABCB;
				font-size: 18px;
				font-weight: bold;
				text-decoration: none;
			}
			
			/* active branch */
			div.branch-listing ul li.active{
				border-bottom: 2px solid #266199;
			}
			
			div.branch-listing ul li.active a{
				color: #266199;
			}
			
	/* Alternate styling for branch listings */
	
	div.branch-listing-alt h2{
		background-image: url(/images/layout/branch-listing-alt-h2.gif);
		color: #E50207;
	}
	
		
		div.branch-listing-alt ul li a{
			color: #EBB7B7;
		}
		
		
		/* Active branch link */
		div.branch-listing-alt ul li.active{
				border-bottom-color: #E50207;
		}
		
			
	
			div.branch-listing-alt ul li.active a{
				border-bottom-color: #1C92D0;
				color: #1C92D0;
			}



/* blockquotes */
blockquote.em{
	margin: 20px 0;
}

	blockquote.em p{
		color: #069;
		font-size: 14px;
		font-style: italic;
		font-weight: bold;
		line-height: 23px;
	}
	
		blockquote.em p span.q{
			font: normal 36px/16px Helvetica, Arial, sans-serif;
			vertical-align: middle;
		}
		
			blockquote.em p span.q:first-child{
				left: -.1em;
				margin-left: -.3em;
			}

div.blockquote{
	background: #CFE0EB url(/images/layout/blockquote-div.gif) 0 0 no-repeat;
	color: #000;
	margin: 0 0 19px;
	padding: 26px 0 0;
}

	div.blockquote blockquote{
		background: #CFE0EB url(/images/layout/blockquote-div.gif) 100% 100% no-repeat;
	}
	
		div.blockquote blockquote p{
			padding: 0 18px;
		}
		
		div.blockquote blockquote p + p{
			padding-top: 23px;
		}
	
		div.blockquote blockquote cite{
			padding: 14px 15px 20px;
			text-align: left;
		}
	
	/* Alt style for blockquote == pink */	
	div.column-one div.blockquote-alt,
	div.column-one div.blockquote-alt blockquote{
		background-color: #FCE0E1;
		background-image: url(/images/layout/blockquote-div-alt.gif);
	}

	/* If quote is in column-one it's only 256px wide so use a thinner image */
	div.column-one div.blockquote,
	div.column-one div.blockquote blockquote{
		background-image: url(/images/layout/blockquote-div-column-one.gif);
	}	
	
	div.column-one div.blockquote-alt,
	div.column-one div.blockquote-alt blockquote{
		background-color: #FCE0E1;
		background-image: url(/images/layout/blockquote-div-alt-column-one.gif);
	}
	

/* Call us call to action */
div.telephone-action{
	/*background: #469DE1 url(/images/layout/telephone-action.gif) 0 0 no-repeat;*/
	color: #FFF;
	height: 87px;
	margin: 0 0 19px;
	padding: 10px 0;
}

	div.telephone-action p{
		padding-bottom: 0;
	}
	
	div.telephone-action span.tel{
		color: #FFF;
		display: block;
		font-size: 32px;
	}
	
	div.telephone-action div.first{
		/*background: transparent url(/images/layout/telephone-action.gif) -276px 0 no-repeat;*/
		height: 75px;
		margin: -10px 0 0;
		text-indent: -99999px;
	}

span.tel{
	color: inherit;
	text-decoration: none;
}

/* Different call us call to actions styles */
div.cant-find-vacancy{
	background: url(/images/layout/cant-find-vacancy.gif) 0 0 no-repeat;
}

	div.cant-find-vacancy p a{
		display: block;
		width: 240px;
		height: 70px;
	}

/* Serach result listing/current vacancies */
ol.search-results{
	padding: 20px 20px 0;
}

	ol.search-results li{	
		line-height: 16px;
		padding-bottom: 18px;
	}
	
		ol.search-results li span{
			color: #666;
			font-weight: bold;
		}
		
		ol.search-results li a.title{
			color: #1C92D0;
			font-weight: bold;
		}
		
		ol.search-results li a.apply{
			background: transparent url(/images/buttons/apply.gif) 100% 0 no-repeat;
			display: block;
			height: 26px;
			margin: 10px 0 0;
		}
	
	
/**
 * 	 4 Layout
 */



div#container{
	background: #FFF;
	margin: 0 auto;
	width: 1020px;
}

div#header{
	abackground: transparent url(/images/layout/header.gif) 818px 14px no-repeat;
}

	div#header div.branding{
		padding: 13px 41px 0;
	}
	
		/* Header logo - can be a span or an a */
		div#header div.branding .logo{
			background: transparent url(/images/layout/header-branding-logo.gif) 0 0 no-repeat;
			display: block;
			font-size: 48px;
			font-weight: bold;
			height: 67px;
			overflow: hidden;
			text-indent: -99999px;
			text-transform: uppercase;
			width: 218px;
		}
		
		div#header div#strapline{
			background: transparent url(/images/layout/header-strapline.png) 0 0 no-repeat;
			clear: both;
			height: 43px;
			text-indent: -99999px;
		}
		
		/* Main nav */
		div#header div.nav{
			height: 20px;
			margin: -9px 0 0 357px;
			width: 411px;
		}
		
			div#header div.nav ul{
				float: left;
				padding: 0;
				width: 411px;
			}
			
				div#header div.nav ul li{
					display: block;
					float: left;
					margin: 0;
					padding: 0;
					text-indent: -99999px;
				}
				
					div#header div.nav ul li a{
						background: transparent url(/images/layout/header-nav.gif) 0 0 no-repeat;
						display: block;
						height: 20px;
						overflow: hidden;
					}
					
					div#header div.nav ul li.why-top-gear-link a{
						background-position: 0 0;
						width: 190px;
					}
					
					div#header div.nav ul li.about-link a{
						background-position: -190px 0;
						width: 90px;
					}
					
					div#header div.nav ul li.news-link a{
						background-position: -280px 0;
						width: 131px;
					}
					
						/* Active states */
						body.why-top-gear div#header div.nav ul li.active a,
						div#header div.nav ul li.why-top-gear-link a:hover{
							background-position: 0 -20px;
							width: 190px;
						}
						
						body.about div#header div.nav ul li.active a,
						div#header div.nav ul li.about-link a:hover{
							background-position: -190px -20px;
							width: 90px;
						}
						
						body.news div#header div.nav ul li.active a,
						div#header div.nav ul li.news-link a:hover{
							background-position: -280px -20px;
							width: 131px;
						}


div#content{
	padding: 0 0 0 20px;
}

	div#content div.column-one{
		margin-right: 9px;
		width: 256px;
	}
	
	div#content div.column-two{
		padding: 20px 0;
		width: 417px;
	}
	
	div#content div.column-three{
		margin-left: 20px; /* IE6 won't like this */
		padding: 4px 0 20px;
		width: 275px;
	}
	
		div#content div.column-three img{
			margin-bottom: 20px;
		}
	
	body.two-columns div#content div.column-two,
	body.two-columns-alt div#content div.column-two{
		width: 732px;
	}
	
	/* odd page where the main column is wide but the cop isn't */
	body.two-columns-alt div#content div.column-two h1,
	body.two-columns-alt div#content div.column-two h2,
	body.two-columns-alt div#content div.column-two h3,
	body.two-columns-alt div#content div.column-two ul,
	body.two-columns-alt div#content div.column-two ol,		
	body.two-columns-alt div#content div.column-two p{
		width: 427px;
	}
	
	body.two-columns-alt div#content div.column-two div.contains-image h1,
	body.two-columns-alt div#content div.column-two div.contains-image h2,
	body.two-columns-alt div#content div.column-two div.contains-image h3,
	body.two-columns-alt div#content div.column-two div.contains-image ul,
	body.two-columns-alt div#content div.column-two div.contains-image ol,		
	body.two-columns-alt div#content div.column-two div.contains-image p{
		width: 227px;
	}
	
	body.two-columns-alt div#content div.column-two div.contains-image img.right{
		margin-right: 20px;
	}
	

	/* Sidebar nav */
	div#content div.nav{
		background: #E50207 url(/images/layout/content-nav.gif) left bottom no-repeat;
		margin: 0 0 17px;
		padding: 0 0 19px;
		width: 256px;
	}
	
		div#content div.nav ul{
			padding: 14px 15px 0;
		}
		
			div#content div.nav ul li{
				color: #FFF;
				font-size: 9px;
				list-style: disc;
				margin: 0 0 0 15px;
				padding: 0 0 5px 4px;
			}
			
				div#content div.nav ul li a{
					color: #FFF;
					font-size: 13px;
					font-weight: 400;
					letter-spacing: 1px;
					text-decoration: none;
				}
				
				div#content div.nav ul li.active,
				div#content div.nav ul li.active a{
					color: #FC6;
					font-style: italic;
					font-weight: bold;
				}
				
				/* Child links */
				div#content div.nav ul li ul{
					display: none;
					padding: 5px 10px;
				}
				
				div#content div.nav ul li.active ul{
					display: block;
					margin-left: -10px;
					padding-left: 20px;
				}
				
					div#content div.nav ul li ul li{
						margin-left: 0;
						padding-bottom: 2px;
						padding-left: 2px;
					}
					
					
						div#content div.nav ul li ul li a{
							font-size: 11px;
						}
						
							div#content div.nav li.active ul li a{
								color: #FFF;
								font-style: normal;
								font-weight: normal;
							}
							
							div#content div.nav li ul li.active a{
								background: #C00206;
								font-style: italic;
								font-weight: bold;
							}
							
		/* Job of the week */
		div#job-of-the-week{
			background: #CCE0EB;
			color: #000;
		}
			
			div#job-of-the-week h2{
				background: #3160AC url(/images/layout/job-of-the-week.gif) 0 0 no-repeat;
				color: #FFF;
				font-size: 18px;
				padding: 8px 18px 4px;
			}
			
			div#job-of-the-week h3{
				border-bottom: 1px solid #FFFEFF;
				color: #226699;
				font-size: 14px;
				margin: 0 14px 7px;
				padding: 5px 3px 2px;
			}
			
			div#job-of-the-week p{
				font-size: 11px;
				line-height: 13px;
				padding: 0 18px 12px;
			}
			
			div#job-of-the-week ul{
				float: left;
				padding: 0;
				width: 100%;
			}
			
			div#job-of-the-week ul li{
				display: block;
				float: left;
				list-style: none;
				margin: 0;	
			}
			
				div#job-of-the-week ul li a{
					background: #264994 url(/images/layout/job-of-the-week.gif) -257px bottom no-repeat;
					color: #FFF;
					display: block;
					float: left;
					padding: 5px 15px;
					text-decoration: none;
					width: 98px;
				}
				
				div#job-of-the-week ul li.first a{
					text-align: right;
				}
				
				div#job-of-the-week ul li.last a{
					background-position: right bottom;
				}
				
				div#job-of-the-week ul li.last span {
					background: #264994 url(/images/layout/job-of-the-week.gif) -257px bottom no-repeat;
					display: block;
					float: left;
					padding: 5px 15px;
					width: 98px;
					background-position: right bottom;
				}
				
		/* How can we help? */
		div#how-can-we-help{
			background: url(/images/layout/how-can-we-help.jpg) 0 0 no-repeat;
			color: #FFF;
			height: 410px;
			margin-bottom: 20px;
		}
		
		body.careers div#how-can-we-help{
			height: 364px;
		}
			
			div.how-can-we-help-active{
				background-position: -276px 0 !important;
			}
			
			div#how-can-we-help h2{
				color: #FFF;
				font-size: 24px;
				height: 308px;
				text-indent: -99999px;
				width: 160px;
			}
			
			div#how-can-we-help div.telephone-action{
				background: transparent;
				height: auto;
				padding: 0;
			}
			
			div#how-can-we-help div.telephone-action p.last{
				background: #469DE1 url(/images/layout/telephone-action.gif) left bottom no-repeat;
				min-height: 10px;
				padding: 0 20px 10px;
			}
				
				div#how-can-we-help div.telephone-action p.first {
					margin-top: -15px;
            		text-indent: -99999px;
				}
								
				div#how-can-we-help div.telephone-action p.first a{
					color: #FFF;
					font-size: 16px;
					display: block;
					height: 90px;
				}


div#footer{
	clear: both;
	color: #069;
}

	div#footer{
		
	}
	
	/* Vcard - compnay address and number */
	div#footer div.vcard{
		float: left;
		padding: 5px 41px;
	}
	
	div#footer div.vcard div#call-us-now{
		background: transparent url(/images/layout/footer-vcard-tel.gif) 0 0 no-repeat;
		font-size: 18px;
		height: 63px;
		text-indent: -99999px;
		width: 239px;
	}
	
		div#footer div.vcard span.tel{
			color: inherit;
			font-size: 38px;
			display: block;
			overflow: hidden;
			text-decoration: none;
		}
	
	div#footer div.vcard div,
	div#footer div.vcard div{
		font-size: 11px;
	}
	
	div#footer div.vcard div.copyright{
		font-weight: bold;
		margin-top: 16px;
	}
	
	div#footer div.vcard div.gangmaster{
		border: 1px solid #000;
		font-weight: bold;
		color: #000;
		float: left;
		padding: 4px 10px;
		margin-top: 20px;
	}
	
	div#footer div.vcard div.gangmaster a{
		color: #000;
		display: block;
	}
	
	div#footer div.vcard div.gangmaster a:hover{
		color: #000;
		text-decoration: none;
	}
	
	div#footer div.vcard div.gangmaster a:visited{
		color: #000;
	}
	
 /* Logos - accreditation */
 div#footer div#awards{
 	float: right;
 	width: 490px;
 	background: transparent url(/images/layout/footer-awards.gif) 0 0 no-repeat;
 	margin: 30px 50px 0 0;
 	padding: 0;
 }
 
 	 div#footer div#awards ul{
 	 	padding: 0;
 	 }
 	 
 	 	div#footer div#awards ul li{
 	 		display: block;
 	 		float: left;
 	 		height: 90px;
 	 		list-style: none;
 	 		margin: 0;
 	 		text-indent: -99999px;
 	 	}
 	 	
 	 	div#footer div#awards ul li.fta a{
 	 		display: block;
 	 		width: 50px;
 	 		height: 50px;
 	 		margin-top: 20px;
 	 	}
 	 	
 	 	div#footer div#awards ul li.rec a{
 	 		display: block;
 	 		width: 80px;
 	 		height: 50px;
 	 		margin: 20px 0 0 25px;
 	 	}
 	 	
 	 	
/**
 *	5 Page specific styles
 */
 
 

/**
 * 	5.1.1 About Top Gear
 */
body.about #image-1{
	left: -195px;
	top: 20px;
}

body.about #image-2{
	left: -5px;
	top: 15px;
}

body.about div#content div.column-three{
	margin-left: 63px;
	width: 233px;
}

	body.about div#content div.column-three img{
		margin-bottom: 30px;
	}

	body.about div.column-three div{
		position: relative;
		left: -62px;
		width: 300px;
	}
	
			body.about div.column-three div h2{
				padding-bottom: 17px;
			}
 
/**
 * 5.1.2 News
 */

body.news figcaption{
	display: block;
	font-style: italic;
	margin: 10px auto;
	width: 75%;
}
 
body.news div#content div.column-three{
	background: transparent url(/images/layout/news-column-three.gif) 0 0 no-repeat;
	margin-top: 5px;
}

	body.news div.column-three h2{
		font-size: 18px;
		padding: 12px 23px 0;
	}
	
	body.news div.column-three ul + h2{
		padding-top: 0;
	}
	
	body.news div#content div.column-three h3{
		font-size: 14px;
		padding: 19px 23px 0;
	}
	
	body.news div#content div.column-three ul{
		padding: 18px 20px 0;
	}
	
			body.news div#content div.column-three h3 + ul{
				padding-top: 5px;
			}
	
		body.news div#content div.column-three ul li{
			font-size: 6px;
			margin: 0 0 18px 15px;
		}
	
			body.news div.column-three li a{
				color: #000;
				font-size: 12px;
			}
			
				body.news div.column-three li.active a{
					font-weight: bold;
				}
		
			body.news div.column-three li.active a span{
				font-weight: normal;
			}
			
	body.news p.metadata{
		color: #666;
	}
	
/**
 * 	5.1.3 Milestones (used in Employers and Careers sections)
 */
body.milestones div#content div.column-two ul li{
	font-weight: normal;
	list-style: none;
	margin: 0 0 20px;
	position: relative;
	width: 695px;
}

	body.milestones div.column-two ul li div{
		background: #D9E8F0;
		z-index: 1;
	}
	
	body.milestones div.column-two ul li.alt div{
		background: #B2D1E0;
	}
	
	
		body.milestones div.column-two ul li div h2{
			color: #FFF;	 
			font: 48px/1 "Arial Black", Arial, sans-serif;
			padding: 0 20px;
			position: relative;
			top: -10px;
		}
		
	body.milestones div.column-two ul li span.arrow{
		background: transparent url(/images/icons/arrows.png) 0 0 no-repeat;
		display: block;
		height: 26px;
		padding: 0;
		position: absolute;
		width: 28px;
		z-index: 2;
	}
	
	/* rounded corners - HTMl is injected by JavaScript */
	body.milestones div.column-two ul li span.c{
		background: transparent url(/images/layout/milestones-corners.gif) 0 0 no-repeat;
		display: block;
		height: 20px;
		position: absolute;
		width: 20px;
	}
	
		/* positioning of the corners */
		body.milestones div.column-two ul li span.c-tl{
			background-position: 0 0;
			left: 0;
			top: 0;
		}
		
		body.milestones div.column-two ul li span.c-tr{
			background-position: -20px 0;
			right: 0;
			top: 0;
		}
		
		body.milestones div.column-two ul li span.c-bl{
			background-position: 0 -20px;
			bottom: 0;
			left: 0;
		}
		
		body.milestones div.column-two ul li span.c-br{
			background-position: -20px -20px;
			bottom: 0;
			right: 0;
		}
		
		/* positioning of the corners for alt version */
		body.milestones div.column-two ul li.alt span.c-tl{
			background-position: -40px 0;
		}
		
		body.milestones div.column-two ul li.alt span.c-tr{
			background-position: -60px 0;
		}
		
		body.milestones div.column-two ul li.alt span.c-bl{
			background-position: -40px -20px;
		}
		
		body.milestones div.column-two ul li.alt span.c-br{
			background-position: -60px -20px;
		}

/* Positioning of years - mostly identicla on the two pages */	
	body.milestones div#content li#milestone-1999{
		width: 692px;
	}
	
		body.milestones div#content li#milestone-1999 img{
			margin-right: 20px;
			top: -30px;
		}
	
	body.milestones div#content li#milestone-2000{
		left: 60px;
		width: 578px;
	}
	
	body.milestones div#content li#milestone-2001{
		width: 692px;
	}
	
		body.milestones div#content li#milestone-2001 img{
			bottom: -20px;
			left: -305px;
			position: absolute;
		}
	
	body.milestones div#content li#milestone-2002{
		float: left;
		margin-left: -280px;
		width: 254px;
	}
	
	body.milestones div#content li#milestone-2003{
		clear: none;
		float: left;
		margin-right: 20px;
		width: 256px;
	}
	
	body.milestones div#content li#milestone-2004{
		float: left;
		clear: none;
		width: 300px;
	}
	
	body.milestones div#content li#milestone-2005{
		clear: both;
		margin-left: -157px;
		width: 788px;
	}
	
	body.milestones div#content li#milestone-2006{
		float: left;
		margin-left: -260px;
		margin-right: 60px;
		width: 412px;
	}
	
	body.milestones div#content li#milestone-2007{
		float: left;
		position: relative;
		width: 215px;
		margin-left: -40px;
	}
	
		body.milestones div#content li#milestone-2007 img{
			bottom: -30px;
			left: -340px;
			position: absolute;
		}
	
	body.milestones div#content li#milestone-2008{
		float: left;
		position: relative;
		width: 180px;
		margin-left: 20px;
	}
	
	body.milestones div#content li#milestone-2009{
		clear: both;
		margin-left: -158px;
		width: 786px;
	}
	
	body.milestones div#content li#milestone-2010{
		float: right;
		width: 580px;
	}
	
	/* those blue arrows on each milestones */
	body.milestones div#content li#milestone-1999 span.arrow{
		bottom: -20px;
		left: 241px;
	}
	
	body.milestones div#content li#milestone-2000 span.arrow{
		bottom: -20px;
		left: 71px;
	}
	
	body.milestones div#content li#milestone-2001 span.arrow{
		background-position: -56px 0;
		bottom: -10px;
		left: -20px;
	}
	
	body.milestones div#content li#milestone-2002 span.arrow{
		background-position: -28px 0;
		bottom: 52px;
		left: 248px;
	}
	
	body.milestones div#content li#milestone-2003 span.arrow{
		background-position: -28px 0;
		left: 249px;
		top: 27px;
	}
	
	body.milestones div#content li#milestone-2004 span.arrow{
		bottom: -20px;
		left: 65px;
	}
	
	body.milestones div#content li#milestone-2005 span.arrow{
		bottom: -20px;
		left: 192px;
	}
	
	body.milestones div#content li#milestone-2006 span.arrow{
		background-position: -28px 0;
		left: 405px;
		top: 45px;
	}
	
	body.milestones div#content li#milestone-2007 span.arrow{
		background-position: -28px 0;
		left: 205px;
		top: 45px;
	}
	
	body.milestones div#content li#milestone-2008 span.arrow{
		bottom: -20px;
		left: 99px;
	}
	
	body.milestones div#content li#milestone-2009 span.arrow{
		bottom: -20px;
		left: 326px;
	}

 
/**
 *	5.2 Homepage body.home
 */
body.home div#header div.branding{
	padding-bottom: 11px;
}

body.home div#header div#strapline{
	position: relative;
	z-index: 2;
}

body.home div#content{
	background: #069 url(/images/layout/home-content.jpg) 0 bottom no-repeat;
	color: #FFF;
	height: 400px;
	margin: -33px auto 0;
	padding: 43px 0 0;
	width: 976px;
	z-index: 1;
}

	body.home div#content h1{
		background: transparent url(/images/headings/home-h1.png) center 13px no-repeat;
		color: #FFF;
		font-size: 31px;
		height: 46px;
		padding-bottom: 0;
		text-align: center;
		text-indent: -99999px;
	}
	 
	body.home div#content ul{
		float: left;
		margin: 0 23px;	
		padding: 0;
		width: 930px;
	}
	
		body.home div#content ul li{
			display: block;
			float: left;
			list-style: none;
			margin: 0;
		}
		
		body.home div#content ul li a{
			background: transparent url(/images/layout/home-ul-li-a.jpg) 0 0 no-repeat;
			color: #FFF;
			display: block;
			height: 245px;
			overflow: hidden;
			text-decoration: none;
			text-indent: -99999px;
			width: 310px;
		}
		
		/* 3 different types */
		body.home div#content ul li.first a{
			background-position: 0 0;
		}
		
		body.home div#content ul li.second a{
			background-position: -310px 0;
		}
		
		body.home div#content ul li.last a{
			background-position: -620px 0;
		}
		
		/* Hover states */
		body.home div#content ul li.first a:hover{
			background-position: 0 -245px;
		}
		
		body.home div#content ul li.second a:hover{
			background-position: -310px -245px;
		}
		
		body.home div#content ul li.last a:hover{
			background-position: -620px -245px;
		}
		
	body.home div#content p{
		background: transparent url(/images/headings/home-p.png) center 44px no-repeat;
		clear: both;
		font-size: 18px;
		padding: 53px 0 40px;
		text-align: center;
		text-indent: -99999px;
	}
	
/**
 *	5.3 Workers section 
 *	body.workers
 */
body.workers div#content div.nav{
	background-color: #F49D00;
	background-position: -256px bottom; 
}

body.workers div#content div.nav ul li.active,
body.workers div#content div.nav ul li.active a{
	color: #069;
}

body.workers div#content div.nav ul li.active ul{
	background: #c00206 url(/images/layout/content-nav-ul-li-ul.gif) 0 0 repeat-x;
}

body.workers div#content div.nav li ul li.active a{
	color: #069;
}

body.workers h1{
	color: #069;
}

body.workers form legend,
body.workers h2.alt,
body.workers h3.alt,
body.workers dt,
body.workers a,
body.workers .arrow{
	color: #F49D00;
}





/**
 *	5.3.1 Workers home
 *	body.workers-home
 */
body.workers-home img#image-1{
	margin-bottom: 15px;
}

body.workers-home img#image-2{
	right: -230px;
} 

body.workers-home div.column-two h2{
	font-size: 20px;
	font-weight: normal;
	margin-top: -60px;
	position: relative;
	width: 200px;
}

	body.workers-home div.column-two h2 span{
		display: block;
	}

body.workers-home div.column-two h3{
	font-size: 14px;
}



/**
 *	5.3.2 Workers Branches
 *	body.workers-branches
 */
body.workers-branches #image-1{
	left: -265px;
	
}

body.workers-branches div#content div.column-two{
	width: 457px;
}

	body.workers-branches div#content div.column-two p.intro{
		width: 417px;
	}

	body.workers-branches div.branch-listing ul li.active{
		border-bottom-color: #F49D00;
	}

body.workers-branches div#content div.column-three{
	margin-left: -22px;
	padding-top: 5px;
}

	body.workers-branches div.branch{
		background-color: #F49D00;
		background-position: 0 0;
	}

/**
 *	5.3.3 Workers Working in the UK
 *	body.workers-working-in-the-uk
 */

body.workers-working-in-the-uk div.column-two h2.arrow{
	background-position: 20px 3px;
	padding-bottom: 1px;
	padding-top: 0;
}

body.workers-working-in-the-uk div.column-two a{
	color: #069;
	font-size: 18px;
	font-weight: bold;
}

/**
 *	5.3.4 Workers What our workers say
 *	body.workers-what-our-workers-say
 */
body.workers-what-our-workers-say cite{
	font-weight: bold;
}

body.workers-what-our-workers-say img.left,
body.workers-what-our-workers-say img.right{
	margin: 0;
	padding: 5px 0;
}

body.workers-what-our-workers-say img.left{
	padding-right: 15px;
}

body.workers-what-our-workers-say img.right{
	padding-left: 15px;
}


/**
 * 	5.3.5 Workers Current vacaancies > More details
 *	body.workers-current-vacancies-more
 */
 
body.workers-current-vacancies-more div.column-two h2{
	color: #069;
	font-size: 12px;
	font-weight: bold;
}
	
	body.workers-current-vacancies-more div.column-two h2 span{
		color: #666;
	}
 
body.workers-current-vacancies-more div#interested{
	background: transparent url(/images/buttons/apply.gif) 100% 0 no-repeat;
	float: left;
	margin: 10px 0;
	width: 100%;
}

	body.workers-current-vacancies-more div#interested h2{
		float: left;
		font-size: 18px;
		padding-right: 0;
		padding-top: 5px;
		width: 250px;
	}
	
	body.workers-current-vacancies-more div#interested p{
		float: left;
		padding: 0;
		width: 140px;
	}
	
		body.workers-current-vacancies-more a.apply{
			display: block;
			height: 26px;
			width: 140px;
		}

body.workers-current-vacancies-more div#interested + p{
	clear: both;
}

body.workers-current-vacancies-more p.arrow{
	background-image: url(/images/icons/arrow-orange.gif);
}

/**
 * 	5.3.6 Workers Links 
 *	body.workers-links
 */
body.workers-links div.column-two{
	margin-right: -165px; /* IE6 loves this */
}

	body.workers-links div.column-two .block{
		padding-top: 5px;
	}
	
	body.workers-links div.column-two .block li h3{
		color: #069;
		font-size: 14px;
		padding: 10px 0 0;
	}

	body.workers-links #links-images{
		margin: 20px 0 10px -185px;
		width: 960px;
	}
	
		body.workers-links #links-images img{
			margin-right: 20px;
			padding-bottom: 10px;
		}

/**
 *  5.3.8 Workerts Apply (Upload CV)
 *  body.workers-apply
 */
body.workers-apply div#content div.column-one h2{
    padding: 20px 0 12px;
} 

body.workers-apply div#content div.column-one p{
    padding: 0 0 20px;
} 

body.workers-apply div#content div.column-two{
    width: 450px;
}
    
    body.workers-apply div#content div.column-two form{
        padding-top: 15px;
    }

        body.workers-apply div#content div.column-two form div.fields{
            padding-top: 13px;
        }
        
        body.workers-apply form fieldset label.after-fields{
            padding-left: 18px;
            padding-top: 30px;
        }
    
        /* Upload CV button */
        body.workers-apply div#content div.column-two form button{
            background: transparent url(/images/buttons/upload-cv.gif) 0 0 no-repeat;
            float: left;
            height: 31px;
            overflow: hidden;
            text-indent: -99999px;
            width: 394px;
        }

body.workers-apply div#content div.column-three{
    margin-left: 13px;
    width: 250px;
}

div#cv-help{
    background: transparent url(/images/layout/cv-help.gif) 0 0 no-repeat;
    height: 188px;
    overflow: hidden;
    text-indent: -99999px;
    width: 250px;
}

    div#cv-help a{
        display: block;
    }


/**
 *	5.4 Employers section 
 *	body.employers
 */
body.employers form legend,
body.employers h2.alt,
body.employers h3.alt,
body.employers dt{
	color: #E50207;
}

/* Submenu in sidebar */
body.employers div#content div.nav ul li.active ul{
	background: #c00206 url(/images/layout/content-nav-ul-li-ul.gif) 0 0 repeat-x;
}

	body.employers div#content div.nav li ul li.active a{
		color: #FC6;
	}
	
body.employers div.column-two p a{
	color: #1C92D0;
	font-style: italic;
	font-weight: bold;
}

body.employers div.column li{
	font-weight: bold;
}

body.employers div#content li em{
	font-style: normal;
	font-weight: normal;
}


/**
 *	5.4.1 Employers Home
 *	body.employers-home
 */


body.employers-home div.column-two h2{
	padding-bottom: 0;
}

body.employers-home div.column-two p{
	padding-right: 0;
}


body.employers-home div.column-two div.last-section{
	position: relative;
	width: 600px;
}

	body.employers-home div.column-two div.last-section h2,
	body.employers-home div.column-two div.last-section p{
		clear: left;
		float: left;
		width: 230px;
	}
	
	body.employers-home div.column-two div.last-section img{
		left: 13px;
		top: 10px;
	}
	


/* Sidebar */

body.employers-home div.column-three{
	margin-top: -10px;
	padding-top: 0;
}

	body.employers-home div#how-can-we-help{
		background-color: #1FA0DC;
		background-image: url(/images/layout/employers-how-can-we-help.jpg);
	}
	
		body.employers-home div#how-can-we-help h2{
			height: 308px;
		}
		
		/* Accreditation logos */
		body.employers-home div.column-three div.accreditation{
			background: transparent url(/images/layout/employers-home-accreditation.gif) 0 0 no-repeat;
			float: left;
			margin: -5px 0 0;
			padding: 20px 0 0;
			width: 276px;
			/*border: 1px solid #069;
			border-radius: 20px;
			-moz-border-radius: 20px;
			-webkit-border-radius: 20px;*/
		}
		
			body.employers-home div.column-three div.accreditation div{
				background: transparent url(/images/layout/employers-home-accreditation.gif) -276px 0 no-repeat;
				float: left;
				padding: 4px 0 20px;
				width: 276px;
			}
		
			body.employers-home div.column-three div.accreditation img{
				float: right;
				margin: 0 40px;
			}
		
			body.employers-home div.column-three div.accreditation img:first-child{
				float: left;
				margin: 10px 0 0 40px;
			}
		



/**
 *	5.4.1.1 Employers Why top gear? 
 *	body.employers-why-top-gear
 */
 
body.employers-why-top-gear div.column-one{
	height: 930px;
}

	body.employers-why-top-gear div.column-one img{
		bottom: 0;
		left: 35px;
		position: absolute;
	}


/**
 *	5.4.2 Employers The Right Industrial worker 
 *	body.employers-the-right-industrial-worker
 */
 
body.employers-the-right-industrial-worker div#content div.column-one div.section{
	margin: 45px auto 0;
	width: 225px;
} 

body.employers-the-right-industrial-worker div#content div.column-two{
	width: 457px;
}


body.employers-the-right-industrial-worker div#reference-check{
	background: #D5E6EE url(/images/layout/reference-check.gif) 0 0 repeat-x;
	border: 1px solid #069;
	border-radius: 15px;
	font-weight: bold;
	margin: 10px 20px 20px;
	padding: 15px 0;
	text-align: center;
	width: 407px;
	-moz-border-radius: 15px;
	-webkit-border-radius: 15px;
}

	body.employers-the-right-industrial-worker div#reference-check h2{
		font-size: 20px;
		padding-bottom: 5px;
	}
	
	body.employers-the-right-industrial-worker div#reference-check p{
		font-size: 14px;
	}
	
body.employers-the-right-industrial-worker div#content div.column-three{
	width: 231px;
}


/**
 *	5.4.2.1 Employers The Right Industrial worker > Recruiting Great Workers
 *	body.recruiting-great-workers
 */


body.recruiting-great-workers div#content div.column-two{
	width: 427px;
} 

body.recruiting-great-workers div#content li{
	font-weight: bold;
}

body.recruiting-great-workers div#content div.column-two img{
	margin-top: 10px;
}

	
body.recruiting-great-workers div#content div.column-three{
	margin-left: 10px;
	padding-top: 155px;
	width: 275px;
}

	body.recruiting-great-workers div#content div.column-three h2,
	body.recruiting-great-workers div#content div.column-three p,
	body.recruiting-great-workers div#content div.column-three ul{
		padding-left: 0;
	}
	
	body.recruiting-great-workers div#content div.column-three h2.alt{
		padding-top: 0;
	}
 
 
body.recruiting-great-workers em.no-references{
	color: #E50207;
 	display: block;
 	font-size: 18px;
 	font-style: normal;
 	font-weight: bold;
 	padding-top: 5px;
}

/**
 *	5.4.3.1 Employers The Right Drivers
 *	body.the-right-drivers
 */
 
body.the-right-drivers div.column-one h2{
	padding: 15px 38px 15px 30px;
}

body.the-right-drivers div.column-one ul{
	padding: 0 38px 20px;
}

	body.the-right-drivers div.column-one ul li{
		margin-bottom: .1em;
	}


body.the-right-drivers div#content div.column-two div.contains-image h2,
body.the-right-drivers div#content div.column-two div.contains-image p,
body.the-right-drivers div#content div.column-two div.contains-image ul{
	width: 427px;
}

body.the-right-drivers div#content div.column-two div.contains-image ul{
	padding-bottom: 35px;
}



/**
 *	5.4.3.2 Employers Assessing Drivers
 *	body.assessing-drivers
 */
 
body.assessing-drivers div.column-one h2{
	padding: 15px 38px;
}

body.assessing-drivers div.column-one ul{
	padding: 0 40px 30px;
}

	body.assessing-drivers div.column-one ul li{
		margin-bottom: .1em;
	}
	
body.assessing-drivers div#content div.column-two img{
	margin-top: 20px;
}

body.assessing-drivers div#content div.column-three{
	padding-top: 110px;
	width: 276px;
}

/**
 *	5.4.4 Employers Performance Reviews
 *	body.employers-performance-review
 */
body.employers-performance-reviews div#content div.column-two{
	width: 447px;
}

body.employers-performance-reviews div#content div.column-three{
	padding-top: 100px;
	width: 265px;
}

	body.employers-performance-reviews div#content div.column-three h2,
	body.employers-performance-reviews div#content div.column-three p{
		padding-left: 0;
	}
	
/**
 *	5.4.5.1 Employers Managed Servcies
 *	body.managed-services
 */	
body.managed-services div#content div.column-two div.contains-image{
	width: 597px;
}

body.managed-services div#content div.column-two h1, 
body.managed-services div#content div.column-two h2{
	width: 357px;
} 
body.managed-services div#content div.column-two h3,
body.managed-services div#content div.column-two p,
body.managed-services div#content div.column-two div.contains-image ul{
	width: 397px;
}


 
	
/**
 *	5.4.5.2 Employers Managed Servcies > Benefits of Managed services
 *	body.benefits-of-managed-services
 */	
 
body.benefits-of-managed-services img#image-1{
	margin-left: -143px;
	top: 20px;
}


body.benefits-of-managed-services div#content div.column-three{
	background: #CCE0EB url(/images/layout/tempid-benefits-column-three.gif) -277px bottom no-repeat;
	padding: 0 0 25px;
}

	body.benefits-of-managed-services div.column-three h2{
		background: transparent url(/images/layout/tempid-benefits-column-three.gif) 0 0 no-repeat;
		font-size: 14px;
		padding: 20px 20px 0;
		text-align: center;
	}
	
		body.benefits-of-managed-services div.column-three h2 span{
			display: block;
			font-size: 18px;
		}
		
	body.benefits-of-managed-services div.column-three ol{
		padding: 0;
	}

		body.benefits-of-managed-services div.column-three li{
			color: #FFF;
			list-style: none;
			margin: 0 0 -20px;
			padding: 0;
		}
	
			body.benefits-of-managed-services div.column-three h3{
				background: transparent url(/images/layout/tempid-benefits-column-three.gif) -552px 10px no-repeat;
				font-size: 14px;
				padding: 20px 32px 20px;
			}
			
			body.benefits-of-managed-services div.column-three li p{
				color: #000;
				font-size: 12px;
				font-weight: normal;
				padding: 0 15px 15px;
			}
			
				/* Different list item's h3s get different numbers via the sprite */
				body.benefits-of-managed-services div.column-three li.first h3{
					background-position: -553px 10px;
				}
				
				body.benefits-of-managed-services div.column-three li.second h3{
					background-position: -829px 10px;
				}
				
				body.benefits-of-managed-services div.column-three li.third h3{
					background-position: -1105px 10px;
				}
				
				body.benefits-of-managed-services div.column-three li.fourth h3{
					background-position: -1381px 10px;
				}

/**
 *	5.4.6 Employers TempID
 *	body.employers-tempid
 */
body.employers-tempid{}

/**
 *	5.4.6.1 Employers TempID > WRS Compliance
 *	body.tempid-wrs-compliance
 */
body.tempid-wrs-compliance div.column-two h1{
	width: 447px;
}

body.tempid-wrs-compliance div.column-two img{
	right: -205px;
	top: 40px;
}


/**
 *	5.4.6.2 Employers TempID > Subcontractors
 *	body.tempid-subcontractors
 */
body.tempid-subcontractors div.column-two h1{
 	padding-bottom: 18px;
}

body.tempid-subcontractors div.column-two img{
	margin-bottom: -60px;
	right: 20px;
	top: -20px;
}

body.tempid-subcontractors div.column-two img + p{
	clear: both;
	position: relative;
	z-index: 2;
}

/**
 *	5.4.6.3 Employers TempID > Invoicing
 *	body.tempid-invoicing
 */
body.tempid-invoicing div.column-two img{
	right: -295px;
	top: 15px;
}

body.tempid-invoicing div#content div.column-three{
	padding-top: 25px;
}

/**
 *	5.4.6.4 Employers TempID > Biometrics
 *	body.tempid-biometrics
 */
body.tempid-biometrics div#content div.column-two{
	width: 437px;
}

	body.tempid-biometrics div#content div.column-two img{
		top: 20px;
	}

body.tempid-biometrics div#content div.column-three{
	margin-left: 0;
	padding-top: 150px;
}

/**
 *	5.4.6.5 Employers TempID > Link to SAGE
 *	body.tempid-link-to-sage
 */
 
body.tempid-link-to-sage div#content div.column-two{
 	width: 437px;
}

	body.tempid-link-to-sage div.column-two figure{
		float: right;
		width: 280px;
	}
	
		body.tempid-link-to-sage div.column-two figure img{
			float: left;
		}
		
		body.tempid-link-to-sage div.column-two figure img:first-child{
			margin-right: 10px;
		}
		
body.tempid-link-to-sage div#content div.column-three{
	padding-top: 20px;
}

/**
 *	5.4.6.6 Employers TempID > Management Reporting
 *	body.tempid-management-reporting
 */
 
body.tempid-management-reporting div#content div.column-two h2 + img{
	right: 55px;
}
 
body.tempid-management-reporting div#content div.column-two ul + img{
	padding-left: 20px;
}

body.tempid-management-reporting div#content div.column-two div.contains-image img.left{
	margin-right: 35px;
}

body.tempid-management-reporting div#content div.column-two div.contains-image p.last{
	float: left;
	padding-top: 20px;
	width: 200px;
}

/**
 *	5.4.7 Employers Testimonials
 *	body.employers-testimonials
 */
body.employers-testimonials div#content div.column-two h1{
	padding-bottom: 28px;
}

body.employers-testimonials div#content div.column-two blockquote{
	margin: 10px 0 33px;
}

body.employers-testimonials div#content div.column-three{
	padding-top: 140px;
}

/**
 *	5.4.8 Employers FAQs
 *	body.employers-faqs
 */
body.employers-faqs div.column-one img{
	margin-bottom: 20px;
}

/**
 *	5.4.9 Employers Milestones
 *	body.employers-milestones
 */

body.employers-milestones img.last{
	margin-left: -160px;
	margin-top: 40px;
}

body.employers-milestones p.intro{
	float: left;
	width: 360px;
}



/**
 *	5.4.10 Employers Download Brochure
 *	body.employers-download-brochure
 */
body.employers-download-brochure a#download-pdf{
	background: transparent url(/images/buttons/download-pdf.gif) 0 0 no-repeat;
	display: block;
	height: 32px;
	margin: 10px 0 18px;
	width: 404px;
}

	body.employers-download-brochure div.column-two img{
		margin-bottom: 15px;
	}

/**
 *	5.4.11 Employers Newsletter subscription
 *	body.employers-newsletter-subscription
 */
body.employers-newsletter-subscription div#content div.column-two{
	width: 437px;
}
	
	body.employers-newsletter-subscription div#content div.column-two form{
		padding-top: 15px;
	}
	
		body.employers-newsletter-subscription div#content div.column-two form div.fields{
			padding-top: 13px;
		}
		
			body.employers-newsletter-subscription div#content div.column-two form div.fields div.field-input{
				padding-bottom: 8px;
			}
		
			body.employers-newsletter-subscription div#content div.column-two form div.fields div.field-input label{
				width: 100px;
			}
			
			body.employers-newsletter-subscription div#content div.column-two form div.fields div.field-input input{
				width: 245px;
			}
		
		body.employers-newsletter-subscription form fieldset label.after-fields{
			padding-left: 18px;
			padding-top: 30px;
		}
			
	body.employers-newsletter-subscription form button{
			background: transparent url(/images/buttons/subscribe.gif) 0 0 no-repeat;
			float: left;
			height: 30px;
			overflow: hidden;
			text-indent: -99999px;
			width: 399px;
	}

body.employers-newsletter-subscription div#content div.column-three{
	margin-left: 0;
	padding-top: 60px;
}


/**
 *	5.4.12 Employers Branches / Managed Services
 *	body.employers-branches-managed-services
 */

body.employers-branches-managed-services div#content div.column-one img{
	margin-top: 255px;
}

body.employers-branches-managed-services div#content div.column-two{
	width: 457px;
}

	body.employers-branches-managed-services div#content div.column-two p.intro{
		width: 397px;
	}

	body.employers-branches-managed-services div.branch-listing h2{
		padding-top: 33px;
	}
	
	
	body.employers-branches-managed-services div#content div.branch-listing ul{
		margin-bottom: 40px;
		margin-top: -15px;
	}
	
	body.employers-branches-managed-services div#content div.branch-listing + p.intro{
		padding-bottom: 0;
	}

body.employers-branches-managed-services div#content div.column-three{
	margin-left: -22px;
	padding-top: 25px;
}

		

/**
 *	5.5 Careers section 
 *	body.careers
 */
body.careers div#content div.nav{
	background-color: #90C;
	background-position: -512px bottom; 
} 

body.careers div#content div.nav ul li.active,
body.careers div#content div.nav ul li.active a{
	color: #F9F;
}

body.careers form legend,
body.careers h2.alt,
body.careers h3.alt,
body.careers dt{
	color: #90C;
}

/**
 *	5.5.1 Careers Home
 *	body.careers-home
 */
 
body.careers-home div.column-one h2,
body.careers-home div.column-one p {
 	padding-left: 0px;
}
 
body.careers-home div.column-three div#how-can-we-help{ 
	background-color: #90C;
	background-image: url(/images/layout/careers-how-can-we-help.jpg);
	text-indent: -99999px;
}

	body.careers-home div.column-three div.how-can-we-help-active{
		background-position: -276px 0 !important;
	}

	body.careers-home div.column-three div#how-can-we-help h2{
		height: 364px;
		padding: 0;
	}
	
	body.careers-home div.column-three div#how-can-we-help div.telephone-action{
		left: -99999px;
		position: absolute;
		top: -99999px;
	}
	

body.careers-home img#image-2{
	right: -110px;
}

/**
 *	5.5.2 Careers Why Top Gar
 *	body.careers-why-top-gear
 */
body.careers-why-top-gear div#content div.column-one img{
	top: 120px;
}

body.careers-why-top-gear div#content div.column-two img.right{
	right: 20px;
	top: 20px;
}

/**
 *	5.5.3 Careers News
 *	body.careers-news
 */
body.careers-news blockquote.em p{
	color: #90C;
}

/**
 *	5.5.4 Careers Milestones
 *	body.careers-milestones
 */
body.careers-milestones li{
	
}


	body.careers-milestones div#content li#milestone-2001 img{
		bottom: 20px;
		left: -285px;
		position: absolute;
	}
	
body.careers-milestones div#content li#milestone-2010{
	float: none;
}
	
body.careers-milestones div#content p.intro{
	clear: both;
	width: 400px;
}
/**
 *	5.5.5 Careers Apply (Upload CV)
 *	body.careers-apply
 */
body.careers-apply div#content div.column-one h2{
	padding: 20px 0 12px;
} 

body.careers-apply div#content div.column-one p{
	padding: 0 0 20px;
} 

body.careers-apply div#content div.column-two{
	width: 450px;
}
	
	body.careers-apply div#content div.column-two form{
		padding-top: 15px;
	}

		body.careers-apply div#content div.column-two form div.fields{
			padding-top: 13px;
		}
		
		body.careers-apply form fieldset label.after-fields{
			padding-left: 18px;
			padding-top: 30px;
		}
	
		/* Upload CV button */
		body.careers-apply div#content div.column-two form button{
			background: transparent url(/images/buttons/upload-cv.gif) 0 0 no-repeat;
			float: left;
			height: 31px;
			overflow: hidden;
			text-indent: -99999px;
			width: 394px;
		}

body.careers-apply div#content div.column-three{
	margin-left: 13px;
	width: 250px;
}

div#cv-help{
	background: transparent url(/images/layout/cv-help.gif) 0 0 no-repeat;
	height: 188px;
	overflow: hidden;
	text-indent: -99999px;
	width: 250px;
}

	div#cv-help a{
		display: block;
	}


/**
 *  5.5.6 Careers Current vacaancies > More details
 *  body.careers-current-vacancies-more
 */
 
body.careers-current-vacancies-more div.column-two h2{
    color: #069;
    font-size: 12px;
    font-weight: bold;
}
    
    body.careers-current-vacancies-more div.column-two h2 span{
        color: #666;
    }
 
body.careers-current-vacancies-more div#interested{
    background: transparent url(/images/buttons/apply.gif) 100% 0 no-repeat;
    float: left;
    margin: 10px 0;
    width: 100%;
}

    body.careers-current-vacancies-more div#interested h2{
        float: left;
        font-size: 18px;
        padding-right: 0;
        padding-top: 5px;
        width: 250px;
    }
    
    body.careers-current-vacancies-more div#interested p{
        float: left;
        padding: 0;
        width: 140px;
    }
    
        body.careers-current-vacancies-more a.apply{
            display: block;
            height: 26px;
            width: 140px;
        }

body.careers-current-vacancies-more div#interested + p{
    clear: both;
}

body.careers-current-vacancies-more p.arrow{
    background-image: url(/images/icons/arrow-purple.gif);
}

	
/**
 *  5.6 Admin section 
 *  body.admin
 */
body.admin div#content div.nav{
    background-color: #90C;
    background-position: -512px bottom; 
} 

body.admin div#content div.nav ul li.active,
body.admin div#content div.nav ul li.active a{
    color: #F9F;
}

body.admin form legend,
body.admin h2.alt,
body.admin h3.alt,
body.admin dt{
    color: #90C;
}

body.admin a {
    color: #069;
    text-decoration: underline;
} 

body.admin div#content div.column-two{
    width: 700px;
}

body.admin div#content div.column-three{
    width: 5px;
}

body.admin div#content div.nav li ul li.active a{
    background: #90C;
    font-style: italic;
    font-weight: bold;
}

body.admin table tr th {
    text-align: left;
    padding: 5px;
}

body.admin table tr td {
    text-align: left;
    vertical-align: middle;
    padding: 5px;
}

body.admin table tr td.odd {
    background: #ececec;
}

body.admin table tr td.even {
    background: #fff;
}

body.admin form {
    margin: 0px;
    padding: 0px;
}

body.admin td form {
    margin: 0px;
    padding: 0px;
}

body.admin span.required{
	color: #E50207;
	font-weight: bold;
	margin-left: 0;	
}

body.admin form label{
	margin-right: 5px;
}

body.admin table{
	clear: both;
}

body.admin form fieldset input.date-day{
	width: 2em;
	margin-right: 5px;
}
			
body.admin form fieldset input.date-year{
	width: 4em;
	margin-right: 5px;
}

/**
 *  5.6.1 Admin Login
 *  body.admin-login
 */
	
	body.admin-login .after-fields a {
		float: left;
		display: block;
		padding-top: 10px;
	}
	
    body.admin-login div#content div.column-one{
        margin-right: 9px;
        width: 256px;
    }
    
    body.admin-login div#content div.column-two{
        padding: 20px 0;
        width: 417px;
    }
    
    body.admin-login div#content div.column-three{
        margin-left: 20px; /* IE6 won't like this */
        padding: 4px 0 20px;
        width: 275px;
    }

    body.admin-login div#content div.column-two form div.fields{
        padding-top: 20px;
        padding-bottom: 20px;
        background: #CCE0EB url(/images/layout/form.gif) 0 0 no-repeat;
    }
	
	body.admin-login div#content div.column-two form input{
		width: 180px;
	}
	
    body.admin-login div#content div.column-two form button{
            background: transparent url(/images/buttons/login.gif) 0 0 no-repeat;
            float: left;
            height: 30px;
            overflow: hidden;
            text-indent: -99999px;
            width: 399px;
    }

    body.admin-login div#content div.column-two form button.submit{
            background: transparent url(/images/buttons/submit.gif) 0 0 no-repeat;
    }

    body.admin-login form {
        clear: both;
        padding: 5px 20px 20px 10px;
    }
    
	

/**
 *  5.6.1 Admin Home
 *  body.admin-home
 */

    body.admin-home form {
        clear: both;
        padding: 5px 20px 0px 20px;
    }

    body.admin-home form.listing {
        clear: both;
        padding: 0px;
    }

    body.admin-home div#content div.column-two form div.fields{
        padding-top: 10px;
        background: #CCE0EB url(/images/layout/form.gif) 0 0 no-repeat;
    }

    body.admin-home div#content div.column-two form button{
            background: transparent url(/images/buttons/submit.gif) 0 0 no-repeat;
            float: left;
            height: 30px;
            overflow: hidden;
            text-indent: -99999px;
            width: 399px;
    }

    body.admin-home div#content div.column-two form button.add{
            background: transparent url(/images/buttons/add.gif) 0 0 no-repeat;
    }

    body.admin-home div#content div.column-two form button.download-csv{
            background: transparent url(/images/buttons/download-csv.gif) 0 0 no-repeat;
    }

    body.admin-home form.big {
        clear: both;
        width: 600px;
        padding: 5px 20px 0px 20px;
    }

    body.admin-home div#content div.column-two form.big fieldset div.fields{
        background: #CCE0EB;
        float: left;
        padding: 10px 0;
        width: 729px; /* or 397px - CHECK THIS */
    }


    /* Same as label.instructions but used becasue IE6+7 does't like CSS3's + selctor */
    body.admin-home div#content div.column-two form.big fieldset label.after-fields{
        background: -729px -20px no-repeat;
        clear: both;
        padding-top: 13px;
    }

    body.admin-home div#content div.column-two form.big button{
            background: transparent url(/images/buttons/submit-big.gif) 0 0 no-repeat;
            float: left;
            height: 30px;
            overflow: hidden;
            text-indent: -99999px;
            width: 729px;
    }

    body.admin-home div#content div.column-two form.big fieldset div.fields div.field{
        float: left;
        padding: 5px 15px 0 18px;
        width: 700px;
    }

    body.admin-home div#content div.column-two form.big fieldset div.fields div.field div.field-radio{
        padding-top: 0;
        width: 100px;
    }

    body.admin-home div#content div.column-two form.big fieldset div.fields div.field-checkbox{
        padding-left: 8px;
        width: 100px;
    }

    body.admin-home form.big fieldset div.fields textarea {
        float: left;
        width: 600px;
        height: 150px;
    }
    
}


div#footer-awards {
	float:				right;
}

div#footer-awards .wrapper {
	float:				right;
	margin-left:		20px;
	margin-top:			28px;
	height:				90px;
}

div#footer-awards a {
	border:				1px solid blue;
}

div#footer-awards div.wrapper div.footer-fta {
	background: 		url(/images/content/logos/index/fta.jpg) 0 0 no-repeat;
	width:				43px;
	height:				90px;
	margin-right:		20px;
	display:			block;
	border:				none;
	cursor:				pointer;
}

div#footer-awards div.wrapper div.footer-rec {
	background: 		url(/images/content/logos/index/rec.jpg) 0 0 no-repeat;
	width:				74px;
	height:				90px;
	display:			block;
	border:				none;
	cursor:				pointer;
}

div#footer-awards div.wrapper div.footer-recruiter {
	background: 		url(/images/content/logos/index/recruiter.jpg) 0 0 no-repeat;
	width:				138px;
	height:				90px;
	display:			block;
	border:				none;
}

div#footer-awards div.wrapper div.footer-cpc {
	background: 		url(/images/content/logos/index/drivercpc.jpg) 0 0 no-repeat;
	width:				127px;
	height:				90px;
	display:			block;
	border:				none;
}

div#footer-awards div.wrapper div.footer-team {
	background: 		url(/images/content/logos/index/team.jpg) 0 0 no-repeat;
	width:				138px;
	height:				90px;
	display:			block;
	cursor:				pointer;
}


.InputElement {

}

.ActiveInputElement {
	background: #eee ! important;
	color: black ! important;
	border: 1px solid green ! important;
}