@charset "utf-8";
/* CSS Document */


@charset "utf-8";

/* CSS Document */

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,blockquote,th,td { 
	padding: 0;
	margin: 0;
	
	}
table {
	border-collapse: collapse;
	border-spacing: 0;
	}
fieldset,img { 
	border: 0;
	}
address,caption,cite,code,dfn,em,strong,th,var {
	font-weight: normal;
	font-style: normal;
	}
ol,ul {
	list-style: none;
	}
caption,th {
	text-align: left;
	}
h1,h2,h3,h4,h5,h6 {
	font-weight: normal;
	font-size: 100%;
	}
q:before,q:after {
	content:'';
	}
abbr,acronym { border: 0;
	}
	
:active, :focus { outline-style: none; -moz-outline-style:none; outline-color: #000; 
}


body  {

	background-image: url(../images/background3.png);
	background-repeat:no-repeat;
	background-color: #333948;
	background-position: top;
	font-family:Verdana, Geneva, sans-serif;
	font-size:62.5%;
	color: #24243b;
}
a {
	text-decoration: none;
	outline:none;
	color: #31813c;
}
a:hover {
	
	text-decoration: underline;
}


p {
	line-height:1.5em;
	font-size:1em;
	margin-top:1.5em;
	margin-bottom:1.5em;
	}

 #container { 

	width: 780px;  /* using 20px less than a full 800px width allows for browser chrome and avoids a horizontal scroll bar */
	background:  #fff;
	margin: 45px auto;  /*the auto margins (in conjunction with a width) center the page */
	border: .006em .006em 0 .006em solid #ffffff;
	text-align: left; /* this overrides the text-align: center on the body element. */
} 

 #header { 
	height: 197px;
} 

#nav {
	width: 780px;
	background-color: #A3A8AE;
}

#nav ul{
	font-family:Geneva,Arial,Helvetica, sans-serif;
	display:inline;
}

#nav ul li{
	display: inline;
	margin-right:35px;
	padding: 0 25px;
	font-variant:small-caps;
	font-size: 1.5em;
	}

#nav ul li a{
	color: #036;
	text-decoration: none;
	letter-spacing: .15em;
	
	}

#nav ul li a:hover  {
	color: #fff;
	}

#nav ul li.current {
	margin-right:25px;
	background-color: #333948;
	color:#FFF;
}

#admin {
	margin-top: 20px; padding: 10px; background-color:#E2E2E2; text-align: center;
	}

 #sidebar1 {
	float: right; /* since this element is floated, a width must be given */
	width:330px; /* the actual width of this div, in standards-compliant browsers, or standards mode in Internet Explorer will include the padding and border in addition to the width */
	padding:0px 15px 0px 0px;
	margin: 10px 0 10px 10px;
}
	
	
 #sidebar1 a:hover {
	text-decoration:underline;
}

 #mainContent {
	margin: 10px 350px 10px 0; /* the right margin on this div element creates the column down the right side of the page - no matter how much content the sidebar1 div contains, the column space will remain. You can remove this margin if you want the #mainContent div's text to fill the #sidebar1 space when the content in #sidebar1 ends. */
	padding: 0px 15px 10px 20px; /* remember that padding is the space inside the div box and margin is the space outside the div box */
	min-height:360px;

}

#sponsor { 
	padding: 0 20px 0 20px; /* this padding matches the left alignment of the elements in the divs that appear above it. */
} 

.clearfloat { /* this class should be placed on a div or break element and should be the final element before the close of a container that should fully contain a float */

	clear:both;
    height:0;
    font-size: 1px;
    line-height: 0px;

}


.hr {
	border:0;
	width: 100%;
	height:1px;
	background-color:#9A1614;
}

#contribute {
	text-align:left;
	width: 100%;
}

#contribute h3{
	margin:0px 0px; font-size:1em;font-weight:bold;
}

.sponsor {
	width:68%;float:right;
	}

.sponsor ul{
	font-family:Geneva,Arial,Helvetica, sans-serif;
}

.sponsor ul li{
	display: inline;
	padding-right:15px;
	}


.presentedBy {
	width:29%; float:left; text-align:left;padding-left:20px;
	}
#recommend {
	padding-left:20px;
	padding-right:20px;
	}

#section1 {
	/*float:left;*/
	width: 100%;
	/*padding-left: 20px;*/
	}
#recommend1 {
	width:48%; float:left;
	}
#recommend2 {
	width:48%;	float:right;
	}
	
#section2 {
	/*float:right;*/
	width: 100%;
	/*padding-right: 20px;*/
	}	
