/*
 ===================================
 Studio (aka Pro Audio)
 ===================================
 web design and template coding for
 Hostbaby Wizard

 by Madeline Ong (http://maddon.net)

 April 2009 
 ===================================  
 
 Additional pre-release cross-browser fixes by Andrew Tay (www.andrewtay.com) July 2009
 These fixes are indented
 
*/

/*===== CSS RESET =====*/
/* Thanks to meyerweb.com for the CSS reset. */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
 margin: 0;
 padding: 0;
 border: 0;
 outline: 0;
 vertical-align: baseline;
}

:focus { outline: 0; }

body { line-height: 1; color: black; background: white; }

ol, ul { list-style: none; }

table { border-collapse: separate; border-spacing: 0; }

caption, th, td { text-align: left; font-weight: normal; }

blockquote:before, blockquote:after,
q:before, q:after { content: ""; }

blockquote, q { quotes: "" ""; }

/*===== MAIN STRUCTURE =====*/

body {
 background: #000000;
 font: 15px/1.6em Georgia, "Times New Roman", serif;
 color: #ffffff;
}

   body {
    line-height: 1.6em;  /* fix for Safari3win, which can't parse this when in combined form */
    }

#accessibility { display: none; }

#container { margin: 0 auto; width: 960px; }

#navigation {
 display: inline;
 float: left;
 width: 220px;
 margin: 0 10px;
 padding-top: 358px;
background: url(/images/Kooper_9314_resized-cropped-userphoto.jpg) no-repeat 0px 33px;
 font-variant: small-caps;
 text-transform: lowercase;
 font-size: 1.2em;
 letter-spacing: 0.05em;
}



#banner {
 width: 700px;
 margin: 0 10px 40px 250px;
 padding: 0 0 0px 0;
 font-size: 4em;
 line-height: 1em;
 color: #dec08a;
 font-style: italic;
}

#content { margin: 0 10px 0 250px; width: 700px; }
   
#footer {
 float: right;
 clear: both;
 width: 960px;
 margin: 0 10px;
 padding: 100px 0;
}

/*===== MAIN STRUCTURE FOR IE6 =====*/


* html #banner {
 _position: static;
 _top: 40px;
 _left: 40px;
 _margin: 0 10px 0 240px;
}

* html #content {
 _position: static;
 _margin: 0 10px 0 240px;
}

* html #footer {
 _float: left;
}

/*===== NAVIGATION =====*/



#navigation ul li {
 text-align: center;
 padding: 10px 0 12px 0;
 border-bottom: 1px solid #505050;
 line-height: 1.2em;
}

#navigation a { color: #dfb76e; text-decoration: none; border: none; }

   /* NEW!! This code expands the active area for each navigation link */

   #navigation li {
    padding: 0 !important;
    }
   #navigation li a {
    display: block;
    padding: 10px 0 12px 0;
    }
    * html #navigation li a {
     _height: 1px;
     }
#navigation a:hover { color: #dec08a; }

.highlight { color: #dec08a !important; }

/*===== BANNER =====*/

.photo { display: none; }

.band {
 width: 700px;
 padding: 65px 0 50px 0;
 border-bottom: 3px solid #841b1b;
}

/*===== FOOTER =====*/

#footer p {
 width: 320px;
 margin-left: 280px;
 text-align: center;
 color: #dec08a;
 text-transform: lowercase;
 font-variant: small-caps;
 font-size: 1.1em;
 letter-spacing: 0.05em;
}

/*===== HEADERS =====*/

h1 {
 margin: 18px 0;
 font-size: 2.5em;
 line-height: 1em;
 color: #dfb76e;
 font-weight: normal;
}

h2 {
 margin: 18px 0;
 font-size: 1.8em;
 line-height: 1em;
 color: #dec08a;
 font-style: italic;
 font-weight: normal;
}

h3, h3 a {
 margin: 18px 0;
 font-size: 1.1em;
 line-height: 1em;
 color: #dfb76e;
 font-weight: bold;
 text-decoration: none;
 border: none;
}

span.date {
 margin: 18px 0 18px 20px;
 color: #dec08a;
 font-size: 14px;
 text-transform: lowercase;
 font-style: normal;
 font-variant: small-caps;
 border-left: 2px solid #841b1b;
 padding-left: 10px;
}

/*===== GENERAL TAGS =====*/

p { margin: 1.5em 0; }

