@import "headers.css";

/* This is the IE 5.x mid-pass hack by Tantek Celik. It's only seen by IE 5.x:
	http://www.tantek.com/CSS/Examples/midpass.html */
@media tty {
 i{content:"\";/*" "*/}} @import 'global-ie55.css'; /*";}
}/* */

html,body
{
	margin: 0em;
	padding: 0em;
	background-color: white;
	color: rgb(102,102,102); /* A light gray */

	/* This centers the page content for IE */
	text-align: center;
}

body
{
	font-size: 68.8%; /* Base font size */
}

/* This sets the font-types */
body, h1, h2, h3, h4, h5, h6, td, p, a, li, input, select, textarea
{
	font-family: "Lucida Grande", "Lucida Sans Unicode", Verdana, sans-serif;
}

/* This turns off borders around images */
img
{
	border-width: 0em;

	/* Normally, I might not apply display:block to all images,
		but it happens to fit in this case */
	display: block;
}

/* Ordinary paragraphs, lists, and addresses */
p, ul, ol, dl, address
{
	font-style: normal;
	margin-top: 0em;
	padding-top: 0em;

	margin-bottom: 0.7em;
	padding-bottom: 0em;

	font-size: 1.0em;
}

/* Line height settings */
p, li
{
	line-height: 1.2; /* Formerly 1.15 */
}

/* Superscript items within paragraphs and list items */
p sup,
	li sup
{
	font-size: 0.9em;
}

/* General font sizing -- which shouldn't be necessary -- but IE could become confused otherwise */
input, textarea, select, table, td, th
{
	font-size: 1.0em;
}

form
{
	margin: 0em;
	padding: 0em;
}

/* General table properties */
table
{
	border-collapse: collapse; /* cells meet */
	border-spacing: 0em;

	font-size: 1.0em; /* This shouldn't be necessary but IE 5.x becomes confused without it */
	margin-bottom: 1.0em; /* This matches the margin-bottom on regular paragraphs */
}

table td, table th
{
	vertical-align: top;

	/* This prevents any browser defaults for th getting in the way */
	font-weight: normal;
	text-align: left;
}


/* This can be used to hide text from regular browsers while allowing it appear for text readers.
	It's the Aural Text Class from Standards Schmandards:
	http://www.standards-schmandards.com/index.php?2004/10/08/1-the-aural-text-class */
p.accessibility, li.accessibility
{
	position: absolute;
	font-size: 0;
	left: -1000px;
}


/* General link colors */

a
{
	/* IE sometimes forgets to use the right cursor, especially on image-replaced headers */
	cursor: pointer;

	text-decoration: none;
}

a:link
{
	color: rgb(68,142,181); /* A medium cyan */
}

a:visited
{
	color: rgb(66,80,107); /* A darkish blue */
}

a:hover
{
	color: rgb(7,33,60) !important; /* A very dark blue */
}

a:active
{
	color: rgb(68,142,181); /* A medium cyan */
}


/* Links within an H6 get their own colors, per Mark */
h6 a:hover
{
	color: white;
}

a#current-primary-nav,
	a#current-secondary-nav
{
	color: rgb(43,119,166) !important; /* Formerly rgb(102,153,204), a light cyan */
}

a#current-tertiary-nav
{
	color: rgb(68,142,181) !important; /* A medium cyan */
}

acronym, abbr
{
	border-bottom: 1px dotted rgb(71,71,71); /* A dark gray */
	cursor: help;
}

/* ======================================= Page =========================================== */

div#page
{
	/* margin-left: 18px; */

	margin-left: auto;
	margin-right: auto;
	text-align: left; /* This undoes the text-align center which is set on the body element for IE's sake */

	margin-top: 30px;
	width: 750px;

	background-image: url(../images/common/background-page.png);
	background-repeat: no-repeat;

	/* This allows other elements to be absolutely positioned with respect to this */
	position: relative;
}

