@import 'reset.css';

/*
==================================================
			  	  thesteelegroup.us
			  	  	AJD | 10/08

__________________________________________________

Contents
	-Globals
	-Header
	  -Nav
	-Content
	  -Globals
	  -Home
	  -About
	  -Contact
	-Footer

__________________________________________________
*/

/*-------   Globals  --------*/

body {
	background: #dedede url('images/bg.jpg') top left repeat-x;
	font: 1.0em/1.2 Helvetica, Arial, sans-serif;
	color: #000;
}

#container {
	width: 960px;
	width: 48em;
	margin: 0 auto;
}

a{
	color: #5785BF;
}

a:hover {
	color: black;
}

.error {
	text-align: center;
	color: red;
	font-style: italic;
}

.msg {
	color: #8DC83A;
	font-style: italic;
	font-weight: bold;
	background: #e5f1d1;
	border: 1px solid #8DC83A;
}

input, textarea {
	border-top: 2px solid #7C7C7C;
	border-left: 1px solid #7C7C7C;
	border-bottom: 1px solid #DDDDDD;
}

#content p{
	font-size: 0.75em;
	line-height: 1.5;
}

h2{
	color: #336699;
	font-size: 1.25em;
	font-weight: bold;
}

h3, h3 a{
	font-size: 0.9em;
	line-height: 1.6;
	font-weight: bold;
	color: #336699;
}

h4{
	margin-top: 0.5em;
	font-weight: bold;
	font-size: 0.75em;
	color: #336699;
}

p{
	padding: 0.5em 0;
	color: #666;
}


em{
	font-style: italic;
}


sup{
	vertical-align: top;
	font-size: 70%;
}

strong{
	font-weight: bold;
}

ul.list{
	padding: 0.5em 0;
}

ul.list li, ol.list li{
	list-style-image: url('images/list.style.gif');
	margin-left: 1.5em;
	line-height: 1.4;
	color: #666666;
	font-size: 0.75em;
	margin-bottom: 1em;
}

p.em{
	color: #336699;
}

a.download.pdf{
	text-decoration: none;
	background: transparent url('images/icon.pdf.png') left center no-repeat;
	padding-left: 18px;
}

blockquote{
	background-color: #F8F8F8;
	color: #444;
	font-size: 0.9em;
	line-height: 1.5;
	padding: 2em 2em 1em 2em;
	margin: 1em 0;
	font-style: italic;
}

blockquote p.citation{
	text-align: left;
}

blockquote p.citation img{
	margin-top: 1em;
}

blockquote p.citation span{
	font-style: normal;
	display: block;
	font-size: 0.9em;
}

span.citation{
	text-decoration: underline;
}

/*-------   Header  --------*/
h1 {
	text-align: center;
}

#header{
	margin-bottom: 1em;
}


/*-------   Nav  --------*/

#nav{
	margin: 0;
	list-style: none;
	/*border-bottom: 1px solid #5785BF;*/
	background: transparent url('images/nav.bg.gif') bottom left no-repeat;
	overflow: auto;
}

#nav a {
	display: block;
	font-size: 0.875em;
	padding-top: 1em;
	padding-bottom: 0.0714em;
	color: #333;
	text-decoration: none;
	text-align: center;
	margin-bottom: 0.0714em;
	
}


#nav li {
	float: left;
	width: 10em;
	width: 7.9375em;
	width: 7.975em;
}

#nav li span{
	display: block;
	border-right: 1px solid #333;
}

#nav li:last-child span, #nav li.lastChild span{
	border-right: none;
}

#nav li a:hover{
	background: transparent url('images/nav.hover.gif') center bottom no-repeat;
}

#nav li a.active{
	background: transparent url('images/nav.active.gif') center bottom no-repeat;
	color: #fff;
}

/* --- dropdown stuff --- */

/* not in use currently, due to the lack of children uls in main nav lis */

#nav li ul {
	position: absolute;
	width: 10em;
	left: -999em;
	
	background: #ccc;
}


#nav li:hover ul, #nav li.hover ul {
	left: auto;
}

#nav li:hover a, #nav li.hover a {
}

#nav ul li a:hover{
	background: #eee;
}

#nav ul li.active{
	background: #ddd;
}


/*-------   Content  --------*/

#home #header{
	margin-bottom: 0.5em;
}

#home #content{
	margin: 0;
}

#content {
	clear: both;
	margin-top: 2em;
}

#primary{
	float: left;
	width: 32em;
}

#primary a{
}

#sub{
	float: left;
	width: 13.5em;
	padding-right: 2em;
}

#sub h2, #sidebar-wrapper h2{
	/*border-top: 1px solid #5785BF;*/
	background: transparent url('images/subnav.border.gif') top left no-repeat;
	padding-left: 0.75em;
	font-size: 0.75em;
	line-height: 2.3;
	height: 2em;
}

#subNav{
}

