/******************************************************************************
 * Puget Sound Cancer Centers main stylesheet.
 * Note: Internet Explorer hacks are in a separate file (all_ie.css)
 * Author: Neal Krouse (krousen@comcast.net)
 *
 * Table of Contents for navigation:
 * _general
 *
 * _wrapper
 *
 * _branding
 *
 * _navigation
 *
 * _content
 *
 * _primary content
 *
 * _secondary content
 *
 * _ternary content
 *
 * _footer
 *
 ******************************************************************************/
 
 
/*-----------------------------------------------------------------------------
 *	SITE COLORS:
 *
 *	PSCC Violet Blue:			#373c74
 *	PSCC Green:					#38939b
 *	PSCC Secondary Green:		#82cfce
 *
 *	h tags and a:hover:			#38939b
 *----------------------------------------------------------------------------*/
 
 
/* _general
------------------------------------------------------------------------------*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
	vertical-align: baseline;
	line-height:1.5;
	letter-spacing:.1em;
}

/* Tables still need 'cellspacing="0"' in the markup. */
table { border-collapse: separate; border-spacing: 0; }
caption, th, td { text-align: left; font-weight: normal; }

/* Remove possible quote marks (") from <q>, <blockquote>. */
blockquote:before, blockquote:after, q:before, q:after { content: ""; }
blockquote, q { quotes: "" ""; }

/* no list-markers by default, since lists are used more often for semantics */
ul,ol { list-style:none }

/* link underlines tend to make hypertext less readable, 
   because underlines obscure the shapes of the lower halves of words */
:link,:visited { text-decoration:none }

/* whoever thought blue linked image borders were a good idea? */
a img,:link img,:visited img { border:none }

/* Clearing floats without extra markup
   Based on How To Clear Floats Without Structural Markup by PiE
   [http://www.positioniseverything.net/easyclearing.html] */

.clear:after, .container:after
{
	content: "."; 
	display: block; 
	height: 0; 
	clear: both; 
	visibility: hidden;
}
.clear, .container { height: 1%; }
.clear, .container { display: block; }

html 
{ 
	/* Rule removes Page Shift by
	 * adding vertical scrollbars to every page */
	min-height: 100%; 
	margin-bottom: 1px; 
}

body
{
	font-family: arial, sans-serif;
	line-height: 1.5;
	/* Unitless for proper inheritance */
	background-color: #373c74;
	background-image: url(bodytile.gif);
	background-repeat: repeat-y;
	background-position: left top;
	color: #333;
}

/* This is where you set your desired font size. The line-height 
   and vertical margins are automatically calculated from this. 
   
   You have to add an extra calculation here because of IE, so that 
   all users may resize text manually in their browsers.
   
   The top one is for IE: The percentage is of 16px (default IE text size)
   10px is 62.5%, 12px is 75%, 13px is 81.25%, and so forth).
   The second value is what all other browsers see (the wanted font size). */
   
body   { font-size: 12px; }  /* Compliant browsers */

h1,h2,h3,h4,h5,h6 { 
	font-family: georgia, serif;
	font-weight: normal;
	clear: both; 
	line-height: 1.1;
	color: #38939b;
 }

h1 { font-size: 2em; margin-bottom: .5em;}
h2 { font-size: 1.5em; margin-bottom: .75em; }
h3 { font-size: 1.3em; margin:1em 0em;}
h4 { font-size: 1.1em; }
h5 { font-size: 1em; }
h6 { font-size: 1em; }


