/* @override http://www.britfur.fm/style/style.css */

body {
	color: #fff;
	background-color: #000;
	margin: 0;
	font-family: "Helvetica Neue", Arial, Geneva, sans-serif;
}

/* Font is helvetica and white, global site margin 0 and background black */

div#wrap {
	margin-right: auto;
	margin-left: auto;
	width: 800px;
}

/* wrap div is centred and limited to 800px width */

span.disappear {
	visibility: hidden;
	display: none;
}

/* any tags inside the span is made invisible */

/* @group Header */

div#mastheader {
	width: 800px;
	height: 272px;
	background: url(../media/images/mastheader.png) no-repeat;
}

/* master header containing logo */

div#mastheader h1 {
	display: none;
}

div#streamstatus {
	float: right;
	margin-top: 194px;
	margin-right: 20px;
	width: 470px;
	height: 75px;
}

/* div with the stream status countdown */

div.stream {
	width: 100%;
	height: 100%;
	float: left;
}

/* stream banners in radioshow style sheet */

#streamstatus p {
	text-align: center;
	color: #ccc;
	background-color: #fff;	
	border-style: solid;
	border-width: 3px;
	letter-spacing: 0.1ex;
	font: small-caps 18px Verdana, sans-serif;
	margin-bottom: auto;
	margin-top: 22px;
	padding: 0;
}

/* paragraph style when in countdown, puts it into a box and sets the countdown's size and presentation */

#streamstatus p#shownow {
	border: none;
}

#streamstatus a:link {
	color: #ccc;	
	text-decoration: none;
	background-color: #fff;
}

#streamstatus a {
	display: block;
	width: 100%;
	height: 26px;
}

#streamstatus a.buttonshow {
	display: block;
	width: 100%;
	height: 34px;
	margin-top: -10px;
}

/* makes the button a certain height, the specific buttons when the show is playing is on the radioshow style sheet */

div#mainbody {
	margin-top: 8px;
	height: 100%;
}

/* @group Menu */

div#mainmenu {
	background: url(../media/images/menubottom.png) no-repeat -1px bottom;
	display: inline;
	width: 199px;
	margin: 0;
	padding: 0;
	float: left;
		border-right: 2px solid #fff;
}

/* div container for the menu, setting the overall size, also contains the button image of the menu and right border. floats left so main body sits besides */

#mainmenu h3 {
	position: relative;
	top: 0;
	display: block;
	height: 50px;
	background: url(../media/images/menutop.png) no-repeat -1px 0;
	text-align: right;
	padding-top: 4px;
	padding-left: 10px;
	font: small-caps bold 2.1em "Lucida Grande", Lucida, Verdana, sans-serif;
	letter-spacing: 3px;
	margin: 0;
	padding-right: 14px;
}

/* H3 header made invisible by span, used to place the top part of menu image */

div#mainmenulinks {
	width: 100%;
}

/* left border */

#mainmenu ul {
	list-style-type: none;
	text-align: right;
	padding-left: 20px;
	padding-right: 20px;
	position: relative;
	bottom: 50px;
	border-left: 2px solid #fff;
	margin: 50px 0 -1px;
}

#mainmenu ul li {
	padding-bottom: 15px;
	padding-top: 15px;
	border-bottom: 2px dotted #fff;
	border-top-style: none;
}

/* @group Links */

#mainmenu a, #mainmenu a:link {
	width: 100%;
	display: block;
	height: 26px;
	color: #fff;
	font-size: 0;
	background-color: #000;
}

#mainmenu li.activeLink {
	padding-bottom: 0;
	padding-top: 0;
	border-bottom: none;
	height: 53px;
	margin-top: -4px;
}

#mainmenu li.activeShowLink {
	padding-bottom: 0;
	padding-top: 0;
	border-bottom: none;
	height: 197px;
	margin-top: -4px;
}

#mainmenu a.activeLink {
	width: 208px;
	height: 53px;
	position: absolute;
	right: -14px;
	border-right: 3px solid #000;
}

/*#mainmenu li.activeLink {
	padding-bottom: 0;
	padding-top: 0;
	border-bottom: none;
}

#mainmenu a.activeLink {
	width: 211px;
	height: 53px;
	bottom: 4px;
	left: -23px;
	position: relative;
}*/

/* Properties of the links in the menu when they are active */

/* Index/schedule Link */

a#indexLink:link, a#indexLink:visited {
	background: url(../media/images/schedulelink.png) no-repeat -3px 0;
}

#mainmenu a#indexActive {
	background: url(../media/images/schedulepage.png) -2px -1px;
}

a#indexLink:hover {
	background: url(../media/images/schedulelink.png) no-repeat -3px -27px;
}

/* About link */

a#aboutLink:link, a#aboutLink:visited {
	background: url(../media/images/aboutlink.png) no-repeat right 0;
}

#mainmenu a#aboutActive {
	background: url(../media/images/aboutpage.png) -2px 0;
	margin-bottom: 0;
}

a#aboutLink:hover {
	background: url(../media/images/aboutlink.png) no-repeat right -27px;
}

/* Show link */

a#showsLink:link, a#showsLink:visited {
	background: url(../media/images/showslink.png) no-repeat right 0;
}

#mainmenu a#showActive {
	height: 44px; /* `special size */
	background: url(../media/images/showpage.png) no-repeat -2px 0;
}

a#showsLink:hover {
	background: url(../media/images/showslink.png) no-repeat right -27px;
}

/* @group show links */

#mainmenu ul ul#submenu {
	width: 189px;
	position: relative;
	background: #000 url(../media/images/show_menu_bottom.png) no-repeat 0 bottom;
	padding-left: 0;
	padding-bottom: 7px;
	border-left: 0px;
	margin: 0;
	left: -22px;
	bottom: -43px;
}

