/* - - -  PROPERTIES - - - - - - - - - - - - - - - - - -

Title : Jobstream Group plc Main Stylesheet
Author : John Keane
URL : www.jobstream.com

Description : This is the main stylesheet for www.jobstream.com

(C) 2009

- - - - - - - - - - - - - - - - - - - - - */




/* --- IMPORT STYLESHEETS -- */

/* add the colours and backgrounds */
/* @import url(jobstream-colours.css); */




/* --- COLOUR GLOSSARY --- 

	dark blue: #3377bb;
	body text, h1: #444; ... and various greys around the place, like #777 and #999 and #bbb and #ddd and #e3e3e3 and #e6e6e6 (dark to light) 
	light blue: #b5d1e8;
	light yellow: #ffc;

*/




/* --- GENERAL RULES ---

# get font-sizing in first, because it modifies the ems
# keep the order outside in, so MARGIN > BORDER > PADDING > WIDTH

*/

/* The Tan Hack
--- Because IE5 gets its box model wrong
* html <element>
{  This is the Tan hack 
	width: total width (content+padding+borders); This is for IE
	w\idth: content width only; This is for everything else
}
--- */



/* -- ### DEFAULT FONT AND SIZING SETUP --  */
/* this section sets the base font values for text */


body, div, p, th, td, li, dd {
	/* redundant selectors to help NS4 remember */
	font-family: Arial, Helvetica, sans-serif;
	font-size: small;
	color: #222;
}

html>body, html>body div, html>body p, html>body th, html>body td, html>body li, html>body dd {
	/* IE doesn't read this */
	font-family: Arial, Helvetica, sans-serif;
	font-size: small;
	color: #222;
}




/* -- ### 1. TYPOGRAPHY -- */
/* font style and colour. and padding and margins for text (NOT BLOCKS) */


/* basic elements */

p {
	margin: 0 0 1.4em;
	padding: 0;
	line-height: 1.6em;
text-align: justi
}

	p.firstpara{
	/* introductory / summary paragraph gets slightly different treatment */
font-weight: bold;
color: #565656;
}
	
	div#breadcrumbs p {
		font-size: 0.85em;
line-height: 1.6em;
		margin: 0 0 0em 0.5em;
		color: #3377bb;
	}
	
		div#breadcrumbs p.ad {
			color: #ffa;
			background: transparent;
			border: 1px solid #5599dd;
			border-width: 0 0;
		}

body#body-support-online p.ad { display: none; }
		
			div#breadcrumbs p.ad a, div#breadcrumbs p.ad a:visited {
				color: #ff0;
			}
	
	div#side p {
		/* this largely acts on the subheaders between the menus */
		font-size: 0.85em;
		margin: 0 0.5em 1.4em;
		padding: 0;
		text-align: left;
color: #fff;
	}	
	
		#side p.sidebarImage {
			text-align: center;
		}
			
		#side p.quote {
			/* appears in sidebar */
			/* padding: 0 1em; */
			margin: 1em 0.5em 2em;
			background: transparent url(/graphics/quote.gif) no-repeat top right;		
}

			p.quote span {
				font-size: 0.85em;
				display: block;
				text-align: right;
			}
			
		#footer p.footer-updated {
			color: #b4b4b4;
		}
			
h1, h2, h3, h4, h5, dt.indextitle {
	/* dt.indextitle is used on the news index; it's like a h3 */
	font-family: Georgia, serif;
	font-weight: normal;
	color: #3377bb;
	text-align: left;
	margin: 0 0 1.4em;
	padding: 0;
}

h1 {
	font-size: 300%;
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold;
	color: #3377bb;
	margin: 0 20px 0.5em;
	padding: 0.25em 0 0.5em 0em;
	letter-spacing: -0.06em;
	word-spacing: 0.1em;
border-bottom: 0px solid;
}

	body#home #h1wrapper {
		background: #3377bb url(/graphics/footerbackflip.gif) repeat-x top right;
	}
	
	body#home h1 {
		font-size: 2em;
		width: 26em;
		color: #fff;
		margin: 0 auto;
		padding: 1em 0;
		text-align: center;
