@import url(skel.css);

/*
Butterfly and hummingbird images:
Copyright 2000 Eric A. Meyer
*/

.hpg #sitemast {padding-bottom: 1em; background-position: 100% -1.6em;}
.hpg #sitemast h1 {font-size: 2em; background-position: 100% -0.8em;}
.hpg #main h2 {margin: 0.5em 5% 0 0; padding: 3px 10px 0 90px;
  border-bottom: 1px solid; clear: left;
  font-weight: bold; font-size: 150%; line-height: 1.4em; text-align: center;}
.hpg #panel {top: 3.75em;}

html, body {width: 100% !important; font-size: 1em;}
body {margin: 0; padding: 0; font: 1em "Times New Roman", Times, TimesNR, serif; position: relative;}

#sitemast {margin: 0; padding: 0 0 0.75em 0; border-bottom: 1px solid;
  border-left: 1.5em solid;}
#sitemast h1 {margin: 0; padding: 0.75em 0.5em 0 0; font-size: 1.5em;
 font-family: Verdana, sans-serif; line-height: 0.8em; letter-spacing: -0.13em;}

#main {padding: 0.6em 0 5em 85px; margin-right: 20%;}
#main h2, #main h3, #main h4, #main h5, #main h6 {line-height: 0.8em; margin: 1em 0 0; 
 border-bottom: 1px solid;}
#main p, #main ul, #main ol, #main dl {margin-right: 6%;}
#main p {margin-right: 6%;}

p.desc {margin: 0.5em 0 1em 95px;}
a.pic {float: left; margin: -21px 0 0.5em; width: 80px;}
a.hlinks {text-decoration: none; border-bottom: 0.25em solid;}

#panel {position: absolute; right: 0%; top: 2.6em; width: 17%;
  padding: 0; margin: 0;
  font-family: Arial, sans-serif;}
#panel h4 {margin: 0; padding: 0.25em 0.5em 1px 0.25em;
  font-size: 0.9em; font-style: italic; line-height: 0.7em;
  letter-spacing: 1px; text-transform: lowercase;
  border-style: solid solid dotted; border-width: 1px 0 1px 2px;}
#panel ul {margin: 0 0 1.5em 0; padding: 0.25em 0 0.5em 0;
  border-left: 1px solid; list-style: none; font-size: 85%;}
#panel ul li {padding: 0.15em 0 0.1em 0.5em;}
#panel ul ul {padding: 0 0 0 1em; margin: 0; border-left: none; font-size: 90%; font-style: italic;}
#panel ul ul li {padding-top: 1px; text-indent: -0.5em;}
#panel #natural {font-weight: bold; font-style: italic; letter-spacing: 1px; text-transform: lowercase;
  border: 1px dotted; border-right: none; margin-left: -1px;}

#thoughts {padding: 2em 1% 2em 4%; width: 95%;}
#thoughts h3, #thoughts h4, #thoughts h5 {margin: 0; line-height: 1em;}
#thoughts h3 {font-size: 120%; letter-spacing: 0.25em; text-align: center;
  margin: 0 0 1.25em 0; border-bottom: 3px double;}
#thoughts h3 span {border-bottom: 0.25em solid;}

#thoughts h4 {font-size: 110%; padding: 0.25em 25px 0 0; margin: 1.66em 40% 0 0;
  border-bottom: 1px solid; text-align: right;
  position: relative;}
#thoughts h5 {font-size: 80%; padding: 0.125em 0 0.25em 20px; margin: -1px 0 0.5em 40%;
  border-top: 1px solid; border-bottom: none; text-align: left;}
#thoughts h4 a {padding: 0 0.25em; margin: 0 -0.5em 0 0;
  text-decoration: none; font-size: 85%; text-align: center;
  display: block; position: absolute; top: 1.5em; right: -65%; width: 1em;
  border: 1px dotted; border-top-style: solid;}
#thoughts p {margin: 0.66em 0 1em 0.125em;}
div.quoteattrib {margin-bottom: 1em; font-size: 90%;}

#footer {border-top: 3px double; margin: 0; padding: 0.75em 1em 1em;
  text-align: left; font-size: 75%;}
#footer p {margin: 0; padding: 0;}


/* home styles */

body.home #main {padding-left: 120px;}
body.home #main img.pic {position: absolute; left: -1em; top: 6.25em; z-index: 100;}


/* colors and backgrounds */

body {background: rgb(80%,88%,74%) url(natural/hummingbird.jpg) left bottom no-repeat fixed;
  color: rgb(24%,26%,22%);}

#sitemast, #panel ul, #panel #natural, #footer {border-color: rgb(45%,65%,45%);}
#main h2, #main h2 a, #thoughts h3, #thoughts h3 span {border-color: rgb(25%,40%,25%);}
#thoughts * {border-color: rgb(35%,50%,35%);}

#sitemast {background: rgb(73%,82%,73%) url(natural/masthead-wash.jpg) 100% -1.4em no-repeat;}
#sitemast h1 {background: rgb(45%,65%,45%) url(natural/masthead.jpg) 100% -1em no-repeat;}
#sitemast h1 a {color: rgb(20%,40%,20%);}

#main h2 a {color: rgb(0%,30%,0%);}

#panel {background: rgb(80%,88%,74%);}
#panel h4 {border-color: rgb(40%,60%,40%); color: rgb(20%,40%,20%);
   background: rgb(75%,85%,70%) url(natural/nav-bg.gif) 100% 0.7em no-repeat;}
#panel ul {background: url(natural/nav-bg.gif) 100% -0.5em no-repeat;}
#panel ul ul {background: none;}

#navlinks a:link {color: rgb(30%,50%,30%);}
#navlinks a:visited, #presolinks a {color: rgb(50%,60%,50%);}
#panel a:hover {color: rgb(50%,30%,20%);}
#panel #natural {background: rgb(83%,90%,78%);}
#panel #natural a {color: rgb(30%,40%,30%);}

#thoughts h3 {color: rgb(10%,30%,10%);}
#thoughts h4 {color: rgb(15%,30%,15%);}
#thoughts h5 {color: rgb(35%,50%,35%);}
#thoughts a.plink {color: rgb(50%,66%,50%); border-color: rgb(35%,50%,35%);}
#thoughts h4 {background: url(natural/h4-bg.gif) 100% 0% no-repeat;}
#thoughts h5 {background: url(natural/h5-bg.gif) 0% 100% no-repeat;}
#thoughts blockquote {color: rgb(30%,35%,30%);}
#thoughts .quoteattrib {color: rgb(33%,42%,33%);}

#footer {color: rgb(20%,40%,20%); background: rgb(73%,82%,73%);}

a:link {color: rgb(0%,50%,40%); background: transparent;}
a:visited {color: rgb(30%,50%,30%); background: transparent;}


/* fix IE6 rendering bugs */

#sitemast h1 {position: relative;}
#sitemast>h1 {position: static;}