metanorma-gb 1.3.11 → 1.3.12

checksums.yaml

@@ -1,7 +1,7 @@
 ---
 SHA256:
-  metadata.gz: 31a61c0a77d30819eedfc89208580ccbb6709cdb0b5d994efba1ac228a5685d8
-  data.tar.gz: 2e0b657183a68e7072455631c5400f1746f428987da994a09e95e831d73c77b8
+  metadata.gz: 0f181fee92e6d356a357a8465fccbc2ef7b7294389df22167b3e31d9efdbd214
+  data.tar.gz: ec87fbe10ae34e5798dfa352c70ebf314e3afe473166418e70aaa928d7078686
 SHA512:
-  metadata.gz: 8da8f1a8c551db190db64aa4f6fd4f93a4a5a1fa4f158d76eb3e835197ee1488f99b58afd1618cafa5d96a6ead0ee8875915a78a088ec7a87b25781864ca48a8
-  data.tar.gz: d168a3051ff22055a0ebd0ad2cc746132ace5751991f44c64dcff9d2bd7efabdf465b046ef26aa08db6847a803473c9913d31c7517fdfaf3c6e5c54a6bd96fc0
+  metadata.gz: 356742b6011727168433ad7551d235ad4ec0807a27956fd2a8e8e80c0064b2d9da23a51dfba6ff9d2627ed6b16e6ea2e9504a61b76c0db94108b2fc99cfd85d6
+  data.tar.gz: 0c2a2658b1487d2dd0b67b1f8fc5ed33bf2b3ffecd5a4bfcfe441c3df324da34e7349599df4498c2e033e54b44d0112abf627f5c952ce818b9c5e8f1d4fbec84

data/lib/asciidoctor/gb/biblio.rng

@@ -638,9 +638,9 @@
     <zeroOrMore>
       <ref name="license"/>
     </zeroOrMore>
-    <optional>
+    <zeroOrMore>
       <ref name="bclassification"/>
-    </optional>
+    </zeroOrMore>
     <zeroOrMore>
       <ref name="bkeyword"/>
     </zeroOrMore>

data/lib/asciidoctor/gb/reqt.rng

@@ -39,6 +39,12 @@
     <optional>
       <attribute name="filename"/>
     </optional>
+    <optional>
+      <attribute name="model"/>
+    </optional>
+    <optional>
+      <attribute name="type"/>
+    </optional>
     <optional>
       <ref name="reqtitle"/>
     </optional>

data/lib/isodoc/gb/html/_coverpage.scss

