.audiojs audio { position: absolute; left: -1px; }         
.audiojs { width: 460px; height: 100px; overflow: hidden; font-family: monospace; font-size: 12px; background:#f6f6f6; border:1px #fff solid; border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px; box-shadow:0px 0px 1px #333; -moz-box-shadow:0px 0px 1px #333; -webkit-box-shadow:0px 0px 1px #333;}         
.audiojs .play-pause { width: 25px; height: 40px; padding: 4px 6px; margin: 0px; float: left; overflow: hidden; border-right: 1px solid #000; }         
.audiojs p { display: none; width: 25px; height: 40px; margin: 0px; cursor: pointer; }         
.audiojs .play { display: block; }         
.audiojs .scrubber { position: relative; float: left; width: 280px; background: #5a5a5a; height: 14px; margin: 10px; border-top: 1px solid #3f3f3f; border-left: 0px; border-bottom: 0px; overflow: hidden; }         
.audiojs .progress { position: absolute; top: 0px; left: 0px; height: 14px; width: 0px; background: #ccc; z-index: 1;           background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #ccc), color-stop(0.5, #ddd), color-stop(0.51, #ccc), color-stop(1, #ccc));           background-image: -moz-linear-gradient(center top, #ccc 0%, #ddd 50%, #ccc 51%, #ccc 100%); }         
.audiojs .loaded { position: absolute; top: 0px; left: 0px; height: 14px; width: 0px; background: #000;           background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #222), color-stop(0.5, #333), color-stop(0.51, #222), color-stop(1, #222));           background-image: -moz-linear-gradient(center top, #222 0%, #333 50%, #222 51%, #222 100%); }         
.audiojs .time { float: left; height: 36px; line-height: 36px; margin: 0px 0px 0px 6px; padding: 0px 6px 0px 12px; border-left: 1px solid #000; color: #ddd; text-shadow: 1px 1px 0px rgba(0, 0, 0, 0.5); }         
.audiojs .time em { padding: 0px 2px 0px 0px; color: #f9f9f9; font-style: normal; }         
.audiojs .time strong { padding: 0px 0px 0px 2px; font-weight: normal; }         
.audiojs .error-message { float: left; display: none; margin: 0px 10px; height: 36px; width: 400px; overflow: hidden; line-height: 36px; white-space: nowrap; color: #fff;           text-overflow: ellipsis; -o-text-overflow: ellipsis; -icab-text-overflow: ellipsis; -khtml-text-overflow: ellipsis; -moz-text-overflow: ellipsis; -webkit-text-overflow: ellipsis; }         
.audiojs .error-message a { color: #eee; text-decoration: none; padding-bottom: 1px; border-bottom: 1px solid #999; white-space: wrap; }                 
.audiojs .play { background: url(audiojs/player-graphics.gif) -2px -1px no-repeat; }         
.audiojs .loading { background: url(audiojs/player-graphics.gif) -2px -31px no-repeat; }         
.audiojs .error { background: url(audiojs/player-graphics.gif) -2px -61px no-repeat; }         
.audiojs .pause { background: url(audiojs/player-graphics.gif) -2px -91px no-repeat; }                 
.playing .play, .playing .loading, .playing .error { display: none; }         
.playing .pause { display: block; }                 
.loading .play, .loading .pause, .loading .error { display: none; }         
.loading .loading { display: block; }                 
.error .time, .error .play, .error .pause, .error .scrubber, .error .loading { display: none; }         
.error .error { display: block; }         
.error .play-pause p { cursor: auto; }        
.error .error-message { display: block; }

#content_block .play-pause, #content_block .time{border:none;}
#content_block .scrubber{background:#eaeaea; border:1px #dbdbdb solid; height:5px; border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px; cursor:pointer; overflow:visible; top:5px;}
#content_block .loaded{background:#a1c9a5; border:1px #8faed6 solid; height:5px; border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px; top:-1px;}
#content_block .progress{background:#198e25; border:1px #1c5297 solid; height:5px; border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px; top:-1px;}
#content_block .audiojs .time em{font-size:12px; color:#717171; text-shadow:1px 1px 1px #fff; font-family:sans-serif, Verdana, Geneva; font-weight:bold;}
#content_block .audiojs .time strong{font-size:12px; color:#188c24; text-shadow:1px 1px 1px #fff; font-family:sans-serif, Verdana, Geneva; font-weight:bold;}
.track_title{position:absolute; top:50px; left:0px; z-index:1; font-size:18px; color:#188c24; text-shadow:1px 1px 1px #fff; font-family:sans-serif, Verdana, Geneva; width:395px; background:url(audiojs/border_top.png) left top repeat-x; padding:5px 20px 0px 47px;}
.track{font-size:12px;}
#content_block .play-pause{height:25px;}

ol li a { color: #717171; text-shadow:0px 1px 2px #fff;}
	  ol li{}
      #wrapper { width: 462px; margin: 40px auto; }
      
      ol { padding: 20px; margin: 0px; list-style:none; color: #ccc; width: 420px; border-top: 1px solid #ccc; font-size: 12px; background:#f6f6f6; border:1px #fff solid; border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px; box-shadow:0px 0px 1px #333; -moz-box-shadow:0px 0px 1px #333; -webkit-box-shadow:0px 0px 1px #333; margin-top:10px;}
      ol li { position: relative; margin: 0px; padding: 4px 10px 5px 5px; border-bottom: 1px solid #ccc; cursor: pointer; margin-top:3px; background:#f1f1f1; border:1px #d4d4d4 solid; border-radius:5px; -moz-border-radius:5px; -webkit-border-radius:5px; box-shadow:inset 0px 0px 10px #dbdbdb;}
      ol li a { display: block; text-indent: -15px; padding: 9px 0px 10px 20px; }
      li.playing { color: #aaa; text-shadow: 1px 1px 0px rgba(255, 255, 255, 0.3); }
      li.playing a { color: #000; }
      
      #shortcuts { position: fixed; bottom: 0px; width: 100%; color: #666; font-size: 0.9em; margin: 60px 0px 0px; padding: 20px 20px 15px; background: #f3f3f3; background: rgba(240, 240, 240, 0.7); }
      #shortcuts div { width: 460px; margin: 0px auto; }
      #shortcuts h1 { margin: 0px 0px 6px; }
      #shortcuts p { margin: 0px 0px 18px; }
      #shortcuts em { font-style: normal; background: #d3d3d3; padding: 3px 9px; position: relative; left: -3px;
        -webkit-border-radius: 4px; -moz-border-radius: 4px; -o-border-radius: 4px; border-radius: 4px;
        -webkit-box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.1); -moz-box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.1); -o-box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.1); box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.1); }

      @media screen and (max-device-width: 480px) {
        #wrapper { position: relative; left: -3%; }
        #shortcuts { display: none; }
      }