/* RANCH template stylesheet

 graphic design: Robert Asumendi (www.asumendi.com/indeed)
 initial css coding: Sean
 additional coding and cleanup: Andrew Tay (www.andrewtay.com) June 2009
 
*/

/* RESET CODE */

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td { 
 margin:0;
 padding:0;
}
table {
 border-collapse:collapse;
 border-spacing:0;
}
fieldset, img {
 border:0;
}
address,caption,cite,code,dfn,th,var {
 font-style:normal;
 font-weight:normal;
}
ol,ul {
 list-style:none;
}
caption,th {
 text-align:left;
}
h1,h2,h3,h4,h5,h6 {
 font-size:100%;
 font-weight:normal;
}
q:before,q:after {
 content:'';
}
abbr,acronym { border:0;
}


/* GENERAL LAYOUT */

body  {
 font: 14px "Trebuchet MS", Arial, Helvetica, sans-serif;
 color: #ECA670;
 background: #bc8765 url(/shared/ranch/background-standard.jpg) top center no-repeat;
 text-align: center;
 }

#accessibility {
 position: absolute;
 left: -9999px;
 }

#container {
 position: relative;   /* serves as a reference for placing #banner */
 left: -8px;      /* crude fix to align with background image */ 
 width: 931px;     /* expanded from 921px so that drop-shadows wouldn't be cut off */
 margin: 0 auto;
 padding-top: 196px;   /* pushes #content and #navigation down, since #banner is position: absolute */
 background: url(/shared/ranch/container-standard.jpg) top right repeat-y;
 text-align: left;
 }

#banner {
 position: absolute;    /* this avoids IE6/IE7 float model problems */
 top: 0;
 left: 0;
 height: 196px;
 width: 100%;
 background: url(/shared/ranch/header-standardwide.jpg) top center no-repeat;
 }
 /* this is the band photo */
 .photo {
  position: absolute;
  top: 9px;
  left: 612px;
  width: 229px;
  height: 173px;
background: url(/images/rwt2.gif) no-repeat;
  }
 .band {
  margin-left: 20px;
  }
  .photo span, .band span {
   position: absolute;
   display: block; 
   width: 800px;
   font-size: 36px;
   font-weight: normal;
   text-transform: uppercase;
   }
  /* subtle, but cool shadow effect */
  .photo span {
   top: 56px;
   left: -581px;
   color: #121631;
   }
  /*            */
  .band span {
   top: 64px;
   left: 30px;
   color: #FFC;
   }

#navigation {
 float: left;
 width: 205px;
 background: url(/shared/ranch/sidebar-standardwide.png) left top repeat-y;  /* middle sidebar bg */
 display: inline;
 }
 /* Ultra-Safe Hack for IE6: replaces drop-shadowed transparent PNG with no-shadowed transparent gif */
 * html #navigation {
  _background: url(/shared/ranch/sidebar-standardwide.gif) left top repeat-y;  /* middle sidebar bg */
  }
 
 #navigation ul {
  padding: 30px 11px 58px 15px;
  min-height: 400px;
  background: url(/shared/ranch/navigation-standard.jpg) left top no-repeat;   /* top sidebar bg */
  }
  /* Ultra-Safe Hack for IE6: applies min-height */
  * html #navigation ul {
   _height: 400px;  /* IE6 treats this as min-height */
   }
  #navigation li {
   font-size: 14px;
   font-weight: bold;
   }
   #navigation li a {
    display: block;
    line-height: 20px;
    padding: 5px 10px;
    }
    /* Ultra-Safe Hack for IE6: gives hasLayout, preventing a spacing bug */
    * html #navigation li a {
     _height: 1px;    /* this gives IE6 hasLayout without affecting layout */
     }
    
#emailsignup {
 clear: both;
 float: left;
 width: 160px;
 height: 45px;
 padding: 0 19px 45px 27px;
 color: #FFC;
 display: inline;
 background: url(/shared/ranch/emailsignup-standard-crush.png) -1px bottom no-repeat; /* bottom sidebar bg */
 }
 /* Ultra-Safe Hack for IE6: uses IE-proprietary filter to place drop-shadowed transparent PNG */
 * html #emailsignup {
  _background: none;
  _filter: progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/shared/ranch/emailsignup-standard-crush.png');
  }
  
 #emailsignup form {
  }
  #emailsignup input {
   margin: 2px 0;
   margin-right: 4px;
   }

#content {
 margin-left: 205px;
 min-height: 850px;
 padding: 0 50px;
 background: url(/shared/ranch/content-standard.jpg) top right no-repeat;
 } 
 /* Ultra-Safe Hacks for IE6: applies min-height and fixes IE6 3px float offset bug */
 * html #content {
  _height: 850px;   /* IE6 treats this as min-height */
  _position: relative;
  _left: -3px;    /* moves #content 3px to the left, where it should be */
  _margin-right: -3px;  /* restores lost 3px of #content width */
  }

#footer {
 clear: both;
 height: 200px;
 padding: 10px 60px 25px 60px;
 font-size: .8em;
 background: #bc8765 url(/shared/ranch/footer-standard.jpg) top right no-repeat;
 }
 #footer p {
  text-align: right;
  }

/* GENERAL TEXT STYLING */

h1, h2, h3, h4, h5 {
 font-weight: normal;
}

h1 {
 color: #FFC;
 font-size: 30px;
 line-height: 36px;
 padding: 4px 0;
 margin-bottom: 0.25em;
}

#content h2 {
 color: #FF6A22;
 font-size: 20px;
 line-height: 2em;
}

