/* NOTES:

There are three fixed layout widths:

1.  #wrapper (700px, contains the site content)
2.  #contentleft h2, #contentleft h3 (298px = half #wrapper, less 10, 18, 24 - these are #contentwrapper padding-right, #contentright margin-left; and p margin-left)
3.  #contentleft ul.centered, #contentright ul.centered (298px to match headings)

Images are gathered together and given unique classes each.

/////////////////////////////////////////////////////////  */

body {	
	background: #330;
	font-family: verdana, arial, sans-serif;
	font-family: Trebuchet MS, Geneva, Arial, Helvetica, SunSans-Regular, sans-serif;
	font-size: 63.5%;
	line-height: 140%;
	color: #000;
	padding: 0;
	margin: 0;
}

#wrapper {
	width: 875px; /* 700px;*/
	margin: auto;
	border-right: 3px #111 solid;
	border-left: 3px #111 solid;
}

#headernav {
	width: 100%;
	height: 160px;
	background: #fff; 
}

#contentwrapper {
	width: 700px;
	padding: 0 0 10px 0;
	margin: 0;
	border-top: 1px #fff solid;
	background: #fff;
	font-size: 1.4em;
	line-height: 130%; 
}

#contentright {
	float: right;
	width: 50%;
	padding: 0;
	margin: 0 0 2em 1.5em;
}

#contentright.nomargin {
	margin-bottom: 0;
}

#contentleft {
	padding: 0;
	margin: 0;
}

#footernav {
	text-align: center;
	width: 100%;
	height: 0; /*60px */
	background: #fff;
	padding-bottom: 0; /* 10px;*/
	margin: 0; 
}

#footernav p {
	width: 50%;
	margin: 15px auto 0 auto;
	padding-top: 5px;
	color: #fff;
}

#footernav p a {
	color: #ff8;
	padding-bottom: 5px;
}

h2, h3 {
	background: #908;
	border: 2px #908 solid;
	border-left: 6px #908 solid;
	color: #fff;
	font-family: verdana, arial, sans-serif;
	font-size: 14px;
	font-weight: normal;
	margin: 10px 15px 10px 20px;
}

h3 {
	background: #b6a;
	border: 2px #b6b solid;
	border-left: 6px #b6b solid;
	font-style: italic;
}

h4 {
	margin-top: 0;
	font-size: 14px;
}

#contentleft h2, #contentleft h3 {
	width: 298px;
}

#contentleft li, #contentright li {
	padding-bottom: .5em;
}

#contentright li {
	margin-right: 20px;
}

#contentleft ul.centered, #contentright ul.centered {
	width: 298px;
	list-style-type: none; 
	text-align: center;
	margin: 10px 15px 10px 20px;
	padding: 0;
}

#contentleft ul.centered li, #contentright ul.centered li {
	margin: 0;
}

#contentleft ul.plain, #contentright ul.plain {
	width: 298px;
	list-style-type: none;
	text-align: left;
	margin: 10px 15px 10px 20px;
	padding: 0;
}

p {
	margin: 15px 24px;
}

p.bios {
	margin-right: 50px;
}

.spacer {
	height: 5px;
}
blockquote {
	margin: 15px 0 15px 24px;
	padding: 0;
}

a, a:link, a:visited {
	color: #908;
	text-decoration: underline;
}
a:hover, a:active {
	color: #f0f;
}

table.partnerlogos {
	margin: 10px 20px 10px 24px;
}

table.partnerlogos td {
	padding: 1em 1em 1em 0;
}

#aahc {
	font-weight: bold;
	color: #26a;
	font-variant:small-caps;
}

/* ///////// IMAGES //////////// */
#imgwrapper {
	width: 90%;
	background: #433; /*#706;*/
	margin: 10px 15px 20px 20px;
	padding: 18px 0 5px 0;
	text-align: center;
	color: #fff;
}

#imgwrapper.clear {
	background: transparent;
}

#imgwrapper p {
	background: #211; /*#504;*/
	font-size: 1.2em;
	font-style: italic;
	margin: .5em 24px;
	padding: .2em;
}

