body
	{
		margin:15px;
		padding:0;
		background:#FFF;
		color:#666;
		font: normal 70%/1.3em Arial, Helvetica, sans-serif;
		text-align:center;
	}
	
/*************************************************************************
GENERAL FORMATTING: IN LINE STYLES, HEADINGS, ETC
*************************************************************************/	

h1,h2,h3,h4,h5,h6
	{
		color:#2B88B5;
	}
	
h1
	{ font-size:1.5em }	
h2
	{
		font-size:1.2em;
		margin:0 0 20px 0;
	}
h3
	{
		font-size:1.0em;
		padding-bottom:0;
		margin-bottom:0;
	}	

p
	{
		margin:0;
		padding-top:10px;
		padding-bottom:0;
	}
	
/* Slightly fatter linespacing for lower pages content */
#content p,#content ul,#content ol
	{
		line-height:1.4em;
	}	

/* inline Anchors: */

a,a:visited,a:hover
	{
		color:#2B88B5;
		text-decoration:underline;
	}

a:hover
	{
		color:#2FA5DE;
	}
	
a.arrow
	{
		background:url(../images/bullet_bluearrow.gif) no-repeat 100% 2px;
		padding-right:8px;
	}	
	
a.arrownone
	{
		text-decoration:none;
	}
	
a.pdf,a.doc,a.xls
	{
		padding-left:22px;
	}	

a.pdf
	{
	background:url(../images/icon_pdf.gif) no-repeat top left;
	padding-bottom:4px
	}
a.doc
	{
	background:url(../images/icon_doc.gif) no-repeat top left;
	padding-bottom:4px
	}
a.xls
	{
	background:url(../images/icon_xls.gif) no-repeat top left;
	padding-bottom:4px
	}			
	
img
	{
		border:none;
	}
	
br.clear
	{
		font-size:0;
		line-height:0;
		clear:both;
		float:none;
	}	
	
.floatleft
	{
		float:left;
		margin:10px 0 10px 0;
		padding:0 20px 0 0;
/*		visibility:hidden;*/
	}
	
.floatright
	{
		float:right;
		margin:10px 0 10px 20px;
	}
	
.small
	{
		margin:0;
		padding:0;
		font-size:0.95em;
	}	
	
.minheight
	{
		height:300px;
	}				

/*************************************************************************
TOP BAR
*************************************************************************/	

#banner
	{

	}
	
/*************************************************************************
BREADCRUMB TRAIL
*************************************************************************/	
#breadcrumb
	{
		background:#F2F2F2;
		color:#333;
		padding:0 0 0 19px;
		min-height:15px;
		height:15px;
		border-bottom:1px solid #FFF;
	}
	
#breadcrumb p
	{
		margin:0;
		padding:0;
		line-height:15px;
		float:left;
		background:#F2F2F2;		
	}

#breadcrumb ul
	{
		margin:0;
		padding:0;
		list-style-type:none;
	}	
	
#breadcrumb li
	{
		float:left;
		margin:0;
		padding:0 0 0 22px;
		background:#F2F2F2 url(../images/bullet_breadcrumb.gif) no-repeat center left;
		color:#2B88B5;
		line-height:15px;
	}
	
#breadcrumb li a,#breadcrumb li a:visited
	{
		color:#2B88B5;
		text-decoration:none;
	}
	
#breadcrumb li a:hover
	{
		text-decoration:underline;
	}	
	
/*************************************************************************
MASTHEAD
*************************************************************************/			

#masthead {
	clear:both;
	position:relative;
	width:100%;
	height: 92px;
	margin: 0;
	padding: 0;
	border-bottom:1px solid #FFF;
}	

#masthead img
	{
		float:left;
	}
	
/* following fixes the 3 pixel gap in IE5/WIN and feeds correct margin back to IE6 */
/* AND it VALIDATES! */
* html #masthead img
	{
		margin-left:-3px;
		ma\rgin-left:0;
	}	
	
#masthead #movie object,#masthead #movie img
	{
		position:absolute;
		top:29px;
		left:370px;
		margin:0;
		padding:0;
	}
	
.masthead-default { background:url(../images/banner_01.jpg) no-repeat top left }
.masthead-londonlights { background:url(../images/banner_02.jpg) no-repeat top left }
.masthead-speed { background:url(../images/banner_03.jpg) no-repeat top left }
.masthead-orange { background:url(../images/banner_04.jpg) no-repeat top left }
.masthead-streaks { background:url(../images/banner_05.jpg) no-repeat top left }
.masthead-startled { background:url(../images/banner_06.jpg) no-repeat top left }
.masthead-bluesteel { background:url(../images/banner_07.jpg) no-repeat top left }
.masthead-services { background:url(../images/banner_08.jpg) no-repeat top left }

#masthead #text
	{
		margin:0;
		padding:29px 0 0 150px;;
	}

