/* 

   GNU FM -- a free network service for sharing your music listening
   habits

   Copyright (C) 2009 Free Software Foundation, Inc

   Copying and distribution of this file, with or without modification,
   are permitted in any medium without royalty provided the copyright
   notice and this notice are preserved.  This file is offered as-is,
   without warranty of any kind.

*/

html, body{background: #ddd; padding: 0; margin: 0;}

body{background: url(../img/bg-red.png) repeat-x;}

#content {background-color: #fff;}

#sidebar{background-color: #b3defd;}

.inner{margin:auto;text-align:left;width:57.69em;*width:56.25em;}

.inner{width:73.076em;*width:71.25em;}

.inner-p{padding: 10px;}

#hd {margin-top: -9px;}

#hd td label{display: none !important;}

#hd .inner {position: relative;}

.yui-u .first {background-color: white;}

#hd {margin-bottom: 8px; height: 100px; position: relative;}

#hd table, #hd td {border: 0;}

#hd ul{ margin: 0; padding: 0; line-height: 100px; position: absolute; top: 0; right: 0px;}

#hd li a:link, #hd li a:visited { color: black; text-decoration: none; padding: 7px; }

#hd li a:hover{background-color: maroon; color: yellow;}

#hd li #login {font-weight: bold;}

#hd li{ display: inline; text-transform: lowercase; margin-left: 20px; border-rright: 1px solid #aaa; font-size: 18px;}

#banner { height: 345px; position: relative;}

#banner img{ position: absolute; top: -12px; left: 0; }

#artists{background-color: lightblue; margin: 15px 0 15px 0; padding: 5px;}

#ft{margin-top: 15px;}

#ft p{text-align: center;}

#ft li{ display: inline; margin-right: 0.5em; }

#ft li.copy { margin-right: 1em; }

#hd h1{ background: url(../img/lfm-top.png) no-repeat;
     border: 0;
     padding: 0;
     margin: 0;
     }

#hd h1 a { 
       display: block;
       text-decoration: none;
       overflow: hidden;
       border: 0;
       margin: 0;
       padding: 0;
       padding-top: 100px;
       height: 0px !important;
       height /**/: 100px;
       width: 181px;
       cursor: pointer;
     }

li{ line-height: 1.6em; }

.tagcloud { margin: 0; padding: 0; text-align: center; }


.tagcloud li{ display: inline; margin-right: 0.2em; line-height: 1.2em; }

.tagcloud .t1 { font-size: 200%; }
.tagcloud .t2 { font-size: 180%; }
.tagcloud .t3 { font-size: 160%; }
.tagcloud .t4 { font-size: 140%; }
.tagcloud .t5 { font-size: 120%; }
.tagcloud .t6 { font-size: 100%; }

a:hover { color: red; }
a:visited{ color: #07c;}

.highlight{ background-color: #ffb;}

th{background-color: black; color: white;}
tr.odd{background-color: #edf3fe;}

#try-the-alpha{font-size: 14px; padding: 4px; background-color: #fdca01; text-align: center;}

a:link, a:visited {
    text-decoration: none;
    outline: none;
    color: #3465a4;
}

img {
    border: none
}


h2 {
	font-size: 131%;
	margin: 5px 5px 10px 0;
}

div#footer a {
}
.yui-b, #ft{padding: 1em;}

.odd { background:#F4B624 !important; color:#000; }
.even { background:#FFFFFF !important; color:#000; } 

/*
 * We should use a class down here ¬¬ (fauno)
 */

div#invite,
div#register,
div#login-form {
	margin: 1em auto 0 auto;
}
div#invite form,
div#register form,
div#login-form form {
	width: 30em;
	margin: 0 auto;
}
div#invite form fieldset,
div#register form fieldset,
div#login-form form fieldset {
	border: none;
    padding: 0;
}
div#invite form fieldset label,
div#register form fieldset label,
div#login-form form fieldset label {
	float:left;
	font-weight:bold;
	text-align:right;
    width: 11em;
}
div#invite form fieldset label span,
div#register form fieldset label span,
div#login-form form fieldset label span {
	color:#666666;
	display:block;
	font-weight:normal;
	text-align:right;
	font-size: 60%;
}
div#invite form fieldset input,
div#register form fieldset input,
div#login-form form fieldset input {
	float:left;
	padding:.2em .1em;
	width:200px;
	margin:2px 0 20px 10px;
}
div#invite form fieldset input[type=submit],
div#register form fieldset input[type=submit],
div#login-form form fieldset input[type=submit] {
	margin: 0;
	width: 100%;
}

