* 
{
	margin	: 0px;
	padding	: 0px;
	border	: 0px;
}
html, body 
{
	margin		: 8px 0;
	padding		: 0px;
	background	: #dcdcd5;
	font		: 14px 'Times New Roman', Times, Georgia, Garamond, serif;
	color		: #4a535a;
}

/*--------------------------------- HTML Basic Elements */

h1
{
	font			: 20px Arial, Helvetica, Verdana, sans-serif;
	color			: #002133;
	margin-bottom	: 17px;
}
h1 em 
{
	color		: #a01520;
	font-style	: normal;
}
h2 /* used on titleBar in pageHead, positioned in #pageTitle h2 on site.css */
{
	color	: #002133;
	font	: 18px Arial, Helvetica, Verdana, sans-serif;
}
h3 /* sub-heading on content pages, below title bar */
{
	margin-top		: 20px;
	margin-bottom	: 25px;
	font			: 17px Georgia, 'Times New Roman', Times, serif;
	color			: #a01520;
}
h3 span /* used in case studies overviews.. */
{
	color	: #4a535a;
}
h4 /* #contentMain .section headers */
{
	font	: 17px/50px Arial, Tahoma, Helvetica, sans-serif;
	color	: #2b4156;
}
h5 /* used in contentSide headers */
{
	font		: bold 12px Georgia, 'Times New Roman', Times, serif;
	color		: #8a9d2e;
	margin-top	: 20px;
}
h5.first
{
	margin-top	: 0px;
}
#sidebar h6 /* used in #recent-work .project titles on home page */
{
	font	: bold 12px Arial, Helvetica, Verdana, sans-serif;
	color	: #39505f;
}
#content h6 /* General paragraph Heading */
{
	margin			: 20px 0 5px 0;
	font-weight		: bold;
	font-size		: 12px;
	/*color			: #002133;*/
	text-transform	: uppercase;
	clear			: left;
}
h6 img {
	margin: 1px 3px;
}
h6 a {
	text-decoration	: underline;
}
h6 a:hover {
	text-decoration	: none;
}
h7 /* Warning text - missed required field */
{
	margin			: 20px 0 5px 0;
	font-weight		: bold;
	font-size		: 12px;
	color			: #A01520;
	text-transform	: uppercase;
	clear			: left;
}
p
{
	margin-top	: 15px;
	line-height	: 20px;
}
p.more
{
	width		: 100%;
	text-align	: right;
}
a
{
	color			: #176090;
}
a:hover
{
	color			: #81111a;
	text-decoration	: none;
}
a:active
{
	color	: #7a0d0d;
}
a.back-to-top 
{ 
	/* .section back-to-top positioned in _site.css */
	display		: block;
	width		: 65px;
	height		: 13px;
	background	: url(images/back-to-top.gif) bottom left no-repeat;
}
a:hover.back-to-top { background: url(images/back-to-top.gif) top left no-repeat; }


a span.feed
{
	text-decoration	: none;
	text-transform	: uppercase;
	font-size		: 10px;
	font-weight		: bold;
	color			: #81111a;
	padding-right	: 2px;
}

a#contact-us
{
	display		: block;
	width		: 149px;
	height		: 22px;
	margin		: 15px 0;
	background	: url(images/btn_contact-us.gif) bottom left no-repeat;
	text-indent	: -9999px; 
}

hr
{
	border		: none 0; 
	border-top	: 1px dotted #acacac;
	height		: 1px;
	margin		: 8px 0 10px 0;
	clear		: both;
}
div.divider
{
	width		: 100%;
	height		: 1px;
	margin		: 5px 0;
	background	: url(images/hr_divider.gif) top left repeat-x;
	clear		: both;
	font-size	: 1px;
}

.clear 
{ 
	width	: 100%;
	clear	: both; 
}

/*--------------------------------- Form Elements */
form .label 
{
	clear		: left;
	float		: left;
	width		: 100px;
	font-weight	: bold;
	font-size 	: 13px;
}
form .field
{
	float		: left;
}

