@charset "UTF-8";
/* CSS Document */



/******************************************************************/
/******************************************************************/
/*                                                                */
/*                      sup. it's css.                            */
/*                                                                */
/******************************************************************/
/******************************************************************/


/******************************************************************/
/*	Yo.
--------------------------------------------------------------------

If you care to help or advise, find my contact at johnbonfield.com

Also, commenting the code hopefully helps FutureCoders* to understand 
I was thinking while doing, so later edits / updates are easier.

JB

*These are not time-travelers.



--------------------------------------------------------------------
	CSS Detailage
--------------------------------------------------------------------

	Author:		Bonfield, from johnbonfield.com
	Date:		08 Mar 08
	Version:	003
	Revised:	23 Jul 08
	
	
*/






body {
	font: 80% Arial, Helvetica, Verdana, sans-serif;
	background: #d0cece url(/i/bg_pattern.gif) top left repeat;
	margin: 0; /* it's good practice to zero the margin and padding of the body element to account for differing browser defaults */
	padding: 0;
	text-align: center; /* this centers the container in IE 5* browsers. The text is then set to the left aligned default in the #container selector */
	color: #000;
	}
p, div, h1, h2, h3, h4, h5, h6, ul, ol, td, span, li, a, dd, dt, dl  {
	font-size: 1em;
	line-height: 1.75em;
	margin: 0;
	padding: 0;
	font-weight: normal;
	}
ul, ol {
	margin-left: 1em;
	padding-left: 1em;
	margin-bottom: 12px;
	}
h1, h2, h3, h4, h5, h6  {
	color: #c66a1d;
	padding-top: 1em;
	}
img {
	border: none;
	}
h1 {
	font-size: 1.7em;
	line-height: 1.4em;
	}
#homePg h1, .breadcrumbs {
	font-size: 10px;
	text-transform:uppercase;
	color: #a39994;
	margin-bottom: 15px;
	padding-top: 0;
	}
.breadcrumbs span {
	color: #ccc;
	}
h2 {
	font-size: 1.5em;
	}
h3 {
	font-size: 1.4em;
	}
#pressreleasePg h3 {
	color: #333;
	text-transform: uppercase;
	line-height: 1.2em;
	font-size: 1.1em;
	font-weight: bold;
	padding-bottom: 10px;
	border-bottom: 1px dotted #ddd;
	margin-bottom: 20px;
	}
#pressreleasePg h1.noSub {
	padding-bottom: 10px;
	border-bottom: 1px dotted #ddd;
	margin-bottom: 20px;
	}
h4 {
	font-size: 1.2em;
	}
#careersPg dl {
	border-top: 1px #ddd dotted;
	padding-top: 5px;
	margin-top: 20px;
	margin-left: 25px;
	}
#careersPg dd, #careersPg dt {
	color: #666;
	}
#careersPg dt {
	font-weight: bold;
	color: #c66a1d;
	font-size: 1.4em;
	}

#contactPg h4 {
	margin-top: 0;
	padding-top: 0;
	}
h5 {
	font-size: 1em;
	color: #999;
	}
h6, #footer p, #bottomNav p {
	font-size: .9em;
	line-height: 1.25em;
	}

a, a:link, a:visited {
	color: #00c;
	text-decoration: none;
	}
h1 a, h1 a:link, h1 a:visited, h2 a, h2 a:link, h2 a:visited, h3 a, h3 a:link, h3 a:visited, h4 a, h4 a:link, h4 a:visited, h6 a, h6 a:link, h6 a:visited {
	color: #c66a1d;
	}

a:hover, a:active {
	color: #900;
	text-decoration: underline;
	}	


#container {
	width: 1018px;
	margin: 0 auto; /* the auto margins (in conjunction with a width) center the page */
	padding: 0;
	border: 0;
	text-align: left; /* this overrides the text-align: center on the body element. */
	}
#mainContent {
	background: transparent url(/i/bg_container.png) top center repeat-y;
	margin: 0;
	padding: 0; /* remember that padding is the space inside the div box and margin is the space outside the div box */
	}

