/*	ixo.ca style sheet
 *	vim: ts=3 sw=3:
 *	*/
:root {
	--colour_bg:						#ebeee7;
	--max_width:						1280px;
	--max_line_width:					40em;
	--max_quote_width:				25em;
}
BODY {
	background-attachment:			fixed;
	background-repeat:				no-repeat;
	color:								white;
	font-family:						"DejaVu Serif", Georgia, serif;
	font-size:							16pt;
	font-style:							normal;
}
HR {
	text-align:							left;
	width:								28%;
}
P,
P.indent {
	line-height:						150%;
	margin:								0 20px 7px 20px;
	text-indent:						2em;
	max-width:							750px;
}
P.bright,
P.indent {
	color:								white;
}
P.dark {
	color:								black;
}
P.indent {
	max-width:							20em;
}
P.wide {
	max-width:							1024px;
}
P.aboutme {
	line-height:						150%;
	text-indent:						1em;
}
OL.aboutme,
OL.aboutme > LI {
	line-height:						160%;
	list-style-type:					lower-roman;
	width:								750px;
}
P.dropcap {
	line-height:						150%;
	max-width:							var(--max_line_width);
	text-indent:						0;
}
P.dropcap:first-letter {
	color:								#ccc;
	display:								block;
	float:								left;
	font-size:							500%;
	margin:								0.1em 0 0 0;
	text-indent:						0;
}
P.narrow {
	color:								#cfc;
	margin:								0 2em 1em 2em;
	text-indent:						0;
	max-width:							650px;
}
P.footnote {
	font-size:					12pt;
	max-width:					800px;
}
P.debug {
	color:						#aaa;
	font-size:					8pt;
}
P.error {
	border-left:				2px solid #cc5;
	color:						#e99;
	padding-left:				1em;
	text-indent:				0;
	width:						300px;
}
PRE {
	font-size:					9pt;
}

LI {
	color:								#ffa;
	line-height:						135%;
	margin-bottom:						0.5em;
}
.req,
.required_field {
	color:						red;
	font-weight:				bold;
	text-indent:				0;
}
.highlight {
	background:					#333;
	font-weight:				bold;
}
H1 {
	color:						#CEA;
	font-size:					24pt;
	font-weight:				bold;
	line-height:				95%;
	margin:						100px 0 1em 0;
	padding:						0 10px;
	text-decoration:			none;
	width:						75%;
}
H2 {
	color:						#090;
	font-size:					20pt;
	font-style:					italic;
	font-weight:				bold;
	line-height:				110%;
	margin:						2em 0 4px 15px;
	text-decoration:			none;
}
H3 {
	color:						#090;
	font-size:					18pt;
	font-weight:				bold;
	margin:						2em 0 4px 15px;
	text-decoration:			none;
}
H4 {
	font-size:					12pt;
	font-weight:				bold;
	margin:						30px 0 5px 0;
	padding-bottom:			0;
}

A:link {
	color:						#ffff7d;
	font-style:					normal;
	font-weight:				bold;
	text-decoration:			none;
}
A:visited {
	color:						#ffff7d;
	font-style:					normal;
	font-weight:				lighter;
	text-decoration:			none;
}
A:hover {
	color:						#00D;
	background:					#DFDFDF;
	font-weight:				bold;
	font-style:					normal;
	text-decoration:			none;
}
/* Top Menu */
BUTTON.menu {
	background:							none;
	border-top:							1px solid black;
	border-bottom:						1px solid #73682e;
	border-left:						1px solid black;
	border-right:						1px solid #73682e;
	color:								#00FF00;
	font-family:						Verdana, Times, serif;
	font-size:							12pt;
	margin:								0 1px;
	padding:								3px 5px;
	width:								70px;
}
BUTTON.menu:hover {
	background:							black;
	border-top:							1px solid yellow;
	border-bottom:						2px solid #988834;
	border-left:						1px solid white;
	border-right:						2px solid #988834;
	color:								#00FF00;
	font-weight:						bold;
}
/* Left Menu */
DIV#leftmenu {
	border-right:						2px solid #988834;
	width:								150px;
}


