/******************************************************************************
 * Puget Sound Bank stylesheet
 * Rules are for Standards Compliant browsers, special rules for 
 * Internet Explorer are found in file "all_ie.css"
 * 
 * Table of Contents for navigation:
 * _general
 *
 * _branding
 *
 * _navigation
 *
 * _wrapper (contains #primaryContent and #secondaryNav)
 *
 * _secondaryContent (contains #col1, #col2, #col3, .bot)
 *
 * _footer
 ******************************************************************************/

/*-----------------------------------------------------------------------------
 *	SITE COLORS:
 *	
 *	body background:			#052147	
 *	#container bkgn:			#c1bdb5
 *	nav bkgn:					#6f6754
 *	nav hover:					#968b72
 *	#secondaryContent bkgn:		#e9e3dc
 *----------------------------------------------------------------------------*/

/* _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;
}

/* 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;
}
* html .clear { height: 1%; }
.clear { display: block; }

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

body
{
	background-color: #052147;
	font-family: arial, helvetica, sans-serif;
	line-height: 1.5;
	/* Unitless for proper inheritance */
}

/* 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: 81.25%; }   /* IE */
html>/**/body   { font-size: 13px; }  /* Other browsers */

h1,h2,h3,h4,h5,h6 { 
	font-family: Arial, Helvetica, sans-serif;
	font-weight: bold;
	color: black; 
	clear: both; 
	line-height: 1.2;
 }

h1 { font-size: 1.5em; }
h2 { font-size: 1.4em; }
h3 { font-size: 1.1em; }
h4 { font-size: 1em; }
h5 { font-size: 1em; }
h6 { font-size: 1em; }

p { margin: 0 0 1em; }

a:link
{
	color: #0054a6;
	text-decoration: underline;
}

a:visited
{
	color: #6F6754;
	text-decoration: underline;
}

a:hover
{
	color: black;
	text-decoration: underline;
}

strong { font-weight: bold; }
em { font-style: italic; }
sup
{
	font-size: .8em;
	vertical-align: text-top;
}

#container
{
	width: 780px;
	margin: 0 auto;
	padding-bottom: 17px;
	background-image: url(containerbottom.gif);
	background-repeat: no-repeat;
	background-position: left bottom;
	background-color: #c1bdb5;
}

/* Class tooltip is for pop-up tool tip that displays disclaimer text. */
.tooltip
{
	width: 196px;
	height: 100px;
	padding: 10px 10px 0 55px;
	background-image: url(tooltipbkgn.gif);
	background-repeat: no-repeat;
	font-size: .84em;
	line-height: 1.4;
	color: #fff;
	border: 1px solid #fff;
	font-family: Arial, Helvetica, sans-serif;
	filter:alpha(opacity=88); 
	-moz-opacity: 0.88; 
	opacity: 0.88;
}



/* _branding
------------------------------------------------------------------------------*/
#branding
{
	height: 153px;
	position: relative;
	background-color: #052147;
	background-repeat: no-repeat;
	background-position: right bottom;
}

#branding h1
{
	text-indent: -9000px;
}


#branding h1 a
{
	position: absolute;
	width: 192px;
	height: 98px;
	left: 50px;
	top: 35px;
	background-image: url(PsbLogo.gif);
	background-repeat: no-repeat;
	background-position: left top;
	text-decoration: none;
	overflow: hidden;
}

#branding h1 a:hover { text-decoration: none; }

#home #branding { background-image: url(header01.jpg); }
#business #branding { background-image: url(header02.jpg); }
#policy #branding, #safeguard #branding { background-image: url(header03.jpg); }
#accounts #branding { background-image: url(header04.jpg); }
#online #branding, #board #branding { background-image: url(header05.jpg); }
#private #branding { background-image: url(header06.jpg); }
#commercial #branding, #team #branding { background-image: url(header07.jpg); }
#specials #branding, #womenbusiness #branding, #events_page #branding { background-image: url(header08.jpg); }
#press #branding { background-image: url(header09.jpg); }
#contact #branding { background-image: url(header10.jpg); }
#interest #branding { background-image: url(header09.jpg); } /* a new ID for notices, warnings, or other temporary items */

.skiplink { display: none; }


/* _navigation
------------------------------------------------------------------------------*/

#nav
{
	height: 42px;
	margin-bottom: 10px;
}

#nav li
{
	float: left;
	display: inline;
}

