@import "reset.css";

body {
	font-family: Helvetica, Verdana, Arial, sans-serif;
	font-weight: normal;
	background: #000;
	color: #666;
}

	/* landing page background */
	body.landing {
		background: #000 url(css_images/landing_smoke.png) top center no-repeat;
		width: 100%;
	}

/* page links */
a {
	 -webkit-transition: color 300ms ease-in; /*safari and chrome */
	 -o-transition: color 300ms ease-in; /* opera */
	 -moz-transition: color 300ms ease-in; /* firefox 3.7+ */
}

	a:link { /* unvisited link */
		text-decoration: none;
		color: #600;
	}

	a:visited { /* visited link */
		color: #600;
		text-decoration: none;
	}
	
	a:hover { /* mouse over link */
		color: #aaa;
		text-decoration: none;
	}
	
	a:active { /* selected link */
		text-decoration: none;
	}

/* main logo, both header and footer */
h1, h2 {
	color: #aaa;
	padding: 0.2em 0;
}

	/* splits the color of the logo */
	h1 span, h2 span {
		color: #666;
	}
	
/* main header logo */
h1 {
	font-size: 8em;
}

	/* landing page */
	h1.landing {
		font-size: 12em;
		text-align: center;
		position: relative;
		top: 200px;
	}

		/* maintain the look of the header link */
		h1 a:link {
			color: #aaa;
			-webkit-transition: none; /* safari and chrome */
			 -o-transition: none; /* opera */
			 -moz-transition: none; /* firefox 3.7+ */
		}
		
		h1 a:visited {
			color: inherit;
		}
	
		h1 a:hover {
			padding-left: inherit;
		}

/* sidebar, main content, and list headers */
h3 {
	color: #999;
	font-size: 2em;
	padding-bottom: 1em;
}

	h3 span {
		font-size: 0.5em;
		padding-left: 1em;
		color: #333;
	}

/* body text	 */
p {
	padding-bottom: 1em;
	font-size: 1.4em;
	line-height: 1.2;
}

/* clearing div */
div.cleared {
	clear: both;
}

div#main {
	width: 850px;
	margin: 0 auto;
}

/* page headers	 */
div#header {
	height: 200px; width: 850px;
}

	/* sets each page's header image */
	.about {
		background: #000 url(css_images/header-0.png) no-repeat;
	}

	.music {
		background: #000 url(css_images/header-3.png) no-repeat;
	}

	.video {
		background: #000 url(css_images/header-5.png) no-repeat;
	}

	.photos {
		background: #000 url(css_images/header-1.png) no-repeat;
	}

	.news {
		background: #000 url(css_images/header-2.png) no-repeat;
	}

	.contact {
		background: #000 url(css_images/header-4.png) no-repeat;
	}

/* landing page navigation */
ul.landing {
	text-align: center;
}

	ul.landing li {
		display: inline;
		font-size: 3em;
		padding: 0.8em;
		position: relative;
		top: 30px;
	}

/* holds the IE warning */
div.IEwarning {
	width: 750px;
	margin: 175px auto;
	background: #111;
	padding: 0.5em;
	font-size: 0.9em;
	color: #999;
}


/* main site navigation */
ul#navbar {
	float: right;
	font-size: 2.5em;
	line-height: 1.3em;
	padding: 0 0.5em;
	height: 200px; width: 140px;
}

	ul#navbar a {
		-webkit-transition: color 300ms, padding 300ms ease-in; /* safari and chrome */
		-o-transition: color 300ms, padding-left 300ms ease-in; /* opera */
		 -moz-transition: color 300ms, padding 300ms ease-in; /* firefox 3.7+ */
	}
	
		ul#navbar a:visited {
		}	
		
		ul#navbar a:hover {
			padding-left: 0.3em;
		}
	
		ul#navbar a:active {
		}
		
		/* identifies the currently loaded page */
		ul#navbar a.currentPage {
			color: #999;
			border-left: 2px solid #600;
	 		padding-left: 0.2em;
		}

/* main content wrapper */
div#wrapper {
	width: 850px;
	padding-top: 2em;
}