A.light {
	border-top:					1px solid black;
	border-bottom:				1px solid #73682e;
	border-left:				1px solid black;
	border-right:				1px solid #73682e;
	margin:						0 1px;
	padding:						3px 5px;
	width:						150px;
}
A.light:link,
A.light:visited {
	color:						#00FF00;
}
A.light:hover	{
	background:					black;
	border-top:					1px solid yellow;
	border-bottom:				2px solid #988834;
	border-left:				1px solid white;
	border-right:				2px solid #988834;
	color:						#00FF00;
	font-weight:				bold;
}

A.button {
	background-color:			#333;
	border-bottom:				1px solid #444;
	border-left:				2px solid #e0e0e0;
	border-right:				2px solid #777;
	border-top:					1px solid #ddd;
	border-radius:				7px;
	font-size:					10pt;
	font-style:					normal;
	font-weight:				bold;
	line-height:				100%;
	outline:						none;
	padding:						2px 4px;
}
A.button:hover {
	background-color:			#ff0;
	color:						#000;
	text-decoration:			none;
}

/* ------------------------------------------
 * Top Right area
 * --------------
 * */
DIV#topright {
	color:						gold;
	position:               absolute;
	left:					0;
	top:					0;
	height:						100px;
	width:						95%;
	max-width:					var(--max_width);
}
DIV#topright P {
	font-family:				Inconsolata, Consolas, Verdana, sans-serif;
	font-size:					12pt;
	text-align:					right;
}
@media only screen and (max-width: 1000px) {
	DIV#topright P {
		font-size:				10pt;
	}
}

/*****************************************************
	Menu
******************************************************/

DIV.menubox {
	color:						#770;
	font-family:				"Trebuchet MS", Verdana, sans-serif;
	font-size:					14pt;
	position:					absolute;
	height:						auto;			/* used to be 320px */
	left:							40px;
	padding-bottom:			2em;
	top:							213px;
	width:						500px;
}
DIV.menubox P {
	font-weight:				normal;
	line-height:				133%;
	margin:						5px 0 0 1em;
	padding:						0.5em 0 0.5em 0;
	text-indent:				-1em;
}
DIV.menubox a {
	color:						#ffff7d;
	font-weight:				normal;
	line-height:				133%;
	text-decoration:			none;
}
DIV.menubox a:visited {
	font-weight:				lighter;
}
DIV.menubox a:hover {
	color:						#15160e;
	background:					#DFDFDF;
	font-weight:				bold;
	text-decoration:			none;
}
DIV.menubox HR {
	color:						gold;
	margin-left:				0;
	margin-right:				auto;
	text-align:					left;
	width:						50%;
}


/*	Radio page
	----------	*/
TABLE#NowPlayingTable {
	width:								600px;
}
DIV#radioFeature {
	font-size:							11pt;
	line-height:						115%;
	position:							absolute;
	left:						0px;
	top:						130px;
}
DIV#nowPlaying1 {
	font-size:							11pt;
	line-height:						115%;
	position:							absolute;
	left:						0;
	top:						13%;
	width:								370px;
}
DIV#nowPlaying2 {
	font-size:							11pt;
	line-height:						115%;
	position:							absolute;
	left:						450px;
	top:						13%;
	width:								370px;
}
DIV#nowPlaying3 {
	font-size:							11pt;
	line-height:						115%;
	position:							absolute;
	left:						900px;
	top:						13%;
	width:								370px;
}
DIV#nowPlaying4 {
	position:							absolute;
	left:						1350px;
	top:						25px;
	width:								370px;
}
DIV#radioFeature P {
	color:								orange;
	font-style:							italic;
	line-height:						133%;
	padding:								0.2em 0em;
	text-indent:						0;
}

