/*******************************************************************************************
*                                BODY AND GLOBAL                                           *
*******************************************************************************************/
body {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: #333;
	margin: 0;
	padding: 0;
	border: 0;
}

#google {
	
}

/* charts */
#chart-c {
	padding: 10px 10px 20px 10px;
}

.warning {
	color: red;
	margin: 10px 0 10px 0;
	padding: 4px 0 4px 0;
	text-align: center;
	background: #FFFF99;
}

#genres {
	text-align: center;
	width: 600px;
	margin-left: auto;
	margin-right: auto;
}

#genres a {
	color: #333;
}

#genres a:active {
	color: #666666;
}

#genres a:visited {
	color: #999999;
}

/* tag cloud */
.smallest {
	font-size: x-small;
}

.small {
	font-size: small;
}

.medium {
	font-size:medium;
}

.large {
	font-size:large;
}

.largest {
	font-size:larger;
}

/* small search */

#small-search {
    float: right;
	height: 30px;
}

#small-search label {
	float: left;
	font-style: normal !important;
	line-height: 20px;
}

/* rand name */
.rand-name {
	position: absolute;
	margin: 0 !important;
	width: 100px !important;
	overflow: hidden;
}

/* news-box */
#news-box {
	width: 160px;
	overflow: hidden;
	font-size: 0.8em;
	margin-top: 20px;
}

#news-box h3 {
	color: #999;
	font-size: 1.4em;
	text-align: right;
	line-height: 20px;
	padding: 0 !important;
	margin: 0 !important;
}

#news-box dt{
	line-height:12px;
}

#news-box dt a{
	color:#ff9900;
}
#news-box .date{
	color:#999999;
	font-size:xx-small;
	letter-spacing:0.2em;
}
#news-box dd{
	border-bottom:1px solid #CCCCCC;
	margin: 0 0 10px 0 !important;
	line-height:16px;
}

/*******************************************************************************************
*                                LINKS                                                     *
*******************************************************************************************/
a {
	cursor: pointer;
	text-decoration: none;
}

a:hover {
	text-decoration: underline;
}

/*******************************************************************************************
*                                HEADERS                                                   *
*******************************************************************************************/
h2 {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 2em;
	color: #CCCCCC;
}

/*******************************************************************************************
*                                CLEAR                                                     *
*******************************************************************************************/
.clear {
	clear: both;
}

/*******************************************************************************************
*                                AREA BODY                                                 *
*******************************************************************************************/
body.area {
	background: #e1d4c0 url(../imgs/body_backgr.jpg) repeat-x top left;
}

/*******************************************************************************************
*                                HEADER                                                    *
*******************************************************************************************/
#header {
	width: 100%;
	height: 119px;
	text-align: center;
}

#header #top {
	text-align: left;
	width: 760px;
	height: 119px;
	margin: 0 auto 0 auto;
	background: url(../imgs/table_backgr.jpg) repeat-x top left;
}

#header #logo {
	width: 179px;
	height: 61px;
	float: left;
}

#logo p {
	display: block;
	margin: -1px 0 0 20px;
	color: #fff;
	font-size: 14px;
}

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

#logo a:hover {
	text-decoration: none;
}

#logo img {
	margin: 26px 0 0 20px;
}

#header #user-menu {
	float: right;
	width: 490px;
	height: 119px;
}

.remind {
	width: 100px;
	height: 100px;
	float: right;
	margin-top: 4px;
	margin-right: 6px;
	padding: 2px;
}

#user-menu #avatar {
	border: 1px solid #CCCCCC;
	width: 100px;
	height: 100px;
	float: right;
	margin-top: 4px;
	margin-right: 6px;
	padding: 2px;
}

#avatar a {
	color: #fff !important;
}

#user-menu #avatar span {
	position: absolute;
	margin-top: 85px;
    width: 104px;
	margin-left: -2px;
	line-height: 17px;
    font-size: 0.9em;
    color: #fff;
    font-weight: bold;
    text-align: center;
	background: url(../imgs/trans_gray.png) repeat;
}

#user-menu .flag-remind img {
	margin-bottom: -2px;
}

*html #user-menu #avatar span {
	margin-top: 88px;
}

