/*
Project: The Sea Will Decide
Stylesheet author: Lee Tucknott
Version: 1.0
Date: 19 July 2009
*/


/* reset styles */

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,p,blockquote,th,td {  
    margin: 0;
    padding: 0
} 
table { 
    border-collapse: collapse; 
    border-spacing: 0
} 
fieldset,img, a img {  
   border: 0
} 
address,caption,cite,th { 
   font-style: normal; 
   font-weight: normal 
}

/* global page element styles */

body {
	font-family: Georgia;
	text-align: center;
	font-size: 90%; /* 62.5% */
	line-height: 1.5em;
	position: relative;
	height: 100%;
	color: white;
	}

#contentWrapper {
	background: #000 url(../images/tswd-main-bg.jpg) center top no-repeat;
	width: 100%;
	overflow: hidden;
	min-width: 922px;
}

#about	#contentWrapper {
		background: #000 url(../images/tswd-main-bg-alt.jpg) center top no-repeat;
		width: 100%;
		overflow: hidden;
		min-width: 922px;
	}

a {
	text-decoration: none;
	color: #65a9ed;
	font-weight: normal;
	outline: none;
}

a:hover {
	text-decoration: underline;
	color: #8cc2f8;
	outline: none;
}

h1 {
	font-family: Georgia, serif;
	font-weight: normal;
	font-size: 2em;
	line-height: 1.6em;
	margin: -10px 0 15px 0;
	padding: 0 0 15px 0;
	color: white;
	display: block;
	background: url(../images/light-grey-line.gif) repeat-x bottom		
}

	h1 span, h2 span, h3 span {
		color: #e49415
	}


h2 {
	font-family: Georgia, serif;
	font-weight: normal;
	/*font-size: 2em;
	line-height: 1.3em;*/
	margin: 0 0 0 0;
	padding: 0;
	color: white
}

	#contentLeft h2 {
		font-family: Georgia, serif;
		font-weight: normal;
		/*font-size: 2em;
		line-height: 1.3em;*/
		margin: 0 0 15px 0;
		padding: 0 0 15px 0;
		background: url(../images/light-grey-line.gif) repeat-x bottom
	}
	
h3 {
	font-family: Georgia, serif;
	font-weight: normal;
	/*font-size: 1.6em;
	line-height: 1.5em;*/
	margin: 15px 0 0 0;
	padding: 0;

	color: white
}

h4 {
	font-family: Georgia, serif;
	font-weight: normal;
	font-size: 2em;
	/*line-height: 1.3em;*/
	margin: 0 0 15px 0;
	padding: 0 0 15px 0;
	color:  #e49415;
	display: block;
	background: url(../images/light-grey-line.gif) repeat-x bottom	
}

p {
	/*font-size: 1.3em;*/
	margin: 5px 0 0 0;
	padding: 0;
	color: #ccc
}

#contentLeft p {
	/*font-size: 1.3em;*/
	margin: 10px 0 0 0;
	padding: 0;
	color: #fff
}

/* site structure */


#wrapper {
	clear: both;
	margin: 0 auto;
	width: 922px;
	min-width: 922px
}

#header {
	clear: both;
	float: left;
	margin: 0 auto;
	width: 922px;
	height: 550px	
}

	#header #logo {
		clear: both;
		display: block;
		margin: 0 0 0 466px;
		width: 451px;
		height: 332px
	}
	
	#header #promos {
		clear: both;
		display: block;
		float: left;
		width: 922px;		
		height: 80px;
	}
	
	#header #promos h3#bookings {
		display: block;
		float: left;
		text-align: left;
		margin: 0 0 0 99px;
		width: 261px;
		height: 80px
		
	}
	
		#header #promos h3#bookings a {
		display: block;
		float: left;
		width: 261px;
		height: 80px;
		text-indent: -100000px;
		background: url(../images/like-what-you-hear-txt.gif) no-repeat top left
	}
	
	#header #promos h3#bookings a:hover {
		display: block;
		float: left;
		width: 261px;
		height: 80px;
		background-position: 0 -80px
	}
	
	#header #promos h3#sayHi {
		display: block;
		float: left;
		text-align: left;
		margin: 0 0 0 201px;
		width: 261px;
		height: 80px
	}
	
		#header #promos h3#sayHi a {
		display: block;
		float: left;
		width: 261px;
		height: 80px;
		text-indent: -100000px;
		background: url(../images/if-you-wanna-say-hi-txt.gif) no-repeat top left;
	}
	
	#header #promos h3#sayHi a:hover {
		display: block;
		float: left;
		width: 261px;
		height: 80px;
		background-position: 0 -80px
	}