#top {
	background: transparent url(/i/bg_top.png) top center no-repeat;
	height: 150px;
	padding: 0 75px;
	}
#top p {
	color: #fff;
	margin: 0 0 12px;
	}
#top p.idiLogo {
	padding: 24px 0 0 0;
	}
#top a {
	color: #fff;
	}
ul#mainNav {
	position: absolute;
	top: 96px;
	left: 50%;
	margin: 0 0 0 -450px;
	list-style-type:none; 
	padding: 0;
	width: 900px;
	}
ul#mainNav li {
	display: inline; 
	margin:0; 
	padding:0;
	}
ul#mainNav li a img {
	width: 60px;
	height: 32px;
	background:#ccc url(/i/navbar.png) 0 0 no-repeat;
	}
#mainNav li a#nav2 img {
	width: 98px;
	background:#ccc url(/i/navbar.png) -60px 0 no-repeat;
	} 
#mainNav li a#nav3 img {
	width: 89px;
	background:#ccc url(/i/navbar.png) -158px 0 no-repeat;
	}
#mainNav li a#nav4 img {
	width: 66px;
	background:#ccc url(/i/navbar.png) -247px 0 no-repeat;
	} 
#mainNav li a#nav5 img {
	width: 188px;
	background:#ccc url(/i/navbar.png) -313px 0 no-repeat;
	} 
#mainNav li a#nav6 img {
	width: 150px;
	background:#ccc url(/i/navbar.png) -501px 0 no-repeat;
	} 
#mainNav li a#nav7 img {
	width: 100px;
	background:#ccc url(/i/navbar.png) -650px 0 no-repeat;
	} 
#mainNav li a#nav8 img {
	width: 140px;
	background:#ccc url(/i/navbar.png) -735px 0 no-repeat;
	} 
#mainNav li a:hover img {
	background:#ccc url(/i/navbar.png) 0 -32px no-repeat;
	}
#mainNav li a:hover#nav2 img {
	background:#ccc url(/i/navbar.png) -60px -32px no-repeat;
	} 
#mainNav li a:hover#nav3 img {
	background:#ccc url(/i/navbar.png) -158px -32px no-repeat;
	}
#mainNav li a:hover#nav4 img {
	background:#ccc url(/i/navbar.png) -247px -32px no-repeat;
	} 
#mainNav li a:hover#nav5 img {
	background:#ccc url(/i/navbar.png) -313px -32px no-repeat;
	}
#mainNav li a:hover#nav6 img {
	background:#ccc url(/i/navbar.png) -501px -32px no-repeat;
	} 
#mainNav li a:hover#nav7 img {
	background:#ccc url(/i/navbar.png) -650px -32px no-repeat;
	} 
#mainNav li a:hover#nav8 img {
	background:#ccc url(/i/navbar.png) -735px -32px no-repeat;
	} 


#middle {
	background: transparent url(/i/bg_middle.png) top center no-repeat;
	padding: 0 75px 20px 75px;
	}
#middle p {
	margin: 0 0 12px;
	}
#middle #middleContent {
	margin: 0 270px 0 0;
	}

#homePg #middle #middleContent {
	margin: 0 0 12px 0;
	}

	
.boxSkinny {
	float: right;
	width: 249px;
	background: #fff url(/i/bg_box_n.gif) center left no-repeat;
	margin: 60px 0 10px 20px;
	}
.boxSkinnyTop {
	background: #fff url(/i/bg_box_n.gif) top left no-repeat;
	height: 16px;
	}
.boxSkinnyBottom {
	background: #fff url(/i/bg_box_n.gif) bottom left no-repeat;
	height: 16px;
	}
.boxedContent p, .boxedContent h3, .boxedContent h4, .boxedContent h5, .boxedContent dt, .boxedContent dd, .boxedContent li {
	padding: 0px 20px;
	font-size: .9em;
	}
.boxedContent h5 { /* ADDED 11 Apr 08 by JB for Resources in particular */
	font-weight: bold;
	color: #c66a1d;
	}
.boxedContent #flashcontent {
	padding: 0px 20px;
	}
