@font-face { font-family: 'Barlow Condensed'; font-weight: 500; font-style: normal; font-display: swap; src: url('fonts/barlow-condensed-latin-500-normal.woff2') format('woff2'); }
@font-face { font-family: 'Barlow Condensed'; font-weight: 600; font-style: normal; font-display: swap; src: url('fonts/barlow-condensed-latin-600-normal.woff2') format('woff2'); }
@font-face { font-family: 'Barlow Condensed'; font-weight: 700; font-style: normal; font-display: swap; src: url('fonts/barlow-condensed-latin-700-normal.woff2') format('woff2'); }
@font-face { font-family: 'Barlow Semi Condensed'; font-weight: 400; font-style: normal; font-display: swap; src: url('fonts/barlow-semi-condensed-latin-400-normal.woff2') format('woff2'); }
@font-face { font-family: 'Barlow Semi Condensed'; font-weight: 600; font-style: normal; font-display: swap; src: url('fonts/barlow-semi-condensed-latin-600-normal.woff2') format('woff2'); }
@font-face { font-family: 'Source Serif'; font-weight: 400; font-style: normal; font-display: swap; src: url('fonts/source-serif-4-latin-400-normal.woff2') format('woff2'); }
@font-face { font-family: 'Source Serif'; font-weight: 400; font-style: italic; font-display: swap; src: url('fonts/source-serif-4-latin-400-italic.woff2') format('woff2'); }
@font-face { font-family: 'Source Serif'; font-weight: 600; font-style: normal; font-display: swap; src: url('fonts/source-serif-4-latin-600-normal.woff2') format('woff2'); }
/* The textbook's web pages (site/build.mjs): the printed book's type and colours, on screen. */
:root {
  --navy: #0c2340; --ink: #13263b; --soft: #3e4e5e; --gold: #d4a64a; --gold-ink: #8a6418;
  --sea: #2f7fb5; --sea-ink: #23628f; --red: #c0392b; --orange: #e0732f; --orange-ink: #a84c17;
  --paper: #fbfaf7; --card: #ffffff; --line: #d3dbe3; --hair: #a9b6c3; --tint: #f1eee6;
  --serif: 'Source Serif', Georgia, 'Times New Roman', serif;
  --cond: 'Barlow Condensed', 'Arial Narrow', system-ui, sans-serif;
  --semi: 'Barlow Semi Condensed', 'Arial Narrow', system-ui, sans-serif;
  --text: 42rem; --wide: 60rem; --page: 72rem;
  color-scheme: light;
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-padding-top: 76px; }
body { margin: 0; background: var(--paper); color: var(--ink); font: 400 18px/1.62 var(--serif); }
img, svg, video { max-width: 100%; }
a { color: var(--sea-ink); text-decoration-thickness: 1px; text-underline-offset: 2px; }
b, strong { font-weight: 600; }
p { margin: 0 0 1em; }
.inner { width: min(var(--page), 100% - 32px); margin: 0 auto; }
.small { font-size: 14px; color: var(--soft); }