/*************************************************************************
TOPNAV
*************************************************************************/			
	
#topnav
	{
		background:url(../images/topnav_bar.gif) repeat-x top left;
		width:100%;
		height:25px;
		z-index:10;
		position:relative;
	}
	
#topnav ul
	{
		height:25px;	
		margin:0;
		padding:0 0 0 192px;
		list-style-type:none;
		background:url(../images/topnav_left.gif) no-repeat 165px 0px;
	}
	
#topnav li
	{
		float:left;
		margin:0;
		padding:0;
		border-left:1px solid #FFF;
	}
	
#topnav li#navcontact
	{
		padding-right:29px;
		background:url(../images/topnav_right_old.gif) no-repeat top right;
	}	

#topnav a,#topnav a:visited
	{
		font-weight:bold;
		text-decoration:none;
		padding:4px 10px;
		display:block;
		background:#E4E4E4 url(../images/topnav_tile.gif) repeat-x top left;
		border:1px solid #E4E4E4;
		white-space:normal;
		text-align:left;
	}	
	
html > body #topnav a, html > body #topnav a:visited
	{
		/* unsure why this is necessary, but anchors are 1 pixel shorter in Firefox, Opera, etc than IE */
		padding:4px 10px 5px;
	}

#topnav a:hover
	{
		color:#FFF;
		background:#267AA2 url(../images/topnav_tile_hilite.gif) repeat-x top left;
		border:1px solid #267AA2;
	}
	
/********* SECOND LEVEL (DROP DOWNS) ************/

#topnav li ul
	{
		background:none;
		border:none;
		margin:0;
		padding:0;
		height:auto;
		position:absolute;
		left:-999em;
		width:180px;
		border-top:1px solid #FFF;
	}	
	
#topnav li li
	{
		clear:both;
		border:0;
		width:100%;
	}

#topnav li:hover ul, #topnav li.sfhover ul
	{	left:auto; }	
	
#topnav li li a,#topnav li li a:visited,#topnav li li a:hover
	{
		height:1%;
		line-height:1em;
		padding:4px 11px;
		background:#E4E4E4 url(../images/topnav_drop_tile.gif) repeat-x top left;
	}

/* Feed background color to IE 5 to stop weird list background disappearing bug */
/* escaped value passes correct settings back to IE6 */
* html #topnav li li a,#topnav li li a:visited,#topnav li li a:hover
	{
		background:#F2F2F2;
		bac\kground:#E4E4E4 url(../images/topnav_drop_tile.gif) repeat-x top left;
	}


#topnav li li a:hover
	{
		background:#267AA2 url(../images/topnav_drop_tile_hilite.gif) repeat-x top left;		
	}
	
/* Feed background color to IE 5 to stop weird list background disappearing bug */
/* escaped value passes correct settings back to IE6 */
* html #topnav li li a:hover
	{
		background:#267AA2;
		bac\kground:#267AA2 url(../images/topnav_drop_tile_hilite.gif) repeat-x top left;				
	}
	
/*************************************************************************
WRAPPER DIV FOR CONTENT
*************************************************************************/

#wrapper
	{
		clear:both;
		padding:15px 0;
		width:780px;
		margin-left:auto;
		margin-right:auto;
		text-align:left;
	}

/*************************************************************************
MAIN CONTENT PANEL ON PAGES OTHER THAN HOMEPAGE
*************************************************************************/
#panelmain
	{
		width:100%;
		position:relative;
		z-index:5;
	}
	
#panelmain:after
	{
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
	}	
	
#content
	{
		/* position:relative required to stop IE breaking image in middle after scrolling the page */
		position:relative;
		margin:0 0 0 0;
		padding:33px 230px 13px 30px;
		min-height:400px;
	}	
	
* html #content
	{
		height:400px;
	}


#content object
	{
		position:absolute;
		top:20px;
		right:220px;
/*		float:right;
		margin:-10px -10px 0 15px;
		padding:0;*/
	}		

.sideimg_product		{ background:url(../images/sidebar_circuit.jpg) no-repeat 100% 10px; }
.sideimg_aboutus		{ background:url(../images/sidebar_pushbox1.jpg) no-repeat 100% 10px; }
.sideimg_services		{ background:url(../images/sidebar_services_2.jpg) no-repeat 100% 10px; }
.sideimg_news			{ background:url(../images/sidebar_news.jpg) no-repeat 100% 10px; }
.sideimg_contact		{ background:url(../images/sidebar_contact.jpg) no-repeat 100% 10px; }
.sideimg_jobs			{ background:url(../images/sidebar_bottomoptions.jpg) no-repeat 100% 10px; }
.sideimg_returns		{ background:url(../images/sidebar_bottomoptions.jpg) no-repeat 100% 10px; }
.sideimg_terms			{ background:url(../images/sidebar_bottomoptions.jpg) no-repeat 100% 10px; }
.sideimg_sitemap		{ background:url(../images/sidebar_bottomoptions.jpg) no-repeat 100% 10px; }
.sideimg_leasing		{ background:url(../images/sidebar_bottomoptions.jpg) no-repeat 100% 10px; }
.sideimg_pushbox1		{ background:url(../images/sidebar_pushbox1.jpg) no-repeat 100% 10px; }
.sideimg_pushbox2		{ background:url(../images/sidebar_pushbox1.jpg) no-repeat 100% 10px; }
.sideimg_pushbox3		{ background:url(../images/sidebar_pushbox1.jpg) no-repeat 100% 10px; }

