.audiojs audio {position: absolute; left: -1px;}
.audiojs {width: 100%; overflow: hidden; margin-bottom: 4px; -webkit-border-radius: 4px 4px 4px 4px; -moz-border-radius: 4px 4px 4px 4px; -khtml-border-radius: 4px 4px 4px 4px; border-radius: 4px 4px 4px 4px; border-bottom: 1px solid}
.audiojs p {display: none; width: 100%; height: 20px; margin: 0; cursor: pointer;}
.audiojs .ap-play {display: block;}
.audiojs .ap-time em { padding: 0px 2px 0px 0px; font-style: normal; }
.audiojs .ap-time strong { padding: 0px 0px 0px 2px; font-weight: normal; }
.audiojs .ap-error-message { float: left; display: none; width: 100%; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; -o-text-overflow: ellipsis; -icab-text-overflow: ellipsis; -khtml-text-overflow: ellipsis; -moz-text-overflow: ellipsis; -webkit-text-overflow: ellipsis; }
.audiojs .ap-error-message a {text-decoration: none; padding-bottom: 1px; white-space: nowrap; }
.audiojs .ap-progress {position: absolute; top: 0; left: 0; width: 0; z-index: 1; cursor: pointer;}
.audiojs .ap-loaded {position: absolute; top: 0; left: 0; width: 0; background: #666; cursor: pointer;}
.audiojs .ap-scrubber, .audiojs .ap-progress, .audiojs .ap-loaded, .audiojs .ap-time {height: 20px;}
.audiojs .ap-play-pause {float: left; overflow: hidden;}
.audiojs .ap-scrubber {position: relative; background: #222222; border: 0; display: inline-block; overflow: hidden; cursor: pointer;}
.audiojs .ap-time {float: right; text-align: center; cursor: default;}
.audiojs .ap-play {background: url("../image/audioplayer.gif") center -4px no-repeat;}
.audiojs .ap-loading {background: url("../image/audioplayer.gif") center -34px no-repeat;}
.audiojs .ap-error {background: url("../image/audioplayer.gif") center -64px no-repeat;}
.audiojs .ap-pause {background: url("../image/audioplayer.gif") center -94px no-repeat;}
.ap-playing .ap-play, .ap-playing .ap-loading, .ap-playing .ap-error {display: none;}
.ap-playing .ap-pause {display: block;}
.ap-loading .ap-play, .ap-loading .ap-pause, .ap-loading .ap-error {display: none;}
.ap-loading .ap-loading {display: block;}
.ap-error .ap-time, .ap-error .ap-play, .ap-error .ap-pause, .ap-error .ap-scrubber, .ap-error .ap-loading {display: none;}
.ap-error .ap-error {display: block;}
.ap-error .ap-play-pause p {cursor: auto;}
.ap-error .ap-error-message {display: block;}
#audioplayer {margin: 15px 0 0; overflow: auto; }
#audioplayer ol {list-style: square inside; text-align: left; width: 100%; padding: 0; -webkit-margin-before: 0; -webkit-margin-after: 0; margin-bottom: 5px; }
#audioplayer ol li {position: relative; padding: 7px 15px; cursor: pointer; }
#audioplayer ol li:last-of-type {border-bottom: none; }
#audioplayer ol li a {text-indent: -3.3ex; text-decoration: none }
#audioplayer li a:hover { color: #000; text-decoration: none; }
#audioplayer li.ap-playing a { color: #000; }

.audiojs {background: #444444; border-bottom: 1px solid #8a8a8a;}
.audiojs .ap-time em { color: #f9f9f9; }
.audiojs .ap-error-message { color: #fff; }
.audiojs .ap-error-message a {color: #eee; border-bottom: 1px solid #999; }
.audiojs .ap-progress {background: #ffffff;}
.audiojs .ap-time {color: #ddd;}
#audioplayer ol {color: #ccc; background: #ffffff; }
#audioplayer ol li {border-bottom: 1px solid #ccc; }
#audioplayer ol li a {color: #8a8a8a; }
@media screen and (min-width: 240px) {
.col-sm-8 .audiojs .ap-play-pause, .audiojs .ap-play-pause {width: 10px; margin: 10px 5px 5px 5px;}
.col-sm-8 .audiojs .ap-scrubber, .audiojs .ap-scrubber {width: 40%; margin: 10px 1px 5px 1px;}
.col-sm-8 .audiojs .ap-time, .audiojs .ap-time {width: 80px; margin: 10px 5px 5px 1px;}
}

@media screen and (min-width: 320px) {
.col-sm-8 .audiojs .ap-play-pause, .audiojs .ap-play-pause {width: 10px; margin: 10px 5px 5px 5px;}
.col-sm-8 .audiojs .ap-scrubber, .audiojs .ap-scrubber {width: 55%; margin: 10px 1px 5px 1px;}
.col-sm-8 .audiojs .ap-time, .audiojs .ap-time {width: 80px; margin: 10px 5px 5px 1px;}
}

@media screen and (min-width: 480px) {
.col-sm-8 .audiojs .ap-play-pause, .audiojs .ap-play-pause {width: 10px; margin: 10px 5px 5px 5px;}
.col-sm-8 .audiojs .ap-scrubber, .audiojs .ap-scrubber {width: 65%; margin: 10px 1px 5px 1px;}
.col-sm-8 .audiojs .ap-time, .audiojs .ap-time {width: 80px; margin: 10px 5px 5px 1px;}
}

@media screen and (min-width: 768px) {
.col-sm-8 .audiojs .ap-play-pause, .audiojs .ap-play-pause {width: 10px; margin: 10px 5px 5px 5px;}
.col-sm-8 .audiojs .ap-scrubber, .audiojs .ap-scrubber {width: 75%; margin: 10px 1px 5px 1px;}
.col-sm-8 .audiojs .ap-time, .audiojs .ap-time {width: 80px; margin: 10px 5px 5px 1px;}
}

@media screen and (min-width: 1000px) {
.col-sm-8 .audiojs .ap-play-pause, .audiojs .ap-play-pause {width: 10px; margin: 10px 5px 5px 5px;}
.col-sm-8 .audiojs .ap-scrubber, .audiojs .ap-scrubber {width: 80%; margin: 10px 1px 5px 1px;}
.col-sm-8 .audiojs .ap-time, .audiojs .ap-time {width: 80px; margin: 10px 5px 5px 1px;}
}

.col-sm-4 .audiojs .ap-play-pause {width: 6%; margin: 10px 1% 5px 2%;}
.col-sm-4 .audiojs .ap-scrubber {width: 63%; margin: 10px 0 5px;}
.col-sm-4 .audiojs .ap-time {width: 23%; margin: 10px 2% 5px 1%;}