#content h3 {
 color: #DA5B1D;
 font-size: 18px;
 line-height: 2em;
}

#content p {
 line-height: 1.5em;
 margin: .75em 0;
}

#content ul {
 list-style: square;
 margin: 5px 0 5px 15px;
 line-height: 1.5em;
}

dt {
 font-size: 110%;
 font-weight: bold;
 line-height: 2.5em;
}

dd {
 font-size: 80%;
}


/* LINK STYLING */

/* general links */
a    {text-decoration: none;}
 a:link   {color: #ffc;} 
 a:visited {color: #ccb;}
 a:hover   {color: #ffc; text-decoration: underline;} 
 a:active  {color: white;} 

/* navigation links */ 
#navigation li a  {text-decoration: none;}
 #navigation li a:link   {color: #ECA670;}
 #navigation li a:visited {color: #ECA670;}
 #navigation li a:hover   {color: white; background: url(/shared/ranch/trans25.png);}
 #navigation li a:active  {color: #361503;} 

 /* Ultra-Safe Hack for IE6: replaces alpha-transparent PNG with solid color */
 * html #navigation li a:hover {
  _background: #976348;
  }  

 /* highlight current page */
 #navigation li a.highlight {
  color: #ffc;
  }

  
/* PAGE-SPECIFIC */

.entry {
 width: 100%;   /* this gives IE hasLayout, curing a border rendering bug */
 padding: 10px 0;
 border-top: 1px solid #D1D1A8;
}

.name {
 font-weight: bold;
 line-height: 2em;
}

.act {
}

address {
 font-style: italic;
 line-height: 2em;
 padding-left: 20px;
}

address a {
}

.news_title {
 font-weight: bold;
 line-height: 2em;
}

.date {
 font-weight: normal;
 color: #ECA670;
 font-size: 14px;
 line-height: 1em;
}

.notes {
 padding-left: 20px;
 font-style: italic;
}

.artist,
.caption {
 font-size: 14px;
 line-height: 2em;
 padding-left: 20px;
}

/* contact */

body.contact #content ul {
 list-style: none;
 margin: 0;
}

/* calendar */

body.calendar .entry p {
 font-size: 90%;
 margin: 0 0 0 10px;
}

#calendar h2 {
 line-height: 1.5em;
}

#calendar h3 {
 line-height: 1.5em;
 padding-left: 20px;
}

#calendar p {
 padding-left: 20px;
}

#calendar .details {
 padding: 10px 0 0 20px;
 font-style: italic;
}

table#calendar p {
 padding-left: 0;
 font-style: italic;
}

table#calendar {
 margin-top: 20px;
}

table#calendar td span.date {
 color: #ECA670;
 float: left;
 font-size: 14px;
 line-height: 4em;
 padding: 0 120px 0 0;
}

/* links */

body.links dt {
 font-weight: normal;
 line-height: 1.6em;
}

body.links dl dd {
/* border-bottom: 1px solid #D1D1A8;   this looks confusing */
 margin-bottom: 5px;
 padding-bottom: 5px;
 margin-left: 20px;
}

.links h2 {
 margin-top: .5em;
 }

/* press */
 
.press h2 {
 margin-bottom: -.25em;
 }

/* products */
 
.products .details {
 border-top: 1px solid #BEA795;
 }

.products h3 {
 margin-top: .5em;
 } 
 
/* music */

body.music .details ul {
 list-style: none !important;
 padding-left: 5px;
}

.artist { 
 font-style: italic;
}

/* guestbook */

#postForm {
 position: relative;     /* serves as a reference for captcha image */
 width: 444px;
 padding: 0 13px 10px 13px;
 border: 1px solid #D1D1A8;
 margin-bottom: 20px;
 background: #ebdac0;
 }
 #postForm label {
  display: block;
  width: 430px;
  margin: 10px auto 5px auto;
  font-weight: bold;
  }
 #postForm input {      /* default inputs, incl. submit button */
  display: block;
  margin-left: 6px;
  width: 230px;
  padding: 2px 4px;
  }
  #postForm input#gbaddress,
  #postForm input#gbname,
  #postForm input#security_code {
   width: 420px;
   margin: 0 auto;
   }
 #postForm textarea {
  display: block;
  width: 420px;
  height: 100px;
  padding: 4px;
  margin: 0 auto;      /* margin-bottom: 0; forces browser constistency */
  overflow-y: auto;      /* auto-hides scrollbar in ie */
  }
 /* captcha image */ 
 #postForm #gbimage {
  position: absolute;
  left: 20px; 
  margin-top: 16px;       /* replaces lost margin-bottom from #gbcomment */
  }
 /* captcha "security code" text label */ 
 #postForm .security_code_label {
  width: auto;        /* overrides previously set width */
  margin-top: 10px;       /* replaces lost margin-bottom from #gbcomment */
  margin-left: 122px;
  }
 /* captcha entry field */ 
 #postForm input#security_code {
  width: 100px !important;
  margin-left: 122px;
  margin-bottom: 10px;
  }
  
#guestbook .entry {
 padding: 4px 10px 10px 10px;
 margin: 10px 0;
 width: 90%;
}

#content #guestbook h2,
#content #guestbook h3 {
 line-height: 24px;
}

#guestbook h2 {
 font-size: 18px;
}

#guestbook h3,
#guestbook blockquote { 
 font-size: 14px;
 font-weight: normal;
 padding-left: 20px;
}

#guestbook blockquote {
 line-height: 1.6em;
}