/* left sidebar */
div#sidebar {
	float: left;
	width: 17%;
	padding: 0 0.5em;
	border-right: 1px solid #333;
}

	/* sidebar title */
	div#sidebar h3 {
		text-align: center;
		}

	div#sidebar p {
		text-align: left;
		font-size: 1.2em;
	}
	
	div#sidebar img {
		margin: 0 auto;
		opacity: 0.4;
		filter: progid:DXImageTransform.Microsoft.Alpha(opacity=40); /* for IE6, IE7, and IE8 */
		-webkit-transition: opacity 300ms ease-in; /* safari and chrome */
		-o-transition: opacity 300ms ease-in; /* opera */
		 -moz-transition: opacity 300ms ease-in; /* firefox 3.7+ */
	}
	
	div#sidebar img.nowPlaying {
		opacity: 1.0;
		filter: progid:DXImageTransform.Microsoft.Alpha(opacity=100); /* for IE6, IE7, and IE8 */
	}

		div#sidebar img:hover {
			opacity: 1.0;
			filter: progid:DXImageTransform.Microsoft.Alpha(opacity=100); /* for IE6, IE7, and IE8 */
		}
	
	/* side bar list		 */
	div#sidebar ul, div#extraSidebar ul {
		list-style: none;
		text-align: center;
		color: #666;
		padding-bottom: 1.5em;
		}	
		
		/* band member name in the sidebar	 */
		div#sidebar li.player {
			color: #600;
		}
		
		/* former band member names */
		li.player {
			font-size: 1.6em;
			color: #600;
			padding: 0.2em;
			}
		
		/* instrment played by each band member */
		li.instrument {
			font-size: 1.2em;
			padding-top: 0.2em;
			padding-bottom: 1.5em;
			color: #999;
			}
		 
		/* band member nickname */
		li.nickname {
			font-size: 1.2em;
			}
		
		/* nickname and date (for former members) */
		li.nickname, li.date {
			font-style: italic;
			}

/* main page content area */
div#content {
	padding: 0 1em;
	width: 665px;
}

	div#content.split {
		width: 60%;
		float: left;
	}

	div#content.split p {
		text-indent: 1em;
		text-align: justify;
	}

	div#content p {
		text-indent: 0em;
	}
	
	ul.images {
		height: 75px;
		padding-bottom: 1em;
		margin: 0 auto;
	}
	
		ul.images li {
			float: left;
			margin-left: 0.6em;
		}
		
		div#content img {
			border: 2px solid #600;
			-webkit-transition: border 300ms ease-in; /* safari and chrome */
			-o-transition: border 300ms ease-in; /* opera */
			 -moz-transition: border 300ms ease-in; /* firefox 3.7+ */
		}
		
			div#content img:hover {
				border: 2px solid #999;
			}
		
	/* holds the three-column list for former members */
	div.contentList {
		padding-top: 1em;
	}
	
		div.contentList ul {
			float: left;
			width: 30%;
			padding: 0.75em;
			list-style: none;
			text-align: center;
			color: #666;
		}	
			
		/* former member name */
		div.contentList li.player {
			color: #600;
		}
	
	div.youtube {
		float: left;
		width: 300px;
		background: #111;
		padding: 1em 1.6em;
	}	

div.demo_section_bot div#demo_info p {
		text-indent: 0em;
	}

/* right sidebar */
div#extraSidebar {
	float: left;
	width: 18%;
	padding: 0 0.5em;
	border-left: 1px solid #333;
}

	div#extraSidebar h3 {
		padding-left: 0.5em;
	}

		div#extraSidebar ul#lyrics li {
			font-size: 1.4em;
			padding-bottom: 0.5em;
			text-align: left;
			padding-left: 0.5em;
		}
					
/* page footer */
div#footer {
	clear: both;
	height: 80px;
	padding-top: 50px;
	text-align: right;
	width: 850px;
	margin: 0 auto;
}

	/* footer logo */
	h2 {
		font-size: 3em;
		margin-right: 165px;
	}
	
	/* footer navigation */
	ul.footerNav {
		padding-bottom: 0.5em;
		font-size: 1.2em;
		margin-right: 165px;
	}

		ul.footerNav li {
			display: inline;
			padding: 0 0.2em;
		}
	
	/* copyright info */
	div#footer p {
		font-size: 0.8em;
		margin-right: 165px;
	}