/* 0 CSS RESET */ /* http://meyerweb.com/eric/tools/css/reset/ v2.0 | 20110126 License: none (public domain) */ @import 'base_style/all'; body { @include bodyStyle1($normalfontsize, 1.4em, #212529, #ffffff, 300); // @include sidebarNavContainer(323px); } main { margin: 0 3em 0 6em; } #toc { @include toc(#05164d, #fedc5b, #05164d); @include sidebarToc(); .toc-active a { color: #05164d; } li a { text-transform: uppercase; } ul { a:hover { box-shadow: none; color: #05164d; } } } nav { @include sidebarNav(#f7f7f7, 323px, 45px); } #toggle { @include sidebarNavToggle(white, #05164D) } #myBtn { @include toTopBtn(white, #1f8ca0); text-transform: uppercase; a.anchorjs-link { @include anchorLink(#05164d) } } /* 2. Responsive navigation layout */ @media screen and (min-width: 768px) { .container { padding-left: 360px; } .rule.toc { display: none; } h1.toc-contents { margin-top: 1em; } ul#toc-list { padding: 0; margin: 0; } } div.figure { @include figureBlock(); } /* Document types + stages */ .document-type-band { @include docBand($order: 2, $offset: 180px); .document-type { top: 20px; } } .document-stage-band { @include docBand($order: 1, $textLength: 160px, $fontWeight: 300); } #governance-band p.document-type { height: 230px !important; } p.document-stage { font-weight: 300; height: 160px; } #standard-band p { height: 270px; } #proposal-band p { height: 150px; } #standard-band, #in-force-band { background-color: #00AAA9; } #standard, #in-force { border-bottom: solid 3px #00AAA9; } #specification { border-bottom: solid 3px #750697; } #specification-band { background-color: #750697; } #draft-proposal, #resolution { border-bottom: solid 3px #48a0e7; } #draft-proposal-band, #resolution-band { background-color: #48a0e7; } .coverpage-maturity { @include coverpageStageBlock(); } #draft-development, #regulation { border-bottom: solid 3px #F7803C; } #draft-development-band, #regulation-band { background-color: #F7803C; } #draft-testing { border-bottom: solid 3px #fd06fd; } #draft-testing-band { background-color: #fd06fd; } #draft-implementation { border-bottom: solid 3px #fdf906; } #draft-implementation-band { background-color: #fdf906; } #standard { border-bottom: solid 3px #00AAA9; } #standard-band { background-color: #00AAA9; } #retired { border-bottom: solid 3px #7e0d13; } #retired-band { background-color: #7e0d13; } /* 3. TYPOGRAPHY */ /* 3.1 Titles */ h1, h2, h3, h4, h5, h6, .h1, .h2, .h3, .h4, .h5, .h6 { font-family: $headerfont; color: #05164D; font-weight: 300; margin-top: 1.6em; margin-bottom: 0.3em; } h1, .h1 { font-size: 1.6em; text-transform: uppercase; margin-top: 2em; } h1#content, .h1#content { margin-top: 2em; } h2, .h2 { margin-top: 1.3em; font-size: 1.3em; font-weight: 400; } h3, .h3 { margin-top: 1.1em; font-size: 1.1em; font-weight: 100; } .TermNum, .Terms, .AltTerms { color: #05164D; } .TermNum { font-weight: 100; } h2.TermNum { margin-bottom: 0; } p.Terms { font-size: 1.1em; line-height: 1.5em; margin: 0; } p.AltTerms { /* font-style: italic; */ font-size: 1.1em; margin: 0; } .contact-info a:hover { color: #05164d; text-decoration: underline; background: none; box-shadow: 0 0 0 0; } /* 3.2 Links */ @include elementStyles(#05164d, #fedc5b, #05164d); /* 3.3 Lists */ ul, ol { margin-left: 1.2em; } ul li { list-style: none; } ul>li:before { content: "\2014"; display: inline-block; width: 1em; margin-left: -1.2em; } ul>li p:first-child { display: inline; } ul>li:first-child { margin-top: 1em; } ul ul > li:first-child { margin-top: 0; } ol ul > li:first-child { margin-top: 0; } #toc-list ul { margin-bottom: 0.25em; } #toc-list li { list-style-type: none; } #toc li:before { content: " "; display: none; } /* 3.4 Rules */ .rule { @include rule(1px, #0e1a85) } /* 3.5 Bibliograhy */ p.Biblio, p.NormRef { margin-top: 1em; margin-left: 2em; } /* 3.6 Source Code + figures */ .figure, pre, .pseudocode { @include pseudocodeBlock(#f7f7f7); } pre { @include monospaceBlockStyle() } @include admonitionBlock(); @include recommendationBlock(); .FigureTitle, .SourceTitle { @include blockTitle() } /* 3.7 Notes */ .Note { background-color: #fedc5b; color: #47430c; padding: 1.2em; margin: 1em 0 1em 0; p { margin: 0; } } .Admonition { background-color: #ffcccc; color: #47430c; padding: 1.2em; margin: 1em 0 1em 0; p { margin: 0; } } /* 3.8 Examples */ .example { @include exampleBlock(#e1eef1, #424242, 1.2em); .example-title { margin-top: 0; } pre, .pseudocode { background: none; } } /* 3.9 Tables */ table { @include table(1px solid black); } p.TableTitle { text-align: center; margin-top: 2.5em; font-weight: 400; } /* 3.10 Footnotes */ a.footnote-number { vertical-align: super; font-size: 0.8em; } .footnote { font-size: $footnotefontsize; } /* 3.11 Blockquotes */ .Quote { @include blockquoteBlock(#f7f7f7); } /* 3.12 Formulas */ .formula { @include formulaBlock(#f7f7f7) } /* 3.13 Contact Info */ .contact-info { padding: 2em; margin-top: 5em; width: 250px; text-align: left; border: #05164D solid 2px; color: #05164D !important; border-radius: 25px; } .contact-info a, .contact-info a:hover { color: #05164D; } .contact-info p, .contact-info a { @include monospaceBlockStyle(); font-weight: 400; } .contact-info .name { font-weight: 700; font-size: 1.2em; margin-bottom: 0; } .contact-info .address { font-size: 1em; line-height: 1.3em; margin-top: 0; } /* Keywords */ span.keyword { font-weight: 600; } /* Paragraphs */ p { margin-top: 1em; margin-bottom: 1em; } h2 p, .h2 p { display: inline; } /* 4.0 Page header */ /* 4.1 Top Logo */ .icon-svg { width: 100%; color: #5ecf86; } .wrapper-top { background: #05164D; color: #ffffff; padding: 2em 0; width: 100%; } .wrapper-top-bottom { width: 0; height: 0; border-top: 100px solid #05164D; border-right: 100px solid transparent; position: absolute; } .doc-number { font-size: 0.5em; font-family: $bodyfont; } .coverpage-title { padding-bottom: 0.5em; font-family: $headerfont; font-size: 1.2em; line-height: 1.5em; font-weight: 100; padding-left: 1em; padding-right: 1em; text-transform: uppercase; } .WordSection11 { padding: 0 2em 0 3em; } .info-section { padding: 0 2em 0 5em; } .prefatory-section { padding: 0 3em 0 6em; } .zzSTDTitle1, .MsoCommentText { display: none; } .coverpage { text-align: center; padding-left: 1.5em; img { height: auto; width: 400px; } } .coverpage-logo span, .coverpage-tc-name span { font-family: $bodyfont; text-transform: none; font-weight: 300; } .coverpage-tc-name { font-size: 1.2em; line-height: 1.2em; margin: 0.25em 0; } /* 4.2 Document Identity */ .coverpage-doc-identity { font-size: 2em; line-height: 2em; } .coverpage-title .title-second { display: none; } .coverpage-stage-block { font-family: $bodyfont; font-weight: 600; font-size: 1.25em; margin: 2em 0em 2em 0em; text-transform: uppercase; } /* 4.3 Draft Warning */ .coverpage-warning { border: #f36f36 solid 2px; color: #f36f36 !important; margin: 1em 2em; color: #05164d; padding: 2em 1em 1em 1em; border-radius: 25px; } .coverpage-warning .title { font-family: $headerfont; font-weight: 300; text-transform: uppercase; font-size: 1.2em; } /* 4.4 Copyright */ .boilerplate-copyright { padding: 1em; font-size: 0.9em; text-align: left; } /* .copyright .name, .copyright .address {color: #05164d;} */ /* 5.0 Other styles */ /* To top button */ @page { margin: 2cm 1cm; } @media print { .document-info, nav, .copyright { page-break-before: always; } nav { page-break-after: always; } h1, h2, h3, h4, .h1, .h2, .h3, .h4 { page-break-after: avoid; margin-top: 1.2em; } .note, .figure, pre, .pseudocode, table { page-break-inside: avoid; } .info-section { display: none; } .coverpage { height: 23cm; } .wrapper-top { top: 0; padding-top: 4cm; padding-bottom: 4cm; } .wrapper-top-bottom { margin-top: -5px; } button#myBtn { background-color: white; } .container { padding-left: 0; } h1.content, .h1.content { margin-top: 2em; line-height: 2.5em; } h1, .h1 { font-size: 1.5em; line-height: 1.5; } h2, .h2 { font-size: 1.2em } h3, .h3 { font-size: 1em; } .Note { background-color: #fedc5b; color: #47430c; padding: 5px; margin: 2em 0 1em 0; } .Note p { padding: 0 5px 0 5px; } .Admonition { background-color: #ffcccc; color: #47430c; padding: 5px; margin: 2em 0 1em 0; } .Admonition p { padding: 0 5px 0 5px; } .wrapper-top-bottom { display: none; } }