/* The following CSS for lists is a hack. It's not elegant, but it's something that seems to work
fairly consistently across all browsers. I've done it this way so that lists can wrap around
floated images and still maintain their relative indents rather than it being reset by the floated
image which would normally happen. */

#content ul,#content ol
	{
		margin-right:15px;
		margin-left:0;
		margin-bottom:0;
		padding:0 0 0 10px;
	}	
	
#content ul
	{
		list-style:none;
	}	
	
/* IE 3-pixel float indent bug fix */
* html #content ul
	{
		height:1%;
	}		
	
#content ul li
	{
		margin:0;
		margin-left:20px;
		padding:0;
/*		background:url(../images/bullet.gif) 3px -5px no-repeat;*/
		list-style-image:url(../images/bullet.gif);
	}
	
* html #content ul li
	{
		margin-top:-2px;
	}
	
#content ol li	
	{
		margin:0;
		margin-left:20px;
		padding:0;
	}	

/*************************************************************************
FOOTER
*************************************************************************/

#footer
	{
		clear:both;
		border-top:1px solid #DBDBDB;
		padding-top:7px;
		font-size:0.90em;
	}
	
* html #footer
	{
		padding-top:1px;		
	}
	
#footer:after
	{
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
	}	
	
#footer ul
	{
		width:100%;
		float:left;
		margin:0;
		padding:0;
		list-style-type:none;
	}
	
#footer li
	{
		float:left;
		margin:0;
		padding:0;
	}
	
#footer li a
	{
		padding:0 15px 0 0;
	}
	
#footer li#copyright a
	{
		padding:0;
	}	
	
#footer li#copyright
	{
		float:right;
	}
	
#footer li#copyright
	{
		padding-left:40px;
	}		
	
#footer p
	{
		float:right
	}	

/*************************************************************************
GENERAL PANEL DESIGNS (non specific)
*************************************************************************/

div.panel
	{
		background:#F2F2F2 url(../images/panel.gif) no-repeat top left;
		border-right:1px solid #F2F2F2;
		margin-bottom:15px;
	}
	
	div.panel2
	{
		background:#F2F2F2 url(../images/partnerspanel.gif) no-repeat top left;
		border-right:1px solid #FFF;
		margin-bottom:15px;
	}
	
	
div.panel div.spacing
	{
		padding:23px 20px 13px 30px;
	}	
	
/*************************************************************************
FORMS / INPUT TYPES
*************************************************************************/

input.text,textarea
	{
		background:#FFF;
		border:1px solid #DBDBDB;
	}	
	
label
	{
		color:#2B88B5;
		font-weight:bold;
	}	
	
/*************************************************************************
SOPHOS VIRUS FEED (TABLE)
*************************************************************************/	

#panelvirus table
	{
		border-collapse:collapse;
		width:100%;
		margin-top:15px;
		border-bottom:1px solid #DBDBDB;
	}
	
* html #panelvirus table
	{
		width:auto;
		w\idth:100%;
	}		
	
#panelvirus th
	{
		width:40%;
		color:#666;
		padding:3px 0;
		text-align:left;
		border-top:1px solid #DBDBDB;
	}
	
#panelvirus td
	{
		width:60%;
		color:#666;
		padding:3px 0;
		text-align:left;
		border-top:1px solid #DBDBDB;
	}	
	
* html #panelvirus td,* html #panelvirus th
	{
		font-size:70%;
		f\ont-size:1.0em;
	}
	
#panelmain #panelvirus,#panelmain #panelnews
	{
		position:absolute;
		right:0;
		top:0;
		width:180px;
		padding:23px 15px;
		z-index:8;
		border-left:1px solid #F2F2F2;
	}
	
* html #panelmain #panelvirus,* html #panelmain #panelnews
	{
		/* box model & position hacks for IE 5/Win */
		/* Escaped (\) values are the correct values for IE 6, IE 5 ignores them */
		width:210px;
		w\idth:180px;
		right:-1px;
		r\ight:0;
	}
	
div.panelsquare
	{
		background:#F2F2F2 url(../images/panelsquare.gif) no-repeat top left;
	}
	
	