* html #user-menu #avatar span {
	background: #666666;
}

#user-menu ul {
	margin: 0;
	padding: 0;
	margin-right: 10px;
	margin-top: 10px;
	list-style: none;
}

#user-menu ul li img {
	margin-bottom: -4px;
}

#user-menu ul li a {
	display: block;
	padding-top: 5px;
	height: 24px;
	width: 160px;
	color: #fff;
	text-indent: 6px;
	background: url(../imgs/over_top_button.jpg) no-repeat top left;
}

#user-menu ul li a:hover {
	text-decoration: none;
	background: url(../imgs/over_top_button.jpg) no-repeat top right;
}

/*******************************************************************************************
*                                BODY                                                      *
*******************************************************************************************/
#body {
	width: 100%;
	height: auto;
	text-align: center;
}

#body #content {
	text-align: left;
	width: 760px;
	height: auto;
	margin: 0 auto 0 auto;
	padding-top: 10px;
	background-color: #fff;
	border-left: 1px solid #a89f90;
	border-right: 1px solid #a89f90;
}

/*******************************************************************************************
*                                SIDEBAR                                                   *
*******************************************************************************************/
#sidebar {
	width: 160px;
	height: auto;
	margin-left: 10px;
	float: left;
}

#sidebar ul {
	list-style: none;
	padding: 0;
	margin: 0;
}

#sidebar ul li img {
	margin-bottom: -4px;
}

#sidebar ul li a {
	display: block;
	padding-top: 5px;
	height: 24px;
	width: 160px;
	color: #666;
	font-weight: bold;
	text-indent: 30px;
	background: url(../imgs/sidebar_button.png) no-repeat top left;
}

#sidebar ul li a:hover {
	text-decoration: none;
	color: #fff;
	background: url(../imgs/sidebar_button.png) no-repeat top right;
}

#sidebar ul li a:active {
	text-decoration: none;
	color: #fff;
	background: url(../imgs/sidebar_button.png) no-repeat top right;
}

/*******************************************************************************************
*                                PAGE                                                      *
*******************************************************************************************/
#page {
	width: 540px;
	height: auto;
	margin-left: 36px;
	margin-bottom: 20px;
	float: left;
}

* html #page {
	margin-left: 26px;
}

#page-content {
	height: auto;
}

#page-content h2 {
	padding: 10px;
}

/*******************************************************************************************
*                                SUB-MENU                                                  *
*******************************************************************************************/
#sub-menu, #sub-menu-detail {
	float: left;
	width: 526px;
	padding-top: 4px;
	margin-left: 4px;
	background: #fff url(../imgs/tab_border.png) repeat-x bottom;
	border-left: 1px solid #cdd5d5;
	border-right: 1px solid #cdd5d5;
	border-top: 1px solid #cdd5d5;
	line-height: normal;
}

* html #sub-menu {
	margin-left: 1px;
	width: 536px;
}

* html #sub-menu-detail {
	margin-left: 1px;
	width: 536px;
}

#sub-menu ul, #sub-menu-detail ul {
    margin:0;
    padding:0;
	padding: 0 10px 0;
    list-style:none;
}
	
#sub-menu li, #sub-menu-detail li {
    float:left;
    margin:0 2px 0 0;
    padding:0;
	background: url(../imgs/tab_right.png) no-repeat right top;
}

#sub-menu a, #sub-menu-detail a {
	display: block;
	background: url(../imgs/tab_left.png) no-repeat left top;
    padding:5px 15px 4px;
	font-weight: bold;
	color: #999999;
}

#sub-menu a:hover, #sub-menu-detail a:hover {
	color: #333;
	text-decoration: none;
}

/* Commented Backslash Hack hides rule from IE5-Mac \*/
#sub-menu a, #sub-menu-detail a {float:none;}
/* End IE5-Mac hack */

#sub-menu #current, #sub-menu-detail #current {
    background-image:url(../imgs/tab_right_over.png);
}
	
#sub-menu #current a, #sub-menu-detail #current a {
    background-image:url(../imgs/tab_left_over.png);
	padding-bottom:5px;
	color: #333;
}

