.mobile html, .mobile body, .mobile #page
{
	position: fixed;
	top:0;
	bottom:0 !important;
	right:0;
	left:0;
}
.mobile .iScrollVerticalScrollbar {
	display:none;	
}

.mobile .iScrollIndicator {
	display:none;
}

.mobile h3 {
    font-size: 1.4em;
}
.mobile section h4, .mobile #sect1 h4, .mobile #sect2 h4, .mobile #sect3 h4, .mobile .playlist h4 {
    color: #fff;
    text-transform: uppercase;
    position: inherit;
    background-color: transparent;
    margin: 0;
    left: auto;
    float: none;
    display: inline-block;
    text-shadow: 1px 1px 0 #333;
    /* background: none; */
    background-color: transparent;
    /* color: white; */
    top: auto;
}

.mobile .playlist h4 a {
	color:white;
}

.mobile #page, .mobile #content {
    height: inherit;
    text-align: center;
    width: inherit;
}
.mobile #page {
    background: url("../img/bkgrd-med.jpg") scroll center center rgba(0, 0, 0, 0);
}
.mobile .content, .body {
    height: inherit;
    width: inherit;
}
.mobile .body {
    bottom: 0;
    height: auto;
    left: 0;
    overflow: hidden;
    position: absolute;
    right: 0;
    top: 123px;
}
.mobile .body > .container {
    margin-left: auto;
    margin-right: auto;
    padding: 4px 0;
    width: 98%;
    margin: 0;
}
.mobile #player > .body > .container {
    margin: 0; padding-bottom:20px;
}
.mobile #login, #register, #player {
}
.mobile #login > .body, #register > .body {
    background: none repeat scroll 0 0 #E65D64;
}

.mobile #masthead {
    background: url(../img/logo-sml.png) no-repeat scroll center rgba(0, 0, 0, 0.5);
    left: 0;
    min-height: 123px;
    position: fixed;
    text-align: center;
    width: inherit;
    z-index: 3;
}

.mobile #player #masthead {
    background: none repeat scroll 0 0 #E65D64;
    min-height: 144px;
    max-height:144px;
    top: -65px;
    transition-property: top;
}
.mobile #player #masthead.open {
    top: 0;
}

.mobile #player #masthead > img { display:none; }
.mobile #player #body {
    background: none repeat scroll 0 0 rgba(0, 0, 0, 0.6);
    top: 80px;
    width: inherit;
    height: inherit;
    bottom:0;
}

.mobile nav { /* display:block; */ }

.mobile #player nav {
    height: auto;
    width: 100%;
}

.mobile #dashboard { display:none; }
.mobile #subcontrols ul, .mobile #maincontrols ul {
    margin: 0;
    padding: 0;
    width: inherit;
}
body.mobile #subcontrols li, body.mobile #maincontrols li {
    clear: none;
    float: left;
    margin: 8px 0 4px;
    max-width: 20%;
    min-width: 30px;
    text-align: center;
    vertical-align: middle;
    width: 100%;
    box-shadow: none;
    background: none;
    border: none;
    height: auto;
    display: block;
    top: 0;
    border: none;
    border-radius:0;
    min-height: 34px;
}


.mobile nav a {
    display: block;
    text-align: center;
    vertical-align: middle;
    height: inherit;
    width: inherit;
    border: none;
    box-shadow: none;
    padding: 0;
    margin: 0;
    /* position: inherit; */
}

.mobile #shuffle a, .mobile #repeat a, .mobile #next a, .mobile #next.none a,.mobile #previous.none a, .mobile #previous a, .mobile #clear a, .mobile #save a, .mobile #trash a {
border: none;
box-shadow: none;
}

.mobile nav span {
    background: url("../img/player-buttons-mobile.png") no-repeat;
    /* background-repeat: no-repeat; */
    display: block;
    height: 34px;
    margin-left: auto;
    margin-right: auto;
    /* text-indent: -999em; */
    width: 34px;
}

.mobile .next, .mobile .prev {
	display:none;
}

.mobile #subcontrols {
    height: 38px;
    position: absolute;
    float: inherit;
    left: inherit;
}