border: 0;
font-weight: normal;
	}
	
		body#home h1 span a {
			font-size: 90%;
			display: block; 
			margin-top: 0.5em; 
			color: #b5d1e8; 
			text-decoration: none;
		}
		
	body.form-return h1 {
	margin-left: 0;
	padding-top: 1em;
	}

h2 {
	font-size: 150%;
	letter-spacing: -0.06em;
	margin: 1.4em 0 0.2em;
}

	body#home h2 {
		margin: 0;
		border-bottom: 0;
		padding: 0;
		line-height: 1em;
	}
	
		body#home h2.quote {
			clear:left;
			padding: 1em 2em;
			border-bottom: 0px dotted #444;
			color: #3377bb;
font-size: 200%;
		}
		
			body#home h2.quote span, body#home h2.quote span a {
				display: block;
				text-align:right;
				color:#bbb;
			}
	
	#side h2 {
		/* special treatment for the side bar headings (should they be h2 at all?) */
		font-family: Arial, Helvetica, sans-serif;
		margin: 0;
		padding: 0;
		letter-spacing: 0;
	}
	
	#home-headlines h2  .home-headline {
		color: #444;
	}

h3, dt.indextitle {
	font-size: 110%;
        letter-spacing: -0.05em;
	margin: 1.4em 0 0.2em;
color: #444;
font-family: helvetica, arial, sans-serif;
font-weight: bold;
}

	.figure h3 {
		margin-bottom: 0.5em;
		border-bottom: 1px dotted;
		padding-bottom: 0.5em;
	}

h4, h5 {
	font-size: 100%;
        text-transform: ;
	margin: 1em 0 0.3em;
color: #444;
font-family: helvetica, arial, sans-serif;
font-weight: bold;
}

ul, ol {
	margin: 0 0 1.4em 1.5em;
	padding: 0;
}

ul {
	list-style: url(../graphics/tmp/graphicpush_blogicons/stdlistitem.gif) outside;
	/* remember to sort out the graphics etc */
}

	ul.download {
		/* used on the Downloads page */
		list-style: url(../graphics/tmp/graphicpush_blogicons/document.gif) outside;
		/* remember to sort out the graphics etc */
	}

ol {
	list-style: decimal outside;
}

ol.howtoInstructions ul, ol.howtoInstructions li {
margin-top: 1em;
}

dl {
}

	dl.index dt {
		margin: 0.5em 0 0.25em; 
	}
	
	dl.index dd {
		margin-left: 1em;
		padding-bottom: 0.2em;
		line-height: 1.4em;
	}

li {
	margin: 0 0 0.25em;
	line-height: 1.6em;
}

	#side li {
		margin-bottom: 0em;
		line-height: 1.2em;
	}
	
	ul.inline li {
		/* where is this used? I think it's used for the 'quicklinks' in the support website */
		display: inline;
		margin-right: 2em;
	}

dt {
	margin: 0.5em 0 0.2em;
	text-indent: none;
	font-weight: bold;
}

dd {
	margin-bottom: 0.7em;
	line-height: 1.6em;
}

hr {
	height: 1px;
	border: 0;
	border-bottom: 1px dotted #bbb;
}

strong {
	font-weight: bold;
}

blockquote {
	margin: 0 1em 1.4em;
	border: 1px solid #3377bb;
	border-width: 0 0 0 1px;
	padding: 0.5em 0.5em 0.5em 1em;
	background: ;
}

code {
	font-family: "Lucida Console", "Courier New", monospace;
	font-size: 1em;
	background-color: #e3e3e3;
	color: #000;
}
	
	
/* -- ### 2. LAYOUT ELEMENTS -- */
/* everything for the layout blocks */


body {
	margin: 0;
	padding: 0;
	background: #fff;
}

#wrapper {
	margin: 0;
	padding: 0;
	position: relative; /* to allow positioning of the breadcrumbs */
	background: #fff url(/graphics/footerback.gif) repeat-x 0 6em;
}

	/* fix for IE6 peekaboo bug */
	/* Hides from IE5-mac \*/
	* html div#wrapper {
		height: 1%
	}
	/* End hide from IE5-mac */

	body#home #wrapper {
		/* we change the html of the front page because of the additional logo and large h1, 
		so we need to move the background of the wrapper (the wrapper is below the sig image on the home page) */
		background-position: 0 0;
	}
	
	body#plain #wrapper {
		background-image: none;
	}

