#HW_frame_cont {
  box-shadow: 0 0 8px #4C8EE3; }

.nav-header {
  display: flex;
  flex-direction: row;
  justify-content: flex-start;
  padding-left: 0 !important;
  z-index: var(--z-index-layer-5) !important; }
  .nav-header .nav-left-cluster {
    width: 45px;
    text-align: center;
    flex-shrink: 0; }
  .nav-header .nav-center-cluster {
    flex-grow: 1;
    flex-shrink: 1;
    overflow: hidden;
    height: 100%; }
  .nav-header .nav-right-cluster {
    margin-left: auto; }

.bcContainer {
  height: 100%;
  line-height: 45px; }
  .bcContainer i {
    color: var(--header-font-color);
    margin-right: 5px; }
  .bcContainer a.crumb, .bcContainer span.crumb {
    color: var(--header-font-color);
    font-size: var(--text-size-small); }
    .bcContainer a.crumb::after, .bcContainer span.crumb::after {
      content: "/";
      display: inline-block;
      margin: 0 7px 0 0; }
    .bcContainer a.crumb:last-child, .bcContainer span.crumb:last-child {
      color: var(--header-font-color); }
      .bcContainer a.crumb:last-child:after, .bcContainer span.crumb:last-child:after {
        content: none; }
  .bcContainer #longformCrumbs {
    white-space: nowrap;
    display: inline-block; }
  .bcContainer .longformCrumbs-overlay {
    opacity: 0;
    height: 0px;
    display: block;
    transform: translateX(-10000px) translateY(-1000px); }
  .bcContainer .crumbOverlayBtn-crumbs,
  .bcContainer .terminal-crumbs {
    display: none; }
  .bcContainer .nav-crumbs-group {
    position: relative;
    top: 0;
    left: 0; }
  .bcContainer .shortform-crumbs > div {
    display: inline-block; }

ul.overlay {
  display: block;
  position: fixed;
  background-color: var(--header-color);
  max-width: 200px;
  padding: 0 0.5rem;
  overflow: hidden;
  border-radius: 0.5rem; }
  ul.overlay li > a, ul.overlay li > span {
    color: var(--header-font-color);
    font-size: var(--text-size-small); }
  ul.overlay li > a > i {
    margin-right: 0.4rem; }
  ul.overlay :last-child {
    margin-bottom: 0.2rem; }
