/*
	Purpose:	Global CSS Document for Cartwheel Recruitment
	Site:		www.cartwheel.co.uk
	Author:		Distinction Limited
	Version:	1.00 (22 March 2007)
	Version:	2.00 (19 March 2009)

	
	Revisions:	None
*/

/* --------------------------------- */
/* STANDARD TAGS ------------------- */
/* --------------------------------- */

body {
	margin: 0; 
	padding: 0; 
	font-family: "Century Gothic", Verdana, Arial, Helvetica, sans-serif;
	font-size: 0.85em;
	width: 100%;
	height: 100%;
	background: url(../images/bg3.gif) repeat-x #d7d7bd;
	}

h1 {
	font-family: "Century Gothic", Verdana, Arial, Helvetica, sans-serif;
	font-size: 2.2em;
	color: #fff;
	font-weight: normal;
	margin-top: 10px;
	margin-bottom: 10px;
	}

h2 {
	font-family: "Century Gothic", Verdana, Arial, Helvetica, sans-serif;
	font-size: 1.1em;
	color: #fff;
	font-weight: bold;
	margin-top: 5px;
	margin-bottom: 5px;
	}
	
h3 {
	font-family: "Century Gothic", Verdana, Arial, Helvetica, sans-serif;
	font-size: 2em;
	color: #fff;
	font-weight: normal;
	margin-top: 5px;
	margin-bottom: 5px;
	}

p,
li,
td {
	font-family: "Century Gothic", Verdana, Arial, Helvetica, sans-serif;
	font-size: 0.9em;
	color: #fff;
	font-weight: normal;
	line-height: 140%;
	list-style-type: square;
	margin-bottom: 15px;
	}

ul {
	margin-left: 20px;
	padding: 0;
	padding-bottom: 15px;
}


ul li {
	marign-left: 50px;
	padding-left: 0;
	margin: 0;
}
	
blockquote {
	quotes: none;
	font-style: italic;
	}

blockquote:before, blockquote:after, q:before, q:after {
	content: '';
	content: none;
	}

blockquote {
	padding: 0.5em 3.6em 0.1em 0;
	position: relative;
	clear: both;
	}

blockquote p {
	position: relative;
	clear: both;
	font-size: 1.3em;
	background: url(../images/start-speech.gif) top left no-repeat;
	padding-left: 2.5em;
	width: 92%;
	}

#container {
	position: absolute;
	left: 50%;
	top: 50%;
	width: 940px;
	height: 570px;
	margin-left: -500px; /* half of width */
	margin-top: -315px;  /* half of height */
	border: 30px solid white;
	background-color: #fff;
	}
	
#header {
	position: relative;
	width: 940px;
	height: 95px;
	background-color: #fff;
	}
	
#logo {
	position: relative;
	float: right;
	margin: 0;
	padding: 0;
	width: 300px;
	}

#navigation {
	position: relative;
	float: left;
	width:640px;
	}
	
