.page_container {
  padding-left: 0.65cqw;

  > .options_bar {
    transform: translate(-50%, -50%) scale(calc(0.65 / var(--cqw_px_ratio)));
    transform-origin: center;
    left: 78.8cqw;
    top: 44.1cqw;
    right: auto;
    bottom: auto;
    z-index: 2;
  }
}

#start_menu {
  --menu_width: 160px;
  --item_height: 120px;

  position: absolute;
  top: 0px;
  left: calc(0.65 * 492cqw * var(--cqw_px));
  transform: scale(calc(0.65 / var(--cqw_px_ratio)));
  transform-origin: 0 0;
  width: var(--menu_width);
  z-index: 2;

  > .background,
  > .content {
    width: var(--menu_width);
  }

  > .background {
    background: rgba(0, 0, 0, 0.3);
    height: 110%;
    opacity: 0.5;
    position: absolute;
  }

  > .content {
    height: 100%;
    position: relative;
  }

  .logo_block {
    height: 192px;
    position: relative;

    > .logo {
      width: 300px;
    }
  }

  .main {
    li {
      background: url("/assets/ui/general/hr_grunge_white-e6dac5cf.png") no-repeat bottom center;
      position: relative;
    }

    a {
      color: #fffae1;
      display: block;
      position: relative;
      text-align: center;
      height: var(--item_height);

      &:hover {
        background: rgba(222, 181, 70, 0.15);
        color: #fff;
      }
    }

    .text {
      pointer-events: none;
      display: block;
      font: 100 26px/32px var(--almendra);
    }

    .icon {
      pointer-events: none;
      display: block;
      text-align: center;
      height: 65%;

      > img {
        position: relative;
        top: 50%;
        transform: translateY(-50%);
      }
    }

    
    .menu_message {
      height: var(--item_height);
      position: absolute;
      left: 0;
      top: 0;
      border-left: none;

      > .background {
        background: rgb(0 0 0 / 0.5) url("/assets/hud/weapon_separator-bbb43e13.png") center right no-repeat;
        background-size: 2px 100%;
        z-index: -1;
      }

      > .background + div {
        font-size: 0.9em;
        padding: 8px 32px 8px;
        min-width: var(--menu_width);
        padding-left: calc(var(--menu_width) + 16px);
        position: relative;
        top: 50%;
        transform: translateY(-50%);
        box-sizing: content-box;
      }

      .info_icon {
        position: absolute;
        top: 50%;
        left: 100%;
        transform: translate(-50%, -50%) scale(1);
      }
    }
  }

  .about {
    font-size: 0.9em;
    text-align: center;
    display: block;
    margin-top: 54px;
  }

  .about {
    color: #ccc;
    font: 100 24px/32px Almendra, serif;
  }

  .about:hover {
    color: #eee;
  }
}