DIV#radioControls {
	font-size:							10pt;
	line-height:						100%;
	position:							absolute;
	left:						850px;
	top:						2px;
	width:								33%;
	min-width:							320px;
}
DIV#radioControls SPAN {
	position:							relative;
	bottom:								15px;
}
DIV#radioControls TBODY {
	font-size:							9pt;
}
DIV#nowListening {
	font-size:							8pt;
	position:							absolute;
	left:						500px;
	top:						70px;
	width:								33%;
	min-width:							320px;
}
DIV#nowListening TH,
DIV#nowListening TD {
	font-size:							10pt;
	line-height:						110%;
}
DIV#nowListening TH {
	background: grey;
}
DIV#playList {
	font-size:							10pt;
	position:							absolute;
	left:						10px;
	top:						600px;
	width:								33%;
	min-width:							320px;
}

/* Special settings for smaller screens */

@media only screen and (max-width: 1280px) {
	audio {
		height:							35px;
		margin:							0 0 10px 0;
		width:							180px;
	}
	DIV#radioControls SPAN {
		position:						relative;
		bottom:							22px;
	}
}
@media only screen and (max-width: 1024px) {
	audio {
		height:							25px;
		margin:							0 0 20px 0;
		width:							150px;
	}
	DIV#radioControls {
		font-size:						8pt;
		line-height:					100%;
	}
	DIV#radioControls SPAN {
		float:							left;
		position:						relative;
		bottom:							2px;
		/* padding-left:					45px; */
	}
}
@media handheld {
	audio {
		height:							25px;
		margin:							0 0 20px 0;
		width:							150px;
	}
	DIV#radioControls {
		font-size:						8pt;
		line-height:					100%;
	}
	DIV#radioControls SPAN {
		float:							left;
		position:						relative;
		bottom:							2px;
		padding-left:					45px;
	}
}
@media all and (max-width: 800px) {
	DIV#radioFeature {
		left:								55%;
		min-width:						300px;
		width:							45%;
	}
	DIV#radioControls,
	DIV#nowListening,
	DIV#playList {
		min-width:						300px;
		width:							45%;
	}
	DIV#radioControls SPAN {
		float:							left;
		position:						relative;
		bottom:							2px;
		padding-left:					45px;
	}
}

/* Bible study area
	----------------		*/
DIV.BibleStudy {
	width:					500px;
}
DIV.BibleStudy P {
	margin-top:				1em;
}
DIV.BibleStudy P.left {
	line-height:			150%;
	margin:					10px 0 0 0;
	text-align:				left;
	text-indent:			0;
}
DIV.BibleStudy SPAN.right {
	float:					right;
	font-size:				10pt;
	line-height:			120%;
}
DIV.BibleStudy INPUT {
	line-height:			100%;
}
DIV.BibleStudy INPUT.button {
	background:				#553b3b;
	color:					#ff9;
	font-size:				11pt;
	padding:					3px 1.5em;
	-moz-border-radius:	7px;
}
DIV.BibleStudy SELECT {
	background:				#553b3b;
	color:					#ff9;
	font-size:				10pt;
	padding:					1px 5px;
}
DIV.BibleStudy H3 {
	margin-top:				2em;
}

/* --------
	Document
	--------		*/
