/* CSS Document */
/*Copyright Stringfever Productions 2006*/
	
*, html, body{
	margin: 0;
	padding: 0;
	font-family: Arial, Helvetica, sans-serif;
	font-weight: lighter;
	}
	
html{
	background-color: #000;
	}
	
.left{
	float:left;
	}
	
.right{
	float:right;
	}
	
#quote p,.hidden{
	left: -9999px;
	width: 0px;
	overflow: hidden;
	position: absolute;
	}
	
a:link{color: #FFF;}
a:hover{color: #FBCD50;}
a:visited{color: #FFF;}


/* This is a fix for the 'Doubled top padding after float bug' in IE 5/6/7 PC:
http://lukeplant.me.uk/articles/webdev/cssbugs/double_padding_on_cleared_divs_report.html */
/* Hides from IE5-mac \*/
* html .gl {height: 1%;}
/* End hide from IE5-mac */

	
	
/* container styles */

#wrapper{
	width: 800px;
	height: 590px;
	margin: auto;
	padding: 10px 0 0 0;
	}
	
#header{
	height: 130px;
	width: 800px;
	background: url(images/header.jpg) no-repeat 0 0;
	}
	
#content{
	clear: both;
	height: 700px;
	}
	
#footer{
	clear: both;
	height: 30px;
	}

#review {
	width: 380px;
	}
	

/* content styles*/

	/* swap the main and sidebar content at any time using the .ms or .sm class */	
div#sidebar{
	display: none;
	color: #FFF;
	padding: 0 20px;
	margin: auto 0;
	}

#content.ms div#main,
#content.sm div#main {
	width: 500px;
	}
	
#content.ms div#sidebar,
#content.sm div#sidebar {
	display: block;
	width: 260px;
	}
	
#content.ms div#main,
#content.sm div#sidebar {
	float: left;
	}
	
#content.sm div#main,
#content.ms div#sidebar {
	float: right;
	}

#inner{
	margin: 50px 0 0 0;
	height: 100%;
	color: #fff;
	}

#contentInfo{
	width: 350px;
	padding: 120px 0 110px 245px;
	text-align: center;
	color: #fff;
	}

#content.vid{
	/*background: url(images/mainimages/video_image.jpg) no-repeat 120px 0;*/
	}
	
.see{
	background: url(images/mainimages/seen_image.jpg) no-repeat 400px 0;
	}

.event{
	background: url(images/mainimages/event_image.jpg) no-repeat 290px 0;
	}
	
.contact{
	background: url(images/mainimages/contact_image.jpg) top left no-repeat;
	}

	/*quartered conetnt */
#quarter1, #quarter2, #quarter3, #quarter4{
	float: left;
	display: inline;
	margin: 15px 0 0 0;
	width: 25%;
	color: #FFF;
	}
	
#quarter1CD, #quarter3CD{
	float: left;
	width: 120px;
	color: #FFF;
	}

#quarter2CD, #quarter4CD{
	float: left;
	width: 280px;
	padding: 40px 0 0 0;
	color: #FFF;
	}
	
#seenhalf1, #seenhalf2{
	float: left;
	display: inline;
	margin: 15px 0 0 0;
	width: 230px;
	color: #FFF;
	}
	
#weddings{
	float: left;
	display: inline;
	margin: 15px 0 0 0;
	width: 350px;
	color: #FFF;
	}
	
#pastnews{
	height: 100px;
	background: url(images/news_past.jpg) no-repeat bottom right;
	clear: both;
	text-align: right;
	margin: auto;
}
#pasttxt{
	margin: 45px 200px 0 0;
	width: 190px;
	float: right;
}
	

/* menu styles */

#menu{
	width:499px;
	height: 30px;
	float: right;
	margin: 48px 5px 0 0;
	}

#submenu{
	clear: both;
	width: 285px;
	height: 25px;
	float: right;
	margin: 20px 5px 0 0;
	}

#copymenu{
	width: 335px;
	float: left;
	}
	
	/* global nav */
#menu li, 
#submenu li,
#copymenu{
	margin: 0; 
	padding: 0;
	display: inline;
	list-style-type: none;
	}

#menu a, 
#submenu a,
#copymenu a{
	float: left;
	padding: 23px 0 0 0;
	overflow: hidden;
	height: 0px !important; 
	height /**/:20px; /* for IE5/Win */
	}
	
#menu a:hover, 
#submenu a:hover,
#copymenu a:hover{
	background-position: 0 -30px;
	}

