.nitro-catalog-classic-window { --catalog-swf-bg: #ecece4; --catalog-swf-panel: #f7f7f2; --catalog-swf-panel-2: #e7e7df; --catalog-swf-border: #9d9d96; --catalog-swf-border-dark: #6f6f6a; --catalog-swf-text: #222222; --catalog-swf-muted: #666666; --catalog-swf-blue: #2f8097; --catalog-swf-blue-dark: #1c596c; --catalog-swf-select: #63c5e9; --catalog-swf-select-outer: #82d1ed; --catalog-swf-bc: #ff8d00; --catalog-swf-bc-outer: #ffb53c; --habbo-slice-button-default: url("../../assets/images/catalog/buttons/btn_secondary.png"); --habbo-slice-button-hover: url("../../assets/images/catalog/buttons/btn_secondary_hover.png"); --habbo-slice-button-pressed: url("../../assets/images/catalog/buttons/btn_secondary_pressed.png"); --habbo-slice-button-disabled: url("../../assets/images/catalog/buttons/btn_secondary_disabled.png"); --habbo-slice-button-buy: url("../../assets/images/catalog/buttons/buy.png"); --habbo-slice-button-large: url("../../assets/images/catalog/buttons/buy.png"); --habbo-slice-button-large-hover: url("../../assets/images/catalog/buttons/buy_hover.png"); --habbo-slice-button-large-pressed: url("../../assets/images/catalog/buttons/buy_pressed.png"); --habbo-slice-button-large-disabled: url("../../assets/images/catalog/buttons/buy_disabled.png"); --habbo-button-green: url("../../assets/images/catalog/buttons/buy.png"); --habbo-button-green-hover: url("../../assets/images/catalog/buttons/buy_hover.png"); --habbo-button-green-pressed: url("../../assets/images/catalog/buttons/buy_pressed.png"); --habbo-button-green-disabled: url("../../assets/images/catalog/buttons/buy_disabled.png"); --habbo-close: url("../../assets/images/catalog/buttons/close.png"); --habbo-close-hover: url("../../assets/images/catalog/buttons/close_hover.png"); --habbo-close-pressed: url("../../assets/images/catalog/buttons/close_pressed.png"); --habbo-help: url("../../assets/images/catalog/buttons/help.png"); --habbo-help-hover: url("../../assets/images/catalog/buttons/help_hover.png"); --habbo-help-pressed: url("../../assets/images/catalog/buttons/help_pressed.png"); --habbo-stepper-plus: url("../../assets/images/catalog/buttons/plus.png"); --habbo-stepper-plus-hover: url("../../assets/images/catalog/buttons/plus_hover.png"); --habbo-stepper-plus-pressed: url("../../assets/images/catalog/buttons/plus_pressed.png"); --habbo-stepper-plus-disabled: url("../../assets/images/catalog/buttons/plus_disabled.png"); --habbo-stepper-minus: url("../../assets/images/catalog/buttons/minus.png"); --habbo-stepper-minus-hover: url("../../assets/images/catalog/buttons/minus_hover.png"); --habbo-stepper-minus-pressed: url("../../assets/images/catalog/buttons/minus_pressed.png"); --habbo-stepper-minus-disabled: url("../../assets/images/catalog/buttons/minus_disabled.png"); --habbo-scrollbar-up: url("../../assets/images/catalog/scrollbar/scroll_v_up.png"); --habbo-scrollbar-up-pressed: url("../../assets/images/catalog/scrollbar/scroll_v_up_pressed.png"); --habbo-scrollbar-down: url("../../assets/images/catalog/scrollbar/scroll_v_down.png"); --habbo-scrollbar-down-pressed: url("../../assets/images/catalog/scrollbar/scroll_v_down_pressed.png"); --habbo-scrollbar-thumb-v: url("../../assets/images/catalog/scrollbar/scroll_v_thumb.png"); --habbo-scrollbar-thumb-v-pressed: url("../../assets/images/catalog/scrollbar/scroll_v_thumb_pressed.png"); --habbo-scrollbar-h-left: url("../../assets/images/catalog/scrollbar/scroll_h_left.png"); --habbo-scrollbar-h-left-pressed: url("../../assets/images/catalog/scrollbar/scroll_h_left_pressed.png"); --habbo-scrollbar-h-right: url("../../assets/images/catalog/scrollbar/scroll_h_right.png"); --habbo-scrollbar-h-right-pressed: url("../../assets/images/catalog/scrollbar/scroll_h_right_pressed.png"); --habbo-scrollbar-thumb-h: url("../../assets/images/catalog/scrollbar/scroll_h_thumb.png"); --habbo-scrollbar-thumb-h-pressed: url("../../assets/images/catalog/scrollbar/scroll_h_thumb_pressed.png"); width: 660px !important; height: 720px !important; min-width: 660px !important; max-width: 660px !important; min-height: 640px !important; max-height: calc(100vh - 24px) !important; position: relative; color: var(--catalog-swf-text); background: var(--catalog-swf-bg) !important; border: 1px solid #000 !important; border-radius: 7px 7px 0 0 !important; box-shadow: 0 4px 4px rgba(0, 0, 0, 0.35); overflow: hidden; box-sizing: border-box; } .draggable-window:has(> .nitro-catalog-classic-window) { width: 660px !important; height: 720px !important; min-width: 660px !important; max-width: 660px !important; } .nitro-catalog-classic-window::before { display: none; } .nitro-catalog-classic-window > * { position: relative; z-index: 4; } .nitro-catalog-classic-window, .nitro-catalog-classic-window * { image-rendering: pixelated; } .nitro-catalog-classic-window .nitro-card-header { height: 35px; min-height: 35px; background: var(--catalog-swf-blue) !important; border: 0 !important; border-bottom: 1px solid #000 !important; } .nitro-catalog-classic-window .nitro-card-header-shell { min-height: 35px; max-height: 35px; } .nitro-catalog-classic-window .nitro-card-title { color: #ffffff; font-size: 16px; font-weight: 700; line-height: 35px; text-align: center; text-shadow: 0 1px 0 rgba(0, 0, 0, 0.8); } .nitro-catalog-classic-window .nitro-card-close-button { top: 7px !important; right: 7px !important; width: 19px !important; min-width: 19px !important; height: 20px !important; min-height: 20px !important; padding: 0 !important; background-image: url("../../assets/images/catalog/buttons/close.png") !important; background-color: transparent !important; background-position: center !important; background-repeat: no-repeat !important; background-size: 19px 20px !important; border: 0 !important; border-radius: 0 !important; box-shadow: none !important; image-rendering: pixelated !important; opacity: 1 !important; visibility: visible !important; display: block !important; } .nitro-catalog-classic-window .nitro-card-close-button:hover { background-image: url("../../assets/images/catalog/buttons/close_hover.png") !important; filter: none; } .nitro-catalog-classic-window .nitro-card-close-button:active { background-image: url("../../assets/images/catalog/buttons/close_pressed.png") !important; } .nitro-catalog-classic-mobile-header, .nitro-catalog-classic-admin-banner, .nitro-catalog-classic-layout-header-shell, .nitro-catalog-classic-layout-hero, .nitro-catalog-classic-window .nitro-catalog-header, .nitro-catalog-classic-window .builders-club-status-shell { display: none !important; } .nitro-catalog-classic-window .nitro-catalog-classic-header-publish { position: absolute !important; top: 5px !important; right: 32px !important; width: auto !important; min-width: 0 !important; height: 22px !important; padding: 0 10px !important; font-size: 10px !important; font-weight: 700 !important; letter-spacing: 0.5px !important; line-height: 22px !important; z-index: 10 !important; } .nitro-catalog-classic-window .nitro-catalog-classic-header-publish.has-pending { animation: nitroPublishPulse 1.4s ease-in-out infinite; } @keyframes nitroPublishPulse { 0%, 100% { box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.65), inset 0 -2px 0 rgba(140, 75, 0, 0.35), 0 0 0 rgba(255, 200, 0, 0); } 50% { box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.65), inset 0 -2px 0 rgba(140, 75, 0, 0.35), 0 0 8px rgba(255, 200, 0, 0.75); } } .nitro-catalog-classic-window .nitro-catalog-classic-default-admin { flex-wrap: nowrap !important; align-items: center !important; gap: 6px !important; margin-bottom: 4px !important; overflow-x: auto !important; overflow-y: visible !important; scrollbar-width: thin; } .nitro-catalog-classic-window .nitro-catalog-classic-default-admin::-webkit-scrollbar { height: 4px !important; } .nitro-catalog-classic-window .nitro-catalog-classic-default-admin button { display: inline-flex !important; align-items: center !important; gap: 4px !important; height: 22px !important; min-height: 22px !important; padding: 0 10px !important; border: 1px solid #6f8db5 !important; border-image: none !important; border-image-source: none !important; border-radius: 4px !important; background: linear-gradient(180deg, #ffffff 0%, #e7eef8 100%) !important; background-image: linear-gradient(180deg, #ffffff 0%, #e7eef8 100%) !important; color: #1a3a6b !important; font-size: 10px !important; font-weight: 600 !important; line-height: 1 !important; text-shadow: none !important; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.8), 0 1px 0 rgba(0, 0, 0, 0.12) !important; cursor: pointer !important; white-space: nowrap !important; } .nitro-catalog-classic-window .nitro-catalog-classic-default-admin button:hover { background: linear-gradient(180deg, #ffffff 0%, #d6e2f3 100%) !important; background-image: linear-gradient(180deg, #ffffff 0%, #d6e2f3 100%) !important; color: #0b2347 !important; border-color: #4a72b8 !important; } .nitro-catalog-classic-window .nitro-catalog-classic-default-admin button:active { background: linear-gradient(180deg, #d6e2f3 0%, #ffffff 100%) !important; background-image: linear-gradient(180deg, #d6e2f3 0%, #ffffff 100%) !important; box-shadow: inset 0 1px 0 rgba(0, 0, 0, 0.08), 0 0 0 rgba(0, 0, 0, 0) !important; } .nitro-catalog-classic-window .nitro-catalog-classic-default-admin button.text-success, .nitro-catalog-classic-window .nitro-catalog-classic-default-admin button[class*="success"] { border-color: #8a5b00 !important; background: linear-gradient(180deg, #ffe66b 0%, #ffc828 45%, #f0a318 100%) !important; background-image: linear-gradient(180deg, #ffe66b 0%, #ffc828 45%, #f0a318 100%) !important; color: #4a2b00 !important; text-shadow: 0 1px 0 rgba(255, 255, 255, 0.55) !important; } .nitro-catalog-classic-window .nitro-catalog-classic-default-admin button.text-success:hover, .nitro-catalog-classic-window .nitro-catalog-classic-default-admin button[class*="success"]:hover { background: linear-gradient(180deg, #fff080 0%, #ffd54d 45%, #f5ab1c 100%) !important; background-image: linear-gradient(180deg, #fff080 0%, #ffd54d 45%, #f5ab1c 100%) !important; color: #4a2b00 !important; } .nitro-catalog-classic-window .nitro-catalog-classic-default-admin button svg { width: 11px !important; height: 11px !important; fill: currentColor !important; flex-shrink: 0 !important; } .nitro-catalog-classic-window .nitro-catalog-classic-default-admin button .font-mono { color: #4a4a44 !important; font-weight: 600 !important; margin-left: 4px !important; } .nitro-catalog-classic-tabs-shell .nitro-card-tab-item.nitro-catalog-classic-admin-tab { flex: 0 0 auto !important; width: 32px !important; min-width: 32px !important; max-width: 32px !important; padding: 6px 4px 7px !important; margin-left: 4px !important; } .nitro-catalog-classic-swf-header { position: relative; flex: 0 0 90px; height: 90px; margin: 0 1px; border: 1px solid #376275; background: #0e3f52; overflow: hidden; } .nitro-catalog-classic-swf-header-bg { position: absolute; inset: 0; opacity: 0.1; background-position: center; background-repeat: no-repeat; background-size: cover; background: linear-gradient(135deg, transparent 0 46%, rgba(255, 255, 255, 0.35) 47% 49%, transparent 50%), radial-gradient(circle at 18% 28%, rgba(255, 255, 255, 0.55), transparent 18%), linear-gradient(180deg, #60a6bd, #0e3f52); filter: grayscale(1); } .nitro-catalog-classic-swf-header-icon { position: absolute; left: 24px; top: 30px; display: flex; align-items: center; justify-content: center; width: 40px; height: 35px; transform: scale(2); transform-origin: center; } .nitro-catalog-classic-swf-header-copy { position: absolute; left: 80px; top: 11px; right: 15px; color: #fff; text-shadow: 0 1px 0 rgba(0, 0, 0, 0.7); } .nitro-catalog-classic-swf-header-title { min-height: 24px; font-size: 24px; font-weight: 700; line-height: 24px; } .nitro-catalog-classic-swf-header-description { margin-top: 5px; font-size: 12px; line-height: 15px; } .nitro-catalog-classic-tabs-shell { flex: 0 0 40px; height: 40px; min-height: 40px; max-height: 40px; gap: 0; padding: 4px 6px 0 !important; align-items: flex-end; overflow-x: auto; overflow-y: hidden; flex-wrap: nowrap; scrollbar-width: thin; scrollbar-color: #8da3b3 transparent; background: var(--catalog-swf-bg) !important; border: 0 !important; border-bottom: 1px solid #c8c8bf; } .nitro-catalog-classic-tabs-shell::-webkit-scrollbar { width: 6px !important; height: 6px !important; } .nitro-catalog-classic-tabs-shell::-webkit-scrollbar-thumb { background: #8da3b3 !important; background-image: none !important; border-radius: 3px !important; box-shadow: none !important; min-height: 0 !important; } .nitro-catalog-classic-tabs-shell::-webkit-scrollbar-track { background: transparent !important; background-image: none !important; box-shadow: none !important; } .nitro-catalog-classic-tabs-shell::-webkit-scrollbar-button:single-button { display: none !important; } .nitro-catalog-classic-tabs-shell .nitro-card-tab-item { display: inline-flex; align-items: center; justify-content: center; gap: 4px; height: 36px; min-width: 0; flex: 1 1 0; max-width: none; padding: 6px 6px 7px; margin: 0 2px 0 0; flex-shrink: 1; border: 1px solid #000 !important; border-bottom: 0 !important; border-radius: 6px 6px 0 0 !important; background: linear-gradient(180deg, #d6d6cc 0%, #c1c1b7 100%) !important; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.55), inset 0 -1px 0 rgba(0, 0, 0, 0.18) !important; color: #2a2a2a !important; font-size: 12px; font-weight: 400; white-space: nowrap; overflow: hidden; border-image-source: none !important; } .nitro-catalog-classic-tabs-shell .nitro-card-tab-item:last-of-type { margin-right: 0; } .nitro-catalog-classic-tabs-shell .nitro-card-tab-item > div { align-items: center !important; justify-content: center !important; gap: 4px; min-width: 0; width: auto; height: 20px; line-height: 17px; } .nitro-catalog-classic-tab-icon { width: 18px; height: 18px; object-fit: contain; image-rendering: pixelated; flex-shrink: 0; } .nitro-catalog-classic-tabs-shell .nitro-card-tab-item:hover { background: linear-gradient(180deg, #e3e3d9 0%, #d0d0c5 100%) !important; color: #000 !important; } .nitro-catalog-classic-tabs-shell .nitro-card-tab-item-active { z-index: 2; background: linear-gradient(180deg, #4fb3ff 0%, var(--catalog-swf-blue) 100%) !important; color: #ffffff !important; font-weight: 700; text-shadow: 0 1px 0 rgba(0, 0, 0, 0.35); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.55), inset 0 -2px 0 var(--catalog-swf-blue-dark) !important; } .nitro-catalog-classic-tab-label { min-width: 0; overflow: hidden; text-overflow: ellipsis; } .nitro-catalog-classic-content-shell { position: relative; flex: 1 1 auto; min-height: 0; padding: 6px 8px 8px !important; background: var(--catalog-swf-bg) !important; overflow: hidden; } .nitro-catalog-classic-stage { display: grid; grid-template-columns: 184px 1fr; gap: 8px; width: 100%; height: 100%; min-height: 0; } .nitro-catalog-classic-stage.is-navigation-hidden { grid-template-columns: 1fr; } .nitro-catalog-classic-sidebar { display: flex; flex-direction: column; gap: 4px; min-height: 0; overflow: hidden; } .nitro-catalog-classic-search-shell { position: relative; display: flex; align-items: center; height: 24px; padding: 0; margin: -2px -1px 0 -1px; border: 1px solid #b7b7ae; border-radius: 3px; background: #f7f7f2; } .nitro-catalog-classic-search-shell input { flex: 1 1 auto; width: 100% !important; height: 22px !important; min-height: 22px !important; line-height: 22px !important; padding: 0 16px 0 18px !important; border: 0 !important; border-radius: 0 !important; background: transparent !important; color: var(--catalog-swf-muted) !important; font-size: 11px !important; box-shadow: none !important; vertical-align: middle !important; } .nitro-catalog-classic-search-shell > div { width: 100% !important; height: 100% !important; } .nitro-catalog-classic-search-shell svg { color: #888 !important; font-size: 11px !important; } .nitro-catalog-classic-search-shell svg:first-child { left: 4px !important; } .nitro-catalog-classic-search-shell button { right: 4px !important; } .nitro-catalog-classic-navigation-shell { flex: 1 1 auto; min-height: 0; padding: 5px 3px; border: 1px solid #b4b4ae; border-radius: 3px; background: rgba(236, 236, 228, 0.5); overflow: auto; } .nitro-catalog-classic-navigation-list { display: flex; flex-direction: column; } .nitro-catalog-classic-navigation-node { min-height: 21px; } .nitro-catalog-classic-navigation-item { position: relative; display: flex; align-items: center; gap: 6px; height: 21px; min-height: 21px; padding: 1px 18px 1px 0; border: 0 !important; border-radius: 0 !important; background: transparent; color: var(--catalog-swf-muted); font-size: 11px; font-weight: 700; line-height: 17px; cursor: pointer; text-shadow: 0 1px 0 #b4b4ae; } .nitro-catalog-classic-navigation-node.is-child .nitro-catalog-classic-navigation-item { padding-left: 15px; color: #52819a; font-style: italic; } .nitro-catalog-classic-navigation-item::before { position: absolute; inset: 0 1px 1px 1px; z-index: 0; display: none; content: ""; border: 1px solid var(--catalog-swf-select-outer); background: linear-gradient(180deg, var(--catalog-swf-select-outer) 0 2px, var(--catalog-swf-select) 2px calc(100% - 2px), var(--catalog-swf-select-outer) calc(100% - 2px)); } .nitro-catalog-classic-window .builders-club-card-header ~ .nitro-catalog-classic-tabs-shell, .nitro-catalog-classic-window:has(.builders-club-card-header) .nitro-catalog-classic-navigation-item::before { --catalog-swf-select: var(--catalog-swf-bc); --catalog-swf-select-outer: var(--catalog-swf-bc-outer); } .nitro-catalog-classic-navigation-item:hover::before, .nitro-catalog-classic-navigation-item.is-active::before { display: block; } .nitro-catalog-classic-navigation-icon, .nitro-catalog-classic-navigation-label, .nitro-catalog-classic-navigation-caret, .nitro-catalog-classic-navigation-favorite, .nitro-catalog-classic-navigation-admin, .nitro-catalog-classic-navigation-drag { position: relative; z-index: 1; } .nitro-catalog-classic-navigation-icon { display: flex; align-items: center; justify-content: center; width: 20px; min-width: 20px; height: 20px; } .nitro-catalog-classic-navigation-icon img, .nitro-catalog-classic-navigation-icon canvas { width: auto; height: auto; max-width: 20px; max-height: 20px; } .nitro-catalog-classic-navigation-label { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .nitro-catalog-classic-navigation-caret { position: absolute; right: 5px; top: 5px; color: #777 !important; font-size: 9px; } .nitro-catalog-classic-layout-shell { display: flex; flex-direction: column; min-width: 0; min-height: 0; height: 100%; background: transparent; border: 0; overflow: hidden; } .nitro-catalog-classic-layout-container { flex: 1 1 auto; min-height: 0; padding: 0; background: transparent; overflow: hidden; } .nitro-catalog-classic-window .nitro-catalog-forum-text { scrollbar-width: none !important; font-size: 12px; line-height: 15px; } .nitro-catalog-classic-window .nitro-catalog-forum-text::-webkit-scrollbar { width: 0 !important; height: 0 !important; display: none !important; } .nitro-catalog-classic-window .nitro-catalog-forum-text p, .nitro-catalog-classic-window .nitro-catalog-forum-text div { margin: 0 0 8px; } .nitro-catalog-classic-window .nitro-catalog-forum-text > :last-child { margin-bottom: 0; } .nitro-catalog-classic-window .nitro-catalog-guild-join-btn { min-height: 20px !important; width: auto !important; padding: 1px 10px !important; border: 1px solid #1c1c1c !important; border-radius: 5px !important; background: linear-gradient(180deg, #ffffff 0%, #eaeaea 55%, #d8d8d8 100%) !important; box-shadow: inset 0 1px 0 #ffffff !important; color: #000 !important; font-size: 11px !important; font-weight: 400 !important; text-shadow: none !important; } .nitro-catalog-classic-window .nitro-catalog-guild-join-btn:hover { background: linear-gradient(180deg, #ffffff 0%, #f2f2f2 55%, #e2e2e2 100%) !important; } .nitro-catalog-classic-window .nitro-catalog-guild-join-btn:active { background: linear-gradient(180deg, #d8d8d8 0%, #eaeaea 100%) !important; box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.2) !important; } .nitro-catalog-classic-default-layout { position: relative; display: block !important; width: 100%; height: 100%; min-height: 460px; } .nitro-catalog-classic-product-view, .nitro-catalog-classic-grid-shell, .nitro-catalog-classic-price-row, .nitro-catalog-classic-purchase-row { width: 100% !important; } .nitro-catalog-classic-product-view { width: calc(100% + 3px) !important; } .nitro-catalog-classic-product-view, .nitro-catalog-classic-grid-shell { border: 1px solid #b4b4ae; border-radius: 5px; background: var(--catalog-swf-panel); } .nitro-catalog-classic-product-view { position: relative; top: 0; left: 0; width: 363px; height: 240px; min-height: 0; overflow: hidden; } .nitro-catalog-classic-product-view::before { display: none; } .nitro-catalog-classic-offer-panel { position: relative; z-index: 1; width: 100%; height: 100%; } .nitro-catalog-classic-offer-panel:has(> .nitro-catalog-classic-offer-info) { justify-content: center; } .nitro-catalog-classic-offer-preview { position: relative; height: 100%; padding: 0; overflow: hidden; background: #000; } .nitro-catalog-classic-offer-panel > .nitro-catalog-classic-offer-preview { width: 360px; min-width: 360px; } .nitro-catalog-classic-preview-title { position: absolute; top: 12px; left: 12px; z-index: 5; color: #ffffff !important; font-size: 12px !important; font-weight: 700 !important; line-height: 15px !important; text-shadow: 0 1px 0 #000; } .nitro-catalog-classic-offer-preview .shadow-room-previewer, .nitro-catalog-classic-offer-preview canvas, .nitro-catalog-classic-offer-preview img { width: 100% !important; height: 100% !important; max-width: 100%; max-height: 100%; object-fit: contain; border-radius: 0 !important; box-shadow: none !important; background-position: center bottom !important; background-repeat: no-repeat !important; background-size: contain !important; } .nitro-catalog-classic-offer-info { display: none !important; } .nitro-catalog-classic-offer-info .nitro-text, .nitro-catalog-classic-offer-info span, .nitro-catalog-classic-offer-info div { color: inherit; } .nitro-catalog-classic-welcome { position: relative; z-index: 1; width: 100%; height: 100%; padding: 18px; color: var(--catalog-swf-muted); } .nitro-catalog-classic-welcome img { width: auto !important; height: auto !important; max-width: 96px; max-height: 120px; border: 0; background: transparent; } .nitro-catalog-classic-grid-shell { position: absolute; left: 0; top: 245px; bottom: 68px; width: 360px; min-height: 0; padding: 3px 2px 3px 4px; overflow: auto; } .nitro-catalog-classic-default-layout:has(.nitro-catalog-classic-default-admin) .nitro-catalog-classic-grid-shell { top: 280px !important; } .nitro-catalog-classic-grid { grid-template-columns: repeat(6, 1fr) !important; grid-auto-rows: var(--nitro-grid-column-min-height, 70px); align-content: start; justify-content: start; gap: 3px !important; overflow: visible !important; } @layer utilities { .nitro-catalog-classic-window .layout-grid-item { width: 100% !important; height: var(--nitro-grid-column-min-height, 70px) !important; min-width: 0 !important; min-height: var(--nitro-grid-column-min-height, 70px) !important; border: 0 !important; border-radius: 0 !important; background-image: none !important; box-shadow: none !important; overflow: visible !important; } .nitro-catalog-classic-window .layout-grid-item:not(.has-highlight) { background-color: #e4e7df !important; border: 2px solid transparent !important; border-radius: 4px !important; box-shadow: none !important; } .nitro-catalog-classic-window .nitro-catalog-classic-pet-breeds .layout-grid-item { width: 84px !important; min-width: 84px !important; height: 74px !important; min-height: 74px !important; } .nitro-catalog-classic-window .layout-grid-item:not(.has-highlight):not(.is-active):hover { background-image: none !important; border-color: transparent !important; box-shadow: none !important; } .nitro-catalog-classic-window .layout-grid-item.is-active { background-color: #ffffff !important; background-image: none !important; border: 2px solid #62c4e8 !important; box-shadow: none !important; } } .nitro-catalog-classic-window .layout-grid-item.has-highlight { width: 26px !important; height: 26px !important; min-width: 26px !important; min-height: 26px !important; margin: 1px !important; border: 1px solid #2a2a2a !important; border-radius: 2px !important; box-shadow: inset 1px 1px 0 rgba(255, 255, 255, 0.35), inset -1px -1px 0 rgba(0, 0, 0, 0.18) !important; cursor: pointer !important; } .nitro-catalog-classic-window .layout-grid-item.has-highlight:hover { border-color: #000 !important; box-shadow: inset 1px 1px 0 rgba(255, 255, 255, 0.5), inset -1px -1px 0 rgba(0, 0, 0, 0.25), 0 0 0 1px rgba(0, 0, 0, 0.45) !important; } .nitro-catalog-classic-window .layout-grid-item.has-highlight.is-active { border-color: #000 !important; box-shadow: inset 0 0 0 2px #ffffff, inset 0 0 0 3px #000, 0 0 0 1px #63c5e9 !important; } .nitro-catalog-classic-grid-offer-icon { width: auto !important; height: auto !important; image-rendering: pixelated; object-fit: contain; pointer-events: none; } .nitro-catalog-classic-grid-price { display: flex; flex-direction: row; align-items: center; justify-content: flex-end; gap: 3px; width: 100%; padding-right: 4px; color: #000; font-size: 11px; font-weight: 700; line-height: 12px; pointer-events: none; text-shadow: 0 1px 0 rgba(255, 255, 255, 0.75); } .nitro-catalog-classic-grid .layout-grid-item:has(.avatar-image) .nitro-catalog-classic-grid-price, .nitro-catalog-classic-grid .layout-grid-item:has(> .avatar-image) > .nitro-catalog-classic-grid-price, .nitro-catalog-classic-grid .avatar-image ~ .nitro-catalog-classic-grid-price { top: auto !important; left: 50% !important; right: auto !important; bottom: 4px !important; transform: translateX(-50%) !important; width: auto !important; background: rgba(255, 255, 255, 0.85) !important; border-radius: 3px !important; padding: 2px 6px !important; min-height: 0 !important; height: auto !important; display: inline-flex !important; flex-direction: row !important; align-items: center !important; justify-content: center !important; z-index: 5 !important; } .nitro-catalog-classic-grid .layout-grid-item:has(.avatar-image) .nitro-catalog-classic-grid-price-entry, .nitro-catalog-classic-grid .avatar-image ~ .nitro-catalog-classic-grid-price .nitro-catalog-classic-grid-price-entry { height: auto !important; line-height: 1 !important; align-items: center !important; justify-content: center !important; gap: 3px !important; } .nitro-catalog-classic-grid .layout-grid-item:has(.avatar-image) .nitro-catalog-classic-grid-price-currency, .nitro-catalog-classic-grid .avatar-image ~ .nitro-catalog-classic-grid-price .nitro-catalog-classic-grid-price-currency { width: 13px !important; height: 13px !important; object-fit: contain !important; vertical-align: middle !important; display: inline-block !important; } .nitro-catalog-classic-grid-price.is-single-price { height: auto; min-height: 0; } .nitro-catalog-classic-grid-price.is-multi-price { height: auto; min-height: 0; flex-direction: column; align-items: flex-end; row-gap: 1px; } .nitro-catalog-classic-grid-price-entry { display: inline-flex; align-items: center; justify-content: center; gap: 3px; height: 13px; white-space: nowrap; } .nitro-catalog-classic-grid-price-plus { padding-right: 1px; } .nitro-catalog-classic-grid-price-currency { width: auto !important; height: auto !important; max-width: none !important; max-height: none !important; min-width: 0 !important; min-height: 0 !important; object-fit: none !important; } .nitro-catalog-classic-price-row { position: absolute; left: 0; bottom: 38px; width: 360px; height: 25px; padding: 0; overflow: visible; } .nitro-catalog-classic-spinner-slot { position: absolute; left: 0; top: 0; width: 200px; height: 25px; } .nitro-catalog-classic-total-price-slot { position: absolute; right: 2px; top: 0; width: auto; min-width: 180px; height: 25px; display: flex; align-items: center; justify-content: flex-end; gap: 8px; padding-right: 2px; } .nitro-catalog-classic-total-price-label { color: #666; font-size: 11px; line-height: 17px; } .nitro-catalog-classic-purchase-row { position: absolute; left: 0; bottom: 4px; width: 360px; height: 30px; padding: 0; overflow: hidden; } .nitro-catalog-classic-offer-actions { display: flex !important; flex-direction: row; align-items: flex-start; justify-content: space-between; gap: 10px !important; width: auto; height: 24px; margin-left: 15px; margin-right: 15px; padding: 0; } .nitro-catalog-classic-window .nitro-catalog-swf-button, .nitro-catalog-classic-window button.nitro-catalog-swf-spinner-button, .nitro-catalog-classic-window button.nitro-catalog-classic-preview-btn { display: inline-flex !important; align-items: center !important; justify-content: center !important; min-height: 22px; padding: 2px 12px !important; border: 3px solid transparent !important; border-radius: 0 !important; border-image-source: var(--habbo-slice-button-default) !important; border-image-slice: 3 3 3 3 fill !important; border-image-width: 3px !important; border-image-repeat: stretch !important; background: transparent !important; background-color: transparent !important; background-image: none !important; color: #222 !important; font-size: 11px !important; font-weight: 700 !important; text-shadow: 0 1px 0 rgba(255, 255, 255, 0.7); box-shadow: none !important; transition: none !important; } .nitro-catalog-classic-window button.nitro-catalog-classic-preview-btn, .nitro-catalog-classic-window button.nitro-catalog-classic-preview-btn *, .nitro-catalog-classic-window button.nitro-catalog-classic-preview-btn svg { border-radius: 0 !important; box-shadow: none !important; } .nitro-catalog-classic-window .nitro-catalog-swf-button:hover, .nitro-catalog-classic-window button.nitro-catalog-swf-spinner-button:hover, .nitro-catalog-classic-window button.nitro-catalog-classic-preview-btn:hover { border-image-source: var(--habbo-slice-button-hover) !important; } .nitro-catalog-classic-window .nitro-catalog-swf-button:active, .nitro-catalog-classic-window button.nitro-catalog-swf-spinner-button:active, .nitro-catalog-classic-window button.nitro-catalog-classic-preview-btn:active { border-image-source: var(--habbo-slice-button-pressed) !important; } .nitro-catalog-classic-window .nitro-catalog-swf-button.pointer-events-none, .nitro-catalog-classic-window button.nitro-catalog-swf-spinner-button:disabled, .nitro-catalog-classic-window button.nitro-catalog-classic-preview-btn:disabled { border-image-source: var(--habbo-slice-button-disabled) !important; color: #888 !important; opacity: 1 !important; } .nitro-catalog-classic-window .nitro-catalog-swf-buy-button { width: 160px !important; min-width: 160px !important; height: 24px !important; padding: 0 8px !important; border: 1px solid #000 !important; border-radius: 4px !important; border-image: none !important; border-image-source: none !important; background: linear-gradient(180deg, #ffe66b 0%, #ffc828 45%, #f0a318 100%) !important; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.65), inset 0 -2px 0 rgba(140, 75, 0, 0.35) !important; color: #4a2b00 !important; text-shadow: 0 1px 0 rgba(255, 255, 255, 0.55) !important; font-weight: 700 !important; } .nitro-catalog-classic-window .nitro-catalog-swf-buy-button:hover { background: linear-gradient(180deg, #fff080 0%, #ffd54d 45%, #f5ab1c 100%) !important; filter: brightness(1.04); } .nitro-catalog-classic-window .nitro-catalog-swf-buy-button:active { background: linear-gradient(180deg, #f0a318 0%, #d98c0a 100%) !important; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25), inset 0 2px 0 rgba(140, 75, 0, 0.45) !important; } .nitro-catalog-classic-window .nitro-catalog-swf-buy-button.pointer-events-none, .nitro-catalog-classic-window .nitro-catalog-swf-buy-button:disabled { background: linear-gradient(180deg, #ffe66b 0%, #ffc828 45%, #f0a318 100%) !important; color: #4a2b00 !important; text-shadow: 0 1px 0 rgba(255, 255, 255, 0.55) !important; opacity: 0.55 !important; cursor: not-allowed !important; } .nitro-catalog-classic-window .nitro-catalog-swf-confirm-button { width: 160px !important; min-width: 160px !important; height: 24px !important; padding: 0 8px !important; border: 1px solid #000 !important; border-radius: 4px !important; border-image: none !important; border-image-source: none !important; background: linear-gradient(180deg, #b6e86b 0%, #7fc828 45%, #4f9a18 100%) !important; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.6), inset 0 -2px 0 rgba(40, 80, 0, 0.35) !important; color: #1f3d00 !important; text-shadow: 0 1px 0 rgba(255, 255, 255, 0.45) !important; font-weight: 700 !important; } .nitro-catalog-classic-window .nitro-catalog-swf-confirm-button:hover { background: linear-gradient(180deg, #c6f580 0%, #8fd836 45%, #57a81c 100%) !important; filter: brightness(1.04); } .nitro-catalog-classic-window .nitro-catalog-swf-confirm-button:active { background: linear-gradient(180deg, #4f9a18 0%, #3d7a0a 100%) !important; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25), inset 0 2px 0 rgba(40, 80, 0, 0.45) !important; } .nitro-catalog-classic-window .nitro-catalog-swf-gift-button { width: 160px !important; min-width: 160px !important; height: 22px !important; padding: 0 8px !important; border: 1px solid #000 !important; border-radius: 4px !important; border-image: none !important; border-image-source: none !important; background: linear-gradient(180deg, #ececec 0%, #cfcfc4 100%) !important; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.7), inset 0 -1px 0 rgba(0, 0, 0, 0.18) !important; color: #2a2a2a !important; text-shadow: 0 1px 0 rgba(255, 255, 255, 0.55) !important; font-weight: 700 !important; } .nitro-catalog-classic-window .nitro-catalog-swf-gift-button:hover { background: linear-gradient(180deg, #f4f4ed 0%, #dcdcd0 100%) !important; filter: brightness(1.02); } .nitro-catalog-classic-window .nitro-catalog-swf-gift-button:active { background: linear-gradient(180deg, #c0c0b6 0%, #aaaaa0 100%) !important; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), inset 0 2px 0 rgba(0, 0, 0, 0.25) !important; } .nitro-catalog-classic-window .nitro-catalog-swf-gift-button.pointer-events-none, .nitro-catalog-classic-window .nitro-catalog-swf-gift-button:disabled { background: linear-gradient(180deg, #e3e3dc 0%, #c5c5bb 100%) !important; color: #6a6a64 !important; text-shadow: none !important; } .nitro-catalog-classic-pet-card .nitro-catalog-swf-buy-button { width: auto !important; min-width: 0 !important; padding: 0 14px !important; } .nitro-catalog-classic-window .layout-grid, .nitro-catalog-classic-window [class*="grid-cols-["] { overflow-x: hidden !important; } .nitro-catalog-swf-spinner { display: flex; align-items: center; gap: 5px; height: 25px; color: #666; font-size: 11px; } .nitro-catalog-swf-spinner-label { max-width: 62px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; } .nitro-catalog-swf-spinner-control { display: grid; grid-template-columns: 22px 34px 22px; align-items: center; height: 25px; gap: 2px; } .nitro-catalog-classic-window button.nitro-catalog-swf-spinner-button { width: 22px !important; min-width: 22px !important; height: 22px !important; min-height: 22px !important; padding: 0 !important; border: 0 !important; border-radius: 0 !important; border-image: none !important; background-color: transparent !important; background-repeat: no-repeat !important; background-position: center center !important; background-size: auto !important; box-shadow: none !important; image-rendering: pixelated !important; } .nitro-catalog-classic-window button.nitro-catalog-swf-spinner-button svg { display: none !important; } .nitro-catalog-classic-window button.nitro-catalog-swf-spinner-button-less { background-image: var(--habbo-stepper-minus) !important; } .nitro-catalog-classic-window button.nitro-catalog-swf-spinner-button-less:hover { background-image: var(--habbo-stepper-minus-hover) !important; } .nitro-catalog-classic-window button.nitro-catalog-swf-spinner-button-less:active { background-image: var(--habbo-stepper-minus-pressed) !important; } .nitro-catalog-classic-window button.nitro-catalog-swf-spinner-button-less:disabled { background-image: var(--habbo-stepper-minus-disabled) !important; } .nitro-catalog-classic-window button.nitro-catalog-swf-spinner-button-more { background-image: var(--habbo-stepper-plus) !important; } .nitro-catalog-classic-window button.nitro-catalog-swf-spinner-button-more:hover { background-image: var(--habbo-stepper-plus-hover) !important; } .nitro-catalog-classic-window button.nitro-catalog-swf-spinner-button-more:active { background-image: var(--habbo-stepper-plus-pressed) !important; } .nitro-catalog-classic-window button.nitro-catalog-swf-spinner-button-more:disabled { background-image: var(--habbo-stepper-plus-disabled) !important; } .nitro-catalog-swf-spinner-input { width: 30px !important; height: 25px !important; padding: 4px 2px !important; border: 1px solid #9d9d96 !important; border-radius: 0 !important; background: #fff !important; color: #222 !important; font-size: 11px !important; font-weight: 700 !important; line-height: 15px !important; text-align: center !important; outline: none !important; appearance: textfield; } .nitro-catalog-swf-spinner-input::-webkit-outer-spin-button, .nitro-catalog-swf-spinner-input::-webkit-inner-spin-button { appearance: none; margin: 0; } .nitro-catalog-swf-price-display { display: flex; align-items: center; justify-content: flex-start; gap: 3px; min-height: 24px; color: #222; font-size: 11px; } .nitro-catalog-swf-price-pill { display: inline-flex; align-items: center; gap: 2px; height: 22px; min-width: 34px; padding: 0 2px; border: 0 !important; border-radius: 0 !important; background: transparent !important; } .nitro-catalog-swf-price-text { color: #222 !important; font-size: 11px !important; font-weight: 700 !important; line-height: 17px !important; } .nitro-catalog-classic-window .nitro-catalog-preview-price .nitro-catalog-swf-price-text { color: #ffffff !important; text-shadow: 0 0 2px #000, 1px 1px 1px #000, -1px 1px 1px #000, 1px -1px 1px #000, -1px -1px 1px #000 !important; } .nitro-catalog-swf-price-plus { width: 7px; height: 7px; color: #666; } .nitro-catalog-classic-preview-btn { position: absolute; z-index: 4; width: 25px; height: 24px; min-width: 25px; padding: 0 !important; overflow: hidden; font-size: 14px !important; line-height: 1 !important; display: inline-flex !important; align-items: center !important; justify-content: center !important; } .nitro-catalog-classic-preview-btn svg { width: 14px !important; height: 14px !important; color: #111 !important; fill: #111 !important; flex-shrink: 0 !important; display: block !important; } .nitro-catalog-classic-preview-rotate { top: 8px; right: 35px; } .nitro-catalog-classic-preview-state { top: 8px; right: 6px; } .nitro-catalog-classic-window button.nitro-catalog-classic-preview-btn { width: 28px !important; height: 26px !important; min-width: 28px !important; min-height: 26px !important; padding: 0 !important; border: 1px solid #2a2a2a !important; border-image: none !important; border-image-source: none !important; border-radius: 3px !important; background: linear-gradient(180deg, #f6f6f0 0%, #d3d3c8 100%) !important; background-color: #ecece4 !important; background-image: linear-gradient(180deg, #f6f6f0 0%, #d3d3c8 100%) !important; box-shadow: inset 1px 1px 0 rgba(255, 255, 255, 0.7), 0 1px 0 rgba(0, 0, 0, 0.35) !important; z-index: 10 !important; } .nitro-catalog-classic-window button.nitro-catalog-classic-preview-btn:hover { background: linear-gradient(180deg, #ffffff 0%, #dedeD2 100%) !important; background-image: linear-gradient(180deg, #ffffff 0%, #dedeD2 100%) !important; border-color: #000 !important; } .nitro-catalog-classic-window button.nitro-catalog-classic-preview-btn:active { background: linear-gradient(180deg, #d3d3c8 0%, #f6f6f0 100%) !important; background-image: linear-gradient(180deg, #d3d3c8 0%, #f6f6f0 100%) !important; box-shadow: inset 1px 1px 0 rgba(0, 0, 0, 0.18) !important; } .nitro-catalog-classic-window .nitro-catalog-classic-navigation-shell::-webkit-scrollbar, .nitro-catalog-classic-window .nitro-catalog-classic-navigation-list::-webkit-scrollbar, .nitro-catalog-classic-window .nitro-catalog-classic-grid-shell::-webkit-scrollbar, .nitro-catalog-classic-window .nitro-catalog-classic-grid::-webkit-scrollbar, .nitro-catalog-classic-window .nitro-catalog-classic-layout-container::-webkit-scrollbar { width: 18px; height: 18px; } .nitro-catalog-classic-window * { scrollbar-color: auto !important; scrollbar-width: auto; } .nitro-catalog-classic-window *::-webkit-scrollbar { width: 18px !important; height: 18px !important; background-color: #bdbbb3 !important; } .nitro-catalog-classic-window *::-webkit-scrollbar-track { background-image: none !important; background-color: #bdbbb3 !important; box-shadow: inset 1px 0 0 #000000 !important; border: 0 !important; } .nitro-catalog-classic-window *::-webkit-scrollbar-thumb { min-height: 24px !important; background: url("data:image/svg+xml;utf8,") center top / 8px 5px repeat-y, #d9d9d9 !important; border: 1px solid #000000 !important; border-radius: 3px !important; box-shadow: inset 0 0 0 2px #ffffff !important; } .nitro-catalog-classic-window *::-webkit-scrollbar-thumb:hover { background: url("data:image/svg+xml;utf8,") center top / 8px 5px repeat-y, #e3e3e3 !important; } .nitro-catalog-classic-window *::-webkit-scrollbar-thumb:active { background: url("data:image/svg+xml;utf8,") center top / 8px 5px repeat-y, #bcbcbc !important; } .nitro-catalog-classic-window *::-webkit-scrollbar-button:single-button:vertical:decrement { display: block !important; width: 18px !important; height: 18px !important; background: url("data:image/svg+xml;utf8,") center center / 9px 6px no-repeat, #d9d9d9 !important; border: 1px solid #000000 !important; border-radius: 3px 3px 0 0 !important; box-shadow: inset 0 1px 0 #ffffff, inset 1px 0 0 rgba(255, 255, 255, 0.6) !important; } .nitro-catalog-classic-window *::-webkit-scrollbar-button:single-button:vertical:decrement:active { background: url("data:image/svg+xml;utf8,") center center / 9px 6px no-repeat, #bcbcbc !important; } .nitro-catalog-classic-window *::-webkit-scrollbar-button:single-button:vertical:increment { display: block !important; width: 18px !important; height: 18px !important; background: url("data:image/svg+xml;utf8,") center center / 9px 6px no-repeat, #d9d9d9 !important; border: 1px solid #000000 !important; border-radius: 0 0 3px 3px !important; box-shadow: inset 0 1px 0 #ffffff, inset 1px 0 0 rgba(255, 255, 255, 0.6) !important; } .nitro-catalog-classic-window *::-webkit-scrollbar-button:single-button:vertical:increment:active { background: url("data:image/svg+xml;utf8,") center center / 9px 6px no-repeat, #bcbcbc !important; } .nitro-catalog-classic-window *::-webkit-scrollbar-button:single-button:horizontal:decrement { display: block !important; width: 18px !important; height: 18px !important; background: url("data:image/svg+xml;utf8,") center center / 6px 9px no-repeat, #d9d9d9 !important; border: 1px solid #000000 !important; border-radius: 3px 0 0 3px !important; box-shadow: inset 0 1px 0 #ffffff, inset 1px 0 0 rgba(255, 255, 255, 0.6) !important; } .nitro-catalog-classic-window *::-webkit-scrollbar-button:single-button:horizontal:decrement:active { background: url("data:image/svg+xml;utf8,") center center / 6px 9px no-repeat, #bcbcbc !important; } .nitro-catalog-classic-window *::-webkit-scrollbar-button:single-button:horizontal:increment { display: block !important; width: 18px !important; height: 18px !important; background: url("data:image/svg+xml;utf8,") center center / 6px 9px no-repeat, #d9d9d9 !important; border: 1px solid #000000 !important; border-radius: 0 3px 3px 0 !important; box-shadow: inset 0 1px 0 #ffffff, inset 1px 0 0 rgba(255, 255, 255, 0.6) !important; } .nitro-catalog-classic-window *::-webkit-scrollbar-button:single-button:horizontal:increment:active { background: url("data:image/svg+xml;utf8,") center center / 6px 9px no-repeat, #bcbcbc !important; } .nitro-catalog-classic-breadcrumb { display: none; } @media (max-width: 640px), (orientation: landscape) and (max-height: 520px) { .nitro-catalog-classic-window { width: 100vw !important; min-width: 0 !important; max-width: 100vw !important; height: 100vh !important; min-height: 0 !important; max-height: 100vh !important; border-radius: 0 !important; } .draggable-window:has(> .nitro-catalog-classic-window) { transform: none !important; left: 0 !important; top: 0 !important; } .nitro-catalog-classic-tabs-shell { overflow-x: auto; overflow-y: hidden; } .nitro-catalog-classic-content-shell { padding: 6px !important; overflow-x: hidden !important; overflow-y: auto !important; } .nitro-catalog-classic-welcome { display: none !important; } .nitro-catalog-classic-product-view:has(> .nitro-catalog-classic-welcome) { display: none !important; } .nitro-catalog-classic-stage, .nitro-catalog-classic-stage.is-navigation-hidden { display: flex; flex-direction: column; gap: 8px; width: 100%; height: auto; min-height: 0; } .nitro-catalog-classic-sidebar { flex: 0 0 auto; max-height: 30vh; } .nitro-catalog-classic-layout-shell { flex: 0 0 auto; width: 100%; height: auto; min-height: 0; overflow: visible; } .nitro-catalog-classic-layout-container { flex: 0 0 auto; height: auto; min-height: 460px; overflow: visible; } .nitro-catalog-classic-default-layout { width: 100%; height: 460px; min-height: 460px; overflow: visible; } .nitro-catalog-classic-grid { grid-template-columns: repeat(auto-fill, minmax(47px, 47px)) !important; } }