DIV#preface {
	font-size:							12pt;
}
DIV.doc {
	margin:								5%;
	width:								80%;
	max-width:							var(--max_width);
}
DIV.doc H1 {
	line-height:						120%;
	margin:								1em 0;
}
DIV.doc P.author,
DIV.doc2col P.author {
	float:								right;
	font-size:							12pt;
	font-style:							italic;
	text-align:							right;
	width:								18em;
}
DIV.doc P,
DIV.doc UL,
DIV.doc OL {
	color:								white;
	line-height:						150%;
	font-family:						Georgia, FreeSerif, "Liberation Serif", serif;
	font-size:							15pt;
	margin:								0 20px 7px 20px;
	text-indent:						2em;
	width:								90%;
	max-width:							var(--max_line_width);
}
DIV.doc_mobi P,
DIV.doc_mobi UL,
DIV.doc_mobi OL {
	color:								white;
	line-height:						150%;
	font-family:						Georgia, FreeSerif, "Liberation Serif", serif;
	font-size:							12pt;
	margin:								0 10px 7px 10px;
	text-indent:						2em;
	width:								100%;
	max-width:							var(--max_line_width);
}
DIV.doc UL,
DIV.doc OL {
	margin-left:			40px;
	text-indent:			0;
}
DIV.doc OL {
	list-style-type:		none;
	counter-reset:			ol-counter;
}
DIV.doc OL > LI {
	border-left:			2px solid #ccc;
	margin-bottom:			20px;
	min-height:				3em;
	padding-left:			0.5em;
	position:				relative;
}
DIV.doc OL > li:before {
	position:				absolute;
		top:				0;
		left:			-1.5em;
		width:		1.2em;
	content:					counter(ol-counter, upper-roman);
	counter-increment:	ol-counter;
	font-size:				20pt;
	font-weight:			normal;
	line-height:			1;
	text-align:				right;
}
DIV.doc P.dropcap {
	text-indent:				0;
}
P.dropcap:first-letter {
	color:						#ccc;
	display:						block;
	float:						left;
	font-family:				Georgia, "Liberation Serif", serif;
	font-size:					160px;
	line-height:				100px;
	margin:						-5px 0 2px 0;
	text-indent:				0;
}
DIV.doc P.quotation,
DIV.doc blockquote P,
DIV#book_page blockquote P {
	color:						#bfb;
	font-family:				"EB Garamond", Georgia, serif;
	font-size:					18pt;
	margin:						1em 0;
	padding:						0 3em;
	text-indent:				0;
	max-width:					var(--max_quote_width);
}
DIV#book_page blockquote P {
	font-size:					20pt;
	margin:						1em 2em;
	padding:						0;
}
/* 2-column layout */
DIV.doc2col {
	column-count:				2;
	column-gap:					3em;
	column-rule:				1px solid blue;
	line-height:				133%;
	padding:						0;
	max-width:					1280px;
}
DIV.doc2col H2 {
	column-span:				all;
}
DIV.doc2col P {
	font-family:				Georgia, "Liberation Serif", serif;
	line-height:				125%;
	margin:						0 0 10px 1em;
	padding:						0 7px 0 0;
	text-indent:				2em;
}
DIV.doc2col P.dropcap {
	text-indent:				0;
}
DIV.keep_together {
	-webkit-column-break-inside:	avoid;
	page-break-inside:				avoid;
	break-inside:						avoid;
}

/* Varying columnar layout */
.column {										/* default: four columns */
	float: left;
	width: 25%;
}
@media screen and (max-width: 992px) {	/* if <= 992px use two columns */
	.column {
		width: 50%;
	}
}
@media screen and (max-width: 600px) {	/* if <= 600px use one column */
	.column {
		width: 100%;
	}
}

/*	--------------------
 * Long document (book)
 * -------------------- */
