@media (min-width: 992px) {
  div.header-v8 .navbar-nav > li.nav_cta > a {
    padding: 0 18px;
    margin: 27px 0 27px 8px;
    line-height: 40px;
    border-radius: 4px;
    -webkit-transition: all 0.3s cubic-bezier(0.5, 1, 0.7, 1);
    transition: all 0.3s cubic-bezier(0.5, 1, 0.7, 1);
  }

  /* Sign Up: solid primary */
  div.header-v8 .navbar-nav > li.nav_cta_solid > a,
  div.header-v8 .navbar-nav > li.nav_cta_solid > a:focus {
    background: #007fff;
    color: #ffffff;
  }
  div.header-v8 .navbar-nav > li.nav_cta_solid > a:hover {
    background: #0058b3;
    color: #ffffff;
  }

  /* Free Demo: outline secondary (36px line + 2px borders = 40px) */
  div.header-v8 .navbar-nav > li.nav_cta_outline > a,
  div.header-v8 .navbar-nav > li.nav_cta_outline > a:focus {
    line-height: 36px;
    border: 2px solid #007fff;
    background: transparent;
    color: #007fff;
  }
  div.header-v8 .navbar-nav > li.nav_cta_outline > a:hover {
    background: #007fff;
    color: #ffffff;
  }

  /* Sticky header shrunk on scroll: re-center and hold pill height
     against the template's line-height: 30px shrink rule. */
  .header-fixed div.header-v8.header-fixed-shrink .navbar-nav > li.nav_cta > a {
    margin-top: 15px;
    margin-bottom: 15px;
    line-height: 40px;
  }
  .header-fixed div.header-v8.header-fixed-shrink .navbar-nav > li.nav_cta_outline > a {
    line-height: 36px;
  }
}

/* ==================== Collapsed menu (991px and down) ==================== */
@media (max-width: 991px) {
  /* Full-width stacked buttons: the standard collapsed-menu CTA
     treatment. Inline pills hug the left edge and misalign against
     the full-width menu rows, which reads as broken. */
  div.header-v8 .navbar-nav > li.nav_cta > a {
    display: block;
    margin: 10px 15px;
    padding: 0 18px;
    line-height: 40px;
    text-align: center;
    border-radius: 4px;
    border-top: none;
  }
  div.header-v8 .navbar-nav > li.nav_cta_solid > a,
  div.header-v8 .navbar-nav > li.nav_cta_solid > a:focus,
  div.header-v8 .navbar-nav > li.nav_cta_solid > a:hover {
    background: #007fff;
    color: #ffffff;
  }
  div.header-v8 .navbar-nav > li.nav_cta_outline > a,
  div.header-v8 .navbar-nav > li.nav_cta_outline > a:focus,
  div.header-v8 .navbar-nav > li.nav_cta_outline > a:hover {
    line-height: 36px;
    border: 2px solid #007fff;
    background: transparent;
    color: #007fff;
  }
}