/* ---------- top bar ---------- */
.top { position: sticky; top: 0; z-index: 10; background: rgba(251, 250, 247, .94); backdrop-filter: blur(8px); border-bottom: 1px solid var(--line); }
.top .inner { display: flex; align-items: center; justify-content: space-between; gap: 16px; height: 60px; }
.brand { display: inline-flex; align-items: center; gap: 10px; color: var(--navy); text-decoration: none; font: 700 22px/1 var(--cond); letter-spacing: .3px; white-space: nowrap; }
.brand img { border-radius: 50%; }
.top nav { display: flex; align-items: center; gap: 22px; font: 600 16px var(--semi); }
.top nav a { color: var(--ink); text-decoration: none; }
.top nav a:hover, .top nav a[aria-current] { color: var(--sea-ink); }
.btn { display: inline-block; padding: 8px 16px; border-radius: 4px; background: var(--navy); color: #fff !important; font: 600 16px/1.2 var(--semi); text-decoration: none; letter-spacing: .2px; }
.btn:hover { background: #17375e; }
.btn.big { padding: 13px 24px; font-size: 18px; }
.btn.ghost { background: rgba(255, 255, 255, .14); box-shadow: inset 0 0 0 1.5px rgba(255, 255, 255, .8); }
.btn.ghost:hover { background: rgba(255, 255, 255, .26); }
@media (max-width: 760px) {
  .top nav a:not(.btn):not(:first-child) { display: none; }
  .brand span { font-size: 20px; }
}
@media (max-width: 400px) { .top nav a:first-child:not(.btn) { display: none; } }

/* ---------- home: hero ---------- */
.hero { position: relative; min-height: min(78vh, 760px); display: flex; align-items: flex-end; overflow: hidden; background: var(--navy); color: #fff; }
.hero .bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 74% 50%; }
.hero .shade { position: absolute; inset: 0; background: linear-gradient(90deg, rgba(8, 26, 48, .78) 0%, rgba(8, 26, 48, .45) 42%, rgba(8, 26, 48, 0) 70%), linear-gradient(0deg, rgba(8, 26, 48, .55) 0%, rgba(8, 26, 48, 0) 45%); }
.hero .inner { position: relative; padding: 120px 0 64px; }
.hero h1 { margin: 0; font: 700 clamp(48px, 9.5vw, 104px)/.9 var(--cond); letter-spacing: .5px; }
.hero .sub { max-width: 33rem; margin: 30px 0 0; font: italic 400 clamp(19px, 2.3vw, 23px)/1.45 var(--serif); color: #e6edf4; text-shadow: 0 1px 12px rgba(8, 26, 48, .35); }
.hero .actions { display: flex; flex-wrap: wrap; gap: 12px; margin: 26px 0 12px; }
.hero .caption { position: absolute; right: 24px; bottom: 18px; margin: 0; font: italic 400 14px/1.3 var(--serif); color: rgba(255, 255, 255, .78); text-shadow: 0 1px 6px rgba(8, 26, 48, .5); }
.hero .film { position: absolute; left: 24px; bottom: 16px; display: inline-flex; align-items: center; gap: 8px; padding: 7px 12px 7px 10px; border: 1px solid rgba(255, 255, 255, .45); border-radius: 999px; background: rgba(8, 26, 48, .45); color: #fff; font: 600 14px var(--semi); cursor: pointer; }
.hero .film:hover { background: rgba(8, 26, 48, .7); }
.hero .film-i { width: 10px; height: 12px; border-left: 3px solid #fff; border-right: 3px solid #fff; box-sizing: border-box; }
.hero .film.paused .film-i { width: 0; height: 0; border-style: solid; border-color: transparent transparent transparent #fff; border-width: 6px 0 6px 10px; }
.hero .film[hidden] { display: none; }
@media (max-width: 600px) {
  .hero { min-height: 86vh; }
  .hero .shade { background: linear-gradient(0deg, rgba(8, 26, 48, .88) 0%, rgba(8, 26, 48, .55) 55%, rgba(8, 26, 48, .1) 100%); }
  .hero .inner { padding: 90px 0 48px; }
  .hero .caption { left: 16px; right: 16px; bottom: 14px; font-size: 13px; }
  .hero .film { left: auto; right: 16px; top: 16px; bottom: auto; }
}

/* ---------- home: sections ---------- */
.home h2 { font: 700 34px/1.1 var(--cond); color: var(--navy); margin: 0 0 14px; letter-spacing: .3px; }
.about { padding: 64px 0 24px; }
.about .inner { display: grid; grid-template-columns: 1.25fr 1fr; gap: 56px; align-items: start; }
.lead { font-size: 20px; line-height: 1.55; color: #2a3c50; }
ol.how { list-style: none; counter-reset: s; margin: 6px 0 0; padding: 0; }
ol.how li { counter-increment: s; position: relative; padding: 0 0 18px 52px; font-size: 17px; }
ol.how li::before { content: counter(s); position: absolute; left: 0; top: -4px; width: 36px; height: 36px; border-radius: 50%; border: 2px solid var(--gold); color: var(--gold-ink); font: 700 20px/32px var(--cond); text-align: center; }
@media (max-width: 860px) { .about .inner { grid-template-columns: 1fr; gap: 16px; } }

.contents { padding: 40px 0 32px; }
.partname { font: 600 15px var(--cond); letter-spacing: 2.5px; text-transform: uppercase; color: var(--gold-ink); margin: 34px 0 14px; padding-top: 10px; border-top: 1px solid var(--line); }
.cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 22px; }
.card { display: flex; flex-direction: column; background: var(--card); color: var(--ink); text-decoration: none; box-shadow: 0 1px 2px rgba(12, 35, 64, .1), 0 0 0 1px rgba(12, 35, 64, .05); transition: transform .15s, box-shadow .15s; }
.card:hover { transform: translateY(-2px); box-shadow: 0 6px 18px rgba(12, 35, 64, .14), 0 0 0 1px rgba(12, 35, 64, .05); }
.card img { display: block; width: 100%; height: auto; aspect-ratio: 16 / 9; object-fit: cover; background: #dfe7ee; }
.cardtext { position: relative; padding: 14px 18px 16px 62px; }
.cnum { position: absolute; left: 18px; top: 10px; font: 700 34px/1 var(--cond); color: var(--gold); }
.card h3 { margin: 0 0 6px; font: 700 22px/1.1 var(--cond); color: var(--navy); }
.card p { margin: 0; font-size: 15.5px; line-height: 1.45; color: var(--soft); display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; }
.extras { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 22px; }
.extra { display: block; padding: 18px 20px; background: var(--card); border-top: 3px solid var(--navy); color: var(--ink); text-decoration: none; box-shadow: 0 1px 2px rgba(12, 35, 64, .1); }
.extra:hover { border-top-color: var(--sea); }
.extra h3 { margin: 0 0 4px; font: 700 22px var(--cond); color: var(--navy); }
.extra p { margin: 0; font-size: 15.5px; color: var(--soft); }

.simband { margin-top: 40px; padding: 56px 0; background: var(--tint); }
.simband .inner { display: grid; grid-template-columns: 1fr 1.1fr; gap: 48px; align-items: center; }
.simband img { width: 100%; height: auto; display: block; box-shadow: 0 4px 18px rgba(12, 35, 64, .16); }
@media (max-width: 760px) { .simband .inner { grid-template-columns: 1fr; gap: 20px; } }

/* ---------- a chapter's opener ---------- */
.opener .photo { position: relative; background: var(--navy); }
.opener .photo img { display: block; width: 100%; height: clamp(220px, 46vw, 560px); object-fit: cover; }
.opener .titles { border-top: 5px solid var(--gold); background: var(--card); }
.opener .titles .inner { display: flex; align-items: flex-end; gap: 22px; padding: 22px 0 18px; width: min(var(--wide), 100% - 32px); }
.opener .num { font: 700 clamp(60px, 9vw, 96px)/.85 var(--cond); color: var(--gold); }
.part { font: 600 14px var(--cond); letter-spacing: 2.5px; text-transform: uppercase; color: #6c8197; }
.opener h1, .pagehead h1 { margin: 2px 0 0; font: 700 clamp(36px, 5.5vw, 56px)/1 var(--cond); color: var(--navy); }
.intro { background: var(--card); border-bottom: 1px solid var(--line); }
.intro .inner { display: grid; grid-template-columns: 1.6fr 1fr; gap: 40px; padding: 4px 0 30px; width: min(var(--wide), 100% - 32px); }
.introtext { font-size: 19.5px; line-height: 1.55; margin: 0; }
.inthis { font: 400 16.5px/1.45 var(--semi); }
.inthis h4 { margin: 2px 0 6px; font: 600 14px var(--cond); letter-spacing: 2px; text-transform: uppercase; color: var(--gold-ink); }
.inthis ul { margin: 0; padding-left: 18px; }
.inthis li { margin-bottom: 3px; }
@media (max-width: 760px) { .intro .inner { grid-template-columns: 1fr; gap: 18px; } .opener .titles .inner { gap: 14px; } }

.pagehead { background: var(--card); border-bottom: 1px solid var(--line); }
.pagehead .inner { width: min(var(--text), 100% - 32px); padding: 44px 0 26px; }
.pagehead p { margin: 12px 0 0; color: var(--soft); }
.az { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 18px; }
.az a { min-width: 34px; padding: 4px 0; text-align: center; font: 600 17px var(--semi); text-decoration: none; color: var(--navy); background: var(--tint); border-radius: 3px; }
.az a:hover { background: var(--navy); color: #fff; }

/* ---------- the text of a chapter ----------
   One column of text; pictures, figure rows and tables can run wider. */
article.text {
  display: grid; padding: 34px 0 20px;
  grid-template-columns: [full-start] minmax(16px, 1fr) [wide-start] minmax(0, calc((var(--wide) - var(--text)) / 2)) [text-start] min(var(--text), 100% - 32px) [text-end] minmax(0, calc((var(--wide) - var(--text)) / 2)) [wide-end] minmax(16px, 1fr) [full-end];
}
article.text > * { grid-column: text; min-width: 0; }
article.text > figure.wide, article.text > figure.full, article.text > .figrow { grid-column: wide; }
article.text h2 { font: 700 32px/1.1 var(--cond); color: var(--navy); margin: 36px 0 12px; letter-spacing: .3px; }
article.text h3 { font: 600 23px/1.15 var(--cond); color: var(--navy); margin: 26px 0 8px; }
article.text > .lead { margin-bottom: 1.2em; }
article.text ul, article.text ol { padding-left: 1.3em; margin: 0 0 1em; }
article.text li { margin-bottom: .35em; }

figure { margin: 10px 0 30px; }
figure svg, figure img { display: block; width: 100%; height: auto; }
figure.photo img { aspect-ratio: 16 / 9; object-fit: cover; }
figcaption { font: 400 16px/1.42 var(--semi); color: var(--soft); margin-top: 9px; max-width: var(--text); }
figcaption b { font-family: var(--cond); font-weight: 700; color: var(--navy); letter-spacing: .3px; margin-right: 4px; }
.figrow { display: grid; gap: 20px; margin: 10px 0 30px; }
.figrow.n2 { grid-template-columns: 1fr 1fr; }
.figrow.n3 { grid-template-columns: 1fr 1fr 1fr; }
.figrow figure { margin: 0; }
@media (max-width: 640px) { .figrow.n2, .figrow.n3 { grid-template-columns: 1fr; } }

/* ---------- boxes, as in the book: a coloured rule above, a small-capitals label ---------- */
.box { margin: 14px 0 26px; padding: 10px 0 4px; border-top: 3px solid var(--navy); border-bottom: 1px solid var(--hair); font-size: 17px; }
.box h4 { margin: 0 0 6px; font: 600 14px var(--semi); letter-spacing: 1.8px; text-transform: uppercase; color: var(--navy); }
.box p { margin-bottom: .7em; }
.box.mistake { border-top-color: var(--red); } .box.mistake h4 { color: var(--red); }
.box.remember { border-top-color: var(--gold); } .box.remember h4 { color: var(--gold-ink); }
.box.remember p { font-style: italic; font-size: 18.5px; }
.box.safety { border-top-color: var(--orange); } .box.safety h4 { color: var(--orange-ink); }
.box.terms { border-top-width: 2px; }
.box.terms dl { margin: 0 0 10px; display: grid; grid-template-columns: max-content 1fr; column-gap: 18px; row-gap: 4px; }
.box.terms dt { font: 600 17px var(--semi); color: var(--navy); }
.box.terms dd { margin: 0; }
@media (max-width: 520px) { .box.terms dl { grid-template-columns: 1fr; } .box.terms dd { margin-bottom: 6px; } }

/* "In the simulator": the lessons are buttons that open them in the game. */
.box.sim { border-top-color: var(--sea); padding-bottom: 14px; }
.box.sim h4 { color: var(--sea-ink); }
.lessons { display: flex; flex-wrap: wrap; gap: 10px; }
a.lesson { display: inline-flex; align-items: center; gap: 10px; padding: 8px 16px 8px 10px; border-radius: 6px; background: #eaf3fa; color: var(--navy); text-decoration: none; font: 600 17px/1.15 var(--semi); box-shadow: inset 0 0 0 1px #c3dbee; }
a.lesson small { display: block; font: 600 11.5px var(--semi); letter-spacing: 1.4px; text-transform: uppercase; color: var(--sea-ink); }
a.lesson .go { flex: none; width: 30px; height: 30px; border-radius: 50%; background: var(--sea); position: relative; }
a.lesson .go::after { content: ''; position: absolute; left: 11px; top: 8px; border-left: 11px solid #fff; border-top: 7px solid transparent; border-bottom: 7px solid transparent; }
a.lesson:hover { background: var(--navy); color: #fff; box-shadow: none; }
a.lesson:hover small { color: #b9d3ea; }

ol.steps { counter-reset: s; list-style: none; padding: 0 !important; }
ol.steps li { counter-increment: s; position: relative; padding-left: 34px; margin-bottom: .6em; }
ol.steps li::before { content: counter(s) '.'; position: absolute; left: 0; top: 0; font: 600 19px var(--semi); color: var(--navy); }

/* ---------- tables: rules, not fills ---------- */
.table { overflow-x: auto; margin: 6px 0 28px; }
table { width: 100%; border-collapse: collapse; font: 400 16.5px/1.38 var(--semi); border-top: 2px solid var(--navy); border-bottom: 2px solid var(--navy); }
th { text-align: left; font-weight: 600; color: var(--navy); padding: 8px 14px 6px 0; border-bottom: 1px solid var(--navy); }
td { padding: 7px 14px 7px 0; border-bottom: 1px solid var(--line); vertical-align: top; }
tbody tr:last-child td { border-bottom: none; }

/* ---------- glossary ---------- */
.glossary .letter { border-top: 1px solid var(--line); padding-top: 4px; }
.glossary h2 { margin: 14px 0 6px !important; color: var(--gold) !important; }
.glossary dl { margin: 0 0 18px; }
.glossary dt { font: 600 19px var(--semi); color: var(--navy); margin-top: 10px; }
.glossary dd { margin: 0; }

/* ---------- previous and next ---------- */
.pager { width: min(var(--wide), 100% - 32px); margin: 20px auto 56px; display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.pager a { display: block; padding: 14px 18px; background: var(--card); border-top: 3px solid var(--line); color: var(--navy); text-decoration: none; font: 700 22px/1.15 var(--cond); box-shadow: 0 1px 2px rgba(12, 35, 64, .08); }
.pager a:hover { border-top-color: var(--gold); }
.pager small { display: block; font: 600 13px var(--semi); letter-spacing: 1.5px; text-transform: uppercase; color: #6c8197; margin-bottom: 3px; }
.pager .next { text-align: right; }
@media (max-width: 560px) { .pager { grid-template-columns: 1fr; } .pager .next { text-align: left; } }

/* ---------- footer ---------- */
.foot { background: var(--navy); color: #c9d6e2; padding: 40px 0 28px; font: 400 16px/1.5 var(--semi); }
.foot .inner { display: grid; grid-template-columns: 1.4fr 1fr; gap: 12px 40px; }
.foot .brand { color: #fff; margin-bottom: 10px; }
.foot a { color: #fff; }
.foot .cols { display: flex; gap: 40px; }
.foot .small { grid-column: 1 / -1; color: #93a7bb; margin-top: 18px; padding-top: 14px; border-top: 1px solid rgba(255, 255, 255, .14); }
@media (max-width: 700px) { .foot .inner { grid-template-columns: 1fr; } }

/* ---------- a figure, enlarged ---------- */
figure.zoomable svg, figure.zoomable img { cursor: zoom-in; }
.enlarged { position: fixed; inset: 0; z-index: 50; background: rgba(6, 18, 34, .97); cursor: zoom-out; }
.enlarged > * { position: absolute; left: 50%; top: 50%; max-width: none; width: min(100vw, 177.7vh); height: auto; aspect-ratio: 16 / 9; object-fit: contain; transform: translate(-50%, -50%); }
.enlarged.turn > * { width: min(100vh, 177.7vw); transform: translate(-50%, -50%) rotate(90deg); }

/* Questions and answers (site/questions). */
.pagehead .part a { color: inherit; text-decoration: none; }
.pagehead .part a:hover { text-decoration: underline; }
.qa-jump { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 18px; }
.qa-jump a { padding: 5px 12px; border-radius: 999px; background: #eaf3fa; color: var(--navy); text-decoration: none; font: 600 15px var(--semi); box-shadow: inset 0 0 0 1px #c3dbee; }
.qa-jump a:hover { background: var(--navy); color: #fff; box-shadow: none; }
.qa-index section { scroll-margin-top: 90px; }
.qa-index h2 a { color: inherit; text-decoration: none; }
.qa-index h2 a:hover { color: var(--sea-ink); }
.qa-intro { margin-top: -6px; color: var(--soft); }
article.text .qa-list { margin: 10px 0 30px; padding: 0; list-style: none; }
article.text .qa-list li { margin: 0; padding: 9px 0; border-bottom: 1px solid var(--line); }
.qa-list a { color: var(--navy); text-decoration: none; font: 600 18px/1.3 var(--semi); }
.qa-list a:hover { color: var(--sea-ink); text-decoration: underline; }
.qa-card { display: block; margin: 0 0 14px; padding: 16px 20px; background: var(--card); color: var(--ink); text-decoration: none; box-shadow: 0 1px 2px rgba(12, 35, 64, .1), 0 0 0 1px rgba(12, 35, 64, .05); }
.qa-card:hover { box-shadow: 0 6px 18px rgba(12, 35, 64, .14), 0 0 0 1px rgba(12, 35, 64, .05); }
.qa-card h2 { margin: 0 0 6px; font: 700 22px/1.15 var(--cond); color: var(--navy); }
.qa-card p { margin: 0; color: var(--soft); }
.qa-answer .lead { font-size: 1.15em; color: var(--navy); }
.qa-chapter { margin-top: 26px; font: 600 17px var(--semi); }
.qa-more { margin-top: 34px; }

/* ---------- "Check yourself": retrieval questions at the end of a chapter (site/recall.js) ---------- */
.recall { margin: 40px 0 10px; padding: 22px 22px 8px; background: var(--card); border: 1px solid var(--line); border-top: 4px solid var(--gold); border-radius: 4px; }
article.text .recall h2 { margin-top: 0; }
.recall-lead { color: var(--soft); font-size: 17px; }
article.text ol.recall-list { list-style: none; padding: 0; counter-reset: rq; }
.rq { counter-increment: rq; padding: 16px 0 18px; border-top: 1px solid var(--line); margin: 0 !important; }
.rq-q { font: 600 20px/1.3 var(--semi); color: var(--navy); margin-bottom: 10px; }
.rq-q::before { content: counter(rq) '. '; color: var(--gold-ink); }
article.text ol.rq-opts { list-style: none; padding: 0; margin: 0 0 6px; display: grid; gap: 6px; }
article.text ol.rq-opts li { margin: 0; }
.rq-opt { display: flex; gap: 10px; align-items: baseline; width: 100%; text-align: left; padding: 9px 12px; border: 1px solid var(--line); border-radius: 5px; background: var(--paper); color: var(--ink); font: 400 17px/1.35 var(--serif); cursor: pointer; }
.rq-opt:hover:not(:disabled) { border-color: var(--sea); background: #eaf3fa; }
.rq-opt:disabled { cursor: default; }
.rq-opt.right { border-color: #2e8b57; background: #e5f4ea; }
.rq-opt.wrong { border-color: var(--red); background: #fbe9e6; }
.rq-l { flex: none; font: 600 15px var(--semi); color: var(--sea-ink); }
.rq-said { font: 600 16px var(--semi); color: var(--soft); margin: 6px 0 4px; }
.rq-said:empty { display: none; }
.rq-a summary { cursor: pointer; font: 600 16px var(--semi); color: var(--sea-ink); padding: 4px 0; }
.rq-a p { margin: 6px 0 10px; }
a.lesson.small { margin-top: 8px; padding: 5px 12px 5px 8px; font-size: 15px; }
a.lesson.small .go { width: 24px; height: 24px; }
a.lesson.small .go::after { left: 9px; top: 6px; border-left-width: 9px; border-top-width: 6px; border-bottom-width: 6px; }
@media (max-width: 520px) { .recall { padding: 16px 14px 4px; } .rq-q { font-size: 18.5px; } }

/* Running a club night (/club-night/): one printed page. */
@media print {
  header.top, footer.foot, .no-print { display: none !important; }
  .club-night .pagehead { background: none; border: 0; }
  .club-night .pagehead .inner { padding: 0 0 4px; }
  .club-night .pagehead h1 { font-size: 20pt; margin: 0; }
  .club-night .text { font-size: 9.5pt; line-height: 1.28; margin-top: 0; }
  .club-night .text h2 { font-size: 11.5pt; margin: 7px 0 1px; }
  .club-night .text ul { margin: 0; }
  .club-night .text li { margin: 1px 0; }
  @page { margin: 12mm; }
}