@charset "utf-8";

/* 

OK Karaoke 2.0

(c) Teabagstudios.com 2008

*/

/*************
 * 
 * RESET
 */

/*
Copyright (c) 2007, Yahoo! Inc. All rights reserved.
Code licensed under the BSD License:
http://developer.yahoo.net/yui/license.txt
version: 2.4.0
*/
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td{margin:0;padding:0;}
table{border-collapse:collapse;border-spacing:0;}
fieldset,img{border:0;}
address,caption,cite,code,dfn,th,var{font-style:normal;font-weight:normal;}
li{list-style:none;}
caption,th{text-align:left;}
h1,h2,h3,h4,h5,h6{font-size:100%; font-weight:normal;}
q:before,q:after{content:'';}
abbr,acronym {border:0;font-variant:normal;}
/* to preserve line-height and selector appearance */
sup {vertical-align:text-top;}
sub {vertical-align:text-bottom;}
input,textarea,select{font-family:inherit;font-size:inherit;font-weight:inherit;}
/*because legend doesn't inherit in IE */
legend{color:#000;}


/********

Grids 

********/


	body {	
			font-family:Arial, Helvetica, sans-serif; 
			color:#fff;
			background:#0F0F0F url('../images/bodyBg.gif') repeat-x; 
			font-size:11px;
		 }

	#container { position:relative; width:970px; margin:0px auto; }
	
	#header { height:170px; margin-bottom:10px; }
		
	#leftCol { position:relative; width:190px; float:left; margin-left:10px; top:-140px;}
	
	#rightCol { position:relative; width:750px; float:left; margin:0px 10px 0px 10px; min-height:800px; }
		
	
/********
 * Sub Grid
********/	

	#menu { 
			height:380px; 
			background:url('../images/menuBg.png') top center;
			margin-bottom:10px; 
			}
	
	#leftAdSpace { height:627px; background:url('../images/adBg.png') top center no-repeat; padding:15px 0px 0px 15px; overflow:hidden; }
	
	#leftAdSpace object, #leftAdSpace embed { cursor:pointer; }
	
	
	/* For dividing content on pages: */
	
	.halfCol { width:370px; float:left; margin-right:10px; }
	
	.bigLeft { width:390px; float:left; margin:0px 10px 10px 0px; }
	
	.smallRight { width:350px; float:left; }
	
