/* CSS Document */

/*	Styles for generic content
	------------------------------------------------------------- */


body
	{
	font-family: Verdana, Arial, Helvetica, sans-serif;
	background: #4A4A58 url(../chrome/bg.gif) repeat-x top;
	text-align: center;
	font-size: 0.8em;
	margin: 0;
	}
	
a
	{
	color: #c30;
	font-weight: bold;
	text-decoration: none;
	}
	
a:hover
	{
	color: #f63;
	text-decoration: underline;
	}
	
p
	{
	margin-top: 0;
	line-height: 20px;
	font-size: 12px;
	}
	
	
/*	main document structure
	---------------------------------------------------------------------------------- */
	
#main
	{
	width: 744px;
	text-align: center;
	background: transparent url(../chrome/shadow.gif) repeat-y top;
	margin: auto;
	}
	
#page
	{
	margin: 0;
	text-align: left;
	width: 720px;
	float: left;
	background-color: #e5e5ec;
	}

#content
	{
	margin: 0;
	padding: 25px 0;
	text-align: left;
	width: 720px;
	float: left;
	background-color: #e5e5ec;
	}

#endlinks
	{
	background: transparent url(/chrome/bkgd-shadow-bottom.jpg) no-repeat top;
	float: none;
	clear: both;
	padding: 20px;
	margin: 0;
	}
	
span.hide
	{
	display: none;
	}
	
div.spacer
	{
	display: block;
	clear: both;
	height: 1px;
	font-size: 1px;
	overflow: hidden;
	}
	
#shadowleft
	{
	width: 12px;
	height: 274px;
	float: left;
	background: transparent url(../chrome/shadow_left_small.gif) no-repeat top right;
	}

#shadowright
	{
	width: 12px;
	height: 274px;
	float: left;
	background: transparent url(../chrome/shadow_right_small.gif) no-repeat top left;
	}
	
#shadowleftcontent
	{
	width: 12px;
	height: 320px;
	float: left;
	background: transparent url(../chrome/shadow_left_content.gif) no-repeat top right;
	}

#shadowrightcontent
	{
	width: 12px;
	height: 320px;
	float: left;
	background: transparent url(../chrome/shadow_right_content.gif) no-repeat top left;
	}
	
	
/*	header styles
	---------------------------------------------------------------------------------- */
	
#header
	{
	height: 40px;
	clear: both;
	background-color: #000;
	border-bottom: 4px solid white;
	}
	
#header img.logo
	{
	display: none;
	}

#header h2
	{
	display: none;
	}
	
#header h1
	{
	margin: 0;
	padding: 0;
	width: 242px;
	height: 40px;
	float: left;
	clear: none;
	}
	
#header h1 a
	{
	display: block;
	width: 242px;
	height: 40px;
	background: transparent url(../chrome/header.gif) no-repeat top left;
	}
	
#header ul
	{
	width: 172px;
	height: 12px;
	display: inline;
	float: left;
	clear: none;
	margin: 24px 0 0 302px;
	padding: 0;
	}
	
#header ul li
	{
	list-style-type: none;
	float: left;
	margin: 0;
	padding: 0;
	}
	
#header ul li.contact
	{
	background: transparent url(../chrome/spacer_header.gif) no-repeat bottom left;
	}
	
#header ul li a
	{
	display: block;
	height: 12px;
	}
	
#header ul li a.extranet
	{
	margin-right: 3px;
	background: transparent url(../chrome/clientlogin.gif) no-repeat top left;
	width: 88px;
	}
	
#header ul li a.extranet:hover
	{
	background: transparent url(../chrome/clientlogin.gif) no-repeat bottom left;
	}
	
#header ul li a.contact
	{
	margin-left: 5px;
	background: transparent url(../chrome/contactus.gif) no-repeat top left;
	width: 76px;
	}
	
#header ul li a.contact:hover
	{
	background: transparent url(../chrome/contactus.gif) no-repeat bottom left;
	}


/*	Main Movie Display
	---------------------------------------------------------------------------------- */

#mainmovie
	{
	width: 720px;
	height: 200px;
	background: #999;
	}

	