#recommend3 {
	width:48%; float:left;
	}
#recommend4 {
	width:48%;float:right;
	}		


#footer {
	color:#FFFFFF;
	background-color:#7286A7;
	height:20px;
	font-size:.85em;
	text-align:center
}

#footer a {
	text-decoration:underline;
	color:#fff;}

.bold {font-weight:bold}

.em {
	font-style:italic;
}

h1 {font-size:2em;line-height:1em;margin-top:0;margin-bottom:1em; color:#B42E0C;}
h2 {font-size:1.5em;line-height:1.5em;margin-top:1.286em;/*margin-bottom:1.286em;*/color:#B42E0C;}
h3 {font-size:1.2em;line-height:1.5em;margin-top:1.5em;margin-bottom:1em;color:#24243b;}
h4 {font-size:0.85em;line-height:1.5em;	margin-top:1.8em;margin-bottom:1.8em;color:#24243b;font-weight:bold;letter-spacing:.05em;}
h5 {font-size:0.70em;line-height:2em;margin-top:2em;margin-bottom:2em;color: #24243b;}


#mainContentTabs {
	margin: 0px 0px 0 0; /* the right margin on this div element creates the column down the right side of the page - no matter how much content the sidebar1 div contains, the column space will remain. You can remove this margin if you want the #mainContent div's text to fill the #sidebar1 space when the content in #sidebar1 ends. */
	padding: 15px 15px 10px 20px; /* remember that padding is the space inside the div box and margin is the space outside the div box */
	background-color:#FFFFFF;
	position:relative;
	

}

/* root element for tabs  */
ul.css-tabs {  
	margin:0 !important; 
	padding:0;
	height:30px;
	border-bottom:1px solid #666;	 	
}

/* single tab */
ul.css-tabs li {  
	float:left;	 
	padding:0; 
	margin:0;  
	list-style-type:none;	
}

/* link inside the tab. uses a background image */
ul.css-tabs a { 
	float:left;
	font-size:13px;
	display:block;
	padding:5px 28px;	
	text-decoration:none;
	border:1px solid #666;	
	border-bottom:0px;
	height:18px;
	background-color: #efefef;
	color:#777;
	margin-right:2px;
	-moz-border-radius-topleft: 4px;
	-moz-border-radius-topright:4px;
	position:relative;
	top:1px;	
}

ul.css-tabs a:hover {
	background-color: #B7CB29;
	color:#333;
}
	
/* selected tab */
ul.css-tabs a.current {
	background-color:#ddd;
	border-bottom:2px solid #ddd;	
	color:#000;	
	cursor:default;
}



/* tab pane */
div.css-panes div {
	display:none;
	border:1px solid #666;
	border-width:0 1px 1px 1px;
	height:504px;
	overflow:auto;
	padding:10px 20px 10px 20px;
	background-color:#ddd;
}

div.css-panes div a{
	display:block;
	width: 275px;
	color:#31813c;
	font-weight:normal;
	line-height:.15em;
}

div.css-panes a:hover{
	font-weight:bold;
	color:#B42E0C;
	text-decoration:none;
}

div.css-panes h3 {
	margin:5px 0px 8px 0px;
	font-size:1.2em;
	line-height:1.5em;
	color:#24243b;
	}

#t1 img{
	position:absolute;
	top:130px;
	margin-left:300px;
}

#t2 img{
	position:absolute;
	top:130px;
	margin-left:300px;
}

#t3 img{
	position:absolute;
	top:130px;
	margin-left:300px;
}

#t4 img {
	position:absolute;
	top:130px;
	margin-left:270px;
	}

/*Words and Music Logo*/
#wordsAndMusicLogo {
	background-image: url(../2010/images/wordsAndMusic190x127.gif);
	display: block;
	width:190; 
	height:127;
	text-indent:-9999px;
	text-decoration: none;
	
	}

#wordsAndMusicLogo h2 a {
	text-decoration:none;
}

#wordsAndMusicLogo h2 a:hover {
	text-decoration:underline;
	}
	
.nowPlayingLogo {
	width:150px;
	float:left;
	margin-right:5px;
	}
	
#Accordion {
	margin-top: 20px;
	}
#Accordion .AccordionPanelContent {
	padding-top:20px;
	overflow:hidden;
	}	

.demo {
	margin-top: 20px;
}

.demo h1 h2 h3 h4 h5  {
	color:#24243b;
	}

.demo #accordion p  {
	color: #24243b;
}

.demo #accordion p a {
	color: #31813c;
}

#academy {
	background-color:#d3d3d3;
	padding:5px 10px;
	}