/**** 

Global Styles

*****/
	
	p { margin:10px 0px; line-height:17px;}
	
	img { border:none; }
	
	a span { display:none; }
	
	a { color:#ffffff; text-decoration:none; }
	
	p a { color:#EF087C; }
	
	p a:hover { color:#EF087C; text-decoration:underline; }
	
	ul {}
	
	li {}
	
	em {}
	
	h1 { }
	
	h2 { height:30px; line-height:1em; color:#ffffff; }
	
	h3 { line-height:1em; font-size:18px; }
	
	h4 { line-height:1em; font-size:15px; }
	
	h5 { color:#EF077C; margin:10px 0px;}
	
	hr { display:none; clear:both;}
	
	blockquote {}	
	
	
/******

Common Elements

******/	

	.clear { clear:both !important; }
	
	.hidden { display:none !important; }
	
	.noMarg { margin-right:0px !important; }

	.halfCol p { padding:0px 10px;}

	ul.bullet li { list-style-type:disc; color:white; margin-left:20px; padding:5px 0px;}
	ul.bullet li span { display:block; color:#747474; }
	
	.emph { color:#EF077C; }

	h4.white { margin:10px;}
	
	a#galleryBadge {
		display:block;
		position:absolute;
		top:-40px;
		right:-20px;
		width:134px;
		height:126px;
		background:url('../images/gallery-badge.png');
		z-index:100;
	}
	
	a#facebookBadge {
		display:block;
		position:absolute;
		top:0px;
		right:0px;
		width:236px;
		height:30px;
		background:url('../images/badge-fabook.png');
		z-index:100;
	}
	
	.form_error {
		background-color:#F03290;
		font-weight:bold;
		border:1px solid white;
		padding:25px 5px;
		width:95%;
		color:#fff;
	}
	.form_error ul li {
		list-style-type:circle;
		margin-left:15px; 
	}
	
/****
 * Ryform
 */
	.ryform { padding:10px; }
	
	.ryform legend { display:none; }
	
	.ryform label, .ryform p { display:block; font-size:12px; margin:0px 0px 7px 0px; font-weight:bold; }
	
	.ryform ol li { display:block; clear:both; padding:5px 0px; margin:3px 0px; }
	
	.ryform input, .ryform select, .ryform textarea { border:1px solid #979797; background-color:#000000 !important; width:200px; padding:5px; color:#ffffff !important; } 
	
	.ryform .chkbox input { width: auto; margin: 0 5px 0 0; vertical-align: bottom; }
	
	.ryform .chkbox a { color: #DB0465; font-weight: bold; }
	
	.ryform .chkbox a:hover { color: #fff; text-decoration: underline; }
	
	input[type="hidden"] { display:none !important; }
	
	.ryform select { width:210px; }
	
	.ryform li.radios label { display:inline;  vertical-align:middle; }
	
	.ryform input.rad { width:auto; margin-right:20px; vertical-align:middle; }
	
	.ryform input.btn { width:auto !important; height:auto !important; border:0px !important; background-color:transparent !important; }
	
	
	form#bookingForm {  }
	
	form#bookingForm label { margin:0 23px 9px 0; width:115px; float: left; }
	
	form#bookingForm .date input { width: 105px; }

	form#bookingForm li#bookings_list_packages { margin: 20px 0 0 }

	form#bookingForm li#bookings_list_packages label { width: 100%; }

	form#bookingForm li#bookings_list_packages ul { margin: 10px 0; }

	form#bookingForm li#bookings_list_packages ul li { padding: 8px 0; margin: 0; border-bottom: 1px solid #141414; }

	form#bookingForm li#bookings_list_packages ul li a { background: url(../images/icon_ext.gif) no-repeat 100% 50%; padding: 0 13px 0 0; margin: 0 0 0 3px; }
	
	form#bookingForm input.btn { padding: 0; }
	
	form#bookingForm li#bookings_antispam { background: #080808; border: 1px solid #494949; padding: 17px; margin: 5px 0 10px 0; }

	form#bookingForm li#bookings_antispam label { width: 160px; float: right; font-weight: normal; margin: 0; font-size: 1em; }
	
	form#bookingForm li#bookings_antispam input { margin: 15px 0 0 0; width: 300px; }	
	form#bookingForm li#bookings_antispam img { float: left; margin: 0 0 0 5px; }

/**********
 * Site Header Contents
 */

	/* Ad Banner */
	#topAdspace {
					position:absolute;
					right:0px;
					top:60px;
					width:750px;
				}

	/* fanclub form */
		
		#fanClubDrop { 
						position:absolute;
						right:10px;
						top:0px;
						background:url('../images/fanclubBg.png') center bottom;
						padding:5px 10px 10px 10px;
						min-height:35px;
						width:251px;
						z-index:10;
					}
					
		#fanClubDrop p { margin:2px 0px; }

		#fanClubDrop input {	border:1px solid #979797;
								background-color:#000000;
								display:block;
								color:#ffffff;
								margin:2px;
								padding:2px;
								width:150px;
							 }

		#fanClubDrop a#expandLink {		position:absolute;
										bottom:10px;
										right:10px;
										display:block;
										background-image:url('../images/arrow_down.gif');
										height:18px;
										width:18px;
								  }
		
		#fanClubDrop a#expandLink.down { background-image:url('../images/arrow_up.gif'); }
							 
		#fanClubDrop input.btn { border:0px; width:auto; margin:3px 0px 0px 90px; }

/*********
 * Headers
 */
	h1#logo { display:none;}
	
	h2.large strong, h2.half strong, h2.med strong, h2.small strong {display:block; padding:8px 0px 0px 5px; font-size:19px; }
	strong.sIFR-replaced { padding:3px 0px 0px 5px !important; }
	h2.large span.icon,
	h2.half span.icon,
	h2.med span.icon,
	h2.small span.icon {	display:block; 
							width:55px; 
							height:60px;
							position:absolute;
							top:-5px; right:5px;
							background-repeat:no-repeat;
							background-position:top right;
							z-index:10; 
							 }
	
	h2.large { width:750px; background:url('../images/headers/largeBg.png') no-repeat; position:relative; clear:both; }
	
	h2.med {width:390px; background:url('../images/headers/medBg.png') no-repeat; position:relative;}
	
	h2.small {width:350px; background:url('../images/headers/smallBg.png') no-repeat; position:relative;}
 
 	h2.half { width:370px; background:url('../images/headers/halfBg.png') no-repeat; position:relative;}
/* icons */ 
	
	span.calendar { background-image:url('../images/headers/icons/calendar.png'); }
	span.songList { background-image:url('../images/headers/icons/songList.png'); }
	span.mobile { background-image:url('../images/headers/icons/mobile.png'); }
	span.venue { background-image:url('../images/headers/icons/magnify.png'); }
	span.news { background-image:url('../images/headers/icons/news.png'); }
	
/*******
 * Menu
 */

	#backToHome { display:block; height:150px; position:absolute; width:189px; background-image:none !important;  }

	#menu ul { left:20px; top:170px; margin:0px auto; position:relative; text-align:left; width:100px; }
	#menu li { display:inline; }
	
	#menu a { 	font-size:13px;
				display:block;
				font-weight:bold;
				width:70px;
				height:11px;
				margin:10px 0px;
				background-image:url('../images/menu_text_sprite.gif'); 
				position:relative;
			}
	#menu a span { display:none; position:absolute; left:-20px; height:20px; width:20px; background-color:#cccccc; top:-3px; }
	
	#menu a em { display:none; }
	
	#menu a#m-home { background-position:left -11px; }
	#menu a#m-home:hover { background-position:right -11px; }	
	
	#menu a#m-events { background-position:left -33px; }
	#menu a#m-events:hover { background-position:right -33px; }
	
	#menu a#m-bookings  {background-position:left -56px; }
	#menu a#m-bookings:hover  {background-position:right -56px; }
	
	#menu a#m-menus { background-position:left -79px; }
	#menu a#m-menus:hover { background-position:right -79px; }
	
	#menu a#m-packages { background-position:left -102px; }
	#menu a#m-packages:hover { background-position:right -102px; }
	
	#menu a#m-songlist {background-position:left -125px; }
	#menu a#m-songlist:hover {background-position:right -125px; }
	
	#menu a#m-gallery { background-position:left -148px; }
	#menu a#m-gallery:hover { background-position:right -148px; }
	
	#menu a#m-contact { background-position:left -171px; }
	#menu a#m-contact:hover { background-position:right -171px; }

	#menu a:hover { color:#EF077C;}


/********
 * Whats On Feature
 */

	#whatsOn { 
				background-image:url('../images/whatsOnBg.png'); 
				width:750px; 
				height:200px; 
				overflow:hidden; 
				margin:10px 0px;
				position:relative;
			}
			
	
	#whatsOn a:hover dl { background-color:#3C0D25; cursor:pointer; }
	
	#woWrap { width:340px; float:right; }
	
	#whatsOn dl { float:left; margin:13px 0px 0px 0px; width:320px; }
		
	#whatsOn a:hover dt.image { display:block; 	z-index:100;}
	
	#whatsOn a dt.image { position:absolute; left:1px; top:1px; }
	
	#whatsOn dt.image img { height:198px; }
		
	#whatsOn dt.date { 
						background:url('../images/dateBg.png');
						width:43px; 
						height:39px; 
						padding-top:3px; 
						float:left; 
						margin-right:10px; 
						font-size:14px; 
						text-align:center; 
						font-weight:bold;
					}
	
	#whatsOn dt.date span { display:block; width:40px; }
	
	#whatsOn dt.title { font-size:14px; font-weight:bold; padding-top:4px; margin-top:0px;} 
	
	a#moreEvents { 
					background-image:url('../images/graphic_text/viewMoreEvents.png'); 
					display:block; 
					width:177px; 
					height:18px; 
					margin:10px 10px 0px 0px;
					float:right;
				}	
	a#moreEvents:hover { background-position:bottom; }
	