/* General page dimensions, for reference:
	div#page: 750px
	div#page div#content-and-navigation: (100%)
	div#content-and-navigation: div#secondary-nav:

	820 - 435 = 385 (secondary + tertiary)
	secondary: 170 (44.1% of what remains)
	tertiary: 215 (55.8% of what remains)
*/


/* =============================== Content and Navigation ================================== */

/* This holds both #content and all the navigation bits */

div#page div#content-and-navigation
{
	/* This leaves room for the #header area */
	padding-top: 129px; /* This would be 130px but that's just slightly too much */

	/* This allows other elements to be positioned with respect to this */
	position: relative;
}

/* This makes use of auto-float-clearing:
	http://positioniseverything.net/easyclearing.html */

div#content-and-navigation:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

div#content-and-navigation {display: inline-table;}

/* Hides from IE-mac \*/
* html div#content-and-navigation {height: 1%;}
div#content-and-navigation {display: block;}
/* End hide from IE-mac */

/* ============================= Content alone (dimensions & positioning) ============================== */

/* These are properties for content when it's not inside a "#content-and-something-else" container */

div#content-and-navigation div#content
{
	padding-left: 3.6%; /* This matches the margin-left on #secondary-nav */

	padding-top: 1.5em;

	/* I would have used margin-bottom here so that margin-collapsing can take effect as needed
		(which is more aesthetically pleasing, in this case), but IE becomes stupid with that.
		So, voila, padding-bottom: */
	padding-bottom: 4.0em;
}


/* =========================== Content and Tertiary-Nav =========================== */

div#content-and-navigation div#content-and-tertiary-nav
{
	float: right;

	/* (650/820 = 80%, per the comp, but of course, the actual width is 750 and not 820) */
	width: 80%;
}

/* This makes use of auto-float-clearing:
	http://positioniseverything.net/easyclearing.html */

div#content-and-tertiary-nav:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
}

div#content-and-tertiary-nav {display: inline-table;}

/* Hides from IE-mac \*/
* html div#content-and-tertiary-nav {height: 1%;}
div#content-and-tertiary-nav {display: block;}
/* End hide from IE-mac */

/* ==================== Content and Tertiary-Nav: Content (dimensions & positioning) ===================== */

div#content-and-tertiary-nav div#content
{
	padding-left: 0em;
	padding-right: 0em;
	float: left;
	width: 75%; /* (450/600 = 75%. 600 is the calculated width of its parent.) */
}

/* ====================== Content and Tertiary-Nav: Tertiary-Nav (dimensions & positioning) ================= */

div#content-and-tertiary-nav div#tertiary-nav
{
	float: right;
	width: 22%; /* (150/600 = 25%. It's not quite 25% since IE often has trouble with floats which add up to 100%.) */

	/* I considered defining this in ems, but the design wouldn't have really benefitted from that. */
	padding-top: 14px; /* This matches the padding-top on div#secondary-nav */
}

/* =========================== Secondary-Nav (dimensions & positioning) ================================ */

div#content-and-navigation div#secondary-nav
{
	float: left;
	display: inline; /* This prevents some IE goofiness when applying margins in the same direction of the float */

	margin-left: 3.6%; /* This is the same margin-left as on the header */

	/* (120/820 = 15%, per the comp, but of course, the actual width is 750 and not 820) */
	width: 15%;

	/* I considered defining this in ems, but the design wouldn't have really benefitted from that. */
	padding-top: 14px; /* This matches the padding-top on div#tertiary-nav */
}


/* ======================================= Primary Nav ========================================= */

div#page div#header ul#primary-nav,
	div#page div#header ul#primary-nav li
{
	margin: 0em;
	padding: 0em;
}

div#page div#header ul#primary-nav
{
	position: absolute;
	bottom: 0.55em;
	left: 0em;

	/* If a divider were desired after the last element in the list,
		primay-nav-divider could be referenced here (with right 0.8em
		position & right padding:8px) */
	background-repeat: no-repeat;

}