a {
 color: #dfb76e;
 text-decoration: none;
 border-bottom: 1px solid #841b1b;
}

a:hover { color: #841b1b; }

a img { border: none; }

img { padding: 3px; border: none; }

ul, li { list-style-type: none; margin: 0; padding: 0; }

dt { font-weight: normal; }

dd { margin-bottom: 16px; }

/*===== FORMS =====*/

input, textarea {
 background: transparent;
 border: 1px solid #841b1b;
 color: #ffffff;
 padding: 5px;
 font: 15px/1.6em Georgia, "Times New Roman", serif;
}

input[type=submit] {
 background: #841b1b !important;
 font-variant: small-caps !important;
 padding: 4px !important;
 margin: 0 10px;
}

  /* NEW!! This new code allows input boxes to change color on hover, fixes in IE6/7 button size problem,
   and help IE6 keep up with better browsers. Since IE6 doesn't recognize input[type=submit], and none
   of the buttons have IDs, settings must be applied to all inputs, and then reverted for non-buttons. */

  input, textarea {
   line-height: 1.25; /* overrides earlier setting; fixes submit in ie, tighter spacing in guestbook */
   }
   
  
/*===== SPECIFIC TAGS =====*/

.notes { margin: 0 0 0 10px; }

.details { margin: 0 0 14px 10px; }

.details ul, .details li { list-style: circle inside; }

.name { font-weight: bold; font-size: 14px; }

blockquote {
 border-left: 5px solid #841b1b;
 padding-left: 10px;
 margin: 6px 0 0 0;
 margin: 0 100px;
 font-size: 0.9em;
}

.caption {
 border-left: 5px solid #841b1b;
 padding-left: 10px;
 margin: 0 0 10px 0;
 font-size: 0.9em;
}

.artist { font-style: italic; }

.details .caption { border: none; padding: 0; margin: 0; }

.entry .caption {
 border: none;
 text-align: right;
 margin: 10px 100px 30px 100px;
 font-style: italic;
}

.entry .caption a { font-weight: normal; }

/*===== contact page =====*/

.contact .entry { margin-bottom: 14px; }

.contact .entry ul { margin-left: 14px; }

/*===== calendar page =====*/

.calendar .entry { margin-bottom: 20px; }

address { font-style: italic; }

.calendar .entry p { margin: 0 0 0 10px; color: #FFFFFF; }

.calendar .details {
 border-left: 5px solid #841b1b;
 padding-left: 10px;
 color: #CCCCCC;
}

.news_dash { display: none; }

/*===== guestbook page =====*/

body.guestbook #postForm {
 border: 1px solid #841b1b;
 padding: 9px;
 margin: 16px 0;
 padding-left: 40px;
}

body.guestbook #postForm label, body.guestbook #postForm input { display: block; }

body.guestbook #postForm input { height: 16px; /* for IE5 mac */ }

/* hide real value from IE5 Mac \*/
body.guestbook #postForm input { height: auto; }
/* end hack */

body.guestbook #postForm input, body.guestbook #postForm textarea { width: 600px; margin-bottom: 12px; display: block; }

#guestbook h2, #guestbook h3 { margin: 5px 5px 5px 50px; }

#guestbook .entry { margin-bottom: 20px; }

.guestbook form { margin: 0; /* browser constistency */ }

.guestbook #gbcomment {
 height: 100px !important; /* browser constistency */
 margin-bottom: 0 !important; /* browser constistency */
}

.guestbook #gbimage { position: absolute; margin-top: 20px; }

.guestbook .security_code_label { margin-top: 17px; margin-left: 120px; }

.guestbook #security_code { margin-left: 120px; width: 180px !important; }

/*===== products page =====*/

body.products div.products h2, body.products div.products p { margin: 0; }

body.products div.products .entry { border-bottom: 1px solid #cccccc; padding-bottom: 4px; }

body.products div.products form table {
 border-collapse: collapse;
 border-top: 1px solid #cccccc;
 border-left: 1px solid #ccc;
 margin: 0;
}

body.products div.products form table td, body.products div.products form table th {
 padding: 3px;
 border-right: 1px solid #cccccc;
 border-bottom: 1px solid #cccccc;
}

body.products div.products form table th {
 font-weight: bold;
 text-align: center;
 background: #FFFFFF;
}

/* for the links page */
body.links dt h3 a { font-size: 1em; font-weight: normal; }

#splashimage { text-align: center; margin: 100px auto; }

#splashimage a img { border: 0; }