#content {
	clear: both;
	float: left;
	margin: 0 auto;
	width: 922px;
	height: auto;
	text-align: left
}

	#content #contentLeft {
		clear: both;
		float: left;
		display: block;
		line-height: 2.2em;
		margin: 30px 30px 0 0;
		width: 608px;
		text-align: left
	}
	
	#content #contentRight {
		float: left;
		display: block;
		margin: 33px 0 0 0;
		width: 274px;
		text-align: left
	}
	
#contentBottom {
	clear: both;
	float: left;
	margin: 40px 0 0 0;
	width: 922px;
	height: auto;
	text-align: left
}

	#contentBottom #leftColumn {
		clear: both;
		float: left;
		display: block;
		margin: 0;
		width: 289px;
		text-align: left;
	}
	
	#contentBottom #middleColumn {
		float: left;
		display: block;
		margin: 0 0 0 30px;
		width: 289px;
		text-align: left;
	}
	
	#contentBottom #rightColumn {
		float: left;
		display: block;
		margin: 0 0 0 30px;
		width: 284px;
		text-align: left;
	}
	
#footer {
	clear: both;
	float: left;
	margin: 150px 0 20px 0;
	padding: 20px 0 0 0;
	width: 922px;
	height: auto;
	font-size: 0.8em;
	text-align: left;
	background: url(../images/light-grey-line.gif) repeat-x top
}

	#footer #footerLeftColumn {
		clear: both;
		float: left;
		display: block;
		margin: 0;
		width: 289px;
		text-align: left;
	}
	
	#footer #footerMiddleColumn {
		float: left;
		display: block;
		margin: 0 0 0 30px;
		width: 289px;
		text-align: left;
	}
	
	#footer #footerRightColumn {
		float: left;
		display: block;
		margin: 0 0 0 30px;
		width: 284px;
		text-align: left;
	}

/* ---------- menu ---------- */

#header #menu {
	float: left;
	clear: both;
	margin: 54px 0 0 -5px;
	height: 85px;
	width: 922px;
}

#header #menu ul {
	text-indent: -10000px;
}

#header #menu ul li {
	display: inline;
	float: left;
}

/* home */

#header #menu ul li#home {
	display: block;
	width: 128px;
	height: 84px;
}
	
		#header #menu ul li#home a {
			display: block;
			width: 128px;
			height: 84px;
			background: url(../images/home-nav.gif) 0 0 no-repeat;
		}
		
		#header #menu ul li#home a:hover {
			display: block;
			width: 128px;
			height: 84px;
			background-position: 0 -84px
		}
		
		#header #menu ul li#home a span {
			text-indent: -10000px
		}
		
		/* home if on */
		
		#header #menu ul li#homeon {
			display: block;
			width: 128px;
			height: 84px
		}
		
		#header #menu ul li#homeon a {
			display: block;
			width: 128px;
			height: 84px;
			background: url(../images/home-nav.gif) 0 -168px no-repeat;
		}
		
		#header #menu ul li#homeon a:hover {
			display: block;
			width: 128px;
			height: 84px;
			background-position: 0 0
		}
		
		#header #menu ul li#homeon a span {
			text-indent: -10000px
		}
		
/* news */	

