/*
 * Live text for the header bar and footer menu.
 *
 * Adobe Muse rasterised every navigation label into a 16px-tall (header) or
 * 20px-tall (footer) PNG, so the menu existed only as a row of images: nothing
 * for a crawler to read as site structure, nothing for a screen reader beyond
 * the alt attribute, and labels that softened whenever fit-layout.js scaled the
 * page. Each label's <img> has been replaced by a <span> holding the same words,
 * and the span keeps the image's Muse id, so every width, height and position
 * rule in the page stylesheet (and in header-nav-size.css) still applies. The
 * geometry is therefore untouched; only the paint changes.
 *
 * The type was recovered from the sprites themselves: profile the ink columns of
 * each label, render the same string in Chromium at 400px and scale linearly (a
 * 1:1 sweep only finds the edge of a hinting plateau, not the true size). Both
 * menus came back as Open Sans Semibold at the same rendered size:
 *
 *   header  ink widths imply 15.8px, and header-nav-size.css draws the bar 20%
 *           larger, so 15.8 x 1.2 = 19px in a 19.2px box
 *   footer  ink widths imply 18.9px in a 20px box -> 19px
 *
 * Colour is per item, not per menu, because Muse baked whatever it was given.
 * Read off the sprites: the footer is white throughout, the header is black
 * except on index.html, where it sits over the dark hero and is white. Every
 * link rolls over to #BC1818. The current page's label is a separate image with
 * no rollover, and it is only red on about-us, faq-s, how-we-work and
 * our-gaurantee - on contact-us and index Muse rasterised it in the ordinary
 * colour, so it does not stand out there either. Each label therefore carries
 * its own ink class rather than inheriting a menu-wide colour.
 *
 * The sprites are still on disk, so any label can be reverted by restoring its
 * <img>.
 */

/* site_global.css paints a:link blue and underlined and outweighs the .nontext
   reset Muse puts on these anchors (0-1-1 against 0-1-0). That was harmless
   while the anchors held nothing but images; now they hold words. */
a.nav-link:link,
a.nav-link:visited {
  color: inherit;
  text-decoration: none;
}

.nav-label {
  display: block;
  font-family: open-sans, "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: 600;
  font-style: normal;
  font-size: 19px;
  white-space: nowrap;
  text-decoration: none;

  /* Each label's sprite is painted by an id-keyed `background` shorthand in the
     page stylesheet, so a class cannot outrank it. The alternative is one
     override per label per page - 180 of them - which is why this is important
     rather than enumerated. */
  background-image: none !important;
}

/* Header bar: labels centred in their boxes, baseline 15px down. */
.nav-label--top {
  height: 19.2px;
  line-height: 16px;
  text-align: center;
}

/* Footer menu: left-aligned, baseline 15.5px down. */
.nav-label--footer {
  height: 20px;
  line-height: 17px;
  text-align: left;
}

/* Resting colour, taken from each sprite. */
.nav-label--ink-black { color: #000000; }
.nav-label--ink-white { color: #FFFFFF; }
.nav-label--ink-red   { color: #BC1818; }

/* Rollover, on the labels that shipped with a rollover sprite. */
a.nav-link:hover .nav-label--rollover { color: #BC1818; }