#menu a:active, 
#menu a.selected, 
#submenu a:active, 
#submenu a.selected,
#copymenu a:active, 
#copymenu a:selected{
	background-position: 0 0;
	}
	
#menu .on, 
#submenu .on, 
#copymenu .on{
	background-position: 0 -30px;
	}
	
#footermenu {
	text-align:center;
	padding: 5px;
}
	
#footermenu p {
	padding: 0 5px;
	margin: 0;
	/*float: left;*/
	color:#FFF;
}




	/* top nav */
#show a {
	width: 77px;
	background: url(images/theShow.gif) top left no-repeat;
	}

#band a {
	width: 84px;
	background: url(images/theBand.gif) top left no-repeat;
	}

#event a {
	width: 66px;
	background: url(images/events.gif) top left no-repeat;
	}

#video a {
	width: 59px;
	background: url(images/video.gif) top left no-repeat;
	}
	
#seenAt a {
	width: 70px;
	background: url(images/seenAt.gif) top left no-repeat;
	}
	
#news a {
	width: 60px;
	background: url(images/news.gif) top left no-repeat;
	}
	
#contact a {
	width: 60px;
	background: url(images/contact.gif) top left no-repeat;
	}
	
	/* sub nav */
#concerts a {
	width: 80px;
	background: url(images/concerts.gif) top left no-repeat;
	}
	
#buyCD a {
	width: 107px;
	background: url(images/buyCD.gif) top left no-repeat;
	}
	
#techSpecs a {
	width: 98px;
	background: url(images/techSpec.gif) top left no-repeat;
	}
	
	/* footer */
#copyright,
#bookings,
#phone{
	float: left;
	padding: 23px 0 0 0;
	overflow: hidden;
	height: 0px !important; 
	height /**/:20px; /* for IE5/Win */
	}
	
#copyright {
	width: 170px;
	background:url(images/copyright.gif) top left no-repeat;
	margin: 0 0 0 10px;
	}
	
#design a{
	width: 135px;
	background:url(images/design.gif) top left no-repeat;
	}

#bookings{
	width: 130px;
	background:url(images/bookings.gif) top left no-repeat;
	}
	
#phone{
	width: 138px;
	background:url(images/phone.gif) top left no-repeat;
	}
	
#email a{
	width: 170px;
	background:url(images/email.gif) top left no-repeat;
	margin: 0 0 0 -5px;
	}
 
	
/* text styles */

p, h2, h3, h4, h5, h6 {
	font-family: Arial, Helvetica, sans-serif;
	font-weight: 100;
	padding: 0 10px;
	}
	
p{
	font-size: 12px;
	margin: 0 0 10px 0;
	}

h1{
	display: block;
	width: 250px;
	height: 29px;
	padding: 0 0 5px 0;
	text-indent: -9999px;
	}
h1.welcome{
	background: url(images/subheads/welcome.gif) no-repeat 12px 0;
	}
	
h1.seeing{
	background: url(images/subheads/seeing.gif) no-repeat 18px 0;
	}
	
h1.event{
	background: url(images/subheads/event.gif) no-repeat 18px 0;
	}
	
h1.seen{
	background: url(images/subheads/seen.gif) no-repeat 18px 0;
	}
	
h1.concerts{
	background: url(images/subheads/concerts.gif) no-repeat 18px 0;
	}
	
h2{
	font-size: 16px;
	margin: 5px 0 5px 0;
	padding: 0 20px;
	font-weight:lighter;
	}

.quarterIn h2{
	padding: 0 10px;
	margin: 0 0 10px 0;
	}

h2.giles{
	color: #0077A9;
	}
	
h2.ralph{
	color: #74A01E;
	}
	
h2.neal{
	color: #DF0000;
	}

h2.graham{
	color: #003399;
	}	

h3 {
	color: #FBCD50;
	font-size: 15px;
	margin: 0 0 5px 0;
	}
	
#sidebar h3{
	padding: 0 20px;
	}
	
#sidebar h3 a{
	color: #FBCD50;
	}
#sidebar h3 a:hover{
	color: #FFF;
	}
	
h4{
	font-size: 13px;
	}
	
ul, li{
	float: left;
	font-size: 12px;
	list-style: none;
	color: #FFF;
	}

#sidebar p {
	padding: 0 20px;
	}
	
ol li {
	list-style-type: decimal;
	clear: both;
	padding: 0;
	}
	
#quarter1 p,
#quarter2 p,
#quarter3 p,
#quarter4 p {
	padding: 0 20px;
	margin: 0 0 20px 0;
	}
	
