.replay-button { position: relative; width: 35px; height: 35px; overflow: hidden; } .replay-button button { position: absolute; top: 0; left: 0; width: 100%; height: 100%; padding: 0; margin: 0; outline: none; border-style: none; background-size: 100% 100%; background-color: transparent; } .replay-button .checking { background-image: url(/fe/lol-replays/btn_replay_pending.png); -webkit-animation:spin 2s linear infinite; cursor: default; } .replay-button .found { background-image: url(/fe/lol-replays/btn_replay_pending.png); -webkit-animation:spin 2s linear infinite; cursor: default; } .replay-button .incompatible { background-image: url(/fe/lol-replays/btn_replay_watch_disabled.png); cursor: default; } .replay-button .missing-or-expired { background-image: url(/fe/lol-replays/btn_replay_error.png); cursor: default; } .replay-button .missing-or-expired:hover { background-image: url(/fe/lol-replays/btn_replay_error_hover.png); cursor: default; } .replay-button .error { background-image: url(/fe/lol-replays/btn_replay_error.png); cursor: default; } .replay-button .error:hover { background-image: url(/fe/lol-replays/btn_replay_error_hover.png); cursor: default; } .replay-button .watch { background-image: url(/fe/lol-replays/btn_replay_watch.png); cursor: pointer; } .replay-button .watch:hover { background-image: url(/fe/lol-replays/btn_replay_watch_hover.png); } .replay-button .watch:active { background-image: url(/fe/lol-replays/btn_replay_watch_click.png); } .replay-button .watch-disabled { background-image: url(/fe/lol-replays/btn_replay_watch_disabled.png); cursor: default; } .replay-button .download { background-image: url(/fe/lol-replays/btn_replay_download.png); cursor: pointer; } .replay-button .download:hover { background-image: url(/fe/lol-replays/btn_replay_download_hover.png); } .replay-button .download:active { background-image: url(/fe/lol-replays/btn_replay_download_click.png); } .replay-button .downloading { background-image: url(/fe/lol-replays/btn_replay_pending.png); -webkit-animation:spin 2s linear infinite; cursor: default; } .replay-button .retry-download { background-image: url(/fe/lol-replays/btn_replay_download.png); cursor: pointer; } .replay-button .retry-download:hover { background-image: url(/fe/lol-replays/btn_replay_download_hover.png); } .replay-button .retry-download:active { background-image: url(/fe/lol-replays/btn_replay_download_click.png); } .replay-button .lost { background-image: url(/fe/lol-replays/btn_replay_lost.png); cursor: default; } .replay-button .download-disabled { background-image: url(/fe/lol-replays/btn_replay_download_disabled.png); cursor: default; } .replay-button .unsupported { background-image: url(/fe/lol-replays/btn_replay_download_disabled.png); cursor: default; } div.preload-download-click { display: none; background-image: url(/fe/lol-replays/btn_replay_download_click.png); } div.preload-download-disabled { display: none; background-image: url(/fe/lol-replays/btn_replay_download_disabled.png); } div.preload-download-hover { display: none; background-image: url(/fe/lol-replays/btn_replay_download_hover.png); } div.preload-download { display: none; background-image: url(/fe/lol-replays/btn_replay_download.png); } div.preload-error-hover { display: none; background-image: url(/fe/lol-replays/btn_replay_error_hover.png); } div.preload-error { display: none; background-image: url(/fe/lol-replays/btn_replay_error.png); } div.preload-pending { display: none; background-image: url(/fe/lol-replays/btn_replay_pending.png); } div.preload-watch-click { display: none; background-image: url(/fe/lol-replays/btn_replay_watch_click.png); } div.preload-watch-disabled { display: none; background-image: url(/fe/lol-replays/btn_replay_watch_disabled.png); } div.preload-watch-hover { display: none; background-image: url(/fe/lol-replays/btn_replay_watch_hover.png); } div.preload-watch { display: none; background-image: url(/fe/lol-replays/btn_replay_watch.png); } .lol-replays-first-time-tip { width: 12em; min-width: 200px; margin: 1em; } @-webkit-keyframes spin { 100% { -webkit-transform: rotate(360deg); } } 