#header #menu ul li#news {
	display: block;
	width: 115px;
	height: 84px
}
	
		#header #menu ul li#news a {
			display: block;
			width: 115px;
			height: 84px;
			background: url(../images/news-nav.gif) 0 0 no-repeat
		}
		
		#header #menu ul li#news a:hover {
			display: block;
			width: 115px;
			height: 84px;
			background-position: 0 -84px
		}
		
		#header #menu ul li#news a span {
			text-indent: -10000px
		}
		
		/* news if on */
		
		#header #menu ul li#newson {
			display: block;
			width: 115px;
			height: 84px
		}
		
		#header #menu ul li#newson a {
			display: block;
			width: 115px;
			height: 84px;
			background: url(../images/news-nav.gif) 0 -168px no-repeat
		}
		
		#header #menu ul li#newson a:hover {
			display: block;
			width: 128px;
			height: 84px;
			background-position: 0 0
		}
		
		#header #menu ul li#newson a span {
			text-indent: -10000px
		}
		
/* about */


#header #menu ul li#about {
	display: block;
	width: 115px;
	height: 84px
}
	
		#header #menu ul li#about a {
			display: block;
			width: 115px;
			height: 84px;
			background: url(../images/about-nav.gif) 0 0 no-repeat
		}
		
		#header #menu ul li#about a:hover {
			display: block;
			width: 115px;
			height: 84px;
			background-position: 0 -84px
		}
		
		#header #menu ul li#about a span {
			text-indent: -10000px
		}
		
		/* about if on */
		
		#header #menu ul li#abouton {
			display: block;
			width: 115px;
			height: 84px
		}
		
		#header #menu ul li#abouton a {
			display: block;
			width: 115px;
			height: 84px;
			background: url(../images/about-nav.gif) 0 -168px no-repeat
		}
		
		#header #menu ul li#abouton a:hover {
			display: block;
			width: 128px;
			height: 84px;
			background-position: 0 0
		}
		
		#header #menu ul li#abouton a span {
			text-indent: -10000px
		}

/* music */	

#header #menu ul li#music {
	display: block;
	width: 115px;
	height: 84px
}
	
		#header #menu ul li#music a {
			display: block;
			width: 115px;
			height: 84px;
			background: url(../images/music-nav.gif) 0 0 no-repeat
		}
		
		#header #menu ul li#music a:hover {
			display: block;
			width: 115px;
			height: 84px;
			background-position: 0 -84px
		}
		
		#header #menu ul li#music a span {
			text-indent: -10000px
		}
		
		/* music if on */
		
		#header #menu ul li#musicon {
			display: block;
			width: 115px;
			height: 84px
		}
		
		#header #menu ul li#musicon a {
			display: block;
			width: 115px;
			height: 84px;
			background: url(../images/music-nav.gif) 0 -168px no-repeat
		}
		
		#header #menu ul li#musicon a:hover {
			display: block;
			width: 128px;
			height: 84px;
			background-position: 0 0
		}
		
		#header #menu ul li#musicon a span {
			text-indent: -10000px
		}
		
/* videos */

#header #menu ul li#videos {
	display: block;
	width: 115px;
	height: 84px
}
	
		#header #menu ul li#videos a {
			display: block;
			width: 115px;
			height: 84px;
			background: url(../images/videos-nav.gif) 0 0 no-repeat
		}
		
		#header #menu ul li#videos a:hover {
			display: block;
			width: 115px;
			height: 84px;
			background-position: 0 -84px
		}
		
		#header #menu ul li#videos a span {
			text-indent: -10000px
		}
		
		/* videos if on */
		
		#header #menu ul li#videoson {
			display: block;
			width: 115px;
			height: 84px
		}
		
		#header #menu ul li#videoson a {
			display: block;
			width: 115px;
			height: 84px;
			background: url(../images/videos-nav.gif) 0 -168px no-repeat
		}
		
		#header #menu ul li#videoson a:hover {
			display: block;
			width: 128px;
			height: 84px;
			background-position: 0 0
		}
		
		#header #menu ul li#videoson a span {
			text-indent: -10000px
		}

/* shows */

