/* ----------------------------------------------
   HTML ELEMENTS
------------------------------------------------- */ 

/* Top Elements */
* { margin: 0; padding: 0; outline: 0 }

body {
	font: 13px/180% "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
	color: #FFFFFF; 
	margin: 0 0 40px 0; padding: 0;
	background: #333 url(../images/bg.jpg) no-repeat top center;
	letter-spacing: 1px;
}

/* Links */
a {
	text-decoration: none;
	color: #FF0000;
}
a:hover {
	color: #FFF;
	border-bottom: #C80000 1px solid;
}

/* Headers */
h1, h2, h3, h4 {
	font: "Trebuchet MS", Verdana, Arial, Helvetica, sans-serif;
	color: #FFF;
	padding: 0 0 18px 0;
	margin: 0;
}
h1  {
	font-size: 24px;
	font-weight: normal;
	letter-spacing: 2px;
}
h2  {
	font-size: 18px;
	font-weight: normal;
	letter-spacing: 2px;
	padding-bottom: 5px;
}
h3  {
	font-size: 14px;
	font-weight: bold;
	letter-spacing: 4px;
	padding-bottom: 3px;
}
h4  {
	font-size: 12px;
	font-weight: bold;
	letter-spacing: 3px;
	padding-bottom: 5px;
}


p, dl { padding: 0 0 18px 0; margin: 0; }

ul, ol {
	margin: 10px 10px;
	padding: 0 10px;
}
ul { list-style: none; }

/* Images */
img {
    border: none;
}
img.float-right {
  	margin: 3px 0px 0px 10px;  
}
img.float-left {
  	margin: 3px 10px 0px 0px;
}

/* start - table */
table {
	border-collapse: collapse;
	margin: 15px 0;
}
th {
	background-color: #610C0C;
	height: 30px;
	padding: 0 12px;
	text-align: left;
	border: 1px solid #990000;
}
tr {
	height: 30px;
}
td {
	padding: 0 11px;
	border: 1px solid #C80000;	
}	

table.noborder,table.noborder td{border:none; vertical-align:top;}
/* end - table */

/* ------------------------------------------
   LAYOUT
------------------------------------------- */ 
#container {
	margin: auto;
	width: 960px;
	height: 700px;
}
#header-wrap {
	background: transparent;
	width: 960px;
	height: 170px;
	margin-top: 26px;
}
#header-wrap img.logo {
	border: none;
	float: left;
	width: 310px; height: 168px;
} 
#header {
	float: right;
	width: 648px;
	height: 160px; 
	margin-top: 12px;
	z-index: 1;
}
#header img {
	border: none;
	margin: 0; padding: 12px;
	width: 180px; height: 130px;
} 
#header img.border {
	border-left: #C80000 2px solid;
	margin: 0; padding-left: 15px;
}

/*  Navigation  */
#nav {
	float: left;
	margin: 0;
	padding: 20px 0 0 20px;
	width: 120px;
}
#nav ul {
	list-style: none;
	margin: 0;
	padding: 0 0 5px 0;
}
#nav ul li {
	margin: 0;
	padding: 10px 0 5px 0;
}
#nav ul li a {
	margin: 0;
	padding: 3px 0;
	font-size: 16px;
	font-weight: bold;
	text-decoration: none;
	color: #FFF;
}
#nav ul li a:hover, 
#nav ul li a:active {
	border-bottom: #C80000 2px solid;
}
#nav ul li a.active-tab {
	border-bottom: #C80000 2px solid;
}


/*  Content Area  */
.contentarea {
	float: right;
	display: none;
	margin: 0;
	padding: 36px 30px 0 0;
	width: 750px;
	height: 380px;
}
.contentarea.active-tab-body {
	display: block;
}
.pad_lft {
	padding-left:30px;
}


.contentarea .rightcol{
	float: right;
	clear: none;
	margin: 25px 0 25px 25px;
	padding: 15px 0 15px 15px;
	width: 150px;
	height: 290px;
	border-left: #BF0000 1px solid;
}
.contentarea .rightcol img{
	margin: 0 0 25px 15px;
	padding: 0;
	width: 115px;
	height: 120px;
}
.contentarea ul li {
	list-style-image: url(../images/bullet.gif);
	padding: 0 0 5px 0;
}
.contentarea ul li a.selected  {
	color: #FFFFFF;
	border-bottom: #C80000 1px solid;
}

/*  Footer  */
#footer {
	position: absolute;
	clear: both;
	top: 614px;
	margin-left: 170px;
	padding: 5px 0;
	width: 754px;
	border-top: #BF0000 1px solid;
	z-index: 2;
	font-size: 12px;
	line-height: 150%;
	color: #CCC;
	text-align: right;
}
*:first-child+/**/html #footer {
	margin-left: 30px;
}
#footer p {
	text-align: center;
}
#footer a {
	text-decoration: none;
	color: #CCC; 	
}
#footer a:hover {
	color: #FFF; 	
	border-bottom: #BF0000 1px solid;
}

/*  Music Player  */
#player{
	height: 25px;
	width: 500px;
}

.scrollbar_container {  
	height:375px;
	overflow:auto;
	position:relative;
	width:559px;
} 
 
.scrollbar_track {  
    position:absolute;  
    top:0;  
    right:0;  
    height:100%; 
	 border-right:1px solid; 
    width:10px;  
    background-color:transparent;  
    cursor:move;  
} 
 
.scrollbar_handle {  
    width:10px;  
    background-color:#1a1a1a;  
    cursor:move;  
    -moz-border-radius: 2px;  
    -webkit-border-radius: 2px;  
    opacity:0.9;  
    -moz-opacity:0.9;  
} 
 
.scrollbar_content {  
    overflow:hidden;  
    width:625px;  
    height:300px;  
}

/* thumbnails */
p.thumbs{ padding: 12px 0 0 10px; }

.thumbs img { 
	padding: 6px;
	margin: 8px 12px 8px 6px;
	width: 60px;
	height: 60px;
	background-color: #610C0C;
}
.thumbs img:hover	{
	padding: 5px;
	border: #C80000 1px solid;
}
.thumbs a:hover { background-color: transparent; border: none }

/* alignment classes */
.float-left  { float: left; }
.float-right { float: right; }
.align-left  { text-align: left; }
.align-right { text-align: right; }

/* clearing */
.clearer { clear: both; }
.clear { display:inline-block; }
.clear:after {
	display:block; 
	visibility:hidden; 
	clear:both; 
	height:0; 
	content: "."; 
}
