@import url(http://fonts.googleapis.com/css?family=Geo);@import url(http://fonts.googleapis.com/css?family=Abril+Fatface);body{background:#f9f9f9;font-size:62.4%;height:100vh;margin:0;place-content:center}#message{color:#333;font-size:1.6em;line-height:1.4em;padding:20px;text-align:center}#jukeboxWrapper{box-shadow:0 0 20px 0 rgba(0,0,0,.75);color:#a28757;margin:20px auto;width:412px}#amp{background:url(img/amp.jpg) no-repeat;background-size:412px 174px;height:174px;position:relative;width:412px}#amp,#status{display:block}#status{background:url(img/stopped.gif) no-repeat!important;height:10px;left:27px;position:absolute;top:52px;width:10px}#status.playing{background:url(img/playing.gif) no-repeat!important}#status.paused{background:url(img/paused.gif) no-repeat!important}#time{font-family:Times New Roman;font-size:4.2em;font-weight:700;left:46px;top:36px}#time,#trackName{position:absolute}#trackName{font-family:Geo,sans-serif;font-size:2em;left:163px;top:46px}#progress{background:transparent;display:block;height:7px;left:10px;position:absolute;top:105px;width:374px}#progress.ui-slider .ui-slider-handle{background:url(img/progress.png) no-repeat!important;background-size:20px 11px!important;border:none;height:11px;margin:-5px 0 0!important;position:absolute;width:20px;z-index:2}#next,#pause,#play,#prev,#stop{display:block;height:20px;left:36px;position:absolute;text-indent:-9999em;top:135px;width:20px}#next,#prev{height:14px;top:138px;width:14px}#play{left:66px}#pause{left:100px}#stop{left:135px}#next{left:171px}#repeat,#shuffle{background:url(img/switchOff.gif) no-repeat;background-size:23px 12px!important;display:block;height:16px;left:259px;position:absolute;text-indent:-9999em;top:140px;width:30px}#repeat.on,#shuffle.on{background:url(img/switchOn.gif) no-repeat}#repeat{left:320px}#next,#pause,#play,#prev,#stop{background:transparent;opacity:0}.track-info{font-family:Arial,Helvetica,sans-serif;font-size:1.2em;margin-bottom:10px;text-align:center}#display{background:url(img/display.jpg) no-repeat;background-size:412px 174px;display:block;height:174px;position:relative;width:412px}#balance,#volume{display:block;height:127px;left:20px;position:absolute;top:12px;width:7px}#balance{left:47px}#canvas{display:block;height:120px;margin:0;padding:0;position:absolute;right:14px;top:30px;width:324px}#trackListWrapper{background:url(img/trackListBottom.jpg) no-repeat bottom;background-size:412px 50px;display:block;padding-bottom:46px;position:relative;width:412px}#trackListWrapper img{display:block}#trackList{background:url(img/trackListMiddle.jpg) repeat-y;background-size:412px 12px;font-family:Geo,sans-serif;margin:0;padding:0;text-align:left;width:412px}#trackList a{color:#a28757;display:block;font-size:1.6em;margin:0 30px 1px 16px;padding:3px 5px;text-decoration:none}#trackList a.selected,#trackList a:hover{background:#e5c792;color:#4e4537}#trackList .tracklength{float:right}.ui-slider .ui-slider-handle{background:url(img/sliderHandle.png) no-repeat;background-size:14px 14px;border:none;cursor:pointer;height:14px;left:-.3em;margin:0 0 -.7em;position:absolute;width:14px;z-index:2}.ui-slider .ui-slider-handle.ui-state-active,.ui-slider .ui-slider-handle.ui-state-focus,.ui-slider .ui-slider-handle.ui-state-hover{border:none;outline:none}