AlchemyCMS/alchemy_cms

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;
  }
}