/* sidebar navigation */

ul#navigation { padding: 0; margin: 0; }
#navigation li { list-style-type: none; padding-bottom: 5px; }
#navigation li ul { padding: 0; margin-left: 20px; margin-top: 0px; }

/* the lists on the front and explore pages */
/* TODO: Do rounded corners for browsers other than Gecko as well? */

ul.listcloud { padding: 0px; margin: 0px; }
ul.listcloud li { float: left; margin-right: 10px; margin-bottom: 10px; list-style-type: none; padding: 0 10px;}
ul.listcloud li dl { margin: 0; padding: 0; }
ul.listcloud li dt { margin: 0; padding: 0; }
ul.listcloud li dd { margin: 0; padding: 0; }

ul.listcloud li dt a:link,
ul.listcloud li dt a:visited { color: #630000; text-decoration: none; }
ul.listcloud li dt a:hover { text-decoration: underline; }

ul#topartists.listcloud dd, ul#albums.listcloud dd { font-size: 77%; line-height: 1.2em; }

ul#nowplaying.listcloud li { float: left; margin-right: 10px; margin-bottom: 10px; list-style-type: none; padding: 10px; border: 1px solid #000; background-color: #eee; -moz-border-radius: 5px; height: 4.4em; }

ul#recenttracks.listcloud li { height: 3.4em; }
/* Users */
.user .fn , .group .fn {
    font-size: 93%;
}
.avatar img {
    max-height: 96px;
    max-width: 96px;
    min-height: 32px;
    min-width: 32px;
}

.user .bio,
.group .bio {
}
.user .nickname ,
.group .nickname {
    color: #666666
}
  dl.now-playing dt, dl.recent-tracks dt {
      margin-top: .3em
  }
  dl.now-playing dd {
      font-size: 77%;
      color: #666;
      display: inline;
      margin: 0
  }
  
  dl dd{
      padding: 0 0 .3em 0;
  }
  
  dl.recent-tracks .track-name a{
      color: #2e3436;
  }
  
  dl.now-playing dd.track-name {
      display:block
  }
  dl.recent-tracks dd span.username {
      font-size: 77%;
  }
  dl.now-playing dt {
      font-size: 93%;
  }
  dl.now-playing dd {
      font-size: 85%;
      color: #666
  }

ul.gobbles {
    margin-left: 0;
}

ul.gobbles * {
    list-style: none;
}
    ul.gobbles .contributor a:link, ul.gobbles .contributor a:visited {
        text-decoration: none;
        color: #2e3436;
        font-weight: bold;
    }
    ul.gobbles .contributor a:hover {
        text-decoration: underline;
    }
    ul.gobbles .track-name {
        font-weight: bold;
        font-size: 77%;
    }
    ul.gobbles small {
        color: #666;
        display:block;
        font-size: 77%;
        margin-top: -0.4em;
    }
    ul.gobbles li img.albumart {
        float: left;
        margin-right: 10px;
    }

h3 {
	clear: left;
}


.clear {
    clear: both;
}

.user, .group {
    padding: .5em;
    position: relative;
    margin-bottom: .5em;
}

.user{    background: #fff url(/img/bg.png) repeat-x ;}

.user dl, .group dl
{
	margin: 0 0 0 76px;
	min-height: 64px;
}

.user dt, .group dt
{
	margin: 0 0 0.1em 0;
}

.user dd, .group dd
{
	margin: 0;	
}

.user .avatar img, .group .avatar img
{
	position: absolute;
	top: 3em;
	left: 8px;
	border: 1px solid black;
}

.vcard .edit { float:right; }

#chooser { position: relative; }
#chooser_list { position: absolute; width: 26em; background: #eee; }
#chooser_list { border: 1px solid #999; padding: 0; margin: 0; list-style: none; }
#chooser_list li { border: 1px solid #bbb; padding: 2px; margin: 1px; font-size: 67%; }
#chooser_list li:hover, #chooser_list li.hover { background: #ffd; }
#location_uri_label { font-size: 80%; }
#location_uri_label.ok { color: green; }
#location_uri_label.no { color: red; }

.userlist {
	padding: 0;
	margin: 0;
    list-style-type: none;
}
.userlist li
{
	padding: 0;
	margin: 0 0 1em;	
    list-style-type: none;
    min-height: 64px;
    clear: both;
}

ul#albums * {
    padding: 0;
    margin: 0;
}
ul#albums li {
    list-style-type: none;
    float: left;
}
ul#albums img.album, ul#albums li {
    width: 160px;
    height: 160px;
}
ul#albums img.album {
    vertical-align: middle;
}
ul#albums dl dd.description {
    line-height: 1.2em;
    font-size: .8em;
    margin: -1.4em 0 0 0;
    padding: .1em .5em;
    color: #FFF;
    background-color: #000;
    opacity: .85;
    /* IE */
    filter: alpha(opacity=85);
}