/*******************************************************************************************
*                                FOOTER                                                    *
*******************************************************************************************/
#footer {
	text-align: left;
	background: url(../imgs/table_bottom.jpg) no-repeat top left;
	width: 764px;
	height: 35px;
	margin: 0 auto 0 auto;
	padding-top: 50px;
	text-align: center;
	clear: both;
}

#footer ul {
	margin: 0;
    padding:0;
	text-align: center;
    list-style:none;
}

#footer ul li {
	float:right;
    margin: 0;
    padding:0;
}

#footer a {
	display: block;
	margin-right: 20px;
	font-weight: bold;
	color: #999999;
}

/*******************************************************************************************
*                                FORMS                                                     *
*******************************************************************************************/
form {
	padding: 20px 0 0 0x;
	margin: 0;
	border: 0;
}

label {
	display: block;
	font-weight: bold;
	color: #666666;
}

input {
	border: 1px solid #66CCCC;
}

input.textfield, select {
	width: 200px;
}

.button {
	display: block;
	border: 1px solid #B9B9B9;
	font-weight: bold;
	color: #333;
	padding: 2px 5px 2px 5px;
	float: left;
	margin: 10px;
	cursor: pointer;
}

* html input.button {
	margin-right:  5px;
}

.odd {
	background-color: #F9F9F9;
}

form p 
	margin: 0;
}

* form p {
	
}

form .red {
	font-size: 10px;
	font-weight: normal;
	color: red;
}

a.ok {
	float: right;
	margin-right: -10px;
	width: 70px;
	height: 25px;
	text-align: center;
	line-height: 25px;
	font-weight: bold;
	display: block;
	text-decoration: none;
	background-color: #ece9d8;
	border: 1px solid #b9b9b9;
	color: #333;
}

* html a.ok {
	margin-right: -5px;
	margin-bottom: 10px;
	padding-top: 4px;
}

a.ok img {
	margin-bottom: -2px;
	margin-right: 4px;
}

a.ok:hover {
	text-decoration: none;
}

/*******************************************************************************************
*                                LIST                                                      *
*******************************************************************************************/
#list {
	/*border: 1px solid #CCCCCC;*/
	width: 100%;
	height: auto;
}

#list p {
	margin: 10px;
}

#list img {
	margin-right: 20px;
}


#list .body-text {
	font-style: normal;
	font-size: 1.2em;
}

#list p img {
	margin-bottom: -4px;
}

#list a.title {
	display: block;
	border: 1px solid #F9F9F9;
	color: #333;
	padding: 30px;
}

#list a.title:hover {
	text-decoration: none;
	border: 1px solid #CCCCCC;
	background-color: #E8E8E8;
}

/*******************************************************************************************
*                                DETAIL                                                    *
*******************************************************************************************/
.detail {
	width: 100%;
	height: auto;
}

.detail p {
	padding-bottom: 4px;
}

.detail #abstract {
	float: left;
	width: 250px;
	margin-left: 20px;
}

.detail #pic {
	width: 250px;
	padding: 2px;
	float: left;
}

.detail #abstract a {
	text-decoration: underline;
	color: #666666;
	font-weight: bold;
}

.detail #abstract a:hover {
	text-decoration: none;
}

.detail #pic img {
	padding: 2px;
	border: 1px solid #999;
}

.detail strong {
	display: block;
	padding-bottom: 4px;
	color: #999999;
}

/*******************************************************************************************
*                                NAV                                                       *
*******************************************************************************************/
#nav {
	clear: both;
	width: 100%;
	height: auto;
	margin-bottom: 10px;
}

#nav ul {
	display: block;
	margin: 0;
	padding: 0;
	list-style: none;
	float: left;
}

#nav ul li {
	float: left;
	margin-right: 8px;
}

*html #nav ul li {
	margin-top: 10px;
	margin-right: 0;
}

#nav ul li img {
	margin: 7px 0 0 7px;
}

#nav a {
	display: block;
	width: 30px;
	height: 30px;
	background: url(../imgs/nav_box.png) no-repeat top left;
}

#nav a.clean-image {
	background: none;
	line-height: 30px;
	color: #333;
}

#nav a.clean-image:hover {
	background: none;
	color: #333;
}