@@ -0,0 +1,249 @@
+.doctitle-en, .doctitle-fr {
+    margin-top: 2em;
+    text-align: left;
+}
+
+.doctitle-en {
+  background-color: black;
+  padding-left: 3em;
+  margin-left: -3em;
+  padding-top: 2em;
+  padding-bottom: 2em;
+
+  span {
+    font-size: 1.5em;
+    line-height: 1.5em;
+    font-weight: 900;
+    display: block;
+    color: white;
+  }
+}
+
+
+.doctitle-fr span {
+  font-size: 1.2em;
+  line-height: 1.2em;
+  font-style: italic;
+  display: block;
+}
+
+span.title {
+  text-transform: uppercase;
+  font-size: 1em;
+  font-weight: 800;
+}
+
+.coverpage_docstage {
+  margin-top: 2em;
+  margin-bottom: 2em;
+}
+
+.coverpage_warning {
+  border-top: solid 1px #f36f36;
+  border-bottom: solid 1px #f36f36;
+  margin: 1em 2em;
+  color: #485094;
+  padding: 1em;
+
+  .title {
+    color: #f36f36;
+    font-weight: 500;
+  }
+
+  .content {
+    font-style: italic;
+  }
+}
+
+.coverpage_docnumber,
+.coverpage_techcommittee {
+  text-align: right;
+  font-size:14.0pt;
+}
+
+.coverpage {
+  text-align: center;
+  padding: 2em 0;
+}
+
+.coverpage-category {
+  float: left;
+  text-align: left;
+}
+
+
+.coverpage-logo {
+  color: #485094;
+}
+
+.coverpage-tc-name {
+  color: #485094;
+  font-size: 1.2em;
+  line-height: 1.2em;
+  margin: 0.25em 0;
+}
+
+.coverpage-doc-identity {
+  background-color: #485094;
+  color: white;
+  font-size: 2em;
+  line-height: 2em;
+  margin: 0.5em 0;
+}
+
+.coverpage-doc-identity-first {
+  font-size: 5mm;
+  text-align: right;
+  padding-right: 5mm;
+  padding-bottom: 1em;
+  padding-top: 1em;
+}
+
+.coverpage-title {
+  font-weight: 400;
+
+  .title-second {
+    display: none;
+  }
+}
+
+.coverpage-logo-text {
+  font-size: 24.0pt;
+}
+
+.coverpage-stage-block {
+  font-style: italic;
+  text-align: center;
+  font-size: 1.25em;
+  font-weight: 600;
+}
+
+span.date-publish {
+  float:left;
+}
+
+span.date-active {
+  float:right;
+}
+
+.coverpage-doc-relations {
+  font-size: 10.5pt;
+  padding-top: 0.5em;
+}
+
+.coverpage-title-zh {
+  font-size: 8mm;
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: center;
+
+  /* flex-direction: column; */
+  font-family: $headerfont;
+}
+
+.coverpage-title-zh span {
+  padding-top: 2mm;
+  font-size: 28pt;
+}
+
+.coverpage-title-en {
+  margin-top: 10mm;
+  font-size: 18pt;
+  display: flex;
+  flex-wrap: wrap;
+  justify-content: center;
+  font-family:$headerfont;
+}
+
+.coverpage-title-en span {
+  display: block;
+}
+
+.coverpage-title-en .title-first {
+  text-transform: uppercase;
+}
+
+
+.coverpage-iso-relation {
+  font-size: 14pt;
+  margin-top: 10mm;
+  text-align: center;
+}
+.coverpage-dates {
+  font-size:14.0pt;
+  width:100%;
+  margin-top: 25mm;
+  font-family: $headerfont;
+  border-bottom: 1px solid #000;
+}
+
+.coverpage_footer {
+  text-align:center;
+  font-size: 16pt;
+  font-weight: 600;
+  width: 100%;
+  margin-top: 10mm;
+
+  // New
+  table {
+    &, th, td {
+      border: 0;
+    }
+    th, td {
+      padding: 5px;
+      font-size: 1.1em;
+      font-weight: 600;
+    }
+  }
+  .publish {
+    vertical-align: middle;
+  }
+}
+
+
+.coverpage-banner {
+  padding-top: 5mm;
+  margin-left:auto;
+  margin-right:auto;
+  width:auto;
+  display:flex;
+  flex-wrap: wrap;
+  justify-content: center;
+}
+
+
+.coverpage-maturity {
+  font-family: 'Overpass', sans-serif;
+  font-weight: 400;
+  font-size: 1em;
+  margin: 0 0 2em 0;
+  text-transform: uppercase;
+}
+
+
+.copyright {
+  .year,
+  .message,
+  .name,
+  .address {
+    margin-top: 1em;
+    line-height: 1.1em;
+    display: block;
+  }
+
+  .message,
+  .name,
+  .address {
+    font-size: 0.9em;
+  }
+
+  .name {
+    color: #485094;
+    font-weight: 600;
+    padding-top: 1em;
+  }
+
+  .address {
+    color: #485094;
+  }
+}

data/lib/isodoc/gb/html/gb.scss

@@ -85,7 +85,7 @@ p.SourceTitle
         mso-fareast-font-family:$headerfont;
         mso-bidi-font-family:$headerfont;
         mso-ansi-language:EN-GB;}
-p.AdmonitionTitle
+p.AdmonitionTitle, p.RecommendationTitle
         {mso-style-unhide:no;
         mso-style-qformat:yes;
         mso-style-parent:"";

data/lib/isodoc/gb/html/htmlcompliantstyle.scss

@@ -1043,7 +1043,7 @@ margin: 2em 0 1em 0;
 overflow: auto;
 }
 
