/***************************************************
CSS Documentation:
==================
Layout Details
==================
 Homepage - main flash movie spans the page - 3 banners beneath
 
 
==================
About CSS
==================
To assist with viewing styles for this page: 
1. Get a copy of Mozilla Firefox at http://mozilla.org/products/firefox/ if you don't have one already.
2. Install Chris Pedericks Web Developer's Toolbar if you haven't already at http://www.chrispederick.com/work/firefox/webdeveloper/
3. You have other software that enables you to dissect a Web page layout.

=====================
Browser Compatibility
=====================
Viewable in all standard compliant browsers, degrades gracefully in older, non compliant software pre 2000.
Note: Even current browsers handle CSS differently. To accomodate these differences with one style sheet, the child selector hack is used.

The child selector: html>body #yourstylehere {margin:10px} 
IE ignores the child selector enabling page authors to assign different attributes for the same content block.
When the child selector is used it hides a set of attributes from IE but is read by Mozilla, etal. The style compatible with IE uses the 
same id or class but without the child selector. You can set major differences such as margins, padding, fonts, colors, etc.

second hack - uses the !important attribute so that standard compliant browser read that and ignore the second. IE ignores the !important attribute altogether and so applies the second style.
This enables you to make slight various that often overcomes most annoyances like font size differences, margins, etc.

Note to disregard the above note: With the release of IE 7, the IE dev team is calling all developers to clean up their css. They suggest creating
a seperate style sheet for IE 7 that is hack free and styled to work in IE 7 -- not sure if they are aware of this, but I was hoping to stay
away from multiple style sheets....sheesh.

I dream of waking one day to find that there is no such browser as IE. But until then ---
http://blogs.msdn.com/ie/archive/2005/10/12/480242.aspx

Conditional IE hack used in the css to move away from css hacks that will break sites in IE 7 
<!--[if IE]>

<style>

#footer .search

{
            margin-top: -1.6em;
}

</style>

<![endif]-->

supplies an extra stylesheet to older versions of IE if placed last in the cascade. Theoretically, you would not need css hacks for IE 7. 
Thanks, IE, for making me go back to multiple stylesheets...

<!--[if lt IE 7]>
<link rel="stylesheet" href="ie.css" type="text/css" />
<![endif]-->

=========================
In Progress Documentation
=========================
This style sheet is in progress and may contain extraneous/unused styles while in production and until release of the final site.
Created 03/29/2006 :: Diane Dougherty :: http://www.ecreative1.com :: webmaster@ecreative1.com
 
***************************************************/

/* undo  default styling of common (X)HTML browsers

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

/* remove default link styles */

:link,:visited { text-decoration:none;}

/* with strict xhtml images in tables */
img {display: block;}


/* No list-markers by default - will redefine bullets w/ bg graphics */

ul,ol {font-size:11px; line-height:150%;list-style:none; }

li {font-size:11px;}

/* Avoid browser default inconsistent heading font-sizes and pre/code */

