.lol-premade-voice-panel .lol-premade-voice-panel-header, .lol-premade-voice-panel .lol-premade-voice-panel-header .lol-premade-voice-panel-header-default .lol-premade-voice-panel-header-text, .lol-premade-voice-panel .lol-premade-voice-panel-header .lol-premade-voice-panel-header-clash .lol-premade-voice-panel-header-clash-title .lol-premade-voice-panel-header-clash-shortName { font-family: var(--font-display); } .lol-premade-voice-panel, .lol-premade-voice-panel .lol-premade-voice-panel-header .lol-premade-voice-panel-header-clash, .lol-premade-voice-panel .lol-premade-voice-panel-availability .lol-premade-voice-panel-message { font-family: var(--font-body); } .lol-premade-voice-panel .lol-premade-voice-panel-header, .lol-premade-voice-panel .lol-premade-voice-panel-header .lol-premade-voice-panel-header-default .lol-premade-voice-panel-header-text, .lol-premade-voice-panel .lol-premade-voice-panel-header .lol-premade-voice-panel-header-clash .lol-premade-voice-panel-header-clash-title .lol-premade-voice-panel-header-clash-shortName { font-family: var(--font-display); } .lol-premade-voice-panel, .lol-premade-voice-panel .lol-premade-voice-panel-header .lol-premade-voice-panel-header-clash, .lol-premade-voice-panel .lol-premade-voice-panel-availability .lol-premade-voice-panel-message { font-family: var(--font-body); } .lol-premade-voice-panel .lol-premade-voice-panel-header .lol-premade-voice-panel-header-default .lol-premade-voice-panel-header-text, .lol-premade-voice-panel .lol-premade-voice-panel-header .lol-premade-voice-panel-header-clash, .lol-premade-voice-panel .lol-premade-voice-panel-header .lol-premade-voice-panel-header-clash .lol-premade-voice-panel-header-clash-title .lol-premade-voice-panel-header-clash-shortName { -webkit-user-select: none; } .lol-premade-voice-panel .lol-premade-voice-panel-header .lol-premade-voice-panel-header-default .lol-premade-voice-panel-header-text, .lol-premade-voice-panel .lol-premade-voice-panel-header .lol-premade-voice-panel-header-clash, .lol-premade-voice-panel .lol-premade-voice-panel-header .lol-premade-voice-panel-header-clash .lol-premade-voice-panel-header-clash-title .lol-premade-voice-panel-header-clash-shortName { font-kerning: normal; -webkit-font-feature-settings: "kern" 1; -webkit-font-smoothing: antialiased; } .lol-premade-voice-panel .lol-premade-voice-panel-header .lol-premade-voice-panel-header-default .lol-premade-voice-panel-header-text, .lol-premade-voice-panel .lol-premade-voice-panel-header .lol-premade-voice-panel-header-clash .lol-premade-voice-panel-header-clash-title .lol-premade-voice-panel-header-clash-shortName { text-transform: uppercase; } .lol-premade-voice-panel .lol-premade-voice-panel-header .lol-premade-voice-panel-header-default .lol-premade-voice-panel-header-text:lang(ko-kr), .lol-premade-voice-panel .lol-premade-voice-panel-header .lol-premade-voice-panel-header-clash .lol-premade-voice-panel-header-clash-title .lol-premade-voice-panel-header-clash-shortName:lang(ko-kr), .lol-premade-voice-panel .lol-premade-voice-panel-header .lol-premade-voice-panel-header-default .lol-premade-voice-panel-header-text:lang(ja-jp), .lol-premade-voice-panel .lol-premade-voice-panel-header .lol-premade-voice-panel-header-clash .lol-premade-voice-panel-header-clash-title .lol-premade-voice-panel-header-clash-shortName:lang(ja-jp), .lol-premade-voice-panel .lol-premade-voice-panel-header .lol-premade-voice-panel-header-default .lol-premade-voice-panel-header-text:lang(tr-tr), .lol-premade-voice-panel .lol-premade-voice-panel-header .lol-premade-voice-panel-header-clash .lol-premade-voice-panel-header-clash-title .lol-premade-voice-panel-header-clash-shortName:lang(tr-tr), .lol-premade-voice-panel .lol-premade-voice-panel-header .lol-premade-voice-panel-header-default .lol-premade-voice-panel-header-text:lang(el-gr), .lol-premade-voice-panel .lol-premade-voice-panel-header .lol-premade-voice-panel-header-clash .lol-premade-voice-panel-header-clash-title .lol-premade-voice-panel-header-clash-shortName:lang(el-gr), .lol-premade-voice-panel .lol-premade-voice-panel-header .lol-premade-voice-panel-header-default .lol-premade-voice-panel-header-text:lang(th-th), .lol-premade-voice-panel .lol-premade-voice-panel-header .lol-premade-voice-panel-header-clash .lol-premade-voice-panel-header-clash-title .lol-premade-voice-panel-header-clash-shortName:lang(th-th), .lol-premade-voice-panel .lol-premade-voice-panel-header .lol-premade-voice-panel-header-default .lol-premade-voice-panel-header-text:lang(zh-tw), .lol-premade-voice-panel .lol-premade-voice-panel-header .lol-premade-voice-panel-header-clash .lol-premade-voice-panel-header-clash-title .lol-premade-voice-panel-header-clash-shortName:lang(zh-tw) { text-transform: none; } .lol-premade-voice-panel .lol-premade-voice-panel-header .lol-premade-voice-panel-header-clash .lol-premade-voice-panel-header-clash-title .lol-premade-voice-panel-header-clash-shortName { color: #f0e6d2; font-size: 18px; font-weight: 700; line-height: 22px; letter-spacing: 0.05em; } .lol-premade-voice-panel .lol-premade-voice-panel-header .lol-premade-voice-panel-header-default .lol-premade-voice-panel-header-text { color: #f0e6d2; font-size: 14px; font-weight: 700; line-height: 18px; letter-spacing: 0.075em; } .lol-premade-voice-panel .lol-premade-voice-panel-header .lol-premade-voice-panel-header-clash { color: #a09b8c; font-size: 14px; font-weight: normal; line-height: 20px; letter-spacing: 0.025em; -webkit-font-smoothing: subpixel-antialiased; } .lol-premade-voice-panel .lol-premade-voice-panel-header .lol-premade-voice-panel-header-clash { color: #f0e6d2; } .lol-premade-voice-panel .lol-premade-voice-panel-current-player-content lol-uikit-slider { width: 155px; height: 15px; } .lol-premade-voice-panel .lol-premade-voice-panel-current-player-content lol-uikit-slider::shadow .lol-uikit-slider-base:before { top: 7px; } .lol-premade-voice-panel .lol-premade-voice-panel-current-player-content lol-uikit-slider::shadow .lol-uikit-slider-btn { cursor: pointer; width: 15px; height: 15px; } .lol-premade-voice-panel .lol-premade-voice-panel-current-player-content lol-uikit-slider::shadow .lol-uikit-slider-btn:hover { background-position: 0 -15px; } .lol-premade-voice-panel .lol-premade-voice-panel-current-player-content lol-uikit-slider::shadow .lol-uikit-slider-btn:active { background-position: 0 -30px; } .lol-premade-voice-panel .lol-premade-voice-panel-current-player-content lol-uikit-slider::shadow .lol-uikit-slider-fill { top: 6px; } lol-parties-comm-panel { width: 272px; height: 365px; overflow: hidden; } .lol-premade-voice-panel { display: flex; flex-direction: column; background: #010a13; border: 1px solid #1e2328; cursor: default; opacity: 0; transform: translateY(350px); transform-origin: center bottom; transition: transform 500ms cubic-bezier(0.02, 0.85, 0.08, 0.99), opacity 300ms ease; position: relative; } .lol-premade-voice-panel:lang(ar-ae) { direction: rtl; } .lol-premade-voice-panel.show { opacity: 1; transform: translateY(0); } .lol-premade-voice-panel .lol-premade-voice-panel-header { display: flex; flex-direction: row; flex-wrap: wrap; width: 100%; height: 47px; border-bottom: 1px solid #463714; align-items: center; } .lol-premade-voice-panel .lol-premade-voice-panel-header .lol-premade-voice-panel-header-default .lol-premade-voice-panel-header-text { display: flex; flex-direction: column; font-size: 14px; color: #f0e6d2; margin: 0 0 0 8px; } .lol-premade-voice-panel .lol-premade-voice-panel-header .lol-premade-voice-panel-header-default .lol-premade-voice-panel-header-text:lang(ar-ae) { margin: 0 8px 0 0; } .lol-premade-voice-panel .lol-premade-voice-panel-header .lol-premade-voice-panel-header-clash { display: none; color: #f0e6d2; display: flex; align-items: center; justify-content: flex-end; height: 47px; padding-left: 8px; box-sizing: border-box; flex-shrink: 0; overflow: hidden; } .lol-premade-voice-panel .lol-premade-voice-panel-header .lol-premade-voice-panel-header-clash .lol-premade-voice-panel-header-clash-logo { display: inline; height: 32px; width: 32px; } .lol-premade-voice-panel .lol-premade-voice-panel-header .lol-premade-voice-panel-header-clash .lol-premade-voice-panel-header-clash-title .lol-premade-voice-panel-header-clash-shortName { color: #c8aa6e; flex-direction: row; margin-left: 7px; margin-right: 7px; display: inline; } .lol-premade-voice-panel .lol-premade-voice-panel-header .lol-premade-voice-panel-header-clash .lol-premade-voice-panel-header-clash-title .lol-premade-voice-panel-header-clash-name { text-overflow: ellipsis; max-width: 150px; flex-direction: row; display: inline; } .lol-premade-voice-panel .lol-premade-voice-panel-content { display: flex; height: 216px; padding: 0px 11px; box-sizing: border-box; } .lol-premade-voice-panel .lol-premade-voice-panel-participants { flex-direction: column; visibility: visible; } .lol-premade-voice-panel .lol-premade-voice-panel-participants lol-parties-comm-participant { height: 54px; } .lol-premade-voice-panel .lol-premade-voice-panel-participants.hide { visibility: hidden; margin: 0px; height: 0px; } .lol-premade-voice-panel .lol-premade-voice-panel-availability { flex-direction: column; align-items: center; color: #3c3c41; justify-content: center; } .lol-premade-voice-panel .lol-premade-voice-panel-availability .lol-premade-voice-panel-poro { background-image: url(/fe/lol-premade-voice/voice-poro.png); background-size: cover; width: 128px; height: 128px; } .lol-premade-voice-panel .lol-premade-voice-panel-availability .lol-premade-voice-panel-message { width: 180px; text-align: center; font-size: 14px; } .lol-premade-voice-panel .lol-premade-voice-panel-availability.hide { display: none; margin: 0px; height: 0px; } .lol-premade-voice-panel .lol-premade-voice-panel-connection-bar { display: flex; justify-content: space-between; height: 32px; width: 100%; align-items: center; background: linear-gradient(to top, rgba(255,255,255,0.1) 0%, rgba(255,255,255,0) 100%); border-bottom: 1px solid #1e2328; cursor: default; } .lol-premade-voice-panel .lol-premade-voice-panel-connection-bar:hover { background: rgba(255,255,255,0.1); } .lol-premade-voice-panel .lol-premade-voice-panel-connection-bar.connected { color: #3cb44b; } .lol-premade-voice-panel .lol-premade-voice-panel-connection-bar.connected.button-hover { color: #f0e6d2; } .lol-premade-voice-panel .lol-premade-voice-panel-connection-bar.connected .lol-premade-voice-panel-connection-icon { background-image: url(/fe/lol-premade-voice/disconnect-default.png); } .lol-premade-voice-panel .lol-premade-voice-panel-connection-bar.connected .lol-premade-voice-panel-connection-icon:hover { background-image: url(/fe/lol-premade-voice/disconnect-hover.png); } .lol-premade-voice-panel .lol-premade-voice-panel-connection-bar.connected .lol-premade-voice-panel-connection-icon:active { background-image: url(/fe/lol-premade-voice/disconnect-click.png); } .lol-premade-voice-panel .lol-premade-voice-panel-connection-bar.disconnected { color: #a09b8c; } .lol-premade-voice-panel .lol-premade-voice-panel-connection-bar.disconnected.button-hover { color: #f0e6d2; } .lol-premade-voice-panel .lol-premade-voice-panel-connection-bar.disconnected .lol-premade-voice-panel-connection-icon { background-image: url(/fe/lol-premade-voice/reconnect-default.png); } .lol-premade-voice-panel .lol-premade-voice-panel-connection-bar.disconnected .lol-premade-voice-panel-connection-icon:hover { background-image: url(/fe/lol-premade-voice/reconnect-hover.png); } .lol-premade-voice-panel .lol-premade-voice-panel-connection-bar.disconnected .lol-premade-voice-panel-connection-icon:active { background-image: url(/fe/lol-premade-voice/reconnect-click.png); } .lol-premade-voice-panel .lol-premade-voice-panel-connection-bar.connecting { color: #cdbe91; } .lol-premade-voice-panel .lol-premade-voice-panel-connection-bar .lol-premade-voice-panel-connection-state { font-size: 14px; flex-grow: 1; margin: 0 0 0 7px; } .lol-premade-voice-panel .lol-premade-voice-panel-connection-bar .lol-premade-voice-panel-connection-state:lang(ar-ae) { margin: 0 7px 0 0; } .lol-premade-voice-panel .lol-premade-voice-panel-connection-bar .lol-premade-voice-panel-connection-icon { background-size: cover; width: 18px; height: 18px; cursor: pointer; margin: 0 7px 0 0; } .lol-premade-voice-panel .lol-premade-voice-panel-connection-bar .lol-premade-voice-panel-connection-icon:lang(ar-ae) { margin: 0 0 0 7px; } .lol-premade-voice-panel .lol-premade-voice-panel-connection-bar .lol-premade-voice-panel-connection-icon.locked { pointer-events: none; opacity: 0.3; } .lol-premade-voice-panel .lol-premade-voice-panel-current-player { display: flex; flex-direction: row; height: 54px; } .lol-premade-voice-panel .lol-premade-voice-panel-current-player:hover { background: linear-gradient(to right, rgba(255,255,255,0.1) 0%, rgba(255,255,255,0) 100%); } .lol-premade-voice-panel .lol-premade-voice-panel-current-player .lol-premade-voice-panel-player-highlight { display: flex; width: 7px; background-color: #785a28; } .lol-premade-voice-panel .lol-premade-voice-panel-current-player .lol-premade-voice-panel-current-player-buttons { display: flex; position: absolute; bottom: 11px; right: 11px; } .lol-premade-voice-panel .lol-premade-voice-panel-current-player .lol-premade-voice-panel-current-player-buttons:lang(ar-ae) { right: auto; left: 11px; } .lol-premade-voice-panel .lol-premade-voice-panel-current-player .lol-premade-voice-panel-current-player-mic { background-image: url(/fe/lol-premade-voice/mic-default.png); background-size: cover; width: 18px; height: 18px; cursor: pointer; } .lol-premade-voice-panel .lol-premade-voice-panel-current-player .lol-premade-voice-panel-current-player-mic:hover { background-image: url(/fe/lol-premade-voice/mic-hover.png); } .lol-premade-voice-panel .lol-premade-voice-panel-current-player .lol-premade-voice-panel-current-player-mic:active { background-image: url(/fe/lol-premade-voice/mic-click.png); } .lol-premade-voice-panel .lol-premade-voice-panel-current-player .lol-premade-voice-panel-current-player-mic.muted { background-image: url(/fe/lol-premade-voice/mic-muted-default.png); } .lol-premade-voice-panel .lol-premade-voice-panel-current-player .lol-premade-voice-panel-current-player-mic.muted:hover { background-image: url(/fe/lol-premade-voice/mic-muted-hover.png); } .lol-premade-voice-panel .lol-premade-voice-panel-current-player .lol-premade-voice-panel-current-player-mic.muted:active { background-image: url(/fe/lol-premade-voice/mic-muted-click.png); } .lol-premade-voice-panel .lol-premade-voice-panel-current-player .lol-premade-voice-panel-current-player-mic.disabled { background-image: url(/fe/lol-premade-voice/mic-disabled.png); cursor: default; } .lol-premade-voice-panel .lol-premade-voice-panel-current-player .lol-premade-voice-panel-current-player-deafen { background-image: url(/fe/lol-premade-voice/deafen-default.png); background-size: cover; width: 18px; height: 18px; margin: 0 5px 0 5px; cursor: pointer; display: none; } .lol-premade-voice-panel .lol-premade-voice-panel-current-player .lol-premade-voice-panel-current-player-deafen:hover { background-image: url(/fe/lol-premade-voice/deafen-hover.png); } .lol-premade-voice-panel .lol-premade-voice-panel-current-player .lol-premade-voice-panel-current-player-deafen:active { background-image: url(/fe/lol-premade-voice/deafen-click.png); } .lol-premade-voice-panel .lol-premade-voice-panel-current-player .lol-premade-voice-panel-current-player-deafen.deafened { background-image: url(/fe/lol-premade-voice/deafened-default.png); } .lol-premade-voice-panel .lol-premade-voice-panel-current-player .lol-premade-voice-panel-current-player-deafen.deafened:hover { background-image: url(/fe/lol-premade-voice/deafened-hover.png); } .lol-premade-voice-panel .lol-premade-voice-panel-current-player .lol-premade-voice-panel-current-player-deafen.deafened:active { background-image: url(/fe/lol-premade-voice/deafened-click.png); } .lol-premade-voice-panel .lol-premade-voice-panel-current-player .lol-premade-voice-panel-current-player-settings { background-image: url(/fe/lol-premade-voice/settings-default.png); background-size: cover; width: 18px; height: 18px; cursor: pointer; } .lol-premade-voice-panel .lol-premade-voice-panel-current-player .lol-premade-voice-panel-current-player-settings:hover { background-image: url(/fe/lol-premade-voice/settings-hover.png); } .lol-premade-voice-panel .lol-premade-voice-panel-current-player .lol-premade-voice-panel-current-player-settings:active { background-image: url(/fe/lol-premade-voice/settings-click.png); } .lol-premade-voice-panel .lol-premade-voice-panel-current-player .lol-premade-voice-panel-current-player-settings.disabled, .lol-premade-voice-panel .lol-premade-voice-panel-current-player .lol-premade-voice-panel-current-player-settings .disabled:hover, .lol-premade-voice-panel .lol-premade-voice-panel-current-player .lol-premade-voice-panel-current-player-settings .disabled:active { background-image: url(/fe/lol-premade-voice/settings-disabled.png); cursor: default; } .lol-premade-voice-panel .voice-panel-avatar-wrapper { align-self: center; margin: 0 8px 0 4px; } .lol-premade-voice-panel .voice-panel-avatar-wrapper:lang(ar-ae) { margin: 0 4px 0 8px; } .lol-premade-voice-panel .lol-premade-voice-panel-current-player-content { display: flex; flex-direction: column; font-size: 14px; color: #cdbe91; margin: 11px 0 11px 3px; } .lol-premade-voice-panel .lol-premade-voice-panel-current-player-content:lang(ar-ae) { margin: 11px 3px 11px 0; } .lol-premade-voice-panel .lol-premade-voice-panel-current-player-content .lol-premade-voice-panel-current-player-row { display: flex; flex-direction: row; justify-content: space-between; } .lol-premade-voice-panel .lol-premade-voice-panel-current-player-content .lol-premade-voice-panel-current-player-row .lol-premade-voice-panel-current-player-name { max-width: 130px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; } .lol-premade-voice-panel .lol-premade-voice-panel-current-player-content .lol-premade-voice-panel-current-player-row .lol-premade-voice-panel-current-player-volume-label { margin: 0 2px 0 0; } .lol-premade-voice-panel .lol-premade-voice-panel-current-player-content .lol-premade-voice-panel-current-player-row .lol-premade-voice-panel-current-player-volume-label:lang(ar-ae) { margin: 0 0 0 2px; } .lol-premade-voice-panel .lol-premade-voice-panel-current-player-content.disabled { color: #3c3c41; } .lol-premade-voice-button { display: flex; width: 38px; height: 32px; background-image: url(/fe/lol-premade-voice/voice-button.png); background-position-y: 0px; background-size: cover; cursor: pointer; } .lol-premade-voice-button:hover:not(.button-disabled) { background-position-y: -32px; } .lol-premade-voice-button:active:not(.button-disabled) { background-position-y: -64px; } .lol-premade-voice-button.button-disabled { background-position-y: -160px; cursor: default; } .lol-premade-voice-button.active { background-position-y: -96px; } .lol-premade-voice-button.voice-disabled { display: none; } lol-uikit-content-block.lol-premade-voice-button-tooltip[type=tooltip-small] { padding: 9px; } .lol-premade-voice-participant .lol-premade-voice-panel-participant-content lol-uikit-slider { width: 155px; height: 15px; } .lol-premade-voice-participant .lol-premade-voice-panel-participant-content lol-uikit-slider::shadow .lol-uikit-slider-base:before { top: 7px; } .lol-premade-voice-participant .lol-premade-voice-panel-participant-content lol-uikit-slider::shadow .lol-uikit-slider-btn { cursor: pointer; width: 15px; height: 15px; } .lol-premade-voice-participant .lol-premade-voice-panel-participant-content lol-uikit-slider::shadow .lol-uikit-slider-btn:hover { background-position: 0 -15px; } .lol-premade-voice-participant .lol-premade-voice-panel-participant-content lol-uikit-slider::shadow .lol-uikit-slider-btn:active { background-position: 0 -30px; } .lol-premade-voice-participant .lol-premade-voice-panel-participant-content lol-uikit-slider::shadow .lol-uikit-slider-fill { top: 6px; } .lol-premade-voice-participant { display: flex; flex-direction: row; height: 100%; width: 100%; align-items: center; position: relative; } .lol-premade-voice-participant.speaking { background: linear-gradient(to right, rgba(255,255,255,0.1) 0%, rgba(255,255,255,0) 100%); } .lol-premade-voice-participant .lol-premade-voice-panel-chat-icon { align-self: center; } .lol-premade-voice-participant .lol-premade-voice-panel-participant-mute { background-image: url(/fe/lol-premade-voice/mute-default.png); background-position: center; background-size: cover; background-repeat: no-repeat; width: 18px; height: 18px; margin-top: 14px; cursor: pointer; position: relative; } .lol-premade-voice-participant .lol-premade-voice-panel-participant-mute:hover { background-image: url(/fe/lol-premade-voice/mute-hover.png); } .lol-premade-voice-participant .lol-premade-voice-panel-participant-mute:active { background-image: url(/fe/lol-premade-voice/mute-click.png); } .lol-premade-voice-participant .lol-premade-voice-panel-participant-mute.muted { background-image: url(/fe/lol-premade-voice/muted-default.png); } .lol-premade-voice-participant .lol-premade-voice-panel-participant-mute.muted:hover { background-image: url(/fe/lol-premade-voice/muted-hover.png); } .lol-premade-voice-participant .lol-premade-voice-panel-participant-mute.muted:active { background-image: url(/fe/lol-premade-voice/muted-click.png); } .lol-premade-voice-participant .lol-premade-voice-panel-participant-content { display: flex; flex-direction: column; width: 205px; color: #a09b8c; font-size: 14px; margin: 11px 0 11px 9px; } .lol-premade-voice-participant .lol-premade-voice-panel-participant-content:lang(ar-ae) { margin: 11px 9px 11px 0; } .lol-premade-voice-participant .lol-premade-voice-panel-participant-content .lol-premade-voice-panel-participant-volume-row { display: flex; flex-direction: row; justify-content: space-between; width: 155px; } .lol-premade-voice-participant .lol-premade-voice-panel-participant-content .lol-premade-voice-panel-participant-volume-row .lol-premade-voice-panel-participant-name { max-width: 130px; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; } .lol-premade-voice-participant .lol-premade-voice-panel-participant-content .lol-premade-voice-panel-participant-volume-row .lol-premade-voice-panel-participant-volume { margin: 0 2px 0 0; } .lol-premade-voice-participant .lol-premade-voice-panel-participant-content .lol-premade-voice-panel-participant-volume-row .lol-premade-voice-panel-participant-volume:lang(ar-ae) { margin: 0 0 0 2px; } .lol-premade-voice-comm-halo { transition: box-shadow 0.15s ease-in-out; position: relative; } .lol-premade-voice-comm-halo:before { content: ''; opacity: 0; width: 100%; height: 100%; position: absolute; top: 0; left: 0; transition: opacity 0.15s ease-in-out; box-shadow: 0 0 0 2px #4bb44b; } .lol-premade-voice-comm-halo.speaking:before { opacity: 1; } .lol-premade-voice-comm-halo.small:before { box-shadow: 0 0 0 1px #4bb44b; } .lol-premade-voice-comm-halo { border-radius: 50%; } .lol-premade-voice-comm-halo:before { border-radius: 50%; } .lol-voice-mic-test-label { font-family: var(--font-body); } .lol-voice-mic-test-label { font-family: var(--font-body); } .lol-voice-mic-test-label { -webkit-user-select: none; } .lol-voice-mic-test-label { font-kerning: normal; -webkit-font-feature-settings: "kern" 1; -webkit-font-smoothing: antialiased; } .lol-voice-mic-test-label { color: #a09b8c; font-size: 12px; font-weight: normal; line-height: 16px; letter-spacing: 0.025em; -webkit-font-smoothing: subpixel-antialiased; } .lol-voice-mic-test-label:lang(ja-jp) { font-size: 13px; } .lol-voice-mic-test-button { display: flex; width: 38px; height: 32px; background-image: url(/fe/lol-premade-voice/voice-button.png); background-position-y: 0px; background-size: cover; cursor: pointer; } .lol-voice-mic-test-button:hover:not(.button-disabled) { background-position-y: -32px; } .lol-voice-mic-test-button:active:not(.button-disabled) { background-position-y: -64px; } .lol-voice-mic-test-button.button-disabled { background-position-y: -160px; cursor: default; } .lol-voice-mic-test-button.active { background-position-y: -96px; } .lol-voice-mic-test-button { transition: box-shadow 0.15s ease-in-out; position: relative; } .lol-voice-mic-test-button:before { content: ''; opacity: 0; width: 100%; height: 100%; position: absolute; top: 0; left: 0; transition: opacity 0.15s ease-in-out; box-shadow: 0 0 0 2px #4bb44b; } .lol-voice-mic-test-button.speaking:before { opacity: 1; } .lol-voice-mic-test-button.small:before { box-shadow: 0 0 0 1px #4bb44b; } .lol-voice-mic-test-label { min-height: 16px; margin-bottom: 5px; } .lol-voice-mic-test-button.active { background-position-y: -96px; }