/**
* reset styles
*/
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;
	outline: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
	vertical-align: baseline;
}
/* remember to define focus styles! */
:focus {
	outline: 0;
}
html {
		border-top:3px solid #222;
   	border-top:3px solid #eee;
   	border:none;
}

body {
	line-height: 1;
	color:#ddd;
	font-family:Arial, sans-serif;
	font-size:small;
	}
ol, ul {
	list-style: none;
}
/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: separate;
	border-spacing: 0;
}
caption, th, td {
	text-align: left;
	font-weight: normal;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: "";
}
blockquote, q {
	quotes: "" "";
}
/**
* style styles
*/
html {border-bottom:2px solid #fff;}
body {
  background:#666;
  border-bottom:1px solid #eee;
  padding-bottom:.3em;
  padding-bottom:0;
  }


/**
*=fonts
*/
h1, h2, h3, h4, h5, h6, p {
  padding:.9em 50px .25em 50px;
  padding:.9em 0 .25em 0;
  /* letter-spacing:.1em;*/
  }
p {padding-top:.4em; font-weight:normal;}
h1, h2, h3, h4, h5, h6 {color:#F9F9F9;}

h1 {font-size:177%;}
h2 {font-size:161%; color:#F4F4F4;}
h3 {font-size:146%; color:#EEEEEE;}
h4 {font-size:133%; color:#E8E8E8;}
h5 {font-size:121%; color:#E3E3E3;}
h6 {font-size:100%; color:#DDDDDD;}

h1+h2, h1+h3, h1+h4, h1+h5, h1+h6, h2+h3, h2+h4, h2+h5, h2+h6, h3+h4, h3+h5, h3+h6, h4+h5, h4+h6, h5+h6 { padding-top:.1em; }

#wrap {
  width:800px; margin:0 auto; position:relative;
}
/**
* branding
*/
#branding {
  position:relative;
  width:600px;
  color:#fff;
  background:transparent url(http://www.whatamericaneeds.org/images/countryside.png) no-repeat center bottom;
  }
#branding blockquote p{
  padding:1em 1em 100px 1em;
  background:#000 url(http://www.whatamericaneeds.org/images/american-faces.jpg) no-repeat bottom left;
  text-align:center;
  color:#fff; font-size:130%;
  font-weight:bold;
  }
#branding h1 {
  background:#E50000;
  padding:.4em .4em;
  font-weight:bold; font-size:300%;
  font-family:Arial, sans-serif;
  text-align:center;
  text-transform:uppercase;
  }
#branding h1 a {color:#fff; text-decoration:none;}
#branding h1 a:hover {color:#000; text-decoration:underline;}

#branding h2 {
  color:#222;
  padding:.4em 1em;
  padding-top:45px;
  font-weight:bold;
  font-weight:normal;
  padding-bottom:243px;
  font-size:310%;
  text-align:center;
  }
#branding h2 a {
  color:#222;
  text-decoration:none;
  }
#intro {
  position:absolute;
  bottom:10px;
  width:600px;
  }
#branding #intro blockquote p {background:transparent; background-image:none; margin:0; padding:0;}
#intro h3, #intro p, #branding #intro blockquote p {
  witdh:40%; margin-left:50%;
  padding:.5em 1% .4em;
  position:relative; left:-20px;
  text-align:right;
  background:transparent url(http://www.whatamericaneeds.org/images/trans_grey_bg_pixel.png);
  font-size:90%; line-height:1.4em; letter-spacing:.1em;
  }
#intro h3 { font-size:100%; font-weight:bold; text-align:right; padding-left:0; }
/**
  * content
  */
#content {
  width:600px;
  width:540px;
  background:#858585;
  padding:1em 0;
  padding:1em 30px;
  color:#000;
  border-top:13px solid #666;
  border-bottom:13px solid #666;
  }
  #content p, #content h3, #content li {
    padding:.8em 2em 1.2em;
    padding:.8em 0 1.2em;
    line-height:1.3em;
    }
  #content h3 {font-size:140%; font-weight:bold; color:#fff;}
/**
  * navigation
  */
  #navi {
    position:absolute; top:223px; top:16.2em; right:200px;
    float:left;
  }
  #navi li {
    float:left;
    padding:0 1.1em;
    }
  #navi a, #nav_second a {text-decoration:none;
    font-weight:bold;
    color:#fff;
  }
  #navi a:hover, #nav_second a:hover {
    text-decoration:underline;
    color:#e50000;
    font-size:90%
    font-weight:bold;
  }
  #nav_second {
    position:relative; padding-bottom:100px; float:left;
  }
  #nav_second li {
    padding:1.1em;
    float:left;
    }
  #nav_second #excerpts, #nav_second #presskit, #nav_second #teacher {
    width:30%; background:#e50000;
  }
  #nav_second #excerpts a:hover, #nav_second #presskit a:hover, #nav_second #teacher a:hover {
    width:30%;
    background:#e50000; color:#222;
    font-weight:bold;
  }
/**
  * distinctive pages
  */
/** from-sea-to-shining-sea
  *
  */
  #seatosea { position:absolute; top:300px; right:5px;}
  #seatosea h4 {padding-left:5px; padding-right:0; font-weight:bold; font-size:100%; margin-bottom:1.6em;}
  #seatosea li {line-height:1.7em;}
  #seatosea li a { padding-left:5px; color:#fff; text-decoration:none; display:block;}
  #seatosea li a:hover { background:#000;}
/**
  * film-stills
  */
#americaneeds-filmstills #content, #americaneeds-filmstills #content ul, #americaneeds-filmstills #content li {float:left;}
/**
  * footer
  */
  #footer { clear:both;}
  #footer #siteinfo {
    margin:0 auto;
    width:800px;
    padding-top:2em;
    padding-bottom:1.4em;
    clear:both;
  }
  #footer p {
    margin-left:0;
    font-variant:small-caps; font-weight:bold;
  }
  #footer #copyright {float:left;}
  #footer #webdesign {
    float:right;
    position:relative; top:2.6em;
    padding-right:130px; padding-top:.4em;
    font-size:100%; background:#e50000;
  }
  #footer #webdesign a {
    padding-right:22px; padding-left:.5em;
    text-decoration:none; color:#111; line-height: 1.4em;
    background:transparent url(http://www.optikjunk.de/pix/favicon.png) no-repeat right 50%;
  }
  #footer #member a:hover, #footer #webdesign a:hover { color:#fff; text-decoration:underline;}
  #webdesign em {text-indent:-3333px; display:block;}
  #member {clear:both; font-size:90%;}
  #member a {
    padding-left:.3em; color:#111; position:relative; top:.1em;
    color:#000; letter-spacing:.1em; font-size:95%; font-weight:bold;
    text-decoration:none;
  }