/*Perfect 5th CSS designed by Dean Bates*/

/* @override 
	http://www.theperfect5th.co.uk/apptest/css/home.css
	http://www.theperfect5th.co.uk/apptest/css/baseline.css
	http://www.theperfect5th.co.uk/theperfect5th/apptest/css/home.css
*/

@import url(baseline.css);
/**
 * Table of Contents.
 * 1) General Elements
 * 2) Utility Classes
 * 3) Main Layout Structure
 * 4) Widgets and Plugins
 * 5) Page Specific Styles
 * ========================
 * CSS Designer: Dean Bates
 * Contact: deanbatesFreelance@mac.com 
 * Copyright 2008. All rights reserved.
 * Site: The Perfect 5th
 * ========================
 * Momentum framework used:
 * Author: Ethan Gardner - http://www.ethanandjamie.com/
 * Title: Momentum CSS - v1.0
 * License: Creative Commons Attribution 3.0
 * ========================
*/

/**
 * 1) General Elements 
 */
	body {
		color:#87673A;
		font: 0.8em arial, helvetica, sans-serif; /* sets font to 12px */
		text-align:center;
		background: black url(../images/bg-venue.gif) top left repeat;
	}
	
	h1 {
		text-align: right;
		color: #ae7b36;
	}
	h1, h2, h3, h4 {
		padding: 20px 30px;
		font-weight: normal;
		font-size: 200%;
	}
	h2, h3, h4 {
		padding: 10px 0;
		font-size: 165%;
		color:  black;
		margin: 0;
	}
	h3 {font-size: 130%;}
	h4, h5, h6 {font-size: 120%;}
	
	ul, ol, dl, p {margin-bottom:1em;}
	p, li { line-height:  1.4em;}
	
	a {color: black;}
	small a {color: black !important;}
	a:hover {text-decoration: none;}
	a.button, input.button {
		background: black url(../images/button-bg.gif) repeat-x;
		border: 1px solid #404040;
		padding: 4px 8px;
		color: white;
		font-size: 95%;
		text-decoration: none;
	}
	a.button:hover, input.button:hover {
		text-decoration: underline;
		background-image: url(../images/button-bg-rollover.gif);
	}
	a img {
		vertical-align: middle;
		border: none;
		padding-right: 5px;
	}
	
	abbr {
		border-bottom:1px dotted #ccc;
		cursor:help;
		letter-spacing:1px;
	}
	
	strong{font-weight:700;}
	em {font-style:italic;}
	
	ul li ul {
		list-style-type: none; 
		margin-left: 0; 
		padding-left:0}
		
	input[type="text"], textarea {border:  1px solid #BBB;padding:  2px;}

/**
 * 2) Utility Classes
 */
	.block 	{display:block;}
	.clearL	{clear:left;}
	.clearR	{clear:right;}
	.clear 	{clear:both;}
	.floatL	{float:left;}
	.floatR	{float:right;}
	.floatN	{float:none;}
	.hide 	{display:none; visibility:hidden;}
	.inline {display:inline;}
	.marginTen {margin: 10px 0;}
	.small {font-size: 100%;}
	.colTwo {width:  325px;}
	
	/* lists */
	.circle {list-style:circle;}
	ol, .decimal {list-style:decimal outside; padding-left: 40px;}
	ul, .disc {list-style:disc outside; padding-left: 40px;}
	.none {list-style:none;}
	.square {list-style:square;}

/**
 * 3) Main Layout Structure 
 */
	#containerbg {
		width: 99.9%;
		background: url(../images/header.jpg) center -55px repeat-x;
	}	 
	#container {
		margin:0 auto;
		text-align:left;
	}	
	#header {
		min-height: 138px;
		background: url(../images/logo.png) 10px 10px no-repeat;
		position: relative;
		width: 816px;
		margin: 0 auto;	
	}