#header #menu ul li#videos {
	display: block;
	width: 115px;
	height: 84px
}
	
		#header #menu ul li#shows a {
			display: block;
			width: 115px;
			height: 84px;
			background: url(../images/shows-nav.gif) 0 0 no-repeat
		}
		
		#header #menu ul li#shows a:hover {
			display: block;
			width: 115px;
			height: 84px;
			background-position: 0 -84px
		}
		
		#header #menu ul li#shows a span {
			text-indent: -10000px
		}
		
		/* shows if on */
		
		#header #menu ul li#showson {
			display: block;
			width: 115px;
			height: 84px
		}
		
		#header #menu ul li#showson a {
			display: block;
			width: 115px;
			height: 84px;
			background: url(../images/shows-nav.gif) 0 -168px no-repeat
		}
		
		#header #menu ul li#showson a:hover {
			display: block;
			width: 128px;
			height: 84px;
			background-position: 0 0
		}
		
		#header #menu ul li#showson a span {
			text-indent: -10000px
		}
		
/* contact */

#header #menu ul li#contact {
	display: block;
	width: 115px;
	height: 84px
}
	
		#header #menu ul li#contact a {
			display: block;
			width: 115px;
			height: 84px;
			background: url(../images/contact-nav.gif) 0 0 no-repeat
		}
		
		#header #menu ul li#contact a:hover {
			display: block;
			width: 115px;
			height: 84px;
			background-position: 0 -84px
		}
		
		#header #menu ul li#contact a span {
			text-indent: -10000px
		}
		
		/* contact if on */
		
		#header #menu ul li#contacton {
			display: block;
			width: 115px;
			height: 84px
		}
		
		#header #menu ul li#contacton a {
			display: block;
			width: 115px;
			height: 84px;
			background: url(../images/contact-nav.gif) 0 -168px no-repeat
		}
		
		#header #menu ul li#contacton a:hover {
			display: block;
			width: 128px;
			height: 84px;
			background-position: 0 0
		}
		
		#header #menu ul li#contacton a span {
			text-indent: -10000px
		}

/* page content */

.scrollTop {
	display: block;
	clear: both;
	width: 282px;
	height: 48px;
	margin: 20px 0 20px 0;
	background: url(../images/scroll-top.png) no-repeat;
}

.scrollBottom {
	display: block;
	clear: both;
	width: 282px;
	height: 48px;
	margin: 20px 0 0 0;
	background: url(../images/scroll-bottom.png) no-repeat;
}

#contentLeft .youtubeVid {
	display: block;
	float: left;
	clear: both;
	margin: 0 0 20px 0
}

.pdf {
	display: block;
	float: left;
	margin: -3px 15px 0 0 
}

.pdfSide {
	display: block;
	float: left;
	margin: 3px 15px 10px 0 
}

#twitter_div p {
	margin: 0 0 15px 0
}

h4#ilikeTitle {
	display: block;
	clear: both;
	background: url(../images/ilike-title.png) no-repeat;
	width: 258px;
	height: 91px;
	line-height: 0px;
	margin: 0 0 10px 0;
	padding: 0;
	text-indent: -10000px
}

h4#upcomingTitle {
	display: block;
	clear: both;
	background: url(../images/upcoming-title.png) no-repeat;
	width: 256px;
	height: 91px;
	line-height: 0px;
	margin: 0 0 10px 0;
	padding: 0;
	text-indent: -10000px
}

h4#alsoOnTitle {
	display: block;
	clear: both;
	background: url(../images/also-on-title.png) no-repeat;
	width: 207px;
	height: 91px;
	line-height: 0px;
	margin: 0 0 10px 0;
	padding: 0;
	text-indent: -10000px
}

.line {
	display: block;
	height: 2px;
	line-height: 0px;
	background: url(../images/light-grey-line.gif) repeat-x bottom
}

/* footer */

#footer #footerLeftColumn a#issrLogo {
	display: block;
	width: 250px;
	height: 49px;
	margin: 10px 0 0 0;
	background: url(../images/iss-logo.png) 0 0 no-repeat;
	text-indent: -10000px;
}

	#footer #footerLeftColumn a:hover#issrLogo {
		display: block;
		width: 250px;
		height: 49px;
		background-position: 0 -49px
	}

/* ---------- other site logos ---------- */

