/*   
	Theme Name: Both Hands
	Theme URI: http://bothhandsfoundation.org
	Description: Custom theme for Both Hands Foundation based on the design by Bill Kersey
	Author: Adam Darnell
	Author URI: http://darnellia.wordpress.com
*/


body {
	background: url('/img/bkgrd.gif') repeat;
	margin: 0 0;
	padding: 15px 0 0 0;
	height: 100%;
	color: #00467e;
	font: 14px trebuchet ms, arial, sans;
}

h2 {margin-top: 0;}
p {margin: 1em 0;}

a {color: #E4701E;}
a:hover {color: #B0BD22;}
a:visited {color: #E4701E;}

img {border: 0;}

ol li {margin: 6px 0;}

.error {color: #dd0000;}
.left {float:left;}
.right {float:right;}
.clear {clear:both;}
.centered {margin: 0 auto; text-align: center;}
/* .submit {float:right; display: inline; margin-right: 52px;} */
.submit {margin-top: 5px;}
.quote {margin: 5px 0 10px 0;}
/* .unreq-fields {display: none;} */
.hidden {display: none;}

.smalltext {font-size: 10px;}

#homeButtons {width: 800px; margin: 0 auto;}
#homeButtons a {float: left; display: inline-block; margin-right: 34px;}

#loadingGIF {
	position: absolute;
	left: 480px;
	top: 200px;
}

#container {
	background: #fff;
	width: 900px;
	margin: 0 auto;
}

#creds {
	width: 800px;
	margin: 3px auto;
	color: #C79863;
	font: 10px arial, sans;
	text-align: center;
}

#creds a:link {color: #C79863;}
#creds a:active {color: #ffffff;}
#creds a:hover {color: #ffffff;}
#creds a:visited {color: #C79863;}

#banner {
	width: 900px;
	height: 108px;
}

#bottom {
	width: 900px;
	height: 22px;
}

#content {
	padding: 10px 16px 1px 16px;
	height: 100%;
	position: relative;
}

#content-container {
	width: 900px;
	background: url('/img/sideborder.gif') repeat-y;
	overflow: hidden;
}

/* --- MAIN NAV BAR --- */
#nav-container {
	background: #00467e;
	width: 900px;
	height: 51px;
}

#nav-container a {margin: 0 0; border: 0; padding: 0 0;}

#nav-home, #nav-stories, #nav-about, #nav-partners, #nav-apply,
#nav-videos, #nav-blog, #nav-board, #nav-board, #nav-store, #nav-donate, #nav-contact  {
	display: inline-block;
	height: 51px;
	background: url(/img/NavBar1.gif) no-repeat;
}
/*
OLD Nav Bar
#nav-home {width: 88px;}
#nav-stories {background-position: -87px 0; width: 93px;}
#nav-about {background-position: -179px 0; width: 83px;}
#nav-partners {background-position: -261px 0; width: 113px;}
#nav-apply {background-position: -373px 0; width: 80px;}
#nav-videos {background-position: -452px 0; width: 88px;}
#nav-blog {background-position: -539px 0; width: 68px;}
#nav-board {background-position: -606px 0; width: 84px;}
#nav-donate {background-position: -689px 0; width: 94px;}
#nav-contact {background-position: -782px 0; width: 109px;}

#nav-home:hover, at-home {background-position: 0 -51px;}
#nav-stories:hover, at-stories {background-position: -87px -51px;}
#nav-about:hover, at-about {background-position: -179px -51px;}
#nav-partners:hover, at-partners {background-position: -261px -51px;}
#nav-apply:hover, at-apply {background-position: -373px -51px;}
#nav-videos:hover, at-videos {background-position: -452px -51px;}
#nav-blog:hover, at-blog {background-position: -539px -51px;}
#nav-board:hover, at-board {background-position: -606px -51px;}
#nav-donate:hover, at-donate {background-position: -689px -51px;}
#nav-contact:hover, at-contact {background-position: -782px -51px;}
*/

#nav-about {width: 91px;}
#nav-stories {background-position: -92px 0; width: 93px;}
#nav-apply {background-position: -185px 0; width: 83px;}
#nav-partners {background-position: -267px 0; width: 112px;}
#nav-board {background-position: -379px 0; width: 84px;}
#nav-videos {background-position: -463px 0; width: 87px;}
#nav-blog {background-position: -550px 0; width: 67px;}
#nav-store {background-position: -617px 0; width: 77px;}
#nav-donate {background-position: -694px 0; width: 93px;}
#nav-contact {background-position: -787px 0; width: 113px;}

