/*
Website:	Mr. Custa
URL:		http://www.mrcusta.co.uk
Version:	1 (March, 2010)
Author:		Tom Cash
URL:		http://www.tomcash.co.uk

HTML Attributes */
body { background: #197DFA; margin: 20px 0 20px 0; }
h1 { font-family: arial, verdana, sans-serif; font-size: 12pt; margin: 0 0 -4px 0; padding: 0; color: #197DFA; text-align: right; }
h2 { font-family: arial, verdana, sans-serif; font-size: 11pt; margin: 10px 0 -6px 0; padding: 0; color: #197DFA; }
p { font-family: arial, verdana, sans-serif; font-size: 10pt; color: #333; text-align: justify; line-height: 140%; margin: 13px 0 0 0; padding: 0; }
span{ margin: 0; padding: 0; font-size: 9pt; }
a:link, a:visited, a:active { text-decoration: none; color: #06F; outline: none; }
a:hover { text-decoration: none; color: #333; }
ul { font-family: arial, verdana, sans-serif; font-size: 10pt; color: #333; list-style: square; display: block; margin: 4px 0 10px 0; }
img { border: 0; padding: 0; margin: 0; }

/* Layout Attributes */
#container { width: 780px; margin: auto; padding: 0; }
	#header { width: 780px; height: 106px; background: URL(layout/top-bg.jpg) #FFF; padding: 0; }
	#content-container { width: 766px; padding: 0; margin: 0; background: #FFF; border-bottom: 7px solid #000; border-right: 7px solid #000; border-left: 7px solid #000;}
	#content-bottom { width: 716px; margin: 0 10px 0 10px; padding: 0 10px 8px 10px; border-bottom: 5px solid #000; border-right: 5px solid #000; border-left: 5px solid #000; background: #EDEDED; }
	.content-middle { width: 716px; padding: 8px 10px 8px 10px; margin: 10px; border: 5px solid #000; background: #EDEDED; }
	.content-media { width: 746px; height: 210px; padding: 0; margin: 10px; border: 0; background: #EDEDED; }
	.content-middle-char-mrcusta { width: 505px; height: 158px; padding: 52px 12px 0 230px; margin: 10px 10px 0 10px; border: 0; background: URL(layout/character-mrcusta.jpg) #FFF; font-family: arial, verdana, sans-serif; font-size: 10pt; color: #333; line-height: 140%; }
	.content-middle-char-sia { width: 505px; height: 200px; padding: 20px 230px 0 12px; margin: 0 10px 0 10px; border: 0; background: URL(layout/character-sia.jpg) #FFF; font-family: arial, verdana, sans-serif; font-size: 10pt; color: #333; line-height: 140%; }
	.content-middle-char-brok{ width: 505px; height: 158px; padding: 62px 12px 0 230px; margin: 0 10px 0 10px; border: 0; background: URL(layout/character-brok.jpg) #FFF; font-family: arial, verdana, sans-serif; font-size: 10pt; color: #333;  line-height: 140%; }
	.content-middle-char-fly { width: 505px; height: 190px; padding: 10px 230px 10px 12px; margin: 10px 10px 0 10px; border: 0; background: URL(layout/character-fly.jpg) #FFF; font-family: arial, verdana, sans-serif; font-size: 10pt; color: #333; line-height: 140%; }
	#content-top { width: 716px; margin: 10px 10px 0 10px; padding: 0 10px 0 10px; border-top: 5px solid #000; border-right: 5px solid #000; border-left: 5px solid #000; background: #EDEDED; }
	#content-tofooter { width: 716px; margin: 0 10px 0 10px; padding: 0 10px 0 10px; border-right: 5px solid #000; border-left: 5px solid #000; background: #EDEDED;  }
	#footer { width: 766px; padding: 0; margin: 0; }
	#navigation { list-style: none; margin: 0; padding: 0; }
		span.hide { display: none; }
		#navigation li{ float: left; }
		#navigation li#logo a { padding: 0px; margin: 11px 9px 0 17px; display: block; width: 224px; height: 95px; background: URL(layout/logo.jpg); }
		#navigation li#about-the-show a { padding: 0px; margin: 28px 16px 0 0; display: block; width: 147px; height: 21px; background: URL(layout/nav-about-the-show.jpg); background-position: 0 -21px; }
		#navigation li#about-the-show a:hover { margin: 29px 16px 0 0; background-position: 0 0;}
		#navigation li#characters a { padding: 0px; margin: 29px 16px 0 0; display: block; width: 105px; height: 21px; background: URL(layout/nav-characters.jpg); background-position: 0 -22px; }
		#navigation li#characters a:hover { background-position: 0 0;}
		#navigation li#history a { padding: 0px; margin: 28px  16px 0 0; display: block; width: 68px; height: 21px; background: URL(layout/nav-history.jpg); background-position: 0 -24px; }
		#navigation li#history a:hover { background-position: 0 0;}
		#navigation li#media a { padding: 0px; margin: 27px 13px 0 37px; display: block; width: 50px; height: 21px; background: URL(layout/nav-media.jpg); background-position: 0 -21px; }
		#navigation li#media a:hover { background-position: 0 0;}

/* Image Attributes */
img.title { margin: 0 0 -2px 0; }

/* Audio Player / Episodes */
.audio-player {
	background: white;
	padding: 20px;
	margin: 20px auto 20px auto;
	width: 400px;
	border: 5px solid black;
}

.audio-player:first-of-type {
	margin-top: 40px;
}

.audio-player:last-of-type {
	margin-bottom: 40px;
}

.audio-player p {
	font-weight: 600;
	margin: 0 0 20px 0;
	font-size: 1.1em;
	color: #197DFA;
}

.audio-player audio {
	width: 100%;
}