h1,h2,h3,h4,h5,h6,pre,code { font-size:1em;color:#647acc; }


/* Remove inconsistent (among browsers) default padding or margin */

html,body,div,h1,h2,h3,h4,h5,h6,p,dl,dt,dd,pre,form,fieldset,input {margin:0; padding:0;}

/* prevent blue linked image borders */

a img  {border:none; }

/* global elements

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

/* root selectors */ 

body { background: url("../art/bodyBG.gif") repeat-x top left; background-color: #536bb0;text-align:left;font-family: "century gothic" , arial, sans-serif; }


hr { color: #e2e5f2; background: #e2e5f2; border: 0; height: 1px; text-align: center;}
ul,ol,li,dl,dt,dd, h1, h2, h3 {font-size:12px; color:#000; text-decoration:none;}

dl,dt,dd,ul,ol,li {}

a:link,a:visited { color:#244591; text-decoration:underline;font-size:11px; }

a:hover,a:active { text-decoration:none;color:#112793; }

input, select { background-color:#fff; border:1px solid #404040; width:100px; height:18px; 
				margin-bottom:2px; padding-top:2px; padding-left:4px;
				font-family:Arial, Helvetica, sans-serif; font-size:11px; color:#000; }
				
ul.list {margin:0px 25px;padding:10px;}
ul.list li a {font-weight:bold;}

ul.list li.current a:link, li.current a:active, li.current a:visited, li.current a:hover {color:#439699;text-decoration:underline;}


.clear-it {clear:both;}

#wrap { width: 754px;margin:0 auto;border-right: 1px solid #cacfe2;border-left: 1px solid #cacfe2;background-color:#fff;}
#header {height:82px;}

.blue-border {border-right: 1px solid #a3bde4;}
 
td.whtBG {background-color:#fff;}
 
div#main-content {margin:10px 30px 0px 30px; border-left: 1px solid #828ebf;}
div#main-content h1 {margin: 10px 15px 2px 15px;text-transform: uppercase;font-size:11px;color:#647acc;}
div#main-content p {margin: 0px 15px 5px 15px;font-size:11px;color:#0a1038;line-height:130%!important;line-height:120%;}

#row2 {background-color:#5a6aaa;}
#row2 h1 {color:#fff;}
#row2 p {color:#fff;line-height:160%;font-size:11px;}

#row2 td {padding: 10px 15px;width:33%;}

#row2 a {color:#fff;font-weight:bold;font-size:11px;}

div#body-content {margin: 10px 5px 20px; 14px;}
div#body-content h1 {margin: 10px 15px 2px 15px;font-size:11px;color:#647acc;line-height:160%;}
div#body-content p {margin: 0px 15px 5px 15px;font-size:11px;color:#0a1038;line-height:160%;}

div#body-content ul.list  li {font-size: 11px;line-height:150%;list-style-image: url("../art/bullet.gif");}
div#body-content blockquote {font-size: 11px;line-height:150%;}

div#body-content blockquote.withquote 

{background:url(/art/quote.gif)
no-repeat;background-position:top left;text-align: justify;padding: 0 30px;
} 

div#body-content blockquote.withquote2 

{background:url(/art/quote.gif)
no-repeat;background-position:top left;padding: 0px;margin: 10px 0 10px 0;
} 

.pdf-topics {margin-right:5px;}
div#body-content p.withunquote {background: url(/art/unquote.gif) no-repeat;color:#647acc;font: bold 12px georgia, times, serif;background-position:bottom right; line-height:160%;}
 
div#body-content2 {margin: 10px 10px 20px 14px;}
div#body-content2 h1 {margin: 10px 15px 2px 15px;font-size:12px;color:#647acc;}
div#body-content2 p {margin: 0px 15px 5px 15px;font-size:11px;color:#0a1038;line-height:160%;}
div#body-content2 li {font-size:11px;line-height:160%;margin-left:15px;list-style-image: url("../art/bullet.gif");}
div#body-content2 span {display: block; width: 600px;}


div#body-content h1 {font: bold small "century gothic", arial, sans-serif;text-transform:none;line-height:160%;}
div#body-content2 h1.large {font: bold 14px "century gothic", arial, sans-serif;text-transform:none;}
div#body-content2 h2 {margin: 10px 15px 10px 15px;font: italic 12px "century gothic", arial, sans-serif;color:#647acc;}
div#body-content2 h2.glossary-links a {color:#647acc;font-weight:bold;padding:2px;}

div#right-col {margin:-3px 5px 20px 6px;float:right:}
div#right-col h1 {margin: 10px 0 5px 10px;color:#213d91;}
div#right-col h2{color:#213d91;}
div#right-col div#action-box {margin-top:15px;}

div#quote-box {margin:-3px 5px 20px 6px;float:right;background-color:#e2e5f2;}
div#quote-box h1 {margin: 10px 0 5px 10px;color:#213d91;}
div#right-col2 div#action-box2 {margin-top:15px;}
div#quote-box p { color:#414c74;font-size: 11px; line-height:150%;}

 
p.cite i {font-weight:bold;}

a.white:link,a.white:visited,a.white:active {color:#fff;font-weight:bold;font-size:10px;}

p.readmore {float:right;}
p.readmore2 img {vertical-align:bottom;float:right;margin-bottom:0px;}
 
p.line  {margin:0; padding:0;}
img.line { vertical-align:top;}
img.line2 { vertical-align:bottom;margin:0; padding:0;}
img.hdr {margin:12px 0 12px 30px;}
img.bar {height:21px;width:754px;vertical-align:top;border-bottom:1px solid  #7d92c6;}
img.pdf {float:right;margin-top:6px;}
img.go-btn { float:right;display:block;} 

table.links span {float:left;margin: 10px 15px 2px 15px;font-size:11px;color:#647acc; font-weight:bold;}
table.links td {border-bottom: 1px dotted #9093a9;}
table.links {padding-bottom: 20px;}

div#action-box {border: 4px solid #44559f;width:330px;margin:auto;background-color:#e2e5f2;}
div#quote-box {border: 4px solid #c9cee3;width:200px;margin:auto;background-color:#e2e5f2;}

.web-id { margin:auto;text-align:center;display:block;padding-bottom:20px;}
/*****************************
Quotes
*****************************/



#QotDCopy {
	position: relative;
	left: 0;
	float: left;
	width: 274px;
	height: 452px;
	border: 1px solid rgb(204,204,204);
	background-color: rgb(227,227,227);
	color: black;
/* \*/
	width: 279px;
/* */
}

#QotDCopy h3,#QotDCopy blockquote,#QotDCopy .attribution,#QotDCopy #moreQuotes {
	padding-right: 21px;
	padding-left: 42px;
}

#QotDCopy h3 {
	font-size: 11px;
	margin: 0 0 12px 0;
	padding-top: 42px;
	font-weight: normal;
	line-height: 11px;
}

#QotDCopy blockquote {
	margin: -10px 0 0 0;
	padding-bottom: .1em;
	background-image: url(http://img.timeinc.net/time/qotd/images/bg_quote.gif);
	background-repeat: no-repeat;
	background-position: 100% 100%;
	font-family: Georgia,Palatino,serif;
	font-size: 22px;
}

#QotDCopy .openQuote,#QotDCopy .closeQuote {
	position: relative;
	color: rgb(217,22,3);
	font-size: 275%;
	line-height: .001em;
}

* html #QotDCopy .openQuote,* html #QotDCopy .closeQuote {
	position: static;
	background-repeat: no-repeat;
	color: rgb(227,227,227);
	font-size: 100%;
	line-height: 1em;
}

#QotDCopy .openQuote {
	top: .475em;
}

* html #QotDCopy .openQuote {
	padding-left: 21px;
	background-image: url(http://img.timeinc.net/time/qotd/images/bg_openquote.gif);
	background-position: 0 5px;
}

#QotDCopy .closeQuote {
	top: .5em;
}

* html #QotDCopy .closeQuote {
	padding-left: 27px;
	background-image: url(http://img.timeinc.net/time/qotd/images/bg_closequote.gif);
	background-position: 8px 6px;
}

#QotDCopy .attribution {
	margin-top: -11px;
	font-size: 11px;
	line-height: 15px;
}

#QotDCopy cite {
	font-weight: bold;
	text-transform: uppercase;
	font-style: normal;
}

#QotDCopy .attribution div {
	padding-right: 42px;
	font-style: italic;
}

/*****************************
page scrolling styles like on /site-marketing/Organic Search Engine/our process
*****************************/

#block1, #block2, #block3, #block4, #block5, #block6, 
#block7, #block8, #block9, #block10, #block11,#block12,
{
 
	margin: 0;
	padding: 0px;
}
.active {
	background-color: #e2e5f2;
}

#block0 .active {
	background-color: #ffffff;
}
.visited {
	background-color: #fff;
}
#block0, #block0.active, #block0.visited {
}


/*****************************
Navigation styles - sets up to hover based on visibility:

*****************************/

/* Top navigation

 * -------this header uses an image map instead of css --------- */

/****************************
horizontal navigation

shows half of the nav at the time of rollover - to make the roll work, you have to have absolute positioning on the #nav li element. To make that move
with the centered, then you have to set # nav position:relative - I know that relative positioning is not supposed to do that -supposed to ignore the doc
flow, but it works.
*****************************/

#nav { position:relative; top:0px;margin:0px;padding:0px;}

#nav { background:url("../art/nav.gif") no-repeat; width:754px; height:20px; }
#nav ul,li {margin:0px;padding:0px;}

#nav li { position:absolute; top: 0px; }

#nav li, #nav a { height:20px; display:block; }

#nav span { display:none; }
 
#nav-01 { width:130px; left:0px;}
#nav-02 { width:194px; left:130px;}
#nav-03 { width:81px; left:324px;}
#nav-04 { width:84px; left:405px;}
#nav-05 { width:93px; left:490px;}
#nav-06 { width:171px; left:582px;}

#nav-01 a:hover { background: transparent url(../art/nav.gif) 0px -20px no-repeat;width:130px;}
#nav-02 a:hover { background: transparent url(../art/nav.gif) -130px -20px no-repeat; width:194px;}
#nav-03 a:hover { background: transparent url(../art/nav.gif) -324px -20px no-repeat; width:81px;}
#nav-04 a:hover { background: transparent url(../art/nav.gif) -405px -20px no-repeat; width:84px;}
#nav-05 a:hover { background: transparent url(../art/nav.gif) -490px -20px no-repeat;width:93px;}
#nav-06 a:hover { background: transparent url(../art/nav.gif) -582px -20px no-repeat;width:171px;}


/* current page*/

#nav-01 a.current1:link, a.current1:active, a.current1:visited, a.current1:hover
{ background: transparent url(../art/nav.gif) 0px -20px no-repeat; }

#nav-02 a.current2:link, a.current2:active, a.current2:visited, a.current2:hover
{ background: transparent url(../art/nav.gif) -130px -20px no-repeat; }

#nav-03 a.current3:link, a.current3:active, a.current3:visited, a.current3:hover
{ background: transparent url(../art/nav.gif) -324px -20px no-repeat; }

#nav-04 a.current4:link, a.current4:active, a.current4:visited, a.current4:hover
{ background: transparent url(../art/nav.gif) -405px -20px no-repeat; }

#nav-05 a.current5:link, a.current5:active, a.current5:visited, a.current5:hover
{ background: transparent url(../art/nav.gif) -490px -20px no-repeat; }

#nav-06 a.current6:link, a.current6:active, a.current6:visited, a.current6:hover
{ background: transparent url(../art/nav.gif) -582px -20px no-repeat; }


 /*css roll descriptions beneath the nav */ 

#nav-01 a.current1:link img.roll1, a.current1:active img.roll1, a.current1:visited img.roll1 {height: 0; width: 0; border-width: 0;}
#nav-01 a.current1:hover img.roll1 {position: relative;
    top: 20px; left:0px; height: 20px; width: 754px;z-index:200;}
    
#nav-02 a.current2:link img.roll2, a.current2:active img.roll2, a.current2:visited img.roll2 {height: 0; width: 0; border-width: 0;}
#nav-02 a.current2:hover img.roll2 {position: relative;
    top: 20px; left:-130px; height: 20px; width: 754px;z-index:200;} 
    
