div[data-screen-name="rcp-fe-lol-postgame"] .component-factory-application, div[data-screen-name="rcp-fe-lol-postgame"] .component-factory-application > .ember-view, .postgame-component, .postgame-content { width: 100%; height: 100%; box-sizing: border-box; } .postgame-component { position: relative; -webkit-user-select: none; cursor: default; } .postgame-content { position: relative; } .postgame-chat-box { position: absolute; width: 300px; height: 184px; bottom: 17px; left: 34px; } .postgame-league-loading-finished .ranked-crest, .postgame-league-loading-finished .postgame-outcome { animation: FadeInRankLoad 0.5s; } @-moz-keyframes FadeInRankLoad { 0% { opacity: 0; } 100% { opacity: 1; } } @-webkit-keyframes FadeInRankLoad { 0% { opacity: 0; } 100% { opacity: 1; } } @-o-keyframes FadeInRankLoad { 0% { opacity: 0; } 100% { opacity: 1; } } @keyframes FadeInRankLoad { 0% { opacity: 0; } 100% { opacity: 1; } } .postgame-header { position: relative; height: 80px; display: flex; align-items: center; } .postgame-header-wrapper { margin-left: 5px; } .postgame-map-info { font-family: var(--font-body); } .postgame-map-info { -webkit-user-select: none; } .postgame-map-info { font-kerning: normal; -webkit-font-feature-settings: "kern" 1; -webkit-font-smoothing: antialiased; } .postgame-map-info { color: #a09b8c; font-size: 12px; font-weight: normal; line-height: 16px; letter-spacing: 0.025em; -webkit-font-smoothing: subpixel-antialiased; } .postgame-map-info:lang(ja-jp) { font-size: 13px; } .postgame-game-info { display: flex; align-items: center; } .postgame-game-info .postgame-map-icon { content: ''; width: 56px; height: 56px; margin-right: 7px; background-size: contain; } .postgame-map-info { display: flex; margin-top: 2px; line-height: 18px; } .postgame-map-info-item-game-mode::after, .postgame-map-info-item-game-length::after, .postgame-map-info-item-win-loss::after { content: ''; display: inline-block; width: 5px; height: 5px; background-color: #3c3c41; border-radius: 50%; margin: 1px 10px; } .postgame-map-info-item-game-mode:last-child::after, .postgame-map-info-item-game-length:last-child::after, .postgame-map-info-item-win-loss:last-child::after { display: none; } .postgame-map-info-item-game-mode, .postgame-map-info-item-game-length, .postgame-map-info-item-win-loss { direction: ltr; display: block ; flex-direction: row ; align-items: stretch ; } .postgame-game-info-icons-tooltip { font-family: var(--font-body); } .postgame-game-info-icons-tooltip { -webkit-user-select: none; } .postgame-game-info-icons-tooltip { font-kerning: normal; -webkit-font-feature-settings: "kern" 1; -webkit-font-smoothing: antialiased; } .postgame-game-info-icons-tooltip { color: #a09b8c; font-size: 12px; font-weight: normal; line-height: 16px; letter-spacing: 0.1em; -webkit-font-smoothing: subpixel-antialiased; } .postgame-game-info-icons-tooltip:lang(ja-jp) { font-size: 13px; } .postgame-game-info-icons { display: flex; flex-direction: row; margin-top: 0; margin-left: 10px; } .postgame-game-info-icons-item-aram-reroll { -webkit-mask-image: url(/fe/lol-postgame/icon-dice.png); -webkit-mask-size: contain; -webkit-mask-position: center; -webkit-mask-repeat: no-repeat; width: 18px; height: 18px; margin-right: 14px; outline: none; border: none; transition: -webkit-filter 100ms ease-out; background-color: #a09b8c; } .postgame-game-info-icons-item-aram-reroll:hover { background-color: #f0e6d2; } .postgame-game-info-icons-item-aram-reroll:last-child { margin-right: 0; } .postgame-game-info-icons-tooltip { text-align: center; padding: 12px; width: 200px; } .postgame-miniseries { display: flex; flex-direction: column; align-items: center; justify-content: center; } .postgame-miniseries-results { display: flex; margin-top: 1px; margin-left: 7px; } .postgame-miniseries-result-W { background-image: url(/fe/lol-postgame/small-won-me.png); background-size: contain; background-position: center; background-repeat: no-repeat; width: 18px; height: 18px; } .postgame-miniseries-result-L { background-image: url(/fe/lol-postgame/small-loss.png); background-size: contain; background-position: center; background-repeat: no-repeat; width: 18px; height: 18px; } .postgame-miniseries-result-N { background-image: url(/fe/lol-postgame/small-empty.png); background-size: contain; background-position: center; background-repeat: no-repeat; width: 18px; height: 18px; } .postgame-game-result { font-family: var(--font-display); } .postgame-game-result { -webkit-user-select: none; } .postgame-game-result { font-kerning: normal; -webkit-font-feature-settings: "kern" 1; -webkit-font-smoothing: antialiased; } .postgame-game-result { text-transform: uppercase; } .postgame-game-result:lang(ko-kr), .postgame-game-result:lang(ja-jp), .postgame-game-result:lang(tr-tr), .postgame-game-result:lang(el-gr), .postgame-game-result:lang(th-th), .postgame-game-result:lang(zh-tw) { text-transform: none; } .postgame-game-result { color: #f0e6d2; font-size: 24px; font-weight: 700; line-height: 28px; letter-spacing: 0.05em; } .postgame-game-result { display: flex; align-items: center; } .postgame-game-result .postgame-outcome { direction: ltr; } .postgame-game-result.postgame-leaver .postgame-outcome { color: #5b5a56; } .postgame-game-result .postgame-preloader-spinner { background-image: url(/fe/lol-postgame/spinner.png); background-size: contain; background-position: center; background-repeat: no-repeat; width: 30px; height: 30px; -webkit-animation: postgame-spin 4s linear infinite; } .postgame-game-result-divider { content: ''; display: inline-block; width: 8px; height: 8px; background-color: #f0e6d2; border-radius: 50%; margin: 3px 10px; } .postgame-game-result-placement-games::before { content: ''; display: inline-block; width: 8px; height: 8px; background-color: #f0e6d2; border-radius: 50%; margin: 3px 10px; } .postgame-game-result-icon .postgame-map-icon { content: ''; width: 56px; height: 56px; margin-right: 7px; background-size: contain; } .postgame-scoreboard-component, .postgame-scoreboard-component .basic-footer { padding-left: 34px; padding-right: 35px; } .PostgameComponent, .PostgameComponent > .ember-view { height: 100%; } .postgame-scoreboard-component { display: flex; flex-direction: column; height: 100%; } .postgame-scoreboard-component .basic-footer { position: absolute; bottom: 0; left: 0; } .postgame-scoreboard-header { display: flex; position: relative; justify-content: space-between; align-items: center; border-bottom: 1px solid #3c3c41; } .postgame-scoreboard-body { position: relative; display: flex; flex-direction: row; flex: 1; justify-content: space-between; } .postgame-teams { direction: ltr; width: 760px; display: flex; flex-direction: column; } .postgame-accessory-game-action { position: relative; margin-left: 10px; margin-right: 20px; } .postgame-scoreboard-header-button-container { position: relative; display: flex; flex-direction: row; justify-content: flex-end; align-items: center; } .postgame-team-header { font-family: var(--font-display); } .postgame-team-header { -webkit-user-select: none; } .postgame-team-header { font-kerning: normal; -webkit-font-feature-settings: "kern" 1; -webkit-font-smoothing: antialiased; } .postgame-team-header { text-transform: uppercase; } .postgame-team-header:lang(ko-kr), .postgame-team-header:lang(ja-jp), .postgame-team-header:lang(tr-tr), .postgame-team-header:lang(el-gr), .postgame-team-header:lang(th-th), .postgame-team-header:lang(zh-tw) { text-transform: none; } .postgame-team-header { color: #f0e6d2; font-size: 14px; font-weight: 700; line-height: 18px; letter-spacing: 0.075em; } .postgame-team { width: 100%; margin-top: 14px; margin-right: 55px ; table-layout: fixed; border-spacing: 0; opacity: 0; animation: 0.5s forwards postgameTeamPlayerAnimation; animation-delay: 0.3s; } .postgame-local-player-team { order: 0; } .postgame-local-player-team .postgame-team-header { color: #0a96aa; } .postgame-local-player-team .postgame-team-kda-content .postgame-icon-kills { background-color: #0a96aa; opacity: 50%; } .postgame-local-player-team .postgame-team-score-content .postgame-icon-star-guardian-score { background-color: #fabe0a; opacity: 50%; } .postgame-enemy-team { order: 1; } .postgame-enemy-team .postgame-team-header { color: #be1e37; } .postgame-enemy-team .postgame-team-kda-content .postgame-icon-kills { background-color: #be1e37; opacity: 50%; } .postgame-enemy-team .postgame-player:not(.postgame-player-local):not(.postgame-player-bot):not(.postgame-player-no-buttons):hover { background-image: -webkit-linear-gradient(0deg, rgba(190,30,55,0) 0%, rgba(190,30,55,0.2) 5%, rgba(190,30,55,0.2) 49%, rgba(190,30,55,0) 62%); } .postgame-team-header { height: 30px; vertical-align: top; } .postgame-team-name, .postgame-team-player-spacer, .postgame-team-gold, .postgame-team-kda-icon, .postgame-team-cs-icon, .postgame-team-gold-icon { white-space: nowrap; } .postgame-team-name { width: 65px; position: relative; } .postgame-team-kda-content { display: inline-flex; align-items: center; margin-left: 49px; } .postgame-team-kda-slash { line-height: normal; margin: 0 6px; } .postgame-team-score-content { display: inline-flex; align-items: center; margin-left: 36px; color: #fabe0a; } .postgame-team-score-break { line-height: normal; margin: 0 3px; } .postgame-team-player-spacer { width: 230px; } .postgame-team-gold { width: 170px; color: #a09b8c; } .postgame-team-gold-content { display: inline-flex; align-items: center; } .postgame-team-kda-icon { width: 120px; } .postgame-team-cs-icon { width: 50px; } .postgame-team-gold-icon { width: 70px; text-align: right ; } .postgame-team-gold-icon .postgame-icon-gold { margin: 0 10px 0 0 ; } .postgame-icon-kills, .postgame-icon-score-starguardian, .postgame-icon-score-odyssey, .postgame-icon-project-kills, .postgame-icon-project-energy, .postgame-icon-gold, .postgame-icon-cs { display: inline-block; width: 18px; height: 18px; margin: 0 3px; -webkit-mask-size: contain; -webkit-mask-position: center; background-color: #a09b8c; opacity: 0.5; } .postgame-icon-kills { -webkit-mask-image: url(/fe/lol-postgame/mask-icon-offense.png); } .postgame-icon-score-starguardian { margin: 0 4px; background-color: #fabe0a; -webkit-mask-image: url(/fe/lol-postgame/mask-icon-starguardian.png); } .postgame-icon-score-odyssey { margin: 0 4px; background-color: #fabe0a; -webkit-mask-image: url(/fe/lol-postgame/mask-icon-odyssey.png); } .postgame-icon-project-kills { -webkit-mask-image: url(/fe/lol-postgame/mask-icon-project-kills.png); } .postgame-icon-project-energy { -webkit-mask-image: url(/fe/lol-postgame/mask-icon-project-energy.png); margin: 0 -4px; } .postgame-icon-gold { -webkit-mask-image: url(/fe/lol-postgame/mask-icon-gold.png); } .postgame-icon-cs { -webkit-mask-image: url(/fe/lol-postgame/mask-icon-cs.png); } @-moz-keyframes postgameTeamPlayerAnimation { 0% { opacity: 0; } 100% { opacity: 1; } } @-webkit-keyframes postgameTeamPlayerAnimation { 0% { opacity: 0; } 100% { opacity: 1; } } @-o-keyframes postgameTeamPlayerAnimation { 0% { opacity: 0; } 100% { opacity: 1; } } @keyframes postgameTeamPlayerAnimation { 0% { opacity: 0; } 100% { opacity: 1; } } .postgame-player, .postgame-player-champion-icon-tooltip .postgame-player-champion-icon-tooltip-name { font-family: var(--font-display); } .postgame-player-champion-icon-tooltip, .postgame-player-name { font-family: var(--font-body); } .postgame-player, .postgame-player-champion-icon-tooltip, .postgame-player-champion-icon-tooltip .postgame-player-champion-icon-tooltip-name, .postgame-player-name { -webkit-user-select: none; } .postgame-player, .postgame-player-champion-icon-tooltip, .postgame-player-champion-icon-tooltip .postgame-player-champion-icon-tooltip-name, .postgame-player-name { font-kerning: normal; -webkit-font-feature-settings: "kern" 1; -webkit-font-smoothing: antialiased; } .postgame-player, .postgame-player-champion-icon-tooltip .postgame-player-champion-icon-tooltip-name { text-transform: uppercase; } .postgame-player:lang(ko-kr), .postgame-player-champion-icon-tooltip .postgame-player-champion-icon-tooltip-name:lang(ko-kr), .postgame-player:lang(ja-jp), .postgame-player-champion-icon-tooltip .postgame-player-champion-icon-tooltip-name:lang(ja-jp), .postgame-player:lang(tr-tr), .postgame-player-champion-icon-tooltip .postgame-player-champion-icon-tooltip-name:lang(tr-tr), .postgame-player:lang(el-gr), .postgame-player-champion-icon-tooltip .postgame-player-champion-icon-tooltip-name:lang(el-gr), .postgame-player:lang(th-th), .postgame-player-champion-icon-tooltip .postgame-player-champion-icon-tooltip-name:lang(th-th), .postgame-player:lang(zh-tw), .postgame-player-champion-icon-tooltip .postgame-player-champion-icon-tooltip-name:lang(zh-tw) { text-transform: none; } .postgame-player { text-transform: none; } .postgame-player, .postgame-player-champion-icon-tooltip .postgame-player-champion-icon-tooltip-name { color: #f0e6d2; font-size: 14px; font-weight: 700; line-height: 18px; letter-spacing: 0.075em; } .postgame-player { letter-spacing: 0.0375em; } .postgame-player-champion-icon-tooltip { color: #a09b8c; font-size: 12px; font-weight: normal; line-height: 16px; letter-spacing: 0.025em; -webkit-font-smoothing: subpixel-antialiased; } .postgame-player-champion-icon-tooltip:lang(ja-jp) { font-size: 13px; } .postgame-player-name { color: #a09b8c; font-size: 12px; font-weight: normal; line-height: 16px; letter-spacing: 0.1em; -webkit-font-smoothing: subpixel-antialiased; } .postgame-player-name:lang(ja-jp) { font-size: 13px; } .postgame-player { height: 35px; color: #f0e6d2; background-attachment: fixed; } .postgame-player.postgame-player-local, .postgame-player.postgame-player-local .postgame-player-name { color: #c89b3c; } .postgame-player .postgame-player-club-tag { margin: 0 0 5px 5px ; } .postgame-player:not(.postgame-player-local):not(.postgame-player-bot):not(.postgame-player-no-buttons):hover { background-image: -webkit-linear-gradient(0deg, rgba(10,150,170,0) 0%, rgba(10,150,170,0.2) 5%, rgba(10,150,170,0.2) 49%, rgba(10,150,170,0) 62%); } .postgame-player:not(.postgame-player-local):not(.postgame-player-bot):not(.postgame-player-no-buttons):hover .postgame-player-name { display: none; } .postgame-player:not(.postgame-player-local):not(.postgame-player-bot):not(.postgame-player-no-buttons):hover .postgame-player-club-tag { display: none; } .postgame-player:not(.postgame-player-local):not(.postgame-player-bot):not(.postgame-player-no-buttons):hover .postgame-player-buttons { display: flex; } .postgame-player-cap, .postgame-player-identity, .postgame-player-items, .postgame-player-kda, .postgame-player-cs, .postgame-player-gold { white-space: nowrap; } .postgame-player-cap-content { display: flex; align-items: center; } .postgame-scoreboard-player-spell-icons-placeholder { width: 14px; } .postgame-player-champion-level { flex: 1; display: flex; justify-content: center; } .postgame-player-identity { position: relative; } .postgame-player-identity-content { display: flex; align-items: center; } .postgame-player-identity-content lol-parties-comm-halo { margin: 0 7px 0 0 ; } .postgame-player-champion-icon { position: relative; min-width: 30px; width: 30px; height: 30px; } .postgame-player-champion-icon-tooltip { padding: 20px 20px; white-space: nowrap; } .postgame-player-leaver .postgame-player-champion-icon { opacity: 0.5; } .postgame-player-leaver .postgame-player-champion-icon::after { position: absolute; content: ''; background-image: url(/fe/lol-postgame/leaver_icon.png); background-size: contain; background-position: center; background-repeat: no-repeat; width: 36px; height: 36px; left: -3px; top: -3px; } .postgame-player-left-chat:not(.postgame-player-bot) .postgame-player-cap-content, .postgame-player-left-chat:not(.postgame-player-bot) .postgame-player-champion-icon, .postgame-player-left-chat:not(.postgame-player-bot) .postgame-player-name, .postgame-player-left-chat:not(.postgame-player-bot) .postgame-player-items-content, .postgame-player-left-chat:not(.postgame-player-bot) .postgame-player-kda, .postgame-player-left-chat:not(.postgame-player-bot) .postgame-player-cs, .postgame-player-left-chat:not(.postgame-player-bot) .postgame-player-gold { opacity: 0.5; } .postgame-player-name { text-overflow: ellipsis; overflow: hidden; } .postgame-player-items { text-align: center; } .postgame-player-items-content { display: flex; } .postgame-player-kda { direction: ltr ; text-align: center; } .postgame-player-kda-content { display: inline-flex; align-items: center; justify-content: center; position: relative; } .postgame-player-kda-slash { color: #a09b8c; line-height: normal; margin: 0 6px; opacity: 0.5; } .postgame-player-cs { text-align: center; } .postgame-player-gold { text-align: right ; } .postgame-player-spell-icon-tooltip-name { font-family: var(--font-display); } .postgame-player-spell-icon-tooltip { font-family: var(--font-body); } .postgame-player-spell-icon-tooltip, .postgame-player-spell-icon-tooltip-name { -webkit-user-select: none; } .postgame-player-spell-icon-tooltip, .postgame-player-spell-icon-tooltip-name { font-kerning: normal; -webkit-font-feature-settings: "kern" 1; -webkit-font-smoothing: antialiased; } .postgame-player-spell-icon-tooltip-name { text-transform: uppercase; } .postgame-player-spell-icon-tooltip-name:lang(ko-kr), .postgame-player-spell-icon-tooltip-name:lang(ja-jp), .postgame-player-spell-icon-tooltip-name:lang(tr-tr), .postgame-player-spell-icon-tooltip-name:lang(el-gr), .postgame-player-spell-icon-tooltip-name:lang(th-th), .postgame-player-spell-icon-tooltip-name:lang(zh-tw) { text-transform: none; } .postgame-player-spell-icon-tooltip-name { color: #f0e6d2; font-size: 14px; font-weight: 700; line-height: 18px; letter-spacing: 0.075em; } .postgame-player-spell-icon-tooltip { color: #a09b8c; font-size: 12px; font-weight: normal; line-height: 16px; letter-spacing: 0.025em; -webkit-font-smoothing: subpixel-antialiased; } .postgame-player-spell-icon-tooltip:lang(ja-jp) { font-size: 13px; } .postgame-player-spell-icons { display: inline-flex; flex-direction: column; } .postgame-player-spell-icon { width: 14px; height: 14px; transition: -webkit-filter 100ms ease-out; -webkit-filter: brightness(1.01); } .postgame-player-spell-icon:hover { -webkit-filter: brightness(1.2); } .postgame-player-spell-icon-tooltip { direction: ltr; padding: 15px; min-width: 300px; } .postgame-player-spell-icon-tooltip-icon { height: 48px; width: 48px; margin: 0 10px 0 0 ; } .postgame-player-spell-icon-tooltip-header { display: flex; align-items: center; } .postgame-player-spell-icon-tooltip-level { margin-top: 5px; color: #c89b3c; } .postgame-player-spell-icon-description { margin-top: 15px; } .postgame-player-keystone-icon-tooltip-name { font-family: var(--font-display); } .postgame-player-keystone-icon-tooltip { font-family: var(--font-body); } .postgame-player-keystone-icon-tooltip, .postgame-player-keystone-icon-tooltip-name { -webkit-user-select: none; } .postgame-player-keystone-icon-tooltip, .postgame-player-keystone-icon-tooltip-name { font-kerning: normal; -webkit-font-feature-settings: "kern" 1; -webkit-font-smoothing: antialiased; } .postgame-player-keystone-icon-tooltip-name { text-transform: uppercase; } .postgame-player-keystone-icon-tooltip-name:lang(ko-kr), .postgame-player-keystone-icon-tooltip-name:lang(ja-jp), .postgame-player-keystone-icon-tooltip-name:lang(tr-tr), .postgame-player-keystone-icon-tooltip-name:lang(el-gr), .postgame-player-keystone-icon-tooltip-name:lang(th-th), .postgame-player-keystone-icon-tooltip-name:lang(zh-tw) { text-transform: none; } .postgame-player-keystone-icon-tooltip-name { color: #f0e6d2; font-size: 14px; font-weight: 700; line-height: 18px; letter-spacing: 0.075em; } .postgame-player-keystone-icon-tooltip { color: #a09b8c; font-size: 12px; font-weight: normal; line-height: 16px; letter-spacing: 0.025em; -webkit-font-smoothing: subpixel-antialiased; } .postgame-player-keystone-icon-tooltip:lang(ja-jp) { font-size: 13px; } .postgame-player-keystone-icons { display: inline-flex; flex-direction: column; } .postgame-player-keystone-icon { margin: 0 5px 0 0 ; width: 24px; height: 24px; } .postgame-player-keystone-icon-img { width: 24px; height: 24px; transition: -webkit-filter 100ms ease-out; -webkit-filter: brightness(1.01); } .postgame-player-keystone-icon-img:hover { -webkit-filter: brightness(1.2); } .postgame-player-keystone-icon-tooltip { direction: ltr; padding: 15px; min-width: 300px; } .postgame-player-keystone-icon-tooltip-icon { height: 48px; width: 48px; margin: 0 10px 0 0 ; } .postgame-player-keystone-icon-tooltip-header { display: flex; align-items: center; } .postgame-player-keystone-icon-tooltip-level { margin-top: 5px; color: #c89b3c; } .postgame-player-keystone-icon-description { margin-top: 15px; } .postgame-player-button-tooltip { font-family: var(--font-body); } .postgame-player-button-tooltip { -webkit-user-select: none; } .postgame-player-button-tooltip { font-kerning: normal; -webkit-font-feature-settings: "kern" 1; -webkit-font-smoothing: antialiased; } .postgame-player-button-tooltip { color: #a09b8c; font-size: 12px; font-weight: normal; line-height: 16px; letter-spacing: 0.1em; -webkit-font-smoothing: subpixel-antialiased; } .postgame-player-button-tooltip:lang(ja-jp) { font-size: 13px; } .postgame-player-button-report { display: inline-block; } .postgame-player-buttons { display: none; align-items: center; position: relative; } .postgame-player-button-add-friend, .postgame-player-button-report, .postgame-player-invite-to-party { margin-right: 8px; cursor: pointer; outline: none; border: none; transition: -webkit-filter 100ms ease-out; background-color: #c8aa6e; } .postgame-player-button-add-friend:hover, .postgame-player-button-report:hover, .postgame-player-invite-to-party:hover { background-color: #f0e6d2; } .postgame-player-button-add-friend:disabled, .postgame-player-button-report:disabled, .postgame-player-invite-to-party:disabled { pointer-events: none; cursor: default; background-color: #5b5a56; } .postgame-player-button-add-friend:click, .postgame-player-button-report:click, .postgame-player-invite-to-party:click { background-color: #785a28; } .postgame-player-button-add-friend { -webkit-mask-image: url(/fe/lol-postgame/icon-add-friend.png); -webkit-mask-size: contain; -webkit-mask-position: center; -webkit-mask-repeat: no-repeat; width: 18px; height: 18px; } lol-uikit-content-block[type=notification].postgame-friend-request-toast { width: auto; } .postgame-player-button-report { -webkit-mask-image: url(/fe/lol-postgame/icon-exclamation.png); -webkit-mask-size: contain; -webkit-mask-position: center; -webkit-mask-repeat: no-repeat; width: 18px; height: 18px; background-color: #be1e37; } .postgame-player-button-report:hover { background-color: #be1e37; -webkit-filter: brightness(1.25); } .postgame-player-invite-to-party { -webkit-mask-image: url(/fe/lol-postgame/icon-party-invite.png); -webkit-mask-size: contain; -webkit-mask-position: center; -webkit-mask-repeat: no-repeat; width: 18px; height: 18px; } .postgame-player-invite-to-party .invited { background-color: #a09b8c; } .postgame-player-button-tooltip { padding: 20px 20px; white-space: nowrap; } .postgame-player-item-tooltip-name { font-family: var(--font-display); } .postgame-player-item-tooltip { font-family: var(--font-body); } .postgame-player-item-tooltip, .postgame-player-item-tooltip-name { -webkit-user-select: none; } .postgame-player-item-tooltip, .postgame-player-item-tooltip-name { font-kerning: normal; -webkit-font-feature-settings: "kern" 1; -webkit-font-smoothing: antialiased; } .postgame-player-item-tooltip-name { text-transform: uppercase; } .postgame-player-item-tooltip-name:lang(ko-kr), .postgame-player-item-tooltip-name:lang(ja-jp), .postgame-player-item-tooltip-name:lang(tr-tr), .postgame-player-item-tooltip-name:lang(el-gr), .postgame-player-item-tooltip-name:lang(th-th), .postgame-player-item-tooltip-name:lang(zh-tw) { text-transform: none; } .postgame-player-item-tooltip-name { color: #f0e6d2; font-size: 14px; font-weight: 700; line-height: 18px; letter-spacing: 0.075em; } .postgame-player-item-tooltip { color: #a09b8c; font-size: 12px; font-weight: normal; line-height: 16px; letter-spacing: 0.025em; -webkit-font-smoothing: subpixel-antialiased; } .postgame-player-item-tooltip:lang(ja-jp) { font-size: 13px; } .postgame-player-item { display: inline-flex; width: 23px; height: 23px; border: 1px solid #3c3c41; border-right: 0; background-color: #1e2328; transition: -webkit-filter 100ms ease-out; box-shadow: 0 0 1px 1px #010a13 inset; background-size: 23px 23px; background-repeat: no-repeat; } .postgame-player-item:hover { -webkit-filter: brightness(1.25); } .postgame-player-item:last-of-type { border-right: 1px solid #3c3c41; } .postgame-player-item-icon { width: 100%; height: 100%; } .postgame-player-item-tooltip { direction: ltr; padding: 15px; min-width: 300px; } .postgame-player-item-tooltip-header { display: flex; align-items: center; } .postgame-player-item-tooltip-icon { margin: 0 10px 0 0 ; height: 48px; width: 48px; } .postgame-player-item-tooltip-price { display: flex; margin-top: 5px; } .postgame-player-item-tooltip-price::before { content: ''; width: 20px; height: 20px; margin: 0 5px 0 0 ; -webkit-mask-image: url(/fe/lol-postgame/mask-icon-gold.png); -webkit-mask-size: contain; background-color: #785a28; } .postgame-player-item-tooltip-description { margin-top: 15px; } .postgame-player-item-tooltip-description stats { color: #0596aa; } .postgame-player-item-tooltip-description unique, .postgame-player-item-tooltip-description active, .postgame-player-item-tooltip-description passive, .postgame-player-item-tooltip-description aura { color: #c8aa6e; } .postgame-progression { display: flex; flex-direction: column; align-items: center; width: 195px; position: absolute; right: 0; } .progression-header { padding-bottom: 10px; } .progression-body { display: flex; flex-direction: column; align-items: center; width: 100%; } .progression-body .postgame-progression-mastery-meter.large { transform: scale(0); animation: 0.4s forwards postgameMeterAnimation; animation-delay: 0.4s; animation-timing-function: cubic-bezier(0.1, 0.9, 0.15, 0.98); } .progression-body .postgame-progression-xp-meter.large { transform: scale(0); animation: 0.4s forwards postgameMeterAnimation; animation-delay: 0.8s; animation-timing-function: cubic-bezier(0.1, 0.9, 0.15, 0.98); } @-moz-keyframes postgameMeterAnimation { from { transform: scale(0); } to { transform: scale(1); } } @-webkit-keyframes postgameMeterAnimation { from { transform: scale(0); } to { transform: scale(1); } } @-o-keyframes postgameMeterAnimation { from { transform: scale(0); } to { transform: scale(1); } } @keyframes postgameMeterAnimation { from { transform: scale(0); } to { transform: scale(1); } } .postgame-position-detection-component .postgame-position-detection-contents .postgame-position-detection-position-container .postgame-position-detection-text, .postgame-position-detection-tooltip .postgame-position-detection-tooltip-header { font-family: var(--font-display); } .postgame-position-detection-tooltip .postgame-position-detection-tooltip-body, .postgame-position-detection-tooltip .postgame-position-detection-tooltip-body b { font-family: var(--font-body); } .postgame-position-detection-component .postgame-position-detection-contents .postgame-position-detection-position-container .postgame-position-detection-text, .postgame-position-detection-tooltip .postgame-position-detection-tooltip-header { font-family: var(--font-display); } .postgame-position-detection-tooltip .postgame-position-detection-tooltip-body, .postgame-position-detection-tooltip .postgame-position-detection-tooltip-body b { font-family: var(--font-body); } .postgame-position-detection-component .postgame-position-detection-contents .postgame-position-detection-position-container .postgame-position-detection-text, .postgame-position-detection-tooltip .postgame-position-detection-tooltip-header, .postgame-position-detection-tooltip .postgame-position-detection-tooltip-body, .postgame-position-detection-tooltip .postgame-position-detection-tooltip-body b { -webkit-user-select: none; } .postgame-position-detection-component .postgame-position-detection-contents .postgame-position-detection-position-container .postgame-position-detection-text, .postgame-position-detection-tooltip .postgame-position-detection-tooltip-header, .postgame-position-detection-tooltip .postgame-position-detection-tooltip-body, .postgame-position-detection-tooltip .postgame-position-detection-tooltip-body b { font-kerning: normal; -webkit-font-feature-settings: "kern" 1; -webkit-font-smoothing: antialiased; } .postgame-position-detection-component .postgame-position-detection-contents .postgame-position-detection-position-container .postgame-position-detection-text, .postgame-position-detection-tooltip .postgame-position-detection-tooltip-header { text-transform: uppercase; } .postgame-position-detection-component .postgame-position-detection-contents .postgame-position-detection-position-container .postgame-position-detection-text:lang(ko-kr), .postgame-position-detection-tooltip .postgame-position-detection-tooltip-header:lang(ko-kr), .postgame-position-detection-component .postgame-position-detection-contents .postgame-position-detection-position-container .postgame-position-detection-text:lang(ja-jp), .postgame-position-detection-tooltip .postgame-position-detection-tooltip-header:lang(ja-jp), .postgame-position-detection-component .postgame-position-detection-contents .postgame-position-detection-position-container .postgame-position-detection-text:lang(tr-tr), .postgame-position-detection-tooltip .postgame-position-detection-tooltip-header:lang(tr-tr), .postgame-position-detection-component .postgame-position-detection-contents .postgame-position-detection-position-container .postgame-position-detection-text:lang(el-gr), .postgame-position-detection-tooltip .postgame-position-detection-tooltip-header:lang(el-gr), .postgame-position-detection-component .postgame-position-detection-contents .postgame-position-detection-position-container .postgame-position-detection-text:lang(th-th), .postgame-position-detection-tooltip .postgame-position-detection-tooltip-header:lang(th-th), .postgame-position-detection-component .postgame-position-detection-contents .postgame-position-detection-position-container .postgame-position-detection-text:lang(zh-tw), .postgame-position-detection-tooltip .postgame-position-detection-tooltip-header:lang(zh-tw) { text-transform: none; } .postgame-position-detection-component .postgame-position-detection-contents .postgame-position-detection-position-container .postgame-position-detection-text { color: #f0e6d2; font-size: 14px; font-weight: 700; line-height: 18px; letter-spacing: 0.075em; } .postgame-position-detection-tooltip .postgame-position-detection-tooltip-header { color: #f0e6d2; font-size: 12px; font-weight: 700; line-height: 16px; letter-spacing: 0.075em; } .postgame-position-detection-tooltip .postgame-position-detection-tooltip-header:lang(ja-jp) { font-size: 13px; } .postgame-position-detection-tooltip .postgame-position-detection-tooltip-body { color: #a09b8c; font-size: 12px; font-weight: normal; line-height: 16px; letter-spacing: 0.1em; -webkit-font-smoothing: subpixel-antialiased; } .postgame-position-detection-tooltip .postgame-position-detection-tooltip-body:lang(ja-jp) { font-size: 13px; } .postgame-position-detection-tooltip .postgame-position-detection-tooltip-body b { color: #a09b8c; font-size: 12px; font-weight: 900; line-height: 16px; letter-spacing: 0.1em; -webkit-font-smoothing: subpixel-antialiased; } .postgame-position-detection-tooltip .postgame-position-detection-tooltip-body b:lang(ja-jp) { font-size: 13px; } .postgame-position-detection-component { position: relative; width: 100%; animation: fadeInComponent linear 0.5s backwards 0.5s; } .postgame-position-detection-component .postgame-position-detection-contents { position: relative; border-top: 1px solid #fff; border-bottom: 1px solid #fff; border-left: 0 solid transparent; border-right: 0 solid transparent; border-image: linear-gradient(to right, transparent, #463714 10%, #463714 90%, transparent); border-image-slice: 1; background: linear-gradient(to right, transparent, rgba(10,150,170,0.2), transparent); height: 40px; width: 100%; margin-top: 18px; display: flex; } .postgame-position-detection-component .postgame-position-detection-contents .postgame-position-detection-position-container { display: flex; margin: auto; } .postgame-position-detection-component .postgame-position-detection-contents .postgame-position-detection-position-container .postgame-position-detection-icon { width: 26px; height: 26px; background-size: cover; margin-top: auto; margin-bottom: auto; margin-right: 8px; } .postgame-position-detection-component .postgame-position-detection-contents .postgame-position-detection-position-container .postgame-position-detection-icon.position-top { background-image: url(/fe/lol-postgame/icon-position-top.png); } .postgame-position-detection-component .postgame-position-detection-contents .postgame-position-detection-position-container .postgame-position-detection-icon.position-jungle { background-image: url(/fe/lol-postgame/icon-position-jungle.png); } .postgame-position-detection-component .postgame-position-detection-contents .postgame-position-detection-position-container .postgame-position-detection-icon.position-middle { background-image: url(/fe/lol-postgame/icon-position-middle.png); } .postgame-position-detection-component .postgame-position-detection-contents .postgame-position-detection-position-container .postgame-position-detection-icon.position-bottom { background-image: url(/fe/lol-postgame/icon-position-bottom.png); } .postgame-position-detection-component .postgame-position-detection-contents .postgame-position-detection-position-container .postgame-position-detection-icon.position-utility { background-image: url(/fe/lol-postgame/icon-position-utility.png); } .postgame-position-detection-component .postgame-position-detection-contents .postgame-position-detection-position-container .postgame-position-detection-text { font-size: 13px; line-height: 40px; } .postgame-position-detection-component .postgame-position-detection-contents .postgame-position-detection-tooltip-anchor { width: 18px; height: 18px; margin: auto; border-radius: 50%; background-size: cover; background-image: url(/fe/lol-postgame/icon-help.png); } .postgame-position-detection-component .postgame-position-detection-contents .postgame-position-detection-tooltip-anchor.swap { background-image: url(/fe/lol-postgame/icon-position-swap.png); } .postgame-position-detection-component .postgame-position-detection-contents:hover .postgame-position-detection-tooltip-anchor { box-shadow: inset 0 0 100px 100px rgba(255,255,255,0.1); } .postgame-position-detection-tooltip { position: relative; width: 350px; padding: 18px; } .postgame-position-detection-tooltip .postgame-position-detection-tooltip-header { width: 230px; margin: 10px; text-align: left; } .postgame-position-detection-tooltip .postgame-position-detection-tooltip-body { width: 230px; margin: 10px; text-align: left; } .postgame-position-detection-tooltip .postgame-position-detection-tooltip-body b { color: #f0e6d2; } .postgame-position-detection-tooltip .postgame-position-detection-alpha-logo { position: absolute; background-image: url(/fe/lol-postgame/alpha-logo.png); background-position: center; background-repeat: no-repeat; top: 0; right: 9px; width: 120px; height: 100%; } @-moz-keyframes fadeInComponent { 0% { opacity: 0; } 100% { opacity: 1; } } @-webkit-keyframes fadeInComponent { 0% { opacity: 0; } 100% { opacity: 1; } } @-o-keyframes fadeInComponent { 0% { opacity: 0; } 100% { opacity: 1; } } @keyframes fadeInComponent { 0% { opacity: 0; } 100% { opacity: 1; } } .postgame-progression-mastery-meter.large { width: 185.5px; height: 189.75px; } .postgame-progression-mastery-meter { position: relative; } .postgame-progression-mastery-meter.inactive { display: none; } .postgame-progression-mastery-meter.large { margin: 14px 0 45px; } .postgame-progression-mastery-meter.small { margin: 0; width: 100%; } .postgame-progression-mastery-meter-frame .mastery-meter-info .mastery-meter-info-body, .postgame-progression-mastery-meter-frame .mastery-meter-info-details .mastery-meter-info-details-header, .postgame-progression-mastery-meter-frame .mastery-meter-info-details .mastery-meter-info-details-body, .postgame-progression-mastery-meter-frame .mastery-meter-info-details .mastery-meter-info-details-footer { font-family: var(--font-display); } .postgame-progression-mastery-meter-frame .mastery-meter-info .mastery-meter-info-body, .postgame-progression-mastery-meter-frame .mastery-meter-info-details .mastery-meter-info-details-header, .postgame-progression-mastery-meter-frame .mastery-meter-info-details .mastery-meter-info-details-body, .postgame-progression-mastery-meter-frame .mastery-meter-info-details .mastery-meter-info-details-footer { -webkit-user-select: none; } .postgame-progression-mastery-meter-frame .mastery-meter-info .mastery-meter-info-body, .postgame-progression-mastery-meter-frame .mastery-meter-info-details .mastery-meter-info-details-header, .postgame-progression-mastery-meter-frame .mastery-meter-info-details .mastery-meter-info-details-body, .postgame-progression-mastery-meter-frame .mastery-meter-info-details .mastery-meter-info-details-footer { font-kerning: normal; -webkit-font-feature-settings: "kern" 1; -webkit-font-smoothing: antialiased; } .postgame-progression-mastery-meter-frame .mastery-meter-info .mastery-meter-info-body, .postgame-progression-mastery-meter-frame .mastery-meter-info-details .mastery-meter-info-details-header, .postgame-progression-mastery-meter-frame .mastery-meter-info-details .mastery-meter-info-details-body, .postgame-progression-mastery-meter-frame .mastery-meter-info-details .mastery-meter-info-details-footer { text-transform: uppercase; } .postgame-progression-mastery-meter-frame .mastery-meter-info .mastery-meter-info-body:lang(ko-kr), .postgame-progression-mastery-meter-frame .mastery-meter-info-details .mastery-meter-info-details-header:lang(ko-kr), .postgame-progression-mastery-meter-frame .mastery-meter-info-details .mastery-meter-info-details-body:lang(ko-kr), .postgame-progression-mastery-meter-frame .mastery-meter-info-details .mastery-meter-info-details-footer:lang(ko-kr), .postgame-progression-mastery-meter-frame .mastery-meter-info .mastery-meter-info-body:lang(ja-jp), .postgame-progression-mastery-meter-frame .mastery-meter-info-details .mastery-meter-info-details-header:lang(ja-jp), .postgame-progression-mastery-meter-frame .mastery-meter-info-details .mastery-meter-info-details-body:lang(ja-jp), .postgame-progression-mastery-meter-frame .mastery-meter-info-details .mastery-meter-info-details-footer:lang(ja-jp), .postgame-progression-mastery-meter-frame .mastery-meter-info .mastery-meter-info-body:lang(tr-tr), .postgame-progression-mastery-meter-frame .mastery-meter-info-details .mastery-meter-info-details-header:lang(tr-tr), .postgame-progression-mastery-meter-frame .mastery-meter-info-details .mastery-meter-info-details-body:lang(tr-tr), .postgame-progression-mastery-meter-frame .mastery-meter-info-details .mastery-meter-info-details-footer:lang(tr-tr), .postgame-progression-mastery-meter-frame .mastery-meter-info .mastery-meter-info-body:lang(el-gr), .postgame-progression-mastery-meter-frame .mastery-meter-info-details .mastery-meter-info-details-header:lang(el-gr), .postgame-progression-mastery-meter-frame .mastery-meter-info-details .mastery-meter-info-details-body:lang(el-gr), .postgame-progression-mastery-meter-frame .mastery-meter-info-details .mastery-meter-info-details-footer:lang(el-gr), .postgame-progression-mastery-meter-frame .mastery-meter-info .mastery-meter-info-body:lang(th-th), .postgame-progression-mastery-meter-frame .mastery-meter-info-details .mastery-meter-info-details-header:lang(th-th), .postgame-progression-mastery-meter-frame .mastery-meter-info-details .mastery-meter-info-details-body:lang(th-th), .postgame-progression-mastery-meter-frame .mastery-meter-info-details .mastery-meter-info-details-footer:lang(th-th), .postgame-progression-mastery-meter-frame .mastery-meter-info .mastery-meter-info-body:lang(zh-tw), .postgame-progression-mastery-meter-frame .mastery-meter-info-details .mastery-meter-info-details-header:lang(zh-tw), .postgame-progression-mastery-meter-frame .mastery-meter-info-details .mastery-meter-info-details-body:lang(zh-tw), .postgame-progression-mastery-meter-frame .mastery-meter-info-details .mastery-meter-info-details-footer:lang(zh-tw) { text-transform: none; } .postgame-progression-mastery-meter-frame .mastery-meter-info .mastery-meter-info-body, .postgame-progression-mastery-meter-frame .mastery-meter-info-details .mastery-meter-info-details-body { color: #f0e6d2; font-size: 40px; font-weight: 700; line-height: 42px; letter-spacing: 0.05em; } .postgame-progression-mastery-meter-frame .mastery-meter-info-details .mastery-meter-info-details-header { color: #f0e6d2; font-size: 14px; font-weight: 700; line-height: 18px; letter-spacing: 0.075em; } .postgame-progression-mastery-meter-frame .mastery-meter-info-details .mastery-meter-info-details-footer { color: #f0e6d2; font-size: 12px; font-weight: 700; line-height: 16px; letter-spacing: 0.075em; } .postgame-progression-mastery-meter-frame .mastery-meter-info-details .mastery-meter-info-details-footer:lang(ja-jp) { font-size: 13px; } .postgame-progression-mastery-meter-frame .mastery-meter-info .mastery-meter-info-body, .postgame-progression-mastery-meter-frame .mastery-meter-info-details .mastery-meter-info-details-body { background: linear-gradient(to bottom, #cdbe91 0%, #c8aa6e 35%, #765c29 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; } .postgame-progression-mastery-meter-frame { display: flex; align-items: center; justify-content: center; text-align: center; position: relative; } .postgame-progression-mastery-meter-frame { flex-direction: column; } .postgame-progression-mastery-meter-frame::after { content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; background-image: url(/fe/lol-postgame/frame-meter.png); background-size: contain; background-position: center; background-repeat: no-repeat; pointer-events: none; background-position: left; } .postgame-progression-mastery-meter-frame { width: 185.5px; height: 189.75px; } .postgame-progression-mastery-meter-frame { position: absolute; top: 0; } .postgame-progression-mastery-meter-frame .mastery-meter-splash { position: absolute; top: 0; background-color: #010a13; -webkit-mask-image: url(/fe/lol-postgame/frame-meter-mask.png); -webkit-mask-size: contain; -webkit-mask-position: center; -webkit-mask-repeat: no-repeat; width: 185.5px; height: 189.75px; } .postgame-progression-mastery-meter-frame .mastery-meter-splash .mastery-meter-splash-image { width: 100%; height: 100%; padding: 9px; margin-top: 3px; box-sizing: border-box; pointer-events: none; } .postgame-progression-mastery-meter-frame .mastery-meter-splash .mastery-meter-splash-shadow { position: absolute; top: 0; left: 0; background-image: url(/fe/lol-postgame/frame-meter-shadow.png); background-size: contain; background-position: center; background-repeat: no-repeat; width: 185.5px; height: 189.75px; } .postgame-progression-mastery-meter-frame .mastery-meter-info { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: flex; flex-direction: row; justify-content: center; border-radius: 50%; } .postgame-progression-mastery-meter-frame .mastery-meter-info .mastery-meter-info-body { align-self: flex-end; padding-bottom: 15px; } .postgame-progression-mastery-meter-frame .mastery-meter-info:hover .mastery-meter-info-body { display: none; } .postgame-progression-mastery-meter-frame .mastery-meter-info:hover .mastery-meter-info-details { display: flex; } .postgame-progression-mastery-meter-frame .mastery-meter-info .mastery-meter-emblems-overlay { display: flex; width: 100%; position: absolute; justify-content: center; bottom: 15px; left: 0; } .postgame-progression-mastery-meter-frame .mastery-meter-info .mastery-meter-emblem-image { height: 35px; } .postgame-progression-mastery-meter-frame .mastery-meter-info:hover .mastery-meter-emblems-overlay { display: none; } .postgame-progression-mastery-meter-frame .mastery-meter-info-details { display: none; flex-direction: column; justify-content: center; width: 100%; height: 100%; padding: 5px 30px 0; background-color: rgba(0,0,0,0.8); border-radius: 50%; } .postgame-progression-mastery-meter-frame .mastery-meter-info-details .mastery-meter-info-details-header { height: 20px; } .postgame-progression-mastery-meter-frame .mastery-meter-info-details .mastery-meter-info-details-body { width: 100%; margin: 5px 0; padding-bottom: 5px; border-top: 1px solid rgba(120,90,40,0.5); border-bottom: 1px solid rgba(120,90,40,0.5); } .postgame-progression-mastery-meter-frame .mastery-meter-info-details .mastery-meter-info-details-footer { color: rgba(160,155,140,0.5); height: 20px; } .postgame-progression-mastery-meter-frame .mastery-meter-splash-preloader-fill { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; } .postgame-progression-mastery-meter-frame .postgame-preloader-spinner { background-image: url(/fe/lol-postgame/spinner.png); background-size: contain; background-position: center; background-repeat: no-repeat; width: 30px; height: 30px; -webkit-animation: postgame-spin 4s linear infinite; } @-webkit-keyframes postgame-spin { 100% { -webkit-transform: rotate(360deg); } } .mastery-ribbon-level-1 { background-image: url(/fe/lol-postgame/banner-mastery-small-lvl1.png); background-size: contain; background-position: center; background-repeat: no-repeat; width: 94.5px; height: 186px; left: calc(50% - 47.25px); } .mastery-ribbon-level-2 { background-image: url(/fe/lol-postgame/banner-mastery-small-lvl2.png); background-size: contain; background-position: center; background-repeat: no-repeat; width: 94.5px; height: 186px; left: calc(50% - 47.25px); } .mastery-ribbon-level-3 { background-image: url(/fe/lol-postgame/banner-mastery-small-lvl3.png); background-size: contain; background-position: center; background-repeat: no-repeat; width: 94.5px; height: 186px; left: calc(50% - 47.25px); } .mastery-ribbon-level-4 { background-image: url(/fe/lol-postgame/banner-mastery-small-lvl4.png); background-size: contain; background-position: center; background-repeat: no-repeat; width: 94.5px; height: 186px; left: calc(50% - 47.25px); } .mastery-ribbon-level-5 { background-image: url(/fe/lol-postgame/banner-mastery-small-lvl5.png); background-size: contain; background-position: center; background-repeat: no-repeat; width: 94.5px; height: 186px; left: calc(50% - 47.25px); } .mastery-ribbon-level-6 { background-image: url(/fe/lol-postgame/banner-mastery-small-lvl6.png); background-size: contain; background-position: center; background-repeat: no-repeat; width: 94.5px; height: 186px; left: calc(50% - 47.25px); } .mastery-ribbon-level-7 { background-image: url(/fe/lol-postgame/banner-mastery-small-lvl7.png); background-size: contain; background-position: center; background-repeat: no-repeat; width: 94.5px; height: 186px; left: calc(50% - 47.25px); } .mastery-ribbon-level-empty { background-image: url(/fe/lol-postgame/banner-mastery-small-lvlempty.png); background-size: contain; background-position: center; background-repeat: no-repeat; width: 94.5px; height: 186px; left: calc(50% - 47.25px); } .postgame-progression-mastery-meter-ribbon { position: absolute; top: 82px; } .postgame-progression-mastery-meter-fill { position: absolute; -webkit-mask-image: url(/fe/lol-postgame/frame-meter-mask-bar.png); -webkit-mask-size: contain; -webkit-mask-position: center; -webkit-mask-repeat: no-repeat; width: 185.5px; height: 189.75px; } .radial-progress-next-level, .radial-progress-before-match, .radial-progress-max-level { position: absolute; } .radial-progress-before-match-middle { width: 100%; height: 100%; background-image: url(/fe/lol-postgame/frame-meter-gradient.png); background-size: contain; background-position: center; background-repeat: no-repeat; } .radial-progress-current-level-middle, .radial-progress-next-level-middle { width: 100%; height: 100%; background-color: #cdfafa; } .radial-progress-max-level { width: 100%; height: 100%; background: linear-gradient(to bottom, #f0e6d2, #c89b3c); } .xp-meter-content-header, .xp-meter-content-footer { font-family: var(--font-display); } .xp-meter-content-header, .xp-meter-content-footer { -webkit-user-select: none; } .xp-meter-content-header, .xp-meter-content-footer { font-kerning: normal; -webkit-font-feature-settings: "kern" 1; -webkit-font-smoothing: antialiased; } .xp-meter-content-header, .xp-meter-content-footer { text-transform: uppercase; } .xp-meter-content-header:lang(ko-kr), .xp-meter-content-footer:lang(ko-kr), .xp-meter-content-header:lang(ja-jp), .xp-meter-content-footer:lang(ja-jp), .xp-meter-content-header:lang(tr-tr), .xp-meter-content-footer:lang(tr-tr), .xp-meter-content-header:lang(el-gr), .xp-meter-content-footer:lang(el-gr), .xp-meter-content-header:lang(th-th), .xp-meter-content-footer:lang(th-th), .xp-meter-content-header:lang(zh-tw), .xp-meter-content-footer:lang(zh-tw) { text-transform: none; } .xp-meter-content-header { color: #f0e6d2; font-size: 14px; font-weight: 700; line-height: 18px; letter-spacing: 0.075em; } .xp-meter-content-footer { color: #f0e6d2; font-size: 12px; font-weight: 700; line-height: 16px; letter-spacing: 0.075em; } .xp-meter-content-footer:lang(ja-jp) { font-size: 13px; } .postgame-progression-xp-meter { width: 181px; display: flex; flex-direction: column; align-items: center; justify-content: center; position: relative; text-align: center; margin-top: 20px; } .postgame-progression-xp-meter lol-uikit-themed-level-ring { position: absolute; top: 0; right: 0; bottom: 0; left: 0; } .postgame-progression-xp-meter:first-child { margin-top: 14px; } .postgame-progression-xp-meter.large { height: 181px; margin-bottom: 20px; } .postgame-progression-xp-meter.small { width: 100%; height: initial; margin: 0; } .xp-meter-content-container { direction: ltr; display: flex; flex-direction: column; } .xp-meter-content-header { height: 20px; } .xp-meter-content-body { width: 100%; padding: 0 30px; box-sizing: border-box; } .xp-meter-content-footer { color: rgba(160,155,140,0.5); height: 20px; } .postgame-progression-number-reels { font-family: var(--font-display); } .postgame-progression-number-reels { -webkit-user-select: none; } .postgame-progression-number-reels { font-kerning: normal; -webkit-font-feature-settings: "kern" 1; -webkit-font-smoothing: antialiased; } .postgame-progression-number-reels { text-transform: uppercase; } .postgame-progression-number-reels:lang(ko-kr), .postgame-progression-number-reels:lang(ja-jp), .postgame-progression-number-reels:lang(tr-tr), .postgame-progression-number-reels:lang(el-gr), .postgame-progression-number-reels:lang(th-th), .postgame-progression-number-reels:lang(zh-tw) { text-transform: none; } .postgame-progression-number-reels { color: #f0e6d2; font-size: 40px; font-weight: 700; line-height: 42px; letter-spacing: 0.05em; } .postgame-progression-number-reels { background: linear-gradient(to bottom, #cdbe91 0%, #c8aa6e 35%, #765c29 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; } .postgame-progression-number-reels { padding-bottom: 5px; width: 100%; margin: 5px 0; border-top: 1px solid rgba(120,90,40,0.5); border-bottom: 1px solid rgba(120,90,40,0.5); } .postgame-breakdown { width: 190px; } .postgame-breakdown-entry[disabled="true"] .postgame-breakdown-amount .lol-typekit-value, .postgame-breakdown-entry[disabled="true"] .postgame-breakdown-name .lol-typekit-label { color: #3c3c41; } .secondary-progression-component .secondary-progression-radial .secondary-progression-center-text, .secondary-progression-component .secondary-progression-details .secondary-progression-header, .secondary-progression-component .secondary-progression-details .secondary-progression-body { font-family: var(--font-display); } .secondary-progression-component .secondary-progression-radial .secondary-progression-center-text, .secondary-progression-component .secondary-progression-details .secondary-progression-header, .secondary-progression-component .secondary-progression-details .secondary-progression-body { -webkit-user-select: none; } .secondary-progression-component .secondary-progression-radial .secondary-progression-center-text, .secondary-progression-component .secondary-progression-details .secondary-progression-header, .secondary-progression-component .secondary-progression-details .secondary-progression-body { font-kerning: normal; -webkit-font-feature-settings: "kern" 1; -webkit-font-smoothing: antialiased; } .secondary-progression-component .secondary-progression-radial .secondary-progression-center-text, .secondary-progression-component .secondary-progression-details .secondary-progression-header { text-transform: uppercase; } .secondary-progression-component .secondary-progression-radial .secondary-progression-center-text:lang(ko-kr), .secondary-progression-component .secondary-progression-details .secondary-progression-header:lang(ko-kr), .secondary-progression-component .secondary-progression-radial .secondary-progression-center-text:lang(ja-jp), .secondary-progression-component .secondary-progression-details .secondary-progression-header:lang(ja-jp), .secondary-progression-component .secondary-progression-radial .secondary-progression-center-text:lang(tr-tr), .secondary-progression-component .secondary-progression-details .secondary-progression-header:lang(tr-tr), .secondary-progression-component .secondary-progression-radial .secondary-progression-center-text:lang(el-gr), .secondary-progression-component .secondary-progression-details .secondary-progression-header:lang(el-gr), .secondary-progression-component .secondary-progression-radial .secondary-progression-center-text:lang(th-th), .secondary-progression-component .secondary-progression-details .secondary-progression-header:lang(th-th), .secondary-progression-component .secondary-progression-radial .secondary-progression-center-text:lang(zh-tw), .secondary-progression-component .secondary-progression-details .secondary-progression-header:lang(zh-tw) { text-transform: none; } .secondary-progression-component .secondary-progression-radial .secondary-progression-center-text { color: #f0e6d2; font-size: 24px; font-weight: 700; line-height: 28px; letter-spacing: 0.05em; } .secondary-progression-component .secondary-progression-details .secondary-progression-header { color: #f0e6d2; font-size: 12px; font-weight: 700; line-height: 16px; letter-spacing: 0.075em; } .secondary-progression-component .secondary-progression-details .secondary-progression-header:lang(ja-jp) { font-size: 13px; } .secondary-progression-component .secondary-progression-details .secondary-progression-header { color: #a09b8c; } .secondary-progression-component .secondary-progression-radial .secondary-progression-center-text { background: linear-gradient(to bottom, #cdbe91 0%, #c8aa6e 35%, #765c29 100%); -webkit-background-clip: text; -webkit-text-fill-color: transparent; } .secondary-progression-component .secondary-progression-details .secondary-progression-body { font-size: 16px; font-weight: 700; letter-spacing: 0.05em; } .secondary-progression-component { position: relative; height: 72px; width: 100%; margin-bottom: 1px; } .secondary-progression-component .secondary-progression-radial { height: 72px; width: 72px; position: absolute; top: 0; left: 0; margin: 0; } .secondary-progression-component .secondary-progression-radial .secondary-progression-lottie-container { position: absolute; margin: auto; top: 50%; left: 50%; transform: scale(0.1625); pointer-events: none; } .secondary-progression-component .secondary-progression-radial .secondary-progression-full-frame { position: absolute; background-image: url(/fe/lol-postgame/meter_frame.png); height: 100%; width: 100%; background-size: cover; } .secondary-progression-component .secondary-progression-radial .secondary-progression-full-frame-background { position: absolute; background-image: url(/fe/lol-postgame/meter_frameBG.png); height: 100%; width: 100%; background-size: cover; } .secondary-progression-component .secondary-progression-radial .secondary-progression-full-meter { position: absolute; background-image: url(/fe/lol-postgame/meter_complete.png); height: 100%; width: 100%; background-size: cover; } .secondary-progression-component .secondary-progression-radial .secondary-progression-radial-overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: rgba(0,0,0,0.5); border-radius: 50%; } .secondary-progression-component .secondary-progression-radial .secondary-progression-center-image { position: absolute; height: 100%; width: 100%; -webkit-mask-image: url(/fe/lol-postgame/meter_mask.png); -webkit-mask-size: contain; -webkit-mask-position: center; -webkit-mask-repeat: no-repeat; } .secondary-progression-component .secondary-progression-radial .secondary-progression-center-image img { height: 75%; width: 75%; position: absolute; margin: auto; top: 0; bottom: 0; left: 0; right: 0; } .secondary-progression-component .secondary-progression-radial .secondary-progression-center-text { position: absolute; top: 50%; width: 100%; text-align: center; transform: translateY(-50%); } .secondary-progression-component .secondary-progression-radial .secondary-progression-center-text.length4 { transform: translateY(-50%) scale(0.75); } .secondary-progression-component .secondary-progression-radial .secondary-progression-center-text.length5 { transform: translateY(-50%) scale(0.6); } .secondary-progression-component .secondary-progression-radial .secondary-progression-center-text.length6 { transform: translateY(-50%) scale(0.5); } .secondary-progression-component .secondary-progression-radial .secondary-progression-center-text.length7 { transform: translateY(-50%) scale(0.42857); } .secondary-progression-component .secondary-progression-radial .secondary-progression-center-text.length8 { transform: translateY(-50%) scale(0.375); } .secondary-progression-component .secondary-progression-details { position: absolute; display: flex; width: 100%; height: 100%; flex-direction: column; justify-content: center; pointer-events: none; } .secondary-progression-component .secondary-progression-details .secondary-progression-header { margin-left: 87px; text-align: left; position: relative; font-size: 11px; line-height: 12px; } .secondary-progression-component .secondary-progression-details .secondary-progression-body { color: #f0e6d2; margin-left: 87px; text-align: left; position: relative; } .secondary-progression-component .secondary-progression-details .flash { position: absolute; top: 0; left: 0; color: #cdfafa; text-shadow: #cdfafa 0 0 9px; opacity: 0; } .secondary-progression-component .secondary-progression-details .flash.active.gained { animation-name: number-value-glow-fade; animation-duration: 1s; } @-moz-keyframes number-value-glow-fade { 0% { opacity: 1; } 100% { opacity: 0; } } @-webkit-keyframes number-value-glow-fade { 0% { opacity: 1; } 100% { opacity: 0; } } @-o-keyframes number-value-glow-fade { 0% { opacity: 1; } 100% { opacity: 0; } } @keyframes number-value-glow-fade { 0% { opacity: 1; } 100% { opacity: 0; } } .postgame-party-status-mouseover-header { font-family: var(--font-display); } .postgame-party-status-mouseover-text { font-family: var(--font-body); } .postgame-party-status-mouseover-header, .postgame-party-status-mouseover-text { -webkit-user-select: none; } .postgame-party-status-mouseover-header, .postgame-party-status-mouseover-text { font-kerning: normal; -webkit-font-feature-settings: "kern" 1; -webkit-font-smoothing: antialiased; } .postgame-party-status-mouseover-header { text-transform: uppercase; } .postgame-party-status-mouseover-header:lang(ko-kr), .postgame-party-status-mouseover-header:lang(ja-jp), .postgame-party-status-mouseover-header:lang(tr-tr), .postgame-party-status-mouseover-header:lang(el-gr), .postgame-party-status-mouseover-header:lang(th-th), .postgame-party-status-mouseover-header:lang(zh-tw) { text-transform: none; } .postgame-party-status-mouseover-header { color: #f0e6d2; font-size: 14px; font-weight: 700; line-height: 18px; letter-spacing: 0.075em; } .postgame-party-status-mouseover-text { color: #a09b8c; font-size: 12px; font-weight: normal; line-height: 16px; letter-spacing: 0.025em; -webkit-font-smoothing: subpixel-antialiased; } .postgame-party-status-mouseover-text:lang(ja-jp) { font-size: 13px; } .postgame-party-status { padding-bottom: 8px; } .postgame-party-status-icons { display: flex; justify-content: center; } .postgame-party-status-ready-players { display: flex; flex-direction: row; } .postgame-party-status-left-players { display: flex; flex-direction: row-reverse; } .postgame-party-status-player { width: 16px; height: 15px; margin-left: 3px; margin-right: 2px; } .postgame-party-status-player[player-status="left"] { background-image: url(/fe/lol-postgame/party-status-player-left.svg); animation-name: postgame-party-status-fade-in; animation-duration: 0.2s; animation-timing-function: linear; } .postgame-party-status-player[player-status="eog"] { background-image: url(/fe/lol-postgame/party-status-player-eog.svg); } .postgame-party-status-player[player-status="ready"] { background-image: url(/fe/lol-postgame/party-status-player-ready.svg); animation-name: postgame-party-status-fade-in; animation-duration: 0.2s; animation-timing-function: linear; } .postgame-party-status-decorator { width: 22px; height: 2px; margin-left: 6px; margin-right: 5px; margin-top: 6px; background-image: url(/fe/lol-postgame/party-status-decorator-l.svg); } .postgame-party-status-decorator[position="right"] { background-image: url(/fe/lol-postgame/party-status-decorator-l.svg); transform: scaleX(-1); } @-moz-keyframes postgame-party-status-fade-in { 0% { transform: scale(2); } 100% { transform: scale(1); } } @-webkit-keyframes postgame-party-status-fade-in { 0% { transform: scale(2); } 100% { transform: scale(1); } } @-o-keyframes postgame-party-status-fade-in { 0% { transform: scale(2); } 100% { transform: scale(1); } } @keyframes postgame-party-status-fade-in { 0% { transform: scale(2); } 100% { transform: scale(1); } } .postgame-report-body-text { font-family: var(--font-body); } .postgame-report-body-text { -webkit-user-select: none; } .postgame-report-body-text { font-kerning: normal; -webkit-font-feature-settings: "kern" 1; -webkit-font-smoothing: antialiased; } .postgame-report-body-text { color: #a09b8c; font-size: 12px; font-weight: normal; line-height: 16px; letter-spacing: 0.025em; -webkit-font-smoothing: subpixel-antialiased; } .postgame-report-body-text:lang(ja-jp) { font-size: 13px; } .postgame-report-modal { direction: ltr; width: 366px; box-sizing: border-box; display: flex; flex-direction: column; text-align: left ; padding: 18px; -webkit-user-select: none; cursor: default; } .postgame-report-header { flex: 1; } .postgame-report-body { display: flex; flex-direction: column; flex: 8; } .postgame-report-body-text { flex: 0; margin: 12px 0; color: #a09b8c; } .postgame-report-body-categories { flex: 0; list-style-type: none; padding: 0; margin: 0; } .postgame-report-flat-textarea-scrollable { display: flex; flex-direction: column; flex: 1; margin-bottom: 30px; } .postgame-report-flat-textarea { display: flex; flex-direction: column; flex: 1; } .postgame-report-textarea { height: 70px; flex: 1; } .postgame-report-header-title { font-family: var(--font-display); } .postgame-report-header-summoner-name { font-family: var(--font-body); } .postgame-report-header-title, .postgame-report-header-summoner-name { -webkit-user-select: none; } .postgame-report-header-title, .postgame-report-header-summoner-name { font-kerning: normal; -webkit-font-feature-settings: "kern" 1; -webkit-font-smoothing: antialiased; } .postgame-report-header-title { text-transform: uppercase; } .postgame-report-header-title:lang(ko-kr), .postgame-report-header-title:lang(ja-jp), .postgame-report-header-title:lang(tr-tr), .postgame-report-header-title:lang(el-gr), .postgame-report-header-title:lang(th-th), .postgame-report-header-title:lang(zh-tw) { text-transform: none; } .postgame-report-header-title { color: #f0e6d2; font-size: 18px; font-weight: 700; line-height: 22px; letter-spacing: 0.05em; } .postgame-report-header-summoner-name { color: #a09b8c; font-size: 12px; font-weight: normal; line-height: 16px; letter-spacing: 0.1em; -webkit-font-smoothing: subpixel-antialiased; } .postgame-report-header-summoner-name:lang(ja-jp) { font-size: 13px; } .postgame-report-header { display: flex; } .postgame-report-header-icon { position: relative; width: 65px; height: 65px; } .postgame-report-header-text { display: flex; flex-direction: column; justify-content: center; margin: 0 0 0 18px ; } .postgame-report-header-title { color: #f0e6d2; } .postgame-report-header-summoner-name { margin-top: 5px; color: #a09b8c; } .postgame-report-category-text-title, .postgame-report-category-text-description { font-family: var(--font-body); } .postgame-report-category-text-title, .postgame-report-category-text-description { -webkit-user-select: none; } .postgame-report-category-text-title, .postgame-report-category-text-description { font-kerning: normal; -webkit-font-feature-settings: "kern" 1; -webkit-font-smoothing: antialiased; } .postgame-report-category-text-title, .postgame-report-category-text-description { color: #a09b8c; font-size: 12px; font-weight: normal; line-height: 16px; letter-spacing: 0.1em; -webkit-font-smoothing: subpixel-antialiased; } .postgame-report-category-text-title:lang(ja-jp), .postgame-report-category-text-description:lang(ja-jp) { font-size: 13px; } .postgame-report-category { margin-bottom: 12px; } .postgame-report-category-flat-checkbox { display: inline-flex; } .postgame-report-category-text-title { display: inline-block; margin: 0 0 0 5px ; color: #f0e6d2; word-wrap: break-word; } .postgame-report-category-text-title:hover { color: #f0e6d2; } .postgame-report-category-text-description { display: block; margin: -3px 0 0 23px ; color: #a09b8c; word-wrap: break-word; } .lol-tooltip-component { display: none; } .decorated-footer .confirm-button-container lol-uikit-primary-magic-button.confirm { text-transform: uppercase; } .decorated-footer .confirm-button-container lol-uikit-primary-magic-button.confirm:lang(ko-kr), .decorated-footer .confirm-button-container lol-uikit-primary-magic-button.confirm:lang(ja-jp), .decorated-footer .confirm-button-container lol-uikit-primary-magic-button.confirm:lang(tr-tr), .decorated-footer .confirm-button-container lol-uikit-primary-magic-button.confirm:lang(el-gr), .decorated-footer .confirm-button-container lol-uikit-primary-magic-button.confirm:lang(th-th), .decorated-footer .confirm-button-container lol-uikit-primary-magic-button.confirm:lang(zh-tw) { text-transform: none; } .decorated-footer { width: 100%; display: flex; flex-direction: row; justify-content: center; padding: 0 0 1px; height: 50px; box-sizing: border-box; } .decorated-footer .confirm-button-container { position: relative; display: flex; flex-direction: row; justify-content: center; padding-bottom: 15px; } .decorated-footer .confirm-button-container lol-uikit-primary-magic-button.confirm { display: flex; min-width: 160px; pointer-events: auto; } .decorated-footer .button-img { width: 30px; height: 30px; background-size: contain; background-color: transparent; border: 0px; outline: 0px; } .decorated-footer .button-img.close { background-image: url(/fe/lol-postgame/button_close.png); } .decorated-footer .button-img.close:hover { background-image: url(/fe/lol-postgame/button_close_hover.png); } .decorated-footer .button-img.close:active { background-image: url(/fe/lol-postgame/button_close_click.png); } .decorated-footer .button-img.close:disabled { background-image: url(/fe/lol-postgame/button_close_inactive.png); } .decorated-footer .decorated-footer-decoration { display: flex; position: relative; flex: 1 1 auto; height: 34px; margin-top: 15px; } .decorated-footer .decorated-footer-decoration.decorated-footer-left .button { position: absolute; top: -13px; right: 2px; } .arrow-footer[version="7.13"] .confirm-button-container button.confirm { font-family: var(--font-display); } .arrow-footer[version="7.13"] .confirm-button-container button.confirm { -webkit-user-select: none; } .arrow-footer[version="7.13"] .confirm-button-container button.confirm { font-kerning: normal; -webkit-font-feature-settings: "kern" 1; -webkit-font-smoothing: antialiased; } .arrow-footer[version="7.13"] .confirm-button-container button.confirm { text-transform: uppercase; } .arrow-footer[version="7.13"] .confirm-button-container button.confirm:lang(ko-kr), .arrow-footer[version="7.13"] .confirm-button-container button.confirm:lang(ja-jp), .arrow-footer[version="7.13"] .confirm-button-container button.confirm:lang(tr-tr), .arrow-footer[version="7.13"] .confirm-button-container button.confirm:lang(el-gr), .arrow-footer[version="7.13"] .confirm-button-container button.confirm:lang(th-th), .arrow-footer[version="7.13"] .confirm-button-container button.confirm:lang(zh-tw) { text-transform: none; } .arrow-footer[version="7.13"] .confirm-button-container button.confirm { color: #c8aa6e; font-size: 14px; font-weight: 700; letter-spacing: 0.0325em; } .arrow-footer[version="7.13"] .confirm-button-container button.confirm:hover { color: #f0e6d2; } .arrow-footer[version="7.13"] .confirm-button-container button.confirm:disabled, .arrow-footer[version="7.13"] .confirm-button-container button.confirm:disabled:hover, .arrow-footer[version="7.13"] .confirm-button-container button.confirm[disabled='true'], .arrow-footer[version="7.13"] .confirm-button-container button.confirm[disabled='true']:hover { color: #5c5b57; cursor: default; } .arrow-footer[version="7.13"] .confirm-button-container button.confirm:active { color: #785a28; } .arrow-footer[version="7.13"] { width: 100%; display: flex; flex-direction: row; justify-content: center; padding: 0 0 1px; height: 51px; box-sizing: border-box; } .arrow-footer[version="7.13"].hide-close-button .confirm-button-container button.confirm { margin-left: 0px; } .arrow-footer[version="7.13"].hide-close-button .confirm-button-container button.confirm .left-confirm { background-image: url(/fe/lol-postgame/LeftStraightDefault.png); } .arrow-footer[version="7.13"].hide-close-button .confirm-button-container button.confirm:hover .left-confirm { background-image: url(/fe/lol-postgame/LeftStraightHover.png); } .arrow-footer[version="7.13"].hide-close-button .confirm-button-container button.confirm:active .left-confirm { background-image: url(/fe/lol-postgame/LeftStraightClick.png); } .arrow-footer[version="7.13"].hide-close-button .confirm-button-container button.confirm.disabled .left-confirm { background-image: url(/fe/lol-postgame/LeftStraightDisabled.png); } .arrow-footer[version="7.13"].hide-close-button .confirm-button-container button.confirm.completed .left-confirm { background-image: url(/fe/lol-postgame/LeftStraightCompleted.png); } .arrow-footer[version="7.13"].hide-close-button .confirm-button-container button.close { display: none; } .arrow-footer[version="7.13"].hide-close-button .confirm-button-container .border-bg .left-border-bg { background-image: url(/fe/lol-postgame/BGLeftStraight.png); } .arrow-footer[version="7.13"].hide-close-button .confirm-button-container .border-bg .middle-border-bg { margin: 0 7px; } .arrow-footer[version="7.13"].hide-close-button .arrow-footer-decoration { flex-direction: column; justify-content: center; } .arrow-footer[version="7.13"].hide-close-button .arrow-footer-decoration .arrow-footer-decoration-child { background-size: 100% 100%; width: 256px; height: 8px; } .arrow-footer[version="7.13"].hide-close-button .arrow-footer-decoration .arrow-footer-decoration-child.arrow-footer-decoration-left { margin-right: 50px; align-self: flex-end; background-image: url(/fe/lol-postgame/FooterMetalDecorationLeft.png); } .arrow-footer[version="7.13"].hide-close-button .arrow-footer-decoration .arrow-footer-decoration-child.arrow-footer-decoration-right { margin-left: 50px; align-self: flex-start; background-image: url(/fe/lol-postgame/FooterMetalDecorationRight.png); } .arrow-footer[version="7.13"] .confirm-button-container { position: relative; display: flex; flex-direction: row; justify-content: center; } .arrow-footer[version="7.13"] .confirm-button-container .border-bg { position: absolute; width: 100%; height: 44px; display: flex; top: -5px; } .arrow-footer[version="7.13"] .confirm-button-container .border-bg .left-border-bg { height: 44px; width: 29px; position: absolute; top: 0px; left: -6px; background-size: 100% 100%; background-image: url(/fe/lol-postgame/BGLeft.png); } .arrow-footer[version="7.13"] .confirm-button-container .border-bg .middle-border-bg { flex-grow: 1; height: 44px; margin: 0px 12px; background-size: contain; background-image: url(/fe/lol-postgame/BGMid.png); } .arrow-footer[version="7.13"] .confirm-button-container .border-bg .right-border-bg { height: 44px; width: 26px; position: absolute; top: 0; right: -6px; background-size: 100% 100%; background-image: url(/fe/lol-postgame/BGRight.png); } .arrow-footer[version="7.13"] .confirm-button-container button { border: 0; outline: 0; padding: 0; background-color: transparent; cursor: pointer; } .arrow-footer[version="7.13"] .confirm-button-container button.disabled { cursor: default; } .arrow-footer[version="7.13"] .confirm-button-container button.confirm { height: 34px; min-width: 170px; margin-left: 29px; padding-right: 1px; color: #a3c7c7; position: relative; display: flex; } .arrow-footer[version="7.13"] .confirm-button-container button.confirm > div { background-size: 100% 100%; height: 34px; } .arrow-footer[version="7.13"] .confirm-button-container button.confirm .left-confirm { width: 12px; background-image: url(/fe/lol-postgame/LeftDefault.png); } .arrow-footer[version="7.13"] .confirm-button-container button.confirm .middle-confirm { display: flex; justify-content: center; align-items: center; flex-grow: 1; padding: 0px 10px; background-repeat: repeat-x; background-image: url(/fe/lol-postgame/MidDefault.png); } .arrow-footer[version="7.13"] .confirm-button-container button.confirm .middle-confirm:lang(ar-ae) { direction: ltr; } .arrow-footer[version="7.13"] .confirm-button-container button.confirm .right-confirm { width: 17px; background-image: url(/fe/lol-postgame/RightDefault.png); } .arrow-footer[version="7.13"] .confirm-button-container button.confirm:hover .left-confirm { background-image: url(/fe/lol-postgame/LeftHover.png); } .arrow-footer[version="7.13"] .confirm-button-container button.confirm:hover .middle-confirm { background-image: url(/fe/lol-postgame/MidHover.png); } .arrow-footer[version="7.13"] .confirm-button-container button.confirm:hover .right-confirm { background-image: url(/fe/lol-postgame/RightHover.png); } .arrow-footer[version="7.13"] .confirm-button-container button.confirm:active { color: #005a82; } .arrow-footer[version="7.13"] .confirm-button-container button.confirm:active .left-confirm { background-image: url(/fe/lol-postgame/LeftClick.png); } .arrow-footer[version="7.13"] .confirm-button-container button.confirm:active .middle-confirm { background-image: url(/fe/lol-postgame/MidClick.png); } .arrow-footer[version="7.13"] .confirm-button-container button.confirm:active .right-confirm { background-image: url(/fe/lol-postgame/RightClick.png); } .arrow-footer[version="7.13"] .confirm-button-container button.confirm.disabled { color: #5c5b57; cursor: default; } .arrow-footer[version="7.13"] .confirm-button-container button.confirm.disabled .left-confirm { background-image: url(/fe/lol-postgame/LeftDisabled.png); } .arrow-footer[version="7.13"] .confirm-button-container button.confirm.disabled .middle-confirm { background-image: url(/fe/lol-postgame/MidDisabled.png); } .arrow-footer[version="7.13"] .confirm-button-container button.confirm.disabled .right-confirm { background-image: url(/fe/lol-postgame/RightDisabled.png); } .arrow-footer[version="7.13"] .confirm-button-container button.confirm.completed { color: #c89b3c; cursor: default; } .arrow-footer[version="7.13"] .confirm-button-container button.confirm.completed .left-confirm { background-image: url(/fe/lol-postgame/LeftCompleted.png); } .arrow-footer[version="7.13"] .confirm-button-container button.confirm.completed .middle-confirm { background-image: url(/fe/lol-postgame/MidCompleted.png); } .arrow-footer[version="7.13"] .confirm-button-container button.confirm.completed .right-confirm { background-image: url(/fe/lol-postgame/RightCompleted.png); } .arrow-footer[version="7.13"] .confirm-button-container button.close { width: 34px; height: 34px; background-size: contain; position: absolute; left: 0px; background-image: url(/fe/lol-postgame/Normal.png); } .arrow-footer[version="7.13"] .confirm-button-container button.close .close-icon { height: 34px; width: 34px; background-size: 18px; background-repeat: no-repeat; background-position: center; background-image: url(/fe/lol-postgame/Exit_Default.png); } .arrow-footer[version="7.13"] .confirm-button-container button.close[type="back"] .close-icon { background-image: url(/fe/lol-postgame/Back_default.png); } .arrow-footer[version="7.13"] .confirm-button-container button.close:hover { background-image: url(/fe/lol-postgame/Hover.png); } .arrow-footer[version="7.13"] .confirm-button-container button.close:hover .close-icon { background-image: url(/fe/lol-postgame/Exit_Hover.png); } .arrow-footer[version="7.13"] .confirm-button-container button.close:hover[type="back"] .close-icon { background-image: url(/fe/lol-postgame/Back_Hover.png); } .arrow-footer[version="7.13"] .confirm-button-container button.close:active { background-image: url(/fe/lol-postgame/Clicked.png); } .arrow-footer[version="7.13"] .confirm-button-container button.close:active .close-icon { background-image: url(/fe/lol-postgame/Exit_Click.png); } .arrow-footer[version="7.13"] .confirm-button-container button.close:active[type="back"] .close-icon { background-image: url(/fe/lol-postgame/Back_click.png); } .arrow-footer[version="7.13"] .confirm-button-container button.close.disabled { background-image: url(/fe/lol-postgame/Disabled.png); cursor: default; } .arrow-footer[version="7.13"] .confirm-button-container button.close.disabled .close-icon { background-image: url(/fe/lol-postgame/Exit_Disabled.png); } .arrow-footer[version="7.13"] .confirm-button-container button.close.disabled[type="back"] .close-icon { background-image: url(/fe/lol-postgame/Back_Disabled.png); } .arrow-footer[version="7.13"] .confirm-button-container button.close.completed { cursor: default; background-image: url(/fe/lol-postgame/Completed.png); } .arrow-footer[version="7.13"] .confirm-button-container button.close.completed .close-icon { background-image: url(/fe/lol-postgame/Checkmark.png); } .arrow-footer[version="7.13"] .confirm-button-container button.close.completed[type="back"] .close-icon { background-image: url(/fe/lol-postgame/Checkmark.png); } .arrow-footer[version="7.13"] .arrow-footer-decoration { display: flex; position: relative; flex: 1 1 auto; height: 34px; } .basic-footer .confirm-button-container lol-uikit-primary-magic-button, .basic-footer .confirm-button-container lol-uikit-flat-button { text-transform: uppercase; } .basic-footer .confirm-button-container lol-uikit-primary-magic-button:lang(ko-kr), .basic-footer .confirm-button-container lol-uikit-flat-button:lang(ko-kr), .basic-footer .confirm-button-container lol-uikit-primary-magic-button:lang(ja-jp), .basic-footer .confirm-button-container lol-uikit-flat-button:lang(ja-jp), .basic-footer .confirm-button-container lol-uikit-primary-magic-button:lang(tr-tr), .basic-footer .confirm-button-container lol-uikit-flat-button:lang(tr-tr), .basic-footer .confirm-button-container lol-uikit-primary-magic-button:lang(el-gr), .basic-footer .confirm-button-container lol-uikit-flat-button:lang(el-gr), .basic-footer .confirm-button-container lol-uikit-primary-magic-button:lang(th-th), .basic-footer .confirm-button-container lol-uikit-flat-button:lang(th-th), .basic-footer .confirm-button-container lol-uikit-primary-magic-button:lang(zh-tw), .basic-footer .confirm-button-container lol-uikit-flat-button:lang(zh-tw) { text-transform: none; } .basic-footer { padding-left: 34px; padding-right: 35px; } .basic-footer { width: 100%; display: flex; flex-direction: row; justify-content: center; height: 48px; box-sizing: border-box; } .basic-footer .confirm-button-container { position: relative; display: flex; flex-direction: row; justify-content: center; flex-grow: 1; } .basic-footer .confirm-button-container lol-uikit-primary-magic-button, .basic-footer .confirm-button-container lol-uikit-flat-button { display: flex; min-width: 160px; pointer-events: auto; margin-left: 10px; } .basic-footer .confirm-button-container lol-uikit-primary-magic-button:last-child, .basic-footer .confirm-button-container lol-uikit-flat-button:last-child { margin-right: 10px; } .basic-footer .confirm-button-container::after, .basic-footer .confirm-button-container::before { display: flex; border-top: 1px solid #785a28; margin-top: 16px; height: 1px; flex-grow: 1; content: " "; } .media-fader { position: absolute; top: 0; } .media-fader .media-fader-asset { -webkit-user-drag: none; } .media-swapper { position: relative; }