/* navigation */
	#nav h2, #newsletter label {display: none;}
	#nav {
		border: 1px solid black;
		background: black url(../images/nav-bg.gif) repeat-x top left;
		height: 25px;
		width: 100%;
	}
	#nav ul {
		width: 780px;
		height: 30px;
		margin: 0 auto;
		padding: 0;
		position: relative;
	}
	
	#nav ul li, ul.subnav li 
	{
		list-style: inside none none;
		padding: 0;
		margin: 0;
		display :inline; /*JM addded for IE */
		}
	#nav ul li.last {
		position: absolute;
		right: 10px;
		top:  0;
	}	
	#nav ul li a {
		color: #EBD064;
		text-decoration: none;
		float: left;
		display: block;
		padding: 5px 10px 7px;
		margin: 2px 0 0;
	}	
	#nav ul li a.selected {
		font-weight: bold;
		cursor: default;
		background-color: #ECE4CC;
		border-left:1px solid white;
		border-right:1px solid white;
		color: black;
	}
	#nav a.cafe, #nav a.venue {
		background: transparent url(../images/bg-venue.gif) no-repeat -67px -170px;
		font-weight: bold;
		color: white;
		text-decoration: underline;
		padding: 2px 10px;
		margin: 2px 0 0 40px;
		border: 1px solid white;
	}
/* Subnavigation*/
		ul.subnav {
			border-bottom:2px solid black;
			margin:-20px -42px 10px;
			padding:0 40px 10px;
		}	
		ul.subnav li {
			display: inline;
			padding: 0 20px 0 0;
		}	
		ul.subnav li a {color: black;}	
		ul.subnav li a.selected {
			border:1px solid black;
			background: black url(../images/nav-bg.gif) repeat-x top left;
			font-weight: bold;
			cursor: default;	
			color: white;
			text-decoration: none;
			padding: 3px 10px;
		}

/* content areas */
	#contentwrap {
		width: 780px;
		margin: 0 auto;
		padding: 0;
		border-left: 1px solid #87673A;
		border-right: 1px solid #87673A;
	}
	#content {
		padding: 30px 40px 40px;
		background-color: #ECE4CC;
	}

/* footer */
	#footer {
		font-size: 90%;
		padding: 50px 100px 2px;
		clear: both;
		background: url(../images/footer-logo.gif) right bottom no-repeat;
	}
	#footer p, #footer a {color: black;}
	#footer p {	text-align: center !important;}

/**
 * 4) Widgets and Plugins
 */

