/* For help understanding this stuff see:
    http://www.w3.org/TR/2004/CR-CSS21-20040225/cover.html#minitoc

#f30    reddish (bird)
#f60    orange  (bedspread)
#f93    light orange (bird beak)

#630    brown   (wood streaks)
#c60    light brown (wood)
#cc0    yellowish   (egg yolk)

#036    dark blue   (streaks on wall)
#369    light blue  (picture frame)

#666    gray    (wall)
#ccc    light gray  (shaded white)

#996    Yellowish olive green.
#50573f Classic n8gray NEdit green.

*/

/* Generic styles */
body { 
    font-family: Verdana,Geneva,Arial,Sans-serif; 
    color: white; 
    background-color: black;
    background-image: url(images/stripes.gif);
    background-repeat: repeat;
}
a { 
    color: inherit 
}
code, pre {
    font-size: 120%;
    color: #036;
}
pre {
    overflow-x: auto;
    padding:0.5em;
    border:1px dashed #f30;
    background-color: #eee;
}

.outerTable {
    margin: 30px
}

/* Header styles */
.pagetitle        { 
    font-size: 150%; 
    font-weight: bold; 
    color: #f93;
    text-shadow: rgba(0, 255, 255, 0.7) 0px 0px 10px;
}
.pagesubtitle     { 
    font-size: small; 
    /* color: #996; */
    color: #ccc; 
}
.dateheader       { 
    font-size: 120%; 
    font-weight: bold; 
    /* color: #630; */
    color: #f93;
    text-shadow: rgba(0, 0, 0, 0.4) 3px 3px 3px; /* h, v, blurriness */
}

.flowerbox {
    text-align: left;
    background-color: #996;
    width: 882px;
    margin: 0;
    border: 0;
    padding: 3px;
    padding-bottom: 0px;
}
.flowerbox > div {
    background-image: url(images/flowercrop-scale.jpg);
    height: 120px;
    padding-top: 80px;
    padding-left: 20px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius-bottomright: 0px;
    -webkit-border-bottom-right-radius: 0px;
    /* -moz-border-radius-topright: 9px;
    -moz-border-radius-topleft: 9px;
    -webkit-border-top-right-radius: 9px;
    -webkit-border-top-left-radius: 9px; */
}

/* Style for gradient row at top */
.gradrow img {
    display: block;
}

/* Content bar styles */
.contentTable {
    background-color: #996;
    text-align: left;
    margin: 20px;
}

/* The left-hand (navigation) column */
.leftbar          {
    width: 170px;
    border-width: 0;
    margin: 0;
    font-size: 80%; 
    color: black;
    padding: 18px;
    float: left;
}
.leftbar a:link:hover, .leftbar a:visited:hover  { 
    color: #ff0; 
}
.leftbar h2 {
    font-size: 100%;
    font-weight: bold;
    /* color: #f93; */
    color: #630;
    text-shadow: rgba(255, 96, 0, 0.7) 0px 0px 10px;
}
.leftbar p {
    margin-left: 1em;
}

/* The right-hand (main content) column */
.rightbar {
    width: 627px;
    margin: 0;
    background: #50573f;
    padding: 24px;
    padding-top: 15px;
    margin-right: 3px;
    margin-bottom: 3px;
    /* border: 3px solid #996;
    border-left-width: 0;
    border-top-width: 0; */
    float: right;
  -moz-border-radius-bottomright: 9px;
  -moz-border-radius-bottomleft: 9px;
  -webkit-border-bottom-right-radius: 9px;
  -webkit-border-bottom-left-radius: 9px;
}
.rightbar a:link:hover, .rightbar a:visited:hover { 
    color: #f30;
}
.rightbar > * {
    margin-top: 15px;
    clear: both;
}
.postsNav {
    margin-top: 8px;
}

/* Story/comment boxes */
.storybox, .commentbox,
.storybox_nofooter, .commentbox_nofooter {
  /* max-width: 6.5in; */
  border: 1px solid #f60;
  background: #fff;
  -moz-border-radius: 11px;
  -webkit-border-radius: 11px;
  -webkit-box-shadow: 0px 0px 8px #f60;
}
.commentbox, .commentbox_nofooter { 
  border-color: #ff0; 
  -webkit-box-shadow: 0px 0px 8px #0ff;
}