-.figure-title, .FigureTitle, .SourceTitle, .AdmonitionTitle {
+.figure-title, .FigureTitle, .SourceTitle, .AdmonitionTitle, .RecommendationTitle {
 font-weight: 700;
 font-size: 1em;
 text-align: center;

data/lib/isodoc/gb/html/htmlstyle.scss

@@ -1,401 +1,56 @@
-/*
-    0 CSS RESET
-*/
-
-/* http://meyerweb.com/eric/tools/css/reset/
-   v2.0 | 20110126
-   License: none (public domain)
-*/
-
-html, body, div, span, applet, object, iframe,
-h1, h2, h3, h4, h5, h6, p, blockquote, pre,
-a, abbr, acronym, address, big, cite, code,
-del, dfn, em, img, ins, kbd, q, s, samp,
-small, strike, strong, sub, sup, tt, var,
-b, u, i, center,
-ol, ul, li,
-fieldset, form, label, legend,
-table, caption, tbody, tfoot, thead, tr, th, td,
-article, aside, canvas, details, embed,
-figure, figcaption, footer, header, hgroup,
-menu, nav, output, ruby, section, summary,
-time, mark, audio, video {
-        margin: 0;
-        padding: 0;
-}   
-    
-html, body, div, span, applet, object, iframe,
-h1, h2, h3, h4, h5, h6, p, blockquote, pre,
-a, abbr, acronym, address, big, cite, code,
-del, dfn, em, img, ins, kbd, q, s, samp,
-small, strike, strong, sub, sup, tt, var,
-b, u, i, center,
-dl, dt, dd, ol, ul, li,
-fieldset, form, label, legend,
-table, caption, tbody, tfoot, thead, tr, th, td,
-article, aside, canvas, details, embed,
-figure, figcaption, footer, header, hgroup,
-menu, nav, output, ruby, section, summary,
-time, mark, audio, video {
-        border: 0;
-        font-size: 100%;
-}   
-    
-html, body, div, span, applet, object, iframe,
-h1, h2, h3, h4, h5, h6, p, blockquote, pre,
-a, abbr, acronym, address, big, cite, code,
-del, dfn, em, img, ins, kbd, q, s, samp,
-small, strike, strong, tt, var,
-b, u, i, center,
-dl, dd, ol, ul, li,
-fieldset, form, label, legend,
-table, caption, tbody, tfoot, thead, tr, th, td,
-article, aside, canvas, details, embed,
-figure, figcaption, footer, header, hgroup,
-menu, nav, output, ruby, section, summary,
-time, mark, audio, video {
-        vertical-align: baseline;
-}       
-        
-        
-html, body, div, span, applet, object, iframe,
-p, blockquote, 
-a, abbr, acronym, address, big, cite, 
-del, dfn, em, img, ins, q, s, 
-small, strike, strong, sub, sup, var,
-b, u, i, center,
-dl, dt, dd, ol, ul, li,
-fieldset, form, label, legend,
-table, caption, tbody, tfoot, thead, tr, th, td,
-article, aside, canvas, details, embed,
-figure, figcaption, footer, header, hgroup,
-menu, nav, output, ruby, section, summary,
-time, mark, audio, video {
-  font-family: $bodyfont;
-}       
-
-code, pre, tt, kbd, samp {
-  font-family: $monospacefont;
-  font-variant-ligatures: none;
-}
-       
-code *, pre *, tt *, kbd *, samp * {
-  font-family: $monospacefont !important;
-  font-variant-ligatures: none;
-}
-
-h1, h2, h3, h4, h5, h6, .h2Annex {
-  font-family: $headerfont;
-}       
+$doctype-colors-list: (
+  standard: #0ac442,
+  governance: #750697,
+  guide: #48a0e7,
+);
 
-dl {
-  display: grid;
-  grid-template-columns: max-content auto;
-}
+$docstage-colors-list: (
+  working-draft: #fda706,
+  committee-draft: #fd06fd,
+  draft-standard: #fdf906,
+  standard: #0ac442,
+  obsolete: #7e0d13,
+);
 
-dt {
-  grid-column-start: 1;
-}
+$mainContentsOffsetLeft: 4em;
 
-dd {
-  grid-column-start: 2;
-}
 
-dd p, dt p {
-  margin-top: 0px;
-}
-
-/* HTML5 display-role reset for older browsers */
-article, aside, details, figcaption, figure,
-footer, header, hgroup, menu, nav, section {
-        display: block;
-}
-body {
-        line-height: 1.3;
-}
-blockquote, q {
-        quotes: none;
-}
-blockquote:before, blockquote:after,
-q:before, q:after {
-        content: '';
-        content: none;
-}
-table {
-        border-collapse: collapse;
-        border-spacing: 0;
-}
+@import 'base_style/all';
 
 
 body {
-    margin-left: 298px;
-    margin-right: 2em;
-}
-
-main {
-    padding-left: 4em;
-    padding-right: 2em;
+  @include bodyStyle1($bodyfont, 1.3, black, white);
+  @include sidebarNavContainer(323px);
 }
 
 .title-section, .prefatory-section {
-    padding-left: 4em;
-    padding-top: 2em;
-}
-
-.prefatory-section {
-    margin-bottom: 5em;
-}
-
-.doctitle-en, .doctitle-fr {
-    margin-top: 2em;
-    text-align: left;
-}
-
-.doctitle-en {
-    background-color: black;
-    padding-left: 3em;
-    margin-left: -3em;
-    padding-top: 2em;
-    padding-bottom: 2em;
-
-}
-
-.doctitle-en span {
-    font-size: 1.5em;
-    line-height: 1.5em;
-    font-weight: 900;
-    display: block;
-    color: white;
-}
-
-
-.doctitle-fr span {
-    font-size: 1.2em;
-    line-height: 1.2em;
-    font-style: italic;
-    display: block;
-}
-
-span.title {
-    text-transform: uppercase;
-    font-size: 1em;
-    font-weight: 800;
-}
-
-.coverpage_docstage {
-    margin-top: 2em;
-    margin-bottom: 2em;
-}
-
-.coverpage_warning {
-  border-top: solid 1px #f36f36;
-  border-bottom: solid 1px #f36f36;
-  margin: 1em 2em;
-  color: #485094;
-  padding: 1em;
-}
-
-.coverpage_warning .title {
-  color: #f36f36;
-  font-weight: 500;
-}
-
-.coverpage_warning .content {
-  font-style: italic;
-}
-
-.coverpage_docnumber, .coverpage_techcommittee {
-    text-align: right;
-    font-size:14.0pt;
-}
-
-.coverpage {
-  text-align: center;
-  margin: 2em 0;
-}
-
-.coverpage-category {
-  float: left;
-  text-align: left;
-}
-
-
-.coverpage-logo {
-  color: #485094;
-}
-
-.coverpage-tc-name {
-  color: #485094;
-  font-size: 1.2em;
-  line-height: 1.2em;
-  margin: 0.25em 0;
-}
-
-.coverpage-doc-identity {
-  background-color: #485094;
-  color: white;
-  font-size: 2em;
-  line-height: 2em;
-  margin: 0.5em 0;
-}
-
-.coverpage-doc-identity-first {
-  font-size: 5mm;
-  text-align: right;
-  padding-right: 5mm;
-  padding-bottom: 1em;
-  padding-top: 1em;
-}
-
-.coverpage-title {
-  font-weight: 400;
-}
-
-.coverpage-title .title-second {
-  display: none;
-}
-
-.coverpage-logo-text {
-        font-size:24.0pt;
-}
-
-.coverpage-stage-block {
-  font-style: italic ;
-  text-align: center;
-  font-size: 1.25em;
-  font-weight: 600;
-}
-
-span.date-publish {
-  float:left;
-}
-
-span.date-active {
-  float:right;
-}
-
-.coverpage-doc-relations {
-        font-size:10.5pt;
-        padding-top: 0.5em;
-}
-
-.coverpage-title-zh {
-    font-size: 8mm;
-  display: flex;
-  flex-wrap: wrap;
-  justify-content: center;
-  /* flex-direction: column; */
-  font-family:$headerfont;
-}
+  padding-right: 2em;
 
-.coverpage-title-zh span {
-        padding-top: 2mm;
-        font-size: 28pt;
-}
-
-.coverpage-title-en {
-    margin-top: 10mm;
-    font-size: 18pt;
-      display: flex;
-  flex-wrap: wrap;
-  justify-content: center;
-        font-family:$headerfont;
-}
-
-.coverpage-title-en span {
-  display: block;
-}
-
-.coverpage-title-en .title-first {
-  text-transform: uppercase;
-}
-
-
-.coverpage-iso-relation {
-        font-size:14pt;
-                margin-top: 10mm;
-        text-align: center;
-}
-.coverpage-dates {
-        font-size:14.0pt;
-          width:100%;
-  margin-top: 25mm;
-        font-family:$headerfont;
-        border-bottom: 1px solid #000;
-}
-
-.coverpage_footer {
-  text-align:center;
-  font-size: 16pt;
-  font-weight: 600;
-  width: 100%;
-  margin-top: 10mm;
-}
-
-/* NEW */
-.coverpage_footer table, .coverpage_footer th, .coverpage_footer td {
-  border: 0;
-}
-
-/* NEW */
-.coverpage_footer th, .coverpage_footer td {
-  padding: 5px;
-  font-size: 1.1em;
-  font-weight: 600;
-}
-
-/* NEW */
-.coverpage_footer .publish {
-  vertical-align: middle;
-}
+  padding-left: $mainContentsOffsetLeft;
+  padding-top: 2em;
 
-
-.coverpage-banner {
-  padding-top: 5mm;
-  margin-left:auto;
-  margin-right:auto;
-  width:auto;
-  display:flex;
-  flex-wrap: wrap;
-  justify-content: center;
+  @media screen and (min-width: $bigscreenBreakpoint) {
+    padding-top: 0;
+  }
 }
 
 
-.copyright .name {
-    font-weight: 900;
-    padding-top: 1em;
-}
-
-.copyright .year, .copyright .message,
-.copyright .name, .copyright .address {
-    margin-top: 1em;
-    line-height: 1.1em;
-    display: block;
-}
+@import 'coverpage';
 
-.copyright .message, .copyright .name,
-.copyright .address {
-    font-size: 0.9em;
-}
 
-.copyright .name {
-  color: #485094;
-  font-weight: 600;
-}
-
-.copyright .address {
-  color: #485094;
+.prefatory-section {
+    margin-bottom: 5em;
 }
 
 
-
-/* TYPOGRAPHY */
-
 h1 {
   font-size: 1.5em; 
   line-height: 2em; 
   color: #485094;
   font-weight: 400;
+
+  margin-top: 2em;
+  margin-bottom: 1em;
 }
 
 h2 {
@@ -403,6 +58,20 @@ h2 {
   line-height: 1.5em; 
   color: #485094;
   font-weight: 300;
+
+  margin-top: 2em;
+  margin-bottom: 1em;
+
+  p {
+    display: inline;
+  }
+
+
+  &.toc-contents {
+    @media screen and (min-width: $bigscreenBreakpoint) {
+      margin-top: 1em;
+    }
+  }
 }
 
 h3 {
@@ -412,635 +81,320 @@ h3 {
   font-weight: 300;
 }
 
-
-h1 {
-    margin-top: 2em;
-    margin-bottom: 1em;
-}
-
-h2 {
-    margin-top: 2em;
-    margin-bottom: 1em;
-}
-
 h4, h5, h6 {
-    line-height: 1.2;
+  line-height: 1.2;
 }
 
-h2 p {
-    display: inline;
-}
 
 p {
-    margin-top: 1em;
-    margin-bottom: 1em;
-    line-height: 1.2em;
+  margin-top: 1em;
+  margin-bottom: 1em;
+  line-height: 1.2em;
 }
 
 p.zzSTDTitle1 {
-    font-weight: 700;
-    font-size: 1.5em;
+  font-weight: 700;
+  font-size: 1.5em;
 }
 
 span.obligation {
-    font-weight: 400;
-}
-
-a, a:visited {
-  text-decoration: none;
-  color: #485094;
-}
-
-a:hover {
-  text-style: italic;
-  color: #485094;
-}
-
-nav a {
-    color: black;
-    text-decoration: none;
-    line-height: 1.2em;
-}
-
-p.TermNum {
-  color: #485094;
   font-weight: 400;
-        margin: 0;
 }
 
-p.Terms {
-  color: #485094;
-  font-weight: 400;
-        margin: 0;
-}
-
-p.AltTerms {
-  color: #485094;
-  font-weight: 400;
-  font-style: italic;
-        margin: 0;
+sup a {
+  vertical-align: super;
+  font-size: 0.8em;
 }
 
-p.DeprecatedTerms {
-  color: #485094;
-  font-weight: 400;
-  font-style: italic;
-        margin: 0;
+a {
+  &, &:visited {
+    text-decoration: none;
+    color: #485094;
+  }
+  &:hover {
+    text-style: italic;
+    color: #485094;
+  }
 }
 
+ul, ol {
+  margin-left: 2em;
 
-/* Navigation*/
-
-@media screen and (min-width: 768px) {
-    nav {
-        position: fixed;
-        top: 0;
-        bottom: 0;
-        left: 0;
-        width: 278px;
-        font-size: 0.9em;
-        overflow: auto;
-        padding: 0 0 0 45px;
-        background-color:#f7f7f7;
-    }
-
-    #toggle {
-        position: fixed;
-        height: 100%;
-        width: 30px;
-        background-color:black;
-        color: white!important;
-        cursor: pointer;
-        margin-left: -4em;
-        margin-top: -2em;
-    }
-
-    #toggle span {
-        text-align: center;
-        width: 100%;
-        position: absolute;
-        top: 50%;
-        transform: translate(0, -50%);
-
-    }
-
-
-    .container {
-        padding-left: 360px;
-    }
-
-    .rule.toc {
-        display: none;
-    }
-
-    h1.toc-contents {
-        margin-top: 1em;
-    }
-
-    ul#toc-list {
-        padding:0;
-        margin:0;
-    }
+  li p {
+    margin-bottom: 0.6em;
+    line-height: 1.2;
+  }
 }
 
-@media screen and (max-width: 768px) {
-    #toc {
-        padding: 0 1.5em 0 1.5em;
-        overflow: visible;
-    }
-
-    #toggle {
-        display: none;
-        margin-left: -4em;
-        margin-top: -2em;
-    }
-
-    body {
-        margin-left: 2em;
-    }
-
-    main {
-        padding: 0;
-    }
-
-    .title-section, .prefatory-section {
-        padding-left: 0;
-        padding-top: 0;
-        width: 100%;
-    }
+ol > li > p:before {
+  content: "";
+  display: none;
 }
 
-  div.figure > img:not(.logo) { 
-    margin-left: auto;
-margin-right: auto;
-display: block;
-max-width: 100%;
-height: auto;
-  }
-    
 
+// Keywords
 
-#toc ul {
-    margin: 0;
-    padding: 0;
-    list-style: none;
+span.keyword {
+  font-weight: 600;
 }
 
-#toc li a {
-    padding: 5px 10px;
-}
 
-#toc a {
-    text-decoration: none;
-    display: block;
-}
+// Terms
 
-#toc a:hover {
-    box-shadow: none;
-    color: white;
+p.TermNum,
+p.Terms,
+p.AltTerms,
+p.DeprecatedTerms {
+  margin: 0;
+  color: #485094;
+  font-weight: 400;
 }
 
-#toc .h2 {
-    padding-left: 30px;
+p.AltTerms,
+p.DeprecatedTerms {
+  font-style: italic;
 }
 
-#toc .h3 {
-    padding-left: 50px;
-}
 
-#toc .toc-active a {
-    color: white;
-}
+// Nav
 