#nav-03 a.current3:link img.roll3, a.current3:active img.roll3, a.current3:visited img.roll3 {height: 0; width: 0; border-width: 0;}
#nav-03 a.current3:hover img.roll3 {position: relative;
    top: 20px; left:-325px; height: 20px; width: 754px;z-index:200;}
    
#nav-04 a.current4:link img.roll4, a.current4:active img.roll4, a.current4:visited img.roll4 {height: 0; width: 0; border-width: 0;}
#nav-04 a.current4:hover img.roll4 {position: relative;
    top: 20px; left:-405px; height: 20px; width: 754px;z-index:200;}
    
#nav-05 a.current5:link img.roll5, a.current5:active img.roll5, a.current5:visited img.roll5 {height: 0; width: 0; border-width: 0;}
#nav-05 a.current5:hover img.roll5 {position: relative;
    top: 20px; left:-490px; height: 20px; width: 754px;z-index:200;}
    
#nav-06 a.current6:link img.roll6, a.current6:active img.roll6, a.current6:visited img.roll6 {height: 0; width: 0; border-width: 0;}
#nav-06 a.current6:hover img.roll6 {position: relative;
    top: 20px; left:-582px; height: 20px; width: 754px;z-index:200;}
    

 #subnav {width:120px;}

#subnav ul
{
	margin: 10px 0 0 10px;
	padding: 0;
	list-style-type: none;
	 }