.boxedContent h4, .boxedContent dt {
	margin: 0 20px 14px;
	padding: 0;
	font-weight: bold;
	text-transform: uppercase;
	color: #926b29;
	border-bottom: 1px #ddd dotted;
	}
.boxedContent ul, .boxedContent ol {
	list-style-type:none; 
	}
	
#newsPg .hideMe {
	display: none;
	}
#newsPg ul li {
	color: #c66a1d;
	}
#newsPg ul li span, #newsPg ol li span { /* ADDED 11 Apr 08 by JB .... getting more semantic */
	color: #999;
	font-style: italic;
	}
	
.boxHome {
	clear: both;
	width: 865px;
	background: #fff url(/i/bg_box_h.gif) center left no-repeat;
	margin-bottom: 10px;
	}
.boxHomeTop {
	background: #fff url(/i/bg_box_h.gif) top left no-repeat;
	height: 16px;
	}
.boxHomeBottom {
	background: #fff url(/i/bg_box_h.gif) bottom left no-repeat;
	height: 16px;
	}

#compNav {
	padding-top: .8em;
	border-top: 1px dotted #ddd;
	margin-top: 1.5em;
	}
#compNav p {
	font-size: .8em;
	}
#compNavL {
	float: left;
	}
#compNavR {
	text-align: right;
	}

#colUno, #colDos {
	float: left;
	}
#colUno {
	width: 249px;
	}
#colDos {
	margin-left: 15px;
	width: 337px;
	}
#colDos p.newsDate, #newsPg p.newsDate { /* DELETED by JB 11 Apr 08 */
	/*float: left;
	padding-right: 0;
	margin-bottom: 0;*/
	}
#colDos h5, #newsPg h5 { /* DELETED by JB 11 Apr 08 */
	/*padding-left: 80px;
	padding-bottom: 10px;
	padding-top: 0;*/
	}
#newsPg h5 { /* DELETED by JB 11 Apr 08 */
	/*padding-left: 63px; */
	}
#colTres {
	margin-left: 616px;
	width: 245px;
	}

#solutions {
	background: transparent url(/i/bg_solutions.png) top center no-repeat;
	clear: both;
	height: 125px;
	padding: 0 75px 0 75px;
	}
#solutions p {
	margin: 0 0 12px;
	text-align: center;
	}
	
#solutions ul {
	list-style-type:none; 
	margin: 0; 
	padding: 19px 0 0 0;
	}
#solutions li {
	display: inline; 
	margin:0; 
	padding:0;
	}
#solutions li a img {
	margin-left: 50px;
	}
#solutions li img {
	vertical-align: middle;
	}


#bottomNav {
	background: transparent url(/i/bg_bottomNav.png) top center no-repeat;
	height: 70px;
	padding: 0;
	}
#bottomNav p {
	color: #999;
	margin: 0 75px 10px;
	text-align: center;
	}
#bottomNav p a, #bottomNav p a:link, #bottomNav p a:visited {
	color: #666;
	}	
	
#bottomNav p a:hover, #bottomNav p a:active {
	color: #900;
	}	
	
#footer {
	background: transparent url(/i/bg_footer.png) top center no-repeat;
	height: 143px;
	padding: 40px 75px 0 505px;
	}
#footer p {
	color: #666;
	margin: 0 0 12px;
	}
.jbLogo {
	display: none;
	text-align:center;
	margin-top: 22px;
	margin-bottom: 30px;
	}

#clientLogin {
	position: absolute;
	top: 0;
	left: 50%;
	margin-left: 328px;
	}	
	

.alignC {
	text-align:center;
	}
.clear {
	clear:both;
	}
br.clear {
	height: 1px;
	}	
.gray {
	color: #a39994;
	}

ol.news { /* ADDED 11 Apr 08 by JB */
	list-style-type: none;
	padding-left: 5em;
	text-indent: -5em;
	}
#homePg ol.news { /* ADDED 11 Apr 08 by JB */
	padding-left: 3em;
	text-indent: -4em;
	}
ol.news span { /* ADDED 11 Apr 08 by JB */
	}
	

