/*  
Theme Name: underneath
Theme URI: 
Description: 
Version: 
Author: jon packman
Author URI: 
*/

/* Global reset */
/* Based upon 'reset.css' in the Yahoo! User Interface Library: http://developer.yahoo.com/yui */
*, html, body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, label, fieldset, input, p, blockquote, th, td { margin:0; padding:0 }
table { border-collapse:collapse; border-spacing:0 }
fieldset, img { border:0 }
address, caption, cite, code, dfn, em, strong, th, var { font-style:normal; font-weight:normal }
ol, ul, li { list-style:none }
caption, th { text-align:left }
h1, h2, h3, h4, h5, h6 { font-size:100% }
q:before, q:after { content:''}
a { text-decoration:none }

html {font:  100% Georgia, "Trebuchet MS", Geneva, serif;}
body { background: #020200 url("images/main_bg.jpg") fixed no-repeat center 0px; font:  62.5% Georgia, "Trebuchet MS", Geneva, serif; width: 100%; min-height: 100%}
/* Global reset-RESET */
/* The below restores some sensible defaults */
strong { font-weight:bold }
em { font-style:italic }
* a { position:relative; outline:none  } /* Gets links displaying over a PNG background */
a img { border:none } /* Gets rid of IE's blue borders */
div {position: relative}


/* TYPOGRAPHY -----------------------------------------------------------------------------------------------------*/
p { padding: 0 0 1em 0; color: #a88b5e; font: 1.2em Georgia, "Trebuchet MS", Geneva, serif; }
a {color: #685f30; z-index: 999}
a:hover {color: #beb389;}
h1, h2 	{font: bold 18px Georgia, "Trebuchet MS", Geneva, serif; color: #6f562c;}
h3 	{font: bold 16px Georgia, "Trebuchet MS", Geneva, serif; color: #6f562c; }
h4, h5, h6 	{font: bold 14px  Georgia, "Trebuchet MS", Geneva, serif;  color: #6f562c}



/* BASIC LAYOUT -----------------------------------------------------------------------------------------------------*/
#wrapper {width: 1050px; min-width: 1000px; margin: 0 auto; background: url("images/header_bg2.jpg") no-repeat center top; }
#header{height: 249px; width: 800px; margin: 0 auto; }
#container {width: 1000px;  margin: 0 auto; background: url("images/content_grad.png") repeat-x 0 0; min-height: 70px; padding: 0 25px}
#main_content { width: 480px; float: left; margin: 0px 0px 0 250px; padding: 0 10px; background: url("images/floral_top.png") no-repeat top center; }
#sidebar_right { float: right; width: 210px; text-align: center; margin: 65px 20px 0 0}
#sidebar_left {position: absolute; left: 40px; top: 64px; text-align: center; width: 210px }
#footer { width: 100%; clear: both; top: 30px; }
#footer_flowers_left { width: 100%; position: fixed; bottom: 0; background: url("images/flowers_left.png") no-repeat 1% bottom; height: 318px; z-index: -1}
#footer_flowers_right { width: 100%; position: fixed; bottom: 0; background: url("images/flowers_right.png") no-repeat 99% bottom; height: 318px;z-index: -1 }
#footer_grad { width: 100%; position: fixed; bottom: 0; background: url("images/footer_grad.png") repeat-x bottom;  height: 100px;}


/* NAVIGATION  -----------------------------------------------------------------------------------------------------*/
ul#navigation { height: 30px; width: 580px; position: relative; top: 215px; margin:0 auto; background: url("images/nav.png") no-repeat 0 0; }
ul#navigation li { position: absolute; }
ul#navigation li a {position: absolute; display: block; z-index: 1;  text-indent: 20px; top: 6px; font-size: 5px; color: #43381f} 
ul#navigation li a:hover {color: #43381f;} 
ul#navigation li a span {background: url("images/nav.png") no-repeat 0 0; height: 30px; display: block; z-index: 999; position: absolute; top: -6px} 

ul#navigation li.home a{ width: 72px; left: 0 }
ul#navigation li.news a{ width: 78px; left: 72px  }
ul#navigation li.music a{ width: 89px; left: 150px   }
ul#navigation li.gigs a { width: 60px; left: 239px   }
ul#navigation li.gallery  a{ width: 101px; left: 299px   }
ul#navigation li.links a{ width: 72px; left: 400px   }
ul#navigation li.contact a{ width: 108px; left: 472px   }

ul#navigation li.home a span { background-position: 0 0; width: 72px;  }
ul#navigation li.news a span{ background-position: -72px 0; width: 78px  }
ul#navigation li.music a span{ background-position: -150px 0; width: 89px  }
ul#navigation li.gigs a span { background-position: -239px 0; width: 60px  }
ul#navigation li.gallery a span { background-position: -299px 0; width: 101px  }
ul#navigation li.links a span{ background-position: -400px 0; width: 72px  }
ul#navigation li.contact a span{ background-position: -472px 0; width: 108px  }

ul#navigation li.home a span:hover  { background-position: 0 -30px;  }
ul#navigation li.news a span:hover  { background-position: -72px -30px;  }
ul#navigation li.music a span:hover  { background-position: -150px -30px; }
ul#navigation li.gigs a span:hover  { background-position: -239px -30px;  }
ul#navigation li.gallery a span:hover  { background-position: -299px -30px;  }
ul#navigation li.links a span:hover  { background-position: -400px -30px;  }
ul#navigation li.contact a span:hover  { background-position: -472px -30px;}

body#home ul#navigation li.home a span  { background-position: 0 -60px;}
body#news ul#navigation li.news a span  { background-position: -72px -60px; }
body#music ul#navigation li.music a span { background-position: -150px -60px;}
body#gigs ul#navigation li.gigs a span { background-position: -239px -60px;  }
body#gallery ul#navigation li.gallery a span, body#gig-photos ul#navigation li.gallery a span, body#random-pix ul#navigation li.gallery a span, body#nathan ul#navigation li.gallery a span { background-position: -299px -60px; }
body#links ul#navigation li.links a span { background-position: -400px -60px; }
body#contact  ul#navigation li.contact a span { background-position: -472px -60px; }


/* HEADER  -----------------------------------------------------------------------------------------------------*/
#header h1 { text-indent: -9999px; position: absolute } 
#header a img.logo {width: 350px; margin: 110px 0 0 224px; height: 52px; position: absolute; opacity: 0.9}


/* MAIN CONTENT & POSTS  -----------------------------------------------------------------------------------------------------*/
.post {padding-bottom: 40px;  background: url("images/post_bottom2.png") no-repeat bottom;}
body#music .post:first-child, body#home .post:first-child {margin: 0 0 10px 0}
.navigation {width: 100%; text-align: center; margin: 0 0 30px 0}
body#news .navigation { margin: 20px 0 30px 0}
.navigation a {background: url("images/link_bg.png") repeat; border: 1px solid #685f30; color: #4d4621; padding: 2px 4px; margin: 0 5px 0 0; font-size: 11px}
.navigation a:hover{ border: 1px solid #beb389; color: #beb389; }

h1.title, h2.title {  height: auto; width: 420px; padding: 20px 30px 20px 30px; display: block; background: url("images/main_text_mid2.png") repeat; }
h2.page_title { padding: 45px 30px 0px 30px; text-indent: -9999px; height: 18px}
body#gig-photos h2.page_title, body#nathan h2.page_title, body#random-pix h2.page_title { height: auto; width: 420px; padding: 63px 30px 15px 30px; display: block; background: url("images/main_text_mid2.png") repeat;  text-indent: 0px;}
div.firstpost h2.title, div.singlepost h2.title {  padding: 0px 30px 20px 30px; }
.post h3, .post h4, .post h5, .post h6 {  height: auto; width: 420px; padding: 0 30px 10px 30px; display: block; background: url("images/main_text_mid2.png") repeat; font: bold 1.4em georgia; color: #6f562c; }
body#gallery .post h3 { font: bold 18px georgia; }
body#gallery .post h3.videos { padding-bottom: 25px }
h2.error404 {text-align: center; padding: 70px 30px 30px 30px; color: #fff}

.post p {  padding: 0 30px 1em 30px; background: url("images/main_text_mid2.png") repeat; line-height: 1.5}
.post p:last-child {  padding: 0 30px 0px 30px; }
.post p.strap { font-size: 20px; line-height: normal; }
p.post_meta {font-size: 1.1em; text-align: right; margin: 0 0 20px 0 }
body#news p.post_meta {font-size: 1.1em; text-align: right; margin: 0 0 0px 0 }
p.post_meta a{ background: url("images/link_bg.png") repeat; border: 1px solid #685f30; color: #685f30; padding: 2px 4px; width: auto; margin-left: 4px}
p.post_meta a:hover{border: 1px solid #beb389; color: #beb389; }
p.time_stamp {padding: 10px 10px 0px 10px; margin: -9px 0 0 30px; background: url("images/main_text_mid2.png") repeat; width: 6.5em}
div.firstpost p.time_stamp {padding: 0px 30px 19px 30px; margin: 0; display: block; width: 420px}
div.singlepost p.time_stamp {padding: 63px 30px 19px 30px; margin: 0; display: block; width: 420px}
div.singlepost p.no_time_stamp {padding: 46px 10px 0px 10px; margin: 0; background: url("images/main_text_mid2.png") repeat; display:block; text-indent: -9999px}
span.editthis a { color: #b7e3ff; font-size: 1.1em; padding: 0px 5px 2px 5px; }

#main_content .post ul {height: auto; width: 420px; padding: 0 30px 20px 30px; display: block; background: url("images/main_text_mid2.png") repeat; }
#main_content .post ul li {padding: 0 0 0.6em 0; color: #6f562c; font: 1.4em Georgia, "Trebuchet MS", Geneva, serif; width: 100%;}
#main_content .post ul li a{color: #685f30; text-decoration: none}
#main_content .post ul:last-child { padding: 0 30px 0px 30px; }
#main_content .post ul#nathans_tunes li a{margin: 0 0 0 0px; color: #685f30; text-decoration: none}
#main_content .post ul li a:hover, #main_content .post ul#nathans_tunes li a:hover {color: #beb389;}

#main_content .post ul#albums {float: left; position: relative; padding: 0 18px 20px 30px; width: 432px; margin: 10px 0 0 0; background: none }
#main_content .post ul#albums li {padding: 0; margin: 0; width: 106px; float: left; }
#main_content .post ul#albums li a{width: 106px; float: left; margin: 0 0 15px 0; height: 100px; padding: 0; opacity: 0.7;  background: none }
#main_content .post ul#albums li a:hover {opacity: 1; }
#main_content .post ul#albums li a img {width: 95px; height: 100px; margin: 0; padding: 0}

.post a img, #sidebar_left a img {opacity: 0.7; border: 1px solid #685f30;}
.post a:hover img, #sidebar_left a:hover img {opacity: 1; border: 1px solid #beb389;}

#player  {width: 440px; margin: 0px 0 0 0; padding: 40px 20px 20px 20px; background: url("images/main_text_mid2.png") repeat; z-index: 998}
body#music #player  {padding: 0px 20px 20px 20px;}
#nathan_sat {position: absolute; top: -13px; left: 220px; overflow: visible; z-index: 999 !important; height: 125px; width: 84px; background: url("images/nathan_sat.png") no-repeat center 0px;}


/* COMMENTS  -----------------------------------------------------------------------------------------------------*/
ol.commentlist li {padding: 1.5em 30px; background: url("images/main_text_mid2.png") repeat; margin: 0 0 20px 0; }
ol.commentlist li ul {} 
ol.commentlist li ul li{ } 
ol.commentlist li p {}
ol.commentlist li p.who_said {color: #694014; font-size: 1.4em; }
ol.commentlist li p.who_said cite {font-weight: bold}
ol.commentlist li p.awaiting {color: #4c340a; font-size: 1.6em; font-weight: bold }

form#commentform{ padding: 2em 30px 6em 30px; background: url("images/main_text_mid2.png") repeat; position: relative; z-index: 999  }

form#commentform label {font-size: 1.1em; color: #6f562c; text-align: left; float: left; clear: left; }
form#commentform input#author, form#commentform input#email, form#commentform input#url, form#commentform input#submit{background: none; border: 1px solid #4c340a; color: #4c340a; padding: 1px 2px 2px 2px; font-size: 1.2em; float: left; clear: left; margin: 3px 0 12px 0; width: 200px;}
textarea#comment {width: 400px; background: none; border: 1px solid #4c340a; color: #4c340a; margin: 3px 0 10px 0; padding: 10px; font: 1.3em "lucida grande", "lucida sans unicode", "Trebuchet MS"}
form#commentform input#author:focus, form#commentform input#email:focus, form#commentform input#url:focus, textarea#comment:focus{  border: 1px solid #664915; color: #a88b5e }
form#commentform input#submit {margin: 10px 0 40px 0; color: #4d4621; padding: 3px; font-size: 1.2em; border: 1px solid #4c340a; background: none; text-transform: uppercase; width: auto; }
form#commentform input#submit:hover {cursor: pointer; color: #a88b5e; border: 1px solid #664915;   }


/* CONTACT FORM  -----------------------------------------------------------------------------------------------------*/
form.contact-form { padding: 0 30px 1em 30px; background: url("images/main_text_mid2.png") repeat; position: relative; z-index: 999 }
form.contact-form legend{text-indent: -9999px}
form.contact-form label {font-size: 1.2em; color: #6f562c; text-align: left; float: left; clear: left; }
form.contact-form input#ec_name, form.contact-form input#ec_email, form.contact-form input.button, form.contact-form input#ec_challenge_a {background: none; border: 1px solid #4c340a; color: #4c340a; padding: 1px 2px 2px 2px; font-size: 1.2em; float: left; clear: left; margin: 3px 0 8px 0; width: 200px;}
form.contact-form textarea#ec_message {width: 400px; background: none; border: 1px solid #4c340a; color: #4c340a; margin: 3px 0 10px 0; padding: 10px; font: 1.3em "lucida grande", "lucida sans unicode", "Trebuchet MS"}
form.contact-form input#ec_name:focus, form.contact-form input#ec_email:focus, form.contact-form textarea#ec_message:focus, form.contact-form input#ec_email:focus, form.contact-form input#ec_challenge_a:focus { border: 1px solid #664915; color: #a88b5e }
form.contact-form input.button {margin: 20px 0; color: #4d4621; padding: 3px; font-size: 1.2em; border: 1px solid #4c340a; background: none; text-transform: uppercase; width: auto}
form.contact-form input.button:hover {cursor: pointer; color: #a88b5e; border: 1px solid #664915; }
form.contact-form input#ec_challenge_a {width: 9.4em}
form.contact-form label span {font-size: 0.8em; margin-left: 20px}
p.error {color: #a5300c; font-weight: bold; font-size: 1.4em}
p.important  {color: #a5300c; font-weight: bold; font-size: 1.4em}


/* SIDEBARS  -----------------------------------------------------------------------------------------------------*/
#sidebar_left  h4 {font: bold 1.3em georgia; color: #6f562c; margin: 0 0 5px 0}
#sidebar_left  h5 {font: 1.3em georgia; color: #6f562c; padding: 0 0 1em 0}
#sidebar_left  p {line-height: 1.5}
#sidebar_left  p a.more-link {padding: 2px 4px; font-size: 1em; background: url("images/link_bg.png") repeat; border: 1px solid #685f30; color: #685f30;}
#sidebar_left  p a.more-link:hover { border: 1px solid #beb389; color: #beb389; }
body#gigs #sidebar_left  li.ngg_images h2 {margin: 0px auto 7px auto; background: url("images/gig_photos.png") no-repeat; width: 123px; height: 33px; text-indent: -9999px }
body#gigs #sidebar_left  li.ngg_images {margin: 20px auto; width: 150px}

a.soclink img {border: none !important}

#sidebar_right a#rss_button {display: block; margin: 20px auto 30px auto; width: 2.2em; height: 2.2em; padding: 0.5em 0.3em 1.3em 0.3em; background: url("images/link_bg.png") repeat; border: 1px solid #685f30; font-size: 12px}
#sidebar_right a#rss_button:hover {border: 1px solid #beb389; }
li#subscribe2 h2 {background: url("images/sign_up.png") no-repeat 55px 0; text-indent: -9999px; height: 37px; width: 153px; margin: -4px 0 7px 0}
li#subscribe2 p { padding: 0; color: #6f562c}
li#subscribe2 form input{ width: auto; }
li#subscribe2 form input:first-child{ width: 180px; height: 1.5em; color: #4c340a; padding: 0.1em 0.3em 0 0.3em; margin: 0px 0 0px 10px; background: none; border: 1px solid #4c340a; display: block}
li#subscribe2 form input:first-child:focus {border: 1px solid #664915; color: #a88b5e}
li#subscribe2 form input#sub_send {color: #685f30; padding: 3px; margin: 18px auto 0 auto; font-size: 12px; text-transform: uppercase;  border: 1px solid #4c340a; background: none; display: block;}
li#subscribe2 form input#sub_send:hover  { cursor: pointer; color: #a88b5e; border: 1px solid #664915; }
li#subscribe2 form input#sub_yes { opacity: 0.4; }
li#subscribe2 form input#sub_no { margin: 0 0 0 10px; opacity: 0.4}

ul#recent_comm li a {padding: 4px; font-size: 1em; background: url("images/link_bg.png") repeat; border: 1px solid #685f30; color: #685f30; display: block; width: 180px; margin: 0 auto 15px auto; text-align: left; font-size: 1.1em}
ul#recent_comm li a:hover { border: 1px solid #beb389; color: #beb389; }

/* HEADING IMAGE REPLACEMENT */
#sidebar_left  h3#next_gigs, #main_content h3#respond, #main_content h2#latest, #main_content h3#lyrics, #sidebar_right h2#recent-comments {text-indent: -9999px; position: absolute; color: #694014}
#main_content h3#comments, #main_content h3#respond, #main_content h2#latest {margin: 0 30px 20px 30px; color: #694014}
img.h_replace {position: relative; top: 0; left: 0; margin: 0 0 20px 0}
#sidebar_left img.h_replace {margin: 0 0 10px 0}
#main_content img.h_replace {left: 30px;}
#main_content .post img.h_replace {left: 0; margin: 0}
body#home #main_content img.h_replace {left: 30px; margin: 0 0 30px 0}
#main_content h3#comments img {padding: 0px 0px 0px 6px; left: 0; position: relative; top: 3px; margin: 0}

/* FOOTER */
#footer ul { padding: 0 0 5em 0; text-align: center;  }
#footer ul li {display: inline; color: #a88b5e; margin-right: 4px }