/* Only IE/Windows sees this \*/
* html div#page div#header ul#primary-nav
{
	height: 1.75em; /* Formerly 2.1em when the "digitalbridge" item included a superscript "sm" */
	bottom: 0em;
}
/* End hiding from IE-mac */

ul#primary-nav li
{
	display: inline;
	list-style-type: none;

	font-family: "Arial Narrow", Arial, sans-serif;

	background-image: url(../images/primary-nav/primary-nav-divider.png);
	background-repeat: no-repeat;
	background-position: left 0.5em;

}

/* Only IE/Windows sees this \*/
* html ul#primary-nav li
{
	background-position: left 0.55em;
}
/* End hiding from IE-mac */


/* Only IE/Windows sees this \*/
* html ul#primary-nav li.with-superscript
{
	/* With superscript elements, IE increases the size of the containing box
		without permission. So, the background image needs to be rejiggered. */
	background-position: left 0.8em;
}
/* End hiding from IE-mac */


ul#primary-nav li a
{
	padding-bottom: 0.3em;

	margin-left: 8px; /* This leaves room for the background image */
	margin-right: 1px;
}

ul#primary-nav li a:link
{
	color: rgb(47,57,76); /* Formerly rgb(7,33,60), a very dark blue, and before that, rgb(66,80,107) - a navy blue */
}

ul#primary-nav li a:hover,
	ul#primary-nav li a#current-primary-nav
{
	color: rgb(43,119,166) !important; /* Formerly rgb(102,153,204), a lighter cyan */

	text-decoration: none; /* Just to be sure */

	/* The em-based measurement is to ensure that the "indicator" grows
		as the text size does */
	border-bottom: 0.2em solid rgb(43,119,166) /* Formerly rgb (102,153,204), a light cyan, and before that, rgb(66,80,107), a navy blue */
}

/* Properties for the pop-up descriptions for the primary nav */

ul#primary-nav li a em
{
	/* These numbers are relative to the primary-nav, natch */
	position: absolute;
	left: 0em;
	top: 1.8em;


	/* Helps ensure that there's no gap between the anchor and its
		tagline when mousing from one to the other */
	padding-top: 0.2em;
	padding-bottom: 0.2em;

	font-style: normal;
	color: white; /* Formerly rgb(68,142,181), a medium cyan */

	display: none; /* The descriptions are off by default */
}

/* Only IE/Windows sees this \*/
* html ul#primary-nav li a em
{
	top: 1.75em;
}
/* End hiding from IE-mac */

/* Only IE/Windows sees this \*/
* html ul#primary-nav li a:hover
{
	/* Fixes IE's stuck-hover bug:
		http://www.satzansatz.de/cssd/pseudocss.html */
	text-indent: 0em;
}
/* End hiding from IE-mac */

ul#primary-nav li a:hover em
{
	display: block !important;
}

/* ==================================== Content - General Properties ======================== */

div#content-and-tertiary-nav div#content
{
	/* padding-top could be added if there's a background image */

	background-repeat: no-repeat;
}

/* Definition lists are primarily used on the News page */

div#content dl dt
{
	/* This is applied to th etop of the dt instead of
		the bottom of the dd to accommodate multiple dds */
	margin-top: 1.0em;
	color: rgb(7,33,60); /* A very dark blue */
}

div#content dl dd
{
	margin-left: 0em;
	padding-left: 0em;
}

div#content dl dd a
{
	display: block;
}

/* Only IE/Windows sees this \*/
* html div#content dl dd a
{
	/* Once again, the Holly Hack helps IE understand basic CSS:
		http://www.positioniseverything.net/articles/hollyhack.html */
	height: 1%;
}
/* End hiding from IE-mac */