/*********
 * Quick Links
 */
	
	#footer { clear:both; position:absolute; bottom:-155px;}
	
	ul#quickLinks { height:118px; }
	
	ul#quickLinks li { display:inline; }
	
	ul#quickLinks a {
						display:block; 
						float:left; 
						margin-right:40px; 
						height:118px; 
						width:118px;  
						background-image:url('../images/quickLinkSprite.png');
					}
		
		a.qlink1 {background-position:0px 0px;}
		a.qlink1:hover {background-position:0px bottom;}
		
		a.qlink2 {background-position:-158px 0px;}
		a.qlink2:hover {background-position:-158px bottom;}
		
		a.qlink3 { background-position:-316px 0px;}
		a.qlink3:hover {background-position:-316px bottom;}

		a.qlink4 { background-position:-474px 0px;}
		a.qlink4:hover {background-position:-474px bottom;}
				
		a.qlink5 { background-position:-632px 0px;}
		a.qlink5:hover {background-position:-632px bottom;}		


/*********
 * Specific Pages
 * */


/* Home page */
	
	#welcomeText { width:370px; height:320px; background-image:url('../images/welcomeBg.png'); padding:10px;}
	#welcomeText p { line-height:20px; margin-top:10px;}
	#welcomeText h3 { font-size:44px; margin-bottom:8px; color:#FFF;} 
	#welcomeText h4 { font-size:20px; font-weight:bold; margin-bottom:12px; color:#EF086F;}
	
	
	#ourVenues, #createPlaylist, #bookABooth { position:relative; }
	
	#ourVenues { width:750px; height:161px; background-image:url('../images/venueBanner.jpg'); margin:10px 0px;}
	#createPlaylist {background-image:url('../images/playlistBanner.gif'); width:350px; height:125px; margin:10px 0px;}
	#bookABooth { background-image:url('../images/bookNowBanner.jpg'); width:350px; height:125px; margin:10px 0px; }
	
	#ourVenues a, #createPlaylist a, #bookABooth a { position:absolute; bottom:10px; right:10px; display:block;}

	#ourVenues a { width:270px; height:18px; background-image:url('../images/graphic_text/lookAtVenue.png'); }
	#ourVenues a:hover { background-position:bottom; }
	
	#createPlaylist a { width:205px; height:18px; background-image:url('../images/graphic_text/createYourPlayList.png'); bottom:0px; }
	#createPlaylist a:hover { background-position:bottom; }
	
	#bookABooth a { width:121px; height:18px; background-image:url('../images/graphic_text/bookNow.png'); }
	#bookABooth a:hover { background-position:bottom; }
	
	