.tip
{
	font			: italic 11px/28px Arial, Tahoma, Helvetica, sans-serif;
	color			: #787878;
	text-indent		: 8px;
}
.tip.error
{
	font-size	: 12px;
	font-weight	: bold;
	color		: #81111a;
}

input, textarea, select
{
	font		: 12px Arial, Tahoma, Helvetica, sans-serif;
	margin		: 3px 0;
	padding		: 3px;
	color		: #2b4156;
	background	: #fafcf9;
	border		: #cbcdcb 1px solid;
}
select option { padding-right : 10px; }
input.selected, textarea.selected, select.selected
{
	background		: #FFF;
	border			: #a01520 1px solid;
}
input.btn
{
	background		: #a01520;
	color			: #FFF;
	padding			: 0px;
	margin			: 0px;
	border			: 0;
	font-size		: 10px;
	text-transform	: uppercase;
	width			: 105px;
	height			: 19px;
	background		: url(images/btn_bg.gif) top left no-repeat;
}
#page
{
	width		: 980px;
	margin		: 0 auto; 
}
#main
{
	width		: 770px;
	/*background	: #FFF url(images/main_bg.gif) top left repeat-y;*/
	/* main_bg is set on divs that use it, 
	this avoides the footer from showing it when content areas resize */
	float		: left;
}

/*--------------------------------- Tab Nav */
#nav
{
	width		: 100%;
	height		: 61px;
	background	: #FFF url(images/main_bg.gif) top left repeat-y;
}
#tabNav
{
	height		: 27px;
	background	: transparent url(images/tabNav_bg.gif) top left no-repeat;
	position	: relative;
}
#tabNav ul
{
	list-style	: none;
	position	: absolute;
	top			: 0px;
	right		: 11px;
}
#tabNav ul li a
{
	display			: block;
	text-decoration	: none;
	text-indent		: -9999px;
	
	outline: none;
}
#tabNav #about, #tabNav #careers, #tabNav #blogs, #tabNav #help-desk, #tabNav #contact
{
	float	: left;
}
/* This is obnoxious and redundant to set all these shared styles individually, but IE staggers things otherwise */
/* NOTE: 'Fake' preloading used - tabNav background contain both the normal and hover states. :hover styles change the position on the backgound */
/*///////////////////// ABOUT US */
#tabNav #about a
{
	width		: 61px;
	height		: 27px;
	float		: left;
	background	: transparent url(images/tabNav_about.gif) bottom right no-repeat;
	display		: block;
}
#tabNav #about a:hover { background : url(images/tabNav_about.gif) top left no-repeat; }
#tabNav #about a.selected { background : url(images/tabNav_about_selected.gif) top left no-repeat; }


/*///////////////////// CAREERS */
#tabNav #careers a
{
	width		: 56px;
	height		: 27px;
	float		: left;
	background	: transparent url(images/tabNav_careers.gif) bottom left no-repeat;
	display		: block;
}
#tabNav #careers a:hover { background : url(images/tabNav_careers.gif) top left no-repeat; }
#tabNav #careers a.selected { background : url(images/tabNav_careers_selected.gif) top left no-repeat; }


/*///////////////////// BLOGS & ARTICLES */
#tabNav #blogs a
{
	width		: 100px;
	height		: 27px;
	float		: left;
	background	: transparent url(images/tabNav_blogs.gif) bottom left no-repeat;
	display		: block;
}
#tabNav #blogs a:hover { background : url(images/tabNav_blogs.gif) top left no-repeat; }
#tabNav #blogs a.selected { background : url(images/tabNav_blogs_selected.gif) top left no-repeat; }