#nav-about:hover, at-about {background-position: 0 -51px;}
#nav-stories:hover, at-stories {background-position: -92px -51px;}
#nav-apply:hover, at-apply {background-position: -185px -51px;}
#nav-partners:hover, at-partners {background-position: -267px -51px;}
#nav-board:hover, at-board {background-position: -379px -51px;}
#nav-videos:hover, at-videos {background-position: -463px -51px;}
#nav-blog:hover, at-blog {background-position: -550px -51px;}
#nav-store:hover, at-store {background-position: -617px -51px;}
#nav-donate:hover, at-donate {background-position: -694px -51px;}
#nav-contact:hover, at-contact {background-position: -787px -51px;}

#textarea {padding-top: 12px;}

/* normal layout */
#side-container {
	float: left;
	display: inline; /* IE6 hack */
	padding-right: 30px;
}

#text-container {
	width: 565px;
	float: left;
	display: inline; /* IE6 hack */
}

/* specific to form pages */
input {font: 12px trebuchet ms, arial, sans;}
textarea {width: 508px; font: 12px trebuchet ms, arial, sans;}

div.row {
  clear: both;
  padding-top: 1px;
}

div.row span.label {
  float: left;
  display: block;
  text-align: right;
  width: 100px;
  padding-right: 5px;
  padding-top: 4px;
}

div.row span.field2 {
  float: right;
  width: 520px;
  text-align: left;
  height: 1%; /* for IE... */
}

div.row span.radio-question {
	float: left;
	display: block;
	padding: 2px 5px 2px 0;
	width: 325px;
	height: 1%;
}

div.row span.radio {
	float: left;
	display: block;
	padding-top: 1px;
	height: 1%;
}

.hang-indent {padding-top: 10px; clear: both;}
.hang-indent input {margin-left: 105px; margin-top: 5px;}

/* side containers */

.nav-side {
	background: #fff no-repeat center center;
	margin: 0 30px 0 7px;
	padding: 43px 0 10px 12px;
	width: 254px;
	height: 110px;
	float: left;
	display: inline;
	color: #fff;
}

#apply-side {background-image: url(/img/applyside.gif);}
#about-side {background-image: url(/img/aboutside.jpg);}

.nav-side ul li a, .stories-side-content ul li a {text-decoration: none;	color: #fff; letter-spacing: 1px;}
.nav-side ul li a:hover, .stories-side-content ul li a:hover {text-decoration: underline;	color: #fff;}
.nav-side ul li a:visited, .stories-side-content ul li a:visited {color: #fff;}

.nav-side ul, .stories-side-content ul {list-style-type: none; margin: 0 0; padding: 0 0;}
.nav-side ul li, .stories-side-content ul li {padding: 1px 0;}

	/* why this is needed, I do not know */
#about-side ul li {padding-left: 3px;}

/* donate.php specific */
.donate-button {float:left; border: 0; margin-right: 10px;}
.donate-buttons a {border: 0; float: left;}
.donate-buttons {height: 43px; margin: 5px auto; width: 256px;}
.number {float: left; margin: 0 10px 2px 0;}

/* index.php specific */
a.no-underline { text-decoration: none; }

.bignav {
	width: 252px;
	height: 354px;
	margin: 11px 8px 0 8px;
	padding: 6px 6px;
	cursor: pointer;
	/*display: inline to fix the IE6 float margin bug... */
	display: inline;
	float: left;
}

.bignav-caption {
	margin: 0 auto;
	display: block;
	position: absolute;
	top: 265px;
}

#about-area {
	background: url('/img/blueback.gif');
	background-repeat: no-repeat;
	position: relative;
}

#about-area em {
	position: absolute;
	left: 6px; top: 6px;
	display: block;
	height: 258px;
	width: 252px;
	background: url('/img/aboutnavlarge.jpg') no-repeat 0 0;
	overflow: hidden;
}

#apply-area {
	background: url('/img/orangeback.gif');
	background-repeat: no-repeat;
	position: relative;
}

#apply-area em {
	position: absolute;
	left: 6px; top: 6px;
	display: block;
	height: 258px;
	width: 252px;
	background: url('/img/applynavlarge.jpg') no-repeat 0 0;
	overflow: hidden;
}

