.rcp-fe-lol-tft-daily-orb .header .title, .rcp-fe-lol-tft-daily-orb .orb-disabled-label, .rcp-fe-lol-tft-daily-orb .orb-timer-label, .rcp-fe-lol-tft-daily-orb .progress-bar.leveling-disabled .orb-leveling-tooltip-trigger { font-family: var(--font-display); } .rcp-fe-lol-tft-daily-orb .header .title, .rcp-fe-lol-tft-daily-orb .orb-disabled-label, .rcp-fe-lol-tft-daily-orb .orb-timer-label, .rcp-fe-lol-tft-daily-orb .progress-bar.leveling-disabled .orb-leveling-tooltip-trigger { -webkit-user-select: none; } .rcp-fe-lol-tft-daily-orb .header .title, .rcp-fe-lol-tft-daily-orb .orb-disabled-label, .rcp-fe-lol-tft-daily-orb .orb-timer-label, .rcp-fe-lol-tft-daily-orb .progress-bar.leveling-disabled .orb-leveling-tooltip-trigger { font-kerning: normal; -webkit-font-feature-settings: "kern" 1; -webkit-font-smoothing: antialiased; } .rcp-fe-lol-tft-daily-orb .header .title, .rcp-fe-lol-tft-daily-orb .orb-disabled-label, .rcp-fe-lol-tft-daily-orb .orb-timer-label, .rcp-fe-lol-tft-daily-orb .progress-bar.leveling-disabled .orb-leveling-tooltip-trigger { text-transform: uppercase; } .rcp-fe-lol-tft-daily-orb .header .title:lang(ko-kr), .rcp-fe-lol-tft-daily-orb .orb-disabled-label:lang(ko-kr), .rcp-fe-lol-tft-daily-orb .orb-timer-label:lang(ko-kr), .rcp-fe-lol-tft-daily-orb .progress-bar.leveling-disabled .orb-leveling-tooltip-trigger:lang(ko-kr), .rcp-fe-lol-tft-daily-orb .header .title:lang(ja-jp), .rcp-fe-lol-tft-daily-orb .orb-disabled-label:lang(ja-jp), .rcp-fe-lol-tft-daily-orb .orb-timer-label:lang(ja-jp), .rcp-fe-lol-tft-daily-orb .progress-bar.leveling-disabled .orb-leveling-tooltip-trigger:lang(ja-jp), .rcp-fe-lol-tft-daily-orb .header .title:lang(tr-tr), .rcp-fe-lol-tft-daily-orb .orb-disabled-label:lang(tr-tr), .rcp-fe-lol-tft-daily-orb .orb-timer-label:lang(tr-tr), .rcp-fe-lol-tft-daily-orb .progress-bar.leveling-disabled .orb-leveling-tooltip-trigger:lang(tr-tr), .rcp-fe-lol-tft-daily-orb .header .title:lang(el-gr), .rcp-fe-lol-tft-daily-orb .orb-disabled-label:lang(el-gr), .rcp-fe-lol-tft-daily-orb .orb-timer-label:lang(el-gr), .rcp-fe-lol-tft-daily-orb .progress-bar.leveling-disabled .orb-leveling-tooltip-trigger:lang(el-gr), .rcp-fe-lol-tft-daily-orb .header .title:lang(th-th), .rcp-fe-lol-tft-daily-orb .orb-disabled-label:lang(th-th), .rcp-fe-lol-tft-daily-orb .orb-timer-label:lang(th-th), .rcp-fe-lol-tft-daily-orb .progress-bar.leveling-disabled .orb-leveling-tooltip-trigger:lang(th-th), .rcp-fe-lol-tft-daily-orb .header .title:lang(zh-tw), .rcp-fe-lol-tft-daily-orb .orb-disabled-label:lang(zh-tw), .rcp-fe-lol-tft-daily-orb .orb-timer-label:lang(zh-tw), .rcp-fe-lol-tft-daily-orb .progress-bar.leveling-disabled .orb-leveling-tooltip-trigger:lang(zh-tw) { text-transform: none; } .rcp-fe-lol-tft-daily-orb .progress-bar.leveling-disabled .orb-leveling-tooltip-trigger { color: #f0e6d2; font-size: 24px; font-weight: 700; line-height: 28px; letter-spacing: 0.05em; } .rcp-fe-lol-tft-daily-orb .header .title, .rcp-fe-lol-tft-daily-orb .orb-disabled-label, .rcp-fe-lol-tft-daily-orb .orb-timer-label { color: #f0e6d2; font-size: 14px; font-weight: 700; line-height: 18px; letter-spacing: 0.075em; } .rcp-fe-lol-tft-daily-orb { position: absolute; top: 114px; left: 35px; } .rcp-fe-lol-tft-daily-orb .orb-contents { border: 2px solid #32281e; margin-top: 10px; width: 346px; height: 249px; text-align: center; background: url("/fe/lol-tft/images/orb-bg.png") no-repeat; background-position: 50% 40%; background-size: contain; background-color: rgba(1,10,19,0.6); } .rcp-fe-lol-tft-daily-orb .orb { display: block; width: 128px; height: 128px; margin: 25px auto 0; background: url("/fe/lol-tft/images/orb-0.png") no-repeat center/contain; } .rcp-fe-lol-tft-daily-orb .orb.level-1 { background-image: url("/fe/lol-tft/images/orb-1.png"); } .rcp-fe-lol-tft-daily-orb .orb.level-2 { background-image: url("/fe/lol-tft/images/orb-2.png"); } .rcp-fe-lol-tft-daily-orb .orb.level-3 { background-image: url("/fe/lol-tft/images/orb-3.png"); } .rcp-fe-lol-tft-daily-orb .orb.level-4 { background-image: url("/fe/lol-tft/images/orb-4.png"); } .rcp-fe-lol-tft-daily-orb .orb.level-5 { background-image: url("/fe/lol-tft/images/orb-5.png"); } .rcp-fe-lol-tft-daily-orb .orb.disabled { background-image: url("/fe/lol-tft/images/orb-4.png"); -webkit-filter: saturate(0.2); } .rcp-fe-lol-tft-daily-orb .orb-disabled-label { color: #785a28; margin: 18px 25px; } .rcp-fe-lol-tft-daily-orb .orb-timer-label { color: #785a28; margin: 8px 0; } .rcp-fe-lol-tft-daily-orb .progress-bar-wrapper { position: absolute; bottom: 45px; left: 0; right: 0; } .rcp-fe-lol-tft-daily-orb .progress-bar-wrapper::before, .rcp-fe-lol-tft-daily-orb .progress-bar-wrapper::after { content: ""; position: absolute; display: block; height: 2px; width: 50px; top: 3px; background-image: linear-gradient(to right, #32281e, #32281e 50%, transparent); } .rcp-fe-lol-tft-daily-orb .progress-bar-wrapper::after { right: 0px; background-image: linear-gradient(to left, #32281e, #32281e 50%, transparent); } .rcp-fe-lol-tft-daily-orb .progress-bar { display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: center; } .rcp-fe-lol-tft-daily-orb .progress-bar.leveling-disabled .progress-bar-tick { background-color: #3c3c41; -webkit-filter: brightness(0.9) opacity(0.5); } .rcp-fe-lol-tft-daily-orb .progress-bar.leveling-disabled .orb-leveling-tooltip-trigger { display: block; width: 20px; position: absolute; left: 50%; transform: translateX(-50%); top: -12px; color: #a09b8c; } .rcp-fe-lol-tft-daily-orb .progress-bar-tick { width: 42px; height: 6px; background-color: #0a323c; margin: 0 3px; } .rcp-fe-lol-tft-daily-orb .progress-bar-tick.complete { background-image: linear-gradient(#049cff, #243f69); } .rcp-fe-lol-tft-daily-orb .orb-buttons { position: absolute; bottom: -13px; width: 100%; display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: center; } .rcp-fe-lol-tft-daily-orb .orb-buttons lol-uikit-flat-button { margin: 0 3px; width: 140px; } .rcp-fe-lol-tft-orb-leveling-disabled-tooltip-header, .rcp-fe-lol-tft-orb-leveling-disabled-tooltip-body { text-align: left; } .rcp-fe-lol-tft-weekly-missions .header .title { font-family: var(--font-display); } .rcp-fe-lol-tft-weekly-missions .header .unprocessed-games-container { font-family: var(--font-body); } .rcp-fe-lol-tft-weekly-missions .header .title, .rcp-fe-lol-tft-weekly-missions .header .unprocessed-games-container { -webkit-user-select: none; } .rcp-fe-lol-tft-weekly-missions .header .title, .rcp-fe-lol-tft-weekly-missions .header .unprocessed-games-container { font-kerning: normal; -webkit-font-feature-settings: "kern" 1; -webkit-font-smoothing: antialiased; } .rcp-fe-lol-tft-weekly-missions .header .title { text-transform: uppercase; } .rcp-fe-lol-tft-weekly-missions .header .title:lang(ko-kr), .rcp-fe-lol-tft-weekly-missions .header .title:lang(ja-jp), .rcp-fe-lol-tft-weekly-missions .header .title:lang(tr-tr), .rcp-fe-lol-tft-weekly-missions .header .title:lang(el-gr), .rcp-fe-lol-tft-weekly-missions .header .title:lang(th-th), .rcp-fe-lol-tft-weekly-missions .header .title:lang(zh-tw) { text-transform: none; } .rcp-fe-lol-tft-weekly-missions .header .title { color: #f0e6d2; font-size: 14px; font-weight: 700; line-height: 18px; letter-spacing: 0.075em; } .rcp-fe-lol-tft-weekly-missions .header .unprocessed-games-container { color: #a09b8c; font-size: 12px; font-weight: normal; line-height: 16px; letter-spacing: 0.1em; -webkit-font-smoothing: subpixel-antialiased; } .rcp-fe-lol-tft-weekly-missions .header .unprocessed-games-container:lang(ja-jp) { font-size: 13px; } .rcp-fe-lol-tft-weekly-missions { position: absolute; top: 114px; right: 35px; width: 346px; height: 290px; } .rcp-fe-lol-tft-weekly-missions .header .unprocessed-games-container { position: absolute; display: flex; top: 0; right: 0; align-items: center; } .rcp-fe-lol-tft-weekly-missions .header .unprocessed-games { margin-top: 3px; } .rcp-fe-lol-tft-weekly-missions .unprocessed-games-container .clock-icon { background: url("/fe/lol-tft/images/clock-icon.png") no-repeat center/contain; display: inline-block; width: 18px; height: 18px; margin-right: 5px; } .rcp-fe-lol-tft-weekly-missions .missions { border: 2px solid #32281e; margin-top: 10px; padding: 3px 10px; height: 262px; display: flex; flex-direction: column; justify-content: space-between; background-color: rgba(1,10,19,0.6); } .rcp-fe-lol-tft-weekly-missions .missions > *:not(:last-child)::after { content: ''; position: absolute; bottom: 0px; left: 0; width: 100%; height: 1px; background-color: #1e2328; } .rcp-fe-lol-tft-unprocessed-games-tooltip-note { color: #3c3c41; } .rcp-fe-lol-tft-unprocessed-games-tooltip-header, .rcp-fe-lol-tft-unprocessed-games-tooltip-body, .rcp-fe-lol-tft-unprocessed-games-tooltip-note { text-align: left; } .rcp-fe-lol-tft-mission-card .mission-footer .expiry, .rcp-fe-lol-tft-mission-card .mission-footer .reward-description, .rcp-fe-lol-tft-mission-card .progress-dials .or-separator, .rcp-fe-lol-tft-mission-card lol-uikit-radial-progress .top, .rcp-fe-lol-tft-mission-card .description, .rcp-fe-lol-tft-mission-card .points { font-family: var(--font-body); } .rcp-fe-lol-tft-mission-card .mission-footer .expiry, .rcp-fe-lol-tft-mission-card .mission-footer .reward-description, .rcp-fe-lol-tft-mission-card .progress-dials .or-separator, .rcp-fe-lol-tft-mission-card lol-uikit-radial-progress .top, .rcp-fe-lol-tft-mission-card .description, .rcp-fe-lol-tft-mission-card .points { -webkit-user-select: none; } .rcp-fe-lol-tft-mission-card .mission-footer .expiry, .rcp-fe-lol-tft-mission-card .mission-footer .reward-description, .rcp-fe-lol-tft-mission-card .progress-dials .or-separator, .rcp-fe-lol-tft-mission-card lol-uikit-radial-progress .top, .rcp-fe-lol-tft-mission-card .description, .rcp-fe-lol-tft-mission-card .points { font-kerning: normal; -webkit-font-feature-settings: "kern" 1; -webkit-font-smoothing: antialiased; } .rcp-fe-lol-tft-mission-card .mission-footer .expiry, .rcp-fe-lol-tft-mission-card .mission-footer .reward-description, .rcp-fe-lol-tft-mission-card .progress-dials .or-separator, .rcp-fe-lol-tft-mission-card .description, .rcp-fe-lol-tft-mission-card .points { color: #a09b8c; font-size: 12px; font-weight: normal; line-height: 16px; letter-spacing: 0.025em; -webkit-font-smoothing: subpixel-antialiased; } .rcp-fe-lol-tft-mission-card .mission-footer .expiry:lang(ja-jp), .rcp-fe-lol-tft-mission-card .mission-footer .reward-description:lang(ja-jp), .rcp-fe-lol-tft-mission-card .progress-dials .or-separator:lang(ja-jp), .rcp-fe-lol-tft-mission-card .description:lang(ja-jp), .rcp-fe-lol-tft-mission-card .points:lang(ja-jp) { font-size: 13px; } .rcp-fe-lol-tft-mission-card lol-uikit-radial-progress .top { color: #a09b8c; font-size: 12px; font-weight: normal; line-height: 16px; letter-spacing: 0.1em; -webkit-font-smoothing: subpixel-antialiased; } .rcp-fe-lol-tft-mission-card lol-uikit-radial-progress .top:lang(ja-jp) { font-size: 13px; } .rcp-fe-lol-tft-mission-card { position: relative; height: 84px; flex-grow: 1; } .rcp-fe-lol-tft-mission-card .mission-unavailable, .rcp-fe-lol-tft-mission-card .mission-content { display: flex; align-items: center; justify-content: space-between; position: relative; height: 54px; margin-top: 8px; } .rcp-fe-lol-tft-mission-card .mission-unavailable { height: 70px; } .rcp-fe-lol-tft-mission-card .mission-footer { height: 16px; position: relative; } .rcp-fe-lol-tft-mission-card .mission-footer .expiry { color: #3c3c41; text-align: left; position: absolute; left: 0; top: 0; } .rcp-fe-lol-tft-mission-card .mission-footer .reward-description { position: absolute; right: 0; top: 0; width: 50%; text-align: right; } .rcp-fe-lol-tft-mission-card .progress-dials { display: flex; align-items: center; } .rcp-fe-lol-tft-mission-card .progress-dials .or-separator { height: 16px; position: relative; margin: 0 3px; opacity: 0.8; white-space: nowrap; } .rcp-fe-lol-tft-mission-card .progress-dials .or-separator::before, .rcp-fe-lol-tft-mission-card .progress-dials .or-separator::after { content: ""; display: block; position: absolute; left: 50%; width: 1px; height: 14px; background-color: #1e2328; } .rcp-fe-lol-tft-mission-card .progress-dials .or-separator::before { bottom: 18px; } .rcp-fe-lol-tft-mission-card .progress-dials .or-separator::after { top: 18px; } .rcp-fe-lol-tft-mission-card lol-uikit-radial-progress { width: 54px; height: 54px; } .rcp-fe-lol-tft-mission-card lol-uikit-radial-progress .top { top: 50%; left: 50%; position: absolute; transform: translate(-50%, -50%); padding-top: 2px; } .rcp-fe-lol-tft-mission-card .description { flex-grow: 2; padding: 0 10px; word-wrap: break-word; width: 220px; } .rcp-fe-lol-tft-mission-card .sleepy .description { padding: 0 10px 0; } .rcp-fe-lol-tft-mission-card .mission-completed { padding-bottom: 10px; } .rcp-fe-lol-tft-mission-card .reward { text-align: center; } .rcp-fe-lol-tft-mission-card .reward-icon { border: 1px solid #3c3c41; box-shadow: inset 0 0 0 1px #000; width: 48px; height: 48px; } .rcp-fe-lol-tft-mission-card .sleeping-poro { background: url("/fe/lol-tft/images/sleeping-poro.png") no-repeat center/contain; display: inline-block; width: 50px; height: 50px; } .rcp-fe-lol-tft-mission-card .claim { display: flex; align-items: center; justify-content: center; background: url("/fe/lol-tft/images/mission-claim-magic.png") no-repeat center/contain; position: absolute; width: 100%; height: 100%; top: 0; } .rcp-fe-lol-tft-mission-card .claim-button { display: block; margin-top: -6px; box-shadow: 0px 0px 20px 5px #005a82; } .rcp-fe-lol-tft-mission-card .claim-button:hover { box-shadow: 0px 0px 30px 5px #005a82; -webkit-filter: brightness(125%); } .rcp-fe-lol-tft-mission-card .claim-button:active { -webkit-filter: brightness(80%); } .rcp-fe-lol-tft-mission-card .claimable-background { opacity: 0.25; } .rcp-fe-lol-tft-battle-pass .header .title { font-family: var(--font-display); } .rcp-fe-lol-tft-battle-pass .header .title { -webkit-user-select: none; } .rcp-fe-lol-tft-battle-pass .header .title { font-kerning: normal; -webkit-font-feature-settings: "kern" 1; -webkit-font-smoothing: antialiased; } .rcp-fe-lol-tft-battle-pass .header .title { text-transform: uppercase; } .rcp-fe-lol-tft-battle-pass .header .title:lang(ko-kr), .rcp-fe-lol-tft-battle-pass .header .title:lang(ja-jp), .rcp-fe-lol-tft-battle-pass .header .title:lang(tr-tr), .rcp-fe-lol-tft-battle-pass .header .title:lang(el-gr), .rcp-fe-lol-tft-battle-pass .header .title:lang(th-th), .rcp-fe-lol-tft-battle-pass .header .title:lang(zh-tw) { text-transform: none; } .rcp-fe-lol-tft-battle-pass .header .title { color: #f0e6d2; font-size: 14px; font-weight: 700; line-height: 18px; letter-spacing: 0.075em; } .rcp-fe-lol-tft-battle-pass { position: absolute; bottom: 50px; left: 16px; width: 1024px; height: 230px; } .rcp-fe-lol-tft-battle-pass .header { display: flex; justify-content: center; margin: 8px 20px; } .rcp-fe-lol-tft-battle-pass .header .title { line-height: 30px; white-space: nowrap; } .rcp-fe-lol-tft-battle-pass .header .line-break { max-width: 715px; display: flex; flex-direction: column; justify-content: center; margin: 0 8px; } .rcp-fe-lol-tft-battle-pass .header .line-break-img { width: 100%; display: block; } .rcp-fe-lol-tft-progression-milestone-list .milestones-wrapper { display: flex; justify-content: center; } .rcp-fe-lol-tft-progression-milestone-list .milestones { display: flex; overflow-x: hidden; overflow-y: hidden; white-space: nowrap; } .rcp-fe-lol-tft-progression-milestone-list .left-button-group, .rcp-fe-lol-tft-progression-milestone-list .right-button-group { display: flex; justify-content: center; flex-direction: column; } .rcp-fe-lol-tft-progression-milestone-list .left-button-group .arrow, .rcp-fe-lol-tft-progression-milestone-list .right-button-group .arrow { width: 30px; } .rcp-fe-lol-tft-progression-milestone .progress-indicator-info { font-family: var(--font-body); } .rcp-fe-lol-tft-progression-milestone .progress-indicator-info { -webkit-user-select: none; } .rcp-fe-lol-tft-progression-milestone .progress-indicator-info { font-kerning: normal; -webkit-font-feature-settings: "kern" 1; -webkit-font-smoothing: antialiased; } .rcp-fe-lol-tft-progression-milestone .progress-indicator-info { color: #a09b8c; font-size: 14px; font-weight: normal; line-height: 20px; letter-spacing: 0.025em; -webkit-font-smoothing: subpixel-antialiased; } .rcp-fe-lol-tft-progression-milestone { height: 216px; display: inline-block; } .rcp-fe-lol-tft-progression-milestone .rewards { position: relative; height: 150px; } .rcp-fe-lol-tft-progression-milestone .progress-bar-container { position: relative; width: 148px; height: 54px; } .rcp-fe-lol-tft-progression-milestone .progress-bar-container:before { content: ""; position: absolute; width: 100%; height: 100%; background: url("/fe/lol-tft/images/pass-progress-bar.png") no-repeat center/contain; } .rcp-fe-lol-tft-progression-milestone .progress-bar-container.first-bar:before { background: url("/fe/lol-tft/images/pass-progress-bar-end.png") no-repeat center/contain; } .rcp-fe-lol-tft-progression-milestone .progress-bar-container.last-bar:before { background: url("/fe/lol-tft/images/pass-progress-bar-end.png") no-repeat center/contain; transform: scaleX(-1); } .rcp-fe-lol-tft-progression-milestone .milestone-container { position: relative; left: 38px; bottom: 58px; width: 72px; height: 72px; } .rcp-fe-lol-tft-progression-milestone .progress-bar { position: absolute; top: 25px; left: -62px; max-width: 124px; height: 4px; background-color: #0f5f87; border-radius: 1px; } .rcp-fe-lol-tft-progression-milestone .progress-bar.in-progress { background: linear-gradient(to right, #0f5f87 50%, #1bd8e3 100%); } .rcp-fe-lol-tft-progression-milestone .progress-bar.progress-complete { left: 86px; width: 54px; } .rcp-fe-lol-tft-progression-milestone .progress-bar.progress-complete:after { content: ""; left: 100%; position: absolute; height: 0; width: 0; border: solid transparent; border-left-color: #0f5f87; border-width: 2px; } .rcp-fe-lol-tft-progression-milestone .first-bar .progress-bar::after { content: ""; right: 100%; position: absolute; height: 0; width: 0; border: solid transparent; border-right-color: #0f5f87; border-width: 2px; } .rcp-fe-lol-tft-progression-milestone .progress-indicator-container { position: absolute; top: 0; right: 0; } .rcp-fe-lol-tft-progression-milestone .progress-indicator-line { position: absolute; width: 1px; height: 16px; background: linear-gradient(#cdfafa, #fff 20%, transparent); } .rcp-fe-lol-tft-progression-milestone .progress-indicator-info { position: absolute; top: 18px; transform: translateX(-50%); } .rcp-fe-lol-tft-progression-milestone .progress-indicator-points-earned { color: #cdfafa; } .rcp-fe-lol-tft-progression-milestone .progress-indicator-points-required { color: #0596aa; } .rcp-fe-lol-tft-progression-milestone .milestone-complete { position: absolute; bottom: 5px; z-index: 1; width: 72px; } .rcp-fe-lol-tft-progression-milestone .milestone-locked { position: absolute; top: 15px; left: 20px; width: 33px; } .rcp-fe-lol-tft-progression-reward .reward, .rcp-fe-lol-tft-progression-reward .state-in-progress .reward-frame { font-family: var(--font-display); } .rcp-fe-lol-tft-progression-reward .claim-label { font-family: var(--font-body); } .rcp-fe-lol-tft-progression-reward .reward, .rcp-fe-lol-tft-progression-reward .state-in-progress .reward-frame, .rcp-fe-lol-tft-progression-reward .claim-label { -webkit-user-select: none; } .rcp-fe-lol-tft-progression-reward .reward, .rcp-fe-lol-tft-progression-reward .state-in-progress .reward-frame, .rcp-fe-lol-tft-progression-reward .claim-label { font-kerning: normal; -webkit-font-feature-settings: "kern" 1; -webkit-font-smoothing: antialiased; } .rcp-fe-lol-tft-progression-reward .reward, .rcp-fe-lol-tft-progression-reward .state-in-progress .reward-frame { text-transform: uppercase; } .rcp-fe-lol-tft-progression-reward .reward:lang(ko-kr), .rcp-fe-lol-tft-progression-reward .state-in-progress .reward-frame:lang(ko-kr), .rcp-fe-lol-tft-progression-reward .reward:lang(ja-jp), .rcp-fe-lol-tft-progression-reward .state-in-progress .reward-frame:lang(ja-jp), .rcp-fe-lol-tft-progression-reward .reward:lang(tr-tr), .rcp-fe-lol-tft-progression-reward .state-in-progress .reward-frame:lang(tr-tr), .rcp-fe-lol-tft-progression-reward .reward:lang(el-gr), .rcp-fe-lol-tft-progression-reward .state-in-progress .reward-frame:lang(el-gr), .rcp-fe-lol-tft-progression-reward .reward:lang(th-th), .rcp-fe-lol-tft-progression-reward .state-in-progress .reward-frame:lang(th-th), .rcp-fe-lol-tft-progression-reward .reward:lang(zh-tw), .rcp-fe-lol-tft-progression-reward .state-in-progress .reward-frame:lang(zh-tw) { text-transform: none; } .rcp-fe-lol-tft-progression-reward .state-in-progress .reward-frame { color: #f0e6d2; font-size: 24px; font-weight: 700; line-height: 28px; letter-spacing: 0.05em; } .rcp-fe-lol-tft-progression-reward .reward { color: #f0e6d2; font-size: 18px; font-weight: 700; line-height: 22px; letter-spacing: 0.05em; } .rcp-fe-lol-tft-progression-reward .claim-label { color: #a09b8c; font-size: 14px; font-weight: normal; line-height: 20px; letter-spacing: 0.025em; -webkit-font-smoothing: subpixel-antialiased; } .rcp-fe-lol-tft-progression-reward { position: absolute; width: 100%; height: 100%; } .rcp-fe-lol-tft-progression-reward .reward { position: absolute; top: 25px; left: 24px; width: 100px; height: 100px; text-align: center; } .rcp-fe-lol-tft-progression-reward .reward:before { content: ""; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: #081010; } .rcp-fe-lol-tft-progression-reward .reward-frame { position: absolute; width: 148px; height: 150px; left: -24px; top: -25px; pointer-events: none; } .rcp-fe-lol-tft-progression-reward .reward-image { position: absolute; left: 0; top: 0px; height: 100%; width: 100%; pointer-events: none; } .rcp-fe-lol-tft-progression-reward .label { position: absolute; bottom: 12px; left: 45px; width: 60px; pointer-events: all; line-height: 28px; } .rcp-fe-lol-tft-progression-reward .state-acquired .reward-frame { background: url("/fe/lol-tft/images/pass-reward-frame-default.png") no-repeat center/contain; } .rcp-fe-lol-tft-progression-reward .state-acquired:hover .reward-frame { background: url("/fe/lol-tft/images/pass-reward-frame-default-hover.png") no-repeat center/contain; } .rcp-fe-lol-tft-progression-reward .state-unclaimed { cursor: pointer; transition: all 0.25s ease; } .rcp-fe-lol-tft-progression-reward .state-unclaimed[disabled] { pointer-events: none; -webkit-filter: grayscale(75%); cursor: default; } .rcp-fe-lol-tft-progression-reward .state-unclaimed .reward-frame { background: url("/fe/lol-tft/images/pass-reward-frame-claim.png") no-repeat center/contain; } .rcp-fe-lol-tft-progression-reward .state-unclaimed:hover .reward-frame { background: url("/fe/lol-tft/images/pass-reward-frame-claim-hover.png") no-repeat center/contain; } .rcp-fe-lol-tft-progression-reward .state-in-progress { top: 7px; left: 15px; width: 118px; height: 118px; } .rcp-fe-lol-tft-progression-reward .state-in-progress .reward-frame { left: -14px; top: -8px; background: url("/fe/lol-tft/images/pass-reward-frame-next.png") no-repeat center/contain; color: #c89b3c; } .rcp-fe-lol-tft-progression-reward .state-in-progress:hover .reward-frame { background: url("/fe/lol-tft/images/pass-reward-frame-next-hover.png") no-repeat center/contain; color: #f0e6d2; } .rcp-fe-lol-tft-progression-reward .state-unavailable .reward-image { -webkit-filter: saturate(0.5) opacity(0.5); transition: -webkit-filter 0.1s linear; } .rcp-fe-lol-tft-progression-reward .state-unavailable .reward-frame { background: url("/fe/lol-tft/images/pass-reward-frame-locked.png") no-repeat center/contain; } .rcp-fe-lol-tft-progression-reward .state-unavailable .label { color: #5c5b57; } .rcp-fe-lol-tft-progression-reward .state-unavailable:hover { -webkit-filter: brightness(120%); } .rcp-fe-lol-tft-progression-reward .state-unavailable:hover .reward-image { -webkit-filter: saturate(1) opacity(1); } .rcp-fe-lol-tft-progression-reward .claim-label { position: absolute; top: -26px; left: 0; width: 100%; pointer-events: none; text-align: center; text-transform: uppercase; font-weight: 900; letter-spacing: 0.05em; background: linear-gradient(to bottom, #0f5f87 10%, #1bd8e3 70%, #fff 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; } .rcp-fe-lol-tft-progression-reward .particles { position: absolute; top: -25px; left: -24px; pointer-events: none; } .rcp-fe-lol-tft-progression-reward .particles img { position: absolute; width: 148px; height: 148px; top: 0; left: 0; } .rcp-fe-lol-tft-progression-reward .particles img:nth-child(1) { animation: change-background-1 10s linear alternate infinite; } .rcp-fe-lol-tft-progression-reward .particles img:nth-child(2) { animation: change-background-2 10s linear alternate infinite; } .rcp-fe-lol-tft-progression-reward .particles img:nth-child(3) { animation: change-background-3 10s linear alternate infinite; } .rcp-fe-lol-tft-progression-reward .particles img:nth-child(4) { animation: change-background-4 10s linear alternate infinite; } .rcp-fe-lol-tft-progression-reward .particles img:nth-child(5) { animation: change-background-5 10s linear alternate infinite; } @-moz-keyframes change-background-1 { 0% { opacity: 1; } 50% { opacity: 1; } 10%, 20%, 30%, 40%, 60%, 70%, 80%, 90%, 100% { opacity: 0; } } @-webkit-keyframes change-background-1 { 0% { opacity: 1; } 50% { opacity: 1; } 10%, 20%, 30%, 40%, 60%, 70%, 80%, 90%, 100% { opacity: 0; } } @-o-keyframes change-background-1 { 0% { opacity: 1; } 50% { opacity: 1; } 10%, 20%, 30%, 40%, 60%, 70%, 80%, 90%, 100% { opacity: 0; } } @keyframes change-background-1 { 0% { opacity: 1; } 50% { opacity: 1; } 10%, 20%, 30%, 40%, 60%, 70%, 80%, 90%, 100% { opacity: 0; } } @-moz-keyframes change-background-2 { 10% { opacity: 1; } 60% { opacity: 1; } 0%, 20%, 30%, 40%, 50%, 70%, 80%, 90%, 100% { opacity: 0; } } @-webkit-keyframes change-background-2 { 10% { opacity: 1; } 60% { opacity: 1; } 0%, 20%, 30%, 40%, 50%, 70%, 80%, 90%, 100% { opacity: 0; } } @-o-keyframes change-background-2 { 10% { opacity: 1; } 60% { opacity: 1; } 0%, 20%, 30%, 40%, 50%, 70%, 80%, 90%, 100% { opacity: 0; } } @keyframes change-background-2 { 10% { opacity: 1; } 60% { opacity: 1; } 0%, 20%, 30%, 40%, 50%, 70%, 80%, 90%, 100% { opacity: 0; } } @-moz-keyframes change-background-3 { 20% { opacity: 1; } 70% { opacity: 1; } 0%, 10%, 30%, 40%, 50%, 60%, 80%, 90%, 100% { opacity: 0; } } @-webkit-keyframes change-background-3 { 20% { opacity: 1; } 70% { opacity: 1; } 0%, 10%, 30%, 40%, 50%, 60%, 80%, 90%, 100% { opacity: 0; } } @-o-keyframes change-background-3 { 20% { opacity: 1; } 70% { opacity: 1; } 0%, 10%, 30%, 40%, 50%, 60%, 80%, 90%, 100% { opacity: 0; } } @keyframes change-background-3 { 20% { opacity: 1; } 70% { opacity: 1; } 0%, 10%, 30%, 40%, 50%, 60%, 80%, 90%, 100% { opacity: 0; } } @-moz-keyframes change-background-4 { 30% { opacity: 1; } 80% { opacity: 1; } 0%, 10%, 20%, 40%, 50%, 60%, 70%, 90%, 100% { opacity: 0; } } @-webkit-keyframes change-background-4 { 30% { opacity: 1; } 80% { opacity: 1; } 0%, 10%, 20%, 40%, 50%, 60%, 70%, 90%, 100% { opacity: 0; } } @-o-keyframes change-background-4 { 30% { opacity: 1; } 80% { opacity: 1; } 0%, 10%, 20%, 40%, 50%, 60%, 70%, 90%, 100% { opacity: 0; } } @keyframes change-background-4 { 30% { opacity: 1; } 80% { opacity: 1; } 0%, 10%, 20%, 40%, 50%, 60%, 70%, 90%, 100% { opacity: 0; } } @-moz-keyframes change-background-5 { 40% { opacity: 1; } 90% { opacity: 1; } 0%, 10%, 20%, 30%, 50%, 60%, 70%, 80%, 100% { opacity: 0; } } @-webkit-keyframes change-background-5 { 40% { opacity: 1; } 90% { opacity: 1; } 0%, 10%, 20%, 30%, 50%, 60%, 70%, 80%, 100% { opacity: 0; } } @-o-keyframes change-background-5 { 40% { opacity: 1; } 90% { opacity: 1; } 0%, 10%, 20%, 30%, 50%, 60%, 70%, 80%, 100% { opacity: 0; } } @keyframes change-background-5 { 40% { opacity: 1; } 90% { opacity: 1; } 0%, 10%, 20%, 30%, 50%, 60%, 70%, 80%, 100% { opacity: 0; } } .rcp-fe-lol-tft-ranked-banner.emphasized .banner-position-rank-label, .rcp-fe-lol-tft-ranked-banner .ranked-banner-contents-container .banner-position-title, .rcp-fe-lol-tft-ranked-banner .ranked-banner-contents-container .banner-apex-ladder-rank, .rcp-fe-lol-tft-ranked-banner .ranked-banner-contents-container .banner-provisional-text-container, .rcp-fe-lol-tft-ranked-banner .ranked-banner-contents-container .banner-tier-division-label { font-family: var(--font-display); } .rcp-fe-lol-tft-ranked-banner .ranked-banner-contents-container .banner-league-points-display { font-family: var(--font-body); } .rcp-fe-lol-tft-ranked-banner.emphasized .banner-position-rank-label, .rcp-fe-lol-tft-ranked-banner .ranked-banner-contents-container .banner-position-title, .rcp-fe-lol-tft-ranked-banner .ranked-banner-contents-container .banner-apex-ladder-rank, .rcp-fe-lol-tft-ranked-banner .ranked-banner-contents-container .banner-provisional-text-container, .rcp-fe-lol-tft-ranked-banner .ranked-banner-contents-container .banner-tier-division-label, .rcp-fe-lol-tft-ranked-banner .ranked-banner-contents-container .banner-league-points-display { -webkit-user-select: none; } .rcp-fe-lol-tft-ranked-banner.emphasized .banner-position-rank-label, .rcp-fe-lol-tft-ranked-banner .ranked-banner-contents-container .banner-position-title, .rcp-fe-lol-tft-ranked-banner .ranked-banner-contents-container .banner-apex-ladder-rank, .rcp-fe-lol-tft-ranked-banner .ranked-banner-contents-container .banner-provisional-text-container, .rcp-fe-lol-tft-ranked-banner .ranked-banner-contents-container .banner-tier-division-label, .rcp-fe-lol-tft-ranked-banner .ranked-banner-contents-container .banner-league-points-display { font-kerning: normal; -webkit-font-feature-settings: "kern" 1; -webkit-font-smoothing: antialiased; } .rcp-fe-lol-tft-ranked-banner.emphasized .banner-position-rank-label, .rcp-fe-lol-tft-ranked-banner .ranked-banner-contents-container .banner-position-title, .rcp-fe-lol-tft-ranked-banner .ranked-banner-contents-container .banner-apex-ladder-rank, .rcp-fe-lol-tft-ranked-banner .ranked-banner-contents-container .banner-tier-division-label { text-transform: uppercase; } .rcp-fe-lol-tft-ranked-banner.emphasized .banner-position-rank-label:lang(ko-kr), .rcp-fe-lol-tft-ranked-banner .ranked-banner-contents-container .banner-position-title:lang(ko-kr), .rcp-fe-lol-tft-ranked-banner .ranked-banner-contents-container .banner-apex-ladder-rank:lang(ko-kr), .rcp-fe-lol-tft-ranked-banner .ranked-banner-contents-container .banner-tier-division-label:lang(ko-kr), .rcp-fe-lol-tft-ranked-banner.emphasized .banner-position-rank-label:lang(ja-jp), .rcp-fe-lol-tft-ranked-banner .ranked-banner-contents-container .banner-position-title:lang(ja-jp), .rcp-fe-lol-tft-ranked-banner .ranked-banner-contents-container .banner-apex-ladder-rank:lang(ja-jp), .rcp-fe-lol-tft-ranked-banner .ranked-banner-contents-container .banner-tier-division-label:lang(ja-jp), .rcp-fe-lol-tft-ranked-banner.emphasized .banner-position-rank-label:lang(tr-tr), .rcp-fe-lol-tft-ranked-banner .ranked-banner-contents-container .banner-position-title:lang(tr-tr), .rcp-fe-lol-tft-ranked-banner .ranked-banner-contents-container .banner-apex-ladder-rank:lang(tr-tr), .rcp-fe-lol-tft-ranked-banner .ranked-banner-contents-container .banner-tier-division-label:lang(tr-tr), .rcp-fe-lol-tft-ranked-banner.emphasized .banner-position-rank-label:lang(el-gr), .rcp-fe-lol-tft-ranked-banner .ranked-banner-contents-container .banner-position-title:lang(el-gr), .rcp-fe-lol-tft-ranked-banner .ranked-banner-contents-container .banner-apex-ladder-rank:lang(el-gr), .rcp-fe-lol-tft-ranked-banner .ranked-banner-contents-container .banner-tier-division-label:lang(el-gr), .rcp-fe-lol-tft-ranked-banner.emphasized .banner-position-rank-label:lang(th-th), .rcp-fe-lol-tft-ranked-banner .ranked-banner-contents-container .banner-position-title:lang(th-th), .rcp-fe-lol-tft-ranked-banner .ranked-banner-contents-container .banner-apex-ladder-rank:lang(th-th), .rcp-fe-lol-tft-ranked-banner .ranked-banner-contents-container .banner-tier-division-label:lang(th-th), .rcp-fe-lol-tft-ranked-banner.emphasized .banner-position-rank-label:lang(zh-tw), .rcp-fe-lol-tft-ranked-banner .ranked-banner-contents-container .banner-position-title:lang(zh-tw), .rcp-fe-lol-tft-ranked-banner .ranked-banner-contents-container .banner-apex-ladder-rank:lang(zh-tw), .rcp-fe-lol-tft-ranked-banner .ranked-banner-contents-container .banner-tier-division-label:lang(zh-tw) { text-transform: none; } .rcp-fe-lol-tft-ranked-banner.emphasized .banner-position-rank-label { color: #f0e6d2; font-size: 18px; font-weight: 700; line-height: 22px; letter-spacing: 0.05em; } .rcp-fe-lol-tft-ranked-banner .ranked-banner-contents-container .banner-position-title, .rcp-fe-lol-tft-ranked-banner .ranked-banner-contents-container .banner-apex-ladder-rank, .rcp-fe-lol-tft-ranked-banner .ranked-banner-contents-container .banner-tier-division-label { color: #f0e6d2; font-size: 14px; font-weight: 700; line-height: 18px; letter-spacing: 0.075em; } .rcp-fe-lol-tft-ranked-banner .ranked-banner-contents-container .banner-provisional-text-container { color: #a09b8c; font-size: 16px; font-weight: normal; line-height: 24px; letter-spacing: 0.05em; -webkit-font-smoothing: subpixel-antialiased; } .rcp-fe-lol-tft-ranked-banner .ranked-banner-contents-container .banner-league-points-display { color: #a09b8c; font-size: 12px; font-weight: normal; line-height: 16px; letter-spacing: 0.025em; -webkit-font-smoothing: subpixel-antialiased; } .rcp-fe-lol-tft-ranked-banner .ranked-banner-contents-container .banner-league-points-display:lang(ja-jp) { font-size: 13px; } .rcp-fe-lol-tft-ranked-banner { position: relative; top: -60px; display: flex; justify-content: center; } .rcp-fe-lol-tft-ranked-banner lol-regalia-kit-element { position: absolute; top: -80px; left: 50%; transform: translateX(-50%); } .rcp-fe-lol-tft-ranked-banner lol-regalia-kit-element::shadow .regalia-kit-crest-wrapper lol-regalia-crest-element { display: none; } .rcp-fe-lol-tft-ranked-banner.low-spec lol-regalia-kit-element::shadow .regalia-kit-banner-backdrop { -webkit-mask-image: linear-gradient(rgba(0,0,0,0) 20%, #000 80%); } .rcp-fe-lol-tft-ranked-banner .ranked-banner-contents-container { display: flex; flex-direction: column; } .rcp-fe-lol-tft-ranked-banner .ranked-banner-contents-container .hidden { visibility: hidden; } .rcp-fe-lol-tft-ranked-banner .ranked-banner-contents-container .removed { display: none; } .rcp-fe-lol-tft-ranked-banner .ranked-banner-contents-container .banner-spacer { height: 225px; } .rcp-fe-lol-tft-ranked-banner .ranked-banner-contents-container .banner-spacer.has-position { height: 120px; } .rcp-fe-lol-tft-ranked-banner .ranked-banner-contents-container .banner-spacer.has-position.narrow { height: 41px; } .rcp-fe-lol-tft-ranked-banner .ranked-banner-contents-container .non-position-rank-spacer { height: 20px; } .rcp-fe-lol-tft-ranked-banner .ranked-banner-contents-container .position-icon-container { display: flex; justify-content: center; margin-bottom: 10px; } .rcp-fe-lol-tft-ranked-banner .ranked-banner-contents-container .position-icon-container.removed { display: none; } .rcp-fe-lol-tft-ranked-banner .ranked-banner-contents-container .svg-icon { width: 42px; height: 42px; } .rcp-fe-lol-tft-ranked-banner .ranked-banner-contents-container .banner-ranked-emblem-container { display: flex; justify-content: center; height: 226px; } .rcp-fe-lol-tft-ranked-banner .ranked-banner-contents-container .banner-ranked-emblem-container .banner-regalia-crest-sizer { width: 125px; height: 125px; position: relative; top: 48px; } .rcp-fe-lol-tft-ranked-banner .ranked-banner-contents-container .banner-ranked-emblem-container .banner-regalia-crest-sizer .banner-regalia-crest-glow { width: 100%; height: 100%; position: absolute; } .rcp-fe-lol-tft-ranked-banner .ranked-banner-contents-container .banner-position-title { width: 100%; color: #969081; text-align: center; } .rcp-fe-lol-tft-ranked-banner .ranked-banner-contents-container .banner-apex-ladder-rank { width: 100%; text-align: center; color: #a09b8c; } .rcp-fe-lol-tft-ranked-banner .ranked-banner-contents-container .banner-provisional-text-container { width: 100%; color: #f0e6d2; text-align: center; height: 18px; line-height: 20px; } .rcp-fe-lol-tft-ranked-banner .ranked-banner-contents-container .ranked-coming-soon-icon { background: url("/fe/lol-tft/images/ranked-coming-soon.png") no-repeat center/contain; width: 44px; height: 44px; opacity: 0.5; margin: -40px auto 0; } .rcp-fe-lol-tft-ranked-banner .ranked-banner-contents-container .banner-tier-division-label { width: 100%; margin: 5px 0; padding: 0 15px; color: #785a28; text-align: center; } .rcp-fe-lol-tft-ranked-banner .ranked-banner-contents-container .banner-league-points-display { width: 100%; color: #a09b8c; text-align: center; } .rcp-fe-lol-tft-application { color: #fff; cursor: default; box-sizing: border-box; position: absolute; width: 1055px; height: 718px; top: 1px; background: no-repeat center center fixed; background-size: cover; animation-name: fadeIn; animation-duration: 1s; animation-iteration-count: 1; animation-fill-mode: forwards; } .rcp-fe-lol-tft-application * { box-sizing: border-box; } .rcp-fe-lol-tft-application .spinner-container { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } @-moz-keyframes fadeIn { 0% { opacity: 0; } 100% { opacity: 1; } } @-webkit-keyframes fadeIn { 0% { opacity: 0; } 100% { opacity: 1; } } @-o-keyframes fadeIn { 0% { opacity: 0; } 100% { opacity: 1; } } @keyframes fadeIn { 0% { opacity: 0; } 100% { opacity: 1; } } .rcp-fe-lol-tft-reward-celebration .reward-description { font-family: var(--font-display); } .rcp-fe-lol-tft-reward-celebration .reward { font-family: var(--font-body); } .rcp-fe-lol-tft-reward-celebration .reward, .rcp-fe-lol-tft-reward-celebration .reward-description { -webkit-user-select: none; } .rcp-fe-lol-tft-reward-celebration .reward, .rcp-fe-lol-tft-reward-celebration .reward-description { font-kerning: normal; -webkit-font-feature-settings: "kern" 1; -webkit-font-smoothing: antialiased; } .rcp-fe-lol-tft-reward-celebration .reward-description { text-transform: uppercase; } .rcp-fe-lol-tft-reward-celebration .reward-description:lang(ko-kr), .rcp-fe-lol-tft-reward-celebration .reward-description:lang(ja-jp), .rcp-fe-lol-tft-reward-celebration .reward-description:lang(tr-tr), .rcp-fe-lol-tft-reward-celebration .reward-description:lang(el-gr), .rcp-fe-lol-tft-reward-celebration .reward-description:lang(th-th), .rcp-fe-lol-tft-reward-celebration .reward-description:lang(zh-tw) { text-transform: none; } .rcp-fe-lol-tft-reward-celebration .reward-description { color: #f0e6d2; font-size: 24px; font-weight: 700; line-height: 28px; letter-spacing: 0.05em; } .rcp-fe-lol-tft-reward-celebration .reward { color: #a09b8c; font-size: 12px; font-weight: normal; line-height: 16px; letter-spacing: 0.1em; -webkit-font-smoothing: subpixel-antialiased; } .rcp-fe-lol-tft-reward-celebration .reward:lang(ja-jp) { font-size: 13px; } .rcp-fe-lol-tft-reward-celebration { cursor: default; box-sizing: border-box; } .rcp-fe-lol-tft-reward-celebration * { box-sizing: border-box; } .rcp-fe-lol-tft-reward-celebration .rewards-container { display: flex; flex-direction: row; justify-content: center; align-items: center; top: 0; left: 0; position: absolute; width: 100%; height: 100%; } .rcp-fe-lol-tft-reward-celebration .reward { display: flex; flex-direction: column; justify-content: flex-start; align-items: center; text-align: center; flex-basis: 100%; min-width: 300px; max-width: 300px; height: 330px; position: relative; margin: 0 8px; } .rcp-fe-lol-tft-reward-celebration .reward-icon { position: absolute; width: 256px; height: 256px; top: 10px; left: 22px; display: flex; align-items: center; justify-content: center; } .rcp-fe-lol-tft-reward-celebration .reward-icon img { max-width: 100%; max-height: none; } .rcp-fe-lol-tft-reward-celebration .reward-icon.MISSION_PROGRESS img, .rcp-fe-lol-tft-reward-celebration .reward-icon.SUMMONER_ICON img { max-width: 148px; border: 2px solid #c89b3c; box-shadow: 0px 0px 1px 2px rgba(1,10,19,0.4); border-image: linear-gradient(to bottom, #c29739, #503c23) 2; } .rcp-fe-lol-tft-reward-celebration .reward-description-wrapper { position: absolute; width: 100%; bottom: 15px; height: 56px; display: flex; align-items: center; justify-content: center; } .rcp-fe-lol-tft-reward-celebration .reward-description { text-align: center; word-break: break-word; font-size: 14px; padding: 0; } .rcp-fe-lol-tft-reward-celebration .reward.selectable { cursor: pointer; } .rcp-fe-lol-tft-reward-celebration .reward.selectable .brightener-bg { -webkit-filter: opacity(0); transition: -webkit-filter 0.15s; position: absolute; top: 0px; left: 0; right: 0; bottom: 0px; background: linear-gradient(transparent, rgba(255,255,255,0.1)); } .rcp-fe-lol-tft-reward-celebration .reward.selectable .radial-glow { height: 120px; width: 100%; bottom: -2px; background-position: bottom center; background-image: url("/fe/lol-tft/images/reward-hover-highlight.png"); background-size: contain; background-repeat: no-repeat; transition: -webkit-filter 0.15s ease-in; position: absolute; -webkit-filter: opacity(0); z-index: 1; pointer-events: none; } .rcp-fe-lol-tft-reward-celebration .reward.selectable:not(.selected):hover .brightener-bg { -webkit-filter: opacity(1); } .rcp-fe-lol-tft-reward-celebration .reward.selectable:not(.selected):hover .radial-glow { -webkit-filter: opacity(0.5); } .rcp-fe-lol-tft-reward-celebration .reward.selectable.selected .brightener-bg { -webkit-filter: opacity(1); background: radial-gradient(rgba(255,255,255,0.4), transparent 60%); } .rcp-fe-lol-tft-reward-celebration .reward.selectable.selected .radial-glow { -webkit-filter: opacity(0.5); } .rcp-fe-lol-tft-reward-celebration .reward.selectable.selection-made:not(.selected):not(:hover) { -webkit-filter: opacity(0.5); } .rcp-fe-lol-tft-reward-celebration .reward.selectable.selection-made:not(.selected):not(:hover) .reward-icon { -webkit-filter: saturate(0.5); }