/* TECHNICAL GUIDE BASE CSS Version 1.0.1 ============== STYLESHEET TOC ============== Search any of the TOC entries below to navigate this stylesheet. - GLOBAL - FRONTMATTER - DROPCAPS - OPTIONAL SUPER STYLES / OVERRIDES (PAGE-BREAK CLASSES, ETC) - HEADERS - COPYRIGHT - TABLE OF CONTENTS - FOOTNOTES - IMAGES - TABLES - IMAGE-BASED TABLES - PULLQUOTES AND TEXTBOXES - INGREDIENT LISTS - AUDIO & VIDEO - POETRY - NOEMOJI FIX - DIVISIONAL BRANDING ============================================================ CSS RESET ============================================================ */ html, body, div, span, h1, h2, h3, h4, h5, h6, p, blockquote, a, abbr, acronym, address, big, cite, del, dfn, img, ins, kbd, q, s, samp, small, strike, tt, dl, dt, dd, fieldset,figcaption, figure, form, label, legend, table, tbody, tfoot, tr, td, article, aside, canvas, details, embed, footer, header, hgroup, menu, nav, output, section, summary, time, mark, audio, video { margin: 0px; padding: 0px; border: 0; font-size: 100%; font: inherit; vertical-align: baseline; } /* HTML5 display-role reset for older devices */ article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; } table { border-collapse: collapse; border-spacing: 0; } /* ============================================================ GLOBAL ============================================================ */ html { font-size: 16px; } @font-face { font-family: "noemoji"; font-weight: normal; font-style: normal; /* src: url(../prh_core_assets/fonts/symbola.otf); */ } body { font-family: serif; font-size: 1em; color: #000; orphans: 2; widows: 2; } p { orphans: 2; text-indent: 1em; } h1 + p, h2 + p, h3 + p, h4 + p, h5 + p, h6 + p, figure + p, ol + p, ul + p, .sidebar_wrapper > p:first-of-type, .maincontent_wrapper > p:first-of-type { text-indent: 0em; } figure { page-break-inside: avoid; margin: 1em auto; } figcaption { width: 100%; padding: 0px; margin-top: 1em; text-align: center; font-size: 0.85em; line-height: 1.3em; font-style: normal; color: #1b1b1b; } figure + p { text-indent: 0em; } figure img + img, figure table + table { margin-top: 2px; } sup, sub { font-size: xx-small; font-size: 0.7em; } img { border: none; } ul, ol { margin: 0.5em auto; } del { text-decoration: line-through; } u { text-decoration: underline; } .small_caps { font-size: 0.75em; text-transform: uppercase; } blockquote { width: 85%; margin: 1em auto; padding: 0px; font-size: 0.9em; } .authorname { font-weight: bold; display: block; } span.process_number { display: inline-block; text-align: center; font-size: 0.9em; width: 1.5em; height: 1.5em; line-height: 1.5em; margin-right: 0.5em; color: #ffffff; background-color: #333; border-radius: 3px; /* Variable */ font-weight: bold; /* Variable */ } /* =========== Frontmatter =========== */ .epigraph, .dedication { text-align: left; width: 65%; margin: 25% auto; } .epigraph p, .dedication p { text-indent: 0px; font-style: italic; } .epigraph .authorname { margin-top: 0.5em; text-align: right; font-weight: normal; } section.titlepage, section.part, section.chapter { margin-top: 15%; } section.titlepage h4 { font-style: italic; } .titlepage hr, .part hr, .backmatter hr { margin: 1.5em auto; width: 80%; } .booktitle { letter-spacing: 0.15em; text-transform: uppercase; /*font-variant: small-caps;*/ line-height: 1.3em; } .booktitle + p { margin-top: 1.5em; } section.titlepage h3 + h4 { margin-top: 1.5em; } /* ======== Dropcaps ======== */ p.dropcap { text-indent: 0em; } p.dropcap::first-letter { font-weight: normal; font-family: serif; initial-letter: 3; -webkit-initial-letter: 3; } @media only screen and (max-device-width: 750px) { p.dropcap::first-letter { initial-letter: 2; -webkit-initial-letter: 2; font-weight: normal; } } .button { text-align: center; } .button a, .button a:visited { text-align: center; display: inline-block; color: #fff; border: 0px; border-radius: 3px; padding: 5px 10px; font-weight: bold; text-decoration: none; } /* ============================================================ OPTIONAL SUPER STYLES ============================================================ */ .pagebreak_after { page-break-after: always; margin-bottom: 0em !important; padding-bottom: 0em !important; } .pagebreak_before { page-break-before: always; margin-top: 0em !important; padding-top: 0em !important; } .no_indent { text-indent: 0px !important; } .center_content { text-align: center; text-indent: 0px; } .leftalign_content { text-align: left; } .rightalign_content { text-align: right; } .no_wrap { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .hidden_content { display: none; } .divider { width: 90%; margin-top: 5em; height: 1px; border-width: 0px; color: inherit; background-color: #1b1b1b; clear: both; } /* ============================================================ HEADERS ============================================================ */ span.subhead { display: block; font-size: 0.7em; page-break-inside: avoid; } h1, h2, h3, h4, h5, h6 { margin-top: 0em; margin-bottom: 0.5em; page-break-inside: avoid; page-break-after: avoid; font-weight: normal; text-align: center; clear: both; } h1 { font-size: 1.9em; } h2 { font-size: 1.6em; } h3 { font-size: 1.3em; } h4 { font-size: 1.15em; } h5 { font-size: 1em; } h6 { font-size: 0.75em; } h1 + h2 { margin-top: 1.5em; } h2 + h3 { margin-top: 1.3em; } h3 + h4 { margin-top: 1em; } p + h1, p + h2, p + h3, p + h4, p + h5, p + h6 { margin-top: 1.5em; } ul + h1, ul + h2, ul + h3, ul + h4, ul + h5, div + h1, div + h2, div + h3, div + h4, div + h5 { margin-top: 1.5em; } pre + h2, pre + h3, pre + h4, pre + h5, pre + h6, section + h1, section + h2, section + h3, section + h4, section + h5, section + h6 { margin-top: 1.5em; } pre + p { margin-top: 1em; } figure + h2, figure + h3, figure + h4, figure + h5, figure + h6, table + h2, table + h3, table + h4, table + h5, table + h6 { margin-top: 1.5em; } aside + h1, aside + h2, aside + h3, aside + h4, aside + h5, aside + h6 { margin-top: 1.5em; } .header_image { width: 100%; margin-top: 0px; margin-bottom: 0px; } h2.chapter_number { font-size: 1.2em; letter-spacing: 0.1em; font-variant: small-caps; } .chapter_title { font-size: 1.6em; } .chapter_number + p, .chapter_title + p, .chapter_number + section, .chapter_title + section, .booktitle + h4, .booktitle + h5 { margin-top: 3.5em; } /* ============================================================ COPYRIGHT ============================================================ */ body.copyright_page_center, .copyright_page_center h1, .copyright_page_center h2, .copyright_page_center figure { text-align: center; font-size: 0.8em; line-height: 1.3em; } body.copyright_page_left, .copyright_page_left h1, .copyright_page_left h2, .copyright_page_left figure { text-align: left; font-size: 0.8em; line-height: 1.3em; } .copyright_page_center p, .copyright_page_left p { text-indent: 0px !important; margin-bottom: 0.5em; } .copyright_page_center a, .copyright_page_left a { text-decoration: none; } .copyright_logo { text-align: inherit; page-break-inside: avoid; width: 100%; } .copyright_logo img { page-break-inside: avoid; width: 30%; } /* ============================================================ TABLE OF CONTENTS ============================================================ */ ol.toc_ol_root { list-style-type: none; padding-left: 0.5em; margin-top: 3em; } ol.toc_ol_nested { list-style-type: none; padding-left: 1.5em; margin-top: 0.25em; font-size: 95%; } .toc_ol_root li { margin-bottom: 0.7em; } .toc_ol_nested .toc_ol_nested { margin-top: 0.2em; margin-bottom: 0.25em; } .toc_ol_nested, .toc_ol_nested li { margin-bottom: 0em; } .toc_ol_root a, .toc_ol_root a:visited { color: #000; text-decoration: none; border-bottom: none; } .toc_ol_nested a, .toc_ol_nested a:visited { color: inherit; /* Define color in .toc_ol_nested above */ text-decoration: none; border-bottom: none; } /* ============================================================ FOOTNOTES ============================================================ */ .footnote_chapter_header { width: 90%; text-align: left; font-size: 1.2em; margin-left: auto; margin-right: auto; } .footnote { font-size: 0.85em; font-style: normal; text-align: justify; margin: 0em auto 1em auto; border-radius: 5px; width: 90%; } .footnote_chapter_header + .footnote { page-break-before: avoid; } a.footnote_return { vertical-align: super; padding: 0px 10px 0px 0px; margin: 0px; text-align: left; line-height: 100%; font-size: 8px; border-bottom: 0px; } a.noteref { vertical-align: super; padding: 0px 6px 2px 0px; margin: 0px; text-align: left; line-height: 100%; font-size: 0.7em; border-bottom: 0px; } /* ============================================================ IMAGES ============================================================ */ img { /*-- iOS8 Image Fix --*/ display: inline; } .inline_image { height: 1em; vertical-align: middle; } /* ================== Extra-Small Images ================== */ .portrait_xsmall { text-align: center; page-break-inside: avoid; clear: both; border-radius: 2px; width: 20%; } .portrait_xsmall img { page-break-inside: avoid; border-radius: 2px; width: 100%; } .landscape_xsmall { text-align: center; page-break-inside: avoid; clear: both; border-radius: 2px; width: 40%; } .landscape_xsmall img { page-break-inside: avoid; border-radius: 2px; width: 100%; } /* ============ Small Images ============ */ .portrait_small { text-align: center; page-break-inside: avoid; clear: both; border-radius: 2px; width: 30%; } .portrait_small img { page-break-inside: avoid; border-radius: 2px; width: 100%; } .landscape_small { text-align: center; page-break-inside: avoid; clear: both; border-radius: 2px; width: 58%; } .landscape_small img { page-break-inside: avoid; border-radius: 2px; width: 100%; } /* ============== Default Images ============== */ .portrait_default { text-align: center; page-break-inside: avoid; clear: both; border-radius: 2px; width: 38%; } .portrait_default img { page-break-inside: avoid; border-radius: 2px; width: 100%; } .landscape_default { text-align: center; page-break-inside: avoid; clear: both; border-radius: 2px; width: 70%; } .landscape_default img { page-break-inside: avoid; border-radius: 2px; width: 100%; } /* ============= Medium Images ============= */ .portrait_medium { text-align: center; page-break-inside: avoid; clear: both; border-radius: 2px; width: 50%; } .portrait_medium img { page-break-inside: avoid; border-radius: 2px; width: 100%; } .landscape_medium { text-align: center; page-break-inside: avoid; clear: both; border-radius: 2px; width: 84%; } .landscape_medium img { page-break-inside: avoid; border-radius: 2px; width: 100%; } /* ============================================== Large Images + Double Page Spread (DPS) Images ============================================== */ .portrait_large { text-align: center; page-break-inside: avoid; clear: both; border-radius: 2px; width: 65%; } .portrait_large img { page-break-inside: avoid; border-radius: 2px; width: 100%; } .landscape_large, .imprint_logo { text-align: center; page-break-inside: avoid; clear: both; width: 100%; } .landscape_large img, .imprint_logo img { page-break-inside: avoid; width: 100%; } .imprint_logo { margin-top: 6em; page-break-before: avoid; } /* ================ FULL PAGE IMAGES ================ */ .image_full { position: relative; text-align: center; page-break-before: always; page-break-after: always; page-break-inside: avoid; clear: both; border-radius: 2px; padding: 0px; margin: 0px auto; height: 100%; height: 100vh; width: 100%; overflow: hidden; clear: both; } .image_full img { page-break-inside: avoid; border-radius: 2px; width: 100%; } .image_full a { padding: 0px; margin: 0px auto; width: 100%; height: 100%; } .image_full_caption { position: relative; text-align: center; page-break-before: always; page-break-after: always !important; page-break-inside: avoid; clear: both; padding: 0px; margin: 0px auto; width: 100%; height: 100%; height: 100vh; overflow: hidden; clear: both; } .image_full_caption img { page-break-inside: avoid; border-radius: 2px; width: 85%; } .cover_image { position: relative; text-align: center; padding: 0px; margin: 0em auto; width: 100%; height: 100%; height: 100vh; page-break-inside: avoid; clear: both; } .cover_image img { width: 100%; height: auto; page-break-inside: avoid; } .brand_logo_solo { margin-top: 25%; text-align: center; page-break-inside: avoid; width: 30%; } .brand_logo_solo img { page-break-inside: avoid; width: 100%; } @supports (display: flex) { .cover_image, .image_full, .image_full_caption, .brand_logo_solo, .vertical_center { height: 100%; height: 100vh; margin-top: 0px !important; display: -webkit-flex; display: flex; flex-direction: column; justify-content: center; align-items: center; page-break-before: always; page-break-after: always; text-align: center; } .brand_logo_solo img, .vertical_center figure { margin-top: -60px; } } /* ==================== Plate Section Images ==================== */ .plate_image_portrait { text-align: center; clear: both; border-radius: 2px; width: 90%; } .plate_image_portrait img { page-break-inside: avoid; border-radius: 2px; width: 70%; margin: auto; } .plate_image_landscape { text-align: center; clear: both; border-radius: 2px; width: 90%; } .plate_image_landscape img { page-break-inside: avoid; border-radius: 2px; width: 100%; margin: auto; } .plate_image_portrait figcaption, .plate_image_landscape figcaption { text-align: justify; font-size: 0.9em; } /*--Alternate Plate Section--*/ .plate_image_portrait_alt { text-align: left; clear: both; border-radius: 3px; width: 90%; } .plate_image_portrait_alt img { page-break-inside: avoid; border-radius: 3px; width: 40%; margin: auto; } .plate_image_landscape_alt { text-align: left; clear: both; border-radius: 3px; width: 90%; } .plate_image_landscape_alt img { page-break-inside: avoid; border-radius: 3px; width: 70%; margin: auto; } .plate_image_portrait_alt figcaption, .plate_image_landscape_alt figcaption { text-align: justify; font-size: 1em; } span.caption_xsmall { font-size:0.8em; display:block; margin-bottom:1em; } .plate_image_portrait_alt + figure, .plate_image_landscape_alt + figure { margin-top:3em; } /* ============================================================ TABLES ============================================================ =========== HTML Tables =========== */ table { font-size: 0.8em; margin: 1em auto 1em auto; } figure table { margin: 0px auto; } table, th, td { border: 1px solid; } th, td { padding: 10px; } table + p { text-indent: 0em; } figure.horizontal_table_group { width: 100%; text-align: center; } .horizontal_table_group table { display: inline-block; border-width: 0px; } /* ================== Image-based Tables ================== */ .image_table { text-align: center; page-break-inside: avoid; clear: both; margin: 1.5em auto; width: 100%; } .image_small_table { text-align: center; page-break-inside: avoid; clear: both; margin: 1.5em auto; width: 50%; } .image_table img, .image_small_table img { page-break-inside: avoid; width: 100%; } .image_table + .image_table { margin-top: -1.5em; } /* ============================================================ PULLQUOTES AND TEXTBOXES ============================================================ */ .txt_box { page-break-inside: avoid; width: 85%; margin: 1em auto; font-style: italic; padding: 10px 0px; border-top: 1px solid #000; border-bottom: 1px solid #000; clear: both; } .txt_box h5 { text-align: center; margin: 0px auto 0.5em auto; font-style: normal; font-weight: bold; } .txt_box p { margin: 0em; text-indent: 0em; text-align: center; } /* ===== Box 2 ===== */ .txt_box2 { page-break-inside: avoid; width: 85%; margin: 1em auto; font-style: italic; padding: 10px 2%; background-color: #eee; border: 1px dotted #adadad; border-radius: 2px; clear: both; } .txt_box2 h5 { text-align: center; margin: 0px auto 0.5em auto; font-style: normal; font-weight: bold; } .txt_box2 p { margin: 0em; text-indent: 0em; text-align: center; } /* ===== Box 4 ===== */ .txt_box4 { page-break-inside: avoid; width: 85%; margin: 1em auto; font-style: italic; padding: 0px; text-align: center; overflow: hidden; clear: both; } .txt_box4 h5 { text-align: center; margin: 0px auto 0.5em auto; font-style: normal; font-weight: bold; } .txt_box4 p { margin: 0em; text-indent: 0em; text-align: center; } .txt_box4 .textbox_border_image { width: 100%; } .txt_box4 .textbox_border_image:last-of-type { margin-top: 0.5em; } /* ===== Box 5 ===== */ .txt_box5 { page-break-inside: avoid; width: 80%; margin: 1em auto; padding: 5px 10px 10px 10px; background-color: #a13f3f; border-left: 15px solid #5f0f0f; border-right: 15px solid #5f0f0f; border-top: 2px solid #5f0f0f; border-bottom: 4px solid #5f0f0f; font-size: 1.4em; color: #f0dada; border-radius: 2px 45px 2px 45px; clear: both; } .txt_box5 h5 { text-align: left; margin: 0px auto 0.5em auto; font-style: normal; font-weight: bold; } .txt_box5 p { margin: 0em; font-style: normal; font-weight: normal; text-indent: 0em; text-align: left; padding-left: 10px; } /* ===== Box 6 ===== */ .txt_box6 { width: 40%; float: right; margin: 0em auto 0.5em 0.75em; font-style: italic; padding: 0px 0px 0px 5px; border-left: 15px solid #eee; font-size: 1.5em; clear: both; } .txt_box6 h5 { text-align: left; margin: 0px auto 0.5em auto; font-style: normal; font-weight: bold; } .txt_box6 p { margin: 0em; text-indent: 0em; text-align: left; } /* ===== Box 7 ===== */ .txt_box7 { page-break-inside: avoid; font-size: 0.8em; font-style: normal; text-align: justify; margin: 1em auto; border: 1px solid #6bad81; border-radius: 2px; width: 90%; clear: both; } .txt_box7 p { padding: 10px; text-indent: 0px; } .txt_box7 p + p { padding-top: 0px; margin-top: -0.5em; } .txt_box7 h5 { display: block; background-color: #6bad81; /* Must match border color. */ color: #fff; font-style: normal; font-weight: bold; margin-bottom: 0em; padding: 4px 4px 4px 10px; text-transform: capitalize; } /* ===== Box 8 ===== */ .txt_box8 { width: 95%; margin: 1em auto; padding: 5px 10px; background-color: #eee; border: 1px solid #b7b5b5; border-radius: 2px; clear: both; } .txt_box8 h5 { text-align: left; margin: 0px auto 0.5em auto; font-style: normal; font-weight: bold; page-break-after: avoid; } .txt_box8 p { text-align: left; font-style: normal; } /* ===================== Box 9: Offset Tip Box ===================== */ .txt_box9 { width: 90%; position: relative; page-break-inside: avoid; font-size: 0.8em; font-style: normal; text-align: center; padding: 0px 10px 12px 10px; margin: 2em auto 1.5em auto; /* Top margin of 2em creates space for the offset header within. Otherwise should be 1em */ border: 1px dashed #202020; border-radius: 3px; overflow: visible; clear: both; } .txt_box9 p { text-indent: 0px; text-align: inherit; margin: 0.5em auto 0em auto; } .txt_box9 h5 { width: 100%; page-break-inside: avoid; text-align: inherit; margin: -0.75em auto 0em auto; color: #000; font-weight: normal; font-size: 1.5em; line-height: 1.5em; } .txt_box9 h5 > span { display: inline-block; padding: 0px 6px; background-color: #fff; } /* ================================== Box 9b: Offset Tip Box (Example 2) ================================== */ .txt_box9b { width: 85%; position: relative; page-break-inside: avoid; font-size: 0.8em; font-style: normal; text-align: center; padding: 0px 10px 12px 10px; margin: 2em auto 1.5em auto; border: 1px solid #840126; border-radius: 3px; overflow: visible; clear: both; } .txt_box9b p { text-indent: 0px; text-align: inherit; margin: 0.5em auto 0em auto; color: #840126; } .txt_box9b h5 { width: 80%; page-break-inside: avoid; text-align: inherit; margin: -0.6em auto 0em auto; padding: 3px 0px; color: #fff; font-weight: normal; font-size: 1.1em; line-height: 1.1em; text-transform: capitalize; background-color: #840126; border-radius: 3px; } /* ============================================================ INGREDIENT LISTS ============================================================ */ .ingredient_wrapper { width: 70%; margin: 1em auto 1.5em 1em; font-style: normal; font-size: 0.9em; text-align: left; } .ingredient_wrapper_inline { width: 95%; margin: 1em auto 1.5em 1em; font-style: normal; font-size: 0.9em; text-align: left; } .ingredient_header { font-weight: bold; font-style: normal; font-size: 1em; margin-bottom: 0.5em; margin-top: 0em; text-align: inherit; } ul.ingredient_items { padding: 0px; margin-top: 0px; list-style-type: none; text-align: inherit; } ul.ingredient_items li { margin-left: 0.5em; text-indent: -0.5em; text-align: inherit; } .ingredient_wrapper_inline .ingredient_items li { display: inline; margin-left: 0px; padding: 0px 2.5px 0px 0px; text-indent: 0px; text-align: inherit; } /* ============================================================ AUDIO & VIDEO ============================================================ */ .media_wrapper { text-align: center; border-radius: 3px; margin: 1.5em auto; padding: 0px; width: 100%; page-break-inside: avoid; } audio { width: 50%; border-radius: 2px; } video { border-radius: 2px; } img.nomedia_warning { background-repeat: no-repeat; background-position: center center; } /* ============================================================ POETRY ============================================================ */ .poetry_stanza, .numbered_paragraphs { margin: 1em 10% auto 0px; width: 90%; overflow: visible; text-align: justify; } .poetry_line { text-align: left; margin-left: 0.5em; text-indent: -0.5em; } .poetry_line_indented { text-align: left; margin-left: 1.5em; text-indent: -0.5em; } .line_number { text-indent: 0em; text-align: right; width: 7%; margin: 0.4em -9% auto auto; padding: 0em; font-size: 65%; display: inline-block; float: right; } /* ============================================================ NOEMOJI FIX Prevent webkit from converting entities to emoji ============================================================ */ .noemoji { font-family: "noemoji"; font-size: inherit; font-weight: normal; } /* ============================================================ DIVISIONAL BRANDING ============================================================ @font-face { font-family: "font-puffin"; font-weight: normal; font-style: normal; src: url(../prh_core_assets/fonts/PufBkyR.otf); } @font-face { font-family: "font-puffin"; font-weight: bold; font-style: normal; src: url(../prh_core_assets/fonts/PufBkyB.otf); } @font-face { font-family: "font-ladybird"; font-weight: normal; font-style: normal; src: url(../prh_core_assets/fonts/ladybird563-regular.otf); } @font-face { font-family: "font-ladybird"; font-weight: bold; font-style: normal; src: url(../prh_core_assets/fonts/ladybird563-bold.otf); } @font-face { font-family: "font-penguin"; font-weight: normal; font-style: normal; src: url(../prh_core_assets/fonts/avantgarde-regular.otf); } @font-face { font-family: "font-penguin"; font-weight: bold; font-style: normal; src: url(../prh_core_assets/fonts/avantgarde-bold.otf); } @font-face { font-family: "font-vintage"; font-weight: normal; font-style: normal; src: url(../prh_core_assets/fonts/avenir-light.otf); } @font-face { font-family: "font-vintage"; font-weight: bold; font-style: normal; src: url(../prh_core_assets/fonts/avenir-heavy.otf); } @font-face { font-family: "font-pelican"; font-weight: normal; font-style: normal; src: url(../prh_core_assets/fonts/avenirrounded-regular.otf); } @font-face { font-family: "font-pelican"; font-weight: bold; font-style: normal; src: url(../prh_core_assets/fonts/avenirrounded-bold.otf); }*/ .banner_penguin, .banner_pelican, .banner_puffin, .banner_ladybird { display: block; margin-top: 0px; margin-bottom: 1.5em; padding: 20px 10px; text-align: left; font-weight: bold; font-size: 2em; border-radius: 2px; background-repeat: no-repeat; background-size: auto 100%; } .banner_penguin { font-family: "font-penguin"; color: #FFF; background-color: #ff662b; /* background-image: url("../xhtml/prh_core_assets/images/banner.png"); */ background-position: right center; } .banner_pelican { padding: 30px 10px 30px 2.5em; font-size: 1.6em; letter-spacing: 0.1em; font-family: "font-pelican"; color: #000; background-color: transparent; /*background-image: url("../images/banner.png"); */ background-position: left center; } @media amzn-kf8 { .banner_pelican { padding-left: 2.2em; } } .banner_puffin { font-family: "font-puffin"; color: #FFF; background-color: #f4cf00; /*background-image: url("../images/banner.png"); */ background-position: right center; } .banner_ladybird { font-family: "font-ladybird"; font-weight: normal; color: #FFF; background-color: #ef4023; /*background-image: url("../images/banner.png"); */ background-position: right center; } .readmore { line-height: 1.3em; text-align: center; margin: 22% auto 0 auto; font-weight: bold; font-size: 1.6em; page-break-inside: avoid; } .pelican_booklist li { margin-bottom: 0.5em; font-family: "font-pelican"; } .pelican_chapterheader { display:block; text-align: left; font-family: "font-pelican"; font-size: 3em; font-weight: bold; line-height: 1.2em; background-color: #33cccc; padding: 90px 50px 100px 50px; border-radius: 2px; } .pelican_chapterheader .firstline { display: block; font-size: 0.35em; letter-spacing: 0.1em; color: #FFF; text-transform: uppercase; } .puffin_advert { text-indent: 0px; text-align: center; font-family: "font-puffin"; } .puffin_advert p { margin-bottom: 0.5em; } .puffin_advert a, .puffin_advert a:visited { color: #f4cf00; text-decoration: none; } .vintage_backmatter { font-size: 1.2em; font-family: "font-vintage", sans-serif; width: 90%; margin: 15% auto 0px auto; } .vintage_backmatter p { margin-bottom: 1.5em; } .vintage_backmatter .vintage_text, .vintage_backmatter a, .vintage_backmatter a:visited { color: #e00034; font-weight: bold; text-decoration: none; } /* ---------------------------------------- END SYLES ---------------------------------------- Koko Ekong for Random House, 2012/2013 kekong@penguinrandomhouse.co.uk */