/* CSS RESETS */

html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, 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;
  font-size: 100%;
  vertical-align: baseline;
  background: transparent;
}

body {
  line-height: 1;
}

blockquote, q {
  quotes: none;
}

blockquote:before, blockquote:after,
q:before, q:after {
  content: '';
  content: none;
}

/* remember to define focus styles! */
:focus {
  outline: 0;
}

/* remember to highlight inserts somehow! */
ins {
  text-decoration: none;
}
del {
  text-decoration: line-through;
}

/* tables still need 'cellspacing="0"' in the markup */
table {
  border-collapse: collapse;
  border-spacing: 0;
}

/* END RESETS */

body {
  font: 0.85em/1.4 Verdana,Arial,sans-serif;
  padding: 1em;
  background: url(images/backgroundtile2.png) top right repeat; /* #d0d4e0; /* light blue-grey */
}

a img {
 border: none;
}

h1 { 
  background: url(images/title.gif) no-repeat; overflow: hidden;
  height: 0; padding-top: 40px; width: 800px; 
}

h2 {
  font: bold 1.8em Arial,sans-serif;
  padding-bottom: 0.5em;
  color: #4b2b1e; /* brown */
  text-shadow: 1px 1px 1px #999;
}

h3 {
  font: 1.3em Arial,sans-serif;
  padding-top: 1em;
  padding-bottom: 0.5em;
  color: #9b926b; /* brown-gold */
}

p, blockquote {
  margin-bottom: 1em;
  text-align: justify;
}

blockquote {
  font-style: italic;
  font-size: 0.85em;
}

address {
  font-style: normal;
  padding-left: 30px;
}

td {
  vertical-align: middle;
  padding-right: 40px;
}

a, a:link {
  color: #306478;
}

a:hover {
  color: #a45d41;
}

a:visited {
  color: #4d1f40;
}

/* BASE STYLES */

#header, #menu, #content {
  border: 1px solid #9b926b; /* brown-gold */
  box-shadow: 3px 3px 4px #4b2b1e;
  -webkit-box-shadow: 3px 3px 4px #4b2b1e;
  -moz-box-shadow: 3px 3px 4px #4b2b1e;
  background: #e0dcc7;
}

#content {
  background: white;
  padding: 1em;
}

.introduction {
  font-size: 1.2em;
}

ul.inlinebuttons {
  margin-left: -25px;
}

.inlinebuttons li {
  display: inline;
}

.inlinebuttons li a {
  display: inline-block;
  padding: 0.5em;
  border: 1px solid #9b926b;
  margin: 0.5em 0.5em 0.5em 0;
  width: 377px;
  font-weight: bold;
  background: #e0dcc7;
  color: #4b2b1e; /* brown */
  box-shadow: 3px 3px 4px #4b2b1e;
  -webkit-box-shadow: 3px 3px 4px #4b2b1e;
  -moz-box-shadow: 3px 3px 4px #4b2b1e;  
  text-shadow: 1px 1px 1px #fff;
  text-decoration: none;
}

.inlinebuttons li a.albumbutton {
 background: #e0dcc7 url(images/album-icon.gif) right top no-repeat;
}

.inlinebuttons li a.performbutton {
 background: #e0dcc7 url(images/perform-icon.jpg) right center no-repeat;
}

.inlinebuttons li a:hover { /* reverse the background and foreground */
  color: #e0dcc7; 
  background: #4b2b1e;
  text-shadow: 1px 1px 1px #000;
}

.floatright {
  float: right;
  margin-left: 20px;
  box-shadow: 3px 3px 4px #4b2b1e;
  -webkit-box-shadow: 3px 3px 4px #4b2b1e;
  -moz-box-shadow: 3px 3px 4px #4b2b1e;  
}

.withborder {
  border: 1px solid #ccc;
  padding: 5px;
}

/* HEADER */

#header {
  margin-bottom: 1em;
  padding: 0.5em;
}

/* MENU */

#menu {
  float: left;
  width: 150px;
  margin-right: 0.75em;
}

#menu li {
  list-style: none;
}

#menu li a {
  display: block;
  padding: 0.5em;
  border-bottom: 1px solid #9b926b;
  background: #e0dcc7;
  color: #4b2b1e; /* brown */
  font-weight: bold;
  font-size: 1.2em;
  text-decoration: none;
  text-shadow: 1px 1px 1px #fff;
}

#menu li a:hover { /* reverse the background and foreground */
  color: #e0dcc7; 
  background: #4b2b1e;
  text-shadow: 1px 1px 1px #000;
}

/* BODY CONTENT */

#content {
  margin-left: 170px;
}

#content ul {
  padding-left: 2em;
  padding-bottom: 0.5em;
}

#highlightcol {
  float: right;
  margin-right: 1em;
  margin-left: 1em;
  width: 350px;
  padding: 0.5em;
  border: 1px solid #ddd;
}

.albumcover {
  float: left;
  border: 1px solid #9b926b; /* brown-gold */
  padding: 5px;
}


ol.albumlist {
  margin-left: 350px;
  list-style: decimal;
  padding-bottom: 1em;
}


/* FOOTER */

#footer {
  font-size: 0.78em;
  border-top: 1px solid #ccc;
  padding-top: 0.5em;
  text-align: right;
}