#subNav li{
	/*
	border-top: 1px solid #5785BF;
	*/
	background: transparent url('images/subnav.border.gif') top left no-repeat;
	font-size: 0.75em;
	line-height: 2.1;
	/*
	padding-left: 1.5em;
	*/
}

#subNav li a{
	color: #666;
	text-decoration: none;
	padding-left: 1.5em;
}

#subNav li a:hover, #subNav li.active a, #subNav li ul li.active a{
	color: #5785BF;
}

#subNav li.active ul a{
	color: #666;
}

#subNav li ul li{
	font-size: 0.833em;
	padding-left: .5em;
	background: none;
	line-height: 1.7;
}

span.vcard{
	color: #666;
	font-size: 0.75em;
}

div.vcard h3{
	color: #999;
	font-weight: normal;
	font-size: 1.2em;
}

div.vcard .fn{
	font-size: 1em;
	line-height: 1.25;
	color: #336699;
}

div.vcard .title{
	font-size: 0.875em;
}

#about div.vcard span.email{
	color: #333;
	font-size: 0.75em;
	display: block;
	border-bottom: 1px solid #6498cc;
	margin-left: 110px;
	margin-left: 190px;
	padding-bottom: 0.5em;
}

#about div.vcard .org{
	display: none;
}

#about div.advisor div.vcard .org{
	display: inline;
	font-size: 0.875em;
}

img.photo{
	float: left;
	padding: 0 1em 0.5em 0;
}

/*-------   Home  --------*/

#copy{
	float: left;
	width: 30em;
	padding: 1em 1.5em 0 1em;
	border-right: 1px solid #6498cc;
	border-top: 1px solid #6498cc;
	border-top: none;
	background: transparent url("images/home.desc.border.gif") top right no-repeat;
}

#news{
	margin-top: 1.5em;
	border-top: 1px solid #6498cc;
	float: left;
	width: 14.25em;
	padding: 0.75em 0 0.75em 0.75em;
	
	border: none;
	background: transparent url("images/home.news.border.gif") -13px 0 no-repeat;
}

#news ul{
	margin-left: 1.5em;
	font-size: 0.75em;
	line-height: 1.4;
	list-style-type: image;
	list-style-image: url('images/list.style.gif');
}

#news li, #news li a{
	color: #999;
	text-decoration: none;
}

#news li:hover, #news li a:hover, #news li.active{
	color: #336699;
	list-style-image: url('images/list.style_active.gif');
}

#cta{
	float: left;
	width: 15em;
	height: 4em;
	border-top: 1px solid #6498cc;
	
	border: none;
	background: transparent url("images/home.news.border.gif") -13px 0 no-repeat;
}

#cta a{
	display: block;
	width: 15em;
	height: 4em;
	text-indent: -999em;
	background: transparent url("images/blog.link.bg.gif") top left no-repeat;
	margin-top: 1px;
}

#home #sub{
	display: none;
}

#home #primary{
	float: none;
	width: auto;
}

/*-------   About   -------*/


/* -- Charter -- */

dl{
	color: #666;
	font-size: 0.75em;
	line-height: 1.5;
	margin: 0.5em 0;
}

dt{
	font-weight: bold;
	float: left;
	padding-right: 0.25em;
}

dd{
	margin-bottom: 2em;
}


/*-------   contact   -------*/

#contactForm{
	width: 18em;
	float: left;
}

#contactForm legend{
	display: none;
}

#contactForm label{
	display: block;
	color: #666;
	font-size:0.75em;
	line-height:1.5;
}

#contactForm input.text, #contactForm textarea{
	font: 0.85em/1.5 Helvetica, Arial, sans-serif;
	width: 18em;
	border: 1px solid #ccc;
	border-top: 1px solid #888;
}

#contactForm input.text:focus, #contactForm textarea:focus{
	border: 1px solid #5E88A2;
}

#contactForm button{
	margin: 0.5em 4em 0 0;
	float: right;
}

#contactForm fieldset{
	margin-top: 0.25em;
}

#contactForm .msg{
	width: 20.25em;
}

#contactForm span.captcha{
	display: block;
	color: #000;
	font-size:0.75em;
	line-height:1.5;
	display: inline;
}

#contactForm input#captcha{
	width: 15em;
}

div.vcard{
	color: #666;
	font-size:0.75em;
	line-height:1.5;
}

div.tel span{
	display: block;
	float: left;
	width: 6em;
}

div.vcard span.street-address{
	display: block;
	margin-top: 0.25em;
}

div.vcard .country-name{
	display: block;
	margin-bottom: 0.5em;
}

/*-------   Services  --------*/

#services #primary{
	width: auto;
}

#services h2{
	display: none;
}

#services h3{
	font-size: 1.125em;
}

#services h4{
	margin-top: 0.5em;
	font-weight: bold;
	font-size: 0.75em;
	color: #336699;
}

#services #sub{
	float: none;
	width: auto;
}