#go-home {
	margin: 0;
	padding: 0;
height: 3em;
	background: #fff;	
}

#go-home-innards {
		margin: 0 auto;
padding: 5px 0;
		width: 56em;
}


#go-home-innards img { border:0;margin:0;padding:0;}

#home #go-home-innards img { text-align: center;}

	body#home #go-home{
		/* no breadcrumbs on the home page */
		display: none;
	}	

	#breadcrumbs {
		margin: 0 auto;
		width: 56em;
		padding: 0.5em;
		position: relative; /* to allow positioning of navtab */
/*background: #e6e6e6 url('/graphics/bc-innards-background.png') repeat-x top left;*/
}

	.navtab {
		/* this is the 'request information' link in the breadcrumbs */
		position: absolute;
		right: 1em;
		top: -6.5em;
		margin-left: 0em;
	}

#home-logo {
	background: #fff;
}

	#home-logo p {
		margin: 0 auto;
		width: 58em;
		text-align: center;
	}

	#home-logo img {
		border: 0;
		margin: 0.5em;
	}

div#signature-image {
	/* we have a signature image at the top of each page */
	margin: 0;
	border: 0;
	height: 3em;
	background: #66a8e2 url(/graphics/cloudray-sh.jpg) repeat-x top center;
}
	
div#content {
	/* content includes everything between the signature image and the footer */
	margin: 0 auto;
	padding: 0;
	width: 58em;
	position:relative;
	clear: both;
/*
	background: transparent url(/graphics/e3e3e3-gradient2.gif) repeat-x 0 10px;
*/
	background: transparent /* url(/graphics/footerback.gif) repeat-x 0 0.8em */;
}

	/* fix for IE6 peekaboo bug */
	/* Hides from IE5-mac \*/
	* html div#content {
		height: 1%
	}
	/* End hide from IE5-mac */

div#printheader, div#printfooter { 
	/* these elements are only used in the printed version (copyright info, logos, that sort of thing) so we want to hide them from screens */
	display:none; 
}

/* div#side and div#article are managed in jobstream-twocol.css and jobstream-onecol.css */
	
div#article-body {
	padding: 0;
	margin: 0 20px;
}

	div.articlewide div#article-body {
		/* div.articlewide is used on pages like the Request information form where we never want a sidebar */
		margin: 1em 20px;
	}

	body#home div#article-body {
		padding: 0;
		margin: 0;
	}
	
	body#plain h1 {
		padding-top: 1em;
		}

ul#mainNav {
	float: left;
	margin: 0 0 0 -0.5em;
	border-bottom: 0 solid #999;
	padding: 0.5em 0;
	width: 59em;
	text-align: left;
	clear: both;
	position: absolute;
	top: -2.95em;
	background: #3377bb url('/graphics/cloudray-sh-menu.jpg') repeat-x top center;
	}
	
	body#plain #mainNav, body#plain #signature-image { display: none; }
	
#mainNav, #mainNav ul {
	margin: 0; /* does this over-ride the ul#mainNav setting? */
	padding: 0;
	list-style: none;
	background: #fff;
	}

#mainNav { 
	padding-bottom: 0;
	}

	#mainNav a {
		display: block;
		padding: 0.25em 0;
		width: 9.1em; /* IE requires this width setting */
		font-family: Arial, Helvetica, sans-serif;
		text-decoration: none;
		text-transform: none;
		color: #fff;
		}
		
	#mainNav li {
		float: left;
		margin: 0 0.5em;	
		width: 9.1em; /* fixed width so that the nav items are evenly spaced and so the sub-menus are the right width */
		position: relative; /* allows absolute positioning of sub-menus */
		text-align: center;
		font-size: 0.95em;
		font-weight: bold;
		}

	#mainNav li:hover ul {
		left: auto;
		}
	
	#mainNav li.sfhover ul {
		left: 0;
	}