.menu { width:640px; position:relative; z-index:100; float:right;}
/* hack to correct IE5.5 faulty box model */
* html .menu {width:640px; w\idth:640px;}
/* remove all the bullets, borders and padding from the default list styling */
.menu ul {padding:0;margin:0;list-style-type:none; list-style: none;}
.menu ul ul {list-style-type:none; list-style: none; margin:0; padding:0;}
/* float the list to make it horizontal and a relative positon so that you can control the dropdown menu positon */
.menu li.navHome {float:left; position:relative; list-style-type:none; list-style: none;}
.menu li.navValues {float:left;position:relative; margin-left:12px;list-style-type:none; list-style: none;}
.menu li.navApproach {float:left;position:relative; margin-left:12px;list-style-type:none; list-style: none;}
.menu li.navTeam {float:left;position:relative; margin-left:12px;list-style-type:none; list-style: none;}
.menu li.navClient {float:left;position:relative; margin-left:12px;list-style-type:none; list-style: none;}
.menu li.navCandidate {float:left;position:relative; margin-left:12px;list-style-type:none; list-style: none;}
.menu li.navTestimonials {float:left;position:relative; margin-left:12px;list-style-type:none; list-style: none;}
.menu li.navJobs {float:left;position:relative; margin-left:12px;margin-top:0; margin-bottom:0; list-style-type:none; list-style: none;}
.menu li.navSubJobs {float:left;position:relative; line-height: 1.5em; margin-left:0; margin-top:0; margin-bottom:0; list-style-type:none; list-style: none; z-index:99; width: 80px;}
.menu li.navContact {float:left;position:relative; margin-left:4px; padding-left: 4px; list-style-type:none; list-style: none; border-left: 1px solid #605a00;}


.menu a, .menu a:visited {display:block;text-decoration:none; color:#605a00;}

/* style the second level background */
.menu ul ul a.drop, .menu ul ul a.drop:visited {background:#fff;}
/* style the second level hover */
.menu ul ul a.drop:hover{ color:#d37612; background:#fff; }
.menu ul ul :hover > a.drop { color:#d37612; background:#fff;}
/* style the third level background */
.menu ul ul ul a, .menu ul ul ul a:visited {background:#fff;}
/* style the third level hover */
.menu ul ul ul a:hover {background:#fff;}


/* hide the sub levels and give them a positon absolute so that they take up no room */
.menu ul ul {visibility:hidden;position:absolute;height:0;top:15px;left:0;}

/* style the table so that it takes no ppart in the layout - required for IE to work */
.menu table {position:absolute; top:0; left:0; border-collapse:collapse;;}

/* style the second level links */
.menu ul ul a, .menu ul ul a:visited {background:#fff; color:#605a00; padding:0; margin:0;}

/* style the top level hover */
.menu a:hover, .menu ul ul a:hover{color:#d37612; background:#fff;}
.menu :hover > a, .menu ul ul :hover > a {color:#d37612; background:#fff;}

/* make the second level visible when hover on first level list OR link */
.menu ul li:hover ul,
.menu ul a:hover ul{visibility:visible; }

_a.hidden { visibility: hidden;}
	

#content {
	position: relative;
	width: 620px;
	height: 350px;
	float: left;
	border-right: 20px solid white;
	overflow: auto;
	}
	
#contentwide {
	position: relative;
	width: 940px;
	height: 456px;
	float: left;
	overflow: auto;
	}
	
#contentXmas {
	position: relative;
	width: 700px;
	height: 400px;
	float: left;
	text-align: center;
	}
	
#leftCol {
	float: left;
	position: relative;
	border-right: 20px solid white;
	width: 340px;
	height: 390px;
	overflow: auto;
	}

#rightCol {
	float: right;
	position: relative;
	width: 340px;
	height: 390px;
	overflow: auto;
	}
	
.ThreeColLeft {
	float: left;
	position: relative;
	padding-left: 130px;
	width: 225px;
	height: 80px;
	overflow: auto;
	text-align: center;
	}

.ThreeCol {
	float: left;
	position: relative;
	width: 225px;
	height: 80px;
	overflow: auto;
	text-align: center;
	}
	
.twoColLeft {
	position: relative;
	float: left;
	width: 340px;
	}
	
.twoColRight {
	position: relative;
	float: right;
	width: 270px;
	}


#buttons {
	position: relative;
	width: 300px;
	height: 456px;
	float: right;
	}

.orange {
	background:  url(../images/cw_trans_orange.gif) bottom right no-repeat #ee7d0c;
	scrollbar-base-color: #ee7d0c; 
	scrollbar-arrow-color: #fff;
	scrollbar-DarkShadow-Color: #ee7d0c; 
	}
	
.orangeNoBG {
	background-color: #ee7d0c;
	scrollbar-base-color: #ee7d0c; 
	scrollbar-arrow-color: #fff;
	scrollbar-DarkShadow-Color: #ee7d0c; 
	}
	
.orangeText {
	color: #ee7d0c;
	}

.brown {
	background:  url(../images/cw_trans_brown.gif) bottom right no-repeat #b3a52c;
	scrollbar-base-color: #b3a52c;
	scrollbar-arrow-color: #fff;
	scrollbar-DarkShadow-Color: #ac703d; 
	}
	
.brownNoBG {
	background-color: #b3a52c;
	scrollbar-base-color: #b3a52c; 
	scrollbar-arrow-color: #fff;
	scrollbar-DarkShadow-Color: #ac703d; 
	}

.corpGreen {
	background:  url(../images/cw_trans_green.gif) bottom right no-repeat #605a00;
	scrollbar-base-color: #605a00; 
	scrollbar-arrow-color: #fff;
	scrollbar-DarkShadow-Color: #605a00; 
	}

.corpGreenNoBG {
	background-color: #605a00;
	scrollbar-base-color: #605a00; 
	scrollbar-arrow-color: #fff;
	scrollbar-DarkShadow-Color: #605a00; 
	}

#content h1,
#content h2,
#content h3,
#content p,
#content li,
#contentwide h1,
#contentwide h2,
#contentwide p,
#contentwide li,
#buttons h1,
#buttons h2,
#buttons p,
#buttons li,
#leftCol h1,
#leftCol h2,
#leftCol p,
#leftCol li,
#rightCol h1,
#rightCol h2,
#rightCol p,
#rightCol li,
#testimonial h1,
#testimonial h2,
#testimonial li

 {
	margin-left: 10px;
	margin-right: 10px;
	color: #fff;
	}
	
#content a:link,
#content a:visited,
#contentwide a:link,
#contentwide a:visited,
#buttons a:link,
#buttons a:visited
 {
	color: #fff;
	text-decoration: none;
	border-bottom: 1px solid #fff;
	}
	
#content a:hover,
#contentwide a:hover, 
#buttons a:hover,
#buttons a:hover {
	color: #605a00;
	text-decoration: none;
	border-bottom: 1px solid #605a00;
	}
	
#testimonial {
	position: relative;
	float: left;
	height: 86px;
	width: 620px;
	border-right: 20px solid white;
	border-top: 20px solid white;
	color:#000000;
	}
	
#testimonial a:link,
#testimonial a:visited {
	color: #fff;
	text-decoration: none;
}

#testimonial a:hover {
	color: #fff;
	text-decoration:underline;
}
	