#services ul#subNav{
	margin: 0 1.4em;
}

#services ul#subNav li{
	float: left;
	width: 10.412em;
	width: 138px;
	height: 148px;
	margin: 0;
	padding: 0;
	background: transparent url('images/service.bg.gif') center center no-repeat;
	text-align: center;
	
}

#services ul#subNav li.active{
	background: transparent url('images/service.bg_active.gif') bottom center no-repeat;
	font-weight: bold;
}


/*------ Strategy Button ------*/

#services ul#subNav li.strategy{
	background: transparent url('images/service.bg.strategy.gif') 0px 10px no-repeat;
}

#services ul#subNav li.strategy:hover{
	background: transparent url('images/service.bg.strategy.gif') 0px -137px no-repeat;
}

#services ul#subNav li.strategy.active{
	background: transparent url('images/service.bg.strategy.gif') 0px -285px no-repeat;
}


/*------ Methods Button ------*/

#services ul#subNav li.methods{
	background: transparent url('images/service.bg.methods.gif') 0px 10px no-repeat;
}

#services ul#subNav li.methods:hover{
	background: transparent url('images/service.bg.methods.gif') 0px -137px no-repeat;
}

#services ul#subNav li.methods.active{
	background: transparent url('images/service.bg.methods.gif') 0px -285px no-repeat;
}


/*------ Innovation Button ------*/

#services ul#subNav li.innovation{
	background: transparent url('images/service.bg.innovation.gif') 0px 10px no-repeat;
}

#services ul#subNav li.innovation:hover{
	background: transparent url('images/service.bg.innovation.gif') 0px -137px no-repeat;
}

#services ul#subNav li.innovation.active{
	background: transparent url('images/service.bg.innovation.gif') 0px -285px no-repeat;
}

/*------ Growth Button ------*/

#services ul#subNav li.growth{
	background: transparent url('images/service.bg.growth.gif') 0px 10px no-repeat;
}

#services ul#subNav li.growth:hover{
	background: transparent url('images/service.bg.growth.gif') 0px -137px no-repeat;
}

#services ul#subNav li.growth.active{
	background: transparent url('images/service.bg.growth.gif') 0px -285px no-repeat;
}

/*------ People Button ------*/

#services ul#subNav li.people{
	background: transparent url('images/service.bg.people.gif') 0px 10px no-repeat;
}

#services ul#subNav li.people:hover{
	background: transparent url('images/service.bg.people.gif') 0px -137px no-repeat;
}

#services ul#subNav li.people.active{
	background: transparent url('images/service.bg.people.gif') 0px -285px no-repeat;
}

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

#services ul#subNav li.active a{
	color: #5785BF;
}

#services ul#subNav li a{
	display: block;
	height: 44px;
	padding-top: 106px;
	padding-left: 0;
	font-size: 1.25em;
}

#services #primary{
	width: 30em;
	float: left;
	padding: 0 1em 0.5em 1em;
	margin-top: 1em;
}

#services #secondary{
	width: 12em;
	height: 19.5em;
	float: left;
	margin-top: 1em;
	padding: 1em;
	background: transparent url('images/services.side.bg.gif') top left no-repeat;
	background: none;
}

ul#sitemap.list li{
	font-size: 0.85em;
	margin-bottom: 0.1em;
}

ul#sitemap.list li ul li{
	font-size: 1.0em;
}


/*-------   Media  --------*/

li.release, li.paper{
	margin: 0.75em 0;
}

li.release span.date, li.paper span.author{
	font-size: 0.75em;
}

li.release p span, li.paper p span{
	text-transform: uppercase;
	font-weight: bold;
}

div.item{
	overflow: auto;
	margin-bottom: 20px;}

div.cert img, div.item img{
	float: left;
	padding: 0 10px 10px 0;}

div.cert{
	clear: both;}

div.item img{ width: 100px;}

/*-------   Footer  --------*/

#footer{
	padding: 2.5em 0 1em 0;
	font-size: 0.625em;
	color: #666;
	clear: both;
	width: 100%;
	margin-top: -1em;
}

#footer span.bg{
	display: block;
	width: 100%;
	height: 1px;
	background: transparent url("images/footer.bg.gif") top left no-repeat;
	margin: 1em 0;
}

#footerNav {
	margin-left: 1em;
}

#footerNav li{
	display: block;
	float: left;
}

#footerNav a{
	text-decoration: none;
	color: #666;
}

#footerNav li.firstChild a, #footerNav li:first-child a{
	margin-right: 1em;
	padding-right: 1em;
	border-right: 1px solid #666;
}

#footerNav a:hover{
	color: #333;
}

#footer p.copy{
	float: right;
}

#footer #green{
	width: 64px;
	height: 64px;
	margin: 0.5em auto;
	margin-top: -37px;
}

div.clear{
	clear: both;
	height: 0;
	width: 0;
}