/*there's a problem with the width of the li ul lis */

		#mainNav li ul {
			/* this is the sub-menu positioning */
			position: absolute;
			left: -999em;
			bottom: ; /*shifts it up above the main part of the menu */
			}
	
		#mainNav li ul {
			/* this is the sub-menu decoration */
			border: 1px solid #798c98;
			border-top: 1px dotted;
			}

			#mainNav li ul a, #mainNav li ul a:visited, #mainNav li ul a:hover { 
				font-weight: normal;
				color: #3377bb; 	
				}

			#mainNav li ul a {
				padding: 0.5em 0;
				width: 8.8em;
				text-transform: none;
				}
			
			#mainNav li ul li {
				/* these are the sub-menu items */
				line-height: 1.2em;
				border-bottom: 1px dotted #bbb; 
				}

			#mainNav a:hover, #mainNav li ul a:hover  {
				color: #444;
			}
				
			#mainNav li ul a:hover {
				font-weight: normal;
			}

				
div#footer-top {
	margin: 0 auto;
	border: 1px solid #e6e6e6;
border-width: 0 0 1px;
	width: 59em;
	height: 25px; /* Why do we specify this? Er, because otherwise it disappears, because there's nothing in this div! */
	background: #fff /* url('/graphics/40x50xbluegradient.png') repeat-x top left */;
	}

div#footer {
	margin: 0;
	padding: 0;
	height: 4em; /* this is so we always have a healthy bit of whitespace at the bottom of the page */
	clear: both; 
	}

	div#footer-innards {
		margin: 0 auto;
		padding: 1em 1em 6em;
		width: 56em;
		clear: both;	
		background: transparent /* url(/graphics/footerback.gif) repeat-x top right */;
		}
	
		div#footer p {
			font-size: 0.85em;
			margin-bottom: 0.2em;
			}
	
		div#footer-meta {
			/* div#footer-meta contains links for copyright info, request info, etc */
			float: left;
			text-align: left;
			}
		
		div#footer-valid p {
			/* div#footer-valid contains links for validation and last modified info */
			text-align: right;
			}

			
			
			
/* -- ### 3. SIDEMENU -- */


div.sidemenu, ul.sidemenu 
/* .sidemenu is the sidebar nav */
{
	margin: 0;
	padding: 0;
	text-align: right;
}

/* sidemenu is comprised of headings (h2.sidemenu) and lists (ul.sidemenu) */

div.sidemenu ul, ul.sidemenu
{
	list-style: none outside;
	padding: 0;
	margin: 0 0 0.5em;
}

div.sidemenu li, ul.sidemenu li
{
	list-style: none none;
	margin: 0;
	padding: 0em;
	border-top: 1px #e3e3e3 solid;
	text-align: left;
} 

div.sidemenu p, div.sidemenu li
{
	font-size: 0.9em;
}

div.sidemenu p
{
	line-height: 1.4em;
	word-spacing: -0.02em;
}

.sidemenu h2
{
	margin: 0;
	font-size: 90%;
	letter-spacing: -0.02em;
	padding: 0.25em 0em 0.05em 0em;
	text-align: left;
}

body#home div.sidemenu h2
{
	padding: 0.25em 0.75em 0.05em 1em;
}

div.sidemenucurrent ul
{
	margin-bottom: 0;
	padding-bottom: 0.25em;
}

#side h2 { 
	font-weight: bold; 
	padding: 0em; 
}
 
/* -- ### LINK STYLING -- */

a:link, a:visited {
	text-decoration: underline;
	color: #3377bb;
}

	a:hover {
	color: #000;
	}
	
	a.imglink, a.imglink:visited, a:hover img {
		text-decoration: none;
		border: 0;
		background-color: transparent;
	}
	
	a:hover img {
		text-decoration: none;
		border: 1px solid #444;
	}

	#breadcrumbs a, #breadcrumbs a:visited, #breadcrumbs a:hover {
		color: #3377bb;
	}

	#side a, #side a:hover {
		display: block;
		text-decoration: none;
	}
	
		#side p a, #side p a:hover {
			display: inline;
		}
	
		#side li a {
			text-decoration: none;
			width: 14.4em; /*width required for IE*/
			padding: 0.2em 0.5em 0.2em 1.5em;
			background: url("/graphics/arrow_B_ver2.gif") no-repeat left;
		}

			#side li a:hover {
				color: #000;
				background: url("/graphics/arrow_A_ver1.gif") no-repeat left;
			}
	
		#side h2 a	{
			padding: 0 0.5em 0.2em 0em;
