/* Elements
==================================================*/

body { background: url(/images/base/background-shows.jpg) center 0px no-repeat fixed #000000; }

a { color: #CCCCCC; }

h1 { color: #FF9933; }

h2 {
	color: #FF6600;
	border-bottom: 1px solid #FF6600;
}

/* Navigation
==================================================*/

#navigation a { color: #FF6600; }

/* Content Wrappers
==================================================*/

#mainContentWrapper { width: 455px }

#sideBarContentWrapper { width: 485px; }

/* Shows
==================================================*/

.show { padding: 2px; margin: 0 -20px 10px 0; }

	.show span { display: block; float: left; margin-right: 10px; }

		.show span.showContentDetails { float: right; width: 100px; }
	
			.showContentDetails span { width: 10px; height: 12px; }
		
				.showContentDetails span.audioIcon { background: url(../images/base/audioIcon.jpg) 0px 2px no-repeat; }
				
				.showContentDetails span.flyerIcon { background: url(../images/base/flyerIcon.jpg) 0px 2px no-repeat; }
				
				.showContentDetails span.photoIcon { background: url(../images/base/photoIcon.jpg) 0px 2px no-repeat; }
				
				.showContentDetails span.setlistIcon { background: url(../images/base/setlistIcon.jpg) 0px 2px no-repeat; }
				
				.showContentDetails span.videoIcon { background: url(../images/base/videoIcon.jpg) 0px 2px no-repeat; }
	
/* Sidebar
==================================================*/

.sideBarContent { }

	.sideBarContent h2 { 
		color: #FF9933;
		border-bottom: 1px solid #FF9933;
	}
	
	.sideBarContent h3 { 
		color: #FF9933;
		margin-top: 20px
	}

	/* Show Details
	==================================================*/
	
	#showDetailsWrapper {
		border-left: 1px solid #444444;
		color: #CCCCCC;
		padding: 20px 20px 200px 20px;
		margin-left: -21px;		
		position: absolute;
        width: 485px;
        display: none;
	}
	
	#showDetailsWrapper h2 { margin-top: 0; }
	
	#showDetailsWrapper span { display: block; }
	
	#showDetailsWrapper .date { 
		font-weight: bold;
		font-size: 16px;
	}
	
	#showDetailsWrapper .venueName {
		color: #999999;
		font-weight: bold;
		font-size: 14px;
	}
	
	#showDetailsWrapper .venueLocation { color: #999999; }
	
		/* Photos
		==================================================*/
		
		#showDetailsWrapper .photosWrapper img { border: 1px solid #999999; }
	
		/* Flyers
		==================================================*/
		
		#showDetailsWrapper .flyerWrapper img { border: 1px solid #999999; }
		
		/* Video
		==================================================*/
		
		#showDetailsWrapper .videoWrapper iframe {
			border: 1px solid #999999;
			margin-bottom: 10px;
		}
	
		/* Audio
		==================================================*/
			
		#showDetailsWrapper .audioWrapper .trackWrapper { 
			border-bottom: 1px solid #333333;
			overflow: auto;
			padding: 3px 0px 3px 0px;
		}
				
			#showDetailsWrapper .audioWrapper .trackWrapper .trackCount { 
				float: left;
				width:20px;
				line-height: 22px;
			}
				
			#showDetailsWrapper .audioWrapper .trackWrapper .playButton { 
				float: left; 
				width: 32px; 
				height: 22px;
			}
					
				#showDetailsWrapper .audioWrapper .trackWrapper .playButton a.paused { 
					background: url(../images/base/play-button-orange.png) 0px 0px no-repeat; 
					display: block; 
					width: 20px; 
					height: 20px;
				}
					
				#showDetailsWrapper .audioWrapper .trackWrapper .playButton a.playing { 
					background: url(../images/base/play-button-orange.png) 0px -20px no-repeat; 
					display: block; 
					width: 20px; 
					height: 20px;
				}
					
				#showDetailsWrapper .audioWrapper .trackWrapper .trackName { 
					float: left; 
					line-height: 22px; 
				}
	
		/* Setlist
		==================================================*/
	
		#showDetailsWrapper .setlistWrapper span.notPlayed {
			color: #999999;
			xdisplay: inline;
			text-decoration: line-through;
		}