#nav a:hover {
	background: url(../imgs/nav_box.png) no-repeat top right;
}

/*******************************************************************************************
*                                CANCEL BUTTON                                             *
*******************************************************************************************/
#cancel {
	display: block;
	width: 100px;
	height: 22px;
	text-align: center;
	margin: 10px 0 0 10px;
	float: left;
}

* html #cancel {
	margin-left: 5px;
}

#cancel a {
	display: block;
	height: 22px;
	line-height: 22px;
	background-color: #ece9d8;
	border: 1px solid #b9b9b9;
	color: #333;
	font-weight: bold;
}

#cancel a:hover {
	text-decoration: none;
}

/* promoted */
ul li#promoted {
	display: block;
	border: 1px solid #999;
	padding-bottom: 4px;
	padding-right: 4px;
}

/*******************************************************************************************
*                                ROWS                                                     *
*******************************************************************************************/
.row {
	margin: 0 0 10px 0;
	border: 1px solid #fff;
	overflow: auto;
	padding-bottom: 4px;
}

*html .row {
	padding-bottom: 10px;
}

.static {
	overflow: hidden;
}

.row-left {
	width: 100px;
	float: left;
}

.row-right {
	margin-top: 10px;
	margin-left: 40px;
	float: left;
}

*html .row-right {
	margin-left: 0;
}

.row-avatar {
	width: 100px;
	margin-top: 10px;
	margin-left: 10px;
}

.row-avatar img {
	border: 1px solid #333;
	padding: 2px;
	margin: 0;
}

.row-label {
	padding-top: 10px;
}

*html .row-label {
	padding-top: 0;
}

.row-odd {
	background-color: #eef4f7;
}

.row-label a.link-text {
	font-style: normal;
	font-size: 1.2em;
	color: #333;
	font-weight: bold;
}

.row-label a.link-img {
	display: block;
	float: left;
	width: 16px;
	padding: 0;
	margin: 0;
}

.row-label img {
	border: 0;
	padding: 0;
	margin: 0;
}

.row-label a.link-text:hover {
}

.row-player a.more {
	font-style: normal;
	color: #333;
	text-decoration: underline;
}

.row-player i {
	font-style: normal;
	color: #CCCCCC !important;
	font-weight: bold;
	font-size: 1.2em;
}

.row-player a:hover {
}

.row-info {
	margin-bottom: 8px;
}

.row-flag {
	margin-bottom: 8px;
}

.row-more {
	float: left;
	margin-left: 20px;
	margin-top: 10px;
}

.row-more img {
	margin-bottom: -2px;
}

.row-more a {
	color: #999999;
	font-weight: bold;
	text-decoration: none;
	margin-left: -14px;
}

.row-more a:hover {
	text-decoration: underline !important;
}

.row-more #navlist {
	padding-left: 0;
	margin-left: 0;
	width: 100px;
}

.row-more #navlist li {
	list-style: none;
	margin: 0;
	padding: 0.25em 0.25em 0.25em 0;
}

.row-more #navlist li a { text-decoration: none; }

.row-player {
	z-index: 1000;
}

.row-player .download {
	clear: both;
}

.row-hifi img, .row-lofi img {
	border: 0;
}

.row-lofi {
	float: left;
}

.row-hifi {
	margin-left: -18px;
	float: left;
}

.row-download {
	margin-left: -18px;
	float: left;
}

.static-row-hifi {
	margin-left: 0 !important;
	width: 86px !important;
}

.static-row-lofi {
	width: 86px !important;
}

* html .static-row-lofi {
	margin-left: -18px !important;
	width: auto;
}

* html .static-row-download {
	margin-left: -18px !important;
}

.clue-box {
	margin: 0 0 0 10px;
}

.clue-close-container {
	margin-top: 10px;
	border-top: 1px solid #999;
}

.clue-close-header {
	float: left;
	height: 30px;
	width: 200px;
	color: #999999;
	font-size: 1.2em;
	font-weight: bold;
	line-height: 30px;
}

.clue-close-link {
	float: right;
	height: 30px;
	line-height: 30px;
}

*html .clue-close-link img {
	margin-top: 4px;
}