margin-top: 0.5em;
		}

		#side h2 a:link, #side h2 a:visited, #side h2 a:active {
			color: #444;
		}
		
		#side h2 a:hover {
			color: #000;
}

	#footer a.imglink:hover {
		text-decoration: none;
		border-bottom: 0;
	}
	
	a.password:visited {
		color: #c08080;
	}
	
	a.password:hover {
		color: #000;
	}


/* -- ### TABLES -- */


table, tr, td {
	padding: 0;
	margin: 0;
	border: 0;
}

table {
	margin-bottom: 1em;
	border-collapse: collapse;
	width: 98%;
}

#easy-contact table{
margin-bottom: 0;
}

#easy-contact td{
font-size: 0.8em;
}

	table.standard, table.training-diary, table.training-courses, table.twikiTable {
	}
	
		table.standard th, table.training-diary th, table.training-courses th, table.twikiTable th {
			border-bottom: 1px solid #b4b4b4;
			padding: 0.25em;
			background: transparent /* url('/graphics/40x50xbluegradient.png') repeat-x bottom left */;
			text-align: left;
color: #3377bb;
		}
		
			table.standard th.midtext {
				text-align: center;
			}
		
		table.standard td, table.twikiTable td {
			border-bottom: 1px solid #b4b4b4;
			padding: 0.25em;
		}

		table.training-courses td {
			width: auto;
		}
		
	table.contact-details {
		border-top: 0px solid;
		border-bottom: 0px solid;
	}
	
		table.contact-details td, table.training-diary td, table.training-courses td {
			border-bottom: 1px dotted #b4b4b4;
			padding: 0.2em 0em;
			vertical-align: top;
		}
	
		table.contact-details td, table.training-diary td {
			width: 50%;
		}
	
	table.module-by-module td , table.twikiTable td {
		vertical-align: top;
	}
	
	table.twikiTable td, table.twikiTable th {
		padding: 0.5em;
	}
	
	td.twikiTableDescCol {
		font-weight: bold;
		color: #444;
	}

	col#release-name {
		width: 12em;
	}
	
	table#euro-rates, table#euro-rates th {
		text-align: center;
	}
	
	table.fkey {
	/* table.fkey is a special table in the Function Keys HowTo */
	}
	
		table.fkey th {
			border-bottom: 1px solid;
			text-align: left;
			text-transform: uppercase;
			font-size: 1.5em;
		}
		
		table.fkey td {
			padding: 1em 0em 2em;
			border-bottom: 1px solid;
		}
	
			table.fkey td.fkey {
				padding: 0em 0.2em 0em 0;
				font-size: 4em;
				vertical-align: top;
			}
			
				table.fkey td.fkey span {
					display: block;
					padding: 0 0.2em 0 0;
					text-align: left;
					font-weight: bold;
				}



/* -- ### FORMS -- */


/*form styling */

/* Set up the basic layout and remove unsemantic br tags. */

form {
	margin: 0;
	padding: 0;
}

fieldset {
	margin: 0 0 2em;
	padding: 1em;
	border: 1px solid #bbb;
}

	fieldset div {	
	}
	
		fieldset div br {
			display: ;
		}

	fieldset fieldset {
		border-color: #ccc;
	}

/* Style the legend, labels, inputs and the div containing the submit button. */

legend  {
	font-size: 120%;
	font-family: georgia, sans-serif;
	color: #3377bb;
	margin: 0;
	padding: 0.5em;
}

	fieldset fieldset legend {
		font-size: 100%;
	}

label {
	display: block;
	float: left;
	text-align: left;
	width: 10em;
	padding: 0.5em 1em 0.5em 0;
    margin-right: 1em;
	clear: left;
}

