/*	==================================================
	Longmont United Hospital
	Primary Stylesheet
	
	Last updated: 2-26-07

	Prepared by Lively Marketing
	http://livelymarketing.com
	
	LUH Web Colors

	Golds:
		Palest	- #f7eabf
		Deepest	- #ec7
		Brown	- #836a3a
		
	Blues:
		1 - Palest	- #e1e5f0
		2 - Paler	- #cfd7eb
		3 - Pale	- #bdc8e4
		4 - Medium	- #8698c8
		5 - Deep	- #6278b5 - middle band in left curves
		6 - Deeper	- #4b63a9 - solids
		7 - Dark	- #359 - borders (+ 1 solid on homepage)
		8 - Darker	- #347 - text
		9 - Darkest	- #2d354b - text
		0 - Bright	- #04b - links only

	luh.css Table of Contents
	-Global Settings
	-Positioning, Margins & Image Replacement - main rules for site
	-Type, Coloring & Backgrounds - main rules for site
	-Secondary Navigation - Region and Left Nav - includes both layout and style rules
	-Miscellaneous - non-page specific miscellaneous layout and style rules
	-Forms
	-Additional List Rules
	-About - Leadership
	-About - Trustees
	-Careers - Benefits
	-Contact
	-Foundation - Campaigns
	-United Medical Centers

	Other Stylesheets
	PrimaryNav.css
	Import.css - imports applicable css files for Asp.net CSS Control Adapters
				that shipped with product
	Menu.css - Stylesheet that shipped with Asp.net CSS Control Adapters
	luhprint.css - Print friendly stylesheet
	home.css - home page specific styles

	Inline Styles - Should be only a few that might have been
	missed during cleanup
	and several table layouts 
	and Map & Directions due to its complexity
	
	--------------------------------------------------	*/

/*	==================================================
	Global Settings
	--------------------------------------------------	*/

* { margin: 0; padding: 0 }

img { border: 0 }

/*	==================================================
	Positioning, Margins & Image Replacement
	--------------------------------------------------	*/

#wrapper, #footer {
	width: 795px;
	margin: 9px auto;
	}

#header, #info, #logo, #search, #award {
	position: relative; /* Fix for 'peekaboo' bug. */
	}

#header ul, #sidebar ul { margin: 0 }

#info {
	clear: both;
	width: 479px; /* IE5/Mac needs width, so we need hack below for IE5.x/Win's box model... */
	padding: 2px 300px 2px 16px;
	}

/* Backslash hack - hide code from IE-mac until next comment \*/
* html #info {
	width: 795px;
	w\idth: 479px;
	}
/* End hide from IE-mac. */


#info li {
	list-style: none;
	display: inline;
	margin-right: 10px;
	}

#sidebar {
	float: left;
	width: 207px;
	}
	
#sidebar ul { padding: 0 }
	
#header {
	position: relative;
	z-index: 15;
}

#content {
	position: relative;
	z-index: 10;
}

#maincontent {
	position: relative;
	/*display: inline-block;*/
	margin-left: 208px;
	padding: 32px 36px 42px 32px;
	}

#logo {
	float: left;
	width: 485px;
	height: 75px;
	}

#search {
	text-align: right;
	float: right;
	width: 220px;
	margin: 8px 16px 8px 0;
	display: inline; /* Fix for doubled float margin in IE - see http://positioniseverything.net/explorer/doubled-margin.html for details */
	}	
	
#changing {
	margin: 0;
	padding: 9px 16px 7px;
	}

#changing h2
{
	margin-bottom: 0.1em;
}

#changing #caring
{
	padding-left: 14px;
}

.left {
	float: left;
	clear: left;
	}
	
.leftnoclear { float: left; }

.right {
	float: right;
	clear: right;
	}

.rightnoclear { float: right; }

#maincontent .right {
	position: relative;
	/*right: -36px;*/
	margin-left: 10px; /*-18px*/
	}

#maincontent .leftnoclear
{
	margin-right: 10px;
}

div.left, div.right, p.left, p.right {
	width: 50%;
	}
	
.leftcol { float: left; width: 50%; }

.rightcol { float: right; width: 50%; margin-left: -1px;}

.centerpadded { clear: both; padding-top: 0.25em; padding-bottom: 1em; text-align: center; }

.centerimage { margin: 1.1em 0px; }

/* documentation on the following '.clearfix' solution to clearing floats at the end of boxes is found at http://www.positioniseverything.net/easyclearing.html */

/*
TO ADD MORE CLASSES, USE THIS GREP SEARCH/REPLACE PATTERN (bbEdit):
^(\* html )?(\.clearfix)(:after)?
\1\2\3, \1.addedclass\3
*/