#subnav li
{
	margin: 0;
	padding: 0;
	list-style-type: none;
 }

#subnav li a:link, #subnav li a:visited, #subnav li a:active
{
	display:block;
	background-color:transparent ;
	font-size: 11px;font-weight:bold;
	color: #44559f;
	text-decoration: none;
	padding:6px 8px;
	text-align:left;
	border-bottom: 1px dotted #9093a9;
}

#subnav li a:hover
{
	color: #5f74d0;
	text-decoration: none;
}

#subnav li.current-page, #subnav li.current-page a:link, #subnav li.current-page a:visited
{
	color: #1d285b;
	background-color: transparent ;
	font-weight: bold;
	text-decoration: none;	
}

#footer {color: #4e5d9c;width:754px;margin:auto;font-family:  arial,sans-serif;background-color:#cacfe2;height:100px;}
#footer p { font-size: 10px;color: #4e5d9c; line-height:150%;text-align:right;margin: 5px 0 0 32px;padding-right:10px;}

#footer p a	{font-size: 10px; color:#4e5d9c;text-decoration:underline;text-align:right;}

#footer ul { background-color:#4e5d9c;
				text-align:right; 
				padding: 4px 0;
				margin:0;
				list-style-type: none;
				font-size:   10px;
				border-top:1px solid #7d92c6;
				}

#footer li {
				display: inline;
				text-align: center;
				margin: 0;
				color:#eaedf8;}

#footer li a {font-size: 10px;color:#eaedf8;text-decoration:none; padding:4px 10px;}
#footer li  a:hover {text-decoration:underline;}

 /********************
 Form Styles
 *********************/
form {font-size:11px; width:100%;}
 
input.btn {width:90px;padding:2px;background-color:#43549d;color:#e2e5f2;border:1px solid #e2e5f2; cursor:pointer;height:20px;}
input.btn:hover {background-color:#354db1;color:#e2e5f2;border:1px solid #e2e5f2; cursor:pointer;}
input,
textarea {width:200px; padding: 1px 3px; margin: 2px 0; font: 1em verdana, arial, sans-serif; color: #000; background-color: #e2e5f2; border: 1px solid #43549d; }

input.checkbox {width:14px;height:14px;  background-color: #E7E1B8; border: 1px solid #C1BB95; margin-right:5px;position:relative; top:2px;}

input:focus,
textarea:focus { color: #000; background-color: #ccd1e1; border: 1px solid #43549d; }