/*	Nav display
	---------------------------------------------------------------------------------- */
	
#nav ul
	{
	width: 720px;
	height: 30px;
	clear: both;
	margin: 0;
	padding: 0;
	}
	
#nav ul li
	{
	list-style-type: none;
	float: left;
	margin: 0;
	padding: 0 0 0 2px;
	background: #fff url(../chrome/spacer_nav.gif) no-repeat top left;
	}
	
#nav ul li.first
	{
	background: none;
	padding: 0;
	}
	
#nav ul li a
	{
	display: block;
	height: 30px;
	}
	
#nav ul li a.about
	{
	background: transparent url(../chrome/aboutus.gif) no-repeat top left;
	width: 103px;
	}
	
#nav ul li a.about:hover
	{
	background: transparent url(../chrome/aboutus.gif) no-repeat bottom left; 
	}
	
#nav ul li a.services
	{
	background: transparent url(../chrome/services.gif) no-repeat top left;
	width: 94px;
	}
	
#nav ul li a.services:hover
	{
	background: transparent url(../chrome/services.gif) no-repeat bottom left;
	}
	
#nav ul li a.technologies
	{
	background: transparent url(../chrome/technologies.gif) no-repeat top left;
	width: 138px;
	}
	
#nav ul li a.technologies:hover
	{
	background: transparent url(../chrome/technologies.gif) no-repeat bottom left;
	}
	
#nav ul li a.portfolio
	{
	background: transparent url(../chrome/portfolio.gif) no-repeat top left;
	width: 181px;
	}
	
#nav ul li a.portfolio:hover
	{
	background: transparent url(../chrome/portfolio.gif) no-repeat bottom left;
	}
	
#nav ul li a.press
	{
	background: transparent url(../chrome/press.gif) no-repeat top left;
	width: 71px;
	}
	
#nav ul li a.press:hover
	{
	background: transparent url(../chrome/press.gif) no-repeat bottom left;
	}
	
#nav ul li a.employment
	{
	background: transparent url(../chrome/employment.gif) no-repeat top left;
	width: 123px;
	}
	
#nav ul li a.employment:hover
	{
	background: transparent url(../chrome/employment.gif) no-repeat bottom left;
	}


/*	Nav CSS for current link display
	---------------------------------------------------------------------------------- */
		
body#about #nav ul li a.about
	{
	background: transparent url(../chrome/aboutus.gif) no-repeat bottom left;
	}	
	
body#services #nav ul li a.services
	{
	background: transparent url(../chrome/services.gif) no-repeat bottom left;
	}
	
body#technologies #nav ul li a.technologies
	{
	background: transparent url(../chrome/technologies.gif) no-repeat bottom left;
	}	
	
body#portfolio #nav ul li a.portfolio
	{
	background: transparent url(../chrome/portfolio.gif) no-repeat bottom left;
	}

body#casestudy #nav ul li a.portfolio
	{
	background: transparent url(../chrome/portfolio.gif) no-repeat bottom left;
	}
	
body#press #nav ul li a.press
	{
	background: transparent url(../chrome/press.gif) no-repeat bottom left;
	}	
	
body#employment #nav ul li a.employment
	{
	background: transparent url(../chrome/employment.gif) no-repeat bottom left;
	}

/*	footer styles
	---------------------------------------------------------------------------------- */

#footer
	{
	margin: 0 auto;
	text-align: left;
	color: #ccc;
	font-size: 10px;
	clear: both;
	width: 744px;
	height: 64px;
	background: #000 url(../chrome/shadow_footer_bg.gif) no-repeat bottom;
	}

#footer address
	{
	display: block;
	margin-left: 20px;
	padding-top: 6px;
	color: #fff;
	font-style: normal;
	}
	
#footer p
	{
	margin: 0 0 0 20px;
	font-size: 10px;
	}
	
#shadowfooter
	{
	width: 744px;
	height: 12px;
	margin: 0 auto;
	background: transparent url(../chrome/shadow_footer.gif) no-repeat top right;
	}

#endlinks
	{
	font-family: Verdana, Helvetica, Arial, sans-serif;
	font-size: 11px;
	text-align: center;
	margin: 0 auto;
	padding: 0;
	}