strong { font-weight: bold; }
em { font-style: italic; }
p { margin-bottom: 1em; }
p.small { font-size: .8em; }
p.large { font-size: 1.2em; }
a, a:link, a:visited
{
	text-decoration: underline;
	color: #333;
}
a:hover { text-decoration: underline; color: #38939b; }


.noclear { clear: none; }

.pad {
	padding:1em;
}
.pad_v {
	padding:0em 0em 1em;	
}
/* _wrapper
------------------------------------------------------------------------------*/
#wrapper
{
	padding-left: 130px;
	background-image: url(watermark.gif);
	background-repeat: no-repeat;
	background-position: left top;
}

#top
{
	position: absolute;
	top: 0;
	left: 0;
	width:1%;
	z-index: 100;
}

#skipnav
{
	position: relative;
	text-indent: -9000em;
	overflow: hidden;
}
 

/* _branding
------------------------------------------------------------------------------*/
#branding
{
	position: relative;
	width: 871px;
	height: 300px;
	padding-top: 64px;
	background-repeat: no-repeat;
	background-position: left bottom;
	background-image: url(banners/default.jpg);
}

#branding #rotator
{
	position: absolute;
	width: 871px;
	height: 300px;
}
/* banners */
.home #branding { background-image: url(banners/rotating-banner01.jpg); }
.practice #branding { background-image: url(banners/practice.jpg); }
.practice2 #branding { background-image: url(banners/practice2.jpg); }
.team #branding { background-image: url(banners/team.jpg); }
.services #branding { background-image: url(banners/services.jpg); }
.info #branding { background-image: url(banners/info.jpg); }
.info2 #branding { background-image: url(banners/info2.jpg); }
.trials #branding { background-image: url(banners/trials.jpg); }
.stories #branding { background-image: url(banners/stories.jpg); }
.contact #branding { background-image: url(banners/contact.jpg); }
.contact2 #branding { background-image: url(banners/contact2.jpg); }
.articles #branding { background-image: url(banners/articles.jpg); }
#branding h1
{
	position: absolute;
	width: 317px;
	height: 59px;
	top: 0px;
	right: 0px;
	background-image: url(brand_strip_sprite.jpg);
	background-repeat: no-repeat;
	background-position: 0px 0px;
}

/* Branding Strip Positioning 
 * Rule position brand_strip_sprite.jpg, which is a matrix of small images. 
 * The sizes of the first 3 images are:
 * W = 79px (the 4th images is 80px)
 * H = 59px
 *
 * To create different strip backgrounds make the 
 * background-position-x a multiple of -79 from 0 up to -237
 * background-position-y a multiple of -59 from 0 to -177
 */
.practice #branding h1 { background-position: -317px 0px; }
.practice2 #branding h1 { background-position: -317px 0px; }
.team #branding h1 { background-position: 0px -59px; }
.services #branding h1 { background-position: -317px -59px; }
.info #branding h1 { background-position: 0px -177px; }
.info2 #branding h1 { background-position: 0px -177px; }
.trials #branding h1 { background-position: -317px -118px; }
.stories #branding h1 { background-position: 0px -118px; }
.contact #branding h1 { background-position: -317px -177px; }
.contact2 #branding h1 { background-position: -317px -177px; }
.articles #branding h1 { background-position: -158px -59px; }
.employment #branding h1 { background-position: -79px -118px; }
.privacy #branding h1 { background-position: -237px -79px; }
.sitemap #branding h1 { background-position: -158px -118px; }
.news #branding h1 { background-position: -158px -177px; }
.localevents #branding h1 { background-position: -237px -0px; }

#branding h1 a
{
	width: 331px;
	height: 59px;
	display: block;
	position: absolute;
	top: 0px;
	left: -554px;
	text-indent: -9999em;
	overflow: hidden;
	outline: 0;
	text-decoration: none;
	background-image: url(logo.gif);
	background-repeat: no-repeat;
	background-position: left top;
	z-index: 10;
}

#branding h1 span
{
	width: 331px;
	height: 59px;
	display: block;
	position: absolute;
	top: 0px;
	left: -554px;
	overflow: hidden;
	outline: 0;
	background-image: url(logo.gif);
	background-repeat: no-repeat;
	background-position: left top;
	text-indent: -9999em;
}




/* _navigation
------------------------------------------------------------------------------*/
#nav
{
	width: 836px;
	height: 34px;
	position: relative;
	background-image: url(navigation.gif);
	background-repeat: no-repeat;
	background-position: left top;
	padding-left: 15px;
	z-index: 100;
	margin: 8px 0 0 9px;
	letter-spacing:0em !important;
	padding-bottom:0;
}

#nav li
{
	float: left;
	display: inline;
	background-image: url(navigation.gif);
	background-repeat: no-repeat;
	background-position: 0px 0px; 
	height: 34px;
}

#nav li a
{
	display: block;
	height:34px;
	text-indent: -9999em;
	overflow: hidden;
	outline: 0;
	text-decoration: none;
}

li#home 
{
	left: 0px;
	background-position: -15px 0px;
	width: 54px;
}

li#practice 
{
	left: 54px;
	background-position: -69px 0px;
	width: 95px;
}

li#team 
{
	left: 149px;
	background-position: -164px 0px;
	width: 116px;
}

li#services 
{
	left: 265px;
	background-position: -280px 0px;
	width: 98px;
}

li#info 
{
	left: 363px;
	background-position: -378px 0px;
	width: 167px;
}

li#trials 
{
	left: 530px;
	background-position: -545px 0px;
	width: 99px;
}

li#stories 
{
	left: 629px;
	background-position: -644px 0px;
	width: 109px;
}

li#contact 
{
	left: 738px;
	background-position: -753px 0px;
	width: 87px;
}

/* Over States */
li#home:hover, li#home.hover { background-position: -15px -34px; }
li#practice:hover, li#practice.hover { background-position: -69px -34px; }
li#team:hover, li#team.hover { background-position: -164px -34px; }
li#services:hover, li#services.hover { background-position: -280px -34px; }
li#info:hover, li#info.hover { background-position: -378px -34px; }
li#trials:hover, li#trials.hover { background-position: -545px -34px; }
li#stories:hover, li#stories.hover { background-position: -644px -34px; }
li#contact:hover, li#contact.hover { background-position: -753px -34px; }

/* Pressed States */
li#home:active { background-position: -15px -68px; }
li#practice:active { background-position: -69px -68px; }
li#team:active { background-position: -164px -68px; }
li#services:active { background-position: -280px -68px; }
li#info:active { background-position: -378px -68px; }
li#trials:active { background-position: -545px -68px; }
li#stories:active { background-position: -644px -68px; }
li#contact:active { background-position: -753px -68px; }

/* You-are-here States */
#home_page li#home { background-position: -15px -102px; }
#practice_page li#practice,
#care_page li#practice,
#advantage_page li#practice,
#start_page li#practice,
#swedish_page li#practice,
#qopi_page li#practice
{ background-position: -69px -102px; }

#team_page li#team,
#physicians_page li#team,
#providers_page li#team,
#administrative_page li#team,
#topdocs_page li#team
{ background-position: -164px -102px; }


#services_page li#services,
#site_services_page li#services,
#treatment_options_page li#services,
#pet_page li#services,
#complementary_care_page li#services,
#transplantation_page li#services,
#coordination_page li#services
{ background-position: -280px -102px; }


#info_page li#info,
#cancer_info_page li#info,
#patient_info_page li#info,
#emergencies_page li#info,
#patientcare_faq_page li#info,
#side_effects_page li#info,
#suggested_resources_page li#info,
#cancer_types_page li#info,
#education_page li#info,
#support_groups_page li#info
{ background-position: -378px -102px; }


#trials_page li#trials,
#trials_faq_page li#trials,
#doctor_questions_page li#trials,
#active_trials_page li#trials
{ background-position: -545px -102px; }


#stories_page li#stories { background-position: -644px -102px; }
#contact_page li#contact { background-position: -753px -102px; }

/* You-Are-Here states for drop-downs */
#practice_page #nav li li#our_practice a,
#care_page #nav li li#care a,
#advantage_page #nav li li#advantage a,
#start_page #nav li li#start a,
#team_page #nav li li#your_care_team a,
#team_page #nav li li#team a,
#physicians_page #nav li li#physicians a,
#providers_page #nav li li#providers a,
#administrative_page #nav li li#administrative a,
#services_page #nav li li#services a,
#services_page #nav li li#our_services a,
#site_services_page #nav li li#site_services a,
#treatment_options_page #nav li li#treatment_options a,
#pet_page #nav li li#pet a,
#complementary_care_page #nav li li#complementary_care a,
#transplantation_page #nav li li#transplantation a,
#coordination_page #nav li li#coordination a,
#info_page #nav li li#info a,
#info_page #nav li li#patient_care_information a,
#patient_info_page #nav li li#patient_info a,
#emergencies_page #nav li li#emergencies a,
#patientcare_faq_page #nav li li#patientcare_faq a,
#side_effects_page #nav li li#side_effects a,
#cancer_info_page #nav li li#cancer_info a,
#education_page #nav li li#education a,
#trials_page #nav li li#trials a,
#trials_page #nav li li#what_are_trials a, /* NOTE: #what_are_trials_page isn't used. Clinical Trials is both top and drop-down menus */
#trials_faq_page #nav li li#trials_faq a,
#doctor_questions_page #nav li li#doctor_questions a,
#active_trials_page #nav li li#active_trials a,
#stories_page #nav li li#stories a,
#contact_page #nav li li#contact a
{ background-color: #00949c; color: white; }



#nav li ul
{
	position: absolute;
	/* set width to suit layout */
	width: 17em; 
	left: -999em;
	background-color: #82cfce; 
}

#nav li#info ul { width: 23em; }
#nav li#trials ul { width: 17em; }

#nav li li
{
	float: none;
	display: block;
	background-image: none;
	margin: 0;
	height: 34px;
	border-bottom: 1px solid #38939b;
	border-top: 1px solid #95e4e3;
	border-left: 1px solid #6fbbbb;
	border-right: 1px solid #6fbbbb;
}

#nav li li a
{
	position: static;
	text-indent: 0;
	font-size: .9em;
	overflow: inherit;
	color: #373c74;
	padding: 0 1em;
	text-decoration: none;
	line-height: 34px;
}
#nav li li a:hover
{
	/* set this colors to suit */
	background-color: #38939b; 
	color: white;
}


#nav li:hover ul, #nav li.hover ul 
{ left: auto; }





/* _content
------------------------------------------------------------------------------*/
#content
{
	margin-top: 20px;
}


/* _primary content
------------------------------------------------------------------------------*/
#primary
{
	width: 486px;
	float: left;
	display: inline;
	margin-left: 23px;
}

#primary p
{
	letter-spacing: .1em;
}

#primary ul
{
	padding-left: 2em;
	list-style-type: disc;
	list-style-position: outside;
}

#primary ol
{
	padding-left: 2em;
	list-style-type: decimal;
	list-style-position: outside;
}

#primary p.top
{
	padding-right: 14px;
	text-align: right;
	background-image: url(icon_uparrow.gif);
	background-repeat: no-repeat;
	background-position: right center;
	font-size: .8em;
}

#primary li
{
	margin: .5em 0;
	letter-spacing: .1em;
}

#primary blockquote p
{
	color: #38939b;
	font-family: georgia, serif;
	font-style: italic;
	font-size: 1.5em;
	letter-spacing: 0;
	line-height: 1.2;
}


/* Our Physicians page */

#primary .bio { margin-bottom: 2em; }

#primary .bio img
{
	float: left;
	margin-right: 1em;
	margin-bottom: 1em;
	display: block;
}

#primary .bio h2 { clear: none; }

#primary .bio .toggle 
{
	text-decoration: underline;
	cursor: pointer;
	color: #38939b;
	font-style: italic;
}

#primary .bio .details { clear: both; }

/* add icons to links */
a[href ^="mailto:"]
{
	padding-right: 20px;
	background-image: url(icon_mailto.gif);
	background-repeat: no-repeat;
	background-position: right center;
}

a[href ^='http://'], a[href ^='https://']
{
	padding-right: 18px;
	background-image: url(icon_external.gif);
	background-repeat: no-repeat;
	background-position: right center;
}

a[href $='.pdf']
{
	padding-right: 18px;
	background-image: url(icon_pdf.gif);
	background-repeat: no-repeat;
	background-position: right center;
}



/* _secondary content
------------------------------------------------------------------------------*/
#secondary
{
	width: 295px;
	float: left;
	display: inline;
	margin-left: 45px;
}

#secondary li
{
	margin-bottom: .5em;
}

#secondary li a
{
	color: #333;
}

#secondary li a:hover
{
	color: #38939b;
}

/* Your-Are-Here states for local navigation */
#practice_page #secondary li.our_practice a, #practice_page #secondary li.our_practice a:hover,
#care_page #secondary li.care a, #care_page #secondary li.care a:hover,
#advantage_page #secondary li.advantage a, #advantage_page #secondary li.advantage a:hover,
#start_page #secondary li.start a, #start_page #secondary li.start a:hover,
#team_page #secondary li.your_care_team a, #team_page #secondary li.your_care_team a:hover,
#physicians_page #secondary li.physicians a, #physicians_page #secondary li.physicians a:hover,
#providers_page #secondary li.providers a, #providers_page #secondary li.providers a:hover,
#administrative_page #secondary li.administrative a, #administrative_page #secondary li.administrative a:hover,
#topdocs_page #secondary li.topdocs a, #topdocs_page #secondary li.topdocs a:hover,
#site_services_page #secondary li.site_services a, #site_services_page #secondary li.site_services a:hover,
#services_page #secondary li.our_services a, #services_page #secondary li.our_services a:hover,
#treatment_options_page #secondary li.treatment_options a, #treatment_options_page #secondary li.treatment_options a:hover,
#pet_page #secondary li.pet a, #pet_page #secondary li.pet a:hover,
#complementary_care_page #secondary li.complementary_care a, #complementary_care_page #secondary li.complementary_care a:hover,
#transplantation_page #secondary li.transplantation a, #transplantation_page #secondary li.transplantation a:hover,
#coordination_page #secondary li.coordination a, #coordination_page #secondary li.coordination a:hover,
#patient_info_page #secondary li.patient_info a, #patient_info_page #secondary li.patient_info a:hover,
#info_page #secondary li.patient_care_information a, #info_page #secondary li.patient_care_information a:hover,
#emergencies_page #secondary li.emergencies a, #emergencies_page #secondary li.emergencies a:hover,
#patientcare_faq_page #secondary li.patientcare_faq a, #patientcare_faq_page #secondary li.patientcare_faq a:hover,
#side_effects_page #secondary li.side_effects a, #side_effects_page #secondary li.side_effects a:hover,
#suggested_resources_page #secondary li.suggested_resources a, #suggested_resources_page #secondary li.suggested_resources a:hover,
#education_page #secondary li.education a, #education_page #secondary li.education a:hover,
#support_groups_page #secondary li.support_groups a, #support_groups_page #secondary li.support_groups a:hover,
#cancer_info_page #secondary li.cancer_info a, #cancer_info_page #secondary li.cancer_info a:hover,
#cancer_types_page #secondary li.cancer_types a, #cancer_types_page #secondary li.cancer_types a:hover,
#trials_page #secondary li.what_are_trials a, #trials_page #secondary li.what_are_trials a:hover,
#what_are_trials_page #secondary li.what_are_trials a, #what_are_trials_page #secondary li.what_are_trials a:hover,
#trials_faq_page #secondary li.trials_faq a, #trials_faq_page #secondary li.trials_faq a:hover,
#doctor_questions_page #secondary li.doctor_questions a, #doctor_questions_page #secondary li.doctor_questions a:hover,
#active_trials_page #secondary li.active_trials a, #active_trials_page #secondary li.active_trials a:hover,
#stories_page #secondary li.current a, #stories_page #secondary li.current a:hover,
#articles_page #secondary li.current a, #articles_page #secondary li.current a:hover,
#swedish_page #secondary li.swedish a, #swedish_page #secondary li.swedish a:hover,
#qopi_page #secondary li.qopi a, #qopi_page #secondary li.qopi a:hover
{
	color: #38939b;
	text-decoration: none;
	cursor: default;
}

#cancer_info_page #secondary li.cancer_info ul a, #cancer_info_page #secondary li.cancer_info ul a:hover
{
	color: inherit;
	text-decoration: underline;
	cursor: inherit;
}
#secondary li ul
{
	padding-left: 3em;
}


/* _ternary
------------------------------------------------------------------------------*/
#ternary
{
	width: 0;
	float: left;
	display: inline;
	/* not in use */
	display: none;
}


/* _footer
------------------------------------------------------------------------------*/
#footer
{
	clear: both;
	padding: 2em 0 0;
	font-size: .8em;
}

#footer p
{
	margin-left: 22px;
}

#footer p a
{

}

#footer p a:hover
{

}