#content a:hover{visibility:visible}/* needed for ie to work*/
#content a:hover span em{background-position:0 -259px}

#stories-area {
	background: url('/img/greenback.gif');
	background-repeat: no-repeat;
	margin: 11px 22px 0 22px;
	position: relative;
}

#stories-area em {
	position: absolute;
	left: 6px; top: 6px;
	display: block;
	height: 258px;
	width: 252px;
	background: url('/img/storiesnavlarge.jpg') no-repeat 0 0;
	overflow: hidden;
}

#elevPitch {
	position: fixed;
	bottom: 0;
	left: -100px;
	width: 315px;
	overflow: hidden;
	z-index: 40;
}

/* monthly.php specific */
.sub {margin: 10px 5px; height: 1%;}

/* partners.php specific */
/*OLD
.partners-clear {clear: both; float: left; display: inline; margin: 10px 20px;}
.partners-right {float: left; display: inline; margin: 10px 20px;}*/
.partners-left {float: left; display: inline; margin: 10px 20px; width: 243px;}
.partners-right {float: left; display: inline; margin: 10px 20px; width: 242px;}
.partners-right img, .partners-left img {display: block; margin: 10px auto;}

#partners-ind {width: 272px; float: left; display: inline;}

.partners {margin-bottom: 15px;}
.partners ul {list-style-type: none;}
.partners ul li {padding: 2px 0 2px 3px; color: #939598;}

.gift-header {
	height: 45px;
	padding-left: 43px;
	position: relative;
}

.gift-header h1 {
	color: #00467e;
	font: bold 18px trebuchet ms, arial, sans;
	padding: 0;
	margin: 0;
	position: absolute;
	bottom: 15px;
}

.gift-header h2 {
	color: #00467e;
	font: italic 14px trebuchet ms, arial, sans;
	padding: 0;
	margin: 0;
	position: absolute;
	bottom: 0px;
}

.gift-header h2 span {color: #e36f1e;}

#heart {background: url(/img/Icons_heart.gif) no-repeat left bottom;}
#mind {background: url(/img/Icons_mind.gif) no-repeat left bottom;}
#hand {background: url(/img/Icons_hand.gif) no-repeat left bottom;}
#feet {background: url(/img/Icons_feet.gif) no-repeat left bottom;}

#partners-bus {width:272px; float: left; margin-left: 21px; display: inline;}
#partners-bus a img {display: block; margin: 10px auto;}

/* stories.php specific */
.banner {
	clear: left;
	padding: 10px 20px;
	width: 245px;
}

.banner p {margin:0;}
.banner a, .banner img {display: block; margin: 0 auto;}
.banner textarea {width: 245px; height: 100px;}

.stories-side {
	background: #00467F url('/img/storiesside-bot.gif') no-repeat center bottom;
	margin: 0 30px 0 9px;
	padding: 0 0;
	width: 264px;
	/* height: 163px; */
	min-height: 163px;
	float: left;
	display: inline;
}
.stories-side-content {
	background: transparent url('/img/storiesside.gif') no-repeat center top;
	min-height: 103px;
	/* height: 103px; */
	width: 252px;
	padding: 43px 0 10px 12px;
	color: #fff;
}

/* videos.php specific */
.video-container {
	width: 565px;
	margin-bottom: 30px;
	overflow:hidden;
}

.video { float: left; width: 375px; }
.caption { float: left; margin-left: 10px; width: 180px; }

/* blog */
.blog-side {
	width: 261px;
	float: left;
	display: inline;
	padding-right: 30px;
}

.post h2 a { color: #00467e; font-weight: bold; text-decoration: none;}
.post h2 a:hover { font-weight: bold; text-decoration: underline;}
.post h2 a:visited { color: #00467e; font-weight: bold; text-decoration: none;}

#sidebar {margin-top: 10px;}
#sidebar h2 {margin-bottom: 4px;}
#sidebar ul {list-style-type: none; margin: 0 0 0 7px; padding: 0 0;}
#sidebar ul li {
	padding: 0 0 3px 0;
	font-size: 12px;
}

#thumbs-area {width: 540px;}
#thumbs-area a {display: block; margin: 5px 8px; float: left; height: 92px;}
#thumbs-area img {display: block;}