/* Web site design and CSS for hopebuilders-kc.org, created by Robena Weiss www.loveyoursolutions.com
   Copyright 2009 HopeBUILDERS Home Repair, Inc. */
/* home page Assistance, Donor, Projects icons are copyright Microsoft clipart gallery style 1543 */
/* arrow-right & contact page message icons part of Mini Icons set provided by Mark James at famfamfam.com */
/* STRUCTURAL ELEMENTS */
html, body {
  margin: 0; padding: 0; width: 100%;
  background: #fff; z-index: 0;
  color: #333;
  font-family: Arial, Helvetica, sans-serif; font-size: small;
  text-align: center; line-height: 140%; }
div#nav {
  position: absolute; top: 100px; left: 0; width: 100%; min-width: 40em;
  margin: 0; padding: 0;
  border: 2px solid #800;
  background: #900; }
div#wrapper {
  width: 90%; min-width: 40em; max-width: 90em;
  margin: 0 auto; padding: 0;
  text-align: left; }
div#header {
  margin: 0; padding: 0 0 0 10px; }
div#inner-l {
  clear: both;/* position: relative; top: -20px;*/
  margin: 0 10px 0 0; padding: 0;
  background: transparent url(../img/content-mid.gif) repeat-y 0 0; }
div#inner-r {
  margin: 0 -10px 0 10px; padding: 0 10px 0 0;
  background: transparent url(../img/content-mid.gif) repeat-y 100% 0; }
div#content {
  margin: 0 -10px 0 0; padding: 0;
  background: transparent url(../img/content-top.gif) no-repeat 100% 0; }
div#main {
  float: left; width: 58%;
  margin: 0 0 0 -10px; padding: 15px 0 10px 40px;
  background: transparent url(../img/content-top.gif) no-repeat 0 0; }
.sub-page div#main {
  width: 95%; }
div#sidebar {
  width: 30%;
  margin: 0 0 10px 65%; padding: 40px 0 10px 0;
  background: transparent; }
.sub-page div#sidebar {
  width: 0; }
div#footer {
  clear: both;
  margin: 0; padding: 0;
  border: 2px solid #800;
  background: #900;
  color: #ddd;
  font-size: 85%; }
/* TYPOGRAPHICAL ELEMENTS */
/* baseline */
h1, h2, h3, h4, h5, h6 { margin: 0; padding: 0.75em 0 0 0; background: transparent; line-height: 140%; }
h1 { font-size: 200%; color: #333; }
h2 { font-size: 150%; color: #555; }
h3 { font-size: 110%; color: #666; }
h4, h5, h6 { font-size: 100%; }
p, ul, ol, dl, dt, pre, blockquote, form, fieldset, legend { margin: 0; padding-top: 0.5em; padding-bottom: 0.25em; }
li, dd { margin-top: 0; margin-bottom: 0; padding-top: 0.25em; padding-bottom: 0; }
ul {
  padding-left: 1.25em; }
ol {
  padding-left: 2em; }
ul li {
  list-style-type: disc; }
ol li ul li {
  margin-left: 0.25em;
  list-style-type: lower-alpha; }
/*div#sidebar ul li {
  margin-left: -1.25em;
  list-style-type: none; }*/
a img, img, table, caption, th, tf, tr, td { border: 0; }
cite { 
  display: block;
  padding-top: 0.25em;
  font-weight: bolder; }
abbr {
  border-bottom: 1px dashed #eee;
  cursor: help; }
small {
  font-size: 85%; color: #999; }
hr {
  clear: both; position: relative; left: -9999px;
  margin: 0 10%; padding: 0;
  color: #fff; }
table {
  width: 100%;
  margin: 0.25em 0 0.5em 0; padding: 0;
  border-collapse: collapse; border-spacing: 0;
  font-size: inherit; }
table th, table td {
  margin: 0; padding: 0.25em;
  border: 1px solid #ccc; }
table th {
  background: #dcdcdc;
  color: #333;
  font-weight: bold; }
fieldset, legend, label, input, textarea, select, button { font-family: inherit; }
form label { cursor: pointer; }
.offset {
  position: absolute; left: -9999px; }
/* links */
a {
  background: transparent;
  text-decoration: none;
  font-weight: bold; }
a:link {
  color: #369; }
a:visited {
  color: #036; }
a:hover, a:focus, a:active {
  color: #39c; }
div#footer p a:link, div#footer p a:visited {
  color: #aaa; }
div#footer p a:hover, div#footer p a:focus, div#footer p a:active {
  color: #39c; }
/* navigation */
div#nav ul {
  margin: 0 0 0 30%; padding: 0; }
div#nav ul li {
  display: inline;
  margin: 0; padding: 0;
  list-style-type: none; }
div#nav ul li a {
  display: block; float: left;
  margin: 0; padding: 0.5em 0.5em;
  color: #fff; text-decoration: none;
  font-size: 110%; font-weight: bolder; font-variant: small-caps; }
div#nav ul li a:hover, div#nav ul li a:focus, div#nav ul lik a:active {
  color: #ccc; }
/* persistent nav */
#home a.home, #about a.about, #projects a.projects, #project a.projects, #donate a.donate, #contact a.contact {
  color: #aaa;
  cursor: default; } 
/* CALLS TO ACTION */
div#support, div#request, div#plan, div#design {
  margin: 0.75em 0 0 0; padding: 1.5% 2%;
  border: 1px solid #800;
  background: transparent url(../img/bg-grad2.gif) repeat-x 0 110%;
  text-align: center; }
div#request {
  border-color: #369; }
div#plan {
  border-color: #580; }
div#support h2, div#support h3 {
  padding: 0.5em 0;
  background: #c03;
  color: #fff; font-size: 140%; }
div#request h2, div#request h3 {
  padding: 0.5em 0;
  background: #39c;
  color: #fff; font-size: 140%; }
div#plan h2, div#plan h3 {
  padding: 0.5em 0;
  background: #8a0;
  color: #fff; font-size: 140%; }
div#support a, div#request a, div#plan a, div#sponsors a {
  padding-right: 20px;
  background: transparent url(../img/arrow-right.gif) no-repeat 100% 50%; }
div#testimonial {
  margin: 0.75em 0 0 0; padding: 0.25em;
  border: 1px solid #ddd; }
div#testimonial h2 {
  padding: 1.5% 2%;
  border: 1px solid #eb0/*da2*/;
  background: #fe9/*eb0*/;
  text-align: center; }
div#testimonial p {
  padding: 0.5em 0.75em 0.75em 0.75em;
  background: #efefef/*feb,fe9*/; }
div#sponsors {
  margin-bottom: 2em; }
div#sponsors h2 {
  padding: 1.5% 2%;
  border: 2px solid #da2;
  background: #eb0;
  color: #fff; }
div#design {
  border: none;
  background: none; }