#nav li a
{
	width: 86px;
	height: 46px;
	padding: 6px 0 0 12px;
	display: block;
	font-size: .9em;
	line-height: 1.1;
	color: #fff;
	text-decoration: none;
	overflow: hidden;
}

#nav, #nav ul, #nav li, #nav li a
{
	background-color: #6f6754;
}

#nav li a:hover
{
	background-color: #968b72;
	text-decoration: none;
}

#nav li a.contact
{
	width: 82px;
}

/*	Rules for you-are-here display */
#business #nav li a.business, #business #nav li a.business:hover,
#accounts #nav li a.accounts, #accounts #nav li a.accounts:hover,
#online #nav li a.online, #online #nav li a.online:hover,
#private #nav li a.private, #private #nav li a.private:hover,
#commercial #nav li a.commercial, #commercial #nav li a.commercial:hover,
#contact #nav li a.contact, #contact #nav li a.contact:hover,
#press #nav li a.news, #press #nav li a.news:hover,
#team #nav li a.news, #team #nav li a.news:hover,
#board #nav li a.news, #board #nav li a.news:hover,
#womenbusiness #nav li a.womenbusiness, #womenbusiness #nav li a.womenbusiness:hover
{
	cursor: default;
	background-color: #c1bdb5;
	color: black;
}



/* _wrapper (contains #primaryContent and #secondaryNav)
------------------------------------------------------------------------------*/
#wrapper
{
	margin-top: 24px;
}

#primaryContent
{
	width: 520px;
	margin-left: 206px;
	float: left;
	display: inline;
	margin-right:0;
}

#press #primaryContent, #contact #primaryContent { width: 420px; }


#safeguard #primaryContent h2
{
	margin-bottom: 1em;
}

#team #primaryContent h2, #board #primaryContent h2, #contact #primaryContent h2
{
	margin-bottom: 1em;
}


#primaryContent ul
{
	list-style-type: disc;
	padding-left: 2em;
	margin-bottom: 1.4em;
}

#primaryContent ol
{
	list-style-type: decimal;
	padding-left: 2em;
	margin-bottom: 1.4em;
}

#primaryContent li
{
	margin:.7em 0;
}

#press #primaryContent ul
{
	list-style-type: none;
	padding-left: 0;
	margin-bottom: 1.4em;
}

#press #primaryContent li
{
	padding: 2px 0 3px 20px;
	display: block;
	background-image: url(pdficon_sml.gif);
	background-repeat: no-repeat;
	background-position: left top;
}
#press #primaryContent li.doc { background-image: url(icon-word_sml.gif); }

/* rules for images of board and mgt team */
#team #primaryContent h2, #board #primaryContent h2
{
	margin-bottom: 1em;
	margin-left: 150px;
}

#team #primaryContent p img,
#board #primaryContent p img
{
	float: left;
	margin-right: 4px;
	margin-top: -1.2em;
	margin-left: -130px;
}

#team #primaryContent p,
#board #primaryContent p
{ 
	margin-left: 150px
}

#team #primaryContent h3,
#board #primaryContent h3
{
	clear: both;
	margin: 1em 0 0 150px;
}

#secondaryNav
{
	width: 140px;
	margin-left: -714px;
	float: left;
	display: inline;
	margin-top: 0px;
}
#press #secondaryNav, #contact #secondaryNav { margin-left: -614px; }

#secondaryNav ul, #nav3 ul { text-align: center; }
#secondaryNav li, #nav3 li { margin: 0 0 4px; }

#team #secondaryNav,
#board #secondaryNav,
#nav3
{
	width: 136px;
	margin-right: 12px;
	margin-left:0;
	float: right;
	display: inline;
	margin-top: 0;
}

#nav3
{
	height: 150px;
}

#nav3 a { color:#fff; }

#team #secondaryNav li a, #team #secondaryNav li a:link, #team #secondaryNav li a:visited,
#board #secondaryNav li a, #board #secondaryNav li a:link, #board #secondaryNav li a:visited,
#nav3 li a, #nav3 li a:link, #nav3 li a:visited
{
	height: 24px;
	text-decoration: none;
	display: block;
	line-height: 24px;
	background-image: url(secondaryNav.gif);
	background-repeat: no-repeat;
	background-position: left top;
	color: white;
}

#team #secondaryNav li a:hover,
#board #secondaryNav li a:hover,
#nav3 li a:hover

