@charset "UTF-8";
/* CSS Document */

body {
background-color:#850500;
font-family: verdana;
background-image:url(../graphics/sarah-chron-photo-background.jpg);
background-repeat: no-repeat;
background-position: center top;
color : #000;
padding: 0;
margin: 0;
font-size: 1em;
}

a , a:link , a:active , a:visited , a:hover {
	color: #FC0;
	text-decoration: none;
}
a:hover {
	text-decoration: underline;
}
.clearleft {
	clear: left;
}
.clearright {
	clear: right;
}
.clearboth {
	clear: both;
}

img {

      behavior: url("pngbehavior.htc");

      }
	  
p {
	color: #000;
}
	  
#wrapper {
background-image:url(../graphics/french_opera_red_small.png);
background-repeat: repeat-y;
background-position: left;
width: 100%;
height: 100%;
}



#center {
	width: 50em;
	margin-left: 230px;
	position: relative;
	
}

#center h1 {
	background-color: black;
	display: block;
	color: #F90;
	font-size: 1.25em;
	padding: 1em;
	font-family: "Palatino Linotype", "Book Antiqua", Palatino, serif;
	padding: 10px;
}

	
	


.center1 {
	width: 50em;
	margin: 0 auto;
}

.goldback {
	background-image:url(../graphics/yellow_40.png);
	background-repeat: repeat;
	height: 12000px;
	width: 100%;
	
}
.nopad {
	padding: 0;
}
.pad10 {
	padding: 10px;
}

#mainPage {
	width: 100%;
	top: 300px;
	position: relative;
}

#mainContent  {
	width: 100%;
	padding: 10px;
	z-index: 2;
	background-image:url(../graphics/yellow_40.png);
	background-repeat: repeat;
	background-position: bottom;
	margin-top: 0px;
}




#leftnav {
	color:#F90;
	font-size: .8em;
	letter-spacing: .2em;
	line-height: 1em;
	font-weight: normal;
	font-family:"Palatino Linotype", "Book Antiqua", Palatino, serif;
	padding: .63em;
	padding-bottom: 0px;
	z-index: 202;
	

	
}
#leftnav ul li a {
	color: #f90;

}

#leftnav ul li:hover {
	background-image: url(../graphics/red-wavy-left-right.png);
	background-repeat: repeat-y;
	background-position: -100px;
}

#leftnav ul {
	margin: 0;
	padding: 0;
}

#leftnav ul li {
	list-style:none;
	padding: 4px;
	padding-left: 20px;
	
}

.padleft20 {
	padding-left: 20px;
}

.relative {
	position: relative;
}

.hidden {
	display: hidden;
}

.offscreen {
	left: -9999px;
	position: absolute;
}

.padleft300 {
	padding-left: 300px;
}

#header h1 {
background-image:url(../graphics/sarahBrownBass_Songs.png);
background-position:-10px -20px;
background-repeat: no-repeat;
height: 340px;
width: 400px;
}

#underscribble {
z-index: 2;
background-image:url(../graphics/red-dark-long.png);
background-repeat:repeat-y;
background-position: right;
height: 100%;
width: 100%;
padding-left: 10px;
position: absolute;
padding-bottom: 30%;
}

#undershape {
z-index:1;
background-image:url(../graphics/lowrezsarah.jpg);
background-repeat:repeat-y;
background-position: right;
height: 100%;
width: 100%;

position: absolute;
}

#undercutout {
z-index:1;
background-image:url(../graphics/sarah-cutout.png);
background-repeat:no-repeat;
background-position: 0px 100px;
height: 100%;
width: 100%;
padding-left: 10px;
position: absolute;
}

#sarah img {
z-index: 10;
margin: 10px;
margin-right: -10px;
border: 1px solid #ffcc00;

}