/* PAGE-SPECIFIC STYLES */
/* header/footer */
div#header img {
  position: relative; top: 20px/*0*/; left: 0; }
div#header p {
  position: relative; top: -10px/*-20px*/; left: 0;
  margin: 0 0 0 170px;
  color: #ccc; text-align: right;
  font-style: italic; font-size: 160%; }
div#footer p {
  padding: 0.5em 20px; }
/* home */
div#homeowners, div#donors, div#jobs {
  float: left; width: 30%;
  margin: 0 2% 0 0; padding: 0 0 20px 0;
  background: transparent; }
div#homeowners {
  clear: both; margin-left: 10px; }
div#events h2, div#homeowners h2, div#donors h2, div#jobs h2 {
  padding: 1.5% 2%;
  border: 1px solid #350;
  background: #580;
  color: #fff; }
div#homeowners h2 {
  border: 1px solid #369;
  background: #39c; }
div#donors h2 {
  border: 1px solid #800;
  background: #c03; }
div#jobs h2 {
  border: 1px solid #580;
  background: #8a0; }
div#homeowners p, div#donors p, div#jobs p {
  padding-left: 2%; padding-right: 2%; }
div#homeowners p a img, div#donors p a img, div#jobs p a img {
  margin-right: 4px; }
/* guide */
#guide div#testimonial {
  position: absolute; left: -9999px; }
/* projects */
#projects table tr.group {
  background-color: #efefef;
  font-size: 110%; font-weight: bolder; }
#projects #main h3 {
  clear: left; }
#projects div#sidebar h3 {
  color: #888; }
#projects #main p img, #project #main p img {
  float: right;
  margin-left: 10px; }
#projects div#sponsors p, #project div#sponsors p {
  text-align: center; }
/* contact */
#contact dt { font-size: 110%; font-weight: bolder; }
#contact form p {
  clear: both; }
#contact form p label {
  display: block; float: left; width: 8em; }
#contact div#message {
  padding: 0 0.5em;
  border: 1px solid #ccc;
  background: #efefef;
  text-align: left; }
#contact div#message, #contact span.reqd {
  font-weight: bolder; color: #900; }
#contact div#message p {
  padding: 0.25em 0 0.25em 1.5em; }
#contact div#message p.error, #contact div#message p.warning {
  background: transparent url(../img/icon-stop.gif) no-repeat 0 50%; }
#contact div#message p.confirm {
  background: transparent url(../img/icon-accept.gif) no-repeat 0 50%;
  color: #580; }
/* OVERRIDING PRINT STYLES */
@media print {
  div#wrapper { width: 100%; }
  div#wrapper, div#header, div#inner-l, div#inner-r, div#content, div#main { margin:0; padding:0; background: none; }
  h1, h2, h3, h4, h5, h6 { page-break-after: avoid; }
  ul, ol, dl { page-break-before: avoid; }
}