/* stats */
.stats_artists{ width: 100%; font-size: 98%; }
.stats_artists td{ border: 1px solid #ddd; }
.stats_artists .artist{ width: 300px; }
.stats_artists .bar{ width: 300px; }
.stats_artists .bar div{ background: #970102; height: 1em; }
.stats_artists .counts{ text-align: right; }

dt.libre{background-image: url(/img/square.png); background-repeat: no-repeat; padding-left: 22px; background-color: #eee;}
li.libre{background-image: url(/img/square.png); background-repeat: no-repeat; padding-left: 22px; background-color: #eee;}

#adbard{
        margin: 0 auto 0 auto;
	height: 205px;
       	width: 140px;
	padding: 5px; text-align: center;
}

.cc-license {font-size: 73%; color: red;}

.disclaimer {padding: 8px; background-color: yellow; text-align: center; margin-top: 1em;}

#errors {border: 2px solid red; margin: 1em; padding: 1em; color: red !important;}

/* CSS for player */

#player > #interface {
	background: #980101 url(/img/player/background.jpg) repeat-x;
	width: 280px;
	border: 1px solid black;
	-moz-border-radius: 8px;
	-webkit-border-radius: 8px;
	padding: 10px;
	padding-bottom: 0px;
	color: white;
	display: none;
}

#player > #interface > #buttons a {
	opacity: 0.5;
}

#player > #interface > #progress {
	text-align: right;
}

#player > #interface > #trackinfo {
	border: 1px solid black;
	-moz-border-radius: 8px;
	-webkit-border-radius: 8px;
	overflow: hidden;
	padding: 3px 5px;
	margin-bottom: 5px;
	background: white;
	color: black;
}

#player > #interface > #trackinfo > #playlist {
	display: none;
}

#showplaylist {
	margin-top: 2px;
	float: right;
}

#hideplaylist {
	margin-top: 2px;
	display: none;
	float: right;
}

#scrobbled {
	display: none;
	float: right;
}

.ui-widget { font-family: Verdana,Arial,sans-serif/*{ffDefault}*/; font-size: 1.1em/*{fsDefault}*/; }
.ui-widget input, .ui-widget select, .ui-widget textarea, .ui-widget button { font-family: Verdana,Arial,sans-serif/*{ffDefault}*/; font-size: 1em; }
.ui-widget-content { border: 1px solid #aaaaaa/*{borderColorContent}*/; background: #ffffff/*{bgColorContent}*/ color: #222222/*{fcContent}*/; }
.ui-widget-content a { color: #222222/*{fcContent}*/; }
.ui-corner-all { -moz-border-radius: 4px/*{cornerRadius}*/; -webkit-border-radius: 4px/*{cornerRadius}*/; }

.ui-progressbar { height: 11px; text-align: left; }
.ui-progressbar .ui-progressbar-value {height:100%; }/* Resizable */
.ui-progressbar-value { background-image: url(/img/player/pbar-ani.gif); }

/* end of player CSS */

#register-prompt {background-color: #eee; padding: 12px; border: 5px solid #aaa;}

#purchase-download{background-color: #ececec; -moz-border-radius: 1em; padding: 15px; float: right;}

.photo{padding: 1px; border 1px solid #ccc; float: left;}

hr {clear: both; height: 0px; color: white !important; background-color: transparent !important;}

#new-libre-fm{background-color: black; color: white; padding-top: 190px;}

.bugs-button {
	position: fixed;
	top: 200px; 
	left: 0px; 
	width: 50px; 
	height: 89px;
	z-index: -1;
	}