/* NOTE: the '.clearfix' class (or renamed equivalent) should be applied to the box CONTAINING the float */
.clearfix:after, #innerwrap:after, #interests:after, #primarynav:after, #content:after, .primaryNav ul.AspNet-Menu:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}

.clearfix, #innerwrap, #interests, #primarynav, #content, .primaryNav ul.AspNet-Menu {display: inline-block;}

/* Backslash hack - hide code from IE-mac until next comment\*/
.clearfix, #innerwrap, #interests, #primarynav, #content, .primaryNav ul.AspNet-Menu {display: block;}
* html .clearfix, * html #innerwrap, * html #interests, * html #primarynav, * html #content, *html .primaryNav ul.AspNet-Menu {height: 1%;} /* End hide from IE-mac. The * makes this rule apply only to IE - the "Tan Hack" is documented at http://www.positioniseverything.net/articles/box-model.html */


/*	==================================================
	Type, Coloring & Backgrounds
	--------------------------------------------------	*/

body {
	color: #2d354b;
	font-family: "Lucida Grande", "Lucida Sans Unicode", Verdana, Arial, Helvetica, sans-serif;
	font-size: 66%;
	line-height: 1.25em;
	text-align: center;
	background-color: #cfd7eb;
	}
	
a { color: #04b }
a:visited { color: #359; font-weight: normal }

h1, h2, h3, h4 {
	font-family: Georgia, Times, "Times New Roman", sans-serif;
	font-weight: normal;
	}

em { font-family: Verdana, Arial, Helvetica, sans-serif }
/* Lucida italic not as nice, so we'll sub. */

h1 em { font-family: Georgia, Times, "Times New Roman", sans-serif; color: #359;}
/* Don't want to mess w/ the serif headers though. */

h2 em { font-family: Georgia, Times, "Times New Roman", sans-serif; color: #347;}
/* Don't want to mess w/ the serif headers though. */

h1, h2, h3, h4 { margin-bottom: 0.25em }

h1 
{
	color: #359;
	font-size: 200%;
	line-height: 140%;
	}
	
h1 a, h1 a:hover
{
	color: #359;
	text-decoration: none;
}

h2 {
	color: #347;
	font-size: 160%;
	line-height: 120%;
	}

h2 a, h2 a:hover, h3 a, h3 a:hover
{
	color: #347;
	text-decoration: none;
}

h3
{
	color: #347;
	font-size: 140%;
}

h4
{
	color: #2d354b;
	font-size: 120%;
}

#sidebar a:visited { font-weight: normal }

#sidebar, #sidebar a { color: #fff }

#header a, a:hover { color: #000 }

p, ul, ol, dl { margin: 0 0 1em }

ul, ol { padding-left: 2em }

#footer a, #footer a:visited { color: #359; text-decoration: none; font-weight: bold; }

#wrapper {
	text-align: left;
	border-bottom: 1px solid #4b63a9;
	}

#header {
	color: #000;
	background: #ffffe7 url(../images/curve_ur_blue.gif) no-repeat right top;
	}

#content {
	background: url(../images/banded_bg.gif) repeat-y -100px;
	}

#innerwrap {
	background: url(../images/curve_side.gif) no-repeat 98px top;
	border-right: 1px solid #ec7;
	}

#maincontent { background: url(../images/curve_ur_gold.gif) no-repeat right top; }

#info {
	background: #ec7 url(../images/curve_ur_blue.gif) no-repeat right top;
	}
	
#changing h2 {
	color: #ec7;
	font-size: 200%;
	font-weight: normal;
}
	
#changing #experience {
	text-align: right;
}

#changing em {
	color: #ec7;
	font-family: Georgia, Times, "Times New Roman", sans-serif;
}
	
.center { text-align: center; }

.centerpadded strong, .centerpadded em { color: #000; }

#footer {
	text-align: center;
	font-size: 90%;
	color: #347;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	line-height: 130%;
	}

/*	==================================================
	Secondary Navigation - Region and Left Nav
	--------------------------------------------------	*/

#region a:hover { background-color: #6278b5 }

#secondarynav .expand a:hover { 
	background-image: url(../images/point_right_white.gif);
	background-repeat: no-repeat;
	background-position: left 50%;
	background-color: #359 
	}

#secondarynav .noexpand a:hover { 
	background-image: none;
	background-color: #359 
	}

#secondarynav a, #secondarynav a:visited {
	text-decoration: none;
	font-weight: bold;
	}

#region { /* Used to indicate what region of site we're in - this is a heading. */
	margin: 0;
	border-bottom: 1px solid #359;
	}

#region a, #region strong, #region a:visited, #region a.current:hover  {
	text-decoration: none;
	font-weight: normal;
	display: block;
	padding: 9px 16px 7px;
	background: #8698c8;
	}


