/* CSS Document */

ul.autocompleter-choices { position: absolute; margin: 0; padding: 0; list-style: none; background: #FFF; }
ul.autocompleter-choices li { color: #333333; font-size: 10px; white-space: nowrap; line-height: 20px; padding: 0 5px; }
ul.autocompleter-choices li.autocompleter-selected { background: #3875D7; color: #FFFFFF; }
ul.autocompleter-choices span.autocompleter-queried { font-weight: bold; color: #000000; }
ul.autocompleter-choices li.autocompleter-selected span.autocompleter-queried { color: #FFFF00; } 

body { position: relative; font-family: Lucida Grande, Arial, Helvetica, sans-serif; background: #222; color: #EEE; letter-spacing: 1px; margin: 0 0 40px 0; }

#contentArtist { width: 800px; font-size: 18px; }

a.ul:hover, 
a { color: #eee; text-decoration: none; outline:none; }

a.ul, 
a:hover { text-decoration: underline; }

form { display: inline; margin: 0; padding: 0; }

a img { border: none; }

#sort { margin: 0; padding: 0; background: #444; }
#sort li { list-style: none; border-bottom: 1px dotted #666;  }
#sort li table, #sort li tr { background: none; }
#sort li[style*="7"] tr { background: #111 }
#sort li[style*="7"] td { color: #FFF !important; }
#sort li[style*="7"] td.hide { color: #FFF !important; display: none; }

.warning { margin: 0 15px; background: url('/images/warning.png') 6px center no-repeat; font-size: 11px; line-height: 30px; padding: 0 0 0 34px; }

.show { display: block !important; }

div > li.drag { display: none; }

h1,h2,h3,h4,h5 { font-weight: normal; padding: 0; }

hr,div.line { border: 0; border-bottom:1px dotted #333; margin: 0 0 9px 0; }

#search { background: #fff url('/images/playlist-tr-selected.gif') 0  repeat-x; font-size: 11px; color: #666666; position: relative; }
#search div.inner{ width: 990px; margin: 0 auto; height: 30px; position: relative; }
#search ul{ margin: 0; padding: 0; }
#search .search { margin: 0 0 0 30px; }
#search ul li { list-style-type: none;} 
#search select { font-size: 10px; }
#search input { background: none; padding: 0px 5px 0px 5px; margin: 4px 0 0 0; border: 1px solid #AAA; color: #666666; height: 19px; width: 150px; font-size: 14px;}
#search input:hover { color: #000000; }
#search input:focus { color: #000000; }

#account { position: absolute; right: 0; top: 0; line-height: 30px; color: #666; font-size: 11px; }
#account a{ text-decoration: underline; }
#account a, #account strong { color: #111; }

#asUser{ position: absolute; top: 0; right: 0; padding: 0 5px; width: 202px; }
#asUser .menu{ display: none; }
#asUser #asUserLink{ background: url('/images/asuser.gif') no-repeat; display: block; text-indent: -999em; height: 30px; width: 30px; float: left; }
#asUser.set #asUserLink{ background: url('/images/CasaMan.jpg') no-repeat center center; display: block; text-indent: -999em; height: 30px; width: 30px; float: left; }
#asUser input{ font-size: 10px; height: 15px; padding: 3px 5px 2px 5px; }
#asUser input:focus{ font-size: 14px; padding: 1px 5px 0px 5px; height: 19px; }
#asUser.set input { background: url('/images/down.png') no-repeat -1px 3px; color: #000000; font-style: normal; font-size: 14px; padding: 2px 6px 0 16px; height: 18px; border: none; }
#asUser.set input:hover { padding: 0px 5px; border: 1px solid #CCC; height: 20px; font-size: 14px;  }
#asUser.set:hover { background: #555; }
#asUser.set:hover input { color: #FFFFFF; }
#asUser.set:hover .menu { display: block; z-index: 100; position: absolute; top: 30px; left: 0px; width: 202px; padding: 5px; background: #111; }
#asUser.set:hover input { background: none; padding: 2px 6px; }
#asUser.set:hover input:hover { background: none; padding: 1px 5px 0 5px; }

#sResults { display: none; color: #333333; line-height: 18px; height: 100px; overflow: auto; background: #FFF; z-index: 1; position: absolute; top: 25x; left: 114px; border: 1px solid #AAA; border-top: none;}
#sResults li { padding: 0 5px; }
#container { background: url('/images/container.gif') center top  repeat-y; }
#container div.inner { width: 990px; margin: 0 auto; z-index: 2; }

#header { background: url('/images/container-top.gif') center bottom no-repeat; }
#header div.inner { width: 990px; margin: 0 auto; position: relative; }

#header h1 { margin: 0 0 0 40px; padding: 0; height: 50px; line-height: 50px; overflow: hidden; font-size: 10px; color: #666; }
#header h1 a{ color: #FFF; font-size: 18px; margin: 0 0 0 3px; }
#header ul { display:none; height: 30px; width: 990px; position: relative; line-height: 30px; overflow: hidden; margin: 0; padding: 0; font-size: 11px;  }

#mascotte { background: url('/images/mascotte.png') no-repeat; height:76px; position:absolute; text-indent:-999em; top:-15px; left:-23px; width:52px; z-index:1; }
#nojsmode { position: absolute; right: 0; font-size: 10px; color: #666; padding-right: 22px; top: 13px; text-align: right; width: 233px;  background: url('/images/warning.png') center right no-repeat; }

#video { background: #000; position: relative; height: 360px; border: none; }

#video a#as { bottom: 15px; left: 495px; display: block; text-indent: -999em; height: 35px; width: 45px; background: url('/images/metadata-last.gif') left top  no-repeat; position: absolute;  z-index: 1;}
#video a#as:hover { background: url('/images/metadata-last.gif') right top no-repeat; }

#video #large { position: absolute; top: 5px; right: 5px; background: #000 url('/images/large.png') right 0 no-repeat; min-width: 17px; width: auto !important; width: 17px; white-space: nowrap; text-align: right; height: 15px; cursor: pointer;  z-index: 3;} 
#video #large span { display: none; z-index: 1; margin: 0 11px 0 0; padding: 0 5px; color: #CCC; line-height: 15px; font-size: 9px; }
#video #large.hover { background: #000 url('/images/large.png') right -15px no-repeat; }
#video #large.hover span { display: block; }
#video .hide { display: none; }

#message { position: absolute; right: 0; bottom: 15px; line-height: 30px; height: 30px; font-size: 11px; }
#message.loading { background: #333 url('/images/loading.gif') 10px center no-repeat; padding: 0 15px 0 35px; }
#message.error { color: #FF0000; background: #333; padding: 0 15px; }

#player { width: 480px; height: 360px; overflow: hidden; position: absolute; top: 0; left: 0; background: #000; z-index: 2; }

#player p{ padding: 20px; line-height: 25px; }
#player p a{ text-decoration: underline; color: #CCCCCC; }
#player p a:hover{ text-decoration: underline; color: #FFFFFF; }

#metadata { width: 490px; height: 340px; left: 490px; overflow: hidden; position: relative; position: absolute; font-size: 11px; top: 10px; padding: 0 10px 0 0; }
#metadata p { line-height: 16px; margin: 12px 0 0 0; padding: 0; }
#metadata p:first-child { margin: 0; padding: 0; }
#metadata div.header { min-height: 62px; height: auto !important; height: 62px; }
#metadata div.header img{ float: left; margin: 0 10px 0 0; border: 1px solid #666; height: 50px; }
#metadata h1 { margin: 0; font-size: 22px; float: left; min-width: 214px; width: auto !important; width: 214px; }
#metadata h2 { margin: 0 0 10px 0; font-size: 16px; float: left; min-width: 214px; width: auto !important; width: 214px; }
#metadata h2 a.add{ font-size: 10px; color: #999; }
#metadata h2 a.add:hover{ text-decoration: none; color: #FFF; }
#metadata h3 { margin: 0 0 10px 0; font-size: 14px; }

#metadata ul.tabs { margin: 0 15px 0 0; padding: 0; width: 99px; height: 265px; overflow: hidden; float: left; border-right: 1px dotted #333333; }
#metadata ul.tabs li { list-style: none; line-height: 16px; width: auto;  }
#metadata ul.tabs li a { margin: 0; padding: 0 10px 0 0; color: #808080; }
#metadata ul.tabs li.selected  a{ color: #FFFFFF; }
#metadata ul.tabs li a:hover { text-decoration: none; color: #FFF; }

#metadata ul { margin: 0; padding: 0 0 0 15px; }
#metadata div.c { width: 365px; float: left; height: 265px; padding: 0 10px 0 0; overflow: auto; display: none;  }
#metadata div.c img { float: left; margin: 5px 18px 0 0; }
#metadata div.c p a { text-decoration: underline; }

div.content { padding:15px;  background: #333;}

div.playlist { background: #333;}
div.album { padding:15px; }

div.tags { text-align: center; padding: 40px; }

div.playlist > h1 { margin:0; }
div.playlist table { width: 100%; border-collapse: collapse; font-size: 11px; }
div.playlist table tr { color: #FFF; line-height: 30px;}
div.playlist table tr td { vertical-align: top; }

div.playlist table tr td.album { width: 200px; margin: 0; padding:0 15px 0 0; overflow: hidden; line-height: normal; }
div.playlist table tr td.album > div { width: 200px; overflow: hidden; }
div.playlist table tr td.album a img { width: 200px; }
div.playlist table tr td.album h1 { margin: 10px 0 0 0; }
div.playlist table tr td.album h2 { margin: 0; padding: 0; } 

div.playlist table tr.down { background: #444; }
div.playlist table tr.up { background: #555; }

div.playlist .list	{ background: #393939; }
div.playlist table.list tr td { padding: 0 5px;  }
div.playlist table.list tr.hover { background: #3875D7 url('/images/playlist-tr-hover.gif') left bottom  repeat-x; color: #FFF; cursor: pointer; }
div.playlist table.list tr.hover td.icon { text-indent: 0; } /*  background: url('/images/monitor.png') 7px 7px no-repeat; */

div.playlist table.list tr td.hide{ text-indent: -999em; }
div.playlist table.list tr.selected td.hide,
div.playlist table.list tr.hover td.hide { text-indent: 0; }

div.playlist table.list tr.selected,
div.playlist table.list tr.selected:hover { background: #FFF url('/images/playlist-tr-selected.gif') left bottom repeat-x !important; color: #333333; }

div.playlist table.list tr.selected td.icon,
div.playlist table.list tr.selected:hover td.icon { background: #FFF url('/images/control_play_blue.png') center bottom no-repeat;  text-indent: -999em; }

div.playlist table.list tr.selected td a,
div.playlist table.list tr.selected:hover a { color: #333; } 

div.playlist table.list tr td.icon { width: 20px; text-align: center; text-indent: -999em; }
div.playlist table.list tr td.track { line-height: normal; padding: 8px 5px;  }
div.playlist table.list tr td.track a:hover { text-decoration: none; }
div.playlist table.list tr td.browse { color: #999999; width: 48px; }
div.playlist table.list tr td.song { width: 31px; }
div.playlist table.list tr td.artist { width: 36px; }
div.playlist table.list tr td.similar { width: 43px; }
div.playlist table.list tr td.tags { width: 30px; }
div.playlist table.list tr td.albums { width: 47px; }

#footer { background: url('/images/container-bottom.gif') center top no-repeat; font-size: 11px; }
#footer div.inner { width: 990px; margin: 0 auto; position: relative; height: 60px; }
#footer .disclaimer { position: absolute; left: 80px; top: 31px; color: #CCCCCC; }
#footer .yt a { position: absolute; right: 0; top: 20px; display: block; width: 120px; height: 60px; background: url('http://code.google.com/apis/youtube/images/badge1.gif') no-repeat; text-indent: -999em; }
#footer .last a { position: absolute; left: 0; top: 28px; display: block; width: 58px; height: 46px; background: url('http://cdn.last.fm/depth/advertising/as/mini_black_rev_2.gif') no-repeat; text-indent: -999em; }