/* Events */	
 
	dt.title {color:#EF077C; margin-top:10px; font-size:13px; text-transform:uppercase; margin-bottom:5px;}
	dd.date, dd.time, dt.title{ font-weight:bold; }
	
	dl.clubNight, dl#nextEvent { padding:10px; clear:both; height:65px; }
	dl.clubNight dt.image { float:left; margin-right:10px;}
	dl.clubNight dt.title { margin-top:0px;}
	dl.clubNight dt.title a {color:#DB0465; }
	dl.clubNight dt.title a:hover { color:#ffffff; }
	dl#nextEvent dt.image { position:relative; left:0px; overflow:hidden;}
	
	table#upcomingEvents { display:block; margin:10px; line-height:20px; }
	table#upcomingEvents a { color:#DB0465; }
	table#upcomingEvents a:hover { color:#ffffff; }

	table#upcomingEvents th { font-weight:bold; }
	table#upcomingEvents th.eventTitle { width:75%; }
	

	table#upcomingEvents tr:hover * { text-decoration:underline;} 
	
	
/* Locations */

	div#location-map { width:369px; height:424px; background:url('../images/locationMap.gif') no-repeat center; text-indent:-9999px; }
	
	ul#locationLinks { margin:10px; }
	
	ul#locationLinks a { display:block; height:14px; background-image:url('../images/graphic_text/locationTexts.png'); margin-bottom:10px; }
	
	a#loc-leeds {background-position:0px 0px; width:45px;}
	a#loc-leeds:hover { background-position:0px bottom;}

	a#loc-newcastle { background-position:-50px 0px; width:95px;}
	a#loc-newcastle:hover {background-position:-49px bottom;}

	a#loc-sheffield { background-position:-147px 0px; width:78px; }
	a#loc-sheffield:hover { background-position:-147px bottom; }
	
	.smallRight h4 { margin:10px 0px; }
	
	
/* Packages */

	dl.package { margin-top:10px; padding-top:10px; clear:both; }
	.halfCol dl.package { clear:both; height:75px; width:360px; }
	.halfCol dl.package:hover { background:url('../images/package_hover.gif') no-repeat;}
	dl.package dt.image { float:left; margin-right:10px; margin-left:5px; }
	dl.package dt.name { font-size:20px; color:#E10079; font-weight:bold; text-transform:capitalize; }
	dl.package a { color:#E10079; }
	dl.package a:hover { color:#FFFFFF; }
	
	.package-footer {
		border-top:1px dashed #E10079;
		float:left;
		margin-left:115px;
		padding-top:5px;
	}
	
/* Booking Form */


	p.emph { font-size:13px; color:#EF077C; font-weight:bold; }
	
	a#calenderHelper { 	display:block; 
						width:20px;
						height:20px;
						background:url('../images/calendarIcon.gif') center no-repeat;
						position:absolute;
						right:110px;
						bottom:20px;
					  }

	#subscriber {
		color:#858E87;
	}			
			  
	form#bookingForm #subscriber input {
		float:left;
		margin:0px 10px 20px 0px;
		width:auto;
		
	}
	
	form#bookingForm #subscriber label {
		float:none;
		width:auto;
	}
/* Press Page */
	
	dl.pressArticle { width:220px; float:left; margin:10px;  line-height:17px;  }
	
	dl.pressArticle dt.preview img{ border:1px solid #979797; margin-bottom:10px; }
	
	dl.pressArticle dt.headline, dl.pressArticle dd.date { font-weight:bold; }
	
	dl.pressArticle a { color:#EF077C; }
	
	dl.pressArticle a:hover { color:white; } 
	
/* Links Page */

	dl.link { margin:10px; line-height:17px;}
	dl.link dt { font-weight:bold; color:#EF077C; }
	dl.link a { color:#747474; }
	dl.link a:hover { color:#EF077C; }
	
/* Contact Page */

	ul.address { padding:10px; }
	
	.company { padding: 10px; margin: 0 0 20px 0; }

	p.opening { padding: 10px; line-height: 130%; }
	
/******
 * Song list
 */

#songResultsWrap, #songPlaylistWrap { background:url('../images/playlistBG.gif') no-repeat; height:409px;  }

#songResultsWrap div.wrapper, #songPlaylistWrap div.wrapper { width:360px;}

#songPlaylistWrap div.wrapper { height:300px; width:366px; overflow-y:auto; overflow-x:visible; }

#songPlaylist, #songResults { width:340px; }

#songResult { height:330px; }

#songPlaylist, #songResult, .playKey { margin:10px 0px 10px 10px;  }

.playKey { height:16px; }

#songSearchWrap { background:url('../images/songSearchWrap.gif') no-repeat; height:39px; width:465px; }

#songSearchWrap label { 
	font-size:15px;
	font-weight:bold;
	display:block; 
	float:left; 
	background:url('../images/graphic_text/songSearch.gif') no-repeat; 
	width:200px; 
	height:22px; 
	text-indent:-9999px; 
	margin:12px 0px 5px 7px;
}

input#SongSearch, input#nameIt { 
	background:url('../images/songSearchInpt.gif') no-repeat;
	border:0px; 
	width:240px;
	height:18px; 
	color:#EF077C; 
	font-size:12px; 
	font-weight:bold; 
	padding:5px; 
	margin:6px 4px 5px 4px;
}

#songResult li, #songPlaylist li { 
	padding:5px 0px; 
	border-bottom:1px dotted #6B0337; 
	cursor:move; 
	clear:both; 
	display:block; 
	height:14px; 
	width:330px;
}

.trackWrapper { z-index:100;}
.trackWrapper span { display:block; float:left; }

li.key { 
	display:block; 
	float:left; 
	clear:none !important; 
	border:0px !important; 
	width:110px; 
	font-size:14px; 
	color:#969696; 
	font-weight:bold;
}

li.key.title, .trackName { width:160px; height:15px; overflow:hidden;  position:relative;}
li.key.artist, .trackArtist { width:120px; height:15px; overflow:hidden; position:relative;}
li.key.add, .trackAdd { width:30px; position:relative;}

a.mvUp, a.mvDown { width:13px; height:11px; display:block; float:left; background:url('../images/arrow_sprite.gif') no-repeat; margin-right:5px;}
a.mvUp span, a.mvDown span {display:none;}
a.mvUp { background-position:left top; }
a.mvUp:hover { background-position:left bottom; }

a.mvDown { background-position:right top; }
a.mvDown:hover { background-position:right bottom; }



.songlisterror li { color:#EF087C; font-weight:bold; padding:3px 0px;}


#link_songlist_paginate  { bottom:10px; width:90%; padding:0px 20px; }

#sng_more:hover, #sng_back:hover { color:#ffffff; }

#sng_more:hover { background:transparent url(../images/arrows.gif) no-repeat scroll right -76px; }
#sng_back:hover { background:transparent url(../images/arrows.gif) no-repeat scroll left -23px; }

#sng_more { 
	font-size:12px;
	color:#EF087C;
	padding-right:20px;
	font-weight:bold;
	background:transparent url(../images/arrows.gif) no-repeat scroll right -50px;
	display:block;
	float:right; }

#sng_back { 
	font-size:12px;
	color:#EF087C; 
	padding-left:20px; 
	font-weight:bold;
	background:transparent url(../images/arrows.gif) no-repeat scroll left 4px;
	display:block;
	float:left; 
	}

#songSpinner { 
	background-color: black; 
	position: absolute; 
	z-index: 1000; 
	text-align: center; 
	vertical-align: middle;
	filter:alpha(opacity=50);
	-moz-opacity:.50;
	opacity:.50;
 }

.song_added { color: gray; }

#linkPrintPlaylist, #emailfriend { font-size:13px; font-weight:bold; padding:3px;}

/*****
 * Jobs Page
 */


ul.jobdetails { margin-bottom:20px; }
ul.jobdetails li { padding:5px 0px; margin-left:35px; list-style-type:circle;}


/*
 * Terms
 */
#rightCol.terms h3 { text-transform:uppercase; text-decoration:underline; font-weight:bold; margin:10px 0px;}
#rightCol.terms h4 { font-weight:bold; text-decoration:underline; margin:10px 0px;}
#rightCol.terms ul { margin-left:10px; }
#rightCol.terms li { padding:5px 0px; list-style-type:disc; }

/* Footer */

	#footer p, #footer a { color:#333333; font-size:10px; text-transform:uppercase; text-align:right; }
	#footer p { padding-right:70px;}
	#footer a:hover { color:#EF077C; }
	a#teabag { display:block; width:58px; height:18px; background:url('../images/teabag.gif') top left; position:absolute; right:0px; bottom:10px;}
	a#teabag:hover { background-position:bottom;}