div#content blockquote
{
	padding: 0em;
	margin: 0em;

	/* Remember that margin-collapsing takes effect here. */
	margin-top: 2.5em; /* Formerly 1.4em, but setting this to 2.5em works better with margin collapsing */
	margin-bottom: 2.7em;
}

div#content blockquote dl a
{
	/* This undoes the default display:block that anchors within
		a dl get */
	display: inline;
}

div#content blockquote dl,
	div#content blockquote dt,
	div#content blockquote dd
{
	margin-left: 0em;
	margin-right: 0em;
	padding-left: 0em;
	padding-right: 0em;
}

div#content blockquote dl
{
	font-family: "Arial Narrow", Arial, sans-serif;
	font-weight: bold;
}

/* The quote itself */
div#content blockquote dl dt
{
	font-size: 1.3em;
	font-style: italic;

	color: rgb(29,50,138); /* A royal blue, more or less; formerly rgb(66,80,107), a navy blue */
	margin-top: 0em;
	margin-bottom: 0.7em;

	/* This creates the hanging quotation mark */
	text-indent: -0.6em;
	position: relative;
	left: -0.6em;
	padding-left: 0.6em;

	background-image: none; /* Just to be sure */

}

/* Source of the quote */
div#content blockquote dl dd
{
	color: rgb(120,120,120);
}



/* ================================= Content: Primary-and-secondary-content ======================= */

/* This is currently used on the Contact Wieck page, for instance */


/* This makes use of PositionIsEverything's auto float clearing technique:
	http://positioniseverything.net/easyclearing.html */

div#content div#primary-and-secondary-content:after
{
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}

div#content div#primary-and-secondary-content {display: inline-table;}

/* Hides from IE-mac \*/
* html div#content div#primary-and-secondary-content {height: 1%;}
div#content div#primary-and-secondary-content {display: block;}
/* End hide from IE-mac */


div#primary-and-secondary-content div#primary-content
{
	float: left;
	width: 75%;
}

div#primary-and-secondary-content div#secondary-content
{
	float: right;
	width: 24%;

	padding-top: 2.0em;
}


/* =================== Secondary Nav / Tertiary Nav / Secondary Content Common Properties ==================== */

div#secondary-nav,
	div#tertiary-nav,
	div#primary-and-secondary-content div#secondary-content
{
	color: rgb(7,18,60); /* A very dark blue */
}

/* These are properties for lists within the secondary nav, tertiary nav and secondary-content areas */

div#secondary-nav ul,
	div#tertiary-nav ul,
	div#primary-and-secondary-content div#secondary-content ul
{
	margin-left: 0em;
	margin-right: 0em;
	padding-left: 0em;
	padding-right: 0em;

	margin-bottom: 0.6em;
}

/* Only IE/Windows sees this \*/
* html div#secondary-nav ul,
	* html div#secondary-nav ul li,
	* html div#secondary-nav ul li a,
	* html div#tertiary-nav ul,
	* html div#tertiary-nav ul li,
	* html div#tertiary-nav ul li a,
	* html div#primary-and-secondary-content div#secondary-content ul,
	* html div#primary-and-secondary-content div#secondary-content ul li,
	* html div#primary-and-secondary-content div#secondary-content ul li a
{
	/* Once again, the Holly Hack helps IE understand basic CSS:
		http://www.positioniseverything.net/articles/hollyhack.html */
	height: 1%;
	position: relative;
}
/* End hiding from IE-mac */

div#secondary-nav ul li,
	div#tertiary-nav ul li,
	div#primary-and-secondary-content div#secondary-content ul li
{
	margin-left: 0em;
	margin-right: 0em;
	padding-left: 0em;
	padding-right: 0em;

	/* This helps IE deal with the block-level links inside these list items */
	display: inline;

	list-style-type: none;
}

/* List items in the #secondary-content area are slightly different */
div#primary-and-secondary-content div#secondary-content ul li
{
	display: block;
}