.mobile #play a {
    /* position:inherit; */
    margin: 0;
    box-shadow: none;
    border: none;
}

.mobile #play.pause a span {
	background-position: 0 -331px;
}

.mobile #play a span { 
	background-position: 0 -642px;
	-webkit-animation: playbutton .15s linear 0s;
}
.mobile .track.play a:after {
    background: none repeat scroll 0 0 rgba(0, 0, 0, 0.7);
    border-radius: 1000px;
    color: #FFFFFF;
    content: attr(data-time);
    font-size: 9px;
    left: 50%;
    margin-left: -16px;
    margin-top: -21px;
    padding: 0.5em;
    position: absolute;
    top: 50%;
}
.mobile #player #play {
    left: 50%;
    margin-left: -67.5px;
    width: 100%;
    height: 135px;
    margin-top: 100px;
    position: absolute;
    float: left;
    display: block;
}
.mobile #player ul #play a span {
    background-image: url("../img/play-button.png");
    background-repeat: no-repeat;
    height: 135px;
    width: 135px;
}
.mobile #player ul #play {
    background: black;
    border-radius: 1000px;
    max-width: 135px;
}
.mobile #player #menu li {
    float: right;
}
.mobile #maincontrols #menu {
    bottom: 0;
    float: right;
    position: absolute;
    right: 11px;
    width: 31px;
    display: block;
    top: 127px;
}
.mobile #player ul #menu a span {
    background-position: 0 -192px;
}
.mobile #player #masthead.open ul #menu a span {
    background-position: 0 -423px;
}

.mobile #shuffle span {
    background-position:0 0;
}

.mobile #shuffle.on a span {
    background-position: 0 -230px;
}
.mobile #player ul #repeat a span {
    background-position: 0 -52px;
}
.mobile #player ul #repeat.on a span {
    background-position: 0 -281px;
}
.mobile #player ul #previous a span {
    background-position: 0 -99px;
}
.mobile #player ul #previous.click a span {
    background-position: 0 -330px;
}
.mobile #player ul #previous.none a span {
    background-position: 0 -828px;
}
.mobile #player ul #next.none a span {
    background-position: 0 -875px;
}
.mobile #player ul #next a span {
    background-position: 0 -147px;
}
.mobile #player ul #next.click a span {
    background-position: 0 -378px;
}
.mobile #player ul #clear a span {
background-position: 0 -1122px;
}
.mobile #player ul #clear.enable a span {
background-position: 0 -1084px;
}
.mobile #maincontrols #trash {
    background: #E65D64;
    bottom: 31px;
    float: left;
    left: -20%;
    position: fixed;
    width: 31px;
    z-index: 100;
    height: 34px;
    top: auto;
}
.mobile #player ul #trash.enable {
    left: 0;
}
.mobile #player ul #trash span {
    background-position: -1px -665px;
}
.mobile #player ul #tools {
    bottom: 0;
    float: left;
    position: absolute;
    width: 31px;
}
.mobile #player ul #tools span {
    background-position: 9px -921px;
}
.mobile #player ul #tools a.open span {
    background-position: 9px -970px;
}


.mobile #save form {
margin:0;
text-align: left;
width: 75%;
background: none;
margin: 0;
position: relative;
padding: 0;
left: auto;
display: inline-block;
}

.mobile #save form:after { display:none; }

.mobile #save form input {
    margin-left:0;
    max-width: 100%;
}

.mobile #player ul #save span {
    background-position: 2px -1044px;
}

.mobile #player ul #save.enable {
    margin-left: -43px;
    width: inherit;
}
.mobile #player ul #save.enable.enter {
	margin-left: -100%;
}
.mobile #player ul #save {
    background: none repeat scroll 0 0 #66CC99;
    top: 92px;
    float: left;
    margin-left: 100%;
    position: absolute;
    width: auto;
    z-index: 400;
    max-width:100%;
    left: 100%;
    text-align: left;
}