DIV#book_title {
	font-family:						"EB Garamond", Verdana, sans-serif;
}
DIV#book_title H1 {
	color:								#CEA;
	margin-bottom:						0;
	text-align:							center;
	width:								100%;
}
DIV#book_title H2 {
	margin:								0;
	text-align:							center;
	width:								100%;
}
DIV#book_title H3 {
	margin:								0.2em 0 1em 0;
	text-align:							center;
	width:								100%;
}
DIV.refs,
SPAN.ref {								/* SPAN.ref is for a Bible citation like (YLT), but I forget what DIV.refs was for */
	font-size:							11pt;
}
@media screen and (min-width: 1150px) {
	DIV#book_title {
		position:						relative;
		left:					400px;
		top:					0;
		max-width:						750px;
	}
	DIV#book_title H1 {
		font-size:						60pt;
	}
	DIV#book_title H2 {
		color:							#0b0;
		font-size:						36pt;
	}
	DIV#book_title H3 {
		color:							#090;
		font-size:						20pt;
	}
	DIV#book_page {
		position:						absolute;
		left:					400px;
		top:					300px;
		max-width:						750px;
	}
	DIV#book_page P#updated {
		float:							right;
		font-size:						10pt;
		font-style:						italic;
		margin:							3em;
	}
	DIV#book_page H1,
	DIV#book_page H2,
	DIV#book_page H3,
	DIV#book_page H4 {
		margin:							0.5em 0;
	}
	DIV#book_page a {
		color:							#ffff9d;
		font-weight:					normal;
		text-decoration:				none;
	}
	DIV#book_page a:hover {
		color:							blue;
	}
	DIV#book_page LI {
		color:							inherit;
	}
	DIV.refs,
	SPAN.ref {
		font-size:						10pt;
	}
}
@media screen and (max-width: 1149px) {		/* Smaller screens, including mobile */
	DIV#book_title {
		margin:							0;
		padding:							0;
	}
	DIV#book_title H1 {
		color:							#FEA;
		font-size:						28pt;
	}
	DIV#book_title H2 {
		color:							#CEA;
		font-size:						20pt;
	}
	DIV#book_title H3 {
		color:							#BEA;
		font-size:						14pt;
	}
	DIV#book_page {
		position:						relative;
		max-width:						100%;
	}
	DIV.book_page P,
	DIV.book_page UL,
	DIV.book_page OL {
		color:							white;
		line-height:					150%;
		font-family:					Georgia, FreeSerif, "Liberation Serif", serif;
		font-size:						12pt;
		margin:							0 10px 7px 10px;
		text-indent:					2em;
		width:							100%;
		max-width:						var(--max_line_width);
	}
	DIV#book_page P#updated {
		float:							right;
		font-size:						10pt;
		font-style:						italic;
		margin:							3em;
		padding:							0;
		text-indent:					0;
	}
	DIV#book_page H1,
	DIV#book_page H2,
	DIV#book_page H3,
	DIV#book_page H4 {
		margin:							0.4em 0;
		padding:							0.2em 0;
	}
	DIV#book_page a {
		color:							#ffff9d;
		font-weight:					normal;
		text-decoration:				none;
	}
	DIV#book_page a:hover {
		color:							blue;
	}
	DIV#book_page LI {
		color:							inherit;
	}
	DIV#book_page blockquote P {
		font-size:						15pt;
		margin:							1em 0.1em 1em 0;
		padding:							0;
	}
	DIV.refs,
	SPAN.ref {
		font-size:						10pt;
	}
}
DIV#toc {
	color:								#770;
	font-family:						"Liberation serif", Verdana, sans-serif;
	font-size:							12pt;
	padding-bottom:					2em;
	position:							fixed;
	left:						10px;
	top:						130px;
	width:								370px;
}
DIV#toc_mobi {
	color:								#770;
	font-size:							12pt;
	padding-top:						2em;
}
DIV#toc H1,
DIV#toc H2,
DIV#toc H3,
DIV#toc H4 {
	font-family:						sans-serif;
	margin:								0;
	text-indent:						0;
}
DIV#toc H1 {
	color:								#CEA;
	font-size:							12pt;
	padding:								0.5em 0 0 0;
}
DIV#toc H2 {
	color:								#0c0;
	font-size:							12pt;
	font-weight:						normal;
	padding:								0 0.5em;
	text-indent:						-0.5em;
}
DIV#toc H3 {
	color:								#090;
	font-size:							11pt;
	font-weight:						normal;
	padding:								0 0.5em;
	text-indent:						-0.5em;
}

DIV#toc P {
	font-weight:						normal;
	line-height:						133%;
	margin:								5px 0 0 1em;
	padding:								0.5em 0 0.5em 0;
}
DIV#toc H1:hover,
DIV#toc H2:hover,
DIV#toc H3:hover,
DIV#toc H4:hover {
	color:								#15160e;
	background:							#DFDFDF;
	text-decoration:					none;
}
DIV#toc HR {
	color:								gold;
	margin-left:						0;
	margin-right:						auto;
	text-align:							left;
	width:								50%;
}
DIV#toc_mobi BUTTON {
	background-color:					#333;
	border-bottom:						2px solid black;
	border-left:						2px solid #e0e0e0;
	border-right:						2px solid #777;
	border-top:							1px solid #ddd;
	border-radius:						7px;
	color:								#CEA;
	font-size:							12pt;
	font-style:							normal;
	font-weight:						bold;
	line-height:						200%;
	margin-bottom:						5px;
	outline:								none;
	padding:								2px 4px;
	text-align:							left;
	width:								20em;
}



