/**/ @namespace MadCap url(http://www.madcapsoftware.com/Schemas/MadCap.xsd); span.mc-variable.Default\00002ERevision { } /**/ /* Based on ThalesFlareStyles.css Version 2019 RevA. Dec 2019 */ /* ==================================== Prism Syntax Highlighter Integration ==================================== If you want to use syntax highlighting, you can use Thales_Template-with-Prism.css or if you want to use the main Thales template: First, uncomment the following line: */ /* @import url('../PlugIns/SyntaxHilite/Prism/prism.css'); */ /* Second, change mc-hidden from 'hidden' to 'unhidden' below to make the code style variations accessible through the Flare UI: */ code, code.language-clike, code.language-css, code.language-docker, code.language-git, code.language-java, code.language-javascript, code.language-json, code.language-markup, code.language-perl, code.language-python, code.language-sql { font-family: "Courier New", "Inconsolata", "Consolas", monospace; mc-hidden: hidden; /* Default: hidden. Set to unhidden to use Prism Integration. */ } /* ============================ Notes for future generations ============================ For some styles there are print-only properties (such as page break info) defined in the main style because Flare automatically ignores those properties in the HTML output. Technically, all print-related stuff should be defined in the @print media section at the end of the style sheet, but honestly, it's easier to work with the styles if as much as possible is defined in the default css media rather than in a media section. Therefore, all properties that can be defined in the main style are defined there. margin-top vs margin-bottom. Who knew this was on the level of the Windows vs Mac debate? One thing all agree on though is to be consistent. So I have consistently used margin-top because that makes more intuitive sense to me. (You want headers to be further from the text above them and closer to the text below them, so it's the top margin you want to manipulate.) See https://matthewjamestaylor.com/css-margin-top-vs-bottom Page size note: This template was designed for the default letter size, 8.5 x 11. The Gemalto templates use a custom size of 210 mm x 279 mm, which means the page will fit on either letter or A4 paper. If the page layouts ever switch to the custom size, margins may need to be reevaluated for the PDF. Font size note: I originally used px for font sizes in HTML, which is not a good idea. I tried to change all that over using ems, but ran out of time. So instead I used rems, which is not as clean but which will gloss over lingering issues. What should happen is all font-size definitions should be removed from the default media for everything *except* html, body, p.sectionHeading (because that pretends to be a heading) and regular headings. When you do this, be very careful not to lose the size information in the Print media style or you'll screw up the PDF!! Also remember that the actual sizes are set by CSS variables so they can be easily changed. Sections in this CSS: Here's the order of the tag categories in case you're looking for something specific: 1. Variables and Generic Classes 2. Bookkeeping and Global Defaults 3. Chapter and Appendix Titles 4. Headings 5. Paragraph Styles 6. Tables and Table-Related Complex Selectors 7. Lists and List-Related Complex Selectors 8. Figures and Figure Captions 9. Notes, Cautions, & Warnings 10. Drop-Down Text 11. Reviewer Information and Writer Notes 12. Spans (aka Character Styles) 13. TOCs and Mini TOC Styles 14. Snippets and Other Special Formats 15. Links and Hover Behavoir 16. Glossaries and Indexes 17. HTML5 Responsive Styles 18. Print-Specific Styles (@media print) 19. Tablet-Specific Styles (@media tablet) 20. Mobile-Specific Styles (@media mobile) 21. Deprecated Styles */ /* ============================= Variables and Generic Classes ============================= */ /* These color and font family variables are Thales Standards as of 2019. */ :root { /* The colors are hardcoded in table style sheets and in the Note/Tip autonumber formats. Keep in sync. Note: Color-LightAccent has a print version and a web version. The others are used in both mediums. */ --Color-DarkAccent: #242A75; --Color-LightAccent: #00bbdd; --Color-DarkGray: #253746; --Color-LightGray: #DDE4EC; --Color-Body: #000000; --Color-Links: blue; --Color-Caution: #E1CD00; --Color-Warning: #ff0000; /* The background color for notes and tips is a bit tricky, as the color varies from monitor to monitor. It looks a touch dark on a native laptop screen or a good monitor, but it's pale to non-existant on the larger monitors here at the SJ office. Made it a variable so it's easy to change if we decide to. */ --Color-NotesTipsBkgrnd: #f5f5f5; /* Default font families. */ --FontFamily-Headings: Arial, "Helvetica Neue", sans-serif; --FontFamily-Monospace: "Courier New", "Inconsolata", "Consolas", monospace; /* Default font sizes. FontSize-Table and FontSize-MonoTable are used in tables. Font-Small is used in running headers/footers, and the copyright page in PDF. These variables may be overkill, but it's much easier to see the relative sizes in each medium this way. */ --FontFamily-Body: Arial, "Helvetica Neue", sans-serif; --FontFamily-TableFigCaptions: Arial, "Helvetica Neue", sans-serif; --FontFamily-TitlePagedocTitle: Arial, "Helvetica Neue", sans-serif; --FontFamily-TitlePageSubHeads: Arial, "Helvetica Neue", sans-serif; --FontSize-Body: .8rem; --FontSize-ChapTitle: 1.7rem; --FontSize-h1: 1.7rem; --FontSize-h2: 1.4rem; --FontSize-h3: 1.1rem; --FontSize-h4: 1rem; } .allowBreaksInside /* Generic class used in print output to play with page breaks. Can be applied to any element but generally needed on pre and li. */ { page-break-inside: auto; } .centered /* Generic class that centers the text. Can be used anywhere but is mainly for table column titles and row entries. */ { text-align: center; } .keepWithNext /* Generic class used in print output to play with page breaks. Can be applied to any element but is generally just used on a p tag. */ { page-break-after: avoid; } .keepWithNext + ol, .keepWithNext + ul /* If the element preceding a list is styled keepWithNext, reduce top margin on that element slightly. You only want to do this on a list though, because ppl may be using it just to adjust page breaks and they don't want the spacing to change. */ { margin-top: 8px; } .ntoc /* Generic style that keeps a heading from appearing in the TOC. Proposal: keep specific heading h2.ntoc and maybe h3.ntoc, but remove this. */ { mc-heading-level: 0; mc-next-tag: p; } .singleSpaced /* Generic class that sets the top margin to 3px. Lists need to be handled with complex selectors. */ { margin-top: 3px; } ol.singleSpaced li, ul.singleSpaced li /* For lists, what you gets depends on where you put the singleSpaced class definition. If you put it on the p inside an li, nothing can override the margins on the li. But this covers putting the singleSpaced class on the li tags (any kind of list) or putting the singleSpaced class on the ol or ul tag. For the latter cases, you also need to accomodate for p tags being inside the li. */ { margin-top: 3px !important; } .uppercase /* Generic class that forces all text to be uppercase. Used in copyright but can be used anywhere. */ { text-transform: uppercase; } /* =============================== Bookkeeping and Global Defaults =============================== */ html /* Set base size for em calculations. Default browser size is 16px. */ { font-size: 100%; } body /* Set default font family and size for inheritence. */ { font-family: Arial, "Helvetica Neue", sans-serif; margin: 0px; mc-hyphenate: never; font-size: .8rem; } div, h1, h2, h3, h4, p, pre, ul, ol, li, td /* Sets all margins to 0px for the main block tags so the spacing is actually being controlled by the CSS and not the browser defaults. Also sets defaults for hyphenation and widows/orphans. */ { margin: 0px; mc-hyphenate: never; orphans: 3; widows: 3; } /* CSS tags that authors don't ever need to see. Note that these tags are hidden in the UI but not disabled. */ abbr, acronym, address, area, article, aside, big, blockquote, button, canvas, center, cite, col, colgroup, datalist, del, dir, em, fieldset, form, footer, frame, frameset, head, header, hr, ins, kbd, label, link, map, MadCap|helpControlMenuItem, MadCap|slideThumbnail, q, samp, small, span.boolean, span.state, strong, tt, var { mc-hidden: hidden; } p.ImportIssueToFix /* If you're importing from Word or Frame, this tag is here in case there's no exact match--like for footnotes, because Flare doesn't let you assign the MadCap|footnote tag to the Frame equivalent. This just makes it easier to find possible import issues after the content is in Flare. Also adds ReviewComment condition. */ { margin-top: 10px; mc-conditions: 'Global.ReviewComment'; border: solid 1px #228b22; border-radius: 8px; padding: 4px; mc-hidden: hidden; } /* =========================== Chapter and Appendix Titles =========================== */ h1.chapter /*Autonumber adds "Chapter : " in print media. You set the sequence using the topic properties in the TOC file.*/ { font-size: 1.7rem; mc-heading-level: 1; margin-top: 15px; } h1.appendix /*Autonumber adds "Appendix : " in print media. You set the sequence using the topic properties in the TOC file.*/ { font-size: 1.7rem; mc-heading-level: 1; margin-top: 15px; } h1.chapterNoNumber, h1.preface, h1.index /* chapterNoNumber used for the Preface, Glossary, Index and any other place where you want a Chapter-level title that is in the TOC but has no autonumbering. chapterNoNumber replaces h1.preface and h1.index in Gemalto stylesheet. See decremented tags section at end. */ { font-size: 1.7rem; margin-top: 0px; mc-heading-level: 1; } h1.contents /* This tag is hidden because people should be using the included template contents file. If they really really need it, I tell them how to get it in the Template User Guide. */ { font-size: 1.7rem; mc-auto-number-format: 'Contents'; mc-heading-level: 0; /* heading-level 0 keeps title out of the TOC */ mc-hidden: hidden; margin-top: 15px; } h1.releaseNotes /* Used for release and patch notes. This heading is meant to hold the Product Name. */ { margin-top: 0px; mc-heading-level: 0; /* heading-level 0 keeps title out of the TOC */ text-align: center; font-size: 25 pt; } /* ========== Headings ========== */ /* Print media reminder: PDFs can be generated using TOC depth for heading level. That means that header tags can change dynamically based on where the topic falls in the TOC. This is extremely powerful, but it does mean that heading levels get bumped down. The only h1 in any given chapter is h1.chapter, h1.appendix, or h1.chapterNoNumber. h1 tags become h2s, h2s become h3s, h3s become h4s, and h4s becomes h5s. Unfortunately, in order for the CSS to distinguish between PDFs built with the toc depth option and PDFs built as-is, we'd need another @media that would then have to be maintained. So I have chosen to let the headers differ in size by 2 pts. This does mean, however, that h5 needs to be a viable heading tag in print media, so the Gemalto usage of h5 as a procedure lead in tag needs to change. */ /* Gemalto Migration Requirements: Gemalto topics start with an h2, not h1. This template supports both styles by setting the font size of h1 and h2 to be the same, and then dropping the font size of h2 if there is an h1 in the topic. Likewise, h3 is set to the size of a regular h2 and h4 is set to the size of a regular h3. Both are dropped down in size if an h1 is in the topic. */ h1 /* First level heading. If the PDF is built using the TOC Depth option, this style will never be used in the PDF. */ { color: #242A75; font-family: Arial, "Helvetica Neue", sans-serif; page-break-after: avoid; page-break-before: auto; font-size: 1.7rem; mc-heading-level: 1; margin-top: 15px; } h2 /* Second level heading. Note that it is the same size as a regular h1 in the HTML to support Gemalto's policy of starting a topic with an h2. This is also the style assigned to h1 source tags in a PDF if the PDF is built using the TOC Depth option. */ { color: #242A75; font-family: Arial, "Helvetica Neue", sans-serif; page-break-after: avoid; font-size: 1.7rem; margin-top: 20px; } h1 ~ h2, h1 ~ h2.ntoc /* If there is an h1 in the topic, decrease the size of all h2s. */ { font-size: 1.4rem; } div.nocontent { mc-hidden: hidden !important; } div.nocontent + h1, div.nocontent + h2 /* Set the top margin for an h1 or h2 immediately following the breadcrumb div at the top of the HTML page. */ { margin-top: 10px; mc-hidden: hidden !important; } h3 /* Third level heading. Note that it is the same size as a regular h2 in the HTML to support Gemalto's policy of starting a topic with an h2. This is also the style assigned to h2 source tags if the PDF is built using the TOC Depth option. */ { font-family: Arial, "Helvetica Neue", sans-serif; color: #242A75; margin-top: 20px; page-break-after: avoid; font-size: 1.4rem; } h1 ~ h3 /* If there is an h1 in the topic, decrease the size of all h3s. */ { font-size: 1.1rem; } h4 /* Fourth, and lowest supported level heading. Note that it is the same size as a regular h3 in the HTML to support Gemalto's policy of starting a topic with an h2. This is also the style assigned to h3 source tags if the PDF is built using the TOC Depth option. */ { font-family: Arial, "Helvetica Neue", sans-serif; color: #242A75; margin-top: 20px; page-break-after: avoid; font-size: 1.1rem; } h1 ~ h4 /* If there is an h1 in the topic, decrease the size of all h4s. */ { font-size: 1rem; } h5 /* In HTML, this style should never be used. In PDF, this style maps to an h4 in the source topic if the PDF is built using the TOC Depth option. Gemalto note: This style needs to be migrated to p.toHeading. */ { font-family: Arial, "Helvetica Neue", sans-serif; font-size: .8rem; color: #000000; page-break-after: avoid; mc-heading-level: 0; font-weight: bold; mc-hidden: hidden; margin: 10px 0 0; } h6 /* This style should never be used in HTML or PDF. */ { font-family: Arial, "Helvetica Neue", sans-serif; font-size: .8rem; mc-hidden: hidden; mc-heading-level: 0; margin: 10px 0 0; font-weight: bold; } /* ================ Paragraph Styles ================ */ p /* Base Body Paragraph Style. */ { font-family: Arial, "Helvetica Neue", sans-serif; color: #000000; font-weight: normal; margin-top: 10px; margin-left: 0px; } p.code /* Monospace paragraph style when a span is just not enough. */ { font-family: "Courier New", "Inconsolata", "Consolas", monospace; } p.tableStep /* A centered, numbered paragraph. Used for procedure overview tables. Note that the series is automatically restarted for new tables. */ { text-align: center; mc-auto-number-format: 'S:{n+}'; } p.code + p.code /* If a code para is followed by another code para, make it single spaced. */ { margin-top: 3px; } p.releaseNoteIssue /* Bold paragraph for a resolved or known issue in a release or patch note. */ { font-weight: bold; } p.toHeading /* Use this as an optional intro paragraph to a procedure. It's the 'To do...' heading that replaces the deprecated Gemalto h5 tag. */ { page-break-after: avoid; font-weight: bold; margin-top: 12px; } p.sectionTitle /* Looks like an h3 but doesn't show up in the TOC. Used especially with Prerequisits and Procedure titles in procedures. */ { font-family: Arial, "Helvetica Neue", sans-serif; color: #242A75; font-weight: bold; margin-top: 20px; page-break-after: avoid; font-size: 1.1rem; } p.toHeading + ol, p.toHeading + ul /* Reduce top margin on the ol and ul tag if it's preceded by p.toHeading. */ { margin-top: 8px; } pre /* Monospace style for multiple lines of code that need to respect whitespace. */ { font-family: "Courier New", "Inconsolata", "Consolas", monospace; color: #000000; font-weight: normal; margin-top: 10px; mc-next-tag: p; white-space: pre; } li pre /* Reduce top margin if pre is inside a list. */ { margin-top: 6px; } pre.smallestFont /* Used for wide code samples in PDFs. Sets it to 7pt in PDF, normal size in HTML */ { } li pre.smallestFont /* Used for wide code samples in lists in PDFs. Sets it to 6pt in PDF, normal size in HTML */ { } /* ========================================== Tables and Table-Related Complex Selectors ========================================== */ table /* Note: The mc-auto-number-format resets the S numbering series in case there are two tables in the topic that both use p.tableStep. */ { font-weight: normal; mc-caption-repeat: true; mc-caption-continuation: ' (continued)'; margin-top: 10px; mc-auto-number-format: 'S:{ =0}'; } caption /* This is the basic table caption. Strangely, css does not have a dedicated image caption tag, so this is table-specific. */ { font-family: Arial, "Helvetica Neue", sans-serif; text-align: left; padding-bottom: 8px; font-weight: bold; } caption p /* Just in case someone puts a p tag in the caption tag, need to change the display properties of the para to inline. The color looks slightly different, but I can't figure out why. Fortunately, adding a p tag in a caption isn't that easy, so I'm letting this ride. */ { display: inline; font-family: Arial, "Helvetica Neue", sans-serif; } tr { page-break-inside: avoid; orphans: 1; } th, p.th, th p /*Table column headers. The p.th is to support the deprecated Gemalto tag. */ { font-family: Arial, "Helvetica Neue", sans-serif; } td /* Setting the default values for text in a table, but it's really better to use a p tag. So there's a complex selector for that. */ { font-family: Arial, "Helvetica Neue", sans-serif; } td > p:first-child /* Sets the top margin of the first para in a table cell, and all paras inside an li inside a table cell, to 0. */ { margin-top: 0px !important; } td > p, td li > p /* Para inside a table cell (could be inside an li). Sets font size, reduces top margin. */ { margin-top: 3px !important; } td p + ol, td p + ul /* Para inside a table cell followed by a list. Decreases top margin for the list. */ { margin-top: 3px !important; } td p.figurePara /* Figure para inside a table. Sets smaller margin above. */ { margin-top: 5px !important; } td ul /* Bullet list inside a table cell. Reduces top margin, sets padding. */ { margin-top: 0px !important; padding-left: 20px !important; margin-left: 5px; } td ul ul /* If a list in a table is nested inside a list, remove left margin. */ { margin-left: 0px; } td ol /* Ordered list inside a table cell. The margin controls the distance from the cell wall to the list number and the padding is the distance from the number to the text. */ { margin-top: 0px !important; padding-left: 16px; margin-left: 5px; } td li /* List items inside a table cell. Reduces top margin and sets padding. Note that PDF requires a negative top margin to achieve the same effect. */ { margin-top: 3px !important; } li td ol /* If a list in a table is nested inside a list, change left margin. */ { margin-left: 10px; } li td li /* List items inside a table cell that is itself in a list. Reduces top margin and sets padding. Note that PDF requires a negative top margin to achieve the same effect. */ { margin-top: 3px !important; } td span.mono, td span.monoBold, td span.monoBoldItalic, td span.monoItalic /* Monospace inside a table. Sets font size. */ { } td pre, td p.code /* Reduce top margin if and sets font size if pre or p.code is inside a table. */ { margin-top: 3px; } /* ======================================== Lists and List-Related Complex Selectors ======================================== */ /* Note: For the complex selectors that you need when lists are in tables, see the Tables section. */ ol /* For lists, margin-left is the indent, and padding-left affects the spacing between the numbers and the text. Note: font-weight is important here. Ran into an issue with a nested list where the li became bold due to some strange inheritance thing. */ { font-family: Arial, "Helvetica Neue", sans-serif; font-weight: normal; margin-top: 10px; margin-left: 5px; padding-left: 25px; page-break-before: avoid; } ul /* For lists, margin-left is the indent, and padding-left affects the spacing between the numbers and the text. */ { font-family: Arial, "Helvetica Neue", sans-serif; font-weight: normal; page-break-before: avoid; margin-top: 10px; margin-left: 5px; padding-left: 25px; list-style-type: disc; } li /* list item inside and ol or ul tag. Text-indent controls the space between the number/bullet and the text. */ { margin-top: 10px; orphans: 3; page-break-inside: avoid; } ol :nth-child(1), ul :nth-child(1), li :nth-child(1) /* First element inside an ol, ul, or li. Removes top margin from that element (and only that element). Flagged as !important so it overrides other style alterations. */ { margin-top: 0px !important; } li p /* Para inside an li (that is not the first child). Reduces top margin. */ { margin-top: 6px; } li ul /* Reduce top margin and change left padding if a list is nested inside another list. */ { margin-top: 6px; padding-left: 20px; } li ol /* Reduce top margin and change left padding if a list is nested inside another list. */ { margin-top: 6px; padding-left: 16px; } li li /* Reduce top margin for li elements if in a list is nested inside another list. */ { margin-top: 6px; } li div.note { } li p.note { margin-bottom: 10px; margin-top: 10px; } ol > li > ol /* ol inside an ol with no intervening tags. Accounts for cases where you have a list in another element (such as a table) that is itself nested inside an li. */ { list-style-type: lower-alpha; margin-left: 0px; padding-left: 17px; } ol > li > ol > li > ol /* This really should come with a warning not to use this much nesting, but instead it goes to lower roman.*/ { list-style-type: lower-roman; padding-left: 15px; } ul > li > ul /* ul inside a ul with no intervening tags, goes to open circle bullet. */ { list-style-type: circle; } ul > li > ul > li > ul /* ul inside a ul, goes to square bullet. */ { list-style-type: square; } dt { page-break-after: avoid; } dt, dt p /* Definition list term or p inside a dt */ { font-weight: bold; margin-top: 10px; } dd, dd p /* Definition list description or p inside a dd */ { margin-top: 6px; margin-left: 15px; } dd ul /* Change margin of a ul inside a dd */ { top-margin: 6px; } dd ol /* Change margin of a ol inside a dd */ { padding-left: 14px; top-margin: 6px; } dd ol li p, dd ul li p /* If there's a p tag in the li, you need to reduce the text indent. */ { text-indent: -15px; } dd li /* Change top margin of li inside a dd */ { margin-top: 6px; } div.indentedSingleSpaced /* Indents whatever's inside it. Using p tags in this give you a single spaced simple list. */ { margin-left: 15px; mc-hidden: unhidden; } div.indentedSingleSpaced p /* This basically becomes a simple, single spaced list. */ { margin-top: 3px; } div.indentedSingleSpaced p.toHeading, div.indentedSingleSpaced p.note, div.indentedSingleSpaced p.tip, div.indentedSingleSpaced p.caution, div.indentedSingleSpaced p.cautionESD, div.indentedSingleSpaced p.cautionVolts, div.indentedSingleSpaced p.warning /* Leave the margin alone if one of these fancy paras is part of the indented section. */ { margin-top: 10px; } /* =========================== Figures and Figure Captions =========================== */ img { border: none; max-width: 95%; max-height: auto; } img.addBorder { border: solid 1px #000000; } img.minimizeBorder { border: solid 1px #000000; mc-thumbnail: popup; } img.minimizeNoBorder { border: none; mc-thumbnail: popup; } /* I have created specialized p tags for figures because I cannot figure out how to insert a
tag into a Flare topic using the UI. And I don't want people to be forced to use a snippet. But if they ever do support that, then figure and figurecaption should look the same as their p-tag counterparts. */ figurecaption, p.figureCaption /* Separate para for the Figure caption, as the img tag does not have a caption built in the way a table tag does. Gives a bit more space before as figures generally need a bit more room. */ { font-family: Arial, "Helvetica Neue", sans-serif; text-align: left; margin-left: 20px; margin-top: 15px; margin-bottom: 8px; font-weight: bold; mc-next-tag: p; mc-next-class: 'figurePara'; } figure, p.figurePara /* There is no way to center an image using the img tag, so it needs a separate para style. Also, need to float them left in online formats, as centering can look really bad on wide screens. Also added a bit of extra space after. Note that the top margin needs to be overridden with a adjacent sibling selector if the image is preceded by a p.figureCaption tag. */ { text-align: left; margin-left: 20px; margin-top: 10px; } li p.figurePara, li figure /* If a figure is inside an li, force left aligned, reduce top margin. */ { text-align: left; margin-top: 8px; } p.figureCaption + p.figurePara /* If the figurePara is preceeded by a figureCaption, set the top margin on the figurePara to 0. */ { margin-top: 0px; } /* =========================== Notes, Cautions, & Warnings =========================== */ /* Note: div.hightlight is from the Gemalto template, and it's described in the section "Examples and Command and Code Snippets", but the example given doesn't have any code in it. So I'm just going to put it here so it's somewhere. */ div.highlight { border: solid 1px #d5d5d5; border-top-left-radius: 20px; border-top-right-radius: 20px; border-bottom-right-radius: 20px; border-bottom-left-radius: 20px; background-color: #f5f5f5; margin: 12px 30px; padding-left: 15px; padding-right: 15px; padding-top: 3px; padding-bottom: 8px; page-break-inside: avoid; mc-hidden: unhidden; } div.highlight > :first-child { margin-top: 8px; } /* Notes and tips don't need an icon. */ /* IMPORTANT: The autonumber color should map to the Color-DarkAccent variable, but you can't use variables in autonumber formats. So if that color changes, change the definition here too. */ p.note { margin-left: 30px; margin-right: 30px; border-bottom: solid 1px #d5d5d5; border-top: solid 1px #d5d5d5; border-left: solid 3px #242A75; border-right: none; padding-left: 5px; padding-top: 4px; padding-bottom: 4px; mc-auto-number-class: blockElement; mc-auto-number-format: '{b}Note{/b}'; background-color: #f5f5f5; page-break-inside: avoid; } li p.note, td p.note /* Single para note in a list. */ { mc-auto-number-format: '{b}Note: {/b}'; mc-auto-number-class: inlineElement; margin-left: 15px; } td p.note, td p.tip /* Single para note/tip in a table. */ { margin-top: 5px; margin-bottom: 5px; margin-right: 5px; } p.tip { margin-left: 30px; margin-right: 30px; border-bottom: solid 1px #d5d5d5; border-top: solid 1px #d5d5d5; border-left: solid 3px #242A75; border-right: none; padding-left: 5px; padding-top: 4px; padding-bottom: 4px; mc-auto-number-class: blockElement; mc-auto-number-format: '{b}Tip{/b}'; background-color: #f5f5f5; page-break-inside: avoid; } li p.tip, td p.tip /* Single para tip in a list. */ { mc-auto-number-format: '{b}Tip: {/b}'; mc-auto-number-class: inlineElement; margin-left: 15px; } div.note, div.tip /* Brings in the graphic and adds space above and below. */ { border-bottom: solid 1px #d5d5d5; border-top: solid 1px #d5d5d5; border-left: solid 3px #242A75; border-right: none; background-color: #f5f5f5; margin-bottom: 12px; margin-left: 30px; margin-right: 30px; margin-top: 12px; padding: 4px 5px; page-break-inside: avoid; mc-hidden: unhidden; } div.note > p:nth-child(1), div.note > p.note:nth-child(1) /* Brings in "Note" above the text of the first p or p.note tag in the div. */ { margin-top: 0px; mc-auto-number-format: '{b}Note{/b}'; mc-auto-number-class: blockElement; } div.note > ul:nth-child(1) /* If there a bulleted list is the first child in the div, add the word Notes above it. */ { margin-top: 0px; mc-auto-number-format: '{b}Notes{/b}'; mc-auto-number-class: blockElementOutdented; } div.tip > p:nth-child(1), div.tip > p.tip:nth-child(1) /* Brings in "Tip" above the text of the first p or p.tip tag in the div. */ { margin-top: 0px; mc-auto-number-format: '{b}Tip{/b}'; mc-auto-number-class: blockElement; } div.tip > ul:nth-child(1) /* If there a bulleted list is the first child in the div, add the word Tips above it. */ { margin-top: 0px; mc-auto-number-format: '{b}Tips{/b}'; mc-auto-number-class: blockElementOutdented; } div.note p, div.tip p /* Paragraphs inside notes. */ { margin-top: 5px; } div.note p.note, div.tip p.tip /* Because people may flip back and forth and this saves resetting the p tag style. */ { margin-left: 0px; margin-bottom: 0px; border: none; padding: 0px; background-color: inherit; mc-auto-number-format: ' '; } div.note ul, div.note ol, div.tip ul, div.tip ol /* Lists inside notes. */ { margin-top: 5px; margin-left: 5px; } div.note li, div.tip li /* Reduce top margin on list items that are inside a note or tip. */ { margin-top: 3px; } div.note li p, div.tip li p /* Paragraphs inside lists that are inside a note or tip. */ { margin-left: 0px; } /* Notes and Tips in Lists and Tables */ li div.note, li div.tip /* Complex notes and tips inside lists. */ { margin-bottom: 0px; margin-left: 15px; margin-top: 5px; page-break-inside: avoid; mc-hidden: unhidden; padding-top: 0px; } td div.note, td div.tip /* Complex notes and tips inside tables. */ { margin-bottom: 8px; margin-left: 15px; margin-top: 5px; margin-right: 5px; page-break-inside: avoid; mc-hidden: unhidden; /* border-left: none 1px var(--Color-LightAccent); padding-left: 0px; */ padding-top: 0px; } /* Common settings for single paragraph cautions and warnings. */ p.caution, p.cautionESD, p.cautionVolts, p.warning { margin: 15px 30px; /* top/bottom and right/left */ padding-left: 60px; text-indent: -15px; padding-top: 10px; padding-bottom: 10px; padding-right: 10px; border-radius: 8px; mc-auto-number-class: blockElement; background-repeat: no-repeat; background-size: 35px; page-break-inside: avoid; background-position: 5px 5px; font-weight: bold; } p.caution /* Used for single para cautions. For multiple elements, use div.caution. */ { border: solid 1px #E1CD00; mc-auto-number-format: '{b}CAUTION{/b}'; background-image: url('../images/_Global/Caution-new.png'); } p.cautionESD /* Used for single para Electrostatic cautions. For multiple elements, use div.cautionESD. */ { border: solid 1px #E1CD00; mc-auto-number-format: '{b}ELECTROSTATIC DISCHARGE{/b}'; background-image: url('../images/_Global/ESDS-new.png'); } p.cautionVolts /* Used for single para hazardous voltages. For multiple elements, use div.cautionVolts. */ { border: solid 1px #E1CD00; mc-auto-number-format: '{b}HAZARDOUS VOLTAGES{/b}'; background-image: url('../images/_Global/Hazardous-Voltages-new.png'); } p.warning /* Used for single para warnings. For multiple elements, use div.warning. */ { border: solid 1px #ff0000; mc-auto-number-format: '{b}WARNING{/b}'; background-image: url('../images/_Global/warning.png'); } div.caution, div.warning, div.cautionESD, div.cautionVolts /* Common properties for the Cautions/Warnings. */ { margin: 15px 30px; /*margin is top/bottom and right/left */ padding-left: 5px; padding-top: 10px; padding-bottom: 10px; padding-right: 10px; border: solid 1px #E1CD00; border-radius: 8px; background-repeat: no-repeat; background-size: 35px; background-position: 5px 5px; page-break-inside: avoid; font-weight: bold; mc-next-tag: p; } li div.caution, li div.warning, li div.cautionESD, li div.cautionVolts, li p.caution, li p.warning, li p.cautionESD, li p.cautionVolts /* Common properties for Cautions/Warnings in a list. */ { margin: 10px; } td div.caution, td div.warning, td div.cautionESD, td div.cautionVolts, td > p.caution, td > p.cautionESD, td > p.cautionVolts, td > p.warning /* Common properties for Cautions/Warnings in a table cell. */ { margin: 5px !important; } div.caution /* Brings in the graphic and adds space above and below. */ { background-image: url('../images/_Global/Caution-new.png'); mc-hidden: unhidden; } div.warning /* Brings in the graphic and adds space above and below. */ { border: solid 1px #ff0000; background-image: url('../images/_Global/warning.png'); mc-hidden: unhidden; } div.cautionESD /* Brings in the graphic and adds space above and below. */ { background-image: url('../images/_Global/ESDS-new.png'); mc-hidden: unhidden; } div.cautionVolts /* Brings in the graphic and adds space above and below. */ { background-image: url('../images/_Global/Hazardous-Voltages-new.png'); mc-hidden: unhidden; } /* Now to define what changes need to happen to a p tag when inside one of these divs. */ div.caution p, div.warning p, div.cautionESD p, div.cautionVolts p, div.caution p.caution, div.warning p.warning, div.cautionESD p.cautionESD, div.cautionVolts p.cautionVolts { font-weight: bold; margin-top: 6px; margin-left: 60px; margin-right: 0px; margin-bottom: 0px; mc-auto-number-format: ' '; border: none; background-image: none; background-size: 0px; padding: 0px; } div.caution > p:nth-child(1), div.caution > p.caution:nth-child(1) /* Adds the caution type. First element must be p or p.caution. */ { mc-auto-number-format: '{b}CAUTION{/b}'; mc-auto-number-class: blockElement; text-indent: -15px; margin-top: 0px; } div.caution > ul:nth-child(1) /* If a bulleted list is the first child in the div, add the word Cautions above it. */ { mc-auto-number-format: '{b}CAUTIONS{/b}'; mc-auto-number-class: blockElementOutdented; margin-top: 0px; } div.warning > p:nth-child(1), div.warning > p.warning:nth-child(1) /* Adds the warning type. First element must be p or p.warning. */ { mc-auto-number-format: '{b}WARNING{/b}'; mc-auto-number-class: blockElement; text-indent: -15px; margin-top: 0px; } div.warning > ul:nth-child(1) /* If a bulleted list is the first child in the div, add the word Warnings above it. */ { mc-auto-number-format: '{b}WARNINGS{/b}'; mc-auto-number-class: blockElementOutdented; margin-top: 0px; } div.cautionESD > p:nth-child(1), div.cautionESD > p.cautionESD:nth-child(1) /* Adds the caution type. First element must be p or p.cautionESD. */ { mc-auto-number-format: '{b}ELECTROSTATIC DISCHARGE{/b}'; mc-auto-number-class: blockElement; text-indent: -15px; margin-top: 0px; } div.cautionVolts > p:nth-child(1), div.cautionVolts > p.cautionVolts:nth-child(1) /* Adds the caution type. First element must be p or p.cautionVolts. */ { mc-auto-number-format: '{b}HAZARDOUS VOLTAGES{/b}'; mc-auto-number-class: blockElement; text-indent: -15px; margin-top: 0px; } div.caution li, div.warning li, div.cautionESD li, div.cautionVolts li /* Reduce the li spacing in a caution or warning. */ { margin-top: 3px; } div.caution ul, div.cautionESD ul, div.cautionVolts ul /* Uls in cautions */ { margin-top: 5px; margin-left: 65px; } div.warning ul /* Uls in warnings */ { margin-top: 5px; margin-left: 65px; } div.caution ol, div.cautionESD ol, div.cautionVolts ol /* ols in cautions */ { margin-top: 5px; margin-left: 65px; } div.warning ol /* ols in warnings */ { margin-top: 5px; margin-left: 65px; } div.caution ul p, div.warning ul p, div.cautionESD ul p, div.cautionVolts ul p, div.caution ol p, div.warning ol p, div.cautionESD ol p, div.cautionVolts ol p /* Remove left margin for p tags in a list in a caution/warning div. */ { margin-left: 0px; } td > div.caution > p, td > div.warning > p, td > div.cautionESD > p, td > div.cautionVolts > p, td > div.caution > p.caution, td > div.warning > p.warning, td > div.cautionESD > p.cautionESD, td > div.cautionVolts > p.cautionVolts /* Sets left margin for p tags in a caution/warning div. Only affects p tags that are not in a list. */ { margin-left: 55px; } /* ============== Drop-Down Text ============== */ /* Drop down style names have changed since the Gemalto style sheet was created. The current implementation is: (Gemalto style sheet had MadCap:expandingHead) (Gemalto style sheet had MadCap:expandingBody) */ MadCap|dropDownHead /* Styles the container holding MadCap:dropDownHotspot, which contains the actual drop-down link text. */ { margin-top: 10px; font-style: italic; font-weight: normal; cursor: hand; text-decoration: none; color: #242A75; page-break-after: avoid; } /* ===================================== Reviewer Information and Writer Notes ===================================== */ div.reviewQuestion /* Indicates a question for reviewers. It is red and inside a box for high visibility. Note: I tried using the mc-next-tag and mc-next-class tags to make the following paragraph a plain p tag, but going from p.class to p is not supported with those tags. We can fix this if Flare ever gets around to supporting this case. See also matching span style. */ { margin-top: 10px; border: solid 2px #ff0000; border-radius: 8px; mc-conditions: 'Global.ReviewComment'; padding: 4px; page-break-inside: avoid; mc-hidden: unhidden; } div.reviewQuestion > p:nth-child(1) /* Adds "Question/Comment for Reviewers:" to the first direct-child p tag in the div. (In other words, it won't add anything to p tags in an li tag inside the div.) */ { mc-auto-number-format: '{b}{color red}Question/Comment for Reviewers: {/color}{/b}'; } span.reviewQuestion /* Red text that disappears if ReviewComment conditional text is excluded from the target. */ { border: solid 1px #ff0000; color: red; mc-conditions: 'Global.ReviewComment'; mc-hidden: unhidden; } div.reviewDocChange /* Indicates information reviewers may want to see but it's FYI only. So it's green with no box for moderate visibility. See also matching span style. */ { margin-top: 10px; mc-conditions: 'Global.ReviewComment'; border: solid 1px #228b22; border-radius: 8px; padding: 4px; page-break-inside: avoid; mc-hidden: unhidden; } div.reviewDocChange > p:nth-child(1) /* Adds "Doc Change:" to the first direct-child p tag in the div. (In other words, it won't add anything to p tags in an li tag inside the div.) */ { mc-auto-number-format: '{b}{color green}Doc Change: {/color}{/b}'; } span.reviewDocChange /* Green text that disappears if ReviewComment conditional text is excluded from the target. */ { border: solid 1px #228b22; color: green; mc-conditions: 'Global.ReviewComment'; mc-hidden: unhidden; } div.writerComment /*Writer comment is for stuff we need to remember but we don't want reviewers to see. */ { margin-top: 10px; text-align: left; margin-left: 0; mc-conditions: 'Global.writerComment'; padding: 4px; border: solid 1px #8a2be2; border-radius: 8px; page-break-inside: avoid; mc-hidden: unhidden; } div.writerComment > p:nth-child(1) /* Adds "Writer Comment:" to the first direct-child p tag in the div. (In other words, it won't add anything to p tags in an li tag inside the div.) */ { mc-auto-number-class: inlineElement; mc-auto-number-format: '{b}Writer Comment: {/b}'; } /* ============================ Spans (aka Character Styles) ============================ */ sup, sub /* Set superscript and subscript font size */ { font-size: ; } span /* Hide the base span tag by default so that only the officially blessed span.class tags show in the UI. */ { mc-hidden: hidden; } span.highlightYellow /* This highlights the selected text to bring it to the user's attention. */ { background-color: #fafa90; mc-hidden: unhidden; } b, i, span.mono, span.monoBold, span.monoItalic, span.monoBoldItalic, sub, sup /* For some reason, you need to explicitly state this if you want these character styles to work with span.highlightYellow. */ { background: inherit; } span.mono /* Makes selected text monospace and changes the size. */ { font-family: "Courier New", "Inconsolata", "Consolas", monospace; mc-hidden: unhidden; } span.monoBold /* Makes selected text monospace and bold. */ { font-weight: bold; font-family: "Courier New", "Inconsolata", "Consolas", monospace; mc-hidden: unhidden; } span.monoItalic /* Makes selected text monospace and bold. */ { font-style: italic; font-family: "Courier New", "Inconsolata", "Consolas", monospace; mc-hidden: unhidden; } span.monoBoldItalic /* Makes selected text monospace, bold, and italic. */ { font-family: "Courier New", "Inconsolata", "Consolas", monospace; font-weight: bold; font-style: italic; mc-hidden: unhidden; } /* Spans used to build other styles. All hidden in Flare UI. */ span.blockElement /*Puts the selected text on its own line. Used in Cautions and Warnings to position the autonumber. Hidden in the Flare UI because writers should never use this -- it's for building larger styles.*/ { display: block; mc-hidden: hidden; padding-bottom: 2px; } span.blockElementOutdented /*Puts the selected text on its own line. Used in Cautions and Warnings to position the autonumber. Hidden in the Flare UI because writers should never use this -- it's for building larger styles.*/ { display: block; text-indent: -25px; mc-hidden: hidden; padding-bottom: 2px; } span.inlineElement /* Puts the selected text at the start of the first line. Used in Cautions and Warnings to position the autonumber. Hidden in the Flare UI because writers should never use this -- it's for building larger styles.*/ { mc-auto-number-position: inside-head; mc-hidden: hidden; } span.darkAccentBlock /* Used to build other styles, mostly as an autonumber class. */ { color: #242A75; display: block; mc-hidden: hidden; } span.lightAccentBlock /* Used to build other styles, mostly as an autonumber class. */ { color: #00bbdd; display: block; mc-hidden: hidden; } span.darkAccent /* Used to build other styles, mostly as an autonumber class. */ { color: #242A75; mc-hidden: hidden; } span.lightAccent /* Used to build other styles, mostly as an autonumber class. */ { color: #00bbdd; mc-hidden: hidden; } /* ======================== TOCs and Mini TOC Styles ======================== */ MadCap|tocProxy /* This is for the main TOC at the front of the book. It removes the default border. */ { border: none 2px #000000; mc-toc-depth: 4; } p.TOC1 /* This equates to Chapter Titles and Section Titles. */ { font-family: Arial, "Helvetica Neue", sans-serif; margin-top: 23px; font-size: 14pt; margin-left: 0pt; color: #242A75; page-break-after: avoid; } p.TOC2 /* This equates to h1s under a chapter title. */ { margin-top: 5px; font-size: 11pt; margin-left: 0; } p.TOC3 /* This equates to h2s under a chapter title. */ { margin-top: 5px; font-size: 11pt; margin-left: 15px; } p.TOC4 /* This equates to h3s under a chapter title. */ { margin-top: 5px; font-size: 11pt; margin-left: 30px; } MadCap|miniTocProxy /* This is for the mini TOCs at the start of each chapter or under a given heading. Note that the depth for this in the PDF is smaller than in HTML, because in HTML mini-TOCs show only the headers of topics nested under the parent. In PDF, all headers are shown. */ { font-family: Arial, "Helvetica Neue", sans-serif; margin-left: 0; margin-right: 0; margin-bottom: 0px; color: #242A75; mc-toc-depth: 3; /* border-top: solid 1px var(--Color-DarkAccent); */ border-top: solid 0px #242A75; margin-top: 0; padding-top: 5px; } p.MiniTOC1 { color: blue; font-weight: normal; margin: 5px 0 0 0; text-decoration: none; mc-hidden: hidden; } p.MiniTOC2 { color: blue; margin: 3px 0 0 15px; /* font-weight: bold; */ mc-hidden: hidden; } p.MiniTOC3 { color: blue; margin: 3px 0 0 30px; /* font-weight: bold; */ mc-hidden: hidden; } p.MiniTOC4 { color: blue; margin: 3px 0 0 45px; /* font-weight: bold; */ mc-hidden: hidden; } p.MiniTOC1_0, p.MiniTOC2_0, p.MiniTOC3_0, p.MiniTOC4_0 /* Flare generates this p tag class when you have multiple miniTOC proxy classes. Need to hide them in the UI. */ { mc-hidden: hidden; } MadCap|miniTocProxy.nestedTopicsBulletList /* Adds a bullet-list style mini-toc proxy. Topics must be in separate files and indented in the TOC under the topic in which this proxy is used. It will *not* pick up any headers beneath it in the file or any headers other than the first one in any child topics. Can only be used in HTML because PDF does not support miniTOC sub-classes. */ { border-top: none; padding-top: 0px; margin-top: 10px; margin-left: 0px; mc-toc-depth: 4; color: #000000; mc-conditions: 'Global.OnlineOnly'; } div.MCMiniTocBox_nestedTopicsBulletList_0 a.MiniTOC1, div.MCMiniTocBox_nestedTopicsBulletList_0 a.MiniTOC2, div.MCMiniTocBox_nestedTopicsBulletList_0 a.MiniTOC3, div.MCMiniTocBox_nestedTopicsBulletList_0 a.MiniTOC4 /* Sets the link style in the Sub Topics block. */ { color: blue; font-weight: normal; mc-hidden: hidden; } div.MCMiniTocBox_nestedTopicsBulletList_0 p.MiniTOC1_0, div.MCMiniTocBox_nestedTopicsBulletList_0 p.MiniTOC2_0, div.MCMiniTocBox_nestedTopicsBulletList_0 p.MiniTOC3_0, div.MCMiniTocBox_nestedTopicsBulletList_0 p.MiniTOC4_0 /* This affects the mini TOC entries in HTML only, because PDFs don't include the _0 on the p tag class.*/ { display: list-item; mc-leader-format: 'none'; font-weight: normal; margin-top: 5px; mc-hidden: hidden; } div.MCMiniTocBox_nestedTopicsBulletList_0 p.MiniTOC2_0 /* miniTOC level 2 goes to open circle. */ { list-style-type: circle; mc-hidden: hidden; } div.MCMiniTocBox_nestedTopicsBulletList_0 p.MiniTOC3_0 /* miniTOC level 3 goes to square bullet. */ { list-style-type: square; mc-hidden: hidden; } /* MadCap|miniTocProxy.nestedTopicsBulletList > p.MiniTOC1 /* No effect in PDF or HTML { text-decoration: overline; } MadCap|miniTocProxy.nestedTopicsBulletList p.MiniTOC1 /* No effect in PDF or HTML { text-decoration: overline; } div.MCMiniTocBox_nestedTopicsBulletList p.MiniTOC1 /* No effect in PDF or HTML { text-decoration: overline; } div.MCMiniTocBox_nestedTopicsBulletList_0 p.MiniTOC1 /* Changes HTML but not PDF { text-decoration: overline; } */ MadCap|miniTocProxy.relatedTopics /* Adds Related Topics header and mini-toc proxy. Topics must be in separate files and indented in the TOC under the topic in which this proxy is used. It will *not* pick up any headers beneath it in the file or any headers other than the first one in any child topics. Automatically styled with Online Only conditional text. */ { border-top: none; color: #242A75; padding-top: 0px; margin-top: 25px; margin-left: 0px; mc-auto-number-format: '{b}Related Topics {/b}'; mc-auto-number-class: blockRelatedTopics; mc-conditions: 'Global.OnlineOnly'; mc-toc-depth: 3; } div.MCMiniTocBox_relatedTopics_0 /* For some reason known only to Flare, you must repeat the auto number info in this div, and you must specify the _0 after the div class name. Keep both in sync. */ { mc-auto-number-format: '{b}Related Topics {/b}'; mc-auto-number-class: blockRelatedTopics; mc-conditions: 'Global.OnlineOnly'; mc-hidden: hidden; } span.blockRelatedTopics /* Puts the selected text on its own line with an overline. Used for Related Topics miniTocProxy. Hidden in the Flare UI because writers should never use this -- it's for building larger styles.*/ { display: block; text-indent: -25px; text-decoration: overline; margin-top: 15px; mc-hidden: hidden; } div.MCMiniTocBox_relatedTopics_0 a.MiniTOC1, div.MCMiniTocBox_relatedTopics_0 a.MiniTOC2, div.MCMiniTocBox_relatedTopics_0 a.MiniTOC3, div.MCMiniTocBox_relatedTopics_0 a.MiniTOC4 /* Sets the link style inside the related topics block. */ { color: blue; font-weight: normal; mc-hidden: hidden; } div.MCMiniTocBox_relatedTopics_0 p.MiniTOC1_0, div.MCMiniTocBox_relatedTopics_0 p.MiniTOC2_0, div.MCMiniTocBox_relatedTopics_0 p.MiniTOC3_0, div.MCMiniTocBox_relatedTopics_0 p.MiniTOC4_0 /* Sets the paragraph style inside the related topics block. For some reason known only to Flare you need the _0 after the class names. */ { margin-top: 5px; mc-hidden: hidden; } div.MCMiniTocBox_relatedTopics_0 p.MiniTOC1_0 /* The default margin is too big so reduce it. */ { margin-left: -10px; mc-hidden: hidden; } div.MCMiniTocBox_relatedTopics_0 p.MiniTOC2_0 /* Set indent for 2nd level entry */ { margin-left: 5px; mc-hidden: hidden; } div.MCMiniTocBox_relatedTopics_0 p.MiniTOC3_0 /* Set indent for 3rd level entry */ { margin-left: 25px; mc-hidden: hidden; } /* Note: The Menu proxy adds a mini-TOC to a topic in HTML. This mini-TOC only picks up the sub-headings in the topic itself. It does *not* pick up any child topics. I have a component skin for this called topicMiniTOC, but for some reason the items in the menu do not seem to respect the margins set in the skin. So we need some css styles as well. */ MadCap|menuProxy /* Set the menu proxy to online only so it doesn't leave empty space in the PDF. */ { mc-conditions: 'Global.OnlineOnly'; } ul.menu._Skins_topicMiniTOC.mc-component /* Set margins and bottom padding (need that or you get a scroll bar you can't remove). */ { margin: 5px 0 0px 40px; padding: 0px 0px 10px 10px; } ul.menu._Skins_topicMiniTOC.mc-component > li:nth-child(1) /* Turns off what Flare calls the "root" element, which is the topic title. */ { display: none; } ul.menu._Skins_topicMiniTOC.mc-component li /* Sets the margin and font for the topicMiniTOC entries. */ { margin-top: 5px !important; font-family: Arial, "Helvetica Neue", sans-serif; font-weight: normal; color: blue; /* font-size: var(--FontSize-Body); */ text-indent: -20px; } ul.menu._Skins_topicMiniTOC.mc-component a { font-family: Arial, "Helvetica Neue", sans-serif; color: blue; /* font-size: var(--FontSize-Body); */ } ul.menu._Skins_topicMiniTOC.mc-component ul /* If there is a second-level nested ul (equates to an h3), move the left margin back a bit. */ { margin-left: -15px; } ul.menu._Skins_topicMiniTOC.mc-component ul ul /* If there is a third-level nested ul (equates to an h4), use the default left margin. */ { margin-left: 0px; } /* ================================== Snippets and Other Special Formats ================================== */ MadCap|snippetBlock { border: solid 6px #e0ffff; } div /* Hide the base div tag by default so that only the officially blessed div.class tags show in the UI. */ { } div.runningHeader /* For running headers in page layouts. Not to be used by authors. */ { margin-bottom: 0px; border-bottom: solid 1px #242A75; padding-bottom: 5px; text-align: left; mc-hidden: hidden; } div.runningFooter /* For running footers in page layouts. Not to be used by authors. */ { margin-top: 0px; border-top: solid 1px #242A75; padding-top: 5px; mc-hidden: hidden; } div.runningHeader p, div.runningHeader td, div.runningFooter p, div.runningFooter td /* If a p tag or a td tag is insdide a running header or footer, make it small with no space above. */ { font-size: ; font-family: Arial, "Helvetica Neue", sans-serif; color: #242A75; margin-top: 0px; margin-bottom: 0px; text-align: inherit; } span.runningCopyright /* Set the copyright notice in the footer to the same size as subscripts and superscripts */ { mc-hidden: hidden; font-size: !important; } div.copyright /* Sets a smaller font size. Hidden from users. */ { font-size: ; mc-hidden: hidden; } div.copyright p /* Sets a smaller font size. */ { font-size: ; } div.copyright .singleSpaced, div.copyright div.indentedSingleSpaced p /* With a smaller font, need to tighten up spacing. */ { margin-top: 2px; margin-bottom: 0px; mc-hidden: hidden; } p.docTitleProduct /*Used to format the Product name on the title page. Hidden from users but used in the docTitle snippet.*/ { font-family: Arial, "Helvetica Neue", sans-serif; margin-top: 0px; color: #242A75; font-size: 30pt; /*Changed from 30 to 20 by GF on 2/15/22*/ mc-hidden: hidden; } p.docTitlePara /*Used to format the Doc title on the title page. Hidden from users but used in the docTitle snippet.*/ { font-family: Arial, "Helvetica Neue", sans-serif; margin-top: 30px; color: #242A75; font-size: 28pt; /*Changed from 30 to 25 by GF on 2/15/22*/ mc-hidden: hidden; } p.docTitleSubPara /*Used for slightly smaller title paras. Hidden from users.*/ { font-family: Arial, "Helvetica Neue", sans-serif; margin-top: 26px; color: #242A75; font-size: 26pt; /*Changed from 28 to 15 by GF on 2/15/22*/ mc-hidden: hidden; } p.docTitleVersion /*Used to format the product release number on the title page. Hidden from users but used in the docTitle snippet.*/ { font-family: Arial, "Helvetica Neue", sans-serif; color: #242A75; font-size: 22pt; /*Changed from 28 to 15 by GF on 2/15/22*/ mc-hidden: hidden; } p.docTitleDocVersion /*Used for the document version on the title page. Hidden from users but used in the DocVersionPubDate snippet.*/ { font-family: Arial, "Helvetica Neue", sans-serif; color: #242A75; text-align: right; font-size: 16pt; mc-hidden: hidden; } p.docTitleDocVersion-White /*Used for the document version on the title page when it's on top of a graphic and needs to be white. Hidden from users but used in the DocVersionPubDate snippet.*/ { font-family: Arial, "Helvetica Neue", sans-serif; color: white; text-align: right; font-size: 16pt; mc-hidden: hidden; } p.docTitlePubDate /*Used for the part number (if any) and publication date on the title page. Hidden from users but used in the DocVersionPubDate snippet.*/ { font-family: Arial, "Helvetica Neue", sans-serif; color: #242A75; text-align: right; font-size: 12pt; mc-hidden: hidden; } p.docTitlePubDate-White /*Used for the part number (if any) and publication date on the title page when it's on top of a graphic and needs to be white. Hidden from users but used in the DocVersionPubDate snippet.*/ { font-family: Arial, "Helvetica Neue", sans-serif; color: white; text-align: right; font-size: 12pt; mc-hidden: hidden; } div.reviewDraftTitlePage /* Used for the Review Draft notice on the title page. */ { mc-hidden: hidden; text-align: center; padding: 10px; mc-conditions: 'Global.ReviewComment'; } div.reviewDraftTitlePage p /* Make text red and add white background for paras inside the review draft div. This lets you put the reivew draft information over a title page graphic. */ { color: red; background-color: white; padding: 15px; } p.docBackPage /* Contact us and link para for back page. */ { font-family: Arial, "Helvetica Neue", sans-serif; color: #242A75; text-align: center; font-size: 8pt; font-weight: bold; mc-hidden: hidden; margin-top: 30px; } p.docBackPageText /* Body text for back page. */ { font-family: Arial, "Helvetica Neue", sans-serif; color: #000000; text-align: center; font-size: 8pt; mc-hidden: hidden; margin-top: 0px; } /* ======================== Links and Hover Behavoir ======================== */ a /* Standard link when topic is first viewed in HTML -- always in PDF. */ { text-decoration: none !important; color: blue; } a:link /* Gets rid of the underline in hyperlinks. */ { text-decoration: none !important; color: blue; } a:visited /* If viewing in HTML, this sets the color of a visited link. */ { text-decoration: none !important; color: blue; } a:hover /* If viewing in HTML, do not change the link on hover. */ { text-decoration: none !important; color: blue; } MadCap|xref /* Standard xref that looks like "Title" on page blah. This page ref is context sensitive so it could also say "Title" on the next page or "Title" below or similar based on relative location. */ { text-decoration: none; color: blue; mc-format: '{paranum}{paratext}'; } MadCap|xref.headingAndPage /* Xref to a numbered heading or paragraph. Uses the same context sensitive page ref as std xref. */ { mc-format: '{paranum}{paratext}'; } MadCap|xref.headingOnly { mc-format: '{quote}{paratext}{quote}'; } MadCap|xref.ParaNum /*Xref to just the numbered portion of a paragraph. Only useful when xreffing steps using the p-tag style list tags. Cannot be used for step numbers with ol/li tags. */ { mc-format: '{paranumonly}'; } MadCap|xref:hover /* If viewing in HTML, this adds an underline when the user hovers over a cross ref. */ { text-decoration: underline; } MadCap|xref.IndexPageNumber /*Hiding this as it should not be used.*/ { mc-hidden: hidden; mc-format: '{paranum}"{paratext}" {pageref}'; } MadCap|xref.ListOfPageNumber /*Hiding this as it should not be used.*/ { mc-hidden: hidden; mc-format: '{paranum}"{paratext}"'; } MadCap|xref.RelLinkPageNumber /*Hiding this as it should not be used.*/ { mc-hidden: hidden; mc-format: '{paranum}"{paratext}"'; } MadCap|xref.TOCPageNumber /*Hiding this as it should not be used.*/ { mc-hidden: hidden; mc-format: '{paranum}"{paratext}"'; } MadCap|xref.ConceptPageNumber { mc-hidden: hidden; mc-format: '{paranum}"{paratext}"'; } /* ====================== Glossaries and Indexes ====================== */ MadCap|glossaryProxy { border-top: none 2px #000000; color: #242A75; } div.GlossaryPageHeading { font-family: Arial, "Helvetica Neue", sans-serif; font-size: 16pt; color: #242A75; border-bottom: solid 2px #242A75; } div.GlossaryPageEntry { color: #242A75; font-family: Arial, "Helvetica Neue", sans-serif; } div.GlossaryPageTerm { font-family: Arial, "Helvetica Neue", sans-serif; color: #000000; font-size: 1.1rem; } div.GlossaryPageDefinition { font-family: Arial, "Helvetica Neue", sans-serif; color: #000000; margin-left: 20px; } ul.MCGlossaryProxy_0 /*Turning off bullets in the HTML version of the Glossary*/ { list-style-type: none; } MadCap|glossaryTerm { border-bottom: dotted 1px #000000; mc-closed-image: none; mc-open-image: none; color: #000000; font-weight: normal; } MadCap|glossaryTerm:link { color: #000000; border-bottom: dotted 1px blue; } a.GlossaryTermLink { color: #242A75; } MadCap|glossaryTerm:visited { color: #000000; border-bottom: dotted 1px #00bbdd; } MadCap|glossaryTerm:focus { border-bottom: solid 1px #00bbdd; color: #00bbdd; } MadCap|glossaryTerm:hover { border-bottom: solid 1px #00bbdd; color: #00bbdd; } MadCap|glossaryTerm:active { border-bottom: solid 1px #00bbdd; color: #00bbdd; } MadCap|glossaryTerm.Popup { color: #000000; } MadCap|glossaryTerm:focus { color: #000000; border-bottom: solid 1px #00bbdd; } MadCap|indexProxy { border: none 2px #000000; } a.GlossaryPageTerm { color: #242A75; } /* ======================= HTML5 Responsive Styles ======================= */ /* The following styles apply to all HTML output. */ MadCap|breadcrumbsProxy /* Turns off the bottom border and the 'You are here: ' default text; sets font info. */ { margin-bottom: 0px; border-bottom-style: none; font-family: Arial, "Helvetica Neue", sans-serif; color: #000000; font-size: ; mc-breadcrumbs-prefix: ' '; } p.footer /* Defines the area at the bottom of each topic where the footer text is displayed. */ { margin-top: 12pt; margin-bottom: 12pt; padding-left: 3px; font-size: ; margin-left: -10px; margin-right: -10px; padding-right: 3px; line-height: normal; background-color: #242A75; color: #ffffff; text-align: center; padding-bottom: 10px; padding-top: 5px; border-bottom-right-radius: 5px; border-bottom-left-radius: 5px; border-top-left-radius: 5px; border-top-right-radius: 5px; mc-hidden: hidden; } MadCap|topicToolbarProxy { position: fixed; } MadCap|searchBarProxy { position: fixed; } span.SearchHighlight1 /* The color of the first term matched in a search. */ { background-color: #ffff66; } span.SearchHighlight2 /* The color of the second term matched in a search. */ { background-color: #a0ffff; } span.SearchHighlight3 /* The color of the third term matched in a search. */ { background-color: #99ff99; } span.SearchHighlight4 /* The color of the forth term matched in a search. */ { background-color: #ffdab9; } /* The following styles apply to the HTML5 Top Nav template. */ div.ContentRow { mc-grid-row: true; margin-left: auto; margin-right: auto; mc-hidden: hidden; } div.ContentRow::before { content: ' '; display: table; } div.ContentRow::after { content: ' '; display: table; clear: both; } div.ContentRow > div { float: right; -moz-box-sizing: content-box; box-sizing: content-box; } div.ContentRow > div:nth-child(3) /* TOC */ { width: 21%; position: fixed; height: 100%; background: #f6f5f5; margin-left: -10px; margin-top: -10px; } div.ContentRow > div:nth-child(2) /* Content */ { width: 70%; /*width: calc(75% - 55px);*/ margin-left: 1%; margin-right: 6%; } div.ContentRow > div:nth-child(1) /* Toolbar proxy */ { width: 25px; margin-left: 25px; margin-right: 5px; } /* The following styles apply to the HTML5 Side Nav template. */ ul.sidenav li a /* Set color of the links in the TOC. */ { color: #000000 !important; } div.ContentRowSideNav { mc-grid-row: true; margin-left: auto; margin-right: auto; mc-hidden: hidden; } div.ContentRowSideNav::before { content: ' '; display: table; } div.ContentRowSideNav::after { content: ' '; display: table; clear: both; } div.ContentRowSideNav > div { float: left; -moz-box-sizing: content-box; box-sizing: content-box; } div.ContentRowSideNav > div:nth-child(1) /* Sets the width of the content section. The -65px is so the toolbar fits on the right side. If you increase the left margin, increase the -n value by the same amount. */ { width: calc(100% - 65px); margin-left: 10px; margin-right: 0%; } div.ContentRowSideNav > div:nth-child(2) /* Sets the width of the topic toolbar. The 25px width forces the toolbar buttons to stack vertically. */ { width: 25px; margin-left: 25px; margin-right: 5px; } MadCap|footnotesBlock { font-family: Arial, "Helvetica Neue", sans-serif; font-size: ; border-top: solid 1px #000000; margin-top: 5px; } MadCap|footnote { text-decoration: overline; } div.MCMiniTocBox_nestedTopicsBulletList_0 { mc-hidden: hidden; } h1.chapterNoNumber { margin-top: 15px; } code { } th { } td > p { font-size: ; } /* ==================================== Print-Specific Styles (@media print) ==================================== */ @media print { /* Variables and Generic Classes */ :root { --Color-LightAccent: #5DBFD4; --FontSize-Body: 10pt; --FontSize-ChapTitle: 18pt; --FontSize-h1: 16pt; --FontSize-h2: 14pt; --FontSize-h3: 13pt; --FontSize-h4: 12pt; --FontSize-Small: 9pt; --FontSize-SupSub: 7pt; --FontSize-Table: 9pt; --FontSize-Mono: 9.5pt; --FontSize-MonoTable: 8.5pt; } /* Chapter Titles */ h1.appendix { mc-auto-number-format: 'Appendix {chapnum}: '; border-bottom: solid; border-bottom-color: #242A75; border-bottom-width: 2px; padding-bottom: 5px; margin-top: 0px; } h1.chapter { mc-auto-number-format: 'Chapter {chapnum}: '; padding-bottom: 5px; border-bottom: solid; border-bottom-color: #242A75; border-bottom-width: 2px; margin-top: 0px; } h1.contents { border-bottom-color: #242A75; border-bottom: solid; padding-bottom: 5px; border-bottom-width: 2px; margin-top: 0px; } h1.chapterNoNumber, h1.preface, h1.index { border-bottom: solid; border-bottom-color: #242A75; border-bottom-width: 2px; padding-bottom: 5px; } h1.index { border-bottom: solid 2px #242A75; padding-bottom: 5px; margin-top: 0px; } /* Headings */ h1 { font-size: 1.7rem; margin-top: 30px; } h2, h2.ntoc { font-size: 1.7rem; } h3 { font-size: 1.4rem; } h4 { font-size: 1.1rem; } h5 { font-family: Arial, "Helvetica Neue", sans-serif; margin-top: 20px; page-break-after: avoid; font-size: 1rem; color: #242A75; } /* Paragraph Styles */ pre.smallestFont { font-size: 7pt; } li pre.smallestFont { font-size: 6pt; } /* Tables */ caption { font-size: .8rem; mc-auto-number-format: 'CT:Table {chapnum}-{n+}: '; } td ol { padding-left: 0px; margin-left: 20px; font-size: ; } td ul { list-style-type: disc; margin-left: 20px; padding-left: 0px; font-size: ; } li td li { margin-top: 0px !important; } table { margin-top: 15px; font-size: ; } td li { margin-top: 0px; font-size: ; } td p + ol, td p + ul /* Para inside a table cell followed by a list. Decreases top margin for the list. */ { margin-top: 3px !important; } td > p:nth-child(1) { margin-top: 0px; } td pre { font-size: ; } td ul ul, td ol ul, td ul ol { margin-left: 30px; } li td ol { margin-left: 30px; } li td ul { margin-left: 35px; } li td ol ol { margin-left: 0px; } li td ul ul { margin-left: 30px; } /* Lists */ ul { margin-left: 30px; padding-left: 0px; font-size: .8rem; } ol { margin-left: 30px; padding-left: 0px; font-size: .8rem; } li { mc-auto-number-offset: 0px; } ol ul { margin-top: 0px; padding-left: -10px; } li table { margin-bottom: 5px; } ol > li > ol { padding-left: 22px; } ul ol { padding-left: -7px; } ul ul { padding-left: -10px; } div.indentedSingleSpaced { margin-left: 30px; } /* Images */ p.figureCaption { page-break-after: avoid; margin-left: 0px; mc-auto-number-format: 'CF:Figure {chapnum}-{n+}: '; } p.figurePara { text-align: center; page-break-before: avoid; margin-left: 0px; } /* Notes Cautions Warnings */ li p.note, li p.tip, li div.note, li div.tip { padding-left: 8px; margin-left: 10px; } div.note ol, div.tip ol { margin-left: 30px; } div.note ul, div.tip ul { margin-left: 28px; } li > div.note > ol, li > div.tip > ol { margin-left: 14px; } td > div.note > ol, td > div.tip > ol { margin-left: 27px; } li > div.note > ul, li > div.tip > ul { margin-left: 35px; } td > div.note > ul, td > div.tip > ul { margin-left: 23px; } p.caution, p.cautionESD, p.cautionVolts, p.warning { margin: 15px 30px 15px 14px; background-size: auto; padding-left: 70px; } div.caution p, div.warning p, div.cautionESD p, div.cautionVolts p, div.caution p.caution, div.warning p.warning, div.cautionESD p.cautionESD, div.cautionVolts p.cautionVolts { margin-left: 40px; padding-left: 10px; } td > div.caution > p, td > div.warning > p, td > div.cautionESD > p, td > div.cautionVolts > p, td > div.caution > p.caution, td > div.warning > p.warning, td > div.cautionESD > p.cautionESD, td > div.cautionVolts > p.cautionVolts { margin-left: 40px; } /* Links and Hover Behavior */ MadCap|xref:hover { text-decoration: none; } MadCap|xref { mc-format: '{paranum}"{paratext}" {pageref}'; } MadCap|xref.headingAndPage { mc-format: '{paranum}"{paratext}" {pageref}'; } MadCap|xref.ConceptPageNumber { mc-format: '{paranum}"{paratext}" {pageref}'; } MadCap|xref.IndexPageNumber { mc-format: '{paranum}"{paratext}" {pageref}'; } MadCap|xref.TOCPageNumber { mc-format: '{paranum}"{paratext}" {pageref}'; } MadCap|xref.headingOnly { mc-format: '{paranum}"{paratext}"'; } MadCap|xref.ListOfPageNumber { mc-format: '{paranum}"{paratext}" {pageref}'; } MadCap|xref.RelLinkPageNumber { mc-format: '{paranum}"{paratext}" {pageref}'; } /* Spans */ /* NOTE: The following fancy selectors works for HTML but not PDF. Of course. Leaving them here so we know they were tried. h1 [class~="mono"], h2 [class*="mono"], h3 [class|="mono"], h4 [class~="mono"] { font-size: inherit; } */ h1 span.mono, h2 span.mono, h3 span.mono, h4 span.mono, h1 span.monoBold, h2 span.monoBold, h3 span.monoBold, h4 span.monoBold, h1 span.monoItalic, h2 span.monoItalic, h3 span.monoItalic, h4 span.monoItalic, h1 span.monoBoldItalic, h2 span.monoBoldItalic, h3 span.monoBoldItalic, h4 span.monoBoldItalic /* If one of the mono spans is in a title, use the same font size as the title. */ { font-size: inherit; } /* TOCs and Mini TOCs */ p.TOC1 { color: #000000; } MadCap|miniTocProxy { margin-left: 50px; margin-right: 70px; mc-toc-depth: 2; margin-top: 0px; border: none 2px #000000; border-top: none; padding-top: 10px; font-size: .8rem; } /* Snippets and Other Stuff */ div.GlossaryPageDefinition { margin-left: 24pt; } /* Deprecated Styles */ span.legacy-olNumber { margin-left: 0px; } p.ol3, p.ol3Start, p.listLevel3, p.ul3, pre.listLevel3, table.TableStyle-List3 { margin-left: 65px; } p.ul1 { mc-auto-number-format: 'l '; } p.ul2 { mc-auto-number-format: '¢ '; } p.ul3 { mc-auto-number-format: 'n '; } span.legacy-ul1Bullets { font-family: Wingdings; font-size: 5.5pt; } td span.legacy-ul1Bullets { font-size: 4.5pt; } span.legacy-ul2Bullets { font-family: Wingdings; font-size: 5.5pt; font-weight: 900; } td span.legacy-ul2Bullets { font-size: 4.5pt; } span.legacy-ul3Bullets { font-family: Wingdings; vertical-align: 2px; font-size: 6.5pt; } td span.legacy-ul3Bullets { font-size: 5.5pt; } MadCap|dropDownHead { font-style: normal; font-weight: bold; font-size: 1.1rem; } a { } a:link { } a:visited { } caption.captionNoChapNum { mc-auto-number-format: 'CT:Table {n+}: '; } h1.chapterNoNumber { margin-top: 0px; } h1.preface { margin-top: 0px; } code { font-size: ; } p { font-size: .8rem; } p.code { font-size: ; } pre { font-size: ; } th { font-size: .8rem; } p.th { font-size: .8rem; } td { font-size: ; } td > p { font-size: ; } td li > p { font-size: ; } td p.figurePara { font-size: ; } td span.mono, td span.monoBold, td span.monoBoldItalic, td span.monoItalic /* Monospace inside a table. Sets font size. */ { font-size: ; } span.mono { font-size: ; } span.monoBold { font-size: ; } span.monoBoldItalic { font-size: ; } span.monoItalic { font-size: ; } body { font-size: .8rem; } p.sectionTitle { font-size: 1.1rem; } } /* ====================================== Tablet-Specific Styles (@media tablet) ====================================== */ @media only screen and (max-width: 900px) { div.ContentRow > div:nth-child(1) /* hide toc */ { display: none; } MadCap|topicToolbarProxy { display: none; } div.ContentRow > div:nth-child(2) { width: 72%; margin-right: 1%; margin-left: 3%; } div.ContentRow > div:nth-child(3) { width: 24%; } div.ContentRowSideNav > div:nth-child(1) /* For tablets, reduce left margin. Must also change width calculation accordingly. */ { width: calc(100% - 55px); margin-left: 0; } } /* ====================================== Mobile-Specific Styles (@media mobile) ====================================== */ @media only screen and (max-width: 650px) { /* If you uncomment these lines, then the side menu is hidden in mobile. But it seems like the menu would still be useful, so I'm currently leaving it in. If you do unhide these, make sure you hide the div.ContentRowSideNav statement below this block. The nth-child(1) statement removes all margins and the nth-child(2) statement turns off the topic toolbar display. */ /* div.ContentRowSideNav > div:nth-child(1) { width: 100%; margin-left: 0%; } div.ContentRowSideNav > div:nth-child(2) { display: none; } */ div.ContentRowSideNav > div:nth-child(1) /* For mobile, remove left margin in side nav output. Must also change width calculation accordingly. */ { width: calc(100% - 55px); margin-left: 0; } div.ContentRow > div:nth-child(1) { display: none; } div.ContentRow > div:nth-child(2) { width: 96%; margin-left: 2%; margin-right: 2%; } div.ContentRow > div:nth-child(3) { display: none; } MadCap|searchBarProxy { } MadCap|topicToolbarProxy { display: none; } } /* ================= Deprecated Styles ================= */ /* The following styles exist to support legacy content. They should *not* be used going forward, so all are set to mc-hidden. */ .pageBreak /* Jen: Can cause issues when reusing topics -- better to use keepWithNext to keep things together. If this is meant for API headers, have a tag for that. Having a generic class can be misused. (Note: Flare does not seem to respect the mc-hidden setting on this. Leaving it though in case Flare fixes that.) */ { page-break-before: always; mc-hidden: hidden; } h1.index /* Jen: I have 1 tag called chapterNoNumber that works for the Index, Preface, Glossary, etc. Yes, you have to type the word Index/Preface/Glossary, but you also don't have extra tags ppl are rarely going to use. And my tag allows you to use it for any header people may want to create. Suggestion: Deprecate h1.index and h1.preface. */ { mc-auto-number-format: 'Index'; mc-hidden: hidden; margin-top: 15px; } h1.preface /* Jen: Decremented. See comment on h1.index tag. */ { mc-hidden: hidden; margin-top: 15px; } p.th /* Replaced by complex selector th p */ { mc-hidden: hidden; } /* The following hides all of the list paragraph styles in the Flare UI. If you want to use those tags, change mc-hidden to from 'hidden' to 'unhidden'. */ p.ol1Start, p.ol1, p.ol2Start, p.ol2, p.ol3Start, p.ol3, p.ul1, p.ul2, p.ul3, p.listLevel1, p.listLevel2, p.listLevel3, pre.listLevel1, pre.listLevel2, pre.listLevel3 { mc-hidden: hidden; /* mc-hidden: unhidden; */ } /* Reduce the list font size and top margin if it's in a table. */ td p.ol1Start, td p.ol1, td p.ol2Start, td p.ol2, td p.ol3Start, td p.ol3, td p.ul1, td p.ul2, td p.ul3, td p.listLevel1, td p.listLevel2, td p.listLevel3, td pre.listLevel1, td pre.listLevel2, td pre.listLevel3 { margin-top: 3px; font-size: ; } /* Set the left margin for all tags that go with the deprecated list styles. IMPORTANT: The left margin for the List1.css, List2.css, and List3.css table styles are also set here. The actual table style sheets are exact copies of Page.css. If Page.css changes, those styles need to change as well. */ p.ol1, p.ol1Start, p.listLevel1, p.ul1, pre.listLevel1, table.TableStyle-List1 { margin-left: 30px; } p.ol2, p.ol2Start, p.listLevel2, p.ul2, pre.listLevel2, table.TableStyle-List2 { margin-left: 50px; } p.ol3, p.ol3Start, p.listLevel3, p.ul3, pre.listLevel3, table.TableStyle-List3 { margin-left: 70px; } p.ol1Start, p.ol1 /* Common settings for ol1 and ol1Start */ { margin-top: 10px; text-indent: -19px; mc-auto-number-class: legacy-olNumber; mc-auto-number-position: inside-head; mc-auto-number-offset: 20px; mc-next-tag: p; mc-next-class: ol1; } p.ol1Start { mc-auto-number-format: 'N:{n=1}. '; } p.toHeading + p.ol1Start, p.toHeading + p.ul1, h5 + p.ol1Start, h5 + p.ul1 /* Reduce top margin on the ol and ul tag if it's preceded by p.toHeading or h5 for legacy content. */ { margin-top: 8px; } p.ol1 { mc-auto-number-format: 'N:{n+}. '; } p.listLevel1 /* Indented para under a first level list item. */ { margin-top: 6px; } p.ol2Start, p.ol2 /* Common settings for ol2 and ol2Start */ { margin-top: 6px; text-indent: -19px; mc-auto-number-class: legacy-olNumber; mc-auto-number-position: inside-head; mc-auto-number-offset: 20px; mc-next-tag: p; mc-next-class: ol2; } p.ol2Start { mc-auto-number-format: 'A:{a=1}. '; } p.ol2 { mc-auto-number-offset: 40px; mc-auto-number-format: 'A:{a+}. '; } p.listLevel2 /* Indented para under a second level list item. */ { margin-top: 6px; } p.ol3Start, p.ol3 /* Common settings for ol3 and ol3Start */ { margin-top: 6px; text-indent: -14px; mc-auto-number-class: legacy-olNumber; mc-auto-number-position: inside-head; mc-auto-number-offset: 20px; mc-next-tag: p; mc-next-class: ol3; } p.ol3Start { mc-auto-number-format: 'B:{r=1}. '; } p.ol3 { mc-auto-number-offset: 60px; mc-auto-number-format: 'B:{r+}. '; } p.listLevel3 /* Indented para under a third level list item. */ { margin-top: 6px; margin-left: 70px; } pre.listLevel1, pre.listLevel2, pre.listLevel3 /* Deprecated pre tag for old style lists. */ { margin-top: 6px; font-family: "Courier New", "Inconsolata", "Consolas", monospace; font-size: ; } td pre.listLevel1, td pre.listLevel2, td pre.listLevel3 /* Reduces font size inside a table cell. */ { font-size: ; } /* Notes on deprecated bullet lists: In HTML, the bullets are done with a unicode character so that they display in all browsers. They look huge in the Flare WYSIWYG mode, but they render almost identically to the standard ul bullets. In Print, the bullets are done with Wingdings, because the PDF rendering of the Unicode characters is way out of whack. */ p.ul1 /* Uses Unicode 25cf (Windings l), which is a solid disc. Color, position, and size is set in the span class. */ { margin-top: 10px; margin-left: 30px; text-indent: -16px; mc-auto-number-class: legacy-ul1Bullets; mc-auto-number-position: inside-head; mc-next-tag: p; mc-next-class: ul1; mc-auto-number-format: '\25cf '; mc-auto-number-offset: 20px; } p.ul2 /* Uses Unicode 2b58 (Wingdings ¢), which is a heavy circle. Color, position, and size is set in the span class. Note: I tried unicode characters 25cb, 25ef, 26aa, 26ac, and this was the closest match. The line width is a hair less than on the standard circle list character, but as long as the lists aren't right next to each other it shouldn't matter. */ { margin-top: 6px; margin-left: 50px; text-indent: -15px; mc-auto-number-class: legacy-ul2Bullets; mc-auto-number-position: inside-head; mc-auto-number-offset: 20px; mc-next-tag: p; mc-next-class: ul2; mc-auto-number-format: '\2b58 '; } p.ul3 /* Uses Unicode 25a0 (Windings n), which is a solid square. Color, position, and size is set in the span class. */ { margin-top: 6px; margin-left: 70px; text-indent: -19px; mc-auto-number-class: legacy-ul3Bullets; mc-auto-number-position: inside-head; mc-auto-number-offset: 20px; mc-next-tag: p; mc-next-class: ul3; mc-auto-number-format: '\25a0 '; } span.legacy-olNumber /* Span class to format the autonumber in legacy lists. Should never be used by authors. */ { color: #000000; font-weight: normal; mc-hidden: hidden; } span.legacy-ul1Bullets /* Span class to format the bullet in legacy p.ul1 styles. Should never be used by authors. */ { color: #000000; font-size: 9pt; font-weight: bold; vertical-align: 3px; mc-hidden: hidden; } span.legacy-ul2Bullets /* Span class to format the bullet in legacy p.ul2 styles. Should never be used by authors. */ { color: #000000; font-size: 5pt; font-weight: bolder; vertical-align: 3px; mc-hidden: hidden; } span.legacy-ul3Bullets /* Span class to format the bullet in legacy p.ul3 styles. Should never be used by authors. */ { color: #000000; font-size: 8pt; vertical-align: 3px; font-weight: normal; mc-hidden: hidden; } MadCap|dropDownHead.LargeHeading { font-size: 1.4rem; font-style: normal; } span.mc-variable.monoVariable { font-family: "Courier New", "Inconsolata", "Consolas", monospace; } caption.captionNoChapNum { } p.p_1 { font-weight: bold; font-size: 16pt; } p.p_2 { font-size: 16pt; } p.p_3 { font-weight: bold; font-size: 12pt; text-decoration: underline; } p.p_4 { margin-bottom: 0pt; font-weight: bold; color: #FFFFFF; font-size: 12pt; } p.p_5 { margin-top: 0pt; margin-bottom: 0pt; text-align: center; font-family: Calibri; font-weight: bold; color: #FFFFFF; } p.p_6 { margin-top: 0pt; margin-bottom: 0pt; font-family: Calibri; font-weight: bold; color: #FFFFFF; } p.p_7 { margin-top: 0pt; margin-bottom: 0pt; font-family: Calibri; } p.p_8 { margin-top: 0pt; margin-bottom: 0pt; font-family: Calibri; font-weight: bold; } span.span_1 { font-family: Calibri; } p.p_9 { margin-top: 0pt; margin-bottom: 0pt; } span.span_2 { font-family: Calibri; font-weight: bold; } span.span_3 { font-weight: bold; } img.img_1 { visibility: visible; mso-wrap-style: square; width: 624px; height: 331px; } span.span_4 { font-style: italic; } p.p_10 { font-style: italic; } p.p_11 { text-decoration: underline; } span.span_5 { text-decoration: underline; } span.span_6 { font-weight: bold; text-decoration: underline; } p.p_12 { font-weight: bold; text-decoration: underline; } span.span_7 { font-weight: bold; color: #FFFFFF; font-size: 12pt; } p.p_13 { margin-bottom: 0pt; } p.p_14 { margin-bottom: 0pt; font-weight: bold; font-size: 12pt; } p.p_15 { margin-bottom: 0pt; font-size: 12pt; } span.span_8 { font-size: 12pt; } span.span_9 { font-weight: bold; font-size: 12pt; } p.p_16 { margin-bottom: 0pt; font-weight: bold; } span.span_10 { font-weight: bold; font-size: 12pt; text-decoration: underline; }