.storybody, .storyfooter, .storytitle,
.commentbody, .commentfooter, .commenttitle {
  padding: 16px;
  padding-top: 4px;
  padding-bottom: 4px;
  border: 2px solid #666;
}

.storytitle, .commenttitle {
  color: white;
  background: #f93;
  font-weight: bold;
  text-shadow: rgba(0, 0, 0, 0.4) 3px 3px 3px; /* h, v, blurriness */
  -moz-border-radius-topright: 9px;
  -moz-border-radius-topleft: 9px;
  -webkit-border-top-right-radius: 9px;
  -webkit-border-top-left-radius: 9px;
}
.commenttitle {
  font-size: 90%;
  font-weight: normal;
  background: #50573f;
}
.storytitle a { text-decoration: none; }

.storybody, .commentbody {
  /* padding-top: 0;
  padding-bottom: 0; */
  line-height: 130%;
  text-align: justify;
}
.storybody a img
{
   border: 1px solid #f60;
   max-width: 90%;
}
.noborder {
    border: none !important;
}
.imgborder {
    border: 1px solid black !important;
}
.clearboth {
    clear: both !important;
}
.clearright {
    clear: right !important;
}
.clearleft {
    clear: left !important;
}
.clearnone {
    clear: none !important;
}

.commentbody > p:first-letter,
.storybody > p:first-letter
{
   font-size: 110%;
   color: #f30;
}

.storybody, .storyfooter,
.commentbody, .commentfooter {
  font-size: 90%;
  color: #333;
  border-top: 0px;
  overflow-x: auto;
}

.storyfooter, .commentfooter {
  text-align: right;
  font-size: small;
  font-style: italic;
}
.storyfooter, 
.commentfooter,
.storybox_nofooter .storybody,
.commentbox_nofooter .storybody {
  -moz-border-radius-bottomright: 9px;
  -moz-border-radius-bottomleft: 9px;
  -webkit-border-bottom-right-radius: 9px;
  -webkit-border-bottom-left-radius: 9px;
}

/* comment styles */
.indextitle, .commenttitle {
    background: #50573f
}
.comment_msg {
    border-style: solid;
    border-color: #f60;
    border-width: 1px;
    width: 75%;
    padding: 0px;
    margin-bottom: 1em;
    clear: left;
    background: red;
    color: white;
    font-size: large;
    text-align: center;
}

/* Styles for the Category tree: */
.leftbar ul,
.headlines,
.categorytree  {
    list-style-type: none;
    /* Prevent over-indentation of the list items */
    margin-left: 1em;
    padding-left: 0;
}

.categorytree_item {}
li .current-cat > a {
    color: #ff0;
}

/* Headlines classes include:
    headlines, headlines_date, headlines_item */

.headlines_item {
    margin-bottom: 0.75em;
}

.postsNav {
    font-size: 80%;
    color: #f93;
    text-align: center;
}

#searchform input {
    width: 120px;
}

/* Making a horizontal list */
/* Adapted from http://www.designdetector.com/tips/horizontal-list-demo.html */
.trMenu .commentbox {
    padding: 2px;
    background-color: #666;
}
.trMenu ul
{
    font-size: 90%;
    text-align: center;
    padding: 2px;
    padding-left: 4px;
    padding-right: 4px;
    margin-top: 0;
    /* cancels gap caused by top padding in Opera 7.54 */
    margin: 0;
    background-color: #50573f;
    line-height: 36px;
    -moz-border-radius: 8px;
    -webkit-border-radius: 8px;
}

.trMenu ul li
{
    display: inline;
    padding-left: 0;
    padding-right: 0;
    padding-bottom: 5px;
    /* matches link padding except for left and right */
    padding-top: 5px;
}

.trMenu ul li a
{
    padding-left: 10px;
    padding-right: 10px;
    padding-bottom: 5px;
    padding-top: 5px;
    text-decoration: none;
    border: 1px solid #333;
    white-space: pre;
    background-color: #996;
    color: #333;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
}

.trMenu A:link:hover,
.trMenu A:visited:hover,
.trMenu A:link:active,
.trMenu .current_page_item A:link,
.trMenu .current_page_item A:visited {
    background:#f93;
    color:#fff;
    border-color: #f60;
}

/* ************************************************************************* */
/* This is the magic CSS rollover code!                                      */
/* ************************************************************************* */

#buttonList {
    /* This style makes a list look nothing like a list.  :-) */
    list-style-type: none;
    border: 0;
    padding: 0;
    margin: 0;
}

