@charset "utf-8";
/* CSS Document */
body {
	background-image: url(bg1.gif);
	background-color: #352D21;
	font-style:italic;
	font-weight:bold;
	font-family: Cambria;
	color:#E7D6B5;

}

a {
	font-style:italic;
	font-weight:bold;
	font-family: Cambria;
	color:#E7D6B5;
	text-decoration:none;
	outline:none;
}
a:hover{
	color:#FFF;
}

a.recruit{
	font-style:italic;
	font-weight:bold;
	font-family: Cambria;
	color:#E7D6B5;
	text-decoration:none;
	outline:none;	
}
a.recruit:hover{
	color:#FFF;
}


#wrapper{ 
margin-left: auto ;
margin-right: auto ;
width:1000px;
}

div.filter{
	 width:800px;
	 height:60px;
	 margin-left: auto ;
	 margin-right: auto ;
	 padding: 10px 0px;
	 display:block;
}


div.main_box{
	 width:1000px;
	 margin-left: auto ;
	 margin-right: auto ;
/*     background-color:	#532F28;	 */
	 padding: 10px 0px;
	 display:block;
}

#frame{
     width:800px;
	 height:160px;
     margin-bottom:20px;
	 margin-left: auto ;
	 margin-right: auto ;
     background-color:#423929;
     /*border:1px #B4B4B4 solid;*/
	 border:1px #B09B71 solid;	 
     -moz-border-radius:8px;
}
#frame:hover{
	color:#FFF;
	border: 1px #FFF solid;
	cursor:pointer;
}

#frame_nohover{
     width:800px;
	 height:160px;
     margin-bottom:20px;
	 margin-left: auto ;
	 margin-right: auto ;
     background-color:#423929;
     /*border:1px #B4B4B4 solid;*/
	 border:1px #B09B71 solid;	 
     -moz-border-radius:8px;
}

#frame_box{
     width:800px;
	 height:30px;
     margin-bottom:20px;
	 margin-left: auto ;
	 margin-right: auto ;
}

#box{
     width:800px;
     margin-bottom:20px;
	 margin-left: auto ;
	 margin-right: auto ;
     background-color:#423929;
     /*border:1px #B4B4B4 solid;*/
	 border:1px #B09B71 solid;	 
     -moz-border-radius:8px;	
}

div.autosize { display: table; width: 1px; }
15div.autosize > div { display: table-cell; }

img.avatar{
	max-height:100px; 
	max-width:100px;	
	border: 1px #352D21 solid;
}

#description{
	 width:455px;
	 height:95px;
     background-color:#585040;
	 border:1px #352D21 solid;	 
     -moz-border-radius:8px;	
	 display:block;
	 float:left;
	 margin:6px 10px 10px 10px;
	 padding:10px;
	 overflow:scroll;
	 overflow-x:hidden;
	 outline:none;
}

#description2{
	 width:455px;
	 height:200px;
     background-color:#585040;
	 border:1px #352D21 solid;	 
     -moz-border-radius:8px;	
	 display:block;
	 float:left;
	 margin:6px 10px 10px 10px;
	 padding:10px;
	 overflow:scroll;
	 overflow-x:hidden;
	 font-style:normal;
	 font-weight:normal;	
	 outline:none;	 
}

#input {
     background-color:#585040;
	font-style:italic;
	font-weight:bold;
	font-family: Cambria;
	color:#E7D6B5;
	border-color:#000;	
}

div.player{
	height:20px;
	width:100px;
	display:block;
}

div.title{
	height:25px;
	width:600px;
	display:block;
	float:left;	
	text-align:center;
	font-size:22px;
	margin-top:5px;
   /* background-color:#F00;	*/
}

div.genre{
	color:#E7D6B5;
	height:22px;
	width:185px;
	display:block;
	float:left;	
    border:1px #E7D6B5 solid;	 
    -moz-border-radius:8px;	
	text-align:center;	
	font-size:18px;	
    background-color:#524A39;	
	padding-top:2px;
	margin-top:5px;
}

div.avatar{
	height:100px;
	width:100px;
	display:block;
	float:left;	
    /*background-color:#00F;	*/
	padding: 15px 5px;
}

div.details{
	height:100px;
	width:180px;
	display:block;
	float:left;	
    /*background-color:#F0F;	*/
	padding: 10px 5px;
}

div.button{
     background-color:#423929;
	 border:1px #B09B71 solid;	 
     -moz-border-radius:8px;	
	 padding: 2px 5px;
	 width:150px;
	 text-align:center;
	 margin-bottom:5px;
	 font-size:22px;
	 cursor:pointer;
}

div.button:hover{
     background-color:#423929;
	 color:#FFF;
}

div.button_filter{
     background-color:#423929;
	 border:1px #B09B71 solid;	 
     -moz-border-radius:8px;	
	 padding: 2px 5px;
	 width:121px;
	 float:left;
	 text-align:center;
	 margin-bottom:5px;
	 font-size:16px;
	 cursor:pointer;
}

div.button_filter:hover{
     background-color:#423929;
	 color:#FFF;
}

#button_session{
     background-color:#585040;
	 border:1px #B09B71 solid;	 
     -moz-border-radius:8px;	
	 padding: 2px 5px;
	 width:121px;
	 float:left;
	 text-align:center;
	 margin-bottom:5px;
	 font-size:12px;
	 cursor:pointer;
	 display:block;
}

#button_session:hover{
     background-color:#585040;
	 color:#FFF;
}

#menu{
	display:block;
	float:left;
	margin-right:10px;
	margin-top:85px;
}


/*  scrollgeneric is used for corrective styling of elements, and should not be modified or removed */ 
.scrollgeneric {
line-height: 1px;
font-size: 1px;
position: absolute;
top: 0; left: 0;
}

.vscrollerbase {
width:14px;
}
.vscrollerbar {
background-image: url(img/arrow.gif);
width: 10px;
/* following is the bit that allows us fixed height scrollbars */
height: 48px !important;
/* for fixed height, we force the vscrollerbar class with an !important decleration, and fleXcroll follows suit.*/

background-image: url(img/arrow.gif);
/* unfortunately, due to limitations of CSS, we cannot provide a color for the background when we are
using alpha images, thay have to be transparent.*/
}


/* do not forget to give horizontal scrollbars some color properties even if you don't plan on using them */
.hscrollerbase {height: 22px;}
.hscrollerbar {height: 22px; background-color: #84ADD6;}

.vscrollerbar, .hscrollerbar {
/* paddings of these elements will decide how far the scrollbar will stop in both ends, and are not actually
used for styling, and are set to 0 by the script, here we will set them the size of our faux arrows */
padding: 0px;
z-index: 2;
}

/* properties for scroller jog box, just in case */
.scrollerjogbox {
width:10px;
height: 22px;
top: auto; left: auto;
bottom: 0px; right: 0px;
background: #698AAA;
}