.mobile #player nav ul li#save a {
    clear: none;
    display: inline-block;
    float: left;
    height: 33px;
    position: relative;
    width: 37px;
}
.mobile .songs {
    border:none;
    background:none;
}
.mobile .songs:last-child {
    margin-bottom: 36px;
}
.mobile .songs:first-child {
    margin-top: 63px;
}
.mobile .songs .list {
    border-top: 1px solid #5E5E5E;
    height: 145px;
    padding-top: 8px;
    width: inherit;
    margin: 0;
    background: transparent;
}
.mobile .songs li {
    height: 135px;
    position: relative;
    text-align: center;
    width: 140px;
}
.mobile .songs .track a {
    border-radius: 3px;
    height: 127px;
    margin-left: auto;
    margin-right: auto;
    width: 129px;
}
.mobile .songs .track a img {
    height: 94%;
    margin: 2px 0 0;
    width: 94%;
}
.mobile .songs .track a.options {
    background: none repeat scroll 0 0 rgba(0, 0, 0, 0.8);
    color: #FFFFFF;
    font-size: 0.6em;
    height: 0;
    left: 9px;
    opacity: 0;
    overflow: hidden;
    padding: 0.2%;
    position: absolute;
    text-align: center;
    text-decoration: none;
    top: 3px;
    vertical-align: middle;
    width: 121px;
}
.mobile .songs .track.yellow .options {
    height: 120px;
    opacity: 1;
    transition-duration: 0.2s;
    transition-property: opacity;
}
.mobile .songs .track .options p {
    margin: 0 0 8px;
    font-size: 1.2em;
    line-height: 21px;
}
.mobile #notification {
    clear: none;
    display: inline;
    float: left;
}
.mobile #social_menu { width:inherit; height:inherit; background: none;}
.mobile #social_menu ul { margin:0; padding:0; list-style: none; list-style-type: none; background: none; border: none;}

.mobile #social_menu ul li {
    height: 45px;
    margin: 4px 0;
    width: inherit;
}
.mobile #social_menu ul li a {
    color: #FFFFFF;
    display: inline-block;
    font-size: 1.3em;
    height: inherit;
    line-height: 1.9em;
    text-align: left;
    text-decoration: none;
    text-indent: 46px;
    text-transform: uppercase;
    vertical-align: middle;
    /* width: inherit; */
    margin: 0;
}
.mobile #facebook {
    background-color: #3C599F;
    background-position: 0 -46px;
    border: 3px solid;
    box-shadow: 4px 4px 0 #808080;
    height: 56px;
    line-height: 2.8em;
    margin: 25% auto 0;
    width: 50%;
    padding-top: 7px;
}
#twitter.login {
    background-color: #33CCFF;
    background-position: 0 0;
}
#yahoo.login {
    background-color: #6A026E;
    background-position: 0 center;
}
.mobile #register button {
    background: none repeat scroll 0 0 #000000;
    border-radius: 100px;
    color: #FFFFFF;
}
.mobile #search {
    background: none repeat scroll 0 0 #F1C40F;
    bottom: 0 !important;
    height: auto;
    left: 100%;
    margin-left: -31px;
    z-index:50;
    text-align: left;
    width: 100%;
    padding: 0;
    line-height: normal;
}
.mobile #search form {
    display: inline;
    float: left;
    margin: 0;
    max-width: 87%;
    width:inherit;
    text-align: left;
}
.mobile #search-form input, .mobile #save input {
    background: none repeat scroll 0 0 #FFFFFF;
    border-radius: 2px;
    clear: none;
    color: #808080;
    display: inline-block;
    font-family: Arial,Helvetica,sans-serif;
    height: 25px;
    margin: 4px 0 3px 39px;
    padding: 0;
    text-indent: 4px;
    width: inherit;
}
.mobile #search-form > input {
   width:90%;
   margin: 4px 0 3px 0;
   box-shadow: none;
}
.mobile #search a {
    background: url("../img/player-buttons-mobile.png") no-repeat scroll 2px -732px rgba(0, 0, 0, 0);
    clear: none;
    display: inline-block;
    float: left;
    height: 33px;
    width: 33px;
    left: auto;
    top: auto;
}
.mobile #search.open {
    left: 0;
    margin-left: 0;
}
#settings {
    color: #FFFFFF;
    font-size: 9px;
}
#settings span {
    display: block;
}
#settings h3 {
    margin: 0;
}