#mainmenu ul ul#submenu li {
	width: 215px;
	background: url(../media/images/show_bg.png) repeat-y;
	height: 40px;
}

#mainmenu a.showlink {
	width: 215px;
	height: 30px;
	position: relative;
	margin-bottom: 0;
	margin-top: 0;
	padding-top: 0;
	background-color: #000;
}

/* @end */

/* Join link */

a#joinLink:link, a#joinLink:visited {
	background: url(../media/images/joinlink.png) no-repeat right 0;
}

#mainmenu a#joinActive {
	background: url(../media/images/joinpage.png) -2px 0;
	margin-bottom: 0;
}

a#joinLink:hover {
	background: url(../media/images/joinlink.png) no-repeat right -27px;
}

/* IRC link */

a#ircLink:link, a#ircLink:visited {
	background: url(../media/images/irclink.png) no-repeat right 0;
}

#mainmenu a#ircActive {
	background: url(../media/images/ircpage.png) -3px 0;
	margin-bottom: 0;
}

a#ircLink:hover {
	background: url(../media/images/irclink.png) no-repeat right -27px;
}

/* Contact link */

a#contactLink:link, a#contactLink:visited {
	background: url(../media/images/contactlink.png) no-repeat right 0;
}

#mainmenu a#contactActive {
	background: url(../media/images/contactpage.png) -2px 0;
	margin-bottom: 0;
}

a#contactLink:hover {
	background: url(../media/images/contactlink.png) no-repeat right -27px;
}

/* Links link */

a#linksLink:link, a#linksLink:visited {
	background: url(../media/images/linklink.png) no-repeat right 0;
}

#mainmenu a#linksActive {
	background: url(../media/images/linkpage.png) -2px 0;
	margin-bottom: 0;
}

a#linksLink:hover {
	background: url(../media/images/linklink.png) no-repeat right -27px;
}

/* @end */

/* @end */

/* @group Content */

div#content {
	border: 2px solid #fff;
	width: 588px;
	padding: 0;
	float: right;
}

#content h2 {
	text-align: right;
	font-variant: small-caps;
	letter-spacing: 0.15em;
	padding-top: 5px;
	padding-bottom: 5px;
	padding-right: 15px;
	margin: 0;
	font-size: 2.05em;
}

#content h3 {
	border-bottom-style: dotted;
	border-bottom-width: 2px;
	margin-left: 15px;
	margin-right: 15px;
	padding-bottom: 3px;
	border-top-style: dotted;
	border-top-width: 2px;
	padding-top: 3px;
	color: #678bb7;
	font-variant: small-caps;
	letter-spacing: 0.2ex;
	background-color: #000;
}

#content code {
	margin-left: 20px;
	border-style: dotted;
	border-width: 2px;
	display: block;
	padding: 5px;
	margin-right: 20px;
	background-color: #333;
	color: #fff;
}

div#content p {
	font-size: 0.8em;
	padding-right: 15px;
	padding-left: 15px;
	line-height: 3ex;
	margin-top: 20px;
	margin-bottom: 20px;
}

a:link, a:visited {
	color: #678bb7;
	background-color: #000;
}

a:active {
	color: #f00;
	background-color: #000;
}

#content ul {
	font-size: 0.8em;
}

#content li {
	padding-bottom: 3px;
	padding-top: 3px;
}

#content dl.qna {
	margin-left: 20px;
	margin-right: 20px;
	padding-left: 10px;
	border-left: 2px solid;
	border-color: #678bb7;
}

#content dl.qna dt {
	border-bottom-style: solid;
	border-bottom-width: 1px;
	padding-bottom: 2px;
	font-size: 0.9em;
	color: #678bb7;
	font-weight: bold;
	background-color: #000;
}

#content dl.qna dd {
	margin-left: 0;
	margin-top: 5px;
	font-size: 0.8em;
	margin-bottom: 15px;
	line-height: 3ex;
}

#content ul.contactlist, #content dl.contactlist {
	padding-left: 20px;
	margin-bottom: 15px;
	margin-top: 5px;
	font-size: 1em;
}

#content ul.contactlist li {
	list-style-type: none;
}

#content ul.contactlist li ul li, #content dl.contactlist dd {
	list-style-type: circle;
	margin-top: 10px;
	margin-bottom: 10px;
	font-size: 0.9em;
	letter-spacing: 0.3ex;
	margin-left: 0;
}

#content dl.contactlist dd {
	letter-spacing: 0;
}

/* @end */

/* @group Tables */

#content table {
	border: 2px solid #fff;
	text-align: center;
}

table.schedule {
	width: 575px;
	font-size: 0.6em;
	margin-left: 5px;
	margin-right: 5px;
}

table.irctable {
	width: 540px;
	font-size: 0.7em;
	margin-left: 20px;
	margin-bottom: 10px;
}

table.schedule th, table.irctable th {
	font-variant: small-caps;
	background-color: #678bb7;
	font-weight: bold;
	font-size: 1.6em;
	color: #000;
}

tr.evenrow {
	background-color: #333;
}

td.showrow {
	background-color: #4c5e74;
	border: 1px solid #999;
}

table.irctable td {
	padding-top: 5px;
	padding-bottom: 5px;
}

table.schedule a:link, table.schedule a:visited {
	color: #fff;
	background-color: #4c5e74;
}

table.schedule a:hover {
	color: #000;
	background-color: #4c5e74;
}

/* @end */

#disclaimer p {
	color: #999;
	font-size: 0.6em;
	clear: both;
	padding-top: 10px;
	margin-left: 20px;
	margin-right: 20px;
	text-align: center;
	background-color: #000;
}