/* Timothy's Reset (should always be first thing in any css) */

html, body { margin: 0; padding: 0; border: 0;  
				background: transparent; font-size:10px; }

div, span, article, aside, footer, header, hgroup, nav, section,
h1, h2, h3, h4, h5, h6, p, blockquote, a, ol, ul, li, 
table, tr, th, td, tbody, tfoot, thead {
	margin: 0;
	padding: 0;
	border: 0;
	vertical-align: baseline;
	background: transparent;
	}

img 	{ margin:0; padding:0; border:0; }

table, tr, th, td, tbody, tfoot, thead {
	margin: 0; padding: 0; border: 0;
	vertical-align: baseline;
	background: transparent;
	}
	
table { border-collapse: collapse; border-spacing: 0; }
	
input, select, textarea, form, fieldset {
	margin: 0; padding: 0; border: 0;
	}

article, aside, dialog, figure, footer, header, hgroup, nav, section { 
	display:block; }

h1, h2, h3, h4, h5, h6, p, li, blockquote, td, th, a, caption, em, strong, strike { 
	font-family: Arial, Helvetica, sans-serif;
	font-size:100%;
	font-weight: normal;
	font-style: normal;
	line-height: 100%; 
	text-indent: 0;
	text-decoration: none;
	text-align: left;
	color: #000;
	}

ol, ul { list-style: none; }


/* Global */