{
	background-image: url(secondaryNav.gif);
	background-repeat: no-repeat;
	background-position: left bottom;
	color: white;
}

#team #secondaryNav li a.team, #board #secondaryNav li a.board
{
	background-image: url(secondaryNav.gif);
	background-repeat: no-repeat;
	background-position: left center;
	cursor: default;
	font-weight: bold;
}

#secondaryNav p a
{
	display: block;
	text-indent: -9000px;
	width: 140px;
	height: 32px;
	background-image: url(loginbutton.gif);
	background-repeat: no-repeat;
	background-position: left top;
}

#secondaryNav p a:hover
{
	background-position: left bottom;
	text-decoration: none;
}

/* 3 May 2007 - added new buttons */
#secondaryNav p a#premierPayment
{
	display: block;
	text-indent: -9000em;
	width: 140px;
	height: 32px;
	background-image: url(premier-payment-button.gif);
	background-repeat: no-repeat;
	background-position: left top;
	margin-top: 8px;
}

#secondaryNav p a#premierPayment:hover
{
	background-position: left bottom;
	text-decoration: none;
}

#secondaryNav p a#demo
{
	display: block;
	text-indent: -9000px;
	width: 140px;
	height: 32px;
	background-image: url(demo.gif);
	background-repeat: no-repeat;
	background-position: left top;
	margin-top: 8px;
}

#secondaryNav p a#demo:hover
{
	background-position: left bottom;
	text-decoration: none;
}

.onecol #primaryContent
{
	width: 600px;
	margin-left: 12px;
}


/* 25 April 2008
 * Changed login to online banking and
 * other online services */
#secondaryNav
{
	width: 153px;
}

h3#navhead
{
	background-color: #002e5a;
	color: white;
	text-align: center;
	padding: 4px 8px;
	font-size: 1em;
	line-height: 1.2;
	font-weight: normal;
}

ul#loginnav 
{
	/*background-color: #E9E3DC;*/
	background-image: url(secondaryNavTile.gif);
	background-repeat: repeat-y;
	background-position: left top;
	border-top: none;
	border-left: 1pt #87847e solid;
	border-right: 1pt #87847e solid;
	border-bottom: 1pt #87847e solid;
	padding: 8px 8px 1px;

}

ul#loginnav li
{
	margin-bottom: 1em;
}

ul#loginnav li a
{
	display: block;
	background-color: #6F6754;
	color: white;
	padding: 4px 12px 8px;
	border: 1px solid #6f6754;
	background-image: url(online_tile_reg.gif);
	background-repeat: repeat-x;
	background-position: left top;
	line-height: 1;
}

ul#loginnav li a:hover
{
	background-color: #968b72;
	border: 1px solid 968b72;
	background-image: url(online_tile_hover.gif);
}

#productlinks
{
	width: 134px;
	margin: 1em 0 0 0;
	padding: 8px 8px 8px 10px;
	background-image: url(prod_subnav_rule.gif);
	background-repeat: repeat-y;
	background-position: left center;
	border-top: 1pt #87847e solid;
	border-right: 1pt #87847e solid;
	border-bottom: 1pt #87847e solid;
}

#productlinks * { text-align: left; }

#productlinks li
{
	color: black;
	margin: 1em 0;
	line-height: 1.2;
}

#productlinks li a:link { color: black; }
#productlinks li a:visited { color: #6F6754; }
#productlinks li a:hover { color: #0054a6; }

/* Calendar of Events on womenbusiness.html */
#womenbusiness dl { margin: 1em 0; padding: .5em 1em; }
#womenbusiness dt
{
	float: left;
	display: inline;
	clear: left;
	font-size: 1em;
	font-weight: bold;
}

#womenbusiness dd
{
	margin-left: 9em;
	padding: 0 0 1em 2em;
	border-left: 1px solid #6F6754;
	line-height: 1.2;
}

/* Thickbox styles */
#TB_window dt
{
	font-size: 1em;
	font-weight: bold;
	float: none;
}

#TB_window dd
{
	margin: 1em 0;
	border: none;
	padding: 0;
}

#TB_window ul
{
	list-style-type: disc;
	list-style-position: outside;
	margin-left: 1.5em;
}

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