/**
 * 5) Page Specific Styles
 * ========================
 * Homepage */
 
 /*Welcome message*/
	#welcome {
		width: 400px;
		float: left;
	}	
	#welcome h2 {
		font-weight: normal;
		color: black;		
		margin-top: 0;
	}
	h2 span {
		display: block;
		color: #87673A;
		font-weight: bold;
	}
	#welcome a.button {
		font-size: 110%;
		font-weight: bold;
	}

	/*Right homepage column*/
	#rightcol {
		width: 300px;
		float: right;
	}
	
	.goldbold { 
		color: #87673A;
		font-weight: bold; 
		border:  none; 
		margin: 0; 
		padding:  0 10px;}
	.comingevents {
		border:  1px solid black; 
		position:  relative; 
		padding:  0 10px;
		padding-right:100px;
		margin: 10px 0;
		background-color:  white;}
	.comingevents img {
		position:  absolute;
		top:  0px;
		right:  0px;
}	
	div.comingevents p.price {
		color:  #EBD064; 
		background: black url(../images/diary-header.gif) repeat-x 0 -1px ;
		padding:  4px; 
		margin:  10px;
		display:inline; 
		position:  absolute; 
		right:  0; 
		bottom:  -2px;}
	
	/*Newsletter and venue*/
	#newsletter {
		width: 220px;
		height: 110px;
		color: white;
		float: left;
	}
	#newsletter h2,
	#thevenue h2 {
		padding: 6px 10px;
		font-weight: bold;
		font-size: 115%;
		color: white;
		background: url(../images/newsletter-bg-venue.gif) no-repeat top center;	
	}	
	#newsletter div,
	#thevenue div {
		background: url(../images/newsletter-bg-venue.gif) no-repeat bottom center;
		padding: 0px 10px 5px;
		height: 70px;
		position: relative;}
	#thevenue div {background-image: url(../images/venue-bg-venue.jpg);}	
	fieldset p {
		padding: 0;
		margin:  0;
	}
	
	#newsletter p.submitbutton {
		position: absolute;
		bottom: 10px;
	} 
	
	input.emailaddress {
		width: 185px;
		border: 1px solid black;
		padding: 3px 5px;
		margin: 0;
		display: block;
		font-size: 95%;
	}
	#thevenue {
		width: 220px;
		height: 110px;
		float: right;
	}
		
	#thevenue p {
		margin: 0;
		position: absolute;
		bottom: 10px;
	}
	fieldset {
		border: none;
		margin: 0;
		padding: 0;
	}
	
	/*Gig diary*/	
	#diary {
		border: 1px solid #404040;
		/*padding: 15px;*/
		background: #fefcfb url(../images/diary-venue-bg.jpg) repeat-x top left;
		position: relative;
		clear: both;
		margin-top: 20px;
	}	
	#diary_padding {
		border:none;
		padding: 5px;
		
		position: relative;
		clear: both;
		
	}	
	
	#diary h2 {
		background: black url(../images/diary-header.gif) repeat-x top right;
		color: white;
		font-weight: normal;
		padding: 9px 20px;
		/*margin: -14px -14px 0;*/
		font-size: 120%;
		position: relative;
	}
	#diary label {display: none;}
	#diary select {
		position: absolute;
		right: 45px;
		top: 8px;
	}
	
	#diary p.eventableprompt {
		color: white;
		padding: 10px 20px;
		margin: 0 -15px;
		font-size: 85%;
		text-align: center;
	}
	
	/*Diary table*/
	/* Table*/
	table.gigdiary  {width:100%;
	                 
	              scrollbar-base-color: #000000;
scrollbar-arrow-color: #EBD064;
scrollbar-3dlight-color: #EBD064;
scrollbar-darkshadow-color: #EBD064;
scrollbar-highlight-color: #000000; 
/* sorry dean!! */
}
	th.gigdiary {
		color: black; 
		padding: 0 0 6px; 
		text-align: center;
		font-size: 85%;
		
		
		}
	
	td.blankgigdiary {
		border: 1px solid #404040;
		margin: 5px;
		width: 14%;
		color: black;
		height:80px;
		background-color:  white;	
		padding: 0 !important;
	}
	.gigdate {
		text-align: right;
		font-size: 85%;
		display: block;
	}
	.eventname {
		padding: 3px 2px;
		margin: 0;
	}
	.eventname a {
		padding: 3px 2px;
		margin: 0;
		color: #EBD064;
		
	}
	.eventtime, .eventprice {
		font-size: 75%;
		padding: 0 2px;
		margin: 0;
		color: white;
	}
	.eventprice {
		border-bottom: 1px dotted #404040;
		padding-bottom: 2px;
		margin-bottom: 2px;
	}
	td.event{
		background: black url(../images/diary-event-bg.gif) repeat-x bottom;
		color: #EBD064;
		border: 1px solid #404040;
		margin: 5px;
		width: 14%;
		color: black;
		padding: 0 !important;}
	td.event span.gigdate {color:  white;}
	#diary table td.starevent {
		background: #BF470B url(../images/diary-starevent-bg.gif) repeat-x bottom;
		color: black;}

/*About page
 *==========================*/
 
 	img.aboutthumb {
		width: 60px;
		height: 80px;
		float: left;
		margin-right: 10px;
		border: 5px solid white;
	}

/*The Venue: Opening times page
 *==========================*/
	table.openingtimes {width: 300px;}
	table.openingtimes td {padding: 5px 0;}
	table.openingtimes td:first-child {width: 160px;}


/*Events page
 *==========================*/