#haveyoursay-form label {
width: auto;
}

	.disabled {
		color: #bbb;
	}

	form.booking-form label {
		display: auto;
		text-align: left;
		width: auto;
		padding: 0;
	}
	
	label.form-checkbox {
		padding-top: 0;
	}
	
input {}

	fieldset input, textarea, select {
		margin-bottom: 1.5em;
		border: 1px solid #aaa;
		padding: 0.5em;
		font-family: "Courier New", Courier, monospace;
		font-size: 1em;
		float: left;
		width: 30em;
font-weight: bold;
	}

#haveyoursay-form fieldset input, #haveyoursay-form fieldset textarea  {
clear: left;
margin-bottom: 2em;
}

fieldset .radio {
float: left;
width: 35em;
}

fieldset .radio input {
width: 2em;
margin: 0.6em 0 0.5em;
}

fieldset table th {
padding: 0 1em 1em;
}

fieldset table td {
text-align: center;
vertical-align: center;
padding: 0.5em 0;
border: 1px solid #ddd;
border-width: 1px 0;
}

fieldset table td.label {
text-align: left;
width: 40%;
padding: 1em;
}

fieldset table td input {
width: 5em;
float: none;
margin: 0;
}

fieldset p.label {
margin: 1.4em 0 0.5em;
}
	
	
		fieldset input:focus, textarea:focus{
				border-color: #000;
				background-color: #fff;
		}
	
	input.searchbox {
		border: 1px solid #bbb;
		padding: 0.2em;
		background: #fff url(/graphics/Logo_40wht.gif) top right no-repeat;
		font-family: "Courier New", Courier, monospace;
		width: 21em;
		float: left;
		position: relative; /* hack otherwise the background disappears on IE */
	}
	
	input.searchbutton {
		font-family: Arial, Helvetica, sans-serif; 
	}

	form.booking-form input
	{
		width: auto;
	}
	
	fieldset input.form-checkbox
	{
		border: 0px;
		width: auto;
	}
	
	.fm-required input {
		/* Mandatory fields. */
		border-color: salmon; /* need the hex for this */
	}

p.googlelink {
	clear: left;
}

fieldset p.disclaimer {
	clear: left;
	padding: 1em;
   margin-bottom: 0.5em;
	background-color: #e0e0e0;
}

textarea
{
	margin: 0;
	width: 95%;
}

#fm-submit, #fm-reset 
{
	padding: 1em 0 1em 1em;
	float: left;
}

#fm-buttons
{
	margin-left: 0em;
	float: right;
}

/* buttons */

.button {
}

	.button:focus {
		border: 3px double #bbb;
	}
	
	.button:active {
		border: 3px double #000;
		background: #ffc;
	}


button { background: #3377bb;padding: 2px 5px; border: 2px solid #115599; border-right-color: #88ccff; border-top-color: #88ccff; color: #fff;}
button:hover { background-color: #5599dd; }
button:active { border-right-color: #999; border-top-color: #999; border-left-color: #ccc; border-bottom-color: #ccc; background-color: #3377bb; }
button img { vertical-align: middle; background: transparent; border: 0; padding: 0; margin: 0; }


/* -- ### 9. EVERYTHING ELSE -- */


/* ### IMAGES */


/* See link styling for image links */

img {
	border: 1px solid #ddd;
	padding: 0.25em;
	background: #fff;
}

	#breadcrumbs img, .singleStyle img, .defaultStyle img {
		border: 0;
		padding: 0 2px;
		background: transparent;
		vertical-align: middle;
	}

		#breadcrumbs img.bcLogo {
			margin: 0;
			padding: 2px 0 0;
		}

	#header img {
		border: 0;
		padding: 0;
		background: transparent;
	}

	.imgright {
		float: right;
		margin-left: 1em;
		margin-bottom: 0.5em;
	}
	
	.imgleft 	{
		float: left;
		margin-right: 1em;
		margin-bottom: 0.5em;
	}
	
	.imgmid  {
		margin: 1em auto;
	}
	
	img.reason  {
		border: 0;
		margin: 0 0.5em 0 0;
		padding: 0;
		vertical-align: middle;
	}

        img.google-image {
                border: 0;
                vertical-align: middle;
        }
	
	.noborder  {
		 border: 0;
	}