/*///////////////////// HELP DESK */
#tabNav #help-desk a
{
	width		: 73px;
	height		: 27px;
	float		: left;
	background	: transparent url(images/tabNav_help-desk.gif) bottom left no-repeat;
	display		: block;
}
#tabNav #help-desk a:hover { background : url(images/tabNav_help-desk.gif) top left no-repeat; }
#tabNav #help-desk a.selected { background : url(images/tabNav_help-desk_selected.gif) top left no-repeat; }


/*///////////////////// CONTACT */
#tabNav #contact a
{
	width		: 78px;
	height		: 27px;
	float		: left;
	background	: transparent url(images/tabNav_contact.gif) bottom left no-repeat;
	display		: block;
}
#tabNav #contact a:hover { background : url(images/tabNav_contact.gif) top left no-repeat; }
#tabNav #contact a.selected { background : url(images/tabNav_contact_selected.gif) top left no-repeat; }

/*--------------------------------- Main Nav */
#mainNav
{
	height		: 34px;
	position	: relative;
}
#mainNav ul
{
	list-style	: none;
	position	: absolute;
	bottom		: 6px;
	right		: 3px;
}
#mainNav ul li
{
	display			: inline;
	margin-right	: 3px;
	color			: #cadbe8;
	font			: bold 11px Arial, Helvetica, Verdana, sans-serif;
}
#mainNav ul li a
{
	padding			: 0 10px;
	color			: #4a535a;
	text-transform	: uppercase;
	text-decoration	: none;
}
#mainNav ul li a:hover
{
	color		: #81111a;
}
#mainNav ul li a.selected
{
	color	: #81111a;
	background	: transparent url(images/mainNav_over.gif) left center no-repeat;
}

/*--------------------------------- Sidebar */
/* Note: #sidebar styles for home page set in home.css
Sidebar content styles for interior pages set in site.css */
#sidebar
{
	width		: 210px;
	background	: transparent url(images/sidebar_bg.gif) top left repeat-y;
	float		: left; height: auto;
	position	: relative;
}
#sidebar .top
{
	width		: 100%;
	height		: 110px; /* This sets the vertical alignment of #featured */
	background	:  #dcdcd5 url(images/sidebar_top.gif) top left no-repeat;
}

/*--------------------------------- Footer */
#footer { clear	: both; }
#footer div
{
	border		: #b7bab6 1px solid; 
	border-top	: none; 
	padding		: 3px 20px 10px 20px;
	/* Home page footer borders set as in-line styles */
	background	: none;
	color		: #60686e;
	font		: 11px Arial, Helvetica, Verdana, sans-serif;
	float		: right;
}







#recent-work
{
	width		: 193px;
	background	: url(images/recent-work_head.gif) 7px 0px no-repeat;
	padding-top	: 20px;
	margin-left	: 8px;
}
#recent-work .project
{
	margin-bottom	: 3px;
	padding			: 3px 10px 8px 10px;
	background		: #eeeeea;
	border			: #caccca 1px solid;
}
#recent-work .project .snapshot
{
	margin		: 0px;
	padding		: 0px;
	width		: 159px;
	height		: 122px;
	background	: url(images/project_blank.gif) top left no-repeat;
}
#recent-work .project img
{
	margin	: 4px 0 0 5px;
}
#recent-work .project .specs /* Allows independent positioning of image and info */
{
	margin-left	: 15px;
}
#recent-work { font	: 11px Arial, Helvetica, Verdana, sans-serif; }
#recent-work a /* same styles as #case-studies a set in site.css */
{
	font	: 11px Arial, Helvetica, Verdana, sans-serif;
	color	: #a01520;
}
#recent-work .project a:hover
{
	color	: #cd0212;
}

a#recent-work-link /* View our Portfolio */
{
	display			: block;
	text-decoration	: none;
	padding			: 10px;
	margin			: 8px 0px;
	font			: 12px Arial, Helvetica, Verdana, sans-serif;
	color			: #a01520;
	text-align		: center;
	background		: #eeeeea;
	border			: #caccca 1px solid;
}
a:hover#recent-work-link
{
	text-decoration	: none;
	background		: #FFF;
}