/* ----------------------------
 * Quote of the day and Weather
 * ---------------------------- */

DIV#quote,
DIV#quote P {
	color:						gold;
	font-size:					12pt;
	line-height:				133%;
	margin:						2em 0 0 0;
	width:						550px;
}
DIV#quote H1 {
	color:						#eca3b4;
	font-size:					12pt;
	font-weight:				bold;
	margin:						0 0 0.4em -19px;
}
DIV#quote P {
	color:						gold;
	margin:						0;
	text-indent:				0;
}
DIV#quote SPAN#author {
	float:						right;
	font-size:					10pt;
	margin:						0.2em 3em;
}
DIV#quote P.options {
	font-size:					9pt;
	margin:						2em 0 1em 0;
	text-align:					left;
	text-indent:				0;
}
DIV#meteo {
	position:					fixed;
	top:							10px;
	left:							550px;
}
DIV#meteo H1 {
	font-size:				11pt;
	font-weight:			bold;
	font-style:				italic;
	margin-bottom:			0;
}
DIV.meteo TD.img {
	background:				brown;
}
DIV#meteo P {
	font-size:				9pt;
	margin:					3px 9px;
	text-indent:			0;
	width:					250px;
}
DIV#meteo TH {
	background:				#34381c;
	color:					#a7b557;
	font-size:				9pt;
}
DIV#meteo SUP {
	font-size:				8pt;
}
DIV#meteo TD {
	font-size:				9pt;
}
DIV#meteo TD.temp {
	font-family:			FreeSerif, serif;
	font-weight:			light;
}
DIV#meteo TD.temp SPAN.tempC {
	font-size:				24pt;
}
DIV#meteo TD.temp SPAN.tempF {
	font-size:				11pt;
	padding-left:			1em;
}
DIV#meteo TD.historical {
	font-size:				10pt;
	font-weight:			normal;
	position:				relative;
}
DIV#meteo TD SPAN.wind_mph {
	color:					#a7b557;
	padding-left:			1em;
}


/*	-----------------
 *	Bookmarks
 *	-----------------
 *	*/

DIV.bookmarks TABLE {
	width:								750px;
}
DIV.bookmarks TD {
	border-bottom:						1px dotted gold;
}


/* -----------------
 * Tables
 * -----------------
 * */
TABLE.articles {
	padding-top:						0;
	width:								var(--max_width);
}
THEAD {
	font-size:							12pt;
	font-weight:						bold;
}
TBODY {
	font-size:							12pt;
	font-weight:						normal;
}
TR.articles>TD {
	padding-bottom:					0.7em;
}
TD {
	color:								#ccc;
	padding:								0 3px 0 3px;
}
TD.middlecol {
	border-bottom:						1px dotted silver;
	padding-right:						3em;
}
SPAN.shaded {
	background-color:					rgba(24,24,24,0.7);
}
TH {
	background:							#bfc;
	color:								#070;
	padding-left:						5px;
	text-align:							left;
}

TABLE.meetings TD {
	border-bottom:			1px solid white;
}


TABLE.radio {
	font-size:				11pt;
}
TABLE.radio TH {
	background:				none;
	font-weight:			bold;
	line-height:			110%;
	margin:					0;
	padding:					0;
	text-align:				right;
}
TABLE.radio TD {
	line-height:			110%;
	margin:					0;
	padding:					0 0 0 10px;
}
TABLE.radio TR.artist {
	font-size:				13pt;
}
TABLE.radio TR.artist TH {
	color:					#0d0;
}
TABLE.radio TR.song {
	font-size:				12pt;
}
TABLE.radio TR.song TH {
	color:					#0e0;
}
TABLE.radio TR.album {
	font-size:				11pt;
}
TABLE.radio TR.album TH {
	color:					#0c0;
}
TABLE.radio TR.time {
	font-size:				10pt;
}
TABLE.radio TR.time TH {
	color:					#0b0;
}
TABLE.radio TR.year {
	font-size:				9pt;
}
TABLE.radio TR.year TH {
	color:					#0a0;
}
TABLE.radio TR.genre {
	font-size:				8pt;
}
TABLE.radio TR.genre TH {
	color:					#090;
}


