/* Houston header menu: same layout and weight as the homepage on every page */
header .main-nav > ul { display: flex; align-items: center; flex-wrap: nowrap; margin: 0; padding: 0; }
header .main-nav > ul > li { padding-left: 14px !important; list-style: none; white-space: nowrap; }
header .main-nav > ul > li > a { font-weight: 300; }
header .main-nav .vending-btn { font-weight: 400; }
header .main-nav .hx-ops > a { font-size: 13px; color: #5d6b7a; font-weight: 600; }
header .main-nav .hx-ops.drop-down ul a { font-size: 14px; color: #1f2a33; }
/* Inner pages put the menu in a col-8; let it use the full bar like the homepage */
@media (min-width: 992px) {
  header.top-header > .container-fluid > .row { flex-wrap: nowrap; }
  header.top-header > .container-fluid > .row > .col-4 { flex: 0 0 auto; max-width: none; width: auto; }
  header.top-header > .container-fluid > .row > .col-8 { flex: 1 1 auto; max-width: none; width: auto; }
}
/* The full menu (with Smart Coolers) needs about 1,380px. Between 1,220 and 1,379px, tighten it. */
@media (min-width: 1220px) and (max-width: 1379px) {
  header .main-nav > ul > li { padding-left: 11px !important; }
  header .main-nav > ul > li > a { font-size: 14px; }
  header .main-nav .hx-ops > a { font-size: 12px; }
  header .main-nav .vending-btn { font-size: 13px; padding-left: 14px; padding-right: 14px; }
}
/* Below 1,220px (small laptops, landscape tablets) use the phone menu instead of a cramped bar. */
@media (min-width: 992px) and (max-width: 1219px) {
  header .main-nav { display: none !important; }
  .mobile-nav-toggle.d-lg-none, .mobile-nav.d-lg-none { display: block !important; }
}