#secondarynav ul {
	background: #8698c8 url(../images/shading_left_blue4.gif) repeat-y left;
	border-bottom: 1px solid #359;
	}

#secondarynav li {
	list-style: none;
	display: block;
	}

#secondarynav ul a {
	padding-left: 32px;
	}

#secondarynav a, #secondarynav strong {
	display: block;
	padding: 3px 16px;
	}

#secondarynav .currentparent {
	padding: 0px;
	}

/*#region .current, #region a.current:hover {
	color: #000;
	background: #ec7;
	}*/

#secondarynav .current {
	color: #000;
	background: #ec7;
	border-top: 1px solid #359;
	border-bottom: 1px solid #359;
	}

#secondarynav .top {border-top: 0px;}

#secondarynav .currentparent a { color: #000; }

.expand {
	background-image: url(../images/point_right_white.gif);
	background-repeat: no-repeat;
	background-position: left 50%;
	}

#secondarynav .expand .current {
	background: #ec7 url(../images/point_down_black.gif) no-repeat left 50%;
	}

#secondarynav .expand .currentparent {
	background: #ec7 url(../images/point_down_black.gif) no-repeat left 50%;
	}

#secondarynav .expand .currentparent a:hover {
	background: #359 url(../images/point_down_black.gif) no-repeat left 50%;
	}

#secondarynav .expand .noexpand .current, #secondarynav .expand .expand .current {
	background: #f7eabf;
	padding-left: 32px;
	}
	
/*	==================================================
	Miscellaneous
	--------------------------------------------------	*/

.ad {
	border-top: 1px solid #a9b6d7;
	border-bottom: 1px solid #a9b6d7;
	margin: 1em 0;
	padding: .5em 0;
	}

.alert
{
	text-align: center;
	font-size: 160%;
	color: #ff0000;
}

.border {
	border: 2px solid #fff;
	}
	
.caption
{
	vertical-align: top;
	font-size: 9px;
}

.cell
{
	border: 2px inset;
	padding: 10px;
}

#distinctions { clear:right; padding-top: 1em; padding-bottom: 1em; }

#distinctions h2 { margin-bottom: 0.6em; }

#moreinfo { clear:both; padding-top: 2em; }

/*	==================================================
	Forms
	--------------------------------------------------	*/

#searchform td {padding:6px 4px;}
td.label {font-weight:bold;text-align:right;width:100px;}
legend {margin-bottom:4px;color:#000;}
fieldset {padding:10px;}

/*	==================================================
	Additional List Rules
	--------------------------------------------------	*/
.listwrapper { clear:both; }

.narrowlist { width: 45% }

.spacedlist
{
	padding-left: 0px;
	list-style: none;
}

.spacedlist li { margin-bottom: 0.75em; }

.listnote { list-style: none; }

/*	==================================================
	About - Leadership
	--------------------------------------------------	*/
#board, #council
{
	text-align: center;
}

#board img, #council img
{
	padding: 10px;
}

.leadership
{
	margin: 1.5em 0em 1em;
	clear: both;
}

#officers .column 
{
	float: left; 
	margin: 0px 0px 20px 5px;
	vertical-align: top;
}

#officers .bottomrow { clear: left; }

#officers img.top { float:left; margin-right: 5px; }

#officers div.top { text-align: left; }

#officers img.bottom { float:left; margin: 20px 5px 0px 0px; }

#officers div.bottom { text-align: left; padding-top: 20px; }

/*	==================================================
	About - Trustees
	--------------------------------------------------	*/
#trustees { clear:both; padding-top:1em; }

/*	==================================================
	Careers - Benefits
	--------------------------------------------------	*/

.benefits
{
	margin-bottom: 2em;
	border-collapse: collapse;
	border: gray 1px solid;
}

.benefits th.benefit { width: 52%; }

.benefits th.employeetype { width: 16%; text-align: center; }

.benefits td, .benefits th
{
	padding: 0.25em;
	border-collapse: collapse;
	border: gray 1px solid;
}

.benefits td.mark
{
	text-align: center;
	vertical-align: middle;
	font-weight: bold;
	font-size: 160%;
}

/*	==================================================
	Contact
	--------------------------------------------------	*/

#locations { margin-top: 9px; margin-left: 16px; }
#departmentinfo { padding-top:20px; }

/*	==================================================
	Foundation - Campaigns
	--------------------------------------------------	*/

.campaigns
{
	margin: 1.5em 0em 0.25em;
	clear: both;
}

#howhelp { width: 100%;  }

#howhelp td
{
	width: 50%;
	padding: 10px;
	border: 2px ridge;
}

#howhelp tr { vertical-align: top; }

/*	==================================================
	United Medical Centers
	--------------------------------------------------	*/
#staff { clear:both; }