/* ### GENERIC CLASS TRANSFORMS */


.bigger {
	font-size: 120%;
}

	.smaller {
		font-size: 85%;
	}

.floatright {
	float: right;
}

	.floatleft {
		float: left;
	}

.midtext {
	text-align: center;
}

	.righttext {
		text-align: right;
	}
	
	.lefttext {
		text-align: left;
	}

.zeroafter {
	margin-bottom: 0;
}

	.zerobefore {
		 margin-top: 0;
	}

.largefile {
	/* used on the downloads page */
	color: red;
	font-weight: bold; 
}

.password {
	/* used to warn about required passwords for support areas */
	color: salmon;
}

span.footnoteRef {
vertical-align:super;
font-size: 0.85em;
line-height: 0;
}

p.footnote {
font-size: 0.85em;
}

/* ### ADDENDA */

.highlightbox {
	/* used on the home page and the tech support page */
/*
	padding: 0.5em 1em;
	margin: 0em 0 1em;
	width: auto; */ /* hack to prevent ie disappearing this */
/*	position: relative;*/ /* hack to prevent ie disappearing this */
	/* could have a background color too */
/*	border: 1px solid #fff672;
	border-width: 1px;
	background: #fffbb9;*/
}

.figure {
	margin: 1em 0em; 
	border: 1px solid #3377bb; 
border-width: 1px 0;
	padding: 0em 2em;
}

div.summary {
	border: 1px solid #ddd;
	border-width: 1px;
	padding: 1em 2em;
margin: 0 0 1em;
	background: transparent;
	position: relative; /* hack to prevent ie disappearing this */
}

div.summary ul { margin-bottom: 0; }

/* --- some support website styles --- */

.support-online-section	{
	/* this is a section (uh, obviously) on the support homepage, e.g. 'current release' */
	margin: 1em 0;
}

	#current-release {
		position: relative;
	}

div#easy-contact, div#requestedPage {
		/* this is the big-boned contact details section at the top of jobstream.com/support */
		font-size: 200%; 
		margin-bottom: 1em;
		padding: 0.5em;
		background: #fff;
		text-align: left;
	border: 1px solid #3377bb;
	border-width: 0px;
}

	#requestedPage p {
		font-size: 0.8em; 
		margin-bottom: 0;
	}

.quicklinks, .highlightbox {
	/* these are the quicklink sections; I think they use ul.inline as well (see the ul section up the top of the stylesheet) */
	border: 1px solid #ddd;
	border-width: 1px;
	padding: 1em 1em;
	background: #ececec;
}

.quicklinks p {
margin: 0.5em 0;
}

p.tagline {
	font-size: 1em;
	margin: 0.5em 0;
}

div.info-links {
	padding: 0;
}
	
	div.info-links li {
		text-align: left;
		margin-bottom: 0.5em;
	}

div.featured-article {
	margin-bottom: 1em;
	padding: 0;
}
	
	div.featured-article h3, div.featured-article h4, div.featured-article p {
	padding: 0;
	}


/* --- this is the styling for the home page */
	
div#front-stuff {
	padding: 2em 0em 0em;
}

	div#front-stuff h2 {
		margin-bottom: 0.25em;
		font-weight: normal;
		text-align: center;
	}
	
	div#front-stuff p {
		font-size: 1.25em;
		margin-bottom: 0em;
		text-align: center;
	}

	#front-stuff .intro {
		margin: 0;
		padding: 0em;
	}
	
		div#front-stuff .intro h2 {
			font-size: 2em;
			text-align: center; 
		}
		
			div#front-stuff .intro h2 a, div#front-stuff .intro h2 a:visited {
				padding: 0.5em 0 0;
				display: block;
				font-weight: normal;
				_height: 1em; /* I think this is fighting off the peekaboo bug */
			}
	
	#home-intro-the-software, #home-intro-the-company {
		/* these are the 'the company' and 'the software' intros on the the home page */
		margin: 0 1em 1em;
		padding: 1em 0;
		width: 24.5em; /* should be 25em, but IE isn't playing ball */
		float: left;
	}
	
	body.js9 #home-intro-the-company {
		width: 20em;
	}
	
	body.js9 #home-intro-the-software {
		width: auto;
	}
	
	body.js9 div#front-stuff .intro h2, body.js9 div#front-stuff p {
	}	

	#home-headlines {
		/* these are the latest news and tech support links on the home page */
		clear: both;
		margin: 0;
		padding: 2em 0 0; 
		border-top: 0px dotted #444;
	}