/*Main events table*/
	table.eventstable {border: 1px solid #404040; width: 100%;}
	table.eventstable th {
		font-weight: normal;
		font-size: 90%;
		background: black url(../images/nav-bg.gif) repeat-x top left;	
		color: white;
		padding: 10px 5px;
	}	
	table.eventstable td {
		border-right: 1px solid #404040;
		border-bottom: 1px dotted #404040;	
		background-color: white;
		padding:  5px;
	}
	table.eventstable td img {margin: 10px -4px -12px;}	
	table.eventstable tr td:first-child {width: 80px;}	
	tr.endrow td {border-bottom: none;}	
	td.endcol {border-right: none;}	
 	table.fullevent_table {width:  100%;}


/*Performers page*/
	ul.list, ul.linklist {
		list-style: inside none none;
		margin: 0;
		padding: 0;
	}
	ul.linklist li {padding-bottom: 10px;}
	ul.linklist li img {width: 40px;}
	ul.linklist a {display: block;}

/*Terms & Conditions page*/
ul.terms li {padding:  0.5em;}

/**
 *========= End of stylesheet=====
 */
 
 /* JM ADDED ALL BELOW */

div.eventpopup {
	border: 1px dotted #0021A6;
	background-color: white;
	z-index :1000;
	padding: 0px 10px 10px 10px;
	margin: 10px 10px 0;
	width: 375px;}
div.eventpopup h2 {margin: -5px 0 0 0;padding: -10 0 10 0;}
div.eventpopup ol {padding: 0 0 0 20px;margin: 0;}

/* Rating */

.ratingStar {
    font-size: 0pt;
    width: 12px;
    height: 12px;
    margin: 0px;
    padding: 0px;
    cursor: pointer;
    display: block;
    background-repeat: no-repeat;}

.filledRatingStar {background-image: url(../images/FilledStar.png);}
.emptyRatingStar {background-image: url(../images/EmptyStar.png);}
.savedRatingStar {background-image: url(../images/SavedStar.png);}

/*Event diary table*/
table.eventdiary {width: 100%;}
th.eventdiary {font-weight: normal;font-size: 90%;}
td.eventdiary {
	padding: 10px 0px;
	border: 1px solid pink;/*#404040;*/
	height: 75px;
	vertical-align: top;}
td.eventdiaryevent {background: black url(../images/diary-event-bg.gif) repeat-x bottom;}
td.eventdiarystarevent {
	background: #BF470B url(../images/diary-starevent-bg.gif) repeat-x bottom;
	color: black;}
.updbutton a {
	background: black url(../images/button-bg.gif) repeat-x;
	border: 1px solid #404040;
	padding: 4px 8px;
	color: white;
	font-size: 95%;
	text-decoration: none;}
.updbutton a:hover {
	text-decoration: underline;
	background-image: url(../images/button-bg-rollover.gif);}
.btn_save {
    position:absolute; top:0; left:0; z-index:2000; border:1px solid black; 				
    background-color:#E1EDFF; padding:5px}

/* additions 10/12/2008 */

/* Accordion */
.accordionHeader {
    border: 1px solid #2F4F4F;
    color: white;
    background-color: #2E4d7B;
	font-family: Arial, Sans-Serif;
	font-size: 12px;
	font-weight: bold;
    padding: 5px;
    margin-top: 5px;
    background: black url(../images/button-bg.gif) repeat-x;
    cursor: pointer;}
 .accordionHeader a{color: #FFFFFF;text-decoration: none;}
 .accordionHeader a:hover{text-decoration: underline;}
 .accordionHeaderSelected{
    border: 1px solid #2F4F4F;
    color: white;
 	background: black url(../images/button-bg.gif) repeat-x;
	font-family: Arial, Sans-Serif;
	font-size: 12px;
	font-weight: bold;
    padding: 5px;
    margin-top: 5px;
    cursor: pointer;}
.accordionHeaderSelected a{color: #FFFFFF;text-decoration: none;}
.accordionHeaderSelected a:hover{text-decoration: underline;}
.accordionContent{
    background-color: #ffffff;
    border: 1px solid #2F4F4F;
    border-top: none;
    padding: 5px;
    padding-top: 10px;}
.actreview {
	width:300px;
	float:  left;
	margin:  -15px 0 0 -15px;}
	
table.act_planned_events {
	padding: 0;
	margin: 0 0 20px;}
table.act_planned_events th {
	padding:  10px; 
	border:  1px solid black;
	background: black url(../images/diary-header.gif) repeat-x scroll left top;
	color:white;
	text-align: center}
table.act_planned_events td {padding:  10px; border:  1px solid black; background-color:  white; line-height:  130%;}
.act_planned_events_price {font-weight:bold; color:  #000;}

table.comment_table {margin:  1em 0;border:  1px solid black;background-color: white;position: relative;display:  block;	}
table.comment_table td {padding:  10px;vertical-align: top; position: relative;}
p.comment_table_comment {color:  black;}
td.comment_table_right a.button {position: absolute;bottom:  5px;right:  5px;}

.act_gallery{
	 float :right;
	 border: 1px solid black;
	 padding: 10px;
	 margin:  30px -15px 0 0;
	 width:350px;
	 background: #FEFCFB url(../images/diary-venue-bg.jpg) repeat-x scroll left top}
 
div.act_gallery h3.mainheading {
	background: black url(../images/diary-header.gif) repeat-x scroll left top;
	color:white;
	font-size:120%;
	font-weight:normal;
	margin:-10px -10px 10px;
	padding:9px 20px;}

a.button{display:inline-block;}

/*Gallery page */
/*Main gallery page*/

div.main_gallery div#galleryselector {
	position: relative;
	clear:left ;
	border-bottom: 2px solid black;
 	padding: 0 25px 30px;
 	margin:  5px -40px 0;
 	background: #FEFCFB url(../images/diary-venue-bg.jpg) repeat-x scroll left -200px}

div.main_gallery div#galleryselector ul {list-style: none inside none;right:5px;}
div.main_gallery div#galleryselector ul li {border-left:  1px dotted black;text-align:  center;margin-top:  10px;padding: 0 10px;}
div.main_gallery .galleryview {border-top:  none !important; }
div.main_gallery div#galleryselector ul li p {text-align: center; padding:  0;margin: 0; font-size:  90%;}	
div.main_gallery div#galleryselector ul img {border:  5px solid white !important; padding:  0;}	
div.main_gallery div.galleryview div.gallery_mainimage {width:  350px;float:  left;margin-left:  -20px;}
div.main_gallery div.galleryview div.gallery_mainimage .delete {
	margin-bottom:  10px;
}
div.main_gallery div.galleryview h3.mainheading {margin:  0 -20px;}		
div.main_gallery div.galleryview div.gallery_admin {width:  340px;float:  right;margin-top:  20px;}
div.main_gallery div.thumbnails {border-bottom:  none !important; margin:  0 -12px;}
div.main_gallery div.thumbnails img {border:  5px solid white !important;}	
div.main_gallery div.upload_panel {
	border:  1px solid black;
	background-color:  white;
	margin:  10px 0 10px 0; /*JM Changed margins! */
	padding:  0 5px 5px 10px;
}

div.main_gallery div.upload_panel input[type="text"],
div.main_gallery div.upload_panel textarea {width:  150px !important;}
div.main_gallery div.upload_panel span.updbutton a {left:  165px !important;}

/*Gallery selector*/
	#galleryselector {position: relative;}	
	#galleryselector h2 {font-weight: normal;font-size: 200%;}	
	#galleryselector h3 {color: black;}	
	#galleryselector ul {
		margin-top:-70px;
		list-style: inside none none;}	
	#galleryselector ul li {float: left; display:block; width:100px; height:150px}
	#galleryselector ul li img {
		background-color: white !important;
		border: none !important;
		padding: 2px !important;
		margin: 2px;}
	#galleryselector ul li p {text-align: center;}
	
/*Gallery view */
	.galleryview {
		clear: left;
		position: relative;
		border-top: 1px dotted black;
		padding-top: 10px;}	
	div.galleryview a img {padding-right:  0;}
	div.galleryview div {position:  relative;}
	div.act_gallery div.galleryview {border-top:  none; padding-top:  0;}
	.galleryview img.large, img.large, iframe {border: 15px solid white;}
	iframe {float: right;}


	
/*Thumnail images*/
div.thumbnails {padding:  10px;margin: 0 -10px;border-bottom: 1px dotted black;}
.thumbnails a {padding: 2px;margin: 1px;}
.thumbnails a img {border: none!important;background-color: white !important;	padding: 0 !important;margin: 0 !important;}

/*Upload panel*/

div.upload_panel div table {width:  100%;}
div.upload_panel div table td {vertical-align: top; padding:  5px 5px 5px 0;}
div.upload_panel div table td.upload {text-align:  right; padding-top:  10px;}

/*Comments section*/
p.posted_by {padding:  10px; border-bottom: 1px dotted black; margin: 0 -10px 10px;}
td.post textarea {width:  99%;}