#imgwrapper a {
	color: #fff;
}

.imgwrappersub {
	width: 315px;
	background: #433; 
	text-align: center;
	padding: 25px 0;
	float: left;
	margin: 10px 15px 10px 20px; 
}

/*\*/	
* html .imgwrappersub {
	margin: 10px 10px 10px 12px;
	}
/**/

.imgwrappersubwide {
	width: 665px;
	background: #433; 
	text-align: center;
	padding: 25px 0;
	float: left;
	margin: 10px 15px 10px 20px; 
}

/*\*/	
* html .imgwrappersubwide {
	margin: 10px 10px 10px 12px;
	width: 655px;
	}
/**/
#videowrapper {
	width: 90%;
	margin: 10px 15px 20px 20px;
	padding: 18px 0 5px 0;
	text-align: center;
	border-top: 23px #211 solid;
	border-bottom: 23px #211 solid;
}

#sswrapper {
	width: 180px;
	background: rgb(246,222,244);
	border: 1px #908 solid;
	padding: 46px 36px;
	margin: auto;
}

img.ss {
	width: 108px;
	height: 90px;
	border: 1px #000 solid;
}

img.kht {	/* Kathryn Hall-Trujillo, bp-bpusa.php */
	border: 1px #ccc solid;
	width: 250px; /*166px;*/
/*	height: 212px;*/
	margin: 0;
	padding: 0;
}

img.bplogo {
	width: 200px;
	height: 200px;
	float: left;
	margin-left: 15px;
}

img.p-logo {
	border: 0px #f00 solid;
	width: 200px;
	height: 10px;
	margin: 1.5em 0;
}

img.donations {
	width: 193px;
	height: 253px;
	border: 1px #000 solid;
}

img.glover {
	width: 200px;
	height: 270px;
	border: 1px #ccc solid;
	margin: 0; padding: 0;
}

img.harbormarker {
	width: 206px;
	height: 170px;
	border: 1px #ccc solid;
	margin: 0; padding: 0;
}
	
/* //////// END OF IMAGES //////// */

#bpnav, #programnav {
	margin-top: 10px; display: none;
}

#programnav {
	padding-bottom: 15px; height: 20px; 
}

#programnav ul {
	width: 550px;
	margin: auto;
}

#bpnav ul, #programnav ul {
	list-style-type: none;
}

#bpnav li, #programnav li {
	float: left;
	margin: 5px 7px;
	font-size: .9em;
}

/* ////////////////////////  adaptation for new vertical nav /////// */

#withnav {
	width: 878px;
	margin: 0 auto;
	background: #fff url(pwnspix/bg-nav2.jpg) right repeat-y;
	border-right: 3px #111 solid;
}

#nav {
	width: 172px;
	margin: 0;
	padding: 0;
	float: right;
	font-size: 1.25em;
	line-height: 1.5em; 
}

#navspacer { height: 10px; background: #fff; margin: 0; padding: 0;}

/*\*/	
* html #navspacer { margin: -4px 0;
	}
/**/
#nav ul {
	list-style-type: none;
	margin: 0;
	padding-left: 2px;
}

#nav ul li {
	margin: 0;
	font-weight: bold;
	padding: 0 5px;
	background: #cbd;
	border-bottom: 1px #a9b solid;
	border-left: 1px #a9b solid;
}

#nav ul li ul {
	margin: 0;
	padding-left: 0;
	border-top: 1px #a9b solid;
}

#nav ul li ul li {
	margin: 0 -5px;
	font-weight: normal;
	background: #fff;
	border-bottom: 0;
	padding-left: 5px;
	border-left: 0;
}

#nav a {
	text-decoration: none;
}

#nav ul li a:hover, #nav ul li a:active {
	color: #214;
}

#nav ul li ul li a:hover, #nav ul li ul li a:active {
	color: #f0f;
}

#wrapper { /* temp overwriting standards above to fit nav */
	margin: 0;
	border-right: 0;
}