.audioplayer { margin: 10px 0; height: 2.5em; /* 40 */ color: #fff; border: 1px solid #222; position: relative; z-index: 1; background: #222; } .audioplayer.controls { display:none; } .audioplayer-mini { width: 2.5em; /* 40 */ margin: 0 auto; } .audioplayer > div { position: absolute; } .audioplayer-playpause { width: 2.5em; /* 40 */ height: 100%; text-align: left; text-indent: -9999px; cursor: pointer; z-index: 2; top: 0; left: 0; } .audioplayer-mini .audioplayer-playpause { width: 100%; } .audioplayer-playpause:hover, .audioplayer-playpause:focus { background-color: #222; } .audioplayer-playpause a { display: block; } .audioplayer:not(.audioplayer-playing) .audioplayer-playpause a { width: 0; height: 0; border: 0.5em solid transparent; /* 8 */ border-right: none; border-left-color: #fff; content: ''; position: absolute; top: 50%; left: 50%; margin: -0.5em 0 0 -0.25em; /* 8 4 */ } .audioplayer-playing .audioplayer-playpause a { width: 0.75em; height: 0.75em; position: absolute; top: 50%; left: 50%; margin: -0.375em 0 0 -0.375em; } .audioplayer-playing .audioplayer-playpause a:before, .audioplayer-playing .audioplayer-playpause a:after { width: 40%; height: 100%; background-color: #fff; content: ''; position: absolute; top: 0; } .audioplayer-playing .audioplayer-playpause a:before { left: 0; } .audioplayer-playing .audioplayer-playpause a:after { right: 0; } .audioplayer-time { width: 4.375em; /* 70 */ height: 100%; line-height: 2.375em; /* 38 */ text-align: center; z-index: 2; top: 0; } .audioplayer-time-current { border-left: 1px solid #111; border-left-color: rgba( 0, 0, 0, .25 ); left: 2.5em; /* 40 */ } .audioplayer-time-duration { right: 6.5em; /* 40 */ } .audioplayer-novolume .audioplayer-time-duration { border-right: 0; right: 0; } .audioplayer-bar { height: 0.5em; background-color: #222; cursor: pointer; z-index: 1; top: 50%; right: 10.875em; left: 6.875em; margin-top: -0.228em; } .audioplayer-novolume .audioplayer-bar { right: 4.375em; /* 70 */ } .audioplayer-bar div { width: 0; height: 100%; position: absolute; left: 0; top: 0; } .audioplayer-bar-loaded { background-color: #333; z-index: 1; } .audioplayer-bar-played { background: #1ba1e2; z-index: 2; } .audioplayer-volume { width: 6.5em; /* 40 */ height: 100%; border-left: 1px solid #111; border-left-color: rgba( 0, 0, 0, .25 ); text-align: left; text-indent: -9999px; cursor: pointer; z-index: 2; top: 0; right: 0; } .audioplayer-volume-button { width: 2.5em; height: 100%; position: absolute; top: 0; left: 0; } .audioplayer-volume-button a { width: 0.313em; /* 5 */ height: 0.375em; /* 6 */ background-color: #fff; display: block; position: relative; z-index: 1; top: 42%; left: 30%; } .audioplayer-volume-button a:before, .audioplayer-volume-button a:after { content: ''; position: absolute; } .audioplayer-volume-button a:before { width: 0; height: 0; border: 0.5em solid transparent; /* 8 */ border-left: none; border-right-color: #fff; z-index: 2; top: 50%; right: -0.25em; margin-top: -0.5em; /* 8 */ } .audioplayer:not(.audioplayer-mute) .audioplayer-volume-button a:after { /* "volume" icon by Nicolas Gallagher, http://nicolasgallagher.com/pure-css-gui-icons */ width: 0.313em; /* 5 */ height: 0.313em; /* 5 */ border: 0.25em double #fff; /* 4 */ border-width: 0.25em 0.25em 0 0; /* 4 */ left: 0.563em; /* 9 */ top: -0.063em; /* 1 */ -webkit-border-radius: 0 0.938em 0 0; /* 15 */ -moz-border-radius: 0 0.938em 0 0; /* 15 */ border-radius: 0 0.938em 0 0; /* 15 */ -webkit-transform: rotate( 45deg ); -moz-transform: rotate( 45deg ); -ms-transform: rotate( 45deg ); -o-transform: rotate( 45deg ); transform: rotate( 45deg ); } .audioplayer-volume-adjust { width: 4em; height: 100%; cursor: default; position: absolute; right: 0; top: 0; } .audioplayer-volume-adjust > div { height: .5em; background-color: #333; cursor: pointer; position: absolute; z-index: 1; top: 50%; margin-top: -0.228em; width: 3.5em; } .audioplayer-volume-adjust div div { width: 100%; height: 100%; position: absolute; bottom: 0; left: 0; background: #1ba1e2; } .audioplayer-novolume .audioplayer-volume { display: none; } .audioplayer *, .audioplayer *:before, .audioplayer *:after { -webkit-transition: color .25s ease, background-color .25s ease, opacity .5s ease; -moz-transition: color .25s ease, background-color .25s ease, opacity .5s ease; -ms-transition: color .25s ease, background-color .25s ease, opacity .5s ease; -o-transition: color .25s ease, background-color .25s ease, opacity .5s ease; transition: color .25s ease, background-color .25s ease, opacity .5s ease; } /*Skin*/ .audioplayer.light { color: #000; border: 1px solid #e5e5e5; background-color: #f4f4f4; } .audioplayer.light .audioplayer-time-current, .audioplayer.light .audioplayer-volume { border-left-color: #e5e5e5; } .audioplayer.light .audioplayer-playpause:hover, .audioplayer.light .audioplayer-playpause:focus { background-color: #e5e5e5; } .audioplayer.light:not(.audioplayer-playing) .audioplayer-playpause a { border-left-color: #000; } .audioplayer.light .audioplayer-volume-button a:before { border-right-color: #000; } .audioplayer.light:not(.audioplayer-mute) .audioplayer-volume-button a:after { border-color: #000; } .audioplayer.light .audioplayer-volume-button a { background-color: #000; } .audioplayer.light.audioplayer-playing .audioplayer-playpause a:before, .audioplayer.light.audioplayer-playing .audioplayer-playpause a:after { background-color: #000; } .audioplayer.light .audioplayer-bar { background-color: #ddd; } .audioplayer.light .audioplayer-bar-loaded, .audioplayer.light .audioplayer-volume-adjust > div { background-color: #dbdbdb; } /* FILE ARCHIVED ON 00:05:41 Dec 25, 2023 AND RETRIEVED FROM THE INTERNET ARCHIVE ON 05:21:19 Jun 25, 2026. JAVASCRIPT APPENDED BY WAYBACK MACHINE, COPYRIGHT INTERNET ARCHIVE. ALL OTHER CONTENT MAY ALSO BE PROTECTED BY COPYRIGHT (17 U.S.C. SECTION 108(a)(3)). */ /* playback timings (ms): capture_cache.get: 6.625 load_resource: 436.914 PetaboxLoader3.resolve: 105.151 PetaboxLoader3.datanode: 208.084 (2) loaddict: 217.277 */