#buttonList > li {  /* The > selects immediate children */
    /* Pad between the buttons */
    padding-bottom: 2px;
}

#buttonList a {
    /* Make the entire button clickable by turning links into blocks */
    display: block;
    height: 36px;
    width: 150px;
    line-height: 36px;
    /* This causes the text to be vertically centered */
    font-family: Helvetica,Arial,Sans-serif,Verdana;
    font-size: 15px;
    font-weight: bold;
    text-align: center;
    text-decoration: none;
    /* Disable underline */
    background-image: url(images/blankBoth.gif);
    /* background-image: url(images/slickbuttons.png); */
    background-repeat: no-repeat;
}

#buttonList .current_page_item > a,
#buttonList .current_page_ancestor > a,
#buttonList a:hover,
#buttonList a#here {
    /* Highlight on hover, or by default for current page's button */
    color: yellow;
    background-position: top left;
}

#buttonList .current_page_item > a:active,
#buttonList .current_page_ancestor > a:active,
#buttonList a,
#buttonList a:active,
#buttonList a#here:active {
    /* Unhighlight unselected buttons, and while clicking */
    color: #220;
    background-position: bottom left;
}

/* Gallery 2 stuff */
.g2image_normal
{
	margin: 4px;
}

.g2image_float_left
{
	float: left;
	clear: left;
	margin: 4px;
}

.g2image_float_right
{
	float: right;
	clear: right;
	margin: 4px;
}

.g2image_centered
{
	display: block;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
}

/* ************************************************************************* */
/* This is for the home page                                                 */
/* ************************************************************************* */

/* This is a trick for getting something to center vertically.
   see: http://www.wpdfd.com/editorial/thebox/deadcentre4.html */
#horizon {
    /* A 1px-high, full-width box halfway down the screen */
    position: absolute;
    top: 50%;
    left: 0px;
    width: 100%;
    height: 1px;
    overflow: visible;  /* This is critical! */
    display: block;
}

#topdiv {
    /* The "absolute" positioning of the nested table is relative to #horizon */
    position: absolute;
    bottom: -175px;          /* Half the height */
    left: 50%;              /* Put the left edge in the center, except... */
    margin-left: -150px;    /* Move the left edge back so image is centered */
    
    background-image: url("images/redlizard_duncan_parks-tail.png");
    background-repeat: no-repeat;
    background-position: bottom left;
    
    padding-bottom: 70px;   /* Ensure the bottom of the tail is visible */
}

#lizardpanel {
    background: #50573f;
    /* background: #996; */
    /* background: white; */
    border: solid #996;
    border-left-width: 3px;
    border-bottom-width: 3px;
    border-right-width: 0;
    border-top-width: 0;
    width: 121px;
    overflow: visible;
}

#notail {
    position: absolute;
    bottom: 0px;
    z-index: 9999;
}

.navtitle_l,
.navtitle_r {
    color: #f93;
    background: #50573f;
    font-weight: bold;
    font-family: Arial,Helvetica,Sans-Serif;
    text-shadow: rgba(0, 0, 0, 0.4) 3px 3px 3px; /* h, v, blurriness */
    padding: 2px;
    padding-left: 4px;
    padding-right: 4px;
    text-align: center;
    border: 3px solid #996;
    border-bottom-width: 0;
}
.navtitle_r {
    border-left-width: 0;
}
.navtitle_l {
    border-right-width: 0;
}
    

.navcell {
    padding: 4px;
    background: #996;
    color: white;
    text-align: center;
}

/* Style the button list differently on the front page */
.navcell #buttonList a {
    background-image: url(images/blankBoth.gif);
}

/* Styles for wordpress floats */
.wp-caption, .gallery-caption {
    text-align: center;
    font-size: small;
    margin: 8px;
}
p.wp-caption-text, .gallery-caption {
    margin: 0 4px;
    color: #f60;
}
.alignright {
    margin: 8px;
    float: right;
    clear: right;
    margin-right: 0px;
}
.alignleft {
    margin: 8px;
    float: left;
    clear: left;
    margin-left: 0px;
}
.aligncenter,
div.aligncenter {
    margin: 8px;
    display: block;
    margin-left: auto !important;
    margin-right: auto !important;
    clear: both;
}

#gallery-1 img {
    border: 1px solid #f60 !important;
}