-#toc .toc-active, #toc li:hover {
-    background: #1d1d1d;
-    box-shadow: inset -5px 0px 10px -5px #1d1d1d!important;
+nav {
+  @include sidebarNav(#f7f7f7, 278px, 45px);
 
+  a {
+    color: black;
+    text-decoration: none;
+    line-height: 1.2em;
+  }
 }
 
-#toc li:hover a {
-    color: white;
-}
+#toggle {
+  @include sidebarNavToggle(white, black);
 
-/*
-ul li {
-    list-style: none;
+  @media screen and (min-width: $bigscreenBreakpoint) {
+    margin-left: -$mainContentsOffsetLeft;
+    width: 30px;
   }
+}
 
-  ul > li > p:first-child:before {
-    content: "\2014";
-    display: inline-block;
-    width: 1em;
-    margin-left: -1.5em;
-    margin-right: 0.5em;
-  }
-*/
-  
-  li p {
-      /* display: inline-block; */
-      margin-bottom: 0.6em;
-      line-height: 1.2;
-  }
+#toc {
+  @include toc(inherit, #1d1d1d, white);
 
-  #toc li:before {
+  li:before {
     content: " ";
     display: none;
   }
-
-/*
-    Document types + stages
-*/
-
-.document-type-band {
-    left:0;
-    top:180px;
-    height: 100%;
-    position: fixed;
-    display: block;
-    z-index: 99;
-    /*box-shadow: -5px 0px 10px #1d1d1d*/
-
-}
-
-.document-stage-band {
-    left:0;
-    top:0;
-    height: 100%;
-    position: fixed;
-    display: block;
-    z-index: 98;
-    box-shadow: -5px 0px 10px #1d1d1d
-}
-
-.document-type {
-    position: relative;
-    width: 25px;
 }
 
-.document-stage {
-    position: relative;
-    width: 25px;
-}
-
-p.document-type, p.document-stage {
-    color: white;
-    text-transform: uppercase;
-    font-size: 0.9em;
-    font-weight: 400;
-    letter-spacing: 0.05em;
-    margin:0;
-    margin-left: 6px;
-    writing-mode:tb-rl;
-        -webkit-transform:rotate(180deg);
-        -moz-transform:rotate(180deg);
-        -o-transform: rotate(180deg);
-        white-space:nowrap;
-        display:block;
-    bottom:0;
-}
-
-p.document-type {
-    font-weight: 400;
-    height: 210px;
-}
-
-#governance-band p.document-type {
-    font-weight: 400;
-    height: 230px!important;
-}
-
-p.document-stage {
-    font-weight: 300;
-    height:160px;
-}
-
-#standard-band {
-    background-color: #0ac442;
-}
+#toc-list {
+  ul {
+    margin-bottom: 0.25em;
+    li {
+      list-style-type: none;
+    }
+  }
 