#endlinks ul
	{
	margin: 0 auto;
	height: 30px;
	padding: 0;
	}

#endlinks ul li
	{
	display: inline;
	padding: 0 6px;
	}

#endlinks ul li a
	{
	color: #eee;
	}
	
/*	Content Styles
	----------------------------------------------------------------------------------- */
	
#content h2,
#content h3,
#content h4,
#content p,
#content address,
#content form
	{
	margin-top: 0;
	margin-left: 237px;
	margin-right: 60px;
	}
	
#content form h3
	{
	margin-left: 0;
	}
	
#content img
	{
	float: left;
	
	/*margin-left: 20px;
	width: 200px;*/
	}

#content .extremeleft
	{
	position: relative;
	left: -26px;
	float: left;
	clear: left;
	}
	
#content .extremeleftimg
	{
	position: relative;
	left: -26px;
	float: left;
	clear: left;
	margin:-9px 0 80px 0;
	}
	
#content ul
	{
	margin-left: 257px;
	margin-right: 60px;
	list-style-type: square;
	list-style-position: outside;
	}
	
#content ul li
	{
	margin-bottom: 6px;
	font-size: 11px;
	line-height: 14px;
	color: #444;
	}

#content ul li *
	{
	margin-left: 0;
	}
	
body#home #content h2,
body#home #content h3,
body#home #content p,
body#portfolio #content h3.index,
body#portfolio #content ul.index
	{
	margin-left: 20px;
	margin-right: 20px;
	}
	
#content h2
	{
	font-size: 14px;
	text-transform: uppercase;
	padding: 0 0 6px 0;
	border-bottom: 1px solid #999;
	}
	
#content h3
	{
	font-size: 13px;
	margin-bottom: 5px;
	}
	
#content h4
	{
	font-size: 13px;
	font-weight: normal;
	font-style: italic;
	}


	
/*	Home Page and Portfolio Index Styles
	----------------------------------------------------------------------------------- */
	
body#home div#content
	{
	background: #e5e5ec url(../chrome/bg_content.gif) repeat-y top left;
	padding-top: 0;
	}
	
body#portfolio div#content,
body#casestudy div#content,
body#contact div#content
	{
	text-align: left;
	padding-top: 0;
	padding-bottom: 0;
	}
	
body#portfolio #main #content div.section
	{
	padding-top: 0;
	border-color: #e5e5ec;
	}
	
body#portfolio #content div.sectiontop
	{
	border-color: #fff;
	}
	
body#home p
	{
	line-height: 1.2em;
	}
	
body#home div#content div.section h2
	{
	margin-top: 0;
	margin-bottom: 10px;
	}

body#portfolio #content h3.index
	{
	margin: 20px;
	margin-bottom: 10px;
	padding: 0;
	}

body#portfolio #content h3 a
	{
	margin: 20px;
	margin-bottom: 10px;
	margin-left: 0px;
	padding: 0;
	font-size:12px;
	font-weight:bold;
	color: #c30;
	}

body#portfolio #content ul.index
	{
	margin: 0 20px;
	padding: 0;
	}

body#portfolio #content ul.index li
	{
	list-style-type: none;
	margin: 0 0 5px 0;
	padding: 0;
	color:#666;
	}
	
body#portfolio #content a
	{
	text-decoration:none;
	font-weight:normal;
	font-size: 11px;
	color:#000000;
	}
	
body#portfolio #content a:hover
	{
	color: #f63;
	text-decoration: underline;
	}
		
body#portfolio #content div div
	{
	margin-top: 5px;
	}
	
body#portfolio #content div div div div
	{
	margin-left: 8px;
	}
	
body#portfolio #content div div div div a
	{
	color: #c30;
	}
	
body div#content
	{
	background: #e5e5ec url(../chrome/sectionheader_bg.gif) repeat-x top;
	}
	
div.section
	{
	float: left;
	width: 236px;
	margin: 0;
	padding: 0 0 10px 0;
	background: #e5e5ec url(../chrome/sectionheader_bg.gif) repeat-x top;
	border-left: 6px solid white;
	}
	
