body {
    background: #EAEAEA url(img/body-bg.png) 50% repeat-y;
    color: #000;
    font: 12px Arial, Tahoma, sans-serif;
    margin: 0;
}

a {
    border-bottom: 1px dotted #AAA;
    color: #465D74;
    text-decoration: none;
}

a:hover {
    border-bottom: 1px solid #777;
}

form {
    margin: 0;
}

p {
    font-family: "Courier New", Courier, monospace;
}

input, textarea {
    border-top: 1px solid #CCC;
    border-left: 1px solid #CCC;
    border-bottom: 1px solid #FFF;
    border-right: 1px solid #FFF;
    padding: 1px 2px;
}

input.button, input.submit {
    background: url(img/button-bg.png) top left;
    border-top: 1px solid #FFF;
    border-left: 1px solid #FFF;
    border-bottom: 1px solid #BBB;
    border-right: 1px solid #BBB;
    padding: 0 1px;
}

select {
    font-size: 12px;
}

#container {
    background: url(img/header.png) top no-repeat;
    margin: 0 auto;
    padding: 130px 10px 0;
    position: relative;
    width: 680px;
}

#helpbox {
    background-color: #EEE;
    margin: 5px 0 0 0px;
    padding: 3px 5px;
    white-space: normal;
}

#fontstyle {
    margin: 5px 0 0 5px;
}

#lyrics {
    text-align: justify;
}

#footer {
    background: url(img/footer-bg.png) top left repeat-y;
    border-top: 1px solid black;
    color: #FFF;
    clear: both;
    font: 9px/12px Tahoma, Verdana, sans-serif;
    margin: 0 -10px;
    padding: 5px;
    text-align: right;
}

#footer span {
	float: left;
}

#footer a, #qqToolTip span.f a {
    border: 0;
    color: #FFF;
    font-weight: bold;
}

#footer a:hover, #footer a:active, #qqToolTip span.f a:hover, #qqToolTip span.f a:active {
    color: #DDD;
}

#topSponsors {
    margin: 20px 0;
    text-align: center;
}

#bottomSponsors {
    margin: 40px 0;
    text-align: center;
}

/********************/
/*** browseHeader ***/

#browseHeader {
    color: #111;
    font-weight: bold;
    position: absolute;
    top: 102px;
}

#browseHeader a {
    border: 0;
    text-decoration: underline;
}

#browseHeader .bB {
    padding: 0 15px 0 0;
}

#browseHeader .bO {
    padding: 0 0 0 15px;
}

#browseHeader .bO a {
    padding: 0;
    text-transform: lowercase;
}

#browseHeader a {
    color: #111;
}

#browseHeader ul {
    margin: 0;
    padding: 0;
}

#browseHeader li {
    list-style: none;
    float: left;
}

#browseHeader li span, #browseHeader li a {
    padding: 0 5px;
}

#browseHeader li a:hover, #browseHeader li a:active {
    color: #FEFEFE;
}

#searchForm {
    left: 520px;
    position: absolute;
    top: 70px;
    white-space: nowrap;
}

#query {
    background: transparent;
    color: #FFF;
    width: 120px;
}

#query, #searchForm input.button {
    font: 10px Verdana, Tahoma, sans-serif;
    font-weight: bold;
}

/**********************/
/*** add/edit table ***/

.modifyLyrics {
    white-space: nowrap;
}

.modifyLyrics th {
    padding: 3px 5px;
    text-align: right;
}

.modifyLyrics td {
    padding: 5px;
}

.modifyLyrics textarea, .modifyLyrics input {
    background: #EAEAEA;
    font: 12px Courier, Tahoma, sans-serif;
}

.modifyLyrics, .modifyLyrics textarea {
    width: 465px;
}

.modifyLyrics input.button, .modifyLyrics input.submit {
    background: url(img/button-bg.png) top left;
    font: 12px Arial, Tahoma, sans-serif;
    margin: 0 5px;
    padding: 1px 10px;
}

.modifyLyrics input.submit {
    font-weight: bold;
}

/*******************/
/*** login table ***/

#loginTable input {
    font: 11px Arial, Tahoma, sans-serif;
}

#loginTable input.button {
    margin: 2px;
}

#loginTable .iT {
    background: #FEFEFE;
    width: 70px;
}

#loginTable td {
    padding: 1px;
    width: 1%;
}

#loginTable th {
    text-align: right;
    width: 1%;
}

/***************/
/*** subMenu ***/

#subMenu {
    margin: 0 0 20px 0;
}

#subMenu a {
    color: #000;
}

#subMenu form, #subMenu #logout {
    float: right;
}

#subMenu form {
    margin: 0 30px 0 0;
}

#subMenu label {
    cursor: pointer;
}

#myOnly {
    vertical-align: middle;
}

/*************/
/*** alert ***/

.alert {
    background: #F00;
    color: #FFF;
    font: 16px Arial, Tahoma, sans-serif;
    font-weight: bold;
    margin: 0 0 20px 0;
    padding: 5px 10px;
    width: 460px;
}

.alert li {
    list-style: none;
}

.alert ul {
    padding: 0;
}

/***************/
/*** sidebar ***/

#sideBar {
    clear: both;
    color: #333;
    float: right;
    padding: 0 0 0 7px;
    width: 185px;
}