/* _secondaryContent (contains #col1, #col2, #col3, .bot)
------------------------------------------------------------------------------*/
#secondaryContent
{
	width: 750px;
	margin: 20px auto 0;
	background-image: url(rt_top.gif);
	background-repeat: no-repeat;
	background-position: left top;
	background-color: #e9e3dc;
	padding-top: 26px;
}

#secondaryContent div.bot
{
	background-image: url(rt_bot.gif);
	background-repeat: no-repeat;
	background-position: left bottom;
	height: 11px;
	clear: both;
}

#secondaryContent p { font-size: .9em; line-height: 1.2; }
#secondaryContent h2 { font-size: 1em; }
#secondaryContent h2 a { text-decoration: none; }
#safeguard #secondaryContent { display:none; }

#col1, #col2, #col3
{
	/* widths are based on 3-columns of equal width */
	width: 27%;
	float: left;
	margin-left: 4%;
	display: inline;
}

#col1
{
	/*
	 * 27 Ocober 2006
	 * First column is hidden
	 * because client has no specials
	 */
	display: none;
}

#home #col1
{
	display: block;
}

#secondaryContent.single #col2
{
	/* displays only col2 */
	width: 520px;
	margin-left: 191px;
}
#secondaryContent.single #col3 { display: none; }

#secondaryContent.double #col2, #secondaryContent.double #col3
{
	/* displays col2 and col3 */
	width: 44%;
}

#col2 ul, #col3 ul
{
	margin-top: 16px;
	list-style-type: disc;
	padding-left: 1.5em;
}

#col2 li ul, #col3 li ul
{
	margin-top: 0px;
	margin-bottom: 10px;
	list-style-type: none;
	padding-left: 1em;
}


#col2 li, #col3 li
{
	margin: 6px 0;
}




/*
-----------------------------------------
Styles for forms
-----------------------------------------
*/

form
{
	width: 330px;
	padding: 0;
	margin: 0;
}

fieldset
{
	margin: 0 0 1em;
	padding: 1em;
	background-color: #e9e3dc;
	border-top: 1px #eee solid;
	border-right: 1px #ccc solid;
	border-bottom: 1px #ccc solid;
	border-left: 1px #eee solid;
}
fieldset.submit
{
	background: none;
	border: none;
	margin: 0;
	padding: 0 0 0 1em;
}

fieldset.submit button
{
	margin-right: 1em;
	padding: 2px 4px;
}


#womenbusiness form ol, 
#women form ol, 
#womenbusiness form ol, 
#womenbusiness form ol
{ list-style-type: none; padding: 0; margin:0;  }


label
{
	display: block;
}

fieldset input, fieldset select
{
	width: 100%;
}

fieldset select
{
	font-size: .85em;
}

fieldset input.checkbox
{
	width: auto;
}

fieldset label.checkbox
{
	float: none;
	display: inline;
}

#womenbusiness .contactperson
{
	float: right;
	margin: 0 2em 0 0;
	width: 140px;
	padding:0;
	display: inline;
}

#womenbusiness .contactperson img, #events_page .contactperson img
{
	display: block;
	background-color: #eee;
	border: 4px solid #e9e3dc;
	padding: 1px;
}

#womenbusiness .contactperson strong,
#womenbusiness .contactperson em
{ display: block; }

/* _footer
------------------------------------------------------------------------------*/

#footer
{
	clear: both;
	background-image: url(footer.gif);
	background-repeat: no-repeat;
	background-position: center top;
	padding-top: 122px;
}

#footer div
{
	width: 780px;
	margin: 0 auto;
	position: relative;
	font-size: .8em;
}

#footer div li
{
	display: inline;
}

#footer div li a
{
	border-right: 1px solid #fff;
	padding: 2px 8px 2px 8px;
	color: #000;
	text-decoration: none;
}

#footer a:hover { text-decoration: underline; }

#footer, 
#footer div ul,
#footer div li a
{
	color: #fff;
}

#footer div li a.luxury
{
	border-right: none;
}


#footer div p
{
	position: absolute;
	top: 0;
	right: 0;
	background-image: url(ehl.gif);
	background-repeat: no-repeat;
	background-position: right bottom;
	padding: 8px 0 23px 0;
	margin-top: -8px;

	padding-bottom: 1.6em;
}

#footer li a.home
{
	padding-left: 0;
}
#home #footer li a.home
{
	display: none;
}

#policy #footer a.policy, #policy #footer a.policy:hover
{
	font-weight: bold;
	cursor: text;
}


img#ehl { display: none; }