/*** Resets ***/

html {
	height: 100%;
}


/*Must have a body height declaration */
body {
	height: 100%;
	margin: 0;
	padding: 0 10px 0 10px;
	font-family: "Helvetica Neue", Helvetica, Arial, Verdana, sans-serif;
	font-size: 11px;
	color: #a1a1a1;
	background-color: #fff;
}

body#home {
	padding: 0;
}


#wrapper {
	position: relative;
	display: block;
	height: 99.9%;
	width: 99.9%;
	text-align: center;
}


table {
	display: table;
	table-layout: fixed;
	border-collapse: collapse;
	border-spacing: 0;
	height: 100%;
	width: 100%;
}


td, th {
	padding: 0;
}


td {
	width: 100%;
	vertical-align: middle;
}


#vertical {
	/*display: block;*/
	text-align: left;
}

#home #vertical {
	background: #fff url('../images/banner.jpg') no-repeat top center;
}


#top {
	position: relative;
	height: 50px;
	width: 900px;
	max-width: 900px;
	text-align: left;
	margin: 0 auto;
}


#content {
	width: 900px;
	max-width:900px;
	margin: 0 auto;
	min-height: 600px;
	/*color: #aeaeae;*/
	color: #a3a3a3;
	background-color:#efefef;
	font-size: 120%;
}


/* appears on homepage only */
#banner {
	width: 900px;
	max-width:900px;
	margin: 0 auto;
	height: 155px;
}


#header {
	position: relative;
	vertical-align: bottom;
	font-size: 95%;
	width: 900px;
	height: 25px;
	margin: 0 auto;
}


#footer {
	position: relative;
	height: 68px;
	clear: both;
	vertical-align: top;
	font-size: 95%;
	line-height: 2em;
	width: 900px;
	margin: 0 auto;
	text-align: right;
	letter-spacing: .2em;
	color: #d1d1d1;
}


#bottom {
	position: relative;
	height: 50px;
	width: 900px;
	max-width: 900px;
	text-align: left;
	margin: 0 auto;
	color: #e1e1e1;
}


#nav {
	position: absolute; bottom: 18px; left: 430px;
	letter-spacing: .4em;
}

#nav a {
	text-decoration: none;
	/*color: #bcbcbc;*/
	color: #aaa;
}


img { border: 0; }
#slide img { width:900px; }
#logo { position: absolute; bottom: 0; left: 0; }


#slideshow { clear: right; height: 600px; width: 900px; padding: 0; margin: 0; overflow: hidden; }
#slideshow img { padding: 0; margin: 0; border: 0; }

#count { position: absolute; bottom: 0; right: 100px; height: 25px; width: 45px; line-height: 25px; vertical-align: middle; text-align: right; color: #b7b7b7; }

a { outline: none; color: #ccc; }

#controls {
	position: absolute;
	bottom: 0; right: 0;
	width: 100px;
	height: 25px;
	background: url(../images/controls.png);
	margin: 0; padding: 0;
}

#controls li { margin: 0; padding: 0; list-style: none; position: absolute; top: 0; }
#controls li, #controls a { height: 25px; width: 15px; display: block; }

#prev { left: 8px; width: 15px; }
#play { left: 31px; width: 15px; }
#pause { left: 54px; width: 15px; }
#next { left: 77px; width: 15px; }

#prev a:hover { background: transparent url(../images/controls.png) -8px -25px no-repeat; }
#play a:hover { background: transparent url(../images/controls.png) -31px -25px no-repeat; }
#pause a:hover { background: transparent url(../images/controls.png) -54px -25px no-repeat; }
#next a:hover { background: transparent url(../images/controls.png) -77px -25px no-repeat; }

#sound { position: absolute; bottom: 0; right: 145px; width: 25px; height: 25px; cursor: hand; }
#nexttrack { position: absolute; bottom: 0; right: 170px; width: 75px; height: 25px; line-height: 25px; vertical-align: middle; text-align: right; cursor: hand; display: none; }

.playing { height: 25px; width: 25px; background: transparent url(../images/sound.png) 0 0 no-repeat; }
.playing a { height: 25px; width: 25px; display: block; }
.playing a:hover { background: transparent url(../images/sound.png) 0 -25px no-repeat; }

.paused { height: 25px; width: 25px; background: transparent url(../images/sound_mute.png) 0 0 no-repeat; }
.paused a { height: 25px; width: 25px; display: block; }
.paused a:hover { background: transparent url(../images/sound_mute.png) 0 -25px no-repeat; }

#toolbar { float: right; }

#left {
	float: left;
	display: inline-block;
	width: 400px;
}

#right {
	display: inline-block;
	padding: 18px 30px;
	width: 440px;
	-width: 437px;  /* IE HACK */
}


.title {
	font-size: 140%;
}

label, input, textarea {
	display: block;
	float: left;
	margin-bottom: 5px;
}

label {
	text-align: left;
	width: 130px;
	padding-right: 20px;
}

br {
	clear: left;
}


textarea, input.input {
	background-color: #fff !important; 
	color: #a3a3a3 !important;
	border: 1px solid #ccc;
	padding: 2px;
	font: 95%, Verdana, Arial, Helvetica;
	width: 270px;
}

textarea { 
	overflow: auto; 
}

input.button {
	background-color: #fff; 
  	/*color: #b1b1b1;*/
	color: #a3a3a3;
	border: 1px solid #ccc;
	margin: 0px;
	padding: 2px 12px;
	font: 14px "Helvetica Neue", Helvetica, Arial, Verdana, sans-serif;
	text-align: center;
	vertical-align: middle;
}

div.callout {
	background-color: #fff; 
  	/*color: #b1b1b1;*/
	border: 1px solid #ccc;
	margin: 0;
	padding: 5px 12px;
	font: 14px "Helvetica Neue", Helvetica, Arial, Verdana, sans-serif;
	width: 40%;
	overflow: visible;
	text-align: center;
	vertical-align: middle;
}