ol.spotlight { /* ADDED 11 Apr 08 by JB */
	list-style-type: none;
	padding-left: 0em;
	text-indent:  0em;
	}
#homePg ol.spotlight { /* ADDED 11 Apr 08 by JB */
	padding-right: 0em;
	text-indent: 0em;
	}
ol.spotlight span { /* ADDED 11 Apr 08 by JB */
	}
	
	
.externalLnk:after { /* ADDED 11 Apr 08 by JB */
	content: url(/i/external_link.gif);
	padding-left: 4px; 
	}

.ruleAbove {
	padding-top: 2em;
	margin-top: 3em;
	border-top: 1px dotted #ddd;
	}
.imgR {
	display: inline;
	float: right;
	padding-left: 25px;
	padding-bottom: 50px;
	}
	
	
/* ADDED July 23, 2008 */

span.smark { /* fix to handle ID Insight's love of the Service Mark */
	font-family: "Lucida Sans Unicode"; /* A rare sm-supporting font. */
	line-height: 0; /* keep the leading consistent in a paragraph */
	}
	

/* CONTACT FORM STYLAGE */

/*
========================================================================
	START > FORMS
------------------------------------------------------------------------
*/

form {
	width: 360px;
	text-align: left;
	margin: 0 0 0 50px;
	padding: 0;
}

fieldset {
	margin: 0;
	border: 0;
	padding: 0;
}

legend {
	display: none;
}

form h4 {
	clear: left;
	padding: 5px 0px 10px 0px;
	font-size: 14px;
	margin-top: 0;
	padding-top: 0;
}

form label {
	display: block;
	width: 310px;
	font-size: 12px;
	line-height: 14px;
	padding: 0px 0px 12px 0px;
}

form input {
	display: block;
	margin-top: 3px;
}

form select {
	float: left;
	display: block;
	padding: 0px 0px 12px 0px;
	margin: 0px 10px 12px 0px;
}

form label.field-whitepaper,
form label.field-first,
form label.field-address,
form label.field-city,
form label.field-email,
form label.field-title,
form label.field-company, 
form label.field-zip  {
	clear: left;
}


form label.field-first,
form label.field-last,
form label.field-city,
form label.field-email,
form label.field-phone, 
form label.field-zip  {
	float: left;
	margin: 0px 10px 0px 0px;
	width: 150px;
}

form label.field-first input,
form label.field-last input,
form label.field-email input,
form label.field-city input,
form label.field-phone input, 
form label.field-zip input {
	float: left;
	width: 150px;
	padding: 0px;
}

/*form label.field-state {
	float: left;
	margin-right: 10px;
	width: 60px;
}

form label.field-state select {
	width: 60px;
	float: left;
	margin-top: 3px;
}

form label.field-zip {
	float: left;
	width: 80px;
}

form label.field-zip input {
	float: left;
	width: 80px;
} */

form label.field-address {
	float: left;
	width: 310px;
	margin: 0px 0px 0px 0px;
}

form label.field-title,
form label.field-company {
	float: left;
	width: 310px;
	margin: 0px 10px 0px 0px;
}

form label.field-address input,
form label.field-title input,
form label.field-company input {
	float: left;
	width: 310px;
	padding: 0px;
}

form input#radiobutton_1,
form input#radiobutton_2,
form input#radiobutton_3,
form input#radiobutton_4 {
	clear: left;
	float: left;
	padding: 0px;
	margin: 0px 0px 0px 0px;
}

form label.radioitem {
	clear: none;
	margin: 0px 0px 0px 25px;
	padding: 0px 0px 15px 0px;
}

textarea {
	display: block;
}

form input#checkbox_1,
form input#checkbox_2,
form input#checkbox_3,
form input#more_info,
form input#wpidv,
form input#wp315,
form input#wp114 {
	clear: both;
	float: left;
	padding: 0px;
	margin: 0px;
}

form label.field-checkbox {
	clear: none;
	margin: 0px 0px 0px 25px;
	padding: 0px 0px 15px 0px;
}

form textarea {
	margin-top: 3px;
}

		

/*
------------------------------------------------------------------------
 	/ end > forms
========================================================================
*/