﻿/**
 * Eric Meyer's Reset CSS v2.0 (http://meyerweb.com/eric/tools/css/reset/)
 * http://cssreset.com
 */
html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline; 	
}

/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {
	line-height: 1;
}
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}

/** The Trio default CSS */

/** Global */

body {
	font-family: Arial, Helvetica, sans-serif;
	font-size: small;
	color:#222222;
	margin:0px; padding:0px;
/*	background-color:#b50000; */
	background-image: url('../images/Red Grunge Blurred.jpg');
	background-size: cover;
}

/** Headers **/

h1 {
	font-family: "Monotype Corsiva";
	font-size: xx-large;
	font-weight: bold;
	color:white;
	padding-bottom:10px;
}
h2 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: large; font-weight:bold;
	color:#222222;
}
h3 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: x-large;
	font-weight: bold;
	color:#FFFFFF;
	text-align:left;
}
h4 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: large;
	font-weight: bold;
	color:#b50000;
}
h5 {
	font-family:"Segoe UI", Tahoma, Geneva, Verdana, sans-serif;
	font-size: small;
	font-style:italic; font-weight: bold;
	color:#b50000;	}
	
h6 {
	font-family: Arial, Helvetica, sans-serif;
	font-size: x-small;
	font-style:italic;
	color:b50000;
}

/** Links */

a 			{ color: #b50000; }
a:visited 	{ color: #000000; }
a:active 	{ color: #FFFF00; }
a:hover 	{ color: #FFFF00; }
a:focus 	{ color: #000000; }


/** Class CSS **/

.blue {
	color:#00FFFF;
	}
	
.linebar { height: 5px; background-color:#b50000;  }
	
.images_border {
	border:thin maroon solid;
}


.multileft { float:left;
			width: 30%; 
			 }

.multicenter { float:left;
			width: 
			30%; 
			padding: 0px 10px;
			 }
			 
.multileft2 { float:left;
			width: 25%; 
			 }

.multiright2 { float:left;
			width: 42%; 
			 }

.leftimg {
	 float:left; padding:10px;
}

.gocenter {  text-align:center;
}

/** Section CSS **/

/** @media screen and (max-width:480px) {
       #leftnav
  **/

#wrapper {
	width: 800px;
	margin: 0px auto 0px auto;
	padding: 0px;
	background-color:#b50000;  }
	
#banner { padding:0px; 	clear:both; margin-top: -17px; }
#banner-image { margin-top:0;
			float:left; }
#banner-text { margin-top:20px; margin-right:20px;
			float:right; text-align:center; }
#topnav { 	clear:both;		}
#topnav ul 			{ width:100%; float:left; margin:-2px 0px 0px 0px;  background-color: 	#000000;}
#topnav ul li		{ display:inline; } 
#topnav ul li a		{ float:left; padding: 10px 16px; margin: 5px 5px; 
						text-align:center; background-color: #444444;}

#topnav a 			{ text-decoration:none; }
#topnav a:link 		{ color:white; }
#topnav a:visited	{ color:white; }
#topnav a:active	{ color:white; }
#topnav a:hover		{ color:white; background-color:#b50000; }
#topnav a:focus		{ color:white; }

#mainimg { 	width:100%;
			padding:0px; 
			float:left; 
		}
	
#twitter {	margin-top::175;
			width:200; 
			float:right;}


#leftnav { width:150px; 
			float:left;
			padding:10px 10px; 
			line-height:150%; 
			background-color: 	#333333; 
			clear:both;		}
			
#leftnav ul 		{ width:100%; float:left; margin:0px; background-color: #333333; }
#leftnav ul li a	{ float:left; padding: 5px 5px; }

#leftnav a 			{ text-decoration:none; }
#leftnav a:link 	{ color:white; }
#leftnav a:visited	{ color:white; }
#leftnav a:active	{ color:white; }
#leftnav a:hover	{ color:white; background-color:#600000; }
#leftnav a:focus	{ color:white; }

#main { padding:20px 15px 20px 15px; 
		margin-top: 507px;
		 }
#music2 {
	margin-left: 30px;
	margin-top:20px;
}
	 

#main2 { min-height:450px; 
	margin-top: 42px; clear:none;
		padding:20px 15px 20px 15px; 
		line-height:110%;
		background-color:#FEE9E6;}
		
#main3 { padding:20px 15px 20px 15px; 
		margin-top: 42px;
		text-align:center;
		 }
		
#about {
	 float:left; 
	 width: 550px; }

#trioimg {
	 float: right;
}
#multicol1 { margin-top:25px; float: left; width: 100%;
			 }
			 
#multicol2 { margin-top:5px; float: left; width: 100%;
			 }

#linebar {  border-width:10px; color:maroon; }

#videolist   { float: left;
	 width: 20%;  line-height: 180%;
	font-size:small;  }
	
#videolist  a 			{ text-decoration:none; }
#videolist  a:link 	{ color:red; }
#videolist  a:visited	{ color:red; }
#videolist  a:active	{ color:blue; }
#videolist  a:hover	{ color:red; }
#videolist  a:focus	{ color:red; }

#links  a 			{ text-decoration:none; }
#links a:link 		{ color:red; }
#links a:visited	{ color:red; }
#links a:active		{ color:blue; }
#links a:hover		{ color:blue; }
#links a:focus		{ color:red; }




#video1 {  float: right;
	 width:78%;  
	 text-align:center;
}

#video2 {  text-align:center;
}


#twitter  { float: left;
	 width: 20%;
	 text-align:center;
}

#youtube {  float: right;
	 width:75%;
	 text-align:center;
	 }

#events  { float: left;
	 width: 20%;
}

#calendar {  float: right;
	 width:78%;
}


#otherbold 		{ font-weight:bold;  }
#otherbold li 	{ line-height:120%; }

#other 			{ font-weight:normal; }	
	
#video	{margin-left:50px; }

#footer-image { margin-top: -55px; float:left; clear:none;}

#footer {  	width:97%;
	min-height: 60px;
	margin-top: -33px;
	padding:10px 10px;
	clear:both;
	background-color:#ECE8DD;  	}
			
#foot-left { 
	width:32%;
	text-align:left; 
	margin-top: 20px;
	line-height:100%; 
	float:left;}
	
#foot-center { 
	width:32%;
	 text-align: center;
	 line-height:100%;
	 float:left;  }
	 
#foot-right {  
	width:32%;
	text-align:right;
	margin-top: 20px;
	line-height:100%; 
	float:left;