/* This generally applies the background-image bullet bits
	to the bullets on teh secondary and tertiary navs. However, it
	also adds those properties to elements within the secondary-content
	area (but not directly to links, as they're not the sole element within
	a list item there) */
div#secondary-nav ul li a,
	div#secondary-nav p,
	div#tertiary-nav ul li a,
	div#tertiary-nav p,
	div#primary-and-secondary-content div#secondary-content ul li,
	div#primary-and-secondary-content div#secondary-content p,
	div#primary-and-secondary-content div#secondary-content address
{
	display: block;

	background-image: url(../images/common/bullet.png);
	background-position: 0em 0.3em;
	background-repeat: no-repeat;
	padding-left: 7px; /* This leaves room for the bullet */

	line-height: 0.95; /* This is normally 1.15 on other paragraphs/list-items */
	padding-bottom: 0.4em;
}

/* The padding is slightly different on the secondary-nav list items */
div#secondary-nav ul li a,
	div#secondary-nav ul li.no-link
{
	padding-bottom: 0.2em;
}

/* The padding is slightly different on the secondary-content list items
	(primary for the phone numbers on the Contact page) */
div#primary-and-secondary-content div#secondary-content ul li
{
	padding-bottom: 0.1em;
}


/* Emphasis elements within the secondary contetn are used for labels
	(these properties are similar to those for emphasis elements
	within the #contact-list) */
div#primary-and-secondary-content div#secondary-content ul li em
{
	font-style: normal;
	display: inline;

	float: left;
	width: 3.5em;
}

/* Meta lists within the secondary/primary nav - these are most commonly used
	on the "Clients" page for the "view all clients" list */
div#secondary-nav ul.meta-list,
	div#tertiary-nav ul.meta-list
{
	border-top: 1px dotted rgb(66,80,107); /* A darkish blue */
	padding-top: 0.7em;
	margin-bottom: 5.0em;
	margin-left: 7px; /* This forces the border only to appear over the "list item area" */
}

div#secondary-nav ul.meta-list li a,
	div#tertiary-nav ul.meta-list li a
{
	/* This undoes the "margin-left" effect above and puts the anchor back in its place */
	margin-left: -7px;
}


/* Only IE sees this */
* html div#secondary-nav ul.meta-list,
	* html div#tertiary-nav ul.meta-list
{
	border-top-style: solid;
}

/* Link properties within the secondary-nav and tertiary-nav */

div#secondary-nav ul li a:link
{
	 color: rgb(47,57,76); /* Formerly rgb(51,102,153), a darkish blue */
}

div#tertiary-nav ul li a:link,
	div#primary-and-secondary-content div#secondary-content a:link
{
	 color: rgb(7,18,60); /* A very dark blue */
}

div#tertiary-nav ul li a:hover,
	div#primary-and-secondary-content div#secondary-content a:hover
{
	color: rgb(68,142,181) !important; /* A medium cyan */
}

/* ===================================== Header ========================================= */

/* The header holds the clock, the primary nav, the contact list, and the logo (so far) */

div#page div#header
{
	position: absolute;
	top: 0px;
	left: 0px;
	margin-left: 3.6%; /* This is the same margin-left as on the secondary-nav */
	width: 96.2%; /* 100% - 3.6% = 96.4% */
	height: 111px; /* This matches the padding-top on #content-and-navigation, minus the height of the dividing bar  */

}

/* The company logo  */
div#header p#logo
{
	position: absolute;
	top: 0px;
	right: 0px;
}

/* The image dimensions are defined here so that, in the event they
	need to be changed, only this CSS file needs to be updated. */
div#header p#logo,
	div#header p#logo img
{
	width: 239px;
	height: 35px;
}

/* This list holds the contact info */

div#header ul#contact
{
	position: absolute;
	right: 0px;
	bottom: 0.7em;
	margin: 0em;
	padding: 0em;

	/* This ensures that, in the event of insane text sizing, the contact
		info will appear above the logo */
	z-index: 10;

	width: 15em;
}

