/* ============================================================
   The notice strip across the top of every page
   ------------------------------------------------------------
   One centred line under the header's black strip, on every screen
   the main header serves. It began on the front page and on the YouTV
   news list, written into each of them; it is one thing, so it is
   written once here and drawn by the header.

   Blog sites carry a header of their own (TorontoBlogHeader) and do
   not show it.
   ============================================================ */

/* The gap above separates it from the header's black strip; the gap
   below is the notice's own, so whatever section follows does not have
   to know the notice is there. */
.site-notice-wrap {
    padding-top: 16px;
    padding-bottom: 6px;
}

/* No picture here, so the line has to carry the strip on its own -
   hence a size well above the body text and full weight. The colour is
   the same near-black as every other heading: a second colour on the
   widest thing on the page would read as a warning. */
.site-notice {
    display: block;
    padding: 0 16px;
    text-align: center;
    color: #222222;
    font-size: 21px;
    font-weight: 700;
    line-height: 1.4;
    text-decoration: none;
}

.site-notice:hover,
.site-notice:focus {
    color: #f44336;
    text-decoration: none;
}

/* On a phone 21px ran to three lines and pushed the page's own opening
   off the first screenful. */
@media (max-width: 700px) {
    .site-notice {
        font-size: 17px;
    }
}

@media (max-width: 480px) {
    .site-notice {
        font-size: 15px;
    }
}