.window { min-height: 80vh; width: 850dp; } .window .bg { overflow-y: hidden; } *.hidden { display: none; } #sort-panel.hidden { display: none; } /*------- TOP PANEL -------*/ @spritesheet auction_ui_title_sprites { src: game/tiles_page17.rttex; resolution: 1x; auction_search_title_icon: 992px 192px 32px 32px; } #window-title .title-icon { decorator: image(auction_search_title_icon); } /*------- SEARCH CONTAINER -------*/ #search-container { display: flex; width: 100%; margin: 0 0 15dp 0; align-items: center; justify-content: center; align-self: center; align-content: center; vertical-align: middle; } #search-container .img-button { margin: 0 5dp 0dp 0; flex: 0 0 auto; max-height: 35dp; } #search-container .img-button .label { font-size: 28dp; } #search-container .sort-options-container { flex: 1 1 auto; display: flex; flex-direction: row; align-items: center; justify-content: flex-end; align-self: center; align-content: center; margin-right: 7dp; } .info-panel #count-text { margin-bottom: 10dp; } #sort-options { width: 430dp; } #sort-options .img-button{ width: 60dp; height: 30dp; margin-top: 2dp; } #sort-options #sort-wl-asc { decorator: image(interface/large/gui_sorting_price_low_to_high.rttex); } #sort-options #sort-wl-des { decorator: image(interface/large/gui_sorting_price_high_to_low.rttex); } #sort-options #sort-time-asc { decorator: image(interface/large/gui_sorting_price_old_to_new.rttex); } #sort-options #sort-time-des { decorator: image(interface/large/gui_sorting_price_new_to_old.rttex); } /*------- MESSAGES LIST -------*/ #messages-list { width: 100%; overflow-y: auto; padding-top: 10dp; } #messages-list .message-table { width: 797dp; } #messages-list #message-table.centered { display: flex; align-items: center; justify-content: center; } #messages-list #message-table .error-msg { text-align: center; } /*------------------------------ Loading animation ----------------------------------------*/ .dots-container { display: flex; width: 100%; align-items: center; justify-content: center; margin-bottom: 10dp; padding: 20dp 0dp 10dp 0dp; } .dot { height: 10dp; width: 10dp; margin-right: 15dp; border-radius: 3dp; background-color: rgba(165,227,251,255); animation: 2s quadratic-in-out infinite spinner; transform: scale(1.0); display: inline-block; } .dot:last-child { margin-right: 0; } @keyframes spinner { from { transform: scale(0.8) rotate(0deg); } 50% { transform: scale(1.4) rotate(90deg); } to { transform: scale(0.8) rotate(180deg); } }