/* MySpace */

#rightColumn ul li#myspace {
	display: block;
	float: left;
	margin: 0 0 15px 30px;
	width: 230px;
	height: 47px;
	background: url(../images/myspace-over.gif) no-repeat;
}

		#rightColumn ul li#myspace a {
			display: block;
			width: 230px;
			height: 47px;
		}
		
		#rightColumn ul li#myspace a:hover {
			display: block;
			width: 230px;
			height: 47px;
			background: url(../images/myspace-off.gif) no-repeat;
		}
		
		#rightColumn ul li#myspace a span {
			display: none;
		}
		

/* facebook */

#rightColumn ul li#facebook {
	display: block;
	float: left;
	margin: 0 0 15px 30px;
	width: 230px;
	height: 47px;
	background: url(../images/facebook-over.gif) no-repeat;
}

		#rightColumn ul li#facebook a {
			display: block;
			width: 230px;
			height: 47px;
		}
		
		#rightColumn ul li#facebook a:hover {
			display: block;
			width: 230px;
			height: 47px;
			background: url(../images/facebook-off.gif) no-repeat;
		}
		
		#rightColumn ul li#facebook a span {
			display: none;
		}
		
/* youtube */

#rightColumn ul li#youtube {
	display: block;
	float: left;
	margin: 0 0 15px 30px;
	width: 230px;
	height: 47px;
	background: url(../images/youtube-over.gif) no-repeat;
}

		#rightColumn ul li#youtube a {
			display: block;
			width: 230px;
			height: 47px;
		}
		
		#rightColumn ul li#youtube a:hover {
			display: block;
			width: 230px;
			height: 47px;
			background: url(../images/youtube-off.gif) no-repeat;
		}
		
		#rightColumn ul li#youtube a span {
			display: none;
		}
		
/* twitter */

#rightColumn ul li#twitter {
	display: block;
	float: left;
	margin: 0 0 15px 30px;
	width: 230px;
	height: 47px;
	background: url(../images/twitter-off.gif) no-repeat;
}

		#rightColumn ul li#twitter a {
			display: block;
			width: 230px;
			height: 47px;
		}
		
		#rightColumn ul li#twitter a:hover {
			display: block;
			width: 230px;
			height: 47px;
			background: url(../images/twitter-over.gif) no-repeat;
		}
		
		#rightColumn ul li#twitter a span {
			display: none;
		}

/* ---------- Twitter Styles ---------- */

#contentRight h2.sidebar-title {
	font-family: Georgia, serif;
	font-weight: normal;
	font-size: 2em;
	margin: 0 0 15px 0;
	padding: 0 0 15px 0;
	color: #e49415;
	background: url(../images/light-grey-line.gif) repeat-x bottom
}

#contentRight ul#twitter_update_list {
	list-style-type: none;
	/*font-size: 1.6em;*/
	font-style: italic
}

#contentRight ul#twitter_update_list li:first-child {
	list-style-type: none;
	/*font-size: 1.6em;*/
	font-style: italic
}

#contentRight ul#twitter_update_list li {
	margin: 5px 0 5px 0
}

#contentRight a#twitter-link {
	display: block;
	font-family: Georgia, serif;
	font-weight: normal;
	font-style: italic;
	/*font-size: 1.6em;*/
	margin: 10px 0 0 0
}

/* ---------- Upcoming Styles ---------- */

.upcoming_badge {
	/*font-size: 1.6em*/
}

.upb_events li:first-child {
	margin: 0 0 15px 0
}

.upb_more {
	margin: 15px 0 0 0;
	/*font-size: 0.8em;*/
	font-style: italic
}

.upb_date {
	display: block;
	font-size: 1.3em;
	margin: 15px 0 0 0
}

.upcomingText {
	margin: 15px 0 0 0
}

/* ---------- iLike Styles ---------- */

.ilike_content {
	display: block;
	list-style-type: none;
	margin: 20px 0 0 0;
	/*font-size: 1.6em*/
}
	
#ilikeLink {
	/*font-size: 1.3em;*/
	font-style: italic;
}