#login h1, #topTen h1, #lastTen h1, #lastQuery h1, #fromTheSameArtist h1, #sideSponsors h1 {
    background: url(img/ul-header.png) no-repeat top left;
    font: 11px Verdana, Arial, sans-serif;
    font-weight: bold;
    height: 21px;
    padding: 4px 0 0;
    margin: 0;
    text-align: center;
    text-transform: uppercase;
    width: 188px;
}

#login form, #topTen ul, #lastTen ul, #lastQuery ul, #fromTheSameArtist dl, #sideSponsors ul {
    background: url(img/ul-footer.png) no-repeat bottom left;
    list-style: none;
    margin: 0 0 10px;
    padding: 0 0 20px;
    width: 188px;
}

#sideSponsors ul {
    text-align: center;
}

#login table, #topTen li, #lastTen li, #lastQuery li, #fromTheSameArtist dd, #sideSponsors li {
    background: url(img/li-bg.png) repeat-y top left;
    font: 11px Arial, sans-serif;
    padding: 2px 10px 4px 10px;
}

#fromTheSameArtist dd {
    margin: 0;
    padding: 0 8px 1px 22px;
}

#fromTheSameArtist h2 {
    background: url(img/li-bg.png) repeat-y top left;
    font: 11px Arial, sans-serif;
    font-weight: bold;
    margin: 0;
    padding: 6px 5px 3px 15px;
}

/************/
/*** misc ***/

#add, #lyrics .edit {
    border: 0;
    display: block;
    font: 11px Verdana, Arial, sans-serif;
    font-weight: bold;
    height: 33px;
    padding: 12px 0 0 0;
    text-align: center;
    white-space: nowrap;
}

#add {
    background: url(img/add-bg.png) no-repeat top left;
    margin: 10px auto;
    text-transform: uppercase;
    width: 125px;
}

#add:hover {
    background: url(img/add-bg.png) no-repeat 0 -45px;
}

#lyrics .edit {
    background: url(img/edit-bg.png) no-repeat top left;
    float: right;
    margin: 0 30px 0 0;
    width: 85px;
}

#lyrics .edit:hover {
    background: url(img/edit-bg.png) no-repeat 0 -45px;
}

#lyrics h2 span, #albumTitleList h1 span, #artistTitleList h2 {
    font: 14px Arial, Tahoma, sans-serif;
    font-weight: bold;
    padding: 0 15px;
}

#titleList ul, #artistList ul, #artistTitleList dl, #albumList ul, #albumTitleList ul, #searchList ul {
    list-style: none;
    margin: 0;
    padding: 0 0 0 20px;
    width: 460px;
}

#artistList li, #albumList li, #titleList li, #artistTitleList dd, #albumTitleList li, #searchList li {
    list-style: none;
    background: url(img/Pixelation-1_11.png) no-repeat top left;
    padding: 0 0 5px 20px;
}

#artistList li, #albumList li, #artistTitleList h2 {
    background: url(img/Pixelation-1_15.png) no-repeat top left;
}

#titleList a, #artistList a, #artistTitleList a, #albumList a, #albumTitleList a, #searchList a {
    color: #111;
}

#iterator {
    line-height: 20px;
    margin-top: 25px;
    text-align: center;
}

#symbol {
    margin: 20px 0 30px;
    text-align: center;
}

#symbol img {
    border: none;
    padding: 0 5px;
    vertical-align: middle;
}

#qqf {
    border: 0;
    height: 0;
    width: 0;
}

#qqToolTip {
    background: #FFF;
    border: 1px solid #000;
    color: #777;
    font: 9px/13px Tahoma, Verdana, sans-serif;
    left: 0px;
    position: absolute;
    top: 0px;
    visibility: hidden;
    width: 190px;
    z-index: 100;
}

#qqQuery, #qqSuggest {
    list-style: none;
    margin: 0;
    padding: 0;
    width: 190px;
}

#qqQuery li .t {
    display: block;
    font-weight: bold;
}

#qqQuery li {
    background: url(img/Pixelation-1_11.png) no-repeat 5px 5px;
    padding: 5px 5px 5px 25px;
    width: 160px;
}

#qqQuery #highlit {
    background: #EFEFEF url(img/Pixelation-1_11.png) no-repeat 5px 5px;
}

span.f {
    background: url(img/footer-bg.png) top right repeat-y;
    border-top: 1px solid #000;
    display: block;
    font-weight: bold;
    padding: 5px 7px;
    text-align: right;
}

#qqSuggest li {
    background: url(img/Pixelation-1_15.png) no-repeat 5px 3px;
    color: #465D74;
    cursor: pointer;
    font-weight: bold;
    padding: 4px 5px 4px 25px;
    width: 160px;
}

#qqSuggest #highlit {
    background: #EFEFEF url(img/Pixelation-1_15.png) no-repeat 5px 3px;
}

.fl {
    border: 1px solid #AAAAAA;
    float: left;
    margin: 7px 7px 7px 0px;
    padding: 1px;
}

.fr {
    border: 1px solid #AAAAAA;
    float: right;
    margin: 7px 0px 7px 7px;
    padding: 1px;
}

a:hover img.fr, a:hover img.fl {
    border: 1px solid #000;
}