div#header ul#contact li
{
	color: rgb(47,57,76); /* Formerly rgb(7,33,60), a very dark blue, the same as the links in this section */
	list-style-type: none;

	clear: both; /* This ensures that the floated <em> elements don't cause mischief */
	text-align: right;

	
	margin-right: 0em;

	padding-right: 0em;

	background-image: url(../images/contact-list/contact-list-bullet.png);
	background-repeat: no-repeat;
	background-position: 0em 0.4em;

	padding-left: 5px; /* This leaves room for the bullet image */
}

div#header ul#contact li a:link
{
	 color: rgb(47,57,76); /* Formerly rgb(7,33,60), a very dark blue */
}

div#header ul#contact li a:hover
{
	 color: rgb(43,119,166) !important; /* Formerly rgb(102,153,204), a lighter cyan */
}

/* Emphasis elements within the contact list are used for labels */
div#header ul#contact li em
{
	color: rgb(153,153,153); /* A very light gray */
	font-style: normal;
	display: inline;

	float: left;
	width: 3.1em;
}

/* This list holds the time and date */

div#header ul#clock
{
	position: absolute;
	top: 0px;
	left: 0px;
	margin: 0em;
	padding: 0em;

	/* There used to be cursor:help here, which seemed helpful (so to speak)
		but the decision was made to remove that. */

	color: rgb(78,78,78); /* A medium gray */
}

div#header ul#clock li
{
	list-style-type: none;
	margin-left: 0em;
	margin-right: 0em;
	padding-left: 0em;
	padding-right: 0em;
	padding-bottom: 0.3em;
}

div#header ul#clock li#tagline
{
	font-family: Arial, sans-serif;
	font-size: 1.1em;
	color: rgb(102,102,102); /* A very light gray */
	letter-spacing: 0.03em;
}

/* =============================== Page: Secondary Header ====================================== */


/* The secondary-header (currently) runs across the top of the page and holds a Flash movie */
div#page div#secondary-header
{
	/* There's no background image defined in this file but it's defined
		in the individual jump-page CSS files */
	background-repeat: no-repeat;

	/* These are the numbers for the home page, but they're overrided for
		other pages which use Flash */
	width: 750px;
	height: 353px;

	/* hide overflow:hidden from IE5/Mac */
	/* \*/
	overflow: hidden;
	/* */

	position: absolute;
	top: 112px; /* This pushes the secondary-header below the (regular) header */
	left: 0px;

}

div#page object
{
	position: absolute;
	top: 0px;
	left: 0px;
	width: 750px;
}

/* Only IE sees these properties and it's hidden from IE/Mac  \*/
* html div#secondary-header param,
	* html div#secondary-header img
{
	left: 0px;
}
/* End of IE/Mac hiding */

/* ======================================= Footer =========================================== */

div#footer
{
	/* This ensures that the footer isn't flush with the bottom of the viewport */
	margin-bottom: 1.5em;
}

/* The only undordered list in the footer is the list of links */
div#footer ul,
	div#footer ul li
{
	margin: 0em;
	padding: 0em;
	list-style-type: none;
	display: inline;
}

/* Text properties within the footer */

div#footer li,
	div#footer li a,
	div#footer p
{
	font-family: "Arial Narrow", Arial, sans-serif;
}

/* Links within the footer */
div#footer li a
{
	/* This is the same color as the main body text */
	color: rgb(102,102,102); /* A light gray */
}

/* Text sizing within the footer */
div#footer ul li,
	div#footer p
{
	font-size: 0.9em;
}

/* Paragraphs within the footer */
div#footer p
{
	/* This would need to be set to display:inline if an
		unordered list of links were included in the footer.
		It would also need a 2.0em left margin. So, these two
		properties:
			display: inline;
			margin-left: 2.0em; */

	color: rgb(170,170,170); /* A very light gray */
}