html 	{	}
body	{background-color:#555555; }   /* Puts grey background on sides, outside wrapper */

------------------------------------------------------------------------------------------------------------

/* Headings */

h1, h2, h3, h4, h5, h6 { font-weight: bold; color: #000; }

h1 { font-family:Cambria, Cochin, Georgia, Times, "Times New Roman", serif; font-size:30px; color:#66FF33; }
h2 { font-size:24px; }
h3 { font-size:20px; }
h4 { font-size:16px; }
h5 { font-size:14px; }
h6 { font-size:14px; }

h1 img, h2 img, h3 img, h4 img, h5 img, h6 img { margin: 0; }



/* Text Elements */

p           	{ color:#000; font-size:12px;   }   /* had line-height:150%; but IE screwed up spacing for video & audio links */
p .left			{ margin: 1.5em 1.5em 1.5em 0; padding: 0; }
p .right 		{ margin: 1.5em 0 1.5em 1.5em; padding: 0; }

a           	{   }
a:link			{  }
a:visited		{ color:  } 
a:active		{ color: }
a:focus			{ color:  }
a:hover     	{ color:  }

blockquote  	{ color:#000; font-size:12px; }

strong      	{ font-weight: bold; }
em		      	{ font-style: italic; }





/* Containers */

#wrapper 			{ width:900px; margin:0px auto; background-color:#ffffff;   }    /* "auto" centers margin in screen, white background */

#top				{ background-color:#000000; height:140px; width:100%; overflow:hidden; 	}    /* height limited div dimension */

#top-left			{ float:left; width:500px;  }
#top-left img		{ margin: 50px 60px;  }

#top-right 			{ float:right; padding:30px 100px 0 0; }

#topnav 			{ background-color:#333333; clear:both; }
#topnav ul			{ width:100%; float:left; margin:0px; background-color:#333333; border-bottom:1px #999999 solid; border-top:1px #999999 solid; }
#topnav	ul li		{ display:inline;   }
#topnav	ul li a		{ float:left; padding:10px 20px; font-size:13px; font-weight:lighter; }

#topnav a:link		{ color:#ffffff;  background-color:#333333;}
#topnav a:visited	{ color:#bbbbbb; }
#topnav a:active	{ color:#ffffff; }
#topnav a:hover		{ color:black;  background-color:#CC3300 }
#topnav a:focus		{ color:#ffffff; }

#banner 			{ background-color:#000000; border-top: 3px #880000 solid;}
#banner img			{ clear:both; width:800px; height:240px; }

#about				{ background-color: #FFEEB9 }
#about h2			{ color: #333333; font-size:28px;   padding:8px 3px 10px 55px; border-bottom:2px #333333 solid; background-color:#aaaaaa; }
#about h3			{ color: #663300 ; background-color:white; font-size:14px; padding: 5px 200px 2px 100px; line-height:160%; font-style: italic;  }
#about h4			{ border-top:2px#777777 solid;  padding:20px 10px 10px 70px; font-size: 16px; }	
#about p			{ margin:16px 25px; font-size:14px; color:#663300  }			

#content 			{ background-color:#fff; float:left; border-top:2px #111111 solid; width:600px; padding:15px; }    /* Tutorial 16 (5:35) */
#content h2			{ border-bottom:2px#777777 solid; padding:6px 10px 15px 90px; }
#content h3			{ border-bottom:2px#777777 solid; padding:6px 10px 15px 50px; }
#content p			{ margin:16px 20px; font-size:13px; line-height:160%; }

#rightside 			{ float:right; background-color:#fff; padding:20px; margin-left:0px; border-top:2px #111111 solid;}   /* Tutorial 16 (17:38) */  
#rightside img		{ padding:10px; border:1px #888888 solid; margin:8px; } 


#sglst-genre		{ width:900px; margin:0px auto; border-top:2px #333333 solid;  }
#sglst-genre h1		{padding:8px 3px 10px 85px; border-bottom:2px #333333 solid; }
#sglst-genre h2		{padding:8px 3px 10px 85px; border-bottom:2px #333333 solid; background-color:#999999; }
 

#sglst-alpha 		{ width:900px; margin:0px auto; border-top:2px #333333 solid; }
#sglst-alpha h2		{padding:8px 3px 10px 85px; border-bottom:2px #333333 solid; border-top:2px #333333 solid; background-color:#999999;  }

#column				.column { float: left; width: 25%;}
#column	h3			{color: #222222;  font-size:16px; padding: 6px 0px 4px 20px; text-decoration: underline; background-color:#cccccc; }			
#column	h4			{color: #663300  ; font-size:13px; padding: 4px 0px 2px 40px;text-decoration: underline;  }
#column	h5			{color: #663300  ; font-size:13px; padding: 6px 0px 1px 80px}   /* brown color as to show letter abbreviation in alpha list */
#column	h6			{color: #555555  ; font-size:12px; padding: 4px 0px 1px 50px; font-style: italic;  }
#column p			{ color: #996633 ; font-size:13px; padding: 0px 0px 0px 20px}
						/* Clear floats after the columns */
					.row:after { content: ""; display: table; clear: both; }


#livelinks			{ background-color:#777777; width:100%; height:270px; overflow:hidden; }

#audiosamples		{ width:400px; float:left; border-top:2px #111111 solid; }
#audiosamples a		{ font-size:16px; }
#audiosamples h3	{ padding:8px 3px 10px 85px; border-bottom:2px #777777 solid;}
#audiosamples a:link	{ color:yellow;  background-color:#777777; line-height:200%; margin-left: 100px;  }
#audiosamples a:visited	{ color:#dddddd; }
#audiosamples a:active	{ color:#ffffff; }
#audiosamples a:hover	{ color:#ffffff;  background-color:#CC3300 }
#audiosamples a:focus	{ color:#ffffff; }


#videosamples		{ width:500px; float:right; border-top:2px #111111 solid;}
#videosamples a		{ color:yellow; font-size:16px; }
#videosamples h3	{ padding:8px 3px 10px 85px; border-bottom:2px #777777 solid; }
#videosamples a:link	{ color:yellow;  background-color:#777777; line-height:170%; margin-left: 100px;  }
#videosamples a:visited	{ color:#dddddd; }
#videosamples a:active	{ color:#ffffff; }
#videosamples a:hover	{ color:#ffffff;  background-color:#CC3300 }
#videosamples a:focus	{ color:#ffffff; }

#contact-form		{background-color:#C7BEB8; }
#contact-form h2	{ text-align:center; color: #663300 ; padding:10px 80px 10px 80px; border-bottom:2px #222222 solid;  background-color:#aaaaaa  }
#contact-form p		{ color: #663300; padding:16px 80px 3px 60px; font-weight:bold; }


#footer 			{ clear:both; background-color:#000000; padding:10px 0; }
#footer p			{ text-align:center; color:#aaaaaa; font-size:10px; }

#box1 {   }

#box2 {   }

#box3 {   }

#box4 {   }

#box5 {   }

#box6 {   }


/* Layout Extra */




/* Navigation Extra */




/* Forms */

form { text-align:left; margin:20px;	}

label, submit, input, textarea {
	border:0; padding:0; margin:0; background:none; 
	}

label { 
	float: left; width: 150px; margin-top:5px; font-size:12px;
	text-align:right; display:block;
	}
	
input, textarea { 
	border:1px #333 solid; margin-left:10px; padding:5px;
	}

input { 
	width: 280px; margin-bottom: 16px; 
	}

textarea {
	width: 280px; height: 120px;
	margin-bottom: 16px;
	}

select {	}

.submit {
	width:90px; height:25px;
	margin-left:140px;
	font-size:12px;
}