-#standard {
-    border-bottom: solid 3px #0ac442;
+  @media screen and (min-width: $bigscreenBreakpoint) {
+    padding: 0;
+    margin: 0;
+  }
 }
 
-#governance {
-    border-bottom: solid 3px #750697;
+#myBtn {
+  @include toTopBtn($color: white, $colorBg: #1d1d1d);
 }
 
-#governance-band {
-    background-color: #750697;
-}
 
-#guide {
-    border-bottom: solid 3px #48a0e7;
-}
+// Typography misc.
 
-#guide-band {
-    background-color: #48a0e7;
-}
+.rule {
+  @include rule(1px, #0e1a85);
 
-.coverpage-maturity {
-    font-family: 'Overpass', sans-serif;
-    font-weight: 400;
-    font-size: 1em;
-    margin: 0 0 2em 0;
-    text-transform: uppercase;
+  &.toc {
+    @media screen and (min-width: $bigscreenBreakpoint) {
+      display: none;
     }
-
-#working-draft {
-    border-bottom: solid 3px #fda706;
+  }
 }
 
-#working-draft-band {
-    background-color: #fda706;
-}
 
-#committee-draft {
-    border-bottom: solid 3px #fd06fd;
-}
+// Bands
 
-#committee-draft-band {
-    background-color: #fd06fd;
-}
-
-#draft-standard {
-    border-bottom: solid 3px #fdf906;
+.document-stage-band {
+  @include docBand($order: 1, $textLength: 160px, $fontWeight: 300);
 }
 