/*************************************************************************
INNER PANELS (NEWS, CASESTUDIES ETC)
*************************************************************************/		

#content .innerpanel,#content .casestudy
	{
		border-bottom:1px solid #DBDBDB;
		margin:15px 0;
		position:relative;
		padding:0 0 15px 0;
	}

* html #content .innerpanel
	{
		height:1%;
/*		width:100%;*/
	}

#content .innerpanel:after,#content .casestudy:after
	{
	    content: "."; 
	    display: block; 
	    height: 0; 
	    clear: both; 
	    visibility: hidden;
	}	

#content .innerpanel h3
	{
		margin-bottom:10px;
		font-size:0.95em;
	}
	
#content .innerpanel h3 strong
	{
		position:absolute;
		right:0;
		color:#666;
	}	
	
#content .innerpanel h3 em
	{
		font-style:normal;
		font-weight:bold;
/*		color:#666;*/
	}		
	
#content .innerpanel p
	{
		margin:0;
		padding:0;
	}
	
#content .innerpanel img
	{
		margin:-1px 20px 0 0;
		padding:0;
		display:block;
		float:left;
		position:relative;
	}	

#content .innerpanel div 
	{
        width: 250px;
		float:left;
	}	

#content .innerpanel div img {
    float: none;
}
    
	
/*#content .innertext {
	margin-left: 120px;	
}	*/
	
#content .casestudy h3
	{
		font-size:0.95em;
	}	

/*************************************************************************
CONTACT PAGE
*************************************************************************/		

#contactdetails,#contactformoptions
	{
		margin:0;
		padding:0;
	}

#contactdetails dt,#contactformoptions dt
	{
		margin:0;
		padding:10px 0 0 20px;
		float:left;
		font-weight:bold;
	}	
	
#contactdetails dd,#contactformoptions dd
	{
		margin:0 0 0 140px;
		padding:10px 0 0 0;
		color:#2B88B5;
		height:1%;
	}
	
#contactdetails dt.phone	{ background:url(../images/icon_contact_phone.gif) no-repeat 0 10px; }
#contactdetails dt.fax		{ background:url(../images/icon_contact_fax.gif) no-repeat 0 10px; }
#contactdetails dt.email	{ background:url(../images/icon_contact_email.gif) no-repeat 0 10px; }
#contactdetails dt.post		{ background:url(../images/icon_contact_post.gif) no-repeat 0 10px; }
#contactdetails dt.map		{ background:url(../images/icon_contact_map.gif) no-repeat 0 10px; }
	
#contactform
	{
		border-top:1px solid #DBDBDB;
		margin-top:10px;
	}

#contactformoptions dt
	{
		text-align:right;
		width:140px;
		w\idth:130px;		
		padding:10px 10px 0 0;
	}
	
#contactformoptions dd
	{
		text-align:left;
		padding-top:7px;
		margin:0
	}

#contactformoptions dd input.text,#contactformoptions dd textarea
	{
		clear:both;
		float:none;
		width:370px;
		display:inline;
	}
	
/*************************************************************************
SITEMAP
*************************************************************************/		

#sitemap li
	{
		font-weight:bold;
	}
	
#sitemap li li
	{
		font-weight:normal;
	}
	
#sitemap ol
	{
		list-style-type:lower-roman;
	}	
	
/* Auto numbering code -- so far only seems to work in Opera 8 */

/*ol
	{ counter-reset: item }
ol li
	{ display: block }
ol li:before
	{ content: counters(item, "."); counter-increment: item }	*/	
	
/*************************************************************************
News Detail page
*************************************************************************/		

#news-document #headline {
	padding-top: 0;
	margin-top: 0;
	float: left;
}

#news-document #date {
	padding-top: 0;
	margin-top: 0;
	float: right;
}

#news-body p {
	padding: 0;	
	margin: 0 0 1em 0;
}

#news-body #intro {
	margin-bottom: 1em;
}

#news-body #image1 {
	float: left;
	margin: 0 20px 10px 0;
}

#news-body #image2 {
	float: right;
}

#news-body {
	margin-top: 20px;
	clear: both;
}

p.clear-empty {
	font-size: 0;
	height: 0;
	line-height: 0;
	overflow: hidden;
}



/*************************************************************************
STYLES SPECIFIC FOR HP PARTNER TABLE (July 2006)
*************************************************************************/	

		#hppartner {
			border-collapse:collapse;
			margin:0 0 15px 0;
		}
		
		#hppartner td,#hppartner th {
			border:5px solid #FFF;
		}
		
		#hppartner th {
			vertical-align:top;
			font-size:130%;
			padding:5px;
			background:#2B88B5;
			color:#FFF;			
		}
		
		#hppartner td {
			vertical-align:top;
			background:#EEE;
			padding:5px;
		}

		#hppartner th strong span {
			font-size:60%;
		}	
