/* -------------------------------------------------- /* dark-standard variants /* -------------------------------------------------- */ /* SWITCH THE SPRITE SHEET AND OFFSETS */ .dark-standard-1 .jp-background { background: url("/assets/modules/player/voicesplayer-dark-standard-1.png") -206px 0 no-repeat; } .dark-standard-1 .jp-type-single .jp-play { background: url("/assets/modules/player/voicesplayer-dark-standard-1.png") -169px 0 no-repeat; } .dark-standard-1 .jp-type-single .jp-play:active { background: url("/assets/modules/player/voicesplayer-dark-standard-1.png") -135px 0 no-repeat; } .dark-standard-1 .jp-type-single .jp-pause { background: url("/assets/modules/player/voicesplayer-dark-standard-1.png") -100px 0 no-repeat; } .dark-standard-1 .jp-type-single .jp-pause:active { background: url("/assets/modules/player/voicesplayer-dark-standard-1.png") -66px 0 no-repeat; } .dark-standard-1 .jp-type-single .jp-loader-background { background: url("/assets/modules/player/voicesplayer-dark-standard-1.png") -31px 0 no-repeat; } .dark-standard-1 .jp-background-right { background: url("/assets/modules/player/voicesplayer-dark-standard-1.png") -1480px 0 no-repeat; } .dark-standard-1 .jp-scrubber { background: url("/assets/modules/player/voicesplayer-dark-standard-1.png") 0px 0 no-repeat; } .dark-standard-1 .jp-background-right { width: 120px; } .dark-standard-1 .jp-audio { min-width: 300px; } .dark-standard-1 .jp-scrubber-background { margin-right: 132px; } .dark-standard-1 .jp-progress { margin-right: 115px; } /* SWITCH THE SPRITE SHEET AND OFFSETS */ .dark-standard-2 .jp-background { background: url("/assets/modules/player/voicesplayer-dark-standard-2.png") -206px 0 no-repeat; } .dark-standard-2 .jp-type-single .jp-play { background: url("/assets/modules/player/voicesplayer-dark-standard-2.png") -169px 0 no-repeat; } .dark-standard-2 .jp-type-single .jp-play:active { background: url("/assets/modules/player/voicesplayer-dark-standard-2.png") -135px 0 no-repeat; } .dark-standard-2 .jp-type-single .jp-pause { background: url("/assets/modules/player/voicesplayer-dark-standard-2.png") -100px 0 no-repeat; } .dark-standard-2 .jp-type-single .jp-pause:active { background: url("/assets/modules/player/voicesplayer-dark-standard-2.png") -66px 0 no-repeat; } .dark-standard-2 .jp-type-single .jp-loader-background { background: url("/assets/modules/player/voicesplayer-dark-standard-2.png") -31px 0 no-repeat; } .dark-standard-2 .jp-background-right { background: url("/assets/modules/player/voicesplayer-dark-standard-2.png") -1410px 0 no-repeat; } .dark-standard-2 .jp-scrubber { background: url("/assets/modules/player/voicesplayer-dark-standard-2.png") 0px 0 no-repeat; } .dark-standard-2 .jp-background-right { width: 190px; } .dark-standard-2 .jp-duration { display: block; bottom: 13px; right: 115px; left: auto; font-size: 8px; } .dark-standard-2 .jp-current-time { display: block; bottom: 13px; right: 142px; left: auto; font-size: 8px; } .dark-standard-2 .jp-current-time:after { content: " / "; } .dark-standard-2 .jp-audio { min-width: 300px; } .dark-standard-2 .jp-scrubber-background { margin-right: 192px; } .dark-standard-2 .jp-progress { margin-right: 180px; } /* SWITCH THE SPRITE SHEET AND OFFSETS */ .dark-standard-3 .jp-background { background: url("/assets/modules/player/voicesplayer-dark-standard-3.png") -110px 0 no-repeat; } .dark-standard-3 .jp-type-single .jp-play { background: url("/assets/modules/player/voicesplayer-dark-standard-3.png") -75px -39px no-repeat; } .dark-standard-3 .jp-type-single .jp-play:active { background: url("/assets/modules/player/voicesplayer-dark-standard-3.png") -37px -39px no-repeat; } .dark-standard-3 .jp-type-single .jp-pause { background: url("/assets/modules/player/voicesplayer-dark-standard-3.png") -75px 0 no-repeat; } .dark-standard-3 .jp-type-single .jp-pause:active { background: url("/assets/modules/player/voicesplayer-dark-standard-3.png") -37px 0 no-repeat; } .dark-standard-3 .jp-type-single .jp-loader-background { background: url("/assets/modules/player/voicesplayer-dark-standard-3.png") -31px 0 no-repeat; } .dark-standard-3 .jp-background-right { background: url("/assets/modules/player/voicesplayer-dark-standard-3.png") -1400px 0 no-repeat; } .dark-standard-3 .jp-scrubber { background: url("/assets/modules/player/voicesplayer-dark-standard-3.png") 0px -40px no-repeat; } /* FIX THE HEIGHTS */ .dark-standard-3 .jp-background-right, .dark-standard-3 .jp-audio, .dark-standard-3 .jp-interface, .dark-standard-3 .jp-background-wrapper { height: 90px; } .dark-standard-3 .jp-background-right { width: 190px; } .dark-standard-3 .jp-audio { min-width: 400px; } .dark-standard-3 .jp-progress { margin-right: 180px; position: relative; top: 43px; } .dark-standard-3 .jp-duration { display: block; bottom: 22px; right: 115px; left: auto; font-size: 8px; } .dark-standard-3 .jp-current-time { display: block; bottom: 22px; right: 142px; left: auto; font-size: 8px; } .dark-standard-3 .jp-current-time:after { content: " / "; } .dark-standard-3 .jp-scrubber { background-position-y: -40px; height: 20px; margin-top: 10px; } .dark-standard-3 .jp-scrubber-background { margin-right: 192px; top: 5px; } .dark-standard-3 .jp-interface .jp-controls { height: 38px; top: 44px; width: auto; } .dark-standard-3 .jp-interface .jp-extra { color: #fff; color: rgba(255,255,255,0.9); position: absolute; top: 10px; width: 100%; font-size: 18px; } .dark-standard-3 .jp-title { color: #fff; color: rgba(255,255,255,0.9); font-weight: lighter; text-shadow: 0px -1px #444444; text-decoration: none; padding: 0 6px 0 10px; } .dark-standard-3 a.jp-title:hover { text-decoration: underline; } .dark-standard-3 a.jp-title:active { color:#dddddd; text-decoration: none; } .dark-standard-3 .jp-listens-box { position: absolute; right: 15px; } .dark-standard-3 .jp-digit-box { background-color: #666; background-color: rgba(0,0,0,0.3); padding: 1px 4px 1px 2px; margin-left: 3px; border: 1px inset #666; }