alchemy-overlay { visibility: hidden; position: fixed; left: 0; top: 0; width: 100%; height: 100%; z-index: 400000; background-color: transparent; transition: all $transition-duration $transition-easing; transition-delay: 0; &.visible { visibility: visible; transition-delay: 300ms; transition-property: background-color; background-color: rgba(229, 229, 229, 0.2); } } div#overlay_text_box { color: #333333; font-size: 1.5em; left: 50%; line-height: 120px; margin-left: -100px; margin-top: -25px; position: absolute; text-align: center; top: 50%; width: 200px; img { position: relative; top: 9px; } } #logout { position: absolute; z-index: 1; bottom: 0; left: 0; width: 100%; margin-bottom: 0; &:not(:hover) { background-color: $main-menu-bg-color; } } #header { display: flex; height: $header-height; background: $header-background; border-bottom: $default-border; position: relative; a:hover { text-decoration: none; } .page_status_and_name { align-items: center; padding: $default-padding 2 * $default-padding; background-color: $medium-gray; text-shadow: $text-shadow-light; @extend .disable-user-select; @extend .locked_page; cursor: default; border-bottom-color: $toolbar-bg-color; } .page_name { margin-right: $default-margin; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } } #main_content { padding-top: 84px; padding-right: 8px; padding-bottom: 8px; padding-left: $collapsed-main-menu-width + 8px; z-index: 0; width: 100%; height: 100%; @media screen and (min-width: $large-screen-break-point) { padding-left: $main-menu-width + 8px; } } #user_info { display: flex; align-items: center; height: $header-height; padding-left: 2 * $default-padding; margin-left: auto; border-bottom: $default-border; background-color: $header-background; select { background-color: transparent; border: none; border-radius: 0; border-left: $default-border; } .current-user-name { padding-right: 2 * $default-padding; } }