/*CB Custom 1 Line Menu*/


/* Normalize the lists */

.cb_menu,
.cb_sub-menu {
  margin: 0;
  padding: 0;
  li {
    margin: 0;
  }
}


/* Baseline for our menu */

.cb_navigation {
  line-height: 1; /* 1 */
  .cb_menu {
    a,
    li {
      display: block; /* 2 */
    }

    a {
      text-decoration: none; /* 3 */
      color: currentColor; /* 4 */
      padding: 1em; /* 5 */
    }

    li {
      border-style: solid; /* 6 */
      border-width: 0 0 1px;
    }
  }


/* Screen breakpoints
 *
 * Some quick settings to make the menu respond appropriately 
 * to different screen sizes.
 */
@media only screen and (min-width: 1024px) {
  /* Baseline */
  .cb_navigation {
    .cb_menu {
      display: flex; /* 1 */
      > li {
        border-width: 0 1px 0 0; /* 2 */
        > a {
          padding: 1.25em 1.5em; /* 3 */
        }
      }
    }
  }
}

/* Easy theming */

$cb_menu-color: rgba(white, .75);
$cb_menu-bg: #222;
$cb_menu-item-hover-color: rgba(white, .9);
$cb_menu-item-hover-bg: black;
$cb_menu-item-border-color: lighten($menu-bg, 3%);

.cb_navigation {
  background-color: $menu-bg;
  color: $menu-color;
  .cb_menu {
    li {
      border-color: $menu-item-border-color;
      &:hover,
      &:focus,
      &:active {
        > a {
          color: $cb_menu-item-hover-color;
          background-color: $cb_menu-item-hover-bg;
        }
      }
    }
  }
}