#topnav {
background-image: url(../graphics/black-gradient.png);
background-repeat: repeat-x;
background-position: bottom;
color: #FFCC00;
margin-top: 20px;
padding: 10px;
width: 100%;
height: 20px;
font-weight: bold;
font-size: .7em;
font-family: "verdana, helvetica";
z-index: 3;

}

#topnav ul {
display: block;
text-align: center;
}

#topnav ul li {
float: left;
padding: 2px;
padding-left: 4px;
padding-right: 4px;
list-style: none;
margin: auto 5px;
}

#leftnav ul li a, #leftnav ul li a:link, #leftnav ul li a:visited, #leftnav ul li a:hover {
color:#FF9300;
text-decoration: none;
font-weight: normal;
vertical-align: bottom;
} 
#leftnav ul li a:hover {
color:#FFEC00;
}

#news {
background-image:url(../graphics/french_opera_red_small.png);
background-repeat: repeat-y;
background-position: left;
width: 190px;
border-top: 1px solid #FFCC00;
border-right: 1px solid #FFCC00;
border-bottom: 1px solid #FFCC00;
border-left: 1px solid #FFCC00;
padding: 10px;
margin-top: 10px;
height: auto;
float: left;
font-size: .8em;
padding-bottom:10em;

}
#news h1 {
background-image:url(../graphics/whatsnew1.png);
background-repeat: no-repeat;
background-position: left top;
height: 77px;
width: inherit;
}


#news ul{
background-image:url(../graphics/red-face-trans.png);
background-repeat: repeat-y;
background-position: left;
color:#FFCC00;
font-weight: bold;
}

#leftside {
	width: 22em;
	float: left;
	margin-right: 1em;
	margin-left: 1em;
	border: 1px solid black;
}
#rightside {
	width: 22em;
	float: right;
	margin-right: 1em;
	border: 1px solid black;
}
.sumofsides {
	width: 42em;
	padding: 1em;

}

#musicplayer h2 {
font-family: "verdana";
font-style: italic;
font-size: .7em;
color: #FFFF00;
}

#musicplayer {
width:100%;
height: 250px;
font-size: .8em;
padding: .63em;
z-index: 500;
text-align: center;


}




#music_desc {
background-image:url(../graphics/yellow_40.png);
background-repeat: repeat;
width:auto;
padding: 0.63em;
font-size: .65em;
z-index: 400;
text-align: left;


}

#music_desc p {
	padding: .63em;
}

.bbr {
	border-top:1px solid black;
	
	
}



#shortbio{
background-image:url(../graphics/red-face-trans.png);
background-repeat: repeat-y;
background-position: left;
width: 190px;
border-top: 1px solid #FFCC00;
border-right: 1px solid #FFCC00;
border-bottom: 1px solid #FFCC00;
padding: 10px;
margin-top: 10px;
height: auto;
float: left;
font-size: .8em;
color:#FFCC00;
font-weight: bold;
}


#sarah {
float: right;

}



#footer {
clear: both;
background-color: #000;
border: 1px solid #ffcc00;
width: auto;
height: 10em;
margin-top: 10px;
margin-left: 10px;
margin-right: -10px;
bottom: 0;
z-index: 20;
position: relative;
}

#left {
	float: left;
	background-image: url(../graphics/cornerbit.png);
	background-repeat: no-repeat;
	background-position: bottom right;
	height: 600px;
	margin-left: 5% auto;
	margin-right: 20px;
	width:280px;
}
#right {
	float: right;
	background-image: url(../graphics/cornerbit1.png);
	background-repeat: no-repeat;
	background-position: bottom left;
	height: 600px;
	margin-right: 10% auto;
	padding-right: 50px;
	margin-left: 20px;
	width:280px;
}

.credit{
	font-size: .7em;
	font-weight: normal;
	color: #000;
	padding-top: 6em;
	z-index: 51;
	position: relative;
	top: 290px;
	left: 300px;
	width: 500px;
	margin-left: 300px;
	text-align: right;

	
}

.credit a {
	color: #000;
}

.padtop20 {
	padding-top: 20px;
}