-#draft-standard {
-    border-bottom: solid 3px #fdf906;
+.document-type-band {
+  @include docBand($order: 2, $textLength: 210px, $offset: 180px);
 }
 
-#standard {
-    border-bottom: solid 3px #0ac442;
+#governance-band p.document-type {
+  font-weight: 400;
+  height: 230px !important;
 }
 
-#standard-band {
-    background-color: #0ac442;
-}
 
-#obsolete {
-    border-bottom: solid 3px #7e0d13;
-}
+// Bibliograhy
 
-#obsolete-band {
-    background-color: #7e0d13;
+p.Biblio, p.NormRef {
+  margin-top: 1em;
+  margin-left: 2em;
 }
 
 
-/* 3 Other styles */
-
-/*
-    3.3 Lists
-*/
-
-ul, ol {margin-left: 2em;}
-
-#toc-list ul {margin-bottom: 0.25em;}
-
-#toc-list ul li {list-style-type: none;}
-
-/*
-3.4 Rules
-*/
-
-.rule {
-    width: 100%;
-    height: 1px;
-    background-color: #0e1a85;
-    margin: 2em 0;
-  }
+// Blocks
 
-/*
-3.5 Bibliograhy
-*/
+.figure {
+  @include figureBlock();
+  background-color: #f7f7f7;
 
-p.Biblio, p.NormRef {
-margin-top: 1em;
-margin-left: 2em;
+  /*
+    div.figure > img:not(.logo) { 
+      TODO:         ^^^ Relevant selector?
+      margin-left: auto;
+      margin-right: auto;
+      display: block;
+      max-width: 100%;
+      height: auto;
+    }
+  */
 }
 
-/*
-3.6 Source Code + figures
-*/
-
 .Sourcecode {
-font-family: $monospacefont;
-font-variant-ligatures: none;
+  @include sourceBlock(#f7f7f7, null);
+  // Requires fontSize: null, but needs an update in isodoc
+  // @include sourceBlock(#f7f7f7, null, null);
 }
 
-.figure, .Sourcecode, .pseudocode {
-background-color: #f7f7f7;
-line-height: 1.6em;
-padding: 1.5em;
-margin: 2em 0 1em 0;
-overflow: auto;
+.pseudocode {
+  @include pseudocodeBlock(#f7f7f7, null);
+  // Requires fontSize: null, but needs an update in isodoc
+  // @include pseudocodeBlock(#f7f7f7, null, null);
 }
 
-.figure-title, .FigureTitle, .SourceTitle, .AdmonitionTitle {
-font-weight: 700;
-font-size: 1em;
-text-align: center;
+.RecommendationTitle {
+  @include blockTitle();
 }
 
-/*
-3.7 Notes
-*/
-
 .Note, .note {
-    background-color: #fff495;
-    color: #47430c;
-    padding: 0.5em;
-    margin: 1.5em 0 1.5em 0;
-    text-align: left;
-}
+  background-color: #fff495;
+  color: #47430c;
+  padding: 0.5em;
+  margin: 1.5em 0 1.5em 0;
+  text-align: left;
 
-.Note p, .note p {
+  p {
     margin: 0;
+  }
 }
 
 .Admonition {
-    background-color: #ffcccc;
-    color: #47430c;
-    padding: 0.5em;
-    margin: 1.5em 0 1.5em 0;
-    text-align: left;
-}
+  @include admonitionBlock();
 
-.Admonition p {
+  background-color: #ffcccc;
+  color: #47430c;
+  padding: 0.5em;
+  margin: 1.5em 0 1.5em 0;
+  text-align: left;
+
+  p {
     margin: 0;
+  }
 }
 
-
-/*
-3.8 Examples
-*/
-
 .example {
-    background-color: #e1eef1;
-    padding: 0.5em;
-    margin: 2em 0 1em 0;
-    text-align: left;
-    padding-left: 2em;
-}
+  @include exampleBlock(#e1eef1, null, .5em, 1.5em);
 
-.example p {
-    margin: 0;
+  .example-title {
+    margin-top:0;
+  }
+
+  .Sourcecode, .pseudocode {
+    background: none;
+  }
 }
 
-.example .example-title {
-font-weight: 700;
-text-transform: uppercase;
-margin-top:0;
-margin-left:-1.5em;
+.blockquote, .Quote {
+  @include blockquoteBlock(#f7f7f7);
 }
 
+.formula {
+  @include formulaBlock(#f7f7f7);
 
-.example .Sourcecode, .example .pseudocode {
-      background: none;
+  margin-left: 20%;
+  margin-right: 20%;
+  font-size: 0.9em;
 }
 
-/*
-3.9 Tables
-*/
+.Admonition, .admonition {
+  background-color: #ffb3b3;
+  padding: 0.5em;
+  margin: 1.5em 0 1.5em 0;
+  text-align: left;
 
-table {
-border-collapse: collapse;
-width: 100%;
-font-weight: 300;
-margin: 1em 0 2em 0;
-margin-left: auto;
-margin-right: auto;
-padding-right: 2em;
-text-align: center;
+  p {
+    margin: 0;
+  }
 }
 
-table, th, td {
-border: 1px solid black;
-font-size: 0.95em;
-}
 
-td, th {
-padding: 1em!important;
-}
+// Tables
 
-td.header {
-font-weight: 400;
+table {
+  @include table(1px solid black);
+
+  text-align: center;
 }
 
 p.TableTitle {
-text-align: center;
-margin-top: 2.5em;
-font-weight: 800;
-font-size: 1.1em;
+  text-align: center;
+  margin-top: 2.5em;
+  font-weight: 800;
+  font-size: 1.1em;
 }
 
 .TableFootnote {
-    text-align: left!important;
+  text-align: left !important;
 }
 
-/*
-3.10 Footnotes
-*/
+
+// Footnotes
 
 a.footnote-number, a.TableFootnoteRef, span.TableFootnoteRef {
-vertical-align: super;
-font-size: 0.8em;
+  vertical-align: super;
+  font-size: 0.8em;
 }
 
 .footnote {
-font-size: 0.9em;
+  font-size: 0.9em;
 }
 
-sup a {
-    vertical-align: super;
-    font-size: 0.8em;
-  }
-  #footnote_box {
-    font-size: 14px;
-    background: white;
-    padding: 0 10px;
-    margin: 10px;
-    border: 1px solid #888;
-    -moz-box-shadow: 0px 0px 5px #888;
-    -webkit-box-shadow: 0px 0px 5px #888;
-    box-shadow: 0px 0px 5px #888;
-  }
-
-  ol.footnotes-list, aside.footnote {
-      margin-left: 1em;
-
-  }
-
-  ol.footnotes-list li, aside.footnote {
-      font-size: 0.9em;
-      vertical-align: top;
-      list-style:decimal;
-      margin-bottom: 1em;
-  }
-
-  ol.footnotes-list:first-child {
-      margin-top: 2em;
-  }
-
-  ol.footnotes-list p, aside.footnote {
-      display: inline;
-  }
-
-  ol > li > p:before {
-      content: "";
-      display: none;
-  }
-
-
-
-/*
-3.11 Blockquotes
-*/
-
-.blockquote, .Quote {
-background-color: #f7f7f7;
-font-style: italic;
-width: 80%;
-padding: 1.5em;
-margin-top: 2em;
-margin-left: auto;
-margin-right: auto;
+#footnote_box {
+  font-size: 14px;
+  background: white;
+  padding: 0 10px;
+  margin: 10px;
+  border: 1px solid #888;
+  -moz-box-shadow: 0px 0px 5px #888;
+  -webkit-box-shadow: 0px 0px 5px #888;
+  box-shadow: 0px 0px 5px #888;
 }
 
-
-/*
-3.12 Formulas
-*/
-
-.formula {
-background-color: #f7f7f7;
-padding: 1.5em;
-margin-top: 2em;
-text-align: center;
-margin-left: 20%;
-margin-right: 20%;
-font-size: 0.9em;
+ol.footnotes-list, aside.footnote {
+  margin-left: 1em;
 }
 
-/*
-Keywords
-*/
-
-span.keyword {
-font-weight: 600;
+ol.footnotes-list li, aside.footnote {
+  font-size: 0.9em;
+  vertical-align: top;
+  list-style:decimal;
+  margin-bottom: 1em;
 }
 
-
-.Admonition, .admonition {
-    background-color: #ffb3b3;
-    /* color: #47430c;*/
-    padding: 0.5em;
-    margin: 1.5em 0 1.5em 0;
-    text-align: left;
+ol.footnotes-list:first-child {
+  margin-top: 2em;
 }
 
-.Admonition p, .admonition p {
-    margin: 0;
+ol.footnotes-list p, aside.footnote {
+  display: inline;
 }
-
-