#quarter1 ul li,
#quarter2 ul li,
#quarter3 ul li {
	padding: 2px 15px;
	clear: both;
	}

.quarterInCD ol{
	padding: 0 35px;
	}

.quarterInCD ol li{
	width: 100%;
	}
	
.quarterIn ul li a{
	display: block;
	text-align: center;
	text-decoration: none;
	}
	
.quarterIn ul li{
	padding: 0 10px;
	}

/* Video ======================================================*/
#content.vid h2 {
	color: #fff;
}
#content.vid ul li {
	margin: 20px 0;
	width: 100%;
}
#content.vid ul li:nth-child(2) {
	margin: 0 0 20px 0;
}
#content.vid ul li span {
	display: block;
	height: 100px;
	width: 170px;
	margin-left: 5px;
}
#content.vid ul li span img {
	border: 1px solid #333;
}


/*ul li.watch a{
	background: url(images/watch_video.gif) no-repeat 0 -25px;
	width: 160px;
	height: 25px;
	}
ul li.watch a:hover{
	background-position: 0 0;
	width: 160px;
	}

ul li.watchqt a{
	background: url(images/watch_qt.gif) no-repeat 0 -25px;
	width: 160px;
	height: 25px;
	}
ul li.watchqt a:hover{
	background-position: 0 0;
	width: 160px;
	}*/
	

	
#content ul, #content ol{
	margin: 5px 0 15px 0;
	}

#content li{
	margin: 2px 0;
	}
	
#inner ul li{
	list-style-type: disc;
	clear: both;
	width: 100%;
	}
	
.head {
	color: #FBCD50;
	font-size: 14px;
	margin: 7px 0 2px 0;
	}

	
/* misc styles */

#logo{
	width:200px;
	height: 40px;
	float: left;
	margin: 40px 0 0 35px;
	background: url(images/home.gif);
	}
	
.yello{
	color: #FBCD50;
	}

.white{
	color: #FFF;
	}

.separator{
	background: #FBCD50;
	height: 1px;
	margin: 0 0 2px 0;
	display: block;
	}

.separatortop {
	height: 1px;
	background: url(images/sepright.gif) no-repeat right top;
}
	
#inner .separator{
	margin: 0 0 7px 0;
	}
	
.quarterIn{
	padding: 150px 0 0 20px;
	}
#content.vid .quarterIn {
	padding: 0;
}

.quarterInCD{
	margin: 20px 0;
	}
	
#cdInfo{
	padding: 20px 0 0 0;
	clear: both;
	color: #fff;
	}
	
.large{
	font-size: large;
	}
	
.clear{
	clear: both;
	width: 100%;
	}

.seenat{
	width: 60%;
	padding: 0 0 10px 0;
	}
	
.indent20{
	padding: 0 0 0 20px;
	}

#confest{
	padding: 0 0 0 30px;
	}
#confest li {
	padding: 0;
	list-style-type:disc;
	list-style-position:outside;
	}
	
.review {
	width: 400px;
	height: 100%;
	overflow: hidden;
	}

#buy-cd {
	width: 100%;
	padding: 0 0 0 10px;
	border-bottom: 1px solid #FBCD50;
	text-indent:-9999px;
	}
.cd-cta {
	width: 330px;
	height: 30px;
	display: block;
	padding: 0 0 10px 0;
	background: url(images/logo/download.jpg) 0 0 no-repeat;
	}
.cd-link {
	height: 30px;
	display: block;
	margin: 0 0 0 10px;
	}
#itunes {
		background: url(images/logo/itunes-logo.jpg) center center no-repeat;
		width: 40px;
	}
#amazon-us {
		background: url(images/logo/amazonUS-logo.jpg) center center no-repeat;
		width: 120px;
	}
#amazon-uk {
		background: url(images/logo/amazonUK-logo.jpg) center center no-repeat;
		width: 100px;
	}
#hmv {
		background: url(images/logo/hmv-logo.jpg) center center no-repeat;
		width: 60px;
	}
#napster {
		background: url(images/logo/napster-logo.jpg) center center no-repeat;
		width: 50px;
	}
	
#social {
	width: 110px;
	margin: 0 auto;
}
#social a.facebook,
#social a.myspace {
	display: block;
	width: 50px;
	height: 50px;
	float: left;
	text-indent: -9999px;
}

#social a.facebook {
	background: url(images/logo/facebook.jpg) center center no-repeat;
	margin-right: 10px;
}

#social a.myspace {
	background: url(images/logo/myspace.jpg) center center no-repeat;
}