@charset "iso-8859-1";
BODY {background: black; 
font-family: Comic Sans MS, Trebuchet MS, Tahoma, arial, sans-serif;
color: #F0F8FF;   /* aka aliceblue */
font-size: 85%;
background-repeat: repeat-y; 
background-position: 0 115; 
margin: 0; 
padding: 0; }  

/* Since I don't know what I'm doing, this style sheet was cobbled together 
from various templates and tutorials. It's definitely got more things than needed, but I'm 
learning and better more than I need than not enough. I'm trying to learn. */

a:link
{ color: #BADCFF; text-decoration: none; }

a:visited
{ color: #BADCFF; text-decoration: none; }

a:hover ,a:active 
{ color: #FFFFFF; 
background-color: #276B97; text-decoration: none; } 

h1 { font-size: 32px; }   /* These are useless*/
h2 { font-size: 24px; }
h3 { font-size: 22px; }
h4 { font-size: 19px; }


div#banner  /* For banner, duh */
{ color: #666699;
background-color: #000000;
border: 1px solid #FF0000}

div#banner h1  /* Keeps "Suspended In Gaffa" bigger and small-capped */
{ margin: 0;
padding: .3em 0 0 .8em;
font-variant:small-caps;
font-size: 2.0em;
font-weight: bold; } 

div#banner h3 /* Keeps "A celebration of female voices" smaller and small-capped */
{ margin: 0;
padding: 0 0 .3em 1.1em;
font-variant:small-caps;
font-size: 1.5em;
font-weight: normal; }



#navlist /* For the top navigation link */
{ border: 5px solid #006699;
padding: 0 0 0 20px;
margin: 0;
background-color: #000000;
font-family: Trebuchet MS, Tahoma, arial, sans-serif;
font-size: 12px;
font-weight: bold; }

#navlist li /* Keeps the top navigation link all on one line, instead of stacked */
{ display: inline;
list-style: none;
padding: 0;
margin: 0; }

#navlist #active /* Keeps the current selection over to the right and styled differently */
{ float: right;
color: #99CCFF;
border: 0px solid #C4FFFF;
background-color: #000000;
margin-right: 10px; }

#navlist li a  /* For the top navigation link */
{ text-decoration: none;
border: 1px solid #000000;
padding: 0 8px 1px 8px;
margin: 0 2px;
background-color: #3081b4;
color: #000; }

* html #navlist li a { padding: 0 8px; }  /* Haven't the faintest idea what this does */

#navlist li a:hover  /* For the top navigation link */
{ background-color: #99CCFF;
color: #000000; }

#navlist2  /* For the bottom navigation link. I needed it to stay over to the right. */
{ float: left;
border: 0px solid #006699;
padding: 0 0 0 20px;
margin: 0;
background-color: #000000;
font-family: Trebuchet MS, Tahoma, arial, sans-serif;
font-size: 12px;
font-weight: bold; }

#navlist2 li /* For the bottom navigation link */
{ float: right;
display: inline;
list-style: none;
padding: 0;
margin: 0; }

#navlist2 #active /* For the bottom navigation link */
{ float: right;
color: #99CCFF;
border: 0px solid #C4FFFF;
background-color: #000000;
margin-right: 10px; }

#navlist2 li a /* For the bottom navigation link */
{ text-decoration: none;
border: 1px solid #000000;
padding: 0 8px 1px 8px;
margin: 0 2px;
background-color: #3081b4;
color: #000; }

* html #navlist2 li a { padding: 0 8px; } /* For the bottom navigation link */

#navlist2 li a:hover /* For the bottom navigation link */
{ background-color: #99CCFF;
color: #000000; }

div#content /* On all pages. This keeps the body out of the background photo's way */
{ margin-left: 50px;
margin-right: 0px; } 

.header {color: #99CCFF; font: 20px }
.header a {color: #99CCFF; font: 10px }

div#content h1 
{ font-size: 32px;
color: #FF0000;
margin: 0;
padding-top: 1em;
font-weight: normal; } 

div#content h2
{ font-size: 24px;
color: #FF0000;
margin: 0;
padding-top: 1em;
font-weight: normal; } 

div#content h3 /* On all pages, though it's not used much */
{ font-size: 20px;
color: #FF0000;
margin: 0;
padding-top: 1em;
font-weight: normal; } 


div#content img /* On all pages, keeps inline photos from having a silly border */
{ border: 0px } 

div#content { line-height: 150%; } /* On all pages, though I'm not sure what it does */

div#content2  /* For the Master Song List */
{ margin-left: 0px;
margin-right: 0px; } 

div#content2 a  /* For the Master Song List. I needed the hot links to be smaller than the text. */
{ font: 8pt} 

div#container2 a   /* Don't know about this one. */
{ background-color: #000000; text-decoration: none; } 

div#rightmargin   /* For the Concerts page, the Master Song List, etc. Keeps the written text from going all the way to the right side */ 
{ margin-left: 0px;
margin-right: 200px; } 

/* test stuff */

#linkList 
{	margin-left: 600px; 
	position: absolute; 
	top: 112px; 
	right: 0px;
	 border: 1px solid #276b97;
padding: 0 0 0 15px;
margin: 0;
background-color: #000000;
font-family: Trebuchet MS, Tahoma, arial, sans-serif;
font-size: 10px;
font-weight: ; 
	}
#linkList2 { 
	font: 10px verdana, sans-serif; 
	padding: 10px; 
	margin-top: 20px; 
	width: 130px; 
	}

#linkList ul {
	margin: 0px;
	padding: 0px;
	}
#linkList li {
	line-height: 2.5ex; 
	list-style-type: none;
	background: transparent ; 
	padding-top: 5px; 
	margin-bottom: 5px;
	}
#linkList li a:link { 
	color: #BADCFF;
	}
#linkList li a:visited {
	color: #BADCFF;
	}




/* test stuff */





@media print {body {background:white; color:black} }