div.sectiontop
	{
	border-bottom: 6px solid #fff;
	padding: 0;
	}
	

div.firstsection
	{
	border-left: none;
	}
	
body#home #content h2
	{
	margin: 0;
	padding: 0;
	border: none;
	width: 236px;
	height: 29px;
	}
	
h2.coreservices
	{
	background: transparent url(../chrome/title_coreservices.gif) no-repeat top left;
	}
	
h2.highlights
	{
	background: transparent url(../chrome/title_highlights.gif) no-repeat top left;
	}
	
h2.technologies
	{
	background: transparent url(../chrome/title_technologies.gif) no-repeat top left;
	}
	
body div#main div#content div.sectiontop h2,
div#content div.sectiontop p,
div#content div.sectiontop address
	{
	margin: 0 10px;
	padding: 0;
	border: none;
	line-height: 14px;
	}
	
div#content div.sectiontop h2
	{
	font-size: 12px;
	color: #555;
	}
	
body div#main div#content h2
	{
	margin-top: 20px;
	}

	
body#contact div.sectiontop
	{
	height: 100px;
	padding-top: 10px;
	background: transparent url(../chrome/bg_contactinfo.gif) repeat-x top left;
	}
	
	
/*	Formatted Items Page Styles
	----------------------------------------------------------------------------------- */
	
#content ul.items
	{
	margin: 20px;
	padding: 0;
	}
	
#content ul.items li
	{
	list-style-type: none;
	list-style-position: outside;
	display: block;
	clear: both;
	margin: 0 0 20px 0;
	padding: 0;
	color: #000;
	}
	
#content ul.items li h3
	{
	float: left;
	clear: none;
	width: 201px;
	text-align: right;
	margin: 1px 15px 0 0;
	padding: 2px 0 6px 0;
	}
	
#content ul.items li p
	{
	display: inline;
	float: left;
	width: 399px;
	text-align: left;
	clear: right;
	border-bottom: 1px solid #e5e5ec;
	}
	
#content ul.items li p a
	{
	white-space: nowrap;
	}
	
	
/*	Case Study Styles
	----------------------------------------------------------------------------------- */

body#casestudy div#main
	{
	width: 100%;
	text-align: center;
	background: none;
	}
	
body#casestudy div#main div#belt
	{
	width: 744px;
	margin: 0 auto;
	}

body#casestudy #shadowleftcontent,
body#casestudy #shadowrightcontent
	{
	display: none;
	}

body#casestudy div#content
	{
	clear: both;
	width: 100%;
	height: 945px;
	margin: 0 auto;
	background-color: transparent;
	}

body #content div.col1, 
body #content div.col2
	{
	width: 220px;
	margin: 0px;
	margin-left: 3px;
	margin-right: 10px;
	float: left;
	}

body #content div.col1 *, 
body #content div.col2 *
	{
	margin: 0;
	}

body #content div.col1 h4,
body #content div.col2 h4
	{
	margin-bottom: 8px;
	font-weight: bold;
	}
	
body #content div.col1 ul, 
body #content div.col2 ul
	{
	margin: 0;
	padding: 0;
	margin-bottom: 16px;
	}
	
body #content div.col1 ul li, 
body #content div.col2 ul li
	{
	list-style-type: square;
	list-style-position: inside;
	}
	
body #content #sidestories
	{
	width: 234px;
	float: left;
	}
body #content #sidestories #sidemenu
	{
	height: 180px;
	}
	
/*	Section Specific Case Study Styles
	----------------------------------------------------------------------------------- */
	
body #content ul.study
	{
	list-style-type: none;
	margin-left: 237px;
	padding-left: 0;
	}
	
body #content ul.study ul
	{
	padding-left: 0px;
	margin-left: 0px;
	list-style-type: none;
	}

body #content ul.study ul li
	{
	padding-left: 0px;
	margin-left: 15px;
	}
	
body#portfolio #content ul.study li ul li a
	{
	color:#c30;
	}
	
body#portfolio #content p.more a
	{
	color: #c30;
	font-weight: bold;
	text-decoration: none;
	}
	
body#portfolio #content p.more a:hover
	{
	olor: #f63;
	text-decoration: underline;
	}
