/**
 *  Search, browse and media player styles
 *
 *  Copyright: (c)2007 CK Web Technologies - http://www.ckweb.com.au/
 *  Author:    Chris Knowles <chris.knowles@ckweb.com.au>
 *  Version:   $Id: browse.css 21 2007-11-12 21:50:18Z Chris $
 */
 
/*
#02539C



#02539C browse header
#666 browse text and border
#FFF menu background

*/ 
 

/* Search
   ------------------------------------------------ */
#search {
    background: #02539C;
}

#searchForm {
    color: #FFF
}

#searchForm label.title {
    font-weight: bold;
    font-size: 1.2em;
}

#searchForm input {
    display: inline;
    width: auto;
    clear: both;
    border: 0;
    margin: 0;
    padding: 2px 0;
}


#searchForm input.tf {
    width: 165px;
    border: 1px solid #02539C;
    padding: 4px;
    margin-top: 2px;
}

#searchForm label {
    display: inline;
}

#searchForm div {
    margin: 3px 0;
}

#searchForm #searchButton {
    position: absolute;
    right: 40px;
    top: 25px;
    border: 1px solid #FFF;
    padding: 1px 2px;
    cursor: pointer;
    font-weight: normal;
    background: transparent;
    color: #FFF;
    width: 5em;
}


/* Browse
   ------------------------------------------------ */
#browse {
    background: #02539C;
    border-color: #02539C;
    color: #FFF;
}

#audio {
    color: #FFF;
    position: absolute;
    border-bottom: 1px solid #02539C;
    left: 0;
    bottom: 0;
    background: #02539C;
    z-index: 1;
}

#now-playing {
    width: 190px;
    height: 8.36em;
    position: absolute;
    bottom: 4.09em;
    left: 0;
    border-top: 1px solid #DDD;
    background: #02539C;
    padding: 0.45em 5px;
    z-index: -11;
    line-height: 1.1;
}

#now-playing strong {
    display: block;
    float: left;
    width: 5em;
    clear: left;
}

#now-playing span {
    display: block;
    margin-left: 5em;
}

#player {
    margin: 0;
    padding: 0;
    width: 200px;
    height: 70px;
    background: #02539C;
    z-index: 5;
    bottom: 0;
    position: absolute;
}

#audio-player {
    position: absolute;
    z-index: 10001;
    bottom: 0;
}
#audiotag, #fptag {
    position: absolute;
    z-index: 10002;
    width: 200px;
    height: 20px;
    bottom: 0;
}


#mask {
    z-index: 1000;
    width: 200px;
    height: 50px;
    position: absolute;
    bottom: 20px;
    background: #02539C;
}

#browse h2 {
    background: #02539C;
    color: #FFF;
    height: 2.2em;
    line-height: 2.2em;
    padding: 0 1em;
}

#artist, #title {
	border-bottom: 1px solid #DDD;
	padding: 5px 10px;
	float: left;
	width: 180px;
}

#artist li, #title li {
	float: left;
	width: 2em;
}

#artist li.num, #title li.num {
	width: 4em;
}

#artist a, #title a {
    text-decoration: none;
    color: #FFF;
    padding: 0.2em 0.5em;
}

#artist a:hover, #title a:hover {
    background: #FFF;
    color: #02539C;
}

#title {
	border-bottom: 0;
}



/* editable ---------------------------------------*/

#menu {
    border-top: 1px solid #DDD;
    width: 200px;
}

#menu span {
    cursor: default;
}

#menu li {
    left: 0;
    border: 0;
}

#menu ul {
    border: 1px solid #DDD;    
    border-bottom: 0;
    top: 0.5em;   
}

#menu ul li {
    border: 0;
}

#menu ul li a, #menu ul li span {
    border-bottom: 1px solid #DDD;
}

#menu ul ul {
    clear: both;
    top: 1.25em;
}

html>body #menu ul ul {
    width: auto;
}

#menu li a, #menu li span {
    padding: 0 12px;
    background: #02539C;
    text-decoration: none;
    color: #FFF;
    height: 2.2em;
    line-height: 2.2em;
    width: 176px;
    border-bottom: 1px solid #DDD;
}

#menu ul li a, #menu ul li span {
    width: auto;
    background: #EBF6FF;
    color: #000;
}

#menu a:hover, #menu ula.selected, #menu ul span:hover, #menu span.selected {
    background: #B8DFFF;
    color: #000;
}


#menu li:hover ul, #menu .showNav ul {
    left: 100%; 
    top: 5px;
}

#menu li:hover ul ul, #menu li:hover ul ul ul {
    left: -999em; 
}

#menu ul li:hover ul, #menu ul ul li:hover ul {
    left: 100%; 
}

#menu .hideNav ul {
    left: -999em;
}


/* Non-editable ---------------------------------- */
#menu {
    position: relative;
    z-index: 10 !important;
}

#menu li {
    line-height: 0;
    position: relative;
}

#menu li a, #menu li span {
    display: block;
    margin: 0;
    clear: left;
    float: left;
}

html>body #menu li a, html>body #menu li span {
    float: none;
}

#menu li a.nolink, #menu li span.nolink {
    cursor: default;
}

#menu ul {
    position: absolute;
    white-space: nowrap;
    left: -999em;
    z-index: 11 !important;
}

#menu ul ul {
    position: absolute;
    z-index: 12 !important;
    clear: both;
}