DIV#playlist0 {
	position:							absolute;
	top:					0;
	left:					0;
	width:								460px;
}
DIV#playlist1 {
	background-color:					rgba(24,24,24,0.5);
	position:							absolute;
	top:					0;
	left:					465px;
	width:								460px;
}
DIV#playlist2 {
	background-color:					rgba(24,24,24,0.5);
	position:							absolute;
	top:					0;
	left:					930px;
	width:								460px;
}
DIV#playlist3 {
	background-color:					rgba(24,24,24,0.5);
	position:							absolute;
	top:					0;
	left:					1400px;
	width:								460px;
}
DIV#playlist0 H4,
DIV#playlist1 H4,
DIV#playlist2 H4,
DIV#playlist3 H4 {
	color:								#90a0f0;
	line-height:						125%;
	margin-bottom:						9px;
}
TABLE.playlist {
	margin-top:							-10px;
	font-size:							10pt;
	width:								350px;
}
TABLE.playlist TH {
	background:				none;
	font-weight:			bold;
	line-height:			110%;
	margin:					0;
	padding:					0;
	text-align:				right;
}
TABLE.playlist TD {
	line-height:			110%;
	margin:					0;
	padding:					0 0 0 10px;
}
TABLE.playlist TR.artist {
	font-size:				12pt;
}
TABLE.playlist TR.artist TH {
	color:					#0d0;
}
TABLE.playlist TR.song {
	font-size:				11pt;
}
TABLE.playlist TR.song TH {
	color:					#0e0;
}
TABLE.playlist TR.album {
	font-size:				10pt;
}
TABLE.playlist TR.album TH {
	color:					#0c0;
}
TABLE.playlist TR.time {
	font-size:				9pt;
}
TABLE.playlist TR.time TH {
	color:					#0b0;
}
TABLE.playlist TR.year {
	font-size:				8pt;
}
TABLE.playlist TR.year TH {
	color:					#0a0;
}
TABLE.playlist TR.genre {
	font-size:				7pt;
}
TABLE.playlist TR.genre TH {
	color:					#090;
}



INPUT.button {
	background:				#aeb;
	color:					#070;
	font-family:			"Liberation Sans", "Trebuchet MS", Arial, sans-serif;
	font-size:				9pt;
	font-weight:			bold;
	padding:					0 7% 0 7%;
	-moz-border-radius:	7px;
}
INPUT.button:hover {
	background:				#ff7;
	color:					black;
}
BUTTON.view {
	line-height:			100%;
	margin:					0;
	padding:					0;
	text-align:				center;
	width:					4.5em;
}
BUTTON#show_hide {
	text-align:				left;
	width:					auto;
}


/* -----------------
 * Footer
 * ----------------- */
#footer {
	background:				#333;
	font-size:				10px;
	padding:					5px 4px 4px 0;
	position:				fixed;
		height:				10px;
		width:				100%;
		top:					auto;
		right:				0;
		bottom:				0;
		left:					0px;
	}
#footer p {
	color:					#4b5;
	font-size:				10px;
	line-height:			170%;
	margin:					4px 0 0 0;
	position:				static;
	text-decoration:		none;
	}
#footer a, #footer a:link:visited {
	color:					#99a;
	font-size:				10px;
	padding:					0 5px 0 5px;
	}
#footer a:hover {
	background-color:		#777;
	color:					#ff7;
	text-decoration:		none;
	}
#footer .rightbottom {
	font-size:				10px;
	position:				fixed;
		top:					auto;
		right:				0;
		bottom:				-1px;
		left:					auto;
	padding:					0 7px 0 0;
	}
#footer .leftbottom {
	font-size:				10px;
	text-indent:			0;
	position:				fixed;
		top:					auto;
		right:				auto;
		bottom:				0;
		left:					0;
	padding:					0 0 0 7px;
	}
#footer .centrebottom {
	font-size:				10px;
	position:				absolute;
		top:					auto;
		bottom:				-1px;
	text-align:				center;
	width:					100%;
	}