/* CSS Document */

/* ----------------------------- formatting --------------------------- */
* {
  margin: 0;
}
html, body {
  margin: 0;
  padding: 0;
  height: 100%;
}
h1 {
  font: bold x-large Arial, sans-serif;
  color: #003300;
  margin-top: 0px;
}
#news h2 {
  color: #D6D6D6;
  margin-top: 10px;
}
h2 {
  font: large Arial, sans-serif;
  color: #003300;
}
h3 {
  font: large Verdana, sans-serif;
  color: #003300;
}
h4 {
  font: bold small Verdana, sans-serif;
  color: #003300;
  margin-bottom: 2px;
}
h5 {
  font: italic bold small Arial, sans-serif;
  color: #003300;
  margin-top: 2px;
}
p {
  font: 0.7em Verdana, sans-serif;
  color: #003300;
}
#center p {
  font: 0.8em Verdana, sans-serif;
}
#sponsor p, #articlesponsor p {
  color: #A5B5C6;
}
#footer p {
  margin: 4px;
  text-align: center;
}
a {
  color: #34339B;		
}
a:hover {
  color: #9C191E;	
}
hr {
  color: #006600;
  height: 1px;
}
a img {
  border: 0px none;
  display: block;			/* removes extra space underneath caused by default text-alignment */
}
div#top a {
  display: block;			/* makes the background hover effect work in Mozilla */
  width: 165px;
  background-color: #008000;
}
div#top a:hover {
  background-color: #008000;
}
.textbox {				/* Until IE understands <css> input[type="file"] { </css> It's better to define a new style then it is to re-define the input tag because radio buttons cop a beating */
  padding: 4px;
  font: small verdana, sans-serif;
  color: #000;
  background-color: #fff;
  border: 1px solid #000;
}
.button {
  padding: 2px;
  color: #FFFFFF;
  background-color: #009900;
  border: 1px solid #000000;
  font-style: normal;
  font-variant: normal;
  font-weight: bold;
  font-size: small;
  font-family: verdana, sans-serif;
}
.latestarticle {
  margin-bottom: 0px;
}
.headshot {
  display: inline;
  float: left;
  margin: 0px 0.5em 0.5em 0px;
}
p.latestarticle a {
  clear: right;
  font: bold small Verdana, sans-serif;
}
.date {
  display: block;
  text-align: right;
  color: #A5B5C6;
  font: x-small Verdana, sans-serif;
}
.author {
  display: block;
  color: #5C6F90;
  font: x-small /2 Verdana, sans-serif;
}
.blurb {
  margin: 0px 0px 1em 55px;
}
p.crumbtrail {
  margin: 10px 28% 0px;;
  font-size: x-small;
}

/* ---------------------------- layout -------------------------- */

.wrapper {
  min-height: 100%;
  height: auto !important;
  height: 100%;
  margin: 0 auto -4em;
}
.footer, .push {
  height: 4em;
  clear: both;
}
#top {
  padding: 4px;
  /*background: #008000;*/
  border-bottom: 1px solid #A5B5C6
}
#center {
  margin: 0px 25%;
  background: #fff;
  color: #000;
  padding-left: 3%;
  padding-right: 3%;
  padding-top: 1%;
  padding-bottom: 1%
}
#left {
  position: absolute;
  padding: 0px;
  top: 149px;
  width: 25%;
  background: #008000;
  color: #00AA50;
}
#otherleftstuff {
  width: 88%;
  padding: 10px 6% 40px 6%;
}
.spacer {
  display: block;
  height: 1px;
  font: 1px /1 sans-serif;
  clear: both;
}
div#topcontent {
  position: absolute;
  top: 10px;
  right: 0px;
  width: 80%;
}
#topcontent h2, #topcontent p {
  display: inline;
  margin-right: 0.5em;
}
#sponsor {
  position: absolute;
  width: 21.9%;
  height: 251px;
  margin-left: 75%;
  padding: 10px 1.5%;
  top: 375px;
  text-align: center;
}
#articlesponsor {
  position: absolute;
  width: 21.9%;
  height: 251px;
  margin-left: 75%;
  padding: 10px 1.5%;
  top: 150px;
  text-align: center;
}
#footer {
  clear: both;
  border-top: 1px solid #5C6F90;
  border-bottom: 1px solid #5C6F90;
  background-color: #008000;
  color: #000000
}
#bio {
  float: right;
  width: 30%;
  padding: 1%;
  border: 4px dotted #5C6F90;
  color: 596990;
  font-size: 0.7em;
}
#featureimg {
  height: 250px;
  background: #009900 url('photos/show_bin.JPG') no-repeat right top;
  text-align: center;
  border-top: 1px solid #A5B5C6;
  margin-left: 170px;
  margin-right: 25%;
  margin-top: 0px;
  margin-bottom: 0px  
}

/* ----------------------------- Navigation --------------------------- */

ul#mainnav {
  margin: 0px;
  padding: 0px;
  background-color: #009933;
  list-style-type:none
}
ul#mainnav li {
  display: block;
  border-top: 1px solid #A5B5C6;
}
ul#mainnav li a {
  display: block;
  margin: 0px;
  background-color: #009900;
  color: #FFFFFF;
  text-decoration: none;
  width: 88%; 
  font-style: normal;
  font-variant: normal;
  font-weight: bold;
  line-height: 1.5;
  font-size: 0.8em;
  font-family: arial, sans-serif;
  padding-left: 6%;
  padding-right: 6%;
  padding-top: 6px;
  padding-bottom: 6px
}
ul#mainnav li a:hover {
  background-color: #339966;
  color: #EEEEEE;
}
ul#mainnav ul.subnav {
  margin: 0px;
  list-style: none;
  padding: 0px;
  border: 0px solid #F7A1C6;
}
ul#mainnav ul.subnav li {
  border-top: 0 none;
  border: 0px solid green;
  padding-left: 1.5em;
}
ul#mainnav ul.subnav li a {
  padding: 1%;
  margin: 0px;
  font: bold 0.7em /1.5 verdana, sans-serif;
  color: #FFFFFF;
  background-color: transparent;
  border: 0px solid yellow;
}
ul#mainnav ul.subnav li a:hover {
  color: #EEEEEE;
  background-color: #229955;
}
div#topcontent ul {
  position: absolute;
  right: 0px;
  list-style: none;
  margin: 0px 0px 40px 0px;
}
div#topcontent ul li {
  display: inline;
  padding: 0 0.5em;
  border-left: 1px solid #34339B;	
}
div#topcontent ul li.first {
  border-left: 0px none;
}
div#topcontent ul li a {
  font: 0.7em /1 verdana, sans-serif;
}
div#topcontent form {
  position: absolute;
  right: 0px;
  top: 55px;
  margin: 0px;
}

/* -------------------------------------------------------------------- */