/* CSS Document */


/* navigation menu stauff */

@import url(suckerfish.css);

/* General HTML tag redefinitions */

a { color: #231e52;  }
a:hover { color: #574d80; text-decoration: underline; }
a img { border: none;}
body {  font: normal 1em Arial, Helvetica, "Lucida Grande", sans-serif;  margin: 0; background: url(/_img/backgrounds/body.gif) top left repeat; }
body#popup { background: none; }
form { margin: 0; padding: 0; }
hr { margin-bottom: 2em; }
#tworight hr { margin-bottom: 0.5em; }
h1 { font-weight: normal; font-size: 2em; color: #333;  margin: 0 0 0.3em; padding: 0;  }
#sole h1 { background: url("/_img/backgrounds/header.jpg") repeat-x scroll 0 0 transparent; font-size: 1.8em; /*background: #483d74;*/ color: #fff; padding: 10px;}
h2 { font-weight: normal; font-size: 1.4em; color: #333;  padding: 0;  }
iframe { border: 1px solid #333; }
li { color: #333; } 
p { margin: 0.5em 0 1em 0; color: #333; line-height: 1.4; } 
#left p, #bleft p, #right p { margin: 0.5em 0; } 
table { margin-bottom: 20px; }

p.urgent { background: #ffc; border: 1px solid #c00; color: #c00; font: 1.0em Tahoma, Arial, sans-serif; margin: 10px; padding: 10px; }

/* thank you pages */

#sole p.thanks { background: url(/_img/backgrounds/checked.png) no-repeat 10px 8px #efedf6; font-size: 1.1em; font-weight: bold; padding: 10px 10px 10px 45px;}
#sole p.options { margin: 20px 0; padding: 10px 0; border-top: 1px dotted #ccc}
#sole a.twitter {  background: url(/_img/backgrounds/twitter-bird.png) no-repeat 0 0 transparent; padding: 3px 10px 5px 28px;}
#sole a.blog {  background: url(/_img/backgrounds/blog.png) no-repeat 0 0 transparent; padding: 3px 10px 5px 28px;}
#sole a.news {  background: url(/_img/backgrounds/news.jpg) no-repeat 0 0 transparent; padding: 0 10px 4px 20px;}

/* positioning the page in the center of the viewport */

#container {
  /* width: 1166px; */
  /* background: url(/_img/backgrounds/container.jpg) repeat-y; */
  width: 1024px;
  background: url(/_img/backgrounds/container1024w.jpg) repeat-y;
  margin:0 auto;
  }
#containerfoot   {
  /* width: 1166px; */
  /* background: url(/_img/backgrounds/containerfoot.jpg) no-repeat; */
  width: 1024px;
  background: url(/_img/backgrounds/containerfoot1024w.jpg) no-repeat;
  margin: 0 auto;
  height: 23px;
  }

/* page header elements (excluding navbar) */

#outerheader {  background: url(/_img/backgrounds/header.jpg) repeat-x; }
#innerheader { height:132px; width:980px; margin:0 auto; background: url(/_img/backgrounds/header_watermark.jpg) no-repeat right top;	}


#header a:link, #footer a:link, #header a:visited, #footer a:visited { text-decoration: none; font-weight: normal; }


#youarehere { color: #999; font-size: 0.75em;  border-bottom: 1px dotted #ccc; border-top: 1px dotted #ccc; margin: 20px auto; padding: 5px 20px; background-color: #efefef;  width: 940px;
}
#youarehere a { color: #999;}


/* navbar container */

#navigation { 
  width: 980px;
  text-align:center;
  margin: 0 auto; 
  position: relative;
  z-index: 2; 
  }


#content { margin: 0 auto; width: 960px; padding: 0 10px; position: relative; z-index: 1; }
#content_popup { margin: 0 auto; padding: 0; position: relative; z-index: 1; }

/* this should be able to be added in to the top of #content (with appropriate padding, but IE is is weirding out and padding top and bottom of content - even where we specify padding-top!!! To investigate.... */

.graphic {  background: url(../_img/backgrounds/home/city_dusk.jpg) top left no-repeat #fff; border: 2px solid #231e52; width: 541px; height: 269px; -moz-border-radius: 8px; -webkit-border-radius: 8px;}
.graphic#commuters1 {  background: url(../_img/backgrounds/home/commuters1.jpg) top left no-repeat #fff; }
.graphic#commuters2 {  background: url(../_img/backgrounds/home/commuters2.jpg) top left no-repeat #fff; }
#sole .graphic#commuters2, #sole .graphic#commuters2 {  background: url(../_img/backgrounds/commuters_wide.jpg) top left no-repeat #fff; }
.graphic#stpauls {  background: url(../_img/backgrounds/home/st_pauls.jpg) top left no-repeat #fff; }
.graphic#citydusk {  background: url(../_img/backgrounds/home/city_dusk.jpg) top left no-repeat #fff; }
.graphic#rooftops {  background: url(../_img/backgrounds/home/rooftops.jpg) top left no-repeat #fff; }
.graphic#westminster {  background: url(../_img/backgrounds/home/westminster.jpg) top left no-repeat #fff; }
.graphic#towerbridge {  background: url(../_img/backgrounds/home/tower_bridge.jpg) top left no-repeat #fff; }
.graphic#bankengland {  background: url(../_img/backgrounds/home/bank_england.jpg) top left no-repeat #fff; }
.graphic#thamesbarrier {  background: url(../_img/backgrounds/home/thames_barrier.jpg) top left no-repeat #fff; }

#wideRight .graphic, #jobsright .graphic { width: 626px;}

#footer {
	font-size: 0.8em; 
	margin: 8px auto 0 auto;
	padding: 10px;
	width: 960px;
	background: url(/_img/backgrounds/footer.jpg) repeat-x #ded7f9;
	-moz-border-radius-topleft: 8px;
	-webkit-border-top-left-radius: 8px;
	-moz-border-radius-topright: 8px;
	-webkit-border-top-right-radius: 8px;
	}



/* styles for the three column layout */

#twoCol, #twocolLeft { width: 585px; float: left; }

#left { width: 165px; padding: 0; float: left; font: 0.7em Tahoma, Arial, sans-serif; }


#left a:link, #right a:link, #left a:visited, #right a:visited { font-weight: normal;  }
#left a:hover. #right a: hover { text-decoration: underline; color: #09f; }


#left h1, #right h1, #bleft h1 { color: #333; font-size: 1.1em; margin-top: 1em; background-color: #eeeeff; border: 1px solid #ccf; padding: 3px; }
#left h2, #right h2, #bleft h2 { color: #333; font-size: 1.1em; margin-top: 1.5em; background-color: #eeeeff; border: 1px solid #ccf; padding: 3px; }


#left ul { list-style: none; padding-left: 0; margin-left: 0; }
#left li { background-image: url(/_img/bullet_l.gif); background-repeat: no-repeat; background-position: 0 50%; padding-left: 14px; margin: 0.7em 0;  }
li h2 { font: normal 1.0em Tahoma, Arial, sans-serif; margin: 0.5em 0; }
#middle { width: 400px; margin: 0px 0px 0px 185px; font: 0.8em Tahoma, Arial, sans-serif;   }
#right { width: 165px; float: right; padding: 0; font: 0.7em Tahoma, Arial, sans-serif; }



/* styles for  two column layout a */

#twoleft { width: 630px; padding: 0; float: left; font-size: 0.9em; }
#tworight { width: 310px; float: right; font-size: 0.8em; }


/* styles for  two column layout b */

#narrowLeft, #jobsleft { width: 310px; float: left; font-size: 0.8em; margin-right: 20px; }

#narrowLeft .navLeft, #jobsleft .latestjobs, #tworight .latestjobs { background: url(/_img/backgrounds/navleft.png) bottom left no-repeat; padding: 0 10px 20px; margin: 0 0 20px; }
.navLeft p { margin: 0.5em 0; }
.navLeft p.latestjob { border-bottom: 1px dotted #999;}

#jobsleft .latestjobs h1  { background: url(/_img/backgrounds/jobs_h1.png) top left no-repeat; color: #fff; margin: 0 -10px; padding: 10px; font-size: 1.1em; text-shadow: 0 -1px 0 #455901; }
#contact .latestjobs h1  { background: url(/_img/backgrounds/contact_h1.png) top left no-repeat; color: #fff; margin: 0 -10px; padding: 10px; font-size: 1.1em; text-shadow: 0 -1px 0 #a49c00; }

.navLeft h1 { margin: 0 -10px; padding: 10px; font-size: 1.1em; text-shadow: 0 -1px 0 #000; color: #fff;  }
#candidates #narrowLeft .navLeft h1 { background: url(/_img/backgrounds/candidates_h1.png) top left no-repeat; text-shadow: 0 -1px 0 #000; }
#candidates #tworight .latestjobs h1 { background: url(/_img/backgrounds/candidates_h1.png) top left no-repeat; color: #fff; margin: 0 -10px; padding: 10px; font-size: 1.1em; text-shadow: 0 -1px 0 #a49c00; }
#about #narrowLeft .navLeft h1, #sitemap #narrowLeft .navLeft h1 { background: url(/_img/backgrounds/about_h1.png) top left no-repeat; }
#clients .navLeft h1 { background: url(/_img/backgrounds/clients_h1.png) top left no-repeat; color: #fff; text-shadow: 0 -1px 0 #882b68; }

.highlight { background: url(/_img/backgrounds/clients_h1.png) top left no-repeat !important; color: #fff; text-shadow: 0 -1px 0 #882b68; font-size: 1.3em !important;}

/* styles for the jobs listig layout */


#jobsright, #wideRight { width: 630px; padding: 0; float: left; font-size: 0.9em; }
p.jobsector { margin: 15px 0 0 0; padding: 2px 0; color: #999; font-size: 0.8em; border-top: 1px solid #999; text-align: right; }
p.jobtitle { margin: 0; padding: 10px 0 2px 0; }
p.jobtitle a:link { color: #039; }
p.jobtitle a:visited { color: #69f; }
p.jobdescrip { margin: 0; padding: 4px 0 2px 0; }
p.jobspecs { color: #333; margin: 0; padding: 0;  }
p.jobdate { margin: 0; padding: 0; color: #999; font-size: 0.8em; }


/* single column layout */

#sole { padding: 10px 0; font-size: 0.9em; }

/* miscellaneous styles */

.announce { border: 1px solid #c00; padding: 5px; }
.announce h2 { margin-top: 0; padding-top: 0; }
.clear {clear: both; font: 0px Verdana, Arial, Helvetica, sans-serif; color: #fff; height: 0px; }

.grey { color: #999; }

p.bordert { border-top: 1px solid #333; padding-top: 0.5em; }
.smaller { font-size: 0.8em; color: #666; }
.smallerleft { font-size: 0.8em; color: #999; float: left; }


#left .textbox { width: 126px; background-color: #efefef; border: 1px solid #06c; }
fieldset { margin-bottom: 1em; border: 1px solid #9e90d5; padding: 10px;  }
fieldset p { line-height: 1; /*margin: 1em 0 0.3em;*/; }
legend { 0.8em Tahoma, Arial, sans-serif; color: #574d80; }
label { margin: 1em 0 0.3em 0; /*color: #666;*/ display: block; color: #483d74; font-weight: bold;}
.radio label, .checks label, label.radio, label.checks { display: inline; margin: 0; }
.button { background: url(/_img/backgrounds/button_pink.png) left top repeat-x; color: #fff; border: 1px solid #830042; font-size: 1.1em; padding: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; text-shadow: 0 -1px 0 #830042; }
.button:hover { background: url(/_img/backgrounds/button_pink.png) left -50px repeat-x; color: #fff; text-shadow: 0 -1px 0 #ac0054; }
.button2 { background: url(/_img/backgrounds/button2.png) left top repeat-x; color: #fff; border: 1px solid #2b2549; font-size: 1.1em; padding: 5px; -moz-border-radius: 5px; -webkit-border-radius: 5px; text-shadow: 0 -1px 0 #2b2549; }
.button2:hover { background: url(/_img/backgrounds/button2.png) left -50px repeat-x; color: #fff; text-shadow: 0 -1px 0 #5b4f99; }
.textbox { background-color: #efefef; border: 1px solid #6c0; }
.textbox95p { width: 95%; background-color: #efefef; border: 1px solid #000; padding: 1px;  }
.textbox50p { width: 50%; background-color: #efefef; border: 1px solid #000; padding: 1px; }
.textbox145 { width: 280px; background-color: #efefef; border: 1px solid #000; padding: 1px; }
.textbox100 { width: 100px; background-color: #efefef; border: 1px solid #000; padding: 1px; }
.textbox105 { width: 105px; background-color: #efefef; border: 1px solid #000; padding: 1px; }
.textbox_home { width: 140px; background-color: #fff; border: 1px solid #000; padding: 3px 0px;  font-size: 0.9em;}
.textbox85 { width: 85px; background-color: #efefef; border: 1px solid #000; padding: 1px; }
.textbox90 { width: 90px; background-color: #efefef; border: 1px solid #000; padding: 1px; }
#twoleft select { width: 145px; background-color: #efefef; border: 1px solid #000; }
legend { font: bold 1.0em Verdana, Arial, Helvetica, sans-serif; color: #333;  }
.formleft { width: 48%; padding-right: 1%; float: left; }
.formright { width: 48%; padding-left: 1%; float: right; }
.required { color: #c00; }


/* styles used on the CV */

.cv { width: 450px; margin: 0 auto; border: 1px solid #000; font-family: Georgia, Times New Roman, Times, serif; padding: 10px;  }
.cv p { margin: 0 0.4em }
.commentry { border-bottom: 1px dotted #c00; cursor: help; }
#cv h1, #cv h2 { font-family: Georgia, Times New Roman, Times, serif; }
#cv h2 { padding: 5px 0px; border-bottom: 1px solid #999; }


/* warning messages */

.warning{

display:inline;

color:#c00;

}
#registrationform .warning{
	display:block;
	color:#c00;
	font-weight: bold;
}
#registrationform .reqd{
	color:#c00;
}
#timesheetform .warning{
	display:block;
	color:#c00;
	font-weight: bold;
}
#timesheetform .reqd{
	color:#c00;
}
#timesheetform .hint {
	color: #999;
}

/* latest jobs */

.latestjob { }
.latestjob .added { color: #999; font-size: 0.9em; }
.latestjob .sector { color: #999; font-size: 0.9em; float: right;}





/* credit where credit's due */

#credit { width: 980px; margin: 20px auto; padding: 0; font: normal 0.7em Verdana, Arial, Helvetica, sans-serif; text-align: right; }
#credit a:link, #credit a:visited { font-weight: normal; text-decoration: none;   }
#credit a:hover { text-decoration: underline; }

/* home page styles */

#leftcol {
  width: 550px;
	float:left;
  }

#rightcol { 
  width: 405px;
  float:right;
  }

#homepage .latestjobs, #homepage .latestnews {background: url(/_img/backgrounds/home_latestjobs.jpg) bottom left no-repeat; font-size: 0.7em; margin: 0 0 15px; padding: 0 10px 35px; position: relative; height: 314px; overflow-y: hidden;}
#homepage .latestjobs h1, #homepage .twitter h1, .latestnews h1 {  background: url(/_img/backgrounds/homepage_latest_jobs_h1.jpg) top left no-repeat; color: #fff; margin: 0 -10px; padding: 10px; font-size: 1.4em; text-shadow: 0 -1px 0 #000;}
#homepage .latestjobs a {color:#333366;font-size:1.1em;font-weight:bold;text-decoration:none; }
#homepage .latestjobs a:hover {color:#574d80;font-size:1.1em;font-weight:bold;text-decoration:underline; }
#homepage .latestjobs p { margin: 1em 0; padding: 0 0 5px; border-bottom: 1px dotted #666;}
#homepage .graphic { border: 2px solid #231e52; -moz-border-radius: 8px; -webkit-border-radius: 8px; width: 541px; height: 269px; }
#homepage #searchjobs {background:url("/_img/backgrounds/home_search.jpg") no-repeat scroll 0 0 transparent;height:45px;margin-top:10px;padding-bottom:20px;width:545px;}

#homepage .latestnews h1 a { color: #fff; text-decoration: none; font-size: 1em;}
#homepage .latestnews p { font-size: 1.2em;}
#homepage .latestnews a { font-size: 1em; font-weight: bold;}

a.rssitemtitle {
font-size: 1.2em !important;
}

#homepage #introcopy { padding: 20px 10px; font-size: 0.95em;}
#homepage #introcopy p { color: #666; line-height: 1.8; }
#homepage #introcopy h1 { color: #231e52; font-size: 1.8em; margin: 0 0 1.2em; }
#homepage #form1 { padding: 15px 0 0;}
#homepage #form1 p { margin: 0; padding: 0;}
#homepage #form1 p label { color:#660033;
float:left;
font-size:1.1em;
font-weight:bold;
margin: 0;
padding:6px 0 0 10px;
width: 130px;}
#homepage input#searchword { border: 1px solid #231e52;  font-size:1.1em; padding: 6px; width: 320px;}

#jobs #form1 { padding: 10px 0;}


a.actionBtn, #homepage .latestjobs a.actionBtn, .form .btns {
-moz-border-radius:8px;
-webkit-border-radius:8px;
background:url("/_img/backgrounds/actionbutton.png") repeat scroll left top transparent;
color:#990066;
float:left;
font-size:1em;
font-weight:bold;
margin:13px 10px 0  0;
text-decoration: none;
padding:4px 15px 3px 20px;
}
a.actionBtn:hover { text-decoration: underline;}

a.actionBtnEnq {
-moz-border-radius:8px;
-webkit-border-radius:8px;
background:url("/_img/backgrounds/btn_enquiry.png") repeat scroll left top transparent;
color:#fff;
float:left;
font-size:1.1em;
font-weight:bold;
margin:0;
text-decoration: none;
padding:4px 15px 3px 20px;
border: 2px solid #d9ed98;
}

a.actionBtnEnq:hover { background-position: 0 -50px }

a.actionBtnFeedback{
-moz-border-radius:8px;
-webkit-border-radius:8px;
background:url("/_img/backgrounds/btn_feedback.jpg") repeat scroll left top transparent;
color:#fff;
float:left;
font-size:1.1em;
font-weight:bold;
margin:0;
text-decoration: none;
padding:4px 15px 3px 20px;
border: 2px solid #ccccff;
}

a.actionBtnFeedBack:hover { background-position: 0 30px }



#homepage .latestjobs a.actionBtn#more  { display: block; padding:4px 15px 3px 20px; margin: 0; position: absolute; left: 10px; bottom: 10px; font-size: 1.4em;}
#homepage p.morejobs { border: none; display: none;}

#homepage .twitter {background: url(/_img/backgrounds/home_latestjobs.jpg) bottom left no-repeat; font-size: 0.8em; margin: 0 0 15px; padding: 0 10px 10px;}
#twitter_div { padding: 5px 5px 0; }
ul#twitter_update_list { list-style: none; margin: 0 0 1em; padding: 0;}
ul#twitter_update_list li { list-style: none; border-bottom: 1px dotted #d5e189; margin: 0 0 5px; padding: 5px 0 7px;}
ul#twitter_update_list  a { display: block; }
ul#twitter_update_list span a { display: inline; }

#homepage p.morejobs { display: none;}

ul.accordion, ul.accordion li  { list-style: none; margin: 0; padding: 0; }
ul.accordion li.head a { background: #efefef; display: block; font-weight: bold; margin: 0 0 1em; padding: 5px; text-decoration: none;}
ul.accordion li ul, ul.accordion li ul li { line-height: 1.4; list-style: circle; }
ul.accordion li ul { margin: 1em; }