.flyout-component .flyout-title .flyout-title-label { font-family: var(--font-display); } .flyout-component .flyout-title .flyout-title-label { -webkit-user-select: none; } .flyout-component .flyout-title .flyout-title-label { font-kerning: normal; -webkit-font-feature-settings: "kern" 1; -webkit-font-smoothing: antialiased; } .flyout-component .flyout-title .flyout-title-label { text-transform: uppercase; } .flyout-component .flyout-title .flyout-title-label:lang(ko-kr), .flyout-component .flyout-title .flyout-title-label:lang(ja-jp), .flyout-component .flyout-title .flyout-title-label:lang(tr-tr), .flyout-component .flyout-title .flyout-title-label:lang(el-gr), .flyout-component .flyout-title .flyout-title-label:lang(th-th), .flyout-component .flyout-title .flyout-title-label:lang(zh-tw) { text-transform: none; } .flyout-component .flyout-title .flyout-title-label { color: #f0e6d2; font-size: 18px; font-weight: 700; line-height: 22px; letter-spacing: 0.05em; } .flyout-component .flyout-title .flyout-title-label:lang(ar-ae) { letter-spacing: 0; } .flyout-component { direction: ltr; position: inherit; height: 610px; width: 775px; } .flyout-component .flyout-title { display: flex; align-items: center; border-bottom: thin solid #463714; } .flyout-component .flyout-title .flyout-title-label { flex-grow: 1; margin: 10px; } .flyout-component .flyout-title .flyout-title-close { cursor: pointer; height: 18px; width: 18px; background-color: #a09b8c; -webkit-mask-size: contain; -webkit-mask-image: url("/fe/lol-skins-picker/images/control-close.png"); margin: 0 10px 0 0 ; } .flyout-component .flyout-title .flyout-title-close:hover { background-color: #f0e6d2; } .flyout-component .flyout-title .flyout-title-close:active { background-color: #5b5a56; } .flyout-component .flyout-title .flyout-title-restore-default { margin-right: 10px; margin-top: 5px; margin-bottom: 5px; } .flyout-component .skins-grid { border-bottom: thin solid #463714; margin-bottom: 5px; } .control-panel-component { display: flex; align-items: center; height: 52px; } .control-panel-component .control-panel-text-filter { margin: 10px; } .control-panel-component .control-panel-text-filter .control-panel-search-text { min-width: 400px; } .control-panel-component .control-panel-grouping-options, .control-panel-component .control-panel-sort-options { margin: 10px 10px 10px 0 ; } .skins-grid-component .skins-grid-content .group-title-wrapper .group-title, .skins-grid-component .skins-grid-content .single-skin-wrapper .skin-tile .tile-name .tile-label { font-family: var(--font-display); } .skins-grid-component .skins-grid-content .group-title-wrapper .group-title, .skins-grid-component .skins-grid-content .single-skin-wrapper .skin-tile .tile-name .tile-label { -webkit-user-select: none; } .skins-grid-component .skins-grid-content .group-title-wrapper .group-title, .skins-grid-component .skins-grid-content .single-skin-wrapper .skin-tile .tile-name .tile-label { font-kerning: normal; -webkit-font-feature-settings: "kern" 1; -webkit-font-smoothing: antialiased; } .skins-grid-component .skins-grid-content .group-title-wrapper .group-title, .skins-grid-component .skins-grid-content .single-skin-wrapper .skin-tile .tile-name .tile-label { text-transform: uppercase; } .skins-grid-component .skins-grid-content .group-title-wrapper .group-title:lang(ko-kr), .skins-grid-component .skins-grid-content .single-skin-wrapper .skin-tile .tile-name .tile-label:lang(ko-kr), .skins-grid-component .skins-grid-content .group-title-wrapper .group-title:lang(ja-jp), .skins-grid-component .skins-grid-content .single-skin-wrapper .skin-tile .tile-name .tile-label:lang(ja-jp), .skins-grid-component .skins-grid-content .group-title-wrapper .group-title:lang(tr-tr), .skins-grid-component .skins-grid-content .single-skin-wrapper .skin-tile .tile-name .tile-label:lang(tr-tr), .skins-grid-component .skins-grid-content .group-title-wrapper .group-title:lang(el-gr), .skins-grid-component .skins-grid-content .single-skin-wrapper .skin-tile .tile-name .tile-label:lang(el-gr), .skins-grid-component .skins-grid-content .group-title-wrapper .group-title:lang(th-th), .skins-grid-component .skins-grid-content .single-skin-wrapper .skin-tile .tile-name .tile-label:lang(th-th), .skins-grid-component .skins-grid-content .group-title-wrapper .group-title:lang(zh-tw), .skins-grid-component .skins-grid-content .single-skin-wrapper .skin-tile .tile-name .tile-label:lang(zh-tw) { text-transform: none; } .skins-grid-component .skins-grid-content .single-skin-wrapper .skin-tile .tile-name .tile-label { text-transform: none; } .skins-grid-component .skins-grid-content .group-title-wrapper .group-title { color: #f0e6d2; font-size: 18px; font-weight: 700; line-height: 22px; letter-spacing: 0.05em; } .skins-grid-component .skins-grid-content .group-title-wrapper .group-title:lang(ar-ae) { letter-spacing: 0; } .skins-grid-component .skins-grid-content .single-skin-wrapper .skin-tile .tile-name .tile-label { color: #f0e6d2; font-size: 14px; font-weight: 700; line-height: 18px; letter-spacing: 0.075em; } .skins-grid-component .skins-grid-content .single-skin-wrapper .skin-tile .tile-name .tile-label:lang(ar-ae) { letter-spacing: 0; } .skins-grid-component .skins-grid-content .single-skin-wrapper .skin-tile .tile-name .tile-label { letter-spacing: 0.0375em; } .skins-grid-component .skins-grid-content .single-skin-wrapper .skin-tile .tile-name .tile-label:lang(ar-ae) { letter-spacing: 0; } .skins-grid-component .skins-grid-content { position: relative; height: 478px; width: 765px; margin: 0 0 0 10px; } .skins-grid-component .skins-grid-content:lang(ar-ae) { margin: 0 10px 0 0; } .skins-grid-component .skins-grid-content lol-collectibles-libs-virtual-list { direction: ltr ; } .skins-grid-component .skins-grid-content .group-title-wrapper { direction: ltr; margin-top: 5px; width: 750px; } .skins-grid-component .skins-grid-content .group-title-wrapper .group-title { display: inline; text-transform: uppercase; padding: 0 ; } .skins-grid-component .skins-grid-content .single-skin-wrapper { direction: ltr; position: absolute; } .skins-grid-component .skins-grid-content .single-skin-wrapper .skin-tile:hover .tile-image { opacity: 1; border: thin solid #c8aa6e; } .skins-grid-component .skins-grid-content .single-skin-wrapper .skin-tile.selected .tile-image { border: 2px solid transparent; -webkit-border-image: linear-gradient(to top, #c8aa6e 0%, #c89b3c 44%, #a07b32 59%, #785a28 100%); border-image-slice: 1; margin-top: -1px; margin-left: -1px; } .skins-grid-component .skins-grid-content .single-skin-wrapper .skin-tile.selected .skins-grid-component .skins-grid-content .single-skin-wrapper .skin-tile:hover .tile-image { border: 2px solid transparent; } .skins-grid-component .skins-grid-content .single-skin-wrapper .skin-tile .tile-image { border: thin solid #3c3c41; padding: 1px; opacity: 0.8; cursor: pointer; height: 170px; width: 170px; } .skins-grid-component .skins-grid-content .single-skin-wrapper .skin-tile .tile-name .tile-label { text-align: center; } .skins-grid-component .skins-grid-content .group-separator { width: 750px; border: solid #1b292a; border-width: 1px 0 0 0; margin-top: 4px; }