div#styleSwitcher {
	/* can't remember if this div is still used */
	font-size: 0.85em;
	text-align: right;
	position: absolute;
	right: 1em;
}

	div#styleSwitcher a:link, div#styleSwitcher a:visited 	{
		font-weight: bold;
	}
	
	body#home #styleSwitcher 	{
		display: none;
	}
	
body#home span.singleStyle, body#home span.defaultStyle, body#wide span.singleStyle, body#wide span.defaultStyle, body.wide span.singleStyle, body.wide span.defaultStyle  { display: none; }

.testimonial {float:left;}


body#jobstream9 div#content, body#jobstream9 div#wrapper, body#jobstream9 div#breadcrumbs, body#jobstream9 div#go-home-innards, body#jobstream9 div#footer-innards, body#jobstream9 div#footer-top {
	width: 940px;
	}
	
	body#jobstream9 div#breadcrumbs {
	width: 940px;
	padding: 5px 0;
	}
	
	body#jobstream9 div#wrapper {
	margin: 0 auto;
	background: #fff url(/graphics/footerback.gif) repeat-x 0 79px;
	}

	body#jobstream9 ul#mainNav {
	float: left;
	margin: 0;
	border: 0;
	padding: 5px 0;
	width: 940px;
	text-align: left;
	clear: both;
	height: 30px;
	position: absolute;
	top: -40px;
	background: #3377bb url('/graphics/cloudray-sh-menu.jpg') repeat-x top center;
	}
	
		body#jobstream9 #mainNav a {
		display: block;
		padding: 0;
		width: 180px; /* IE requires this width setting */
		height: 30px;
		padding: 5px 0;
		font-family: Arial, Helvetica, sans-serif;
		text-decoration: none;
		text-transform: none;
		color: #fff;
		}
		
		body#jobstream9 #mainNav li {
		float: left;
		margin: 0;	
		width: 180px; /* fixed width so that the nav items are evenly spaced and so the sub-menus are the right width */
		position: relative; /* allows absolute positioning of sub-menus */
		text-align: center;
		font-size: 0.95em;
		font-weight: bold;
		}
	
	
		body#jobstream9 div#article-body {
		padding: 0;
		margin: 0;
	}
	
	body#jobstream9 div#signature-image {
	background: none;
	}
	
	body#jobstream9 div#go-home {
	height: 40px;
	width: 930px;
	padding: 0 5px;
	}
	
	body#jobstream9 h1, body.jobstream9 h1 {
	margin: 0 0 40px;
	padding: 0;
	text-indent: -10000px;
	background: url(/graphics/jobstream9logo500px.png) 50% 50%  no-repeat;
	height: 115px;
	}
	
	body#jobstream9 .navtab {
		/* this is the 'request information' link in the breadcrumbs */
		position: absolute;
		right: 0;
		top: -70px;
		margin-left: 0em;
	}
	
	
.summaryBlock { 
	/* width: 340px; */
	padding: 0;
	padding-right: 0px; 
	margin: 40px 0;
}

/* .summaryBlockRight {
margin-right: 0;
} */

	.summaryBlock h2 {
		margin-top: 0;
		margin-bottom: 5px;
		padding: 2px 2px 2px 47px;
		background: transparent url(/graphics/js9iconCropped40px.png) 0 0 no-repeat;
		height: 40px;
		}
		
		.summaryBlock h2 a {
			text-decoration: none;
			display: block;
			border-bottom: 1px solid;
			
			}
			
			.summaryBlock h2 a:hover {
			border-color: black;
			}
		
	.summaryBlock p {
		
		}