/*This file should contain specific styling for this optional style; general styles should go in another file*/

/*GENERAL*/
* {
	padding: 0; margin: 0
	}
	
/*Sticky Footer by Ryan Fait http://ryanfait.com/*/
/*DON'T CHANGE THIS, change the values elsewhere in this file - this should be the same for all styles*/
html, body {
	height: 100%;
	}
.wrapper {
	min-height: 100%;
	height: auto !important;
	height: 100%;
	}
.footer, .push {
	height: 142px; /* .push must be the same height as .footer */
	}
/*End sticky footer*/

body {
	font-family: arial, helvetica, sans-serif;
	background: black url('pix/bg-trees.jpg') no-repeat fixed center center;
	}

/*END GENERAL*/


/*LINKS*/
a:link, a:visited {color: blue}
a:hover {color: orange}


/*HEADERS*/
h1, h2 {display: none}
h3 { background: transparent url('pix/update-icon1.gif') no-repeat scroll 0px 0px; padding-top: 52px; /*change the pagging depending on how tall the image is*/
	 font-size: 16px; padding-left: 52px; 
	 border-bottom: 4px solid black;
	 max-width; 100px;
}


/*IMAGES*/
img {border-style: none}
div.image-center {
	margin: 18px auto 0 auto; text-align: center
}
	div.image-center img {display: block; margin: 0 auto 0 auto}
div.image-left {
	float: left; margin-right: 10px; margin-top: 10px; 
}


/*TEXT STYLES*/

p {
	margin: 1.5em 0 1.5em 0;
	line-height: 20px;
}

cite {font-style: italics;}
	cite.album {font-weight: bold;}
	cite.band, cite.song {}
	
em {font-weight: bold; font-style: normal}



/*UPDATES*/
div.update {
	clear: both; font-size: 13px;
	padding-top: 60px; /* <- creates margin on bottom of update div; change upper placement of div#content by this amount to remove top margin of first entry*/
	border: 0 solid green;
}

/*MENU*/
div#menubar {
	position: absolute; top: 114px; left: 0px; width: 700px;
	text-align: center;
	border: 0px solid red;
	width: 100%; text-align: center;
	}
	div#logolink { /*the box that creates the link over the logo area at the page top*/
		position: absolute; top: 44px; left: 0px; width: 700px;
		border: 0px solid blue;
		height: 60px;
	}
		span#logolinkbox {
			display: block;
			bbackground-color: orange;
			height: 100%;
			width: 100%;	
			text-indent: -9000px;	
		}
	/*NAVIGATION*/
	div#menubar ul {
		display: inline-block;
		width: auto;
		border: 0px solid green;
		margin: 0 auto 0 auto;
		}
	div#menubar ul li {list-style-type: none;
		border: 0px solid purple; 
		height: 32px; width: 130px; /*Change the width to make the words father apart of closer together*/ 
		float: left;				/*Change the height to 1/2 the height of the sprited image*/
		}
	div#menubar ul li a {
		display: block; text-indent: -10000px;
		height: 100%; width: 100px;
		background-color: transparent;
		background-repeat: no-repeat;
		background-attachment: scroll;
		background-position: center 0;
		border: 0px solid pink;
		margin: 0 auto 0 auto;
		}
	div#menubar ul li a:hover {
		background-position: center -32px;	/*This should be the same as the Widths under the li styling above*/
		}
	/*MENU BUTTONS*/
	li.news a 		{background-image: url(pix/menu-news.png)}
	li.contact a 	{background-image: url(pix/menu-contact.png)}
	li.merch a 		{background-image: url(pix/menu-merch.png)}
	li.media a 		{background-image: url(pix/menu-media.png)}
	li.bio a 		{background-image: url(pix/menu-bio.png)}
	li.press a 		{background-image: url(pix/menu-press.png)}
	li.twitter a 		{background-image: url(pix/menu-twitter.png)}


/*STYLING FOR THIS STYL ONLY*/

.wrapper {
	background: transparent url('pix/bg-content-babies.png') repeat-y scroll top center;
	width: 810px;
	margin: 0 auto -270px; /* the bottom margin is the negative value of the footer's height - and for some reason I had to remove 20 extra px to get it to line up, something is wrong somewhere */
	}	
	
	
div#content-container {
	width: 700px; 
	margin: 0 auto 0 auto; padding: 0;
	position: relative;
	border: 0 solid green;
	}

div#logobar {
	width: 700px; height: 333px; background: transparent url('pix/logobar.jpg') no-repeat scroll center center; position: relative; z-index: 0; margin-bottom: -100px
	}
	
div#content {
	position: relative;
	top: -60px; /* set this same as upper padding of update box to remove top margin of first entry */
	width: 600px; z-index: 2; margin: 0 auto 0 auto
}

div.clearer {
	width: 100%; height: 80px; clear: both;
	border: 0 solid blue;
	}
	
	
div.footer {
	position: relative; width: 810px; /*This needs to be the same as the width of the wrapper; this allows the footer to stay in place when the windows is resized rather than being shifted to the left of the screen when the screen gets too small*/
	margin: 0 auto 0 auto; height: 250px; margin: 0 auto 0 auto; background: transparent url(pix/bg-orbshadows.jpg) no-repeat scroll bottom center; text-align: center
	}
	div.footer p.copyright {
		font-size: 11px; color: black; position: relative; top: 190px
		}
		
		
		
div.bio {
	padding-top: 40px;
}  
	div.bio p {
	}
	
	div.bio h4 {
		text-transform: uppercase;
		font-size: 22px;
		margin-top: 3em;
		/*border-bottom: 2px solid black;*/
		/*width: 400px;*/
		margin-bottom: -.5em
	}