.UserBackground body { background-size: contain; background-repeat: no-repeat; background-position: center; } #rl-left, #rl-right { position: absolute; top: 0; right: 0; bottom: 0; left: 0; padding: 0; margin: 0; border: 0; z-index: 0; } #rl-left { overflow: auto; padding-top: 50px + @rlLowMargin + 10px; width: @rlLeftWidth; nav { a { color: var(--settings-menu-color, #333); cursor: pointer; display: block; font-size: 18px; line-height: 30px; padding: 4px 10px; text-decoration: none; } a:focus, a:hover { background-color: var(--settings-menu-hover-bg-color, #333); color: var(--settings-menu-hover-color, #eee); } a.selected { background-color: var(--settings-menu-selected-bg-color, #333); color: var(--settings-menu-selected-color, #eee); } } } #rl-right { z-index: 1; left: @rlLeftWidth; } #V-AdminPane { height: 100%; .b-toolbar { position: absolute; top: 0; right: 0; left: 0; height: 34px; padding: 8px @rlLowMargin 8px 0; color: #fff; text-shadow: 0 1px 1px #000; display: flex; h4 { flex-grow: 1; } } } .btn.btn-logout { padding-left: 12px; padding-right: 12px; } #rl-settings-subscreen { margin: (50px + @rlLowMargin) @rlLowMargin @rlLowMargin 0; overflow-y: auto; padding: 20px; box-sizing: border-box; height: calc(100% - 50px - @rlLowMargin - @rlLowMargin); background-color: #fff; border: 1px solid @rlMainDarkColor; box-shadow: @rlMainShadow; border-radius: @rlMainBorderRadius; } /* desktop */ @media screen and (min-width: 1000px) { .toggleLeft { display: none; } } /* desktop-large */ @media screen and (min-width: 1401px) { #rl-left { width: @rlLeftWidth + 20; } #rl-right { left: @rlLeftWidth + 20; } } /* mobile and tablet */ @media screen and (max-width: 999px) { #rl-settings-subscreen { padding: 10px; } html:not(.rl-left-panel-disabled) #rl-right { right: 5-@rlLeftWidth; } html.rl-left-panel-disabled { #rl-left { width: 0 !important; } #rl-right { left: 5px !important; } } }