#footer {
	position: relative;
	float: left;
	clear: both;
	width: 100%;
	height: 15px;
	font-size: 0.8em;
	font-family: Arial, Helvetica, sans-serif;
	padding-top: 15px;
	}
	
#footer a:link,
#footer a:visited {
	color: #605a00;
	text-decoration: none;
	border-bottom: 1px solid #605a00;
	}
	
#footer a:hover {
	color: #d37612;
	text-decoration: none;
	border-bottom: 1px solid #d37612;
	}
	
#footer #copyright {
	float: left;
	width: 500px;
	}
	
#footer #credits {
	float: right;
	width: 200px;
	text-align: right;	
	}

div.teamMember {
	position: relative;
	clear: both;
	margin: 0 auto;
	width: 750px;
	}

div.teamMember p a:link,
div.teamMember p a:visited {
	color: #fff;
	text-decoration: none;
	border-bottom: 1px solid #fff;
	}

div.teamMember p a:hover {
	color: #fff;
	text-decoration: none;
	border-bottom: 0px;
	}
	
div.teamDetails {
	position: relative;
	float: left;
	width: 520px;
	}
	
div.teamPictures {
	margin: 0px auto;
	position: relative;
	clear: both;
	}
	
div.teamPicture {
	position: relative;
	width: 150px;
	float: left;
	text-align: center;
	color: #fff;
	}

div.teamPicture a:link,
div.teamPicture a:visited,
div.teamPicture a:hover {
	border-bottom: none;
	text-decoration: none;
	color: #fff;
	}

div.teamPicture img {
	margin: 10px 10px 0px 10px;
	border: 1px solid #000;
	}
	
img.portraitImageLeft {
	float: left;
	margin-right: 10px;
	margin-bottom: 150px;
	}
	
.clear {
	clear: both;
}