/* RESET TYPOGRAPHY GENERAL TABLES GRID CLEAR */

/* =RESET
    Reset default browser CSS.
    Based on work by Eric Meyer:
    http://meyerweb.com/eric/thoughts/2007/05/01/reset-reloaded/
*/
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, code,
del, dfn, em, img, q, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; font-weight: inherit; font-style: inherit; font-size: 100%; font-family: inherit; vertical-align: baseline; }

/* =TYPOGRAPHY */

/* Sets up text to use an 18px baseline - hence why margins are present here */
body            { font-size: 75%; line-height: 1.5; font-family: Helvetica, Arial, sans-serif; }
h2              { font-size: 2em; font-weight: bold; margin-bottom: 0.75em; }
h2 a            { text-decoration: none ;}
h3              { font-size: 1.2em; line-height: 1.25em; font-weight: bold; }
h4              { font-size: .8em; line-height: 1.875em; margin-bottom: 1.875em; text-transform: uppercase; font-weight: bold; letter-spacing: .2em;}
h4 a            { text-decoration: none;}
p, ul, form, table  { margin-bottom: 1.5em; }
/* This shouldn't have a top margin - need to remove the hack */
.large          { font-size: 1.2em; line-height: 1.25em; font-weight: bold; margin-top: 1em; margin-bottom: 1.25em; }
.small          { font-size: .8em; line-height: 1.875em; margin-bottom: 1.875em; }
/* Blog stuff */
div.blog h2     { text-transform: none; margin-bottom: 0;}
div.blog h3     { margin-bottom: 1.2em;}
.comment dl     { font-size: .8em; line-height: 1.875em; }
.comment .name  { font-weight: bold;}
.comment .name a{ text-decoration: none;}
.comment-form label  { font-weight: bold;}

/* =GENERAL */

body            { background: #eee url(./../images/body2.gif); }
div#container   { width: 843px; margin: 18px auto; }
div#paper       { background: #fff; padding: 0 5px 6px; border: 1px solid #ccc; }
div#masthead    { background: #204318 url(./../images/div_masthead.gif); }
ul#nav          { background: #3e7f2f; height: 25px; margin: 0 !important ; padding: 0 !important; }
ul#nav li       { display: block; float: left; height: 25px; }
ul#footer-nav   {  padding: 0 !important; clear:both; }
ul#footer-nav li{ display: block; float: left; margin-right: 1em; }
ul#footer-nav,
ul#footer-nav li a { color: #fff;}
div#splash      { background: #000; height: 253px; }
div#splash ul { margin: 0; padding: 0; list-style: none;}
div#header      { height: 61px;}
div#breadcrumb  { background: transparent url(./../images/div_breadcrumb.gif) repeat-y top right; height: 61px; text-align: right; }
div#breadcrumb p { padding: 1.7em; }
div#breadcrumb p, div#breadcrumb a { color: #999;}
#footer         { background: #204318; padding: 5px 0; }
p               { color: #333; }
p, h2, h3, h4, ul, table   { margin-left: 10px; margin-right: 10px; }
h2, h2 a        { color: #333300; }
a               { color: #66c; }
ul              { list-style-type: disc; padding-left: 1.5em;}
h3, h3 a, .large      { color: #3e7f2f; }
img { vertical-align: middle;}
.note { background: #ffc !important; margin-bottom: 1.5em !important; }

/* =TABLES */
table   { margin-bottom: 1.4em; }
th      { border-bottom: 2px solid #ccc; font-weight: bold; }
td      { border-bottom: 1px solid #ddd; }
th,td   { padding: 4px 10px 4px; }
tfoot   { font-style: italic; }
caption { background: #ffc; }


/* Blog stuff */
.comment { clear:left; float:left; padding: 1.5em 0 1.5em 125px; position:relative; width: 340px; }
.comment p { margin: 0; }
.comment dl { color: #777; float: left; text-align: right; margin: 0 20px 0 -125px !important; width: 105px; }
.comment-odd { background: #f3f3f3; }
/* Because comment list items are floating, the usual UL margin is lost. */
.comment-last { margin-bottom: 1.5em; }
.comment-form { padding-left: 125px;}
.comment-form fieldset { clear:left; display:inline; float:left; position: relative; margin-bottom: .75em; }
.comment-form label { display: inline; float: left; width: 105px; margin-left: -125px; text-align: right; line-height: 2em; }
.comment-form label.help-text.input { left:325px; display:block; position: absolute; text-align: left; width: 200px; color: #777; }
.comment-form input.text { background-color:#F4F4F4; width: 180px; }
.comment-form textarea { background-color:#F4F4F4; width: 340px; }
.error { color: #f00; font-weight: bold; }

label { font-weight: bold;}
input.text { background: #efe; margin:0.5em 0.5em 0.5em 0; padding: 5px; }
input.text:focus { border:1px solid #999; background: #fff; }

form#subscription { }
form#subscription input.text { width: 180px; border: 1px solid #ccc; }

table.vertical-middle td { vertical-align: middle;}

.quiet { color: #aaa;}

.video-thumbs img {
    float: left;
    background: #eee;
    margin: 0 10px 1.5em;
    border: 1px solid #000;
}
.video-thumbs img { clear: both; }

/* =GRID */

/* Grid is set up to use 22 columns, with 5px spacing */
.column         { float: left; margin-right: 5px; margin-top: 5px; }
.span-1  { width: 33px;}
.span-2  { width: 71px;}
.span-3  { width: 109px;}
.span-4  { width: 147px;}
.span-5  { width: 185px;}
.span-6  { width: 223px;}
.span-7  { width: 261px;}
.span-8  { width: 299px;}
.span-9  { width: 337px;}
.span-10 { width: 375px;}
.span-11 { width: 413px;}
.span-12 { width: 451px;}
.span-13 { width: 489px;}
.span-14 { width: 527px;}
.span-15 { width: 565px;}
.span-16 { width: 603px;}
.span-17 { width: 641px;}
.span-18 { width: 679px;}
.span-19 { width: 717px;}
.span-20 { width: 755px;}
.span-21 { width: 793px;}
.span-22 { width: 831px; margin-right: 0; }
.last           { margin-right: 0; }
.pad-top        { margin-top: 1.5em;}

.box { padding: 1.5em;  margin-bottom: 5px;  background: #eee; }
.faux-box { margin-bottom: 5px;}

/* =CLEAR */

.clear          { display: inline-block; }   
.clear:after    { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
* html .clear   { height: 1%; }
.clear          { display: block; }