body { width: 100%; height: 100%; font-family: Minecraft Default; font-size: 36dp; font-effect: shadow(1dp 1dp #000000); color: #ffffff; background: transparent; display: flex; align-items: center; justify-content: center; } div#lcj_menu { width: 930dp; height: 812dp; margin: auto; display: flex; flex-direction: column; } div#tab_bar { width: 930dp; height: 92dp; display: flex; flex-direction: row; margin-bottom: 0; z-index: 2; box-sizing: border-box; } button.tab { display: block; height: 92dp; flex: 0; color: #000000; font-size: 36dp; font-effect: none; font-weight: normal; text-align: center; line-height: 100dp; cursor: pointer; background: transparent; border-width: 0px; image-color: #ffffff; margin: 0; box-sizing: border-box; } button.tab:hover, button.tab.selected { line-height: 80dp; } button.tab_left { flex: 2; decorator: image(tabLeft); } button.tab_left:hover, button.tab_left.selected { decorator: image(tabLeft_Havon); } button.tab_medium { flex: 2; decorator: image(tabMiddle); } button.tab_medium:hover, button.tab_medium.selected { decorator: image(tabMiddle_Havon); } button.tab_right { flex: 2; decorator: image(tabRight); } button.tab_right:hover, button.tab_right.selected { decorator: image(tabRight_Havon); } div#panel_container { width: 100%; height: 100%; flex-grow: 1; decorator: image(background); overflow: hidden; } div.tab_panel { width: 100%; height: 100%; display: flex; flex-direction: column; } div.list_container { width: 100%; max-height: 540dp; overflow-y: auto; display: block; flex-direction: column; margin-top: 38dp; } scrollbarvertical { width: 0dp; } scrollbarvertical sliderarrowdec { position: fixed; width: 39dp; height: 33dp; right: 100dp; bottom: -40dp; cursor: pointer; decorator: image(scrollUp); } scrollbarvertical sliderarrowinc { position: fixed; width: 39dp; height: 33dp; right: 58dp; bottom: -40dp; cursor: pointer; decorator: image(scrollDown); } div.list_item { width: 100%; height: 90dp; display: flex; flex-direction: row; align-items: center; } div.list_item:hover { image-color: #ffff00; } div.list_item button { flex: 1; height: 100%; display: flex; align-items: center; justify-content: flex-start; padding-left: 20dp; padding-right: 16dp; margin: 0 58dp; gap: 30dp; color: #ffffff; font-size: 36dp; background: transparent; border-width: 0px; cursor: pointer; decorator: image(listButton); } div.list_item button:hover, div.list_item button.selected { color: #ffff00; decorator: image(listButton_Hover); } div.list_item button img.thumb { width: 64dp; height: 64dp; } div.timer { width: 100%; text-align: center; font-size: 36dp; color: #aaaaaa; padding: 20dp 0; display: none; } div.no_games { width: 100%; text-align: center; font-size: 36dp; color: #aaaaaa; padding: 40dp 0; display: none; } div.size_bar { width: 100%; height: 8dp; margin-top: 8dp; background: rgba(255, 255, 255, 0.2); display: none; } @spritesheet background { src: "Assets/UI/images/lce/LoadCreateJoinMenu/background-sheet.png"; background: 0px 0px 1860px 1420px; background_None: 1860px 0px 1860px 1420px; } @spritesheet tab { src: "Assets/UI/images/lce/LoadCreateJoinMenu/tab-sheet.png"; tabLeft: 0px 0px 622px 176px; tabLeft_Havon: 0px 176px 622px 176px; tabMiddle: 622px 0px 622px 176px; tabMiddle_Havon: 622px 176px 622px 176px; tabRight: 1244px 0px 622px 176px; tabRight_Havon: 1244px 176px 622px 176px; } @spritesheet list { src: "Assets/UI/images/lce/button/list-sheet.png"; listButton: 0px 0px 200px 30px; listButton_Hover: 0px 30px 200px 30px; } @spritesheet scroll { src: "Assets/UI/images/lce/scroll-sheet.png"; scrollUp: 0px 0px 13px 11px; scrollDown: 13px 0px 13px 11px; }