/* -- Updated 02/12/14, Chronicle Books LLC: Digital Production -- */ /* -- CB MAIN CSS -- */ /* ---- GENERAL ---- */ html, body { margin: 5px; padding:0; border-width: 0; -webkit-hyphens:none; -epub-hyphens:none; adobe-hyphenate:none; } div { page-break-inside: avoid; } /* ---- EMBEDDED FONTS ---- */ /* ---- normal is for regular text and should always be listed first. Do not use span classes for bold and italics, only and tags ---- */ @font-face { font-family: "Interstate-Regular"; src: url("../fonts/Interstate-Regular.otf"); } @font-face { font-family: "Interstate-Regular"; src: url("../fonts/Interstate-Bold.otf"); font-weight:bold; } @font-face { font-family: "Interstate-Regular"; src: url("../fonts/Interstate-RegularItalic.otf"); font-style:italic; } @font-face { font-family: "Interstate-Regular"; src: url("../fonts/Interstate-BoldItalic.otf"); font-weight:bold; font-style: italic; } @font-face { font-family: "Interstate-Light"; src: url("../fonts/Interstate-Light.otf"); } @font-face { font-family: "Interstate-Light"; src: url("../fonts/Interstate-LightItalic.otf"); font-style:italic; } @font-face { font-family: "Seria-Regular"; src: url("../fonts/Seria-Regular.otf"); } @font-face { font-family: "Seria-Regular"; src: url("../fonts/Seria-Italic.otf"); font-style:italic; } @font-face { font-family: "SeriaPro"; src: url("../fonts/SeriaPro.otf"); } /* ---- ALL MAIN P STYLES ARE HERE, NO NEED TO DUPLICATE ATTRIBUTES ---- */ p { margin: 0; text-align:left; font-size: 0.8em; text-indent: 0em; line-height: 1.2em; font-family: "", serif; /* -- EPUB 3 -- */ widows: 3; orphans: 3; word-wrap: break-word; overflow-wrap: normal; text-wrap: normal; } /* ---- LINKS ---- */ a { color: RGB(0,157,224); text-decoration: none; } /* ---- FRONT MATTER ---- */ .dedication { margin-top: 10%; text-align: center; font-size: 1.2em; line-height: 1.5em; } .acknowledgements { } /* ---- COPYRIGHT ---- */ div#copyright { font-size: 0.6em; font-family: "Interstate-Light"; text-align: left; line-height: 1.1em; } div#copyright p { font-family: "Interstate-Light"; margin-top: 1em; margin-bottom: 0em; } /* ---- TOC ---- */ .tocfm { font-family: "Interstate-Light"; margin-top: 0.6em; margin-bottom: 0.2em; } .tocfma { font-family: "Interstate-Light"; margin-top: 0.6em; margin-bottom: 2em; } .tocpart { font-family: "Interstate-Regular"; margin-top: 2em; margin-bottom: 0.5em; } .tocpart1 { font-family: "Interstate-Regular"; margin-top: 3em; margin-bottom: 0.5em; } .tocchap { font-family: "Interstate-Regular"; margin-top: 0.8em; margin-bottom: 0.1em; } .tocchap1 { font-family: "Interstate-Regular"; margin-top: 0.8em; margin-bottom: 0.1em; } .tocchap2 { font-family: "Interstate-Regular"; margin-top: 0.8em; margin-bottom: 0.1em; } .tocbm { font-family: "Interstate-Light"; margin-top: 0.6em; margin-bottom: 0.2em; } .tocbmt { font-family: "Interstate-Light"; margin-top: 3em; margin-bottom: 0.1em; margin-left: 0.8em; text-indent: -0.8em; } .toclev { font-family: "Interstate-Regular"; margin-top: 0.6em; margin-bottom: 0.1em; } .toclev1 { font-family: "Interstate-Regular"; margin-top: 0.6em; margin-bottom: 0.1em; } .toclev2 { font-family: "Interstate-Regular"; margin-top: 0.6em; margin-bottom: 0.1em; } /* ---- HEADER STYLES - Do not apply margins greater than 2em. Headers that follow text should have a top margin ----*/ h1, h2, h3, h4, h5, h6 {text-align: left; font-style:normal;} h1 { font-family: "Interstate-Regular"; font-weight: bold; margin-top: 1%; margin-bottom: 2%; font-size: 1.5em; } h2 { font-family: "Interstate-Regular"; font-weight: bold; margin-top: 1%; margin-bottom: 1%; } h3 { font-family: "Interstate-Regular"; font-weight: bold; margin-top: 3%; margin-bottom: 1%; } h4 { font-family: "Interstate-Regular"; font-weight: normal; margin-top: 1%; margin-bottom: 1%; } h5 {font-family: "Interstate-Regular"; font-weight: bold; margin-top: 3%; margin-bottom: 0; font-size: .7em; } h6 {} /* ---- Use the following for subheads that follow a header style---- */ .section_title { font-family: "Interstate-Regular"; font-weight: bold; margin-top: 2%; margin-bottom: 1%; } .section_hd { font-family: "Interstate-Regular"; font-weight: normal; margin-top: 1%; margin-bottom: 1%; text-align: right; } .chapter_title { font-family: "Interstate-Regular"; font-weight: normal; margin-top: 1%; margin-bottom: 0%; } .chapter_hd { font-family: "Interstate-Regular"; font-weight: bold; margin-top: 1%; margin-bottom: 3%; color: RGB(236,89,77); border-bottom: 3px solid RGB(0,0,0); padding-top: 0; padding-bottom: 2%; } .chapter_hd2 { margin-top: 0; margin-bottom: 1em; } .chapter_hd3 { margin-top: -.5em; margin-bottom: 1em; } /* ---- TEXT STYLES : do not apply margins greater than 2em ---- */ /* no indent styles, p.text_noindent is the default p tag for no indent with a bottom margin */ p.text_noindent { font-family: "Seria-Regular"; margin: 0 0 0 0; } p.first1_noindent { font-family: "Seria-Regular"; margin: 1.3em 0 0 0; } p.first2_noindent { font-family: "Interstate-Light"; margin: 1em 0 0 0; font-size: .7em; line-height: 1.5em; } p.first3_noindent { font-family: "Interstate-Light"; margin: 1em 0 0 0; font-size: .7em; } /* indent styles, p.text_indent is the default p tag for indent with a bottom margin */ p.text_indent { font-family: "Seria-Regular"; text-indent: 1em; } p.first1_indent { font-family: "Seria-Regular"; margin: 1em 0 0 0; text-indent: 1em; } p.first2_indent { font-family: "Interstate-Light"; margin: 0 0 0 0; text-indent: 1em; font-size: .7em; } p.text_indent1 { font-family: "Seria-Regular"; text-indent: 1em; margin-top: -1.2em; } p.text_indent2 { font-family: "Seria-Regular"; text-indent: 1em; margin-bottom: -1.2em; } /* basic left, right, center classes */ p.left { font-family: "Interstate-Light"; text-align: left; font-size: .7em; } p.right { font-family: "Interstate-Light"; margin: 1em 0 0 0; text-align: right; font-size: .6em; } p.center { font-family: "Interstate-Light"; margin: 1em 0 2em 0; font-size: .7em; } /* use p.chapter_hdnote for text that is after an introduction, but is different from the default p tags above */ p.chapter_hdnote { font-family: "Interstate-Regular"; margin: 0 0 1em 0; } p.chapter_hdnote1 { font-family: "Interstate-Regular"; margin: 1em 0 1em 0; } p.chapter_hdnote2 { font-family: "Interstate-Regular"; margin: 0 0 1em 0; font-size: .6em; } /* -- RECIPE BOOKS -- */ p.recipe_hdnote { font-family: "Interstate-Regular"; margin: 1em 0 1em 0; } .yield { size: .8em; text-align:center; font-weight: bold; } p.method_txt { font-family: "Interstate-Light"; text-indent: 0; margin-top: 1em; margin-bottom: 0; font-size: .7em; } /* ---- EXTRACT, PULL QUOTES, DISPLAY text ---- */ .drop_cap { font-size: 3em; font-weight: bold; height: auto; } .pull_quote { font-family: "Seria-Regular"; margin: 1em 0 1em 0; text-indent: 1em; } .display_type { } /* ---- CAPTIONS ---- */ .caption { font-family: "Interstate-Regular"; font-size:.5em; margin-top: 0.25em; margin-bottom: 0.2em; text-align:left; } .caption_1_hd {} .caption_1_txt { font-family: "Interstate-Light"; font-size:.5em; margin-top: 0.25em; margin-bottom: 0.2em; text-align:left; } .caption_2_hd {} .caption_2_txt {} /* ---- SIDE BARS ---- */ /* ---- add font family and font size to div.sidebar ---- */ div.sidebar { margin: 1em 0 0 1em; } .sidebar1_hd { font-family: "Interstate-Light"; margin-top: 0.5em; margin-bottom: 0.1em; margin-left: 1.2em; text-indent: -1.2em; font-size: .5em; } .sidebar1_hdnote { font-family: "Interstate-Light"; margin-top: 0.5em; margin-bottom: 0.1em; margin-left: 1em; } .sidebar1_txt { font-family: "Seria-Regular"; margin-left: 1em; } .sidebar2_hd { font-family: "Interstate-Regular"; margin: 1em 0 0 0; padding: 0.5em; background-color: RGB(255,255,255); border-bottom: 1px solid RGB(0,0,0); } .sidebar2_hdnote { font-family: "Interstate-Light"; margin-top: 0.1em; margin-bottom: 0.1em; margin-left: 2em; text-indent: -2em; font-size: .7em; } .sidebar2_txt { font-family: "Interstate-Regular"; margin-top: 0.5em; margin-bottom: 0.1em; margin-left: 1em; } p.sidebar5_txt { font-family: "Seria-Regular"; margin-left: 1em; font-size: 1em; } p.sidebar6_txt { font-family: "Interstate-Regular"; margin-top: 0.5em; margin-bottom: 0.1em; margin-left: 1em; font-size: .7em; } /* ---- LISTS ---- */ ol li { font-family: "Seria-Regular"; list-style-type: decimal; padding: 0px; margin-top: 0; margin-bottom: 0; font-size: .8em; } ol li.alternate_style { font-family: "Seria-Regular"; list-style-type: decimal; padding: 0px; margin-top: -1em; margin-bottom: 0; font-size: .8em; } ul li { font-family: "Seria-Regular"; list-style-type: disc; padding: 0px; margin-top: 0em; margin-bottom: 0em; font-size: .8em; } ul.alternate_style li { font-family: "Interstate-Light"; list-style-type: disc; padding: 0px; margin-top: 0.3em; margin-bottom: 0em; margin-right: 0.5em; } .ingred_sublist {} .footnotes { font-family: "Interstate-Light"; margin-top: 0.5em; margin-bottom: 0.1em; margin-left: 1.2em; text-indent: -0.7em; font-size: .5em; } .footnotes1 { font-family: "Interstate-Light"; margin-top: 2.5em; margin-bottom: 0.1em; margin-left: 1.2em; text-indent: -0.7em; font-size: .5em; } .footnotes2 { font-family: "Interstate-Light"; margin-top: 1.5em; margin-bottom: 0.1em; margin-left: 1.2em; text-indent: -0.7em; font-size: .5em; } /* ---- IMAGES ---- */ /* ---- Large images have no margin ---- */ div.wrap { vertical-align: top; text-align: center; margin: 1em 0 .5em 0; } /* ---- smaller images will have a margin ---- */ div.wrap_small { text-align: center; margin: 1em 0 .5em 0; } /* -- all images should have p tag -- */ p.image { text-align: center; margin:0.5em 0 0.5em 0; } p.image1 { text-align: left; margin:0.5em 0 0.5em 0; } /* -- images that are largest on the vertical side -- */ img.vertical { margin: 0; text-align: center; height: 90%; max-width: 100%; } /* -- images that are largest on the horizontal side -- */ img.horizontal { margin: 0; text-align: center; width: 100%; height: auto; } .image_bkg { margin: 0; background-repeat: no-repeat; background-size: contain; } .floatleft { float: left; width: 40%; margin: 10px 10px 10px 0; } .floatright { float: right; width: 40%; margin: 10px 10px 10px 0; } /* -- to be used within floatleft, floatright, and gallery divs -- */ img.float { width: 100%; height: auto; } /* -- used to create a grid of images -- */ .gallery_25 { width: 23%; float: left; padding: 1%; } .gallery_50 { width: 48%; float: left; padding: 1%; } div.clear { clear: both } div.pagebreak { page-break-after:always; } /* ---- FRACTIONS ---- */ sup { vertical-align: super; font-size: 0.7em; line-height: 0em; } sub { vertical-align: sub; font-size: 0.7em; line-height: 0em; } /* ---- TABLES ---- */ .table { font-family: "Interstate-Regular"; margin: 0 0 0 1em; font-size: .8em; } table { border-collapse: collapse; margin: 1em 0 0 0; text-align: left; font-size: .8em; } td, th { padding: 0px 0px; } /* ---- COLORS ---- */ /* -- ok to use span tags, change class name and attributes if needed, don't add classes -- */ span.red {color: RGB(155,3,48);} span.orange {color: RGB(236,89,77);} span.yellow {color: RGB(87,92,2);} span.green {color: RGB(87,151,133);} span.blue {color: RGB(32,28,63);} span.purple {color: RGB(204,153,255);} span.pink {color: RGB(255,153,204);} span.gray {color: RGB(153,153,153);} span.black {color: RGB(0,0,0);} span.font {font-family: "Interstate-Regular";} span.font2 {font-family: "SeriaPro"; font-size: x-small} span.font3 {font-family: "Interstate-Regular"; font-size: x-small;} span.font4 {font-family: "Interstate-Regular";} span.white {color: RGB(255,255,255);} p.indexmain { font-family: "Interstate-Light"; margin: 0 0 0 2em; text-indent: -2em; font-size: .7em; } p.imagel { text-align: left; margin:.5em 0 1.5em 0; } .section_hd1 { font-family: "Interstate-Regular"; font-weight: bold; margin-top: 1%; margin-bottom: 1%; text-align: right; } .chapter_hd1 { font-family: "Interstate-Regular"; font-weight: bold; margin-top: 1%; margin-bottom: 3%; color: RGB(236,89,77); border-bottom: 3px solid RGB(255,255,255); padding-top: 0; padding-bottom: 2%; } div.sidebar3 { margin: 0; background-color: RGB(82,178,231); padding: 2% 5% 5% 5%; } div.sidebar31 { margin: 0; background-color: RGB(82,178,231); padding: 2% 5% 5% 5%; page-break-before: always; } div.sidebar4 { margin: 0; background-color: RGB(213,230,247); padding: 2% 5% 5% 5%; } div.sidebar41 { margin: 1em 0 0 0; background-color: RGB(213,230,247); padding: 2% 5% 5% 5%; } div.sidebar57 { margin: 0; background-color: RGB(244,184,36); padding: 2% 5% 5% 5%; page-break-before: always; } div.sidebar58 { margin: 0; background-color: RGB(250,225,173); padding: 2% 5% 5% 5%; } div.sidebar97 { margin: 0; background-color: RGB(42,88,141); padding: 2% 5% 5% 5%; page-break-before: always; } div.sidebar98 { margin: 0; background-color: RGB(252,207,197); padding: 2% 5% 5% 5%; } .bgcolor { border-bottom: 1px solid RGB(0,0,0); background-color: RGB(255,255,255); } .borderbottom113 { border-bottom: 1px dashed RGB(0,0,0); } .bgcolora { background-color: RGB(255,255,255); } .borderbottom119 { background-color: RGB(255,255,255); border-bottom: 1px dashed RGB(0,0,0); }