xmls css, step

4 files changed, 6304 insertions, 6286 deletions

diff --git a/org/cgi_spine_search.org b/org/cgi_spine_search.org
index 6b43058..1666a0f 100644
--- a/org/cgi_spine_search.org
+++ b/org/cgi_spine_search.org
@@ -663,7 +663,7 @@ if (!(_url_new.match(rgx.fn))) {
   _url_new = _url_new ~ _fn;
 }
 _matched_objects_text =
-  "<font size=\"2\" color=\"#666666\">"
+  "<font-size=\"2rem\" color=\"#666666\">"
   ~ "<a href=\""
   ~ _url_new
   ~ "\">"
@@ -704,7 +704,7 @@ if (_url_previous.empty) {
   arrow_previous = "";
 } else {
   arrow_previous =
-    "<font size=\"2\" color=\"#666666\">"
+    "<font-size=\"1.8rem\" color=\"#666666\">"
     ~ "<a href=\""
     ~ _url_previous
     ~ "\">"
@@ -712,7 +712,7 @@ if (_url_previous.empty) {
     ~ "</a> || </font>";
 }
 arrow_next =
-  "<font size=\"2\" color=\"#666666\">"
+  "<font-size=\"1.8rem\" color=\"#666666\">"
   ~ "<a href=\""
   ~ _url_next
   ~ "\">"
@@ -823,7 +823,7 @@ if (show_the_can == "checked") {
   // assert(method_get_url == environment.get("HTTP_REFERER", conf.query_base_url ~ conf.query_string));
   if (conf.request_method == "POST") {
     _the_can =
-      "<font size=\"2\" color=\"#666666\">"
+      "<font-size=\"1rem\" color=\"#666666\">"
       ~ "POST:&nbsp;"
       ~ "<a href=\""
       ~ method_post_url_construct
@@ -833,7 +833,7 @@ if (show_the_can == "checked") {
       ~ "<br>";
   } else if (conf.request_method == "GET") {
     _the_can =
-      "<font size=\"2\" color=\"#666666\">"
+      "<font-size=\"1rem\" color=\"#666666\">"
       ~ "GET:&nbsp;&nbsp;"
       ~ "<a href=\""
       ~ method_get_url
@@ -856,25 +856,25 @@ if (searched_tip == "checked") {
   string search_field = post_value("sf", "field");
   tf = text_fields;
   tip = format(q"┃
-<font size="2" color="#666666">
-<b>database:</b> <font size="2" color="#004000">%s</font>; <b>selected view:</b> <font size="2" color="#004000">index</font>
+<font-size="1rem" color="#666666">
+<b>database:</b> <font-size="1rem" color="#004000">%s</font>; <b>selected view:</b> <font-size="2" color="#004000">index</font>
 <b>search string:</b> %s %s %s %s %s %s<br>
 %s %s %s %s %s %s
 </font>
 ┃",
     cv.db_selected,
-    (tf.text.empty   ? "" : "\"text:   <font size=\"2\" color=\"#004000\">" ~ tf.text   ~ "</font>; "),
-    (tf.title.empty  ? "" : "\"title:  <font size=\"2\" color=\"#004000\">" ~ tf.title  ~ "</font>; "),
-    (tf.author.empty ? "" : "\"author: <font size=\"2\" color=\"#004000\">" ~ tf.author ~ "</font>; "),
-    (tf.date.empty   ? "" : "\"date    <font size=\"2\" color=\"#004000\">" ~ tf.date   ~ "</font>; "),
-    (tf.uid.empty    ? "" : "\"uid:    <font size=\"2\" color=\"#004000\">" ~ tf.uid    ~ "</font>; "),
-    (tf.fn.empty     ? "" : "\"fn:     <font size=\"2\" color=\"#004000\">" ~ tf.fn     ~ "</font>; "),
-    (tf.text.empty   ? "" :  "text:    <font size=\"2\" color=\"#004000\">" ~ tf.text   ~ "</font><br>"),
-    (tf.title.empty  ? "" : "title:    <font size=\"2\" color=\"#004000\">" ~ tf.title  ~ "</font><br>"),
-    (tf.author.empty ? "" :  "author:  <font size=\"2\" color=\"#004000\">" ~ tf.author ~ "</font><br>"),
-    (tf.date.empty   ? "" :  "date:    <font size=\"2\" color=\"#004000\">" ~ tf.date   ~ "</font><br>"),
-    (tf.uid.empty    ? "" : "\"uid:    <font size=\"2\" color=\"#004000\">" ~ tf.uid    ~ "</font>; "),
-    (tf.fn.empty     ? "" : "\"fn:     <font size=\"2\" color=\"#004000\">" ~ tf.fn     ~ "</font>; "),
+    (tf.text.empty   ? "" : "\"text:   <font-size=\"1rem\" color=\"#004000\">" ~ tf.text   ~ "</font>; "),
+    (tf.title.empty  ? "" : "\"title:  <font-size=\"1rem\" color=\"#004000\">" ~ tf.title  ~ "</font>; "),
+    (tf.author.empty ? "" : "\"author: <font-size=\"1rem\" color=\"#004000\">" ~ tf.author ~ "</font>; "),
+    (tf.date.empty   ? "" : "\"date    <font-size=\"1rem\" color=\"#004000\">" ~ tf.date   ~ "</font>; "),
+    (tf.uid.empty    ? "" : "\"uid:    <font-size=\"1rem\" color=\"#004000\">" ~ tf.uid    ~ "</font>; "),
+    (tf.fn.empty     ? "" : "\"fn:     <font-size=\"1rem\" color=\"#004000\">" ~ tf.fn     ~ "</font>; "),
+    (tf.text.empty   ? "" :  "text:    <font-size=\"1rem\" color=\"#004000\">" ~ tf.text   ~ "</font><br>"),
+    (tf.title.empty  ? "" : "title:    <font-size=\"1rem\" color=\"#004000\">" ~ tf.title  ~ "</font><br>"),
+    (tf.author.empty ? "" :  "author:  <font-size=\"1rem\" color=\"#004000\">" ~ tf.author ~ "</font><br>"),
+    (tf.date.empty   ? "" :  "date:    <font-size=\"1rem\" color=\"#004000\">" ~ tf.date   ~ "</font><br>"),
+    (tf.uid.empty    ? "" : "\"uid:    <font-size=\"1rem\" color=\"#004000\">" ~ tf.uid    ~ "</font>; "),
+    (tf.fn.empty     ? "" : "\"fn:     <font-size=\"1rem\" color=\"#004000\">" ~ tf.fn     ~ "</font>; "),
   );
 }
 return tip;
@@ -917,7 +917,7 @@ return tip;
     %s
   </td></tr></table>
   <td valign=\"top\"><tr><td>
-    <font size="2" color="#222222">
+    <font-size="1rem" color="#222222">
     <input type="hidden" name="db" value="%s">
     <input type="submit" value="SiSU search">
     <input type="radio" name="rt" id="results_type_index" value="idx" %s> index
@@ -1121,7 +1121,7 @@ LIMIT %s OFFSET %s
 #+BEGIN_SRC d
 (cv.checked_sql)
 ? cgi.write(previous_next
-    ~ "<hr><font size=\"2\" color=\"#666666\">"
+    ~ "<hr><font-size=\"1rem\" color=\"#666666\">"
     ~ sql_select.the_body.strip.split("\n  ").join(" ").split("\n").join("<br>")
     ~ "</font>\n"
   )
@@ -1319,17 +1319,22 @@ cgi.write("cv.checked_sql: "      ~ (cv.checked_sql ? "checked" : "off") ~ "<br>
 
 **** css
 
+- if base size is 16px, 62.5% is 10px
+  1rem   == 10px
+  1.6rem == 16px
+
 #+NAME: spine_search_css
 #+BEGIN_SRC css
+html {
+  font-size              : 62.5%%;
+}
 ,*{
   padding                  : 0px;
   margin                   : 2px;
 }
 body {
   height                   : 100vh;
-  background-color         : #FFFFFF;
-}
-body {
+  font-size                : 1.6rem;
   color                    : #000000;
   background               : #FFFFFF;
   background-color         : #FFFFFF;
@@ -1357,7 +1362,7 @@ a.matched_ocn:visited {
 a.matched_ocn:hover {
   color                    : #000000;
   background-color         : #F9F9AA;
-  font-size                : 100%%;
+  font-size                : 1.6rem;
 }
 a.lnkocn:link {
   color                    : #777777;
@@ -1369,7 +1374,7 @@ a.lnkocn:visited {
 }
 a.lnkocn:hover {
   color                    : #777777;
-  font-size                : 100%%;
+  font-size                : 1.6rem;
 }
 a:hover img {
   background-color         : #FFFFFF;
@@ -1404,14 +1409,14 @@ span.match {
   background-color         : #FFFF48;
 }
 input, select, textarea {
-  font-size                : 150%%;
+  font-size                : 2rem;
 }
 input[type="text"] {
-  font-size                : 150%%;
+  font-size                : 2rem;
   line-height              : 150%%;
 }
 button[type="submit"] {
-  font-size                : 150%%;
+  font-size                : 2rem;
   line-height              : 150%%;
 }
 p.norm { }
@@ -1431,7 +1436,7 @@ p[indent="h0i0"] {
   text-indent              : 0em;
 }
 p.publication {
-  font-size                : 100%%;
+  font-size                : 1.6rem;
   margin-left              : 0em;
   margin-top               : 0px;
   margin-bottom            : 0px;
@@ -1439,11 +1444,11 @@ p.publication {
   text-align               : left;
 }
 p.ocn_is {
-  font-size                : 100%%;
+  font-size                : 1.6rem;
   display                  : inline-block;
 }
 p.matched_ocn {
-  font-size                : 90%%;
+  font-size                : 1.5rem;
   margin-left              : 2em;
   margin-top               : 0px;
   margin-bottom            : 0px;
@@ -1862,7 +1867,7 @@ p.caption {
   display                  : inline;
 }
 p.endnote {
-  font-size                : 96%%;
+  font-size                : 1.5rem;
   line-height              : 120%%;
   text-align               : left;
   margin-right             : 15mm;
@@ -1889,14 +1894,14 @@ p.em {
   background               : #FFF3B6;
 }
 p.small {
-  font-size                : 80%%;
+  font-size                : 1.4rem;
   margin-top               : 0px;
   margin-bottom            : 0px;
   margin-right             : 6px;
   text-align               : left;
 }
 .tiny, .tiny_left, .tiny_right, .tiny_center {
-  font-size                : 75%%;
+  font-size                : 1.3rem;
   margin-top               : 0px;
   margin-bottom            : 0px;
   color                    : #EEEEEE;
@@ -1963,7 +1968,7 @@ pre.codeline {
   white-space              : -o-pre-wrap;
   background-color         : #555555;
   color                    : #DDDDDD;
-  font-size                : 120%%;
+  font-size                : 1.8rem;
   line-height              : 120%%;
 }
 pre.codeline::before {
@@ -2005,7 +2010,7 @@ p.left,th.left,td.left {
 }
 p.small_left,th.small_left,td.small_left {
   text-align               : left;
-  font-size                : 80%%;
+  font-size                : 1.4rem;
 }
 p.right,th.right,td.right {
   text-align               : right;
@@ -2038,14 +2043,14 @@ h4.norm, h5.norm, h6.norm, h7.norm {
   margin-top               : 10px;
   margin-bottom            : 0px;
 }
-h0 { font-size             : 125%%; }
-h1 { font-size             : 120%%; }
-h2 { font-size             : 115%%; }
-h3 { font-size             : 110%%; }
-h4 { font-size             : 105%%; }
-h5 { font-size             : 100%%; }
-h6 { font-size             : 100%%; }
-h7 { font-size             : 100%%; }
+h0 { font-size             : 2rem; }
+h1 { font-size             : 1.9rem; }
+h2 { font-size             : 1.8rem; }
+h3 { font-size             : 1.7rem; }
+h4 { font-size             : 1.6rem; }
+h5 { font-size             : 1.6rem; }
+h6 { font-size             : 1.6rem; }
+h7 { font-size             : 1.6rem; }
 h0, h1, h2, h3, h4, h5, h6, h7 {
   text-shadow              : .2em .2em .3em #999999;
 }
@@ -2065,42 +2070,42 @@ h9.i { margin-left         : 10em; }
 }
 h0.toc {
   margin-left              : 1em;
-  font-size                : 120%%;
+  font-size                : 2rem;
   line-height              : 150%%;
 }
 h1.toc {
   margin-left              : 1em;
-  font-size                : 115%%;
+  font-size                : 1.9rem;
   line-height              : 150%%;
 }
 h2.toc {
   margin-left              : 2em;
-  font-size                : 110%%;
+  font-size                : 1.8rem;
   line-height              : 140%%;
 }
 h3.toc {
   margin-left              : 3em;
-  font-size                : 105%%;
+  font-size                : 1.7rem;
   line-height              : 120%%;
 }
 h4.toc {
   margin-left              : 4em;
-  font-size                : 100%%;
+  font-size                : 1.6rem;
   line-height              : 120%%;
 }
 h5.toc {
   margin-left              : 5em;
-  font-size                : 95%%;
+  font-size                : 1.5rem;
   line-height              : 110%%;
 }
 h6.toc {
   margin-left              : 6em;
-  font-size                : 90%%;
+  font-size                : 1.4rem;
   line-height              : 110%%;
 }
 h7.toc {
   margin-left              : 7em;
-  font-size                : 85%%;
+  font-size                : 1.3rem;
   line-height              : 100%%;
 }
 .subtoc {
@@ -2109,19 +2114,19 @@ h7.toc {
 }
 h5.subtoc {
   margin-left              : 2em;
-  font-size                : 80%%;
+  font-size                : 1.5rem;
   margin-top               : 2px;
   margin-bottom            : 2px;
 }
 h6.subtoc {
   margin-left              : 3em;
-  font-size                : 75%%;
+  font-size                : 1.4rem;
   margin-top               : 0px;
   margin-bottom            : 0px;
 }
 h7.subtoc {
   margin-left              : 4em;
-  font-size                : 70%%;
+  font-size                : 1.3rem;
   margin-top               : 0px;
   margin-bottom            : 0px;
 }
diff --git a/org/out_xmls_css.org b/org/out_xmls_css.org
index d83d4c9..f49e56a 100644
--- a/org/out_xmls_css.org
+++ b/org/out_xmls_css.org
@@ -175,179 +175,185 @@ template spineCss() {
 *** html shared
 **** general
 
+- if base size is 16px, 62.5% is 10px
+  1rem   = 10px
+  1.6rem = 16px
+
 #+NAME: css_light_shared_html_general
 #+BEGIN_SRC css
-  *{
-    padding                  : 0px;
-    margin                   : 0px;
-  }
-  body {
-    height                   : 100vh;
-    background-color         : #FFFFFF;
-  }
-  body {
-    color                    : #000000;
-    background               : #FFFFFF;
-    background-color         : #FFFFFF;
-  }
+html {
+  font-size                : 62.5%%;
+}
+,*{
+  padding                  : 0px;
+  margin                   : 0px;
+}
+body {
+  height                   : 100vh;
+  font-size                : 1.6rem;
+  background-color         : #FFFFFF;
+  color                    : #000000;
+  background               : #FFFFFF;
+  background-color         : #FFFFFF;
+}
 #+END_SRC
 
 **** link
 
 #+NAME: css_light_shared_link
 #+BEGIN_SRC css
-  a:link {
-    color                    : #003399;
-    text-decoration          : none;
-  }
-  a:visited {
-    color                    : #003399;
-    text-decoration          : none;
-  }
-  a:hover {
-    color                    : #000000;
-    background-color         : #F9F9AA;
-  }
-  a.lnkocn:link {
-    color                    : %s;
-    text-decoration          : none;
-  }
-  a.lnkocn:visited {
-    color                    : #32CD32;
-    text-decoration          : none;
-  }
-  a.lnkocn:hover {
-    color                    : #777777;
-    font-size                : 120%%;
-  }
-  a:hover img {
-    background-color         : #FFFFFF;
-  }
-  a:active {
-    color                    : #003399;
-    text-decoration          : underline;
-  }
-  input {
-    color                    : #000000;
-    background-color         : #FFFFFF;
-  }
+a:link {
+  color                    : #003399;
+  text-decoration          : none;
+}
+a:visited {
+  color                    : #003399;
+  text-decoration          : none;
+}
+a:hover {
+  color                    : #000000;
+  background-color         : #F9F9AA;
+}
+a.lnkocn:link {
+  color                    : %s;
+  text-decoration          : none;
+}
+a.lnkocn:visited {
+  color                    : #32CD32;
+  text-decoration          : none;
+}
+a.lnkocn:hover {
+  color                    : #777777;
+  font-size                : 1.8rem;
+}
+a:hover img {
+  background-color         : #FFFFFF;
+}
+a:active {
+  color                    : #003399;
+  text-decoration          : underline;
+}
+input {
+  color                    : #000000;
+  background-color         : #FFFFFF;
+}
 #+END_SRC
 
 **** div
 
 #+NAME: css_light_shared_div
 #+BEGIN_SRC css
-  div {
-    margin-left              : 0;
-    margin-right             : 0;
-  }
-  div.p {
-    margin-left              : 5%%;
-    margin-right             : 1%%;
-  }
-  div.substance {
-    width                    : 100%%;
-    background-color         : #FFFFFF;
-  }
-  div.ocn {
-    width                    : 5%%;
-    float                    : right;
-    top                      : 0;
-    background-color         : #FFFFFF;
-  }
-  div.endnote {
-    width                    : 95%%;
-    background-color         : #FFFFFF;
-  }
-  div.toc {
-    position                 : absolute;
-    float                    : left;
-    margin                   : 0;
-    padding                  : 0;
-    padding-top              : 0.5em;
-    border                   : 0;
-    width                    : 13em;
-    background-color         : #EEEEEE;
-    margin-right             : 1em;
-  }
-  div.summary {
-    margin                   : 0;
-    padding                  : 0;
-    border-left              : 13em solid #EEEEEE;
-    padding-left             : 1em;
-    background-color         : #EEEEEE;
-  }
-  div.content, div.main_column {
-    margin                   : 0;
-    padding                  : 0;
-    border-left              : 13em solid #FFFFFF;
-    padding-left             : 1em;
-    padding-right            : 1em;
-  }
-  div.content0, div.main_column0 {
-    margin                   : 0;
-    padding                  : 0;
-    border-left              : 0%% solid #FFFFFF;
-    padding-left             : 5%%;
-  }
-  div.scroll {
-    margin                   : 0;
-    padding                  : 0;
-    padding-left             : 1em;
-    padding-right            : 1em;
-  }
-  div.content:after {
-    content                  : ' ';
-    clear                    : both;
-    display                  : block;
-    height                   : 0;
-    overflow                 : hidden;
-  }
-  div.footer {
-    clear                    : left;
-    padding                  : 0.5em;
-    font-size                : 80%%;
-    margin                   : 0;
-  }
-  div.toc ul {
-    list-style               : none;
-    padding                  : 0;
-    margin                   : 0;
-  }
-  div.toc li ul a, li ul span.currentlink
-  {
-    font-weight              : normal;
-    font-size                : 90%%;
-    padding-left             : 2em;
-    background-color         : #EEEEEE;
-  }
-  div.toc a, span.currentlink{
-    display                  : block;
-    text-decoration          : none;
-    padding-left             : 0.5em;
-    color                    : #0000aa;
-  }
-  hr {
-    width                    : 90%%;
-    margin-left              : 5%%;
-    margin-right             : 2em;
-    margin-top               : 1.8em;
-    margin-bottom            : 1.8em;
-  }
-  span.currentlink {
-    text-decoration          : none;
-    background-color         : #AAAAAA;
-  }
-  div.toc a:visited {
-    color                    : #0000aa;
-  }
-  div.toc a:hover {
-    color                    : #000000;
-    background-color         : #F9F9AA;
-  }
-  nav#toc ol {
-    list-style-type          : none;
-  }
+div {
+  margin-left              : 0;
+  margin-right             : 0;
+}
+div.p {
+  margin-left              : 5%%;
+  margin-right             : 1%%;
+}
+div.substance {
+  width                    : 100%%;
+  background-color         : #FFFFFF;
+}
+div.ocn {
+  width                    : 5%%;
+  float                    : right;
+  top                      : 0;
+  background-color         : #FFFFFF;
+}
+div.endnote {
+  width                    : 95%%;
+  background-color         : #FFFFFF;
+}
+div.toc {
+  position                 : absolute;
+  float                    : left;
+  margin                   : 0;
+  padding                  : 0;
+  padding-top              : 0.5em;
+  border                   : 0;
+  width                    : 13em;
+  background-color         : #EEEEEE;
+  margin-right             : 1em;
+}
+div.summary {
+  margin                   : 0;
+  padding                  : 0;
+  border-left              : 13em solid #EEEEEE;
+  padding-left             : 1em;
+  background-color         : #EEEEEE;
+}
+div.content, div.main_column {
+  margin                   : 0;
+  padding                  : 0;
+  border-left              : 13em solid #FFFFFF;
+  padding-left             : 1em;
+  padding-right            : 1em;
+}
+div.content0, div.main_column0 {
+  margin                   : 0;
+  padding                  : 0;
+  border-left              : 0%% solid #FFFFFF;
+  padding-left             : 5%%;
+}
+div.scroll {
+  margin                   : 0;
+  padding                  : 0;
+  padding-left             : 1em;
+  padding-right            : 1em;
+}
+div.content:after {
+  content                  : ' ';
+  clear                    : both;
+  display                  : block;
+  height                   : 0;
+  overflow                 : hidden;
+}
+div.footer {
+  clear                    : left;
+  padding                  : 0.5em;
+  font-size                : 1.4rem;
+  margin                   : 0;
+}
+div.toc ul {
+  list-style               : none;
+  padding                  : 0;
+  margin                   : 0;
+}
+div.toc li ul a, li ul span.currentlink
+{
+  font-weight              : normal;
+  font-size                : 1.5rem;
+  padding-left             : 2em;
+  background-color         : #EEEEEE;
+}
+div.toc a, span.currentlink{
+  display                  : block;
+  text-decoration          : none;
+  padding-left             : 0.5em;
+  color                    : #0000aa;
+}
+hr {
+  width                    : 90%%;
+  margin-left              : 5%%;
+  margin-right             : 2em;
+  margin-top               : 1.8em;
+  margin-bottom            : 1.8em;
+}
+span.currentlink {
+  text-decoration          : none;
+  background-color         : #AAAAAA;
+}
+div.toc a:visited {
+  color                    : #0000aa;
+}
+div.toc a:hover {
+  color                    : #000000;
+  background-color         : #F9F9AA;
+}
+nav#toc ol {
+  list-style-type          : none;
+}
 #+END_SRC
 
 **** paragraphs headings blocks
@@ -355,221 +361,221 @@ template spineCss() {
 
 #+NAME: css_light_shared_paragraphs_headings_blocks_misc
 #+BEGIN_SRC css
-  .norm, .bold, .verse, .group, .block, .alt {
-    line-height              : 133%%;
-    margin-top               : 12px;
-    margin-bottom            : 0px;
-    padding-left             : 0em;
-    text-indent              : 0em;
-  }
-  p, h0, h1, h2, h3, h4, h5, h6, h7, ul, li {
-    display                  : block;
-    font-family              : verdana, arial, georgia, tahoma, sans-serif, helvetica, times, roman;
-    margin-left              : 5%%;
-    margin-right             : 2em;
-  }
-  p {
-    font-size                : 100%%;
-    font-weight              : normal;
-    line-height              : 133%%;
-    text-align               : justify;
-    text-indent              : 0mm;
-    margin-top               : 0.8em;
-    margin-bottom            : 0.8em;
-  }
+.norm, .bold, .verse, .group, .block, .alt {
+  line-height              : 133%%;
+  margin-top               : 12px;
+  margin-bottom            : 0px;
+  padding-left             : 0em;
+  text-indent              : 0em;
+}
+p, h0, h1, h2, h3, h4, h5, h6, h7, ul, li {
+  display                  : block;
+  font-family              : verdana, arial, georgia, tahoma, sans-serif, helvetica, times, roman;
+  margin-left              : 5%%;
+  margin-right             : 2em;
+}
+p {
+  font-size                : 1.6rem;
+  font-weight              : normal;
+  line-height              : 133%%;
+  text-align               : justify;
+  text-indent              : 0mm;
+  margin-top               : 0.8em;
+  margin-bottom            : 0.8em;
+}
 #+END_SRC
 
 ***** img
 
 #+NAME: css_light_shared_img
 #+BEGIN_SRC css
-  img {
-    max-width                : 100%%;
-    height                   : auto;
-  }
+img {
+  max-width                : 100%%;
+  height                   : auto;
+}
 #+END_SRC
 
 ***** code block
 
 #+NAME: css_light_shared_code_block
 #+BEGIN_SRC css
-  pre {
-    width                    : auto;
-    display                  : block;
-    clear                    : both;
-    color                    : #555555;
-  }
-  pre.codeline {
-    display                  : table;
-    clear                    : both;
-    table-layout             : fixed;
-    margin-left              : 5%%;
-    margin-right             : 5%%;
-    width                    : 90%%;
-    white-space              : pre-wrap;
-    border-style             : none;
-    border-radius            : 5px 5px 5px 5px;
-    box-shadow               : 0 2px 5px #AAAAAA inset;
-    margin-bottom            : 1em;
-    padding                  : 0.5em 1em;
-    page-break-inside        : avoid;
-    word-wrap                : break-word;
-    font-family              : inconsolata, "liberation mono", "bitstream vera mono", "dejavu mono", monaco, consolas, "andale mono", "courier new", "courier 10 pitch", courier, monospace;
-    white-space              : pre;
-    white-space              : pre-wrap;
-    white-space              : -moz-pre-wrap;
-    white-space              : -o-pre-wrap;
-    background-color         : #EEEEEE;
-    color                    : #000000;
-    font-size                : 95%%;
-    line-height              : 100%%;
-  }
-  pre.codeline::before {
-    counter-reset            : linenum;
-  }
-  pre.codeline span.tr {
-    display                  : table-row;
-    counter-increment        : linenum;
-  }
-  pre.codeline span.th {
-    display                  : table-cell;
-    user-select              : none;
-    -moz-user-select         : none;
-    -webkit-user-select      : none;
-    padding                  : 0.5em 0.5em;
-    /* background-color         : #666666; */
-  }
-  pre.codeline span.th::before {
-    content                  : counter(linenum) ".";
-    color                    : #999999;
-    text-align               : right;
-    display                  : block;
-  }
-  pre.codeline span.th {
-    width                    : 4em;
-  }
-  pre.codeline code {
-    display                  : table-cell;
-  }
-  p.code {
-    border-style             : none;
-  }
+pre {
+  width                    : auto;
+  display                  : block;
+  clear                    : both;
+  color                    : #555555;
+}
+pre.codeline {
+  display                  : table;
+  clear                    : both;
+  table-layout             : fixed;
+  margin-left              : 5%%;
+  margin-right             : 5%%;
+  width                    : 90%%;
+  white-space              : pre-wrap;
+  border-style             : none;
+  border-radius            : 5px 5px 5px 5px;
+  box-shadow               : 0 2px 5px #AAAAAA inset;
+  margin-bottom            : 1em;
+  padding                  : 0.5em 1em;
+  page-break-inside        : avoid;
+  word-wrap                : break-word;
+  font-family              : inconsolata, "liberation mono", "bitstream vera mono", "dejavu mono", monaco, consolas, "andale mono", "courier new", "courier 10 pitch", courier, monospace;
+  white-space              : pre;
+  white-space              : pre-wrap;
+  white-space              : -moz-pre-wrap;
+  white-space              : -o-pre-wrap;
+  background-color         : #EEEEEE;
+  color                    : #000000;
+  font-size                : 1.5rem;
+  line-height              : 100%%;
+}
+pre.codeline::before {
+  counter-reset            : linenum;
+}
+pre.codeline span.tr {
+  display                  : table-row;
+  counter-increment        : linenum;
+}
+pre.codeline span.th {
+  display                  : table-cell;
+  user-select              : none;
+  -moz-user-select         : none;
+  -webkit-user-select      : none;
+  padding                  : 0.5em 0.5em;
+  /* background-color         : #666666; */
+}
+pre.codeline span.th::before {
+  content                  : counter(linenum) ".";
+  color                    : #999999;
+  text-align               : right;
+  display                  : block;
+}
+pre.codeline span.th {
+  width                    : 4em;
+}
+pre.codeline code {
+  display                  : table-cell;
+}
+p.code {
+  border-style             : none;
+}
 #+END_SRC
 
 ***** paragraph general
 
 #+NAME: css_light_shared_paragraph_general
 #+BEGIN_SRC css
-  p.spaced { white-space     : pre; }
-  p.block {
-    white-space              : pre;
-  }
-  p.group { }
-  p.alt { }
-  p.verse {
-    white-space              : pre;
-    margin-bottom            : 6px;
-  }
-  p.caption {
-    text-align               : left;
-    font-size                : 80%%;
-    display                  : inline;
-  }
-  p.endnote {
-    font-size                : 96%%;
-    line-height              : 120%%;
-    text-align               : left;
-    margin-right             : 15mm;
-    padding-left             : 1em;
-    text-indent              : -1em;
-  }
-  p.center {
-    text-align               : center;
-  }
-  p.bold {
-    font-weight              : bold;
-  }
-  p.bold_left {
-    font-weight              : bold;
-    text-align               : left;
-  }
-  p.centerbold {
-    text-align               : center;
-    font-weight              : bold;
-  }
-  p.em {
-    font-weight              : bold;
-    font-style               : normal;
-    background               : #FFF3B6;
-  }
-  p.small {
-    font-size                : 80%%;
-    margin-top               : 0px;
-    margin-bottom            : 0px;
-    margin-right             : 6px;
-    text-align               : left;
-  }
-  .tiny, .tiny_left, .tiny_right, .tiny_center {
-    font-size                : 75%%;
-    margin-top               : 0px;
-    margin-bottom            : 0px;
-    color                    : #777777;
-    margin-right             : 6px;
-    text-align               : left;
-  }
-  p.tiny { }
-  p.tiny_left {
-    margin-left              : 0px;
-    margin-right             : 0px;
-    text-align               : left;
-  }
-  p.tiny_right {
-    margin-right             : 1em;
-    text-align               : right;
-  }
-  p.tiny_center {
-    margin-left              : 0px;
-    margin-right             : 0px;
-    text-align               : center;
-  }
-  p.concordance_word {
-    line-height              : 150%%;
-    font-weight              : bold;
-    display                  : inline;
-    margin-top               : 4px;
-    margin-bottom            : 1px;
-  }
-  p.concordance_count {
-    font-size                : 80%%;
-    color                    : #777777;
-    display                  : inline;
-    margin-left              : 0em;
-  }
-  p.concordance_object {
-    font-size                : 80%%;
-    line-height              : 120%%;
-    text-align               : left;
-    margin-left              : 3em;
-    margin-top               : 1px;
-    margin-bottom            : 3px;
-  }
-  p.book_index_lev1 {
-    line-height              : 100%%;
-    margin-top               : 4px;
-    margin-bottom            : 1px;
-  }
-  p.book_index_lev2 {
-    line-height              : 100%%;
-    text-align               : left;
-    margin-left              : 3em;
-    margin-top               : 1px;
-    margin-bottom            : 3px;
-  }
-  tt {
-    font-family              : inconsolata, "liberation mono", "bitstream vera mono", "dejavu mono", monaco, consolas, "andale mono", "courier new", "courier 10 pitch", courier, monospace;
-    background-color         : #EEEEEE;
-    color                    : #000000;
-  }
+p.spaced { white-space     : pre; }
+p.block {
+  white-space              : pre;
+}
+p.group { }
+p.alt { }
+p.verse {
+  white-space              : pre;
+  margin-bottom            : 6px;
+}
+p.caption {
+  text-align               : left;
+  font-size                : 1.4rem;
+  display                  : inline;
+}
+p.endnote {
+  font-size                : 1.55rem;
+  line-height              : 120%%;
+  text-align               : left;
+  margin-right             : 15mm;
+  padding-left             : 1em;
+  text-indent              : -1em;
+}
+p.center {
+  text-align               : center;
+}
+p.bold {
+  font-weight              : bold;
+}
+p.bold_left {
+  font-weight              : bold;
+  text-align               : left;
+}
+p.centerbold {
+  text-align               : center;
+  font-weight              : bold;
+}
+p.em {
+  font-weight              : bold;
+  font-style               : normal;
+  background               : #FFF3B6;
+}
+p.small {
+  font-size                : 1.4rem;
+  margin-top               : 0px;
+  margin-bottom            : 0px;
+  margin-right             : 6px;
+  text-align               : left;
+}
+.tiny, .tiny_left, .tiny_right, .tiny_center {
+  font-size                : 1.2rem;
+  margin-top               : 0px;
+  margin-bottom            : 0px;
+  color                    : #777777;
+  margin-right             : 6px;
+  text-align               : left;
+}
+p.tiny { }
+p.tiny_left {
+  margin-left              : 0px;
+  margin-right             : 0px;
+  text-align               : left;
+}
+p.tiny_right {
+  margin-right             : 1em;
+  text-align               : right;
+}
+p.tiny_center {
+  margin-left              : 0px;
+  margin-right             : 0px;
+  text-align               : center;
+}
+p.concordance_word {
+  line-height              : 150%%;
+  font-weight              : bold;
+  display                  : inline;
+  margin-top               : 4px;
+  margin-bottom            : 1px;
+}
+p.concordance_count {
+  font-size                : 1.4rem;
+  color                    : #777777;
+  display                  : inline;
+  margin-left              : 0em;
+}
+p.concordance_object {
+  font-size                : 1.4rem;
+  line-height              : 120%%;
+  text-align               : left;
+  margin-left              : 3em;
+  margin-top               : 1px;
+  margin-bottom            : 3px;
+}
+p.book_index_lev1 {
+  line-height              : 100%%;
+  margin-top               : 4px;
+  margin-bottom            : 1px;
+}
+p.book_index_lev2 {
+  line-height              : 100%%;
+  text-align               : left;
+  margin-left              : 3em;
+  margin-top               : 1px;
+  margin-bottom            : 3px;
+}
+tt {
+  font-family              : inconsolata, "liberation mono", "bitstream vera mono", "dejavu mono", monaco, consolas, "andale mono", "courier new", "courier 10 pitch", courier, monospace;
+  background-color         : #EEEEEE;
+  color                    : #000000;
+}
 #+END_SRC
 
 ***** paragraph indent
@@ -583,173 +589,173 @@ template spineCss() {
 
 #+NAME: css_light_shared_misc_tables_lists
 #+BEGIN_SRC css
-  note { white-space         : pre; }
-  label.ocn {
-    width                    : 2%%;
-    float                    : right;
-    top                      : 0;
-    font-size                : 80%%;
-    margin-top               : 0px;
-    margin-bottom            : 6px;
-    margin-right             : 6px;
-    text-align               : right;
-    color                    : %s;
-    -khtml-user-select       : none;
-    -moz-user-select         : none;
-    -ms-user-select          : none;
-    -o-user-select           : none;
-    -webkit-user-select      : none;
-    user-select              : none;
-  }
-  table {
-    display                  : block;
-    margin-left              : 5%%;
-    margin-right             : 2em;
-    background-color         : inherit;
-  }
-  tr { }
-  th,td {
-    vertical-align           : top;
-    text-align               : left;
-  }
-  th {
-    font-weight              : bold;
-  }
-  em {
-    font-weight              : bold;
-    font-style               : italic;
-  }
-  p.left,th.left,td.left {
-    text-align               : left;
-  }
-  p.small_left,th.small_left,td.small_left {
-    text-align               : left;
-    font-size                : 80%%;
-  }
-  p.right,th.right,td.right {
-    text-align               : right;
-  }
-  ul, li {
-    list-style-type          : none;
-    list-style               : none;
-    padding-left             : 20px;
-    font-weight              : normal;
-    line-height              : 150%%;
-    text-align               : left;
-    text-indent              : 0mm;
-    margin-left              : 1em;
-    margin-right             : 2em;
-    margin-top               : 3px;
-    margin-bottom            : 3px;
-  }
-  li {
-    background               : url(../image_sys/bullet_09.png) no-repeat 0px 6px;
-  }
-  ul { }
+note { white-space         : pre; }
+label.ocn {
+  width                    : 2%%;
+  float                    : right;
+  top                      : 0;
+  font-size                : 1.4rem;
+  margin-top               : 0px;
+  margin-bottom            : 6px;
+  margin-right             : 6px;
+  text-align               : right;
+  color                    : %s;
+  -khtml-user-select       : none;
+  -moz-user-select         : none;
+  -ms-user-select          : none;
+  -o-user-select           : none;
+  -webkit-user-select      : none;
+  user-select              : none;
+}
+table {
+  display                  : block;
+  margin-left              : 5%%;
+  margin-right             : 2em;
+  background-color         : inherit;
+}
+tr { }
+th,td {
+  vertical-align           : top;
+  text-align               : left;
+}
+th {
+  font-weight              : bold;
+}
+em {
+  font-weight              : bold;
+  font-style               : italic;
+}
+p.left,th.left,td.left {
+  text-align               : left;
+}
+p.small_left,th.small_left,td.small_left {
+  text-align               : left;
+  font-size                : 1.4rem;
+}
+p.right,th.right,td.right {
+  text-align               : right;
+}
+ul, li {
+  list-style-type          : none;
+  list-style               : none;
+  padding-left             : 20px;
+  font-weight              : normal;
+  line-height              : 150%%;
+  text-align               : left;
+  text-indent              : 0mm;
+  margin-left              : 1em;
+  margin-right             : 2em;
+  margin-top               : 3px;
+  margin-bottom            : 3px;
+}
+li {
+  background               : url(../image_sys/bullet_09.png) no-repeat 0px 6px;
+}
+ul { }
 #+END_SRC
 
 ***** headings
 
 #+NAME: css_light_shared_headings
 #+BEGIN_SRC css
-  h0, h1, h2, h3, h4, h5, h6, h7 {
-    font-weight              : bold;
-    line-height              : 120%%;
-    text-align               : left;
-    margin-top               : 20px;
-    margin-bottom            : 10px;
-  }
-  h4.norm, h5.norm, h6.norm, h7.norm {
-    margin-top               : 10px;
-    margin-bottom            : 0px;
-  }
-  h0 { font-size             : 125%%; }
-  h1 { font-size             : 120%%; }
-  h2 { font-size             : 115%%; }
-  h3 { font-size             : 110%%; }
-  h4 { font-size             : 105%%; }
-  h5 { font-size             : 100%%; }
-  h6 { font-size             : 100%%; }
-  h7 { font-size             : 100%%; }
-  h0, h1, h2, h3, h4, h5, h6, h7 {
-    text-shadow              : .2em .2em .3em #808080;
-  }
-  h1.i { margin-left         : 2em; }
-  h2.i { margin-left         : 3em; }
-  h3.i { margin-left         : 4em; }
-  h4.i { margin-left         : 5em; }
-  h5.i { margin-left         : 6em; }
-  h6.i { margin-left         : 7em; }
-  h7.i { margin-left         : 8em; }
-  h8.i { margin-left         : 9em; }
-  h9.i { margin-left         : 10em; }
-  .toc {
-    font-weight              : normal;
-    margin-top               : 6px;
-    margin-bottom            : 6px;
-  }
-  h0.toc {
-    margin-left              : 1em;
-    font-size                : 120%%;
-    line-height              : 150%%;
-  }
-  h1.toc {
-    margin-left              : 1em;
-    font-size                : 115%%;
-    line-height              : 150%%;
-  }
-  h2.toc {
-    margin-left              : 2em;
-    font-size                : 110%%;
-    line-height              : 140%%;
-  }
-  h3.toc {
-    margin-left              : 3em;
-    font-size                : 105%%;
-    line-height              : 120%%;
-  }
-  h4.toc {
-    margin-left              : 4em;
-    font-size                : 100%%;
-    line-height              : 120%%;
-  }
-  h5.toc {
-    margin-left              : 5em;
-    font-size                : 95%%;
-    line-height              : 110%%;
-  }
-  h6.toc {
-    margin-left              : 6em;
-    font-size                : 90%%;
-    line-height              : 110%%;
-  }
-  h7.toc {
-    margin-left              : 7em;
-    font-size                : 85%%;
-    line-height              : 100%%;
-  }
-  .subtoc {
-    margin-right             : 34%%;
-    font-weight              : normal;
-  }
-  h5.subtoc {
-    margin-left              : 2em;
-    font-size                : 80%%;
-    margin-top               : 2px;
-    margin-bottom            : 2px;
-  }
-  h6.subtoc {
-    margin-left              : 3em;
-    font-size                : 75%%;
-    margin-top               : 0px;
-    margin-bottom            : 0px;
-  }
-  h7.subtoc {
-    margin-left              : 4em;
-    font-size                : 70%%;
-    margin-top               : 0px;
-    margin-bottom            : 0px;
-  }
+h0, h1, h2, h3, h4, h5, h6, h7 {
+  font-weight              : bold;
+  line-height              : 120%%;
+  text-align               : left;
+  margin-top               : 20px;
+  margin-bottom            : 10px;
+}
+h4.norm, h5.norm, h6.norm, h7.norm {
+  margin-top               : 10px;
+  margin-bottom            : 0px;
+}
+h0 { font-size             : 1.85rem; }
+h1 { font-size             : 1.8rem; }
+h2 { font-size             : 1.75rem; }
+h3 { font-size             : 1.7rem; }
+h4 { font-size             : 1.65rem; }
+h5 { font-size             : 1.6rem; }
+h6 { font-size             : 1.55rem; }
+h7 { font-size             : 1.5rem; }
+h0, h1, h2, h3, h4, h5, h6, h7 {
+  text-shadow              : .2em .2em .3em #808080;
+}
+h1.i { margin-left         : 2em; }
+h2.i { margin-left         : 3em; }
+h3.i { margin-left         : 4em; }
+h4.i { margin-left         : 5em; }
+h5.i { margin-left         : 6em; }
+h6.i { margin-left         : 7em; }
+h7.i { margin-left         : 8em; }
+h8.i { margin-left         : 9em; }
+h9.i { margin-left         : 10em; }
+.toc {
+  font-weight              : normal;
+  margin-top               : 6px;
+  margin-bottom            : 6px;
+}
+h0.toc {
+  margin-left              : 1em;
+  font-size                : 1.85rem;
+  line-height              : 150%%;
+}
+h1.toc {
+  margin-left              : 1em;
+  font-size                : 1.8rem;
+  line-height              : 150%%;
+}
+h2.toc {
+  margin-left              : 2em;
+  font-size                : 1.75rem;
+  line-height              : 140%%;
+}
+h3.toc {
+  margin-left              : 3em;
+  font-size                : 1.7rem;
+  line-height              : 120%%;
+}
+h4.toc {
+  margin-left              : 4em;
+  font-size                : 1.65rem;
+  line-height              : 120%%;
+}
+h5.toc {
+  margin-left              : 5em;
+  font-size                : 1.6rem;
+  line-height              : 110%%;
+}
+h6.toc {
+  margin-left              : 6em;
+  font-size                : 1.55rem;
+  line-height              : 110%%;
+}
+h7.toc {
+  margin-left              : 7em;
+  font-size                : 1.5rem;
+  line-height              : 100%%;
+}
+.subtoc {
+  margin-right             : 34%%;
+  font-weight              : normal;
+}
+h5.subtoc {
+  margin-left              : 2em;
+  font-size                : 1.45rem;
+  margin-top               : 2px;
+  margin-bottom            : 2px;
+}
+h6.subtoc {
+  margin-left              : 3em;
+  font-size                : 1.4rem;
+  margin-top               : 0px;
+  margin-bottom            : 0px;
+}
+h7.subtoc {
+  margin-left              : 4em;
+  font-size                : 1.35rem;
+  margin-top               : 0px;
+  margin-bottom            : 0px;
+}
 #+END_SRC
 
 *** html seg
@@ -757,115 +763,115 @@ template spineCss() {
 
 #+NAME: css_light_html_seg_previous_next
 #+BEGIN_SRC css
-  .icon-bar {
-    width                    : 100%%;
-    overflow                 : auto;
-    margin                   : 0em 0em 0em;
-  }
-  .left-bar {
-    width                    : 85%%;
-    float                    : left;
-    display                  : inline;
-    overflow                 : auto;
-  }
-  .toc-button {
-    position                 : absolute;
-    top                      : 8px;
-    width                    : 3em;
-    height                   : 3em;
-    border-radius            : 50%%;
-    background               : #CCCCCC;
-    fill                     : #333333;
-    box-shadow               : 0 2px 5px #AAAAAA inset;
-  }
-  .toc-button svg {
-    position                 : relative;
-    left                     : 25%%;
-    top                      : 25%%;
-    width                    : 150%%;
-    height                   : 150%%;
-  }
-  .toc-button p {
-    vertical-align           : center;
-    font-size                : 120%%;
-  }
-  .prev-next-button {
-    position                 : absolute;
-    top                      : 8px;
-    width                    : 3em;
-    height                   : 3em;
-    border-radius            : 50%%;
-    background               : #CCCCCC;
-    box-shadow               : 0 2px 5px #AAAAAA inset;
-  }
-  .prev-next-button svg {
-    position                 : relative;
-    left                     : 20%%;
-    top                      : 20%%;
-    width                    : 60%%;
-    height                   : 60%%;
-  }
-  .menu {
-    right                    : 8em;
-   }
-  .previous {
-    right                    : 4em;
-   }
-  .next {
-    right                    : 0em;
-   }
-  .arrow {
-    fill                     : #333333;
-  }
-  .minitoc {
-    line-height              : 120%%;
-    font-size                : 100%%;
-    margin-top               : 6px;
-    margin-bottom            : 0px;
-    padding-left             : 0em;
-    text-indent              : 0em;
-    -khtml-user-select       : none;
-    -moz-user-select         : none;
-    -ms-user-select          : none;
-    -o-user-select           : none;
-    -webkit-user-select      : none;
-    user-select              : none;
-  }
+.icon-bar {
+  width                    : 100%%;
+  overflow                 : auto;
+  margin                   : 0em 0em 0em;
+}
+.left-bar {
+  width                    : 85%%;
+  float                    : left;
+  display                  : inline;
+  overflow                 : auto;
+}
+.toc-button {
+  position                 : absolute;
+  top                      : 8px;
+  width                    : 3em;
+  height                   : 3em;
+  border-radius            : 50%%;
+  background               : #CCCCCC;
+  fill                     : #333333;
+  box-shadow               : 0 2px 5px #AAAAAA inset;
+}
+.toc-button svg {
+  position                 : relative;
+  left                     : 25%%;
+  top                      : 25%%;
+  width                    : 150%%;
+  height                   : 150%%;
+}
+.toc-button p {
+  vertical-align           : center;
+  font-size                : 1.8rem;
+}
+.prev-next-button {
+  position                 : absolute;
+  top                      : 8px;
+  width                    : 3em;
+  height                   : 3em;
+  border-radius            : 50%%;
+  background               : #CCCCCC;
+  box-shadow               : 0 2px 5px #AAAAAA inset;
+}
+.prev-next-button svg {
+  position                 : relative;
+  left                     : 20%%;
+  top                      : 20%%;
+  width                    : 60%%;
+  height                   : 60%%;
+}
+.menu {
+  right                    : 8em;
+ }
+.previous {
+  right                    : 4em;
+ }
+.next {
+  right                    : 0em;
+ }
+.arrow {
+  fill                     : #333333;
+}
+.minitoc {
+  line-height              : 120%%;
+  font-size                : 1.6rem;
+  margin-top               : 6px;
+  margin-bottom            : 0px;
+  padding-left             : 0em;
+  text-indent              : 0em;
+  -khtml-user-select       : none;
+  -moz-user-select         : none;
+  -ms-user-select          : none;
+  -o-user-select           : none;
+  -webkit-user-select      : none;
+  user-select              : none;
+}
 #+END_SRC
 
 **** flex
 
 #+NAME: css_light_html_seg_flex
 #+BEGIN_SRC css
-  /* flex */
-  .flex-menu-bar {
-    display                  : -webkit-flex;
-    display                  : flex;
-    -webkit-flex-wrap        : wrap;
-    -webkit-align-items      : center;
-    align-items              : center;
-    width                    : 100%%;
-    margin-left              : 5%%;
-    margin-right             : 2%%;
-    background-color         : #FFFFFF;
-  }
-  .flex-menu-option {
-    background-color         : #FFFFFF;
-    margin-right             : 4px;
-  }
-  .flex-list {
-    display                  : -webkit-flex;
-    display                  : flex;
-    -webkit-align-items      : center;
-    display                  : block;
-    align-items              : center;
-    width                    : 100%%;
-    background-color         : #FFFFFF;
-  }
-  .flex-list-item {
-    background-color         : #FFFFFF;
-    margin                   : 4px;
-  }
+/* flex */
+.flex-menu-bar {
+  display                  : -webkit-flex;
+  display                  : flex;
+  -webkit-flex-wrap        : wrap;
+  -webkit-align-items      : center;
+  align-items              : center;
+  width                    : 100%%;
+  margin-left              : 5%%;
+  margin-right             : 2%%;
+  background-color         : #FFFFFF;
+}
+.flex-menu-option {
+  background-color         : #FFFFFF;
+  margin-right             : 4px;
+}
+.flex-list {
+  display                  : -webkit-flex;
+  display                  : flex;
+  -webkit-align-items      : center;
+  display                  : block;
+  align-items              : center;
+  width                    : 100%%;
+  background-color         : #FFFFFF;
+}
+.flex-list-item {
+  background-color         : #FFFFFF;
+  margin                   : 4px;
+}
 #+END_SRC
 
 **** TODO grid
@@ -874,88 +880,88 @@ Consider what if anything should be used here
 
 #+NAME: css_light_html_seg_grid
 #+BEGIN_SRC css
-  /* grid */
-  .wrapper {
-    display                  : grid;
-    grid-template-columns    : 100%%;
-    grid-template-areas      :
-      "headband"
-      "doc_header"
-      "doc_title"
-      "doc_toc"
-      "doc_prefix"
-      "doc_intro"
-      "doc_body"
-      "doc_endnotes"
-      "doc_glossary"
-      "doc_biblio"
-      "doc_bookindex"
-      "doc_blurb"
-      "doc_suffix";
-    margin                   : 0px;
-    padding                  : 0px;
-    background-color         : #FFFFFF;
-  }
-  .delimit {
-    border-style             : none;
-    border-color             : #FFFFFF;
-    padding                  : 10px;
-  }
-  .headband {
-    grid-area                : headband;
-    background-color         : #FFFFFF;
-  }
-  .doc_header {
-    grid-area                : doc_header;
-  }
-  .doc_title {
-    grid-area                : doc_title;
-  }
-  .doc_toc {
-    grid-area                : doc_toc;
-  }
-  .doc_prefix {
-    grid-area                : doc_prefix;
-  }
-  .doc_intro {
-    grid-area                : doc_intro;
-  }
-  .doc_body {
-    grid-area                : doc_body;
-  }
-  .doc_endnotes {
-    grid-area                : doc_endnotes;
-  }
-  .doc_glossary {
-    grid-area                : doc_glossary;
-  }
-  .doc_biblio {
-    grid-area                : doc_biblio;
-  }
-  .doc_bookindex {
-    grid-area                : doc_bookindex;
-  }
-  .doc_blurb {
-    grid-area                : doc_blurb;
-  }
-  .doc_suffix {
-    grid-area                : doc_suffix;
-  }
-  .nav-ul {
-    list-style               : none;
-    float                    : left;
-  }
-  .nav-li {
-    float                    : left;
-    padding-right            : 0.7em;
-  }
-  .nav-li a {
-    text-decoration          : none;
-    color                    : #FFFFFF;
-  }
-  footer {
-    background-color         : #00704E;
-  }
+/* grid */
+.wrapper {
+  display                  : grid;
+  grid-template-columns    : 100%%;
+  grid-template-areas      :
+    "headband"
+    "doc_header"
+    "doc_title"
+    "doc_toc"
+    "doc_prefix"
+    "doc_intro"
+    "doc_body"
+    "doc_endnotes"
+    "doc_glossary"
+    "doc_biblio"
+    "doc_bookindex"
+    "doc_blurb"
+    "doc_suffix";
+  margin                   : 0px;
+  padding                  : 0px;
+  background-color         : #FFFFFF;
+}
+.delimit {
+  border-style             : none;
+  border-color             : #FFFFFF;
+  padding                  : 10px;
+}
+.headband {
+  grid-area                : headband;
+  background-color         : #FFFFFF;
+}
+.doc_header {
+  grid-area                : doc_header;
+}
+.doc_title {
+  grid-area                : doc_title;
+}
+.doc_toc {
+  grid-area                : doc_toc;
+}
+.doc_prefix {
+  grid-area                : doc_prefix;
+}
+.doc_intro {
+  grid-area                : doc_intro;
+}
+.doc_body {
+  grid-area                : doc_body;
+}
+.doc_endnotes {
+  grid-area                : doc_endnotes;
+}
+.doc_glossary {
+  grid-area                : doc_glossary;
+}
+.doc_biblio {
+  grid-area                : doc_biblio;
+}
+.doc_bookindex {
+  grid-area                : doc_bookindex;
+}
+.doc_blurb {
+  grid-area                : doc_blurb;
+}
+.doc_suffix {
+  grid-area                : doc_suffix;
+}
+.nav-ul {
+  list-style               : none;
+  float                    : left;
+}
+.nav-li {
+  float                    : left;
+  padding-right            : 0.7em;
+}
+.nav-li a {
+  text-decoration          : none;
+  color                    : #FFFFFF;
+}
+footer {
+  background-color         : #00704E;
+}
 #+END_SRC
 
 *** html scroll
@@ -963,123 +969,123 @@ Consider what if anything should be used here
 
 #+NAME: css_light_html_scroll_flex
 #+BEGIN_SRC css
-  /* flex */
-  .flex-menu-bar {
-    display                  : -webkit-flex;
-    display                  : flex;
-    -webkit-flex-wrap        : wrap;
-    -webkit-align-items      : center;
-    align-items              : center;
-    width                    : 100%%;
-    margin-left              : 5%%;
-    margin-right             : 2%%;
-    background-color         : #FFFFFF;
-  }
-  .flex-menu-option {
-    background-color         : #FFFFFF;
-    margin-right             : 4px;
-  }
-  .flex-list {
-    display                  : -webkit-flex;
-    display                  : flex;
-    -webkit-align-items      : center;
-    display                  : block;
-    align-items              : center;
-    width                    : 100%%;
-    background-color         : #FFFFFF;
-  }
-  .flex-list-item {
-    background-color         : #FFFFFF;
-    margin                   : 4px;
-  }
+/* flex */
+.flex-menu-bar {
+  display                  : -webkit-flex;
+  display                  : flex;
+  -webkit-flex-wrap        : wrap;
+  -webkit-align-items      : center;
+  align-items              : center;
+  width                    : 100%%;
+  margin-left              : 5%%;
+  margin-right             : 2%%;
+  background-color         : #FFFFFF;
+}
+.flex-menu-option {
+  background-color         : #FFFFFF;
+  margin-right             : 4px;
+}
+.flex-list {
+  display                  : -webkit-flex;
+  display                  : flex;
+  -webkit-align-items      : center;
+  display                  : block;
+  align-items              : center;
+  width                    : 100%%;
+  background-color         : #FFFFFF;
+}
+.flex-list-item {
+  background-color         : #FFFFFF;
+  margin                   : 4px;
+}
 #+END_SRC
 
 **** grid
 
 #+NAME: css_light_html_scroll_grid
 #+BEGIN_SRC css
-  /* grid */
-  .wrapper {
-    display                  : grid;
-    grid-template-columns    : 100%%;
-    grid-template-areas      :
-      "headband"
-      "doc_header"
-      "doc_title"
-      "doc_toc"
-      "doc_prefix"
-      "doc_intro"
-      "doc_body"
-      "doc_endnotes"
-      "doc_glossary"
-      "doc_biblio"
-      "doc_bookindex"
-      "doc_blurb"
-      "doc_suffix";
-    margin                   : 0px;
-    padding                  : 0px;
-    background-color         : #FFFFFF;
-  }
-  .delimit {
-    border-style             : none;
-    border-color             : #FFFFFF;
-    padding                  : 10px;
-  }
-  .headband {
-    grid-area                : headband;
-    background-color         : #FFFFFF;
-  }
-  .doc_header {
-    grid-area                : doc_header;
-  }
-  .doc_title {
-    grid-area                : doc_title;
-  }
-  .doc_toc {
-    grid-area                : doc_toc;
-  }
-  .doc_prefix {
-    grid-area                : doc_prefix;
-  }
-  .doc_intro {
-    grid-area                : doc_intro;
-  }
-  .doc_body {
-    grid-area                : doc_body;
-  }
-  .doc_endnotes {
-    grid-area                : doc_endnotes;
-  }
-  .doc_glossary {
-    grid-area                : doc_glossary;
-  }
-  .doc_biblio {
-    grid-area                : doc_biblio;
-  }
-  .doc_bookindex {
-    grid-area                : doc_bookindex;
-  }
-  .doc_blurb {
-    grid-area                : doc_blurb;
-  }
-  .doc_suffix {
-    grid-area                : doc_suffix;
-  }
-  .nav-ul {
-    list-style               : none;
-    float                    : left;
-  }
-  .nav-li {
-    float                    : left;
-    padding-right            : 0.7em;
-  }
-  .nav-li a {
-    text-decoration          : none;
-    color                    : #FFFFFF;
-  }
-  footer {
-    background-color         : #00704E;
-  }
+/* grid */
+.wrapper {
+  display                  : grid;
+  grid-template-columns    : 100%%;
+  grid-template-areas      :
+    "headband"
+    "doc_header"
+    "doc_title"
+    "doc_toc"
+    "doc_prefix"
+    "doc_intro"
+    "doc_body"
+    "doc_endnotes"
+    "doc_glossary"
+    "doc_biblio"
+    "doc_bookindex"
+    "doc_blurb"
+    "doc_suffix";
+  margin                   : 0px;
+  padding                  : 0px;
+  background-color         : #FFFFFF;
+}
+.delimit {
+  border-style             : none;
+  border-color             : #FFFFFF;
+  padding                  : 10px;
+}
+.headband {
+  grid-area                : headband;
+  background-color         : #FFFFFF;
+}
+.doc_header {
+  grid-area                : doc_header;
+}
+.doc_title {
+  grid-area                : doc_title;
+}
+.doc_toc {
+  grid-area                : doc_toc;
+}
+.doc_prefix {
+  grid-area                : doc_prefix;
+}
+.doc_intro {
+  grid-area                : doc_intro;
+}
+.doc_body {
+  grid-area                : doc_body;
+}
+.doc_endnotes {
+  grid-area                : doc_endnotes;
+}
+.doc_glossary {
+  grid-area                : doc_glossary;
+}
+.doc_biblio {
+  grid-area                : doc_biblio;
+}
+.doc_bookindex {
+  grid-area                : doc_bookindex;
+}
+.doc_blurb {
+  grid-area                : doc_blurb;
+}
+.doc_suffix {
+  grid-area                : doc_suffix;
+}
+.nav-ul {
+  list-style               : none;
+  float                    : left;
+}
+.nav-li {
+  float                    : left;
+  padding-right            : 0.7em;
+}
+.nav-li a {
+  text-decoration          : none;
+  color                    : #FFFFFF;
+}
+footer {
+  background-color         : #00704E;
+}
 #+END_SRC
 
 *** epub xhtml
@@ -1094,177 +1100,177 @@ Consider what if anything should be used here
 
 #+NAME: css_dark_shared_html_general
 #+BEGIN_SRC css
-  *{
-    padding                  : 0px;
-    margin                   : 0px;
-  }
-  body {
-    height                   : 100vh;
-    background-color         : #000000;
-  }
-  body {
-    color                    : #CCCCCC;
-    background               : #000000;
-    background-color         : #000000;
-  }
+html {
+}
+,*{
+  padding                  : 0px;
+  margin                   : 0px;
+}
+body {
+  height                   : 100vh;
+  background-color         : #000000;
+  color                    : #CCCCCC;
+  background               : #000000;
+  background-color         : #000000;
+}
 #+END_SRC
 
 **** link
 
 #+NAME: css_dark_shared_link
 #+BEGIN_SRC css
-  a:link {
-    color                    : #FFFFFF;
-    text-decoration          : none;
-  }
-  a:visited {
-    color                    : #999999;
-    text-decoration          : none;
-  }
-  a:hover {
-    color                    : #000000;
-    background-color         : #555555;
-  }
-  a.lnkocn:link {
-    color                    : %s;
-    text-decoration          : none;
-  }
-  a.lnkocn:visited {
-    color                    : #9ACD32;
-    text-decoration          : none;
-  }
-  a.lnkocn:hover {
-    color                    : #BBBBBB;
-    font-size                : 120%%;
-  }
-  a:hover img {
-    background-color         : #000000;
-  }
-  a:active {
-    color                    : #888888;
-    text-decoration          : underline;
-  }
-  input {
-    color                    : #FFFFFF;
-    background-color         : #777777;
-  }
+a:link {
+  color                    : #FFFFFF;
+  text-decoration          : none;
+}
+a:visited {
+  color                    : #999999;
+  text-decoration          : none;
+}
+a:hover {
+  color                    : #000000;
+  background-color         : #555555;
+}
+a.lnkocn:link {
+  color                    : %s;
+  text-decoration          : none;
+}
+a.lnkocn:visited {
+  color                    : #9ACD32;
+  text-decoration          : none;
+}
+a.lnkocn:hover {
+  color                    : #BBBBBB;
+  font-size                : 1.8rem;
+}
+a:hover img {
+  background-color         : #000000;
+}
+a:active {
+  color                    : #888888;
+  text-decoration          : underline;
+}
+input {
+  color                    : #FFFFFF;
+  background-color         : #777777;
+}
 #+END_SRC
 
 **** div
 
 #+NAME: css_dark_shared_div
 #+BEGIN_SRC css
-  div {
-    margin-left              : 0;
-    margin-right             : 0;
-  }
-  div.p {
-    margin-left              : 5%%;
-    margin-right             : 1%%;
-  }
-  div.substance {
-    width                    : 100%%;
-    background-color         : #000000;
-  }
-  div.ocn {
-    width                    : 5%%;
-    float                    : right;
-    top                      : 0;
-    background-color         : #000000;
-  }
-  div.endnote {
-    width                    : 95%%;
-    background-color         : #000000;
-  }
-  div.toc {
-    position                 : absolute;
-    float                    : left;
-    margin                   : 0;
-    padding                  : 0;
-    padding-top              : 0.5em;
-    border                   : 0;
-    width                    : 13em;
-    background-color         : #111111;
-    margin-right             : 1em;
-  }
-  div.summary {
-    margin                   : 0;
-    padding                  : 0;
-    border-left              : 13em solid #111111;
-    padding-left             : 1em;
-    background-color         : #111111;
-  }
-  div.content, div.main_column {
-    margin                   : 0;
-    padding                  : 0;
-    border-left              : 13em solid #000000;
-    padding-left             : 1em;
-    padding-right            : 1em;
-  }
-  div.content0, div.main_column0 {
-    margin                   : 0;
-    padding                  : 0;
-    border-left              : 0%% solid #000000;
-    padding-left             : 5%%;
-  }
-  div.scroll {
-    margin                   : 0;
-    padding                  : 0;
-    padding-left             : 1em;
-    padding-right            : 1em;
-  }
-  div.content:after {
-    content                  : ' ';
-    clear                    : both;
-    display                  : block;
-    height                   : 0;
-    overflow                 : hidden;
-  }
-  div.footer {
-    clear                    : left;
-    padding                  : 0.5em;
-    font-size                : 80%%;
-    margin                   : 0;
-  }
-  div.toc ul {
-    list-style               : none;
-    padding                  : 0;
-    margin                   : 0;
-  }
-  div.toc li ul a, li ul span.currentlink
-  {
-    font-weight              : normal;
-    font-size                : 90%%;
-    padding-left             : 2em;
-    background-color         : #111111;
-  }
-  div.toc a, span.currentlink{
-    display                  : block;
-    text-decoration          : none;
-    padding-left             : 0.5em;
-    color                    : #FF00AA;
-  }
-  hr {
-    width                    : 90%%;
-    margin-left              : 5%%;
-    margin-right             : 2em;
-    margin-top               : 1.8em;
-    margin-bottom            : 1.8em;
-  }
-  span.currentlink {
-    text-decoration          : none;
-    background-color         : #AAAAF9;
-  }
-  div.toc a:visited {
-    color                    : #FF00AA;
-  }
-  div.toc a:hover {
-    color                    : #CCCCCC;
-    background-color         : #F9F9AA;
-  }
-  nav#toc ol {
-    list-style-type          : none;
-  }
+div {
+  margin-left              : 0;
+  margin-right             : 0;
+}
+div.p {
+  margin-left              : 5%%;
+  margin-right             : 1%%;
+}
+div.substance {
+  width                    : 100%%;
+  background-color         : #000000;
+}
+div.ocn {
+  width                    : 5%%;
+  float                    : right;
+  top                      : 0;
+  background-color         : #000000;
+}
+div.endnote {
+  width                    : 95%%;
+  background-color         : #000000;
+}
+div.toc {
+  position                 : absolute;
+  float                    : left;
+  margin                   : 0;
+  padding                  : 0;
+  padding-top              : 0.5em;
+  border                   : 0;
+  width                    : 13em;
+  background-color         : #111111;
+  margin-right             : 1em;
+}
+div.summary {
+  margin                   : 0;
+  padding                  : 0;
+  border-left              : 13em solid #111111;
+  padding-left             : 1em;
+  background-color         : #111111;
+}
+div.content, div.main_column {
+  margin                   : 0;
+  padding                  : 0;
+  border-left              : 13em solid #000000;
+  padding-left             : 1em;
+  padding-right            : 1em;
+}
+div.content0, div.main_column0 {
+  margin                   : 0;
+  padding                  : 0;
+  border-left              : 0%% solid #000000;
+  padding-left             : 5%%;
+}
+div.scroll {
+  margin                   : 0;
+  padding                  : 0;
+  padding-left             : 1em;
+  padding-right            : 1em;
+}
+div.content:after {
+  content                  : ' ';
+  clear                    : both;
+  display                  : block;
+  height                   : 0;
+  overflow                 : hidden;
+}
+div.footer {
+  clear                    : left;
+  padding                  : 0.5em;
+  font-size                : 1.4rem;
+  margin                   : 0;
+}
+div.toc ul {
+  list-style               : none;
+  padding                  : 0;
+  margin                   : 0;
+}
+div.toc li ul a, li ul span.currentlink
+{
+  font-weight              : normal;
+  font-size                : 1.5rem;
+  padding-left             : 2em;
+  background-color         : #111111;
+}
+div.toc a, span.currentlink{
+  display                  : block;
+  text-decoration          : none;
+  padding-left             : 0.5em;
+  color                    : #FF00AA;
+}
+hr {
+  width                    : 90%%;
+  margin-left              : 5%%;
+  margin-right             : 2em;
+  margin-top               : 1.8em;
+  margin-bottom            : 1.8em;
+}
+span.currentlink {
+  text-decoration          : none;
+  background-color         : #AAAAF9;
+}
+div.toc a:visited {
+  color                    : #FF00AA;
+}
+div.toc a:hover {
+  color                    : #CCCCCC;
+  background-color         : #F9F9AA;
+}
+nav#toc ol {
+  list-style-type          : none;
+}
 #+END_SRC
 
 **** paragraphs headings blocks
@@ -1272,220 +1278,220 @@ Consider what if anything should be used here
 
 #+NAME: css_dark_shared_paragraphs_headings_blocks_misc
 #+BEGIN_SRC css
-  .norm, .bold, .verse, .group, .block, .alt {
-    line-height              : 133%%;
-    margin-top               : 12px;
-    margin-bottom            : 0px;
-    padding-left             : 0em;
-    text-indent              : 0em;
-  }
-  p, h0, h1, h2, h3, h4, h5, h6, h7, ul, li {
-    display                  : block;
-    font-family              : verdana, arial, georgia, tahoma, sans-serif, helvetica, times, roman;
-    margin-left              : 5%%;
-    margin-right             : 2em;
-  }
-  p {
-    font-size                : 100%%;
-    font-weight              : normal;
-    line-height              : 133%%;
-    text-align               : justify;
-    text-indent              : 0mm;
-    margin-top               : 0.8em;
-    margin-bottom            : 0.8em;
-  }
+.norm, .bold, .verse, .group, .block, .alt {
+  line-height              : 133%%;
+  margin-top               : 12px;
+  margin-bottom            : 0px;
+  padding-left             : 0em;
+  text-indent              : 0em;
+}
+p, h0, h1, h2, h3, h4, h5, h6, h7, ul, li {
+  display                  : block;
+  font-family              : verdana, arial, georgia, tahoma, sans-serif, helvetica, times, roman;
+  margin-left              : 5%%;
+  margin-right             : 2em;
+}
+p {
+  font-size                : 1.6rem;
+  font-weight              : normal;
+  line-height              : 133%%;
+  text-align               : justify;
+  text-indent              : 0mm;
+  margin-top               : 0.8em;
+  margin-bottom            : 0.8em;
+}
 #+END_SRC
 
 ***** img
 
 #+NAME: css_dark_shared_img
 #+BEGIN_SRC css
-  img {
-    max-width                : 100%%;
-    height                   : auto;
-  }
+img {
+  max-width                : 100%%;
+  height                   : auto;
+}
 #+END_SRC
 
 ***** code block
 
 #+NAME: css_dark_shared_block_code
 #+BEGIN_SRC css
-  pre {
-    width                    : auto;
-    display                  : block;
-    clear                    : both;
-    color                    : #555555;
-  }
-  pre.codeline {
-    display                  : table;
-    clear                    : both;
-    table-layout             : fixed;
-    margin-left              : 5%%;
-    margin-right             : 5%%;
-    width                    : 90%%;
-    white-space              : pre-wrap;
-    border-style             : none;
-    border-radius            : 5px 5px 5px 5px;
-    box-shadow               : 0 2px 5px #AAAAAA inset;
-    margin-bottom            : 1em;
-    padding                  : 0.5em 1em;
-    page-break-inside        : avoid;
-    word-wrap                : break-word;
-    font-family              : inconsolata, "liberation mono", "bitstream vera mono", "dejavu mono", monaco, consolas, "andale mono", "courier new", "courier 10 pitch", courier, monospace;
-    white-space              : pre;
-    white-space              : pre-wrap;
-    white-space              : -moz-pre-wrap;
-    white-space              : -o-pre-wrap;
-    background-color         : #555555;
-    color                    : #DDDDDD;
-    font-size                : 95%%;
-    line-height              : 100%%;
-  }
-  pre.codeline::before {
-    counter-reset            : linenum;
-  }
-  pre.codeline span.tr {
-    display                  : table-row;
-    counter-increment        : linenum;
-  }
-  pre.codeline span.th {
-    display                  : table-cell;
-    user-select              : none;
-    -moz-user-select         : none;
-    -webkit-user-select      : none;
-    padding                  : 0.5em 0.5em;
-  }
-  pre.codeline span.th::before {
-    content                  : counter(linenum) ".";
-    color                    : #999999;
-    text-align               : right;
-    display                  : block;
-  }
-  pre.codeline span.th {
-    width                    : 4em;
-  }
-  pre.codeline code {
-    display                  : table-cell;
-  }
-  p.code {
-    border-style             : none;
-  }
+pre {
+  width                    : auto;
+  display                  : block;
+  clear                    : both;
+  color                    : #555555;
+}
+pre.codeline {
+  display                  : table;
+  clear                    : both;
+  table-layout             : fixed;
+  margin-left              : 5%%;
+  margin-right             : 5%%;
+  width                    : 90%%;
+  white-space              : pre-wrap;
+  border-style             : none;
+  border-radius            : 5px 5px 5px 5px;
+  box-shadow               : 0 2px 5px #AAAAAA inset;
+  margin-bottom            : 1em;
+  padding                  : 0.5em 1em;
+  page-break-inside        : avoid;
+  word-wrap                : break-word;
+  font-family              : inconsolata, "liberation mono", "bitstream vera mono", "dejavu mono", monaco, consolas, "andale mono", "courier new", "courier 10 pitch", courier, monospace;
+  white-space              : pre;
+  white-space              : pre-wrap;
+  white-space              : -moz-pre-wrap;
+  white-space              : -o-pre-wrap;
+  background-color         : #555555;
+  color                    : #DDDDDD;
+  font-size                : 1.5rem;
+  line-height              : 100%%;
+}
+pre.codeline::before {
+  counter-reset            : linenum;
+}
+pre.codeline span.tr {
+  display                  : table-row;
+  counter-increment        : linenum;
+}
+pre.codeline span.th {
+  display                  : table-cell;
+  user-select              : none;
+  -moz-user-select         : none;
+  -webkit-user-select      : none;
+  padding                  : 0.5em 0.5em;
+}
+pre.codeline span.th::before {
+  content                  : counter(linenum) ".";
+  color                    : #999999;
+  text-align               : right;
+  display                  : block;
+}
+pre.codeline span.th {
+  width                    : 4em;
+}
+pre.codeline code {
+  display                  : table-cell;
+}
+p.code {
+  border-style             : none;
+}
 #+END_SRC
 
 ***** paragraph general
 
 #+NAME: css_dark_shared_paragraph_general
 #+BEGIN_SRC css
-  p.spaced { white-space     : pre; }
-  p.block {
-    white-space              : pre;
-  }
-  p.group { }
-  p.alt { }
-  p.verse {
-    white-space              : pre;
-    margin-bottom            : 6px;
-  }
-  p.caption {
-    text-align               : left;
-    font-size                : 80%%;
-    display                  : inline;
-  }
-  p.endnote {
-    font-size                : 96%%;
-    line-height              : 120%%;
-    text-align               : left;
-    margin-right             : 15mm;
-    padding-left             : 1em;
-    text-indent              : -1em;
-  }
-  p.center {
-    text-align               : center;
-  }
-  p.bold {
-    font-weight              : bold;
-  }
-  p.bold_left {
-    font-weight              : bold;
-    text-align               : left;
-  }
-  p.centerbold {
-    text-align               : center;
-    font-weight              : bold;
-  }
-  p.em {
-    font-weight              : bold;
-    font-style               : normal;
-    background               : #FFF3B6;
-  }
-  p.small {
-    font-size                : 80%%;
-    margin-top               : 0px;
-    margin-bottom            : 0px;
-    margin-right             : 6px;
-    text-align               : left;
-  }
-  .tiny, .tiny_left, .tiny_right, .tiny_center {
-    font-size                : 75%%;
-    margin-top               : 0px;
-    margin-bottom            : 0px;
-    color                    : #EEEEEE;
-    margin-right             : 6px;
-    text-align               : left;
-  }
-  p.tiny { }
-  p.tiny_left {
-    margin-left              : 0px;
-    margin-right             : 0px;
-    text-align               : left;
-  }
-  p.tiny_right {
-    margin-right             : 1em;
-    text-align               : right;
-  }
-  p.tiny_center {
-    margin-left              : 0px;
-    margin-right             : 0px;
-    text-align               : center;
-  }
-  p.concordance_word {
-    line-height              : 150%%;
-    font-weight              : bold;
-    display                  : inline;
-    margin-top               : 4px;
-    margin-bottom            : 1px;
-  }
-  p.concordance_count {
-    font-size                : 80%%;
-    color                    : #555555;
-    display                  : inline;
-    margin-left              : 0em;
-  }
-  p.concordance_object {
-    font-size                : 80%%;
-    line-height              : 120%%;
-    text-align               : left;
-    margin-left              : 3em;
-    margin-top               : 1px;
-    margin-bottom            : 3px;
-  }
-  p.book_index_lev1 {
-    line-height              : 100%%;
-    margin-top               : 4px;
-    margin-bottom            : 1px;
-  }
-  p.book_index_lev2 {
-    line-height              : 100%%;
-    text-align               : left;
-    margin-left              : 3em;
-    margin-top               : 1px;
-    margin-bottom            : 3px;
-  }
-  tt {
-    font-family              : inconsolata, "liberation mono", "bitstream vera mono", "dejavu mono", monaco, consolas, "andale mono", "courier new", "courier 10 pitch", courier, monospace;
-    background-color         : #555555;
-    color                    : #DDDDDD;
-  }
+p.spaced { white-space     : pre; }
+p.block {
+  white-space              : pre;
+}
+p.group { }
+p.alt { }
+p.verse {
+  white-space              : pre;
+  margin-bottom            : 6px;
+}
+p.caption {
+  text-align               : left;
+  font-size                : 1.4rem;
+  display                  : inline;
+}
+p.endnote {
+  font-size                : 1.5rem;
+  line-height              : 120%%;
+  text-align               : left;
+  margin-right             : 15mm;
+  padding-left             : 1em;
+  text-indent              : -1em;
+}
+p.center {
+  text-align               : center;
+}
+p.bold {
+  font-weight              : bold;
+}
+p.bold_left {
+  font-weight              : bold;
+  text-align               : left;
+}
+p.centerbold {
+  text-align               : center;
+  font-weight              : bold;
+}
+p.em {
+  font-weight              : bold;
+  font-style               : normal;
+  background               : #FFF3B6;
+}
+p.small {
+  font-size                : 1.4rem;
+  margin-top               : 0px;
+  margin-bottom            : 0px;
+  margin-right             : 6px;
+  text-align               : left;
+}
+.tiny, .tiny_left, .tiny_right, .tiny_center {
+  font-size                : 1.35rem;
+  margin-top               : 0px;
+  margin-bottom            : 0px;
+  color                    : #EEEEEE;
+  margin-right             : 6px;
+  text-align               : left;
+}
+p.tiny { }
+p.tiny_left {
+  margin-left              : 0px;
+  margin-right             : 0px;
+  text-align               : left;
+}
+p.tiny_right {
+  margin-right             : 1em;
+  text-align               : right;
+}
+p.tiny_center {
+  margin-left              : 0px;
+  margin-right             : 0px;
+  text-align               : center;
+}
+p.concordance_word {
+  line-height              : 150%%;
+  font-weight              : bold;
+  display                  : inline;
+  margin-top               : 4px;
+  margin-bottom            : 1px;
+}
+p.concordance_count {
+  font-size                : 1.4rem;
+  color                    : #555555;
+  display                  : inline;
+  margin-left              : 0em;
+}
+p.concordance_object {
+  font-size                : 1.4rem;
+  line-height              : 120%%;
+  text-align               : left;
+  margin-left              : 3em;
+  margin-top               : 1px;
+  margin-bottom            : 3px;
+}
+p.book_index_lev1 {
+  line-height              : 100%%;
+  margin-top               : 4px;
+  margin-bottom            : 1px;
+}
+p.book_index_lev2 {
+  line-height              : 100%%;
+  text-align               : left;
+  margin-left              : 3em;
+  margin-top               : 1px;
+  margin-bottom            : 3px;
+}
+tt {
+  font-family              : inconsolata, "liberation mono", "bitstream vera mono", "dejavu mono", monaco, consolas, "andale mono", "courier new", "courier 10 pitch", courier, monospace;
+  background-color         : #555555;
+  color                    : #DDDDDD;
+}
 #+END_SRC
 
 ***** paragraph indent
@@ -1499,173 +1505,173 @@ Consider what if anything should be used here
 
 #+NAME: css_dark_shared_misc_tables_lists
 #+BEGIN_SRC css
-  note { white-space         : pre; }
-  label.ocn {
-    width                    : 2%%;
-    float                    : right;
-    top                      : 0;
-    font-size                : 80%%;
-    margin-top               : 0px;
-    margin-bottom            : 6px;
-    margin-right             : 6px;
-    text-align               : right;
-    color                    : %s;
-    -khtml-user-select       : none;
-    -moz-user-select         : none;
-    -ms-user-select          : none;
-    -o-user-select           : none;
-    -webkit-user-select      : none;
-    user-select              : none;
-  }
-  table {
-    display                  : block;
-    margin-left              : 5%%;
-    margin-right             : 2em;
-    background-color         : inherit;
-  }
-  tr { }
-  th,td {
-    vertical-align           : top;
-    text-align               : left;
-  }
-  th {
-    font-weight              : bold;
-  }
-  em {
-    font-weight              : bold;
-    font-style               : italic;
-  }
-  p.left,th.left,td.left {
-    text-align               : left;
-  }
-  p.small_left,th.small_left,td.small_left {
-    text-align               : left;
-    font-size                : 80%%;
-  }
-  p.right,th.right,td.right {
-    text-align               : right;
-  }
-  ul, li {
-    list-style-type          : none;
-    list-style               : none;
-    padding-left             : 20px;
-    font-weight              : normal;
-    line-height              : 150%%;
-    text-align               : left;
-    text-indent              : 0mm;
-    margin-left              : 1em;
-    margin-right             : 2em;
-    margin-top               : 3px;
-    margin-bottom            : 3px;
-  }
-  li {
-    background               : (../image_sys/bullet_09.png) no-repeat 0px 6px;
-  }
-  ul { }
+note { white-space         : pre; }
+label.ocn {
+  width                    : 2%%;
+  float                    : right;
+  top                      : 0;
+  font-size                : 1.4rem;
+  margin-top               : 0px;
+  margin-bottom            : 6px;
+  margin-right             : 6px;
+  text-align               : right;
+  color                    : %s;
+  -khtml-user-select       : none;
+  -moz-user-select         : none;
+  -ms-user-select          : none;
+  -o-user-select           : none;
+  -webkit-user-select      : none;
+  user-select              : none;
+}
+table {
+  display                  : block;
+  margin-left              : 5%%;
+  margin-right             : 2em;
+  background-color         : inherit;
+}
+tr { }
+th,td {
+  vertical-align           : top;
+  text-align               : left;
+}
+th {
+  font-weight              : bold;
+}
+em {
+  font-weight              : bold;
+  font-style               : italic;
+}
+p.left,th.left,td.left {
+  text-align               : left;
+}
+p.small_left,th.small_left,td.small_left {
+  text-align               : left;
+  font-size                : 1.4rem;
+}
+p.right,th.right,td.right {
+  text-align               : right;
+}
+ul, li {
+  list-style-type          : none;
+  list-style               : none;
+  padding-left             : 20px;
+  font-weight              : normal;
+  line-height              : 150%%;
+  text-align               : left;
+  text-indent              : 0mm;
+  margin-left              : 1em;
+  margin-right             : 2em;
+  margin-top               : 3px;
+  margin-bottom            : 3px;
+}
+li {
+  background               : (../image_sys/bullet_09.png) no-repeat 0px 6px;
+}
+ul { }
 #+END_SRC
 
 ***** headings
 
 #+NAME: css_dark_shared_headings
 #+BEGIN_SRC css
-  h0, h1, h2, h3, h4, h5, h6, h7 {
-    font-weight              : bold;
-    line-height              : 120%%;
-    text-align               : left;
-    margin-top               : 20px;
-    margin-bottom            : 10px;
-  }
-  h4.norm, h5.norm, h6.norm, h7.norm {
-    margin-top               : 10px;
-    margin-bottom            : 0px;
-  }
-  h0 { font-size             : 125%%; }
-  h1 { font-size             : 120%%; }
-  h2 { font-size             : 115%%; }
-  h3 { font-size             : 110%%; }
-  h4 { font-size             : 105%%; }
-  h5 { font-size             : 100%%; }
-  h6 { font-size             : 100%%; }
-  h7 { font-size             : 100%%; }
-  h0, h1, h2, h3, h4, h5, h6, h7 {
-    text-shadow              : .2em .2em .3em #999999;
-  }
-  h1.i { margin-left         : 2em; }
-  h2.i { margin-left         : 3em; }
-  h3.i { margin-left         : 4em; }
-  h4.i { margin-left         : 5em; }
-  h5.i { margin-left         : 6em; }
-  h6.i { margin-left         : 7em; }
-  h7.i { margin-left         : 8em; }
-  h8.i { margin-left         : 9em; }
-  h9.i { margin-left         : 10em; }
-  .toc {
-    font-weight              : normal;
-    margin-top               : 6px;
-    margin-bottom            : 6px;
-  }
-  h0.toc {
-    margin-left              : 1em;
-    font-size                : 120%%;
-    line-height              : 150%%;
-  }
-  h1.toc {
-    margin-left              : 1em;
-    font-size                : 115%%;
-    line-height              : 150%%;
-  }
-  h2.toc {
-    margin-left              : 2em;
-    font-size                : 110%%;
-    line-height              : 140%%;
-  }
-  h3.toc {
-    margin-left              : 3em;
-    font-size                : 105%%;
-    line-height              : 120%%;
-  }
-  h4.toc {
-    margin-left              : 4em;
-    font-size                : 100%%;
-    line-height              : 120%%;
-  }
-  h5.toc {
-    margin-left              : 5em;
-    font-size                : 95%%;
-    line-height              : 110%%;
-  }
-  h6.toc {
-    margin-left              : 6em;
-    font-size                : 90%%;
-    line-height              : 110%%;
-  }
-  h7.toc {
-    margin-left              : 7em;
-    font-size                : 85%%;
-    line-height              : 100%%;
-  }
-  .subtoc {
-    margin-right             : 34%%;
-    font-weight              : normal;
-  }
-  h5.subtoc {
-    margin-left              : 2em;
-    font-size                : 80%%;
-    margin-top               : 2px;
-    margin-bottom            : 2px;
-  }
-  h6.subtoc {
-    margin-left              : 3em;
-    font-size                : 75%%;
-    margin-top               : 0px;
-    margin-bottom            : 0px;
-  }
-  h7.subtoc {
-    margin-left              : 4em;
-    font-size                : 70%%;
-    margin-top               : 0px;
-    margin-bottom            : 0px;
-  }
+h0, h1, h2, h3, h4, h5, h6, h7 {
+  font-weight              : bold;
+  line-height              : 120%%;
+  text-align               : left;
+  margin-top               : 20px;
+  margin-bottom            : 10px;
+}
+h4.norm, h5.norm, h6.norm, h7.norm {
+  margin-top               : 10px;
+  margin-bottom            : 0px;
+}
+h0 { font-size             : 1.9rem; }
+h1 { font-size             : 1.8rem; }
+h2 { font-size             : 1.75rem; }
+h3 { font-size             : 1.7rem; }
+h4 { font-size             : 1.65rem; }
+h5 { font-size             : 1.6rem; }
+h6 { font-size             : 1.55rem; }
+h7 { font-size             : 1.5rem; }
+h0, h1, h2, h3, h4, h5, h6, h7 {
+  text-shadow              : .2em .2em .3em #999999;
+}
+h1.i { margin-left         : 2em; }
+h2.i { margin-left         : 3em; }
+h3.i { margin-left         : 4em; }
+h4.i { margin-left         : 5em; }
+h5.i { margin-left         : 6em; }
+h6.i { margin-left         : 7em; }
+h7.i { margin-left         : 8em; }
+h8.i { margin-left         : 9em; }
+h9.i { margin-left         : 10em; }
+.toc {
+  font-weight              : normal;
+  margin-top               : 6px;
+  margin-bottom            : 6px;
+}
+h0.toc {
+  margin-left              : 1em;
+  font-size                : 1.8rem;
+  line-height              : 150%%;
+}
+h1.toc {
+  margin-left              : 1em;
+  font-size                : 1.75rem;
+  line-height              : 150%%;
+}
+h2.toc {
+  margin-left              : 2em;
+  font-size                : 1.7rem;
+  line-height              : 140%%;
+}
+h3.toc {
+  margin-left              : 3em;
+  font-size                : 1.65rem;
+  line-height              : 120%%;
+}
+h4.toc {
+  margin-left              : 4em;
+  font-size                : 1.6rem;
+  line-height              : 120%%;
+}
+h5.toc {
+  margin-left              : 5em;
+  font-size                : 1.5rem;
+  line-height              : 110%%;
+}
+h6.toc {
+  margin-left              : 6em;
+  font-size                : 1.5rem;
+  line-height              : 110%%;
+}
+h7.toc {
+  margin-left              : 7em;
+  font-size                : 1.45rem;
+  line-height              : 100%%;
+}
+.subtoc {
+  margin-right             : 34%%;
+  font-weight              : normal;
+}
+h5.subtoc {
+  margin-left              : 2em;
+  font-size                : 1.4rem;
+  margin-top               : 2px;
+  margin-bottom            : 2px;
+}
+h6.subtoc {
+  margin-left              : 3em;
+  font-size                : 1.35;
+  margin-top               : 0px;
+  margin-bottom            : 0px;
+}
+h7.subtoc {
+  margin-left              : 4em;
+  font-size                : 1.3rem;
+  margin-top               : 0px;
+  margin-bottom            : 0px;
+}
 #+END_SRC
 
 *** html seg
@@ -1673,115 +1679,115 @@ Consider what if anything should be used here
 
 #+NAME: css_dark_html_seg_previous_next
 #+BEGIN_SRC css
-  .icon-bar {
-    width                    : 100%%;
-    overflow                 : auto;
-    margin                   : 0em 0em 0em;
-  }
-  .left-bar {
-    width                    : 85%%;
-    float                    : left;
-    display                  : inline;
-    overflow                 : auto;
-  }
-  .toc-button {
-    position                 : absolute;
-    top                      : 8px;
-    width                    : 3em;
-    height                   : 3em;
-    border-radius            : 50%%;
-    background               : #555555;
-    fill                     : #DDDDDD;
-    box-shadow               : 0 2px 5px #EEEEEE inset;
-  }
-  .toc-button svg {
-    position                 : relative;
-    left                     : 25%%;
-    top                      : 25%%;
-    width                    : 150%%;
-    height                   : 150%%;
-  }
-  .toc-button p {
-    vertical-align           : center;
-    font-size                : 120%%;
-  }
-  .prev-next-button {
-    position                 : absolute;
-    top                      : 8px;
-    width                    : 3em;
-    height                   : 3em;
-    border-radius            : 50%%;
-    background               : #555555;
-    box-shadow               : 0 2px 5px #AAAAAA inset;
-  }
-  .prev-next-button svg {
-    position                 : relative;
-    left                     : 20%%;
-    top                      : 20%%;
-    width                    : 60%%;
-    height                   : 60%%;
-  }
-  .menu {
-    right                    : 8em;
-   }
-  .previous {
-    right                    : 4em;
-   }
-  .next {
-    right                    : 0em;
-   }
-  .arrow {
-     fill                    : #DDDDDD;
-  }
-  .minitoc {
-    line-height              : 120%%;
-    font-size                : 100%%;
-    margin-top               : 6px;
-    margin-bottom            : 0px;
-    padding-left             : 0em;
-    text-indent              : 0em;
-    -khtml-user-select       : none;
-    -moz-user-select         : none;
-    -ms-user-select          : none;
-    -o-user-select           : none;
-    -webkit-user-select      : none;
-    user-select              : none;
-  }
+.icon-bar {
+  width                    : 100%%;
+  overflow                 : auto;
+  margin                   : 0em 0em 0em;
+}
+.left-bar {
+  width                    : 85%%;
+  float                    : left;
+  display                  : inline;
+  overflow                 : auto;
+}
+.toc-button {
+  position                 : absolute;
+  top                      : 8px;
+  width                    : 3em;
+  height                   : 3em;
+  border-radius            : 50%%;
+  background               : #555555;
+  fill                     : #DDDDDD;
+  box-shadow               : 0 2px 5px #EEEEEE inset;
+}
+.toc-button svg {
+  position                 : relative;
+  left                     : 25%%;
+  top                      : 25%%;
+  width                    : 150%%;
+  height                   : 150%%;
+}
+.toc-button p {
+  vertical-align           : center;
+  font-size                : 1.8rem;
+}
+.prev-next-button {
+  position                 : absolute;
+  top                      : 8px;
+  width                    : 3em;
+  height                   : 3em;
+  border-radius            : 50%%;
+  background               : #555555;
+  box-shadow               : 0 2px 5px #AAAAAA inset;
+}
+.prev-next-button svg {
+  position                 : relative;
+  left                     : 20%%;
+  top                      : 20%%;
+  width                    : 60%%;
+  height                   : 60%%;
+}
+.menu {
+  right                    : 8em;
+ }
+.previous {
+  right                    : 4em;
+ }
+.next {
+  right                    : 0em;
+ }
+.arrow {
+   fill                    : #DDDDDD;
+}
+.minitoc {
+  line-height              : 120%%;
+  font-size                : 1.6rem;
+  margin-top               : 6px;
+  margin-bottom            : 0px;
+  padding-left             : 0em;
+  text-indent              : 0em;
+  -khtml-user-select       : none;
+  -moz-user-select         : none;
+  -ms-user-select          : none;
+  -o-user-select           : none;
+  -webkit-user-select      : none;
+  user-select              : none;
+}
 #+END_SRC
 
 **** flex
 
 #+NAME: css_dark_html_seg_flex
 #+BEGIN_SRC css
-  /* flex */
-  .flex-menu-bar {
-    display                  : -webkit-flex;
-    display                  : flex;
-    -webkit-flex-wrap        : wrap;
-    -webkit-align-items      : center;
-    align-items              : center;
-    width                    : 100%%;
-    margin-left              : 5%%;
-    margin-right             : 2%%;
-    background-color         : #000000;
-  }
-  .flex-menu-option {
-    background-color         : #000000;
-    margin-right             : 4px;
-  }
-  .flex-list {
-    display                  : -webkit-flex;
-    display                  : flex;
-    -webkit-align-items      : center;
-    display                  : block;
-    align-items              : center;
-    width                    : 100%%;
-    background-color         : #000000;
-  }
-  .flex-list-item {
-    background-color         : #000000;
-    margin                   : 4px;
-  }
+/* flex */
+.flex-menu-bar {
+  display                  : -webkit-flex;
+  display                  : flex;
+  -webkit-flex-wrap        : wrap;
+  -webkit-align-items      : center;
+  align-items              : center;
+  width                    : 100%%;
+  margin-left              : 5%%;
+  margin-right             : 2%%;
+  background-color         : #000000;
+}
+.flex-menu-option {
+  background-color         : #000000;
+  margin-right             : 4px;
+}
+.flex-list {
+  display                  : -webkit-flex;
+  display                  : flex;
+  -webkit-align-items      : center;
+  display                  : block;
+  align-items              : center;
+  width                    : 100%%;
+  background-color         : #000000;
+}
+.flex-list-item {
+  background-color         : #000000;
+  margin                   : 4px;
+}
 #+END_SRC
 
 **** TODO grid
@@ -1790,88 +1796,88 @@ Consider what if anything should be used here
 
 #+NAME: css_dark_html_seg_grid
 #+BEGIN_SRC css
-  /* grid */
-  .wrapper {
-    display                  : grid;
-    grid-template-columns    : 100%%;
-    grid-template-areas      :
-      "headband"
-      "doc_header"
-      "doc_title"
-      "doc_toc"
-      "doc_prefix"
-      "doc_intro"
-      "doc_body"
-      "doc_endnotes"
-      "doc_glossary"
-      "doc_biblio"
-      "doc_bookindex"
-      "doc_blurb"
-      "doc_suffix";
-    margin                   : 0px;
-    padding                  : 0px;
-    background-color         : #000000;
-  }
-  .delimit {
-    border-style             : none;
-    border-color             : #000000;
-    padding                  : 10px;
-  }
-  .headband {
-    grid-area                : headband;
-    background-color         : #000000;
-  }
-  .doc_header {
-    grid-area                : doc_header;
-  }
-  .doc_title {
-    grid-area                : doc_title;
-  }
-  .doc_toc {
-    grid-area                : doc_toc;
-  }
-  .doc_prefix {
-    grid-area                : doc_prefix;
-  }
-  .doc_intro {
-    grid-area                : doc_intro;
-  }
-  .doc_body {
-    grid-area                : doc_body;
-  }
-  .doc_endnotes {
-    grid-area                : doc_endnotes;
-  }
-  .doc_glossary {
-    grid-area                : doc_glossary;
-  }
-  .doc_biblio {
-    grid-area                : doc_biblio;
-  }
-  .doc_bookindex {
-    grid-area                : doc_bookindex;
-  }
-  .doc_blurb {
-    grid-area                : doc_blurb;
-  }
-  .doc_suffix {
-    grid-area                : doc_suffix;
-  }
-  .nav-ul {
-    list-style               : none;
-    float                    : left;
-  }
-  .nav-li {
-    float                    : left;
-    padding-right            : 0.7em;
-  }
-  .nav-li a {
-    text-decoration          : none;
-    color                    : #000000;
-  }
-  footer {
-    background-color         : #FF704E;
-  }
+/* grid */
+.wrapper {
+  display                  : grid;
+  grid-template-columns    : 100%%;
+  grid-template-areas      :
+    "headband"
+    "doc_header"
+    "doc_title"
+    "doc_toc"
+    "doc_prefix"
+    "doc_intro"
+    "doc_body"
+    "doc_endnotes"
+    "doc_glossary"
+    "doc_biblio"
+    "doc_bookindex"
+    "doc_blurb"
+    "doc_suffix";
+  margin                   : 0px;
+  padding                  : 0px;
+  background-color         : #000000;
+}
+.delimit {
+  border-style             : none;
+  border-color             : #000000;
+  padding                  : 10px;
+}
+.headband {
+  grid-area                : headband;
+  background-color         : #000000;
+}
+.doc_header {
+  grid-area                : doc_header;
+}
+.doc_title {
+  grid-area                : doc_title;
+}
+.doc_toc {
+  grid-area                : doc_toc;
+}
+.doc_prefix {
+  grid-area                : doc_prefix;
+}
+.doc_intro {
+  grid-area                : doc_intro;
+}
+.doc_body {
+  grid-area                : doc_body;
+}
+.doc_endnotes {
+  grid-area                : doc_endnotes;
+}
+.doc_glossary {
+  grid-area                : doc_glossary;
+}
+.doc_biblio {
+  grid-area                : doc_biblio;
+}
+.doc_bookindex {
+  grid-area                : doc_bookindex;
+}
+.doc_blurb {
+  grid-area                : doc_blurb;
+}
+.doc_suffix {
+  grid-area                : doc_suffix;
+}
+.nav-ul {
+  list-style               : none;
+  float                    : left;
+}
+.nav-li {
+  float                    : left;
+  padding-right            : 0.7em;
+}
+.nav-li a {
+  text-decoration          : none;
+  color                    : #000000;
+}
+footer {
+  background-color         : #FF704E;
+}
 #+END_SRC
 
 *** html scroll
@@ -1879,123 +1885,123 @@ Consider what if anything should be used here
 
 #+NAME: css_dark_html_scroll_flex
 #+BEGIN_SRC css
-  /* flex */
-  .flex-menu-bar {
-    display                  : -webkit-flex;
-    display                  : flex;
-    -webkit-flex-wrap        : wrap;
-    -webkit-align-items      : center;
-    align-items              : center;
-    width                    : 100%%;
-    margin-left              : 5%%;
-    margin-right             : 2%%;
-    background-color         : #000000;
-  }
-  .flex-menu-option {
-    background-color         : #000000;
-    margin-right             : 4px;
-  }
-  .flex-list {
-    display                  : -webkit-flex;
-    display                  : flex;
-    -webkit-align-items      : center;
-    display                  : block;
-    align-items              : center;
-    width                    : 100%%;
-    background-color         : #000000;
-  }
-  .flex-list-item {
-    background-color         : #000000;
-    margin                   : 4px;
-  }
+/* flex */
+.flex-menu-bar {
+  display                  : -webkit-flex;
+  display                  : flex;
+  -webkit-flex-wrap        : wrap;
+  -webkit-align-items      : center;
+  align-items              : center;
+  width                    : 100%%;
+  margin-left              : 5%%;
+  margin-right             : 2%%;
+  background-color         : #000000;
+}
+.flex-menu-option {
+  background-color         : #000000;
+  margin-right             : 4px;
+}
+.flex-list {
+  display                  : -webkit-flex;
+  display                  : flex;
+  -webkit-align-items      : center;
+  display                  : block;
+  align-items              : center;
+  width                    : 100%%;
+  background-color         : #000000;
+}
+.flex-list-item {
+  background-color         : #000000;
+  margin                   : 4px;
+}
 #+END_SRC
 
 **** grid
 
 #+NAME: css_dark_html_scroll_grid
 #+BEGIN_SRC css
-  /* grid */
-  .wrapper {
-    display                  : grid;
-    grid-template-columns    : 100%%;
-    grid-template-areas      :
-      "headband"
-      "doc_header"
-      "doc_title"
-      "doc_toc"
-      "doc_prefix"
-      "doc_intro"
-      "doc_body"
-      "doc_endnotes"
-      "doc_glossary"
-      "doc_biblio"
-      "doc_bookindex"
-      "doc_blurb"
-      "doc_suffix";
-    margin                   : 0px;
-    padding                  : 0px;
-    background-color         : #000000;
-  }
-  .delimit {
-    border-style             : none;
-    border-color             : #000000;
-    padding                  : 10px;
-  }
-  .headband {
-    grid-area                : headband;
-    background-color         : #000000;
-  }
-  .doc_header {
-    grid-area                : doc_header;
-  }
-  .doc_title {
-    grid-area                : doc_title;
-  }
-  .doc_toc {
-    grid-area                : doc_toc;
-  }
-  .doc_prefix {
-    grid-area                : doc_prefix;
-  }
-  .doc_intro {
-    grid-area                : doc_intro;
-  }
-  .doc_body {
-    grid-area                : doc_body;
-  }
-  .doc_endnotes {
-    grid-area                : doc_endnotes;
-  }
-  .doc_glossary {
-    grid-area                : doc_glossary;
-  }
-  .doc_biblio {
-    grid-area                : doc_biblio;
-  }
-  .doc_bookindex {
-    grid-area                : doc_bookindex;
-  }
-  .doc_blurb {
-    grid-area                : doc_blurb;
-  }
-  .doc_suffix {
-    grid-area                : doc_suffix;
-  }
-  .nav-ul {
-    list-style               : none;
-    float                    : left;
-  }
-  .nav-li {
-    float                    : left;
-    padding-right            : 0.7em;
-  }
-  .nav-li a {
-    text-decoration          : none;
-    color                    : #000000;
-  }
-  footer {
-    background-color         : #FF704E;
-  }
+/* grid */
+.wrapper {
+  display                  : grid;
+  grid-template-columns    : 100%%;
+  grid-template-areas      :
+    "headband"
+    "doc_header"
+    "doc_title"
+    "doc_toc"
+    "doc_prefix"
+    "doc_intro"
+    "doc_body"
+    "doc_endnotes"
+    "doc_glossary"
+    "doc_biblio"
+    "doc_bookindex"
+    "doc_blurb"
+    "doc_suffix";
+  margin                   : 0px;
+  padding                  : 0px;
+  background-color         : #000000;
+}
+.delimit {
+  border-style             : none;
+  border-color             : #000000;
+  padding                  : 10px;
+}
+.headband {
+  grid-area                : headband;
+  background-color         : #000000;
+}
+.doc_header {
+  grid-area                : doc_header;
+}
+.doc_title {
+  grid-area                : doc_title;
+}
+.doc_toc {
+  grid-area                : doc_toc;
+}
+.doc_prefix {
+  grid-area                : doc_prefix;
+}
+.doc_intro {
+  grid-area                : doc_intro;
+}
+.doc_body {
+  grid-area                : doc_body;
+}
+.doc_endnotes {
+  grid-area                : doc_endnotes;
+}
+.doc_glossary {
+  grid-area                : doc_glossary;
+}
+.doc_biblio {
+  grid-area                : doc_biblio;
+}
+.doc_bookindex {
+  grid-area                : doc_bookindex;
+}
+.doc_blurb {
+  grid-area                : doc_blurb;
+}
+.doc_suffix {
+  grid-area                : doc_suffix;
+}
+.nav-ul {
+  list-style               : none;
+  float                    : left;
+}
+.nav-li {
+  float                    : left;
+  padding-right            : 0.7em;
+}
+.nav-li a {
+  text-decoration          : none;
+  color                    : #000000;
+}
+footer {
+  background-color         : #FF704E;
+}
 #+END_SRC
 
 *** form search
@@ -2003,18 +2009,18 @@ Consider what if anything should be used here
 #+NAME: css_shared_search_form
 #+BEGIN_SRC css
 input, select, textarea {
-  font-size                : 150%%;
+  font-size                : 2.2rem;
 }
 input[type="text"] {
-  font-size:120%%;
+  font-size                : 1.8rem;
   line-height              : 120%%;
 }
 button[type="submit"] {
-  font-size                : 120%%;
+  font-size                : 1.8rem;
   line-height              : 120%%;
 }
 p.form {
-  font-size                : 150%%;
+  font-size                : 2.2rem;
   line-height              : 150%%;
 }
 #+END_SRC
@@ -2030,426 +2036,426 @@ p.form {
 
 #+NAME: css_insert_shared_insert_variable_ocn_color_values
 #+BEGIN_SRC css
-    string _color_ocn_light  = (doc_matters.opt.action.ocn_hidden) ? "#FFFFFF" : "#777777";
-    string _color_ocn_dark   = (doc_matters.opt.action.ocn_hidden) ? "#000000" : "#BBBBBB";
+string _color_ocn_light  = (doc_matters.opt.action.ocn_hidden) ? "#FFFFFF" : "#777777";
+string _color_ocn_dark   = (doc_matters.opt.action.ocn_hidden) ? "#000000" : "#BBBBBB";
 #+END_SRC
 
 *** indent levels
 #+NAME: css_insert_shared_insert_variable_indent_values
 #+BEGIN_SRC css
-    string _css_indent = format(q"┃
-  /* indent */
-  p.norm { }
-  p.i1 { padding-left        : 1em; }
-  p.i2 { padding-left        : 2em; }
-  p.i3 { padding-left        : 3em; }
-  p.i4 { padding-left        : 4em; }
-  p.i5 { padding-left        : 5em; }
-  p.i6 { padding-left        : 6em; }
-  p.i7 { padding-left        : 7em; }
-  p.i8 { padding-left        : 8em; }
-  p.i9 { padding-left        : 9em; }
-  /* hanging indent */
-  p[indent="h0i0"] {
-    padding-left             : 0em;
-    text-indent              : 0em;
-  }
-  p[indent="h0i1"] {
-    padding-left             : 1em;
-    text-indent              : -1em;
-  }
-  p[indent="h0i2"] {
-    padding-left             : 2em;
-    text-indent              : -2em;
-  }
-  p[indent="h0i3"] {
-    padding-left             : 3em;
-    text-indent              : -3em;
-  }
-  p[indent="h0i4"] {
-    padding-left             : 4em;
-    text-indent              : -4em;
-  }
-  p[indent="h0i5"] {
-    padding-left             : 5em;
-    text-indent              : -5em;
-  }
-  p[indent="h0i6"] {
-    padding-left             : 6em;
-    text-indent              : -6em;
-  }
-  p[indent="h0i7"] {
-    padding-left             : 7em;
-    text-indent              : -7em;
-  }
-  p[indent="h0i8"] {
-    padding-left             : 8em;
-    text-indent              : -8em;
-  }
-  p[indent="h0i9"] {
-    padding-left             : 9em;
-    text-indent              : -9em;
-  }
-  p[indent="h1i0"] {
-    padding-left             : 0em;
-    text-indent              : 1em;
-  }
-  p[indent="h1i1"] {
-    padding-left             : 1em;
-    text-indent              : 0em;
-  }
-  p[indent="h1i2"] {
-    padding-left             : 2em;
-    text-indent              : -1em;
-  }
-  p[indent="h1i3"] {
-    padding-left             : 3em;
-    text-indent              : -2em;
-  }
-  p[indent="h1i4"] {
-    padding-left             : 4em;
-    text-indent              : -3em;
-  }
-  p[indent="h1i5"] {
-    padding-left             : 5em;
-    text-indent              : -4em;
-  }
-  p[indent="h1i6"] {
-    padding-left             : 6em;
-    text-indent              : -5em;
-  }
-  p[indent="h1i7"] {
-    padding-left             : 7em;
-    text-indent              : -6em;
-  }
-  p[indent="h1i8"] {
-    padding-left             : 8em;
-    text-indent              : -7em;
-  }
-  p[indent="h1i9"] {
-    padding-left             : 9em;
-    text-indent              : -8em;
-  }
-  p[indent="h2i0"] {
-    padding-left             : 0em;
-    text-indent              : 2em;
-  }
-  p[indent="h2i1"] {
-    padding-left             : 1em;
-    text-indent              : 1em;
-  }
-  p[indent="h2i2"] {
-    padding-left             : 2em;
-    text-indent              : 0em;
-  }
-  p[indent="h2i3"] {
-    padding-left             : 3em;
-    text-indent              : -1em;
-  }
-  p[indent="h2i4"] {
-    padding-left             : 4em;
-    text-indent              : -2em;
-  }
-  p[indent="h2i5"] {
-    padding-left             : 5em;
-    text-indent              : -3em;
-  }
-  p[indent="h2i6"] {
-    padding-left             : 6em;
-    text-indent              : -4em;
-  }
-  p[indent="h2i7"] {
-    padding-left             : 7em;
-    text-indent              : -5em;
-  }
-  p[indent="h2i8"] {
-    padding-left             : 8em;
-    text-indent              : -6em;
-  }
-  p[indent="h2i9"] {
-    padding-left             : 9em;
-    text-indent              : -7em;
-  }
-  p[indent="h3i0"] {
-    padding-left             : 0em;
-    text-indent              : 3em;
-  }
-  p[indent="h3i1"] {
-    padding-left             : 1em;
-    text-indent              : 2em;
-  }
-  p[indent="h3i2"] {
-    padding-left             : 2em;
-    text-indent              : 1em;
-  }
-  p[indent="h3i3"] {
-    padding-left             : 3em;
-    text-indent              : 0em;
-  }
-  p[indent="h3i4"] {
-    padding-left             : 4em;
-    text-indent              : -1em;
-  }
-  p[indent="h3i5"] {
-    padding-left             : 5em;
-    text-indent              : -2em;
-  }
-  p[indent="h3i6"] {
-    padding-left             : 6em;
-    text-indent              : -3em;
-  }
-  p[indent="h3i7"] {
-    padding-left             : 7em;
-    text-indent              : -4em;
-  }
-  p[indent="h3i8"] {
-    padding-left             : 8em;
-    text-indent              : -5em;
-  }
-  p[indent="h3i9"] {
-    padding-left             : 9em;
-    text-indent              : -6em;
-  }
-  p[indent="h4i0"] {
-    padding-left             : 0em;
-    text-indent              : 4em;
-  }
-  p[indent="h4i1"] {
-    padding-left             : 1em;
-    text-indent              : 3em;
-  }
-  p[indent="h4i2"] {
-    padding-left             : 2em;
-    text-indent              : 2em;
-  }
-  p[indent="h4i3"] {
-    padding-left             : 3em;
-    text-indent              : 1em;
-  }
-  p[indent="h4i4"] {
-    padding-left             : 4em;
-    text-indent              : 0em;
-  }
-  p[indent="h4i5"] {
-    padding-left             : 5em;
-    text-indent              : -1em;
-  }
-  p[indent="h4i6"] {
-    padding-left             : 6em;
-    text-indent              : -2em;
-  }
-  p[indent="h4i7"] {
-    padding-left             : 7em;
-    text-indent              : -3em;
-  }
-  p[indent="h4i8"] {
-    padding-left             : 8em;
-    text-indent              : -4em;
-  }
-  p[indent="h4i9"] {
-    padding-left             : 9em;
-    text-indent              : -5em;
-  }
-  p[indent="h5i0"] {
-    padding-left             : 0em;
-    text-indent              : 5em;
-  }
-  p[indent="h5i1"] {
-    padding-left             : 1em;
-    text-indent              : 4em;
-  }
-  p[indent="h5i2"] {
-    padding-left             : 2em;
-    text-indent              : 3em;
-  }
-  p[indent="h5i3"] {
-    padding-left             : 3em;
-    text-indent              : 2em;
-  }
-  p[indent="h5i4"] {
-    padding-left             : 4em;
-    text-indent              : 1em;
-  }
-  p[indent="h5i5"] {
-    padding-left             : 5em;
-    text-indent              : 0em;
-  }
-  p[indent="h5i6"] {
-    padding-left             : 6em;
-    text-indent              : -1em;
-  }
-  p[indent="h5i7"] {
-    padding-left             : 7em;
-    text-indent              : -2em;
-  }
-  p[indent="h5i8"] {
-    padding-left             : 8em;
-    text-indent              : -3em;
-  }
-  p[indent="h5i9"] {
-    padding-left             : 9em;
-    text-indent              : -4em;
-  }
-  p[indent="h6i0"] {
-    padding-left             : 0em;
-    text-indent              : 6em;
-  }
-  p[indent="h6i1"] {
-    padding-left             : 1em;
-    text-indent              : 5em;
-  }
-  p[indent="h6i2"] {
-    padding-left             : 2em;
-    text-indent              : 4em;
-  }
-  p[indent="h6i3"] {
-    padding-left             : 3em;
-    text-indent              : 3em;
-  }
-  p[indent="h6i4"] {
-    padding-left             : 4em;
-    text-indent              : 2em;
-  }
-  p[indent="h6i5"] {
-    padding-left             : 5em;
-    text-indent              : 1em;
-  }
-  p[indent="h6i6"] {
-    padding-left             : 6em;
-    text-indent              : 0em;
-  }
-  p[indent="h6i7"] {
-    padding-left             : 7em;
-    text-indent              : -1em;
-  }
-  p[indent="h6i8"] {
-    padding-left             : 8em;
-    text-indent              : -2em;
-  }
-  p[indent="h6i9"] {
-    padding-left             : 9em;
-    text-indent              : -3em;
-  }
-  p[indent="h7i0"] {
-    padding-left             : 0em;
-    text-indent              : 7em;
-  }
-  p[indent="h7i1"] {
-    padding-left             : 1em;
-    text-indent              : 6em;
-  }
-  p[indent="h7i2"] {
-    padding-left             : 2em;
-    text-indent              : 5em;
-  }
-  p[indent="h7i3"] {
-    padding-left             : 3em;
-    text-indent              : 4em;
-  }
-  p[indent="h7i4"] {
-    padding-left             : 4em;
-    text-indent              : 3em;
-  }
-  p[indent="h7i5"] {
-    padding-left             : 5em;
-    text-indent              : 2em;
-  }
-  p[indent="h7i6"] {
-    padding-left             : 6em;
-    text-indent              : 1em;
-  }
-  p[indent="h7i7"] {
-    padding-left             : 7em;
-    text-indent              : 0em;
-  }
-  p[indent="h7i8"] {
-    padding-left             : 8em;
-    text-indent              : -1em;
-  }
-  p[indent="h7i9"] {
-    padding-left             : 9em;
-    text-indent              : -2em;
-  }
-  p[indent="h8i0"] {
-    padding-left             : 0em;
-    text-indent              : 8em;
-  }
-  p[indent="h8i1"] {
-    padding-left             : 1em;
-    text-indent              : 7em;
-  }
-  p[indent="h8i2"] {
-    padding-left             : 2em;
-    text-indent              : 6em;
-  }
-  p[indent="h8i3"] {
-    padding-left             : 3em;
-    text-indent              : 5em;
-  }
-  p[indent="h8i4"] {
-    padding-left             : 4em;
-    text-indent              : 4em;
-  }
-  p[indent="h8i5"] {
-    padding-left             : 5em;
-    text-indent              : 3em;
-  }
-  p[indent="h8i6"] {
-    padding-left             : 6em;
-    text-indent              : 2em;
-  }
-  p[indent="h8i7"] {
-    padding-left             : 7em;
-    text-indent              : 1em;
-  }
-  p[indent="h8i8"] {
-    padding-left             : 8em;
-    text-indent              : 0em;
-  }
-  p[indent="h8i9"] {
-    padding-left             : 9em;
-    text-indent              : -1em;
-  }
-  p[indent="h9i0"] {
-    padding-left             : 0em;
-    text-indent              : 9em;
-  }
-  p[indent="h9i1"] {
-    padding-left             : 1em;
-    text-indent              : 8em;
-  }
-  p[indent="h9i2"] {
-    padding-left             : 2em;
-    text-indent              : 7em;
-  }
-  p[indent="h9i3"] {
-    padding-left             : 3em;
-    text-indent              : 6em;
-  }
-  p[indent="h9i4"] {
-    padding-left             : 4em;
-    text-indent              : 5em;
-  }
-  p[indent="h9i5"] {
-    padding-left             : 5em;
-    text-indent              : 4em;
-  }
-  p[indent="h9i6"] {
-    padding-left             : 6em;
-    text-indent              : 3em;
-  }
-  p[indent="h9i7"] {
-    padding-left             : 7em;
-    text-indent              : 2em;
-  }
-  p[indent="h9i8"] {
-    padding-left             : 8em;
-    text-indent              : 1em;
-  }
-  p[indent="h9i9"] {
-    padding-left             : 9em;
-    text-indent              : 0em;
-  }
+  string _css_indent = format(q"┃
+/* indent */
+p.norm { }
+p.i1 { padding-left        : 1em; }
+p.i2 { padding-left        : 2em; }
+p.i3 { padding-left        : 3em; }
+p.i4 { padding-left        : 4em; }
+p.i5 { padding-left        : 5em; }
+p.i6 { padding-left        : 6em; }
+p.i7 { padding-left        : 7em; }
+p.i8 { padding-left        : 8em; }
+p.i9 { padding-left        : 9em; }
+/* hanging indent */
+p[indent="h0i0"] {
+  padding-left             : 0em;
+  text-indent              : 0em;
+}
+p[indent="h0i1"] {
+  padding-left             : 1em;
+  text-indent              : -1em;
+}
+p[indent="h0i2"] {
+  padding-left             : 2em;
+  text-indent              : -2em;
+}
+p[indent="h0i3"] {
+  padding-left             : 3em;
+  text-indent              : -3em;
+}
+p[indent="h0i4"] {
+  padding-left             : 4em;
+  text-indent              : -4em;
+}
+p[indent="h0i5"] {
+  padding-left             : 5em;
+  text-indent              : -5em;
+}
+p[indent="h0i6"] {
+  padding-left             : 6em;
+  text-indent              : -6em;
+}
+p[indent="h0i7"] {
+  padding-left             : 7em;
+  text-indent              : -7em;
+}
+p[indent="h0i8"] {
+  padding-left             : 8em;
+  text-indent              : -8em;
+}
+p[indent="h0i9"] {
+  padding-left             : 9em;
+  text-indent              : -9em;
+}
+p[indent="h1i0"] {
+  padding-left             : 0em;
+  text-indent              : 1em;
+}
+p[indent="h1i1"] {
+  padding-left             : 1em;
+  text-indent              : 0em;
+}
+p[indent="h1i2"] {
+  padding-left             : 2em;
+  text-indent              : -1em;
+}
+p[indent="h1i3"] {
+  padding-left             : 3em;
+  text-indent              : -2em;
+}
+p[indent="h1i4"] {
+  padding-left             : 4em;
+  text-indent              : -3em;
+}
+p[indent="h1i5"] {
+  padding-left             : 5em;
+  text-indent              : -4em;
+}
+p[indent="h1i6"] {
+  padding-left             : 6em;
+  text-indent              : -5em;
+}
+p[indent="h1i7"] {
+  padding-left             : 7em;
+  text-indent              : -6em;
+}
+p[indent="h1i8"] {
+  padding-left             : 8em;
+  text-indent              : -7em;
+}
+p[indent="h1i9"] {
+  padding-left             : 9em;
+  text-indent              : -8em;
+}
+p[indent="h2i0"] {
+  padding-left             : 0em;
+  text-indent              : 2em;
+}
+p[indent="h2i1"] {
+  padding-left             : 1em;
+  text-indent              : 1em;
+}
+p[indent="h2i2"] {
+  padding-left             : 2em;
+  text-indent              : 0em;
+}
+p[indent="h2i3"] {
+  padding-left             : 3em;
+  text-indent              : -1em;
+}
+p[indent="h2i4"] {
+  padding-left             : 4em;
+  text-indent              : -2em;
+}
+p[indent="h2i5"] {
+  padding-left             : 5em;
+  text-indent              : -3em;
+}
+p[indent="h2i6"] {
+  padding-left             : 6em;
+  text-indent              : -4em;
+}
+p[indent="h2i7"] {
+  padding-left             : 7em;
+  text-indent              : -5em;
+}
+p[indent="h2i8"] {
+  padding-left             : 8em;
+  text-indent              : -6em;
+}
+p[indent="h2i9"] {
+  padding-left             : 9em;
+  text-indent              : -7em;
+}
+p[indent="h3i0"] {
+  padding-left             : 0em;
+  text-indent              : 3em;
+}
+p[indent="h3i1"] {
+  padding-left             : 1em;
+  text-indent              : 2em;
+}
+p[indent="h3i2"] {
+  padding-left             : 2em;
+  text-indent              : 1em;
+}
+p[indent="h3i3"] {
+  padding-left             : 3em;
+  text-indent              : 0em;
+}
+p[indent="h3i4"] {
+  padding-left             : 4em;
+  text-indent              : -1em;
+}
+p[indent="h3i5"] {
+  padding-left             : 5em;
+  text-indent              : -2em;
+}
+p[indent="h3i6"] {
+  padding-left             : 6em;
+  text-indent              : -3em;
+}
+p[indent="h3i7"] {
+  padding-left             : 7em;
+  text-indent              : -4em;
+}
+p[indent="h3i8"] {
+  padding-left             : 8em;
+  text-indent              : -5em;
+}
+p[indent="h3i9"] {
+  padding-left             : 9em;
+  text-indent              : -6em;
+}
+p[indent="h4i0"] {
+  padding-left             : 0em;
+  text-indent              : 4em;
+}
+p[indent="h4i1"] {
+  padding-left             : 1em;
+  text-indent              : 3em;
+}
+p[indent="h4i2"] {
+  padding-left             : 2em;
+  text-indent              : 2em;
+}
+p[indent="h4i3"] {
+  padding-left             : 3em;
+  text-indent              : 1em;
+}
+p[indent="h4i4"] {
+  padding-left             : 4em;
+  text-indent              : 0em;
+}
+p[indent="h4i5"] {
+  padding-left             : 5em;
+  text-indent              : -1em;
+}
+p[indent="h4i6"] {
+  padding-left             : 6em;
+  text-indent              : -2em;
+}
+p[indent="h4i7"] {
+  padding-left             : 7em;
+  text-indent              : -3em;
+}
+p[indent="h4i8"] {
+  padding-left             : 8em;
+  text-indent              : -4em;
+}
+p[indent="h4i9"] {
+  padding-left             : 9em;
+  text-indent              : -5em;
+}
+p[indent="h5i0"] {
+  padding-left             : 0em;
+  text-indent              : 5em;
+}
+p[indent="h5i1"] {
+  padding-left             : 1em;
+  text-indent              : 4em;
+}
+p[indent="h5i2"] {
+  padding-left             : 2em;
+  text-indent              : 3em;
+}
+p[indent="h5i3"] {
+  padding-left             : 3em;
+  text-indent              : 2em;
+}
+p[indent="h5i4"] {
+  padding-left             : 4em;
+  text-indent              : 1em;
+}
+p[indent="h5i5"] {
+  padding-left             : 5em;
+  text-indent              : 0em;
+}
+p[indent="h5i6"] {
+  padding-left             : 6em;
+  text-indent              : -1em;
+}
+p[indent="h5i7"] {
+  padding-left             : 7em;
+  text-indent              : -2em;
+}
+p[indent="h5i8"] {
+  padding-left             : 8em;
+  text-indent              : -3em;
+}
+p[indent="h5i9"] {
+  padding-left             : 9em;
+  text-indent              : -4em;
+}
+p[indent="h6i0"] {
+  padding-left             : 0em;
+  text-indent              : 6em;
+}
+p[indent="h6i1"] {
+  padding-left             : 1em;
+  text-indent              : 5em;
+}
+p[indent="h6i2"] {
+  padding-left             : 2em;
+  text-indent              : 4em;
+}
+p[indent="h6i3"] {
+  padding-left             : 3em;
+  text-indent              : 3em;
+}
+p[indent="h6i4"] {
+  padding-left             : 4em;
+  text-indent              : 2em;
+}
+p[indent="h6i5"] {
+  padding-left             : 5em;
+  text-indent              : 1em;
+}
+p[indent="h6i6"] {
+  padding-left             : 6em;
+  text-indent              : 0em;
+}
+p[indent="h6i7"] {
+  padding-left             : 7em;
+  text-indent              : -1em;
+}
+p[indent="h6i8"] {
+  padding-left             : 8em;
+  text-indent              : -2em;
+}
+p[indent="h6i9"] {
+  padding-left             : 9em;
+  text-indent              : -3em;
+}
+p[indent="h7i0"] {
+  padding-left             : 0em;
+  text-indent              : 7em;
+}
+p[indent="h7i1"] {
+  padding-left             : 1em;
+  text-indent              : 6em;
+}
+p[indent="h7i2"] {
+  padding-left             : 2em;
+  text-indent              : 5em;
+}
+p[indent="h7i3"] {
+  padding-left             : 3em;
+  text-indent              : 4em;
+}
+p[indent="h7i4"] {
+  padding-left             : 4em;
+  text-indent              : 3em;
+}
+p[indent="h7i5"] {
+  padding-left             : 5em;
+  text-indent              : 2em;
+}
+p[indent="h7i6"] {
+  padding-left             : 6em;
+  text-indent              : 1em;
+}
+p[indent="h7i7"] {
+  padding-left             : 7em;
+  text-indent              : 0em;
+}
+p[indent="h7i8"] {
+  padding-left             : 8em;
+  text-indent              : -1em;
+}
+p[indent="h7i9"] {
+  padding-left             : 9em;
+  text-indent              : -2em;
+}
+p[indent="h8i0"] {
+  padding-left             : 0em;
+  text-indent              : 8em;
+}
+p[indent="h8i1"] {
+  padding-left             : 1em;
+  text-indent              : 7em;
+}
+p[indent="h8i2"] {
+  padding-left             : 2em;
+  text-indent              : 6em;
+}
+p[indent="h8i3"] {
+  padding-left             : 3em;
+  text-indent              : 5em;
+}
+p[indent="h8i4"] {
+  padding-left             : 4em;
+  text-indent              : 4em;
+}
+p[indent="h8i5"] {
+  padding-left             : 5em;
+  text-indent              : 3em;
+}
+p[indent="h8i6"] {
+  padding-left             : 6em;
+  text-indent              : 2em;
+}
+p[indent="h8i7"] {
+  padding-left             : 7em;
+  text-indent              : 1em;
+}
+p[indent="h8i8"] {
+  padding-left             : 8em;
+  text-indent              : 0em;
+}
+p[indent="h8i9"] {
+  padding-left             : 9em;
+  text-indent              : -1em;
+}
+p[indent="h9i0"] {
+  padding-left             : 0em;
+  text-indent              : 9em;
+}
+p[indent="h9i1"] {
+  padding-left             : 1em;
+  text-indent              : 8em;
+}
+p[indent="h9i2"] {
+  padding-left             : 2em;
+  text-indent              : 7em;
+}
+p[indent="h9i3"] {
+  padding-left             : 3em;
+  text-indent              : 6em;
+}
+p[indent="h9i4"] {
+  padding-left             : 4em;
+  text-indent              : 5em;
+}
+p[indent="h9i5"] {
+  padding-left             : 5em;
+  text-indent              : 4em;
+}
+p[indent="h9i6"] {
+  padding-left             : 6em;
+  text-indent              : 3em;
+}
+p[indent="h9i7"] {
+  padding-left             : 7em;
+  text-indent              : 2em;
+}
+p[indent="h9i8"] {
+  padding-left             : 8em;
+  text-indent              : 1em;
+}
+p[indent="h9i9"] {
+  padding-left             : 9em;
+  text-indent              : 0em;
+}
 ┃");
 #+END_SRC
 
diff --git a/src/doc_reform/io_out/xmls_css.d b/src/doc_reform/io_out/xmls_css.d
index 53246b3..bb2cdfc 100644
--- a/src/doc_reform/io_out/xmls_css.d
+++ b/src/doc_reform/io_out/xmls_css.d
@@ -55,3700 +55,3706 @@ module doc_reform.io_out.xmls_css;
 template spineCss() {
   import std.format;
   @safe auto spineCss(M)(M doc_matters) {
-    string _css_indent = format(q"┃
-  /* indent */
-  p.norm { }
-  p.i1 { padding-left        : 1em; }
-  p.i2 { padding-left        : 2em; }
-  p.i3 { padding-left        : 3em; }
-  p.i4 { padding-left        : 4em; }
-  p.i5 { padding-left        : 5em; }
-  p.i6 { padding-left        : 6em; }
-  p.i7 { padding-left        : 7em; }
-  p.i8 { padding-left        : 8em; }
-  p.i9 { padding-left        : 9em; }
-  /* hanging indent */
-  p[indent="h0i0"] {
-    padding-left             : 0em;
-    text-indent              : 0em;
-  }
-  p[indent="h0i1"] {
-    padding-left             : 1em;
-    text-indent              : -1em;
-  }
-  p[indent="h0i2"] {
-    padding-left             : 2em;
-    text-indent              : -2em;
-  }
-  p[indent="h0i3"] {
-    padding-left             : 3em;
-    text-indent              : -3em;
-  }
-  p[indent="h0i4"] {
-    padding-left             : 4em;
-    text-indent              : -4em;
-  }
-  p[indent="h0i5"] {
-    padding-left             : 5em;
-    text-indent              : -5em;
-  }
-  p[indent="h0i6"] {
-    padding-left             : 6em;
-    text-indent              : -6em;
-  }
-  p[indent="h0i7"] {
-    padding-left             : 7em;
-    text-indent              : -7em;
-  }
-  p[indent="h0i8"] {
-    padding-left             : 8em;
-    text-indent              : -8em;
-  }
-  p[indent="h0i9"] {
-    padding-left             : 9em;
-    text-indent              : -9em;
-  }
-  p[indent="h1i0"] {
-    padding-left             : 0em;
-    text-indent              : 1em;
-  }
-  p[indent="h1i1"] {
-    padding-left             : 1em;
-    text-indent              : 0em;
-  }
-  p[indent="h1i2"] {
-    padding-left             : 2em;
-    text-indent              : -1em;
-  }
-  p[indent="h1i3"] {
-    padding-left             : 3em;
-    text-indent              : -2em;
-  }
-  p[indent="h1i4"] {
-    padding-left             : 4em;
-    text-indent              : -3em;
-  }
-  p[indent="h1i5"] {
-    padding-left             : 5em;
-    text-indent              : -4em;
-  }
-  p[indent="h1i6"] {
-    padding-left             : 6em;
-    text-indent              : -5em;
-  }
-  p[indent="h1i7"] {
-    padding-left             : 7em;
-    text-indent              : -6em;
-  }
-  p[indent="h1i8"] {
-    padding-left             : 8em;
-    text-indent              : -7em;
-  }
-  p[indent="h1i9"] {
-    padding-left             : 9em;
-    text-indent              : -8em;
-  }
-  p[indent="h2i0"] {
-    padding-left             : 0em;
-    text-indent              : 2em;
-  }
-  p[indent="h2i1"] {
-    padding-left             : 1em;
-    text-indent              : 1em;
-  }
-  p[indent="h2i2"] {
-    padding-left             : 2em;
-    text-indent              : 0em;
-  }
-  p[indent="h2i3"] {
-    padding-left             : 3em;
-    text-indent              : -1em;
-  }
-  p[indent="h2i4"] {
-    padding-left             : 4em;
-    text-indent              : -2em;
-  }
-  p[indent="h2i5"] {
-    padding-left             : 5em;
-    text-indent              : -3em;
-  }
-  p[indent="h2i6"] {
-    padding-left             : 6em;
-    text-indent              : -4em;
-  }
-  p[indent="h2i7"] {
-    padding-left             : 7em;
-    text-indent              : -5em;
-  }
-  p[indent="h2i8"] {
-    padding-left             : 8em;
-    text-indent              : -6em;
-  }
-  p[indent="h2i9"] {
-    padding-left             : 9em;
-    text-indent              : -7em;
-  }
-  p[indent="h3i0"] {
-    padding-left             : 0em;
-    text-indent              : 3em;
-  }
-  p[indent="h3i1"] {
-    padding-left             : 1em;
-    text-indent              : 2em;
-  }
-  p[indent="h3i2"] {
-    padding-left             : 2em;
-    text-indent              : 1em;
-  }
-  p[indent="h3i3"] {
-    padding-left             : 3em;
-    text-indent              : 0em;
-  }
-  p[indent="h3i4"] {
-    padding-left             : 4em;
-    text-indent              : -1em;
-  }
-  p[indent="h3i5"] {
-    padding-left             : 5em;
-    text-indent              : -2em;
-  }
-  p[indent="h3i6"] {
-    padding-left             : 6em;
-    text-indent              : -3em;
-  }
-  p[indent="h3i7"] {
-    padding-left             : 7em;
-    text-indent              : -4em;
-  }
-  p[indent="h3i8"] {
-    padding-left             : 8em;
-    text-indent              : -5em;
-  }
-  p[indent="h3i9"] {
-    padding-left             : 9em;
-    text-indent              : -6em;
-  }
-  p[indent="h4i0"] {
-    padding-left             : 0em;
-    text-indent              : 4em;
-  }
-  p[indent="h4i1"] {
-    padding-left             : 1em;
-    text-indent              : 3em;
-  }
-  p[indent="h4i2"] {
-    padding-left             : 2em;
-    text-indent              : 2em;
-  }
-  p[indent="h4i3"] {
-    padding-left             : 3em;
-    text-indent              : 1em;
-  }
-  p[indent="h4i4"] {
-    padding-left             : 4em;
-    text-indent              : 0em;
-  }
-  p[indent="h4i5"] {
-    padding-left             : 5em;
-    text-indent              : -1em;
-  }
-  p[indent="h4i6"] {
-    padding-left             : 6em;
-    text-indent              : -2em;
-  }
-  p[indent="h4i7"] {
-    padding-left             : 7em;
-    text-indent              : -3em;
-  }
-  p[indent="h4i8"] {
-    padding-left             : 8em;
-    text-indent              : -4em;
-  }
-  p[indent="h4i9"] {
-    padding-left             : 9em;
-    text-indent              : -5em;
-  }
-  p[indent="h5i0"] {
-    padding-left             : 0em;
-    text-indent              : 5em;
-  }
-  p[indent="h5i1"] {
-    padding-left             : 1em;
-    text-indent              : 4em;
-  }
-  p[indent="h5i2"] {
-    padding-left             : 2em;
-    text-indent              : 3em;
-  }
-  p[indent="h5i3"] {
-    padding-left             : 3em;
-    text-indent              : 2em;
-  }
-  p[indent="h5i4"] {
-    padding-left             : 4em;
-    text-indent              : 1em;
-  }
-  p[indent="h5i5"] {
-    padding-left             : 5em;
-    text-indent              : 0em;
-  }
-  p[indent="h5i6"] {
-    padding-left             : 6em;
-    text-indent              : -1em;
-  }
-  p[indent="h5i7"] {
-    padding-left             : 7em;
-    text-indent              : -2em;
-  }
-  p[indent="h5i8"] {
-    padding-left             : 8em;
-    text-indent              : -3em;
-  }
-  p[indent="h5i9"] {
-    padding-left             : 9em;
-    text-indent              : -4em;
-  }
-  p[indent="h6i0"] {
-    padding-left             : 0em;
-    text-indent              : 6em;
-  }
-  p[indent="h6i1"] {
-    padding-left             : 1em;
-    text-indent              : 5em;
-  }
-  p[indent="h6i2"] {
-    padding-left             : 2em;
-    text-indent              : 4em;
-  }
-  p[indent="h6i3"] {
-    padding-left             : 3em;
-    text-indent              : 3em;
-  }
-  p[indent="h6i4"] {
-    padding-left             : 4em;
-    text-indent              : 2em;
-  }
-  p[indent="h6i5"] {
-    padding-left             : 5em;
-    text-indent              : 1em;
-  }
-  p[indent="h6i6"] {
-    padding-left             : 6em;
-    text-indent              : 0em;
-  }
-  p[indent="h6i7"] {
-    padding-left             : 7em;
-    text-indent              : -1em;
-  }
-  p[indent="h6i8"] {
-    padding-left             : 8em;
-    text-indent              : -2em;
-  }
-  p[indent="h6i9"] {
-    padding-left             : 9em;
-    text-indent              : -3em;
-  }
-  p[indent="h7i0"] {
-    padding-left             : 0em;
-    text-indent              : 7em;
-  }
-  p[indent="h7i1"] {
-    padding-left             : 1em;
-    text-indent              : 6em;
-  }
-  p[indent="h7i2"] {
-    padding-left             : 2em;
-    text-indent              : 5em;
-  }
-  p[indent="h7i3"] {
-    padding-left             : 3em;
-    text-indent              : 4em;
-  }
-  p[indent="h7i4"] {
-    padding-left             : 4em;
-    text-indent              : 3em;
-  }
-  p[indent="h7i5"] {
-    padding-left             : 5em;
-    text-indent              : 2em;
-  }
-  p[indent="h7i6"] {
-    padding-left             : 6em;
-    text-indent              : 1em;
-  }
-  p[indent="h7i7"] {
-    padding-left             : 7em;
-    text-indent              : 0em;
-  }
-  p[indent="h7i8"] {
-    padding-left             : 8em;
-    text-indent              : -1em;
-  }
-  p[indent="h7i9"] {
-    padding-left             : 9em;
-    text-indent              : -2em;
-  }
-  p[indent="h8i0"] {
-    padding-left             : 0em;
-    text-indent              : 8em;
-  }
-  p[indent="h8i1"] {
-    padding-left             : 1em;
-    text-indent              : 7em;
-  }
-  p[indent="h8i2"] {
-    padding-left             : 2em;
-    text-indent              : 6em;
-  }
-  p[indent="h8i3"] {
-    padding-left             : 3em;
-    text-indent              : 5em;
-  }
-  p[indent="h8i4"] {
-    padding-left             : 4em;
-    text-indent              : 4em;
-  }
-  p[indent="h8i5"] {
-    padding-left             : 5em;
-    text-indent              : 3em;
-  }
-  p[indent="h8i6"] {
-    padding-left             : 6em;
-    text-indent              : 2em;
-  }
-  p[indent="h8i7"] {
-    padding-left             : 7em;
-    text-indent              : 1em;
-  }
-  p[indent="h8i8"] {
-    padding-left             : 8em;
-    text-indent              : 0em;
-  }
-  p[indent="h8i9"] {
-    padding-left             : 9em;
-    text-indent              : -1em;
-  }
-  p[indent="h9i0"] {
-    padding-left             : 0em;
-    text-indent              : 9em;
-  }
-  p[indent="h9i1"] {
-    padding-left             : 1em;
-    text-indent              : 8em;
-  }
-  p[indent="h9i2"] {
-    padding-left             : 2em;
-    text-indent              : 7em;
-  }
-  p[indent="h9i3"] {
-    padding-left             : 3em;
-    text-indent              : 6em;
-  }
-  p[indent="h9i4"] {
-    padding-left             : 4em;
-    text-indent              : 5em;
-  }
-  p[indent="h9i5"] {
-    padding-left             : 5em;
-    text-indent              : 4em;
-  }
-  p[indent="h9i6"] {
-    padding-left             : 6em;
-    text-indent              : 3em;
-  }
-  p[indent="h9i7"] {
-    padding-left             : 7em;
-    text-indent              : 2em;
-  }
-  p[indent="h9i8"] {
-    padding-left             : 8em;
-    text-indent              : 1em;
-  }
-  p[indent="h9i9"] {
-    padding-left             : 9em;
-    text-indent              : 0em;
-  }
+  string _css_indent = format(q"┃
+/* indent */
+p.norm { }
+p.i1 { padding-left        : 1em; }
+p.i2 { padding-left        : 2em; }
+p.i3 { padding-left        : 3em; }
+p.i4 { padding-left        : 4em; }
+p.i5 { padding-left        : 5em; }
+p.i6 { padding-left        : 6em; }
+p.i7 { padding-left        : 7em; }
+p.i8 { padding-left        : 8em; }
+p.i9 { padding-left        : 9em; }
+/* hanging indent */
+p[indent="h0i0"] {
+  padding-left             : 0em;
+  text-indent              : 0em;
+}
+p[indent="h0i1"] {
+  padding-left             : 1em;
+  text-indent              : -1em;
+}
+p[indent="h0i2"] {
+  padding-left             : 2em;
+  text-indent              : -2em;
+}
+p[indent="h0i3"] {
+  padding-left             : 3em;
+  text-indent              : -3em;
+}
+p[indent="h0i4"] {
+  padding-left             : 4em;
+  text-indent              : -4em;
+}
+p[indent="h0i5"] {
+  padding-left             : 5em;
+  text-indent              : -5em;
+}
+p[indent="h0i6"] {
+  padding-left             : 6em;
+  text-indent              : -6em;
+}
+p[indent="h0i7"] {
+  padding-left             : 7em;
+  text-indent              : -7em;
+}
+p[indent="h0i8"] {
+  padding-left             : 8em;
+  text-indent              : -8em;
+}
+p[indent="h0i9"] {
+  padding-left             : 9em;
+  text-indent              : -9em;
+}
+p[indent="h1i0"] {
+  padding-left             : 0em;
+  text-indent              : 1em;
+}
+p[indent="h1i1"] {
+  padding-left             : 1em;
+  text-indent              : 0em;
+}
+p[indent="h1i2"] {
+  padding-left             : 2em;
+  text-indent              : -1em;
+}
+p[indent="h1i3"] {
+  padding-left             : 3em;
+  text-indent              : -2em;
+}
+p[indent="h1i4"] {
+  padding-left             : 4em;
+  text-indent              : -3em;
+}
+p[indent="h1i5"] {
+  padding-left             : 5em;
+  text-indent              : -4em;
+}
+p[indent="h1i6"] {
+  padding-left             : 6em;
+  text-indent              : -5em;
+}
+p[indent="h1i7"] {
+  padding-left             : 7em;
+  text-indent              : -6em;
+}
+p[indent="h1i8"] {
+  padding-left             : 8em;
+  text-indent              : -7em;
+}
+p[indent="h1i9"] {
+  padding-left             : 9em;
+  text-indent              : -8em;
+}
+p[indent="h2i0"] {
+  padding-left             : 0em;
+  text-indent              : 2em;
+}
+p[indent="h2i1"] {
+  padding-left             : 1em;
+  text-indent              : 1em;
+}
+p[indent="h2i2"] {
+  padding-left             : 2em;
+  text-indent              : 0em;
+}
+p[indent="h2i3"] {
+  padding-left             : 3em;
+  text-indent              : -1em;
+}
+p[indent="h2i4"] {
+  padding-left             : 4em;
+  text-indent              : -2em;
+}
+p[indent="h2i5"] {
+  padding-left             : 5em;
+  text-indent              : -3em;
+}
+p[indent="h2i6"] {
+  padding-left             : 6em;
+  text-indent              : -4em;
+}
+p[indent="h2i7"] {
+  padding-left             : 7em;
+  text-indent              : -5em;
+}
+p[indent="h2i8"] {
+  padding-left             : 8em;
+  text-indent              : -6em;
+}
+p[indent="h2i9"] {
+  padding-left             : 9em;
+  text-indent              : -7em;
+}
+p[indent="h3i0"] {
+  padding-left             : 0em;
+  text-indent              : 3em;
+}
+p[indent="h3i1"] {
+  padding-left             : 1em;
+  text-indent              : 2em;
+}
+p[indent="h3i2"] {
+  padding-left             : 2em;
+  text-indent              : 1em;
+}
+p[indent="h3i3"] {
+  padding-left             : 3em;
+  text-indent              : 0em;
+}
+p[indent="h3i4"] {
+  padding-left             : 4em;
+  text-indent              : -1em;
+}
+p[indent="h3i5"] {
+  padding-left             : 5em;
+  text-indent              : -2em;
+}
+p[indent="h3i6"] {
+  padding-left             : 6em;
+  text-indent              : -3em;
+}
+p[indent="h3i7"] {
+  padding-left             : 7em;
+  text-indent              : -4em;
+}
+p[indent="h3i8"] {
+  padding-left             : 8em;
+  text-indent              : -5em;
+}
+p[indent="h3i9"] {
+  padding-left             : 9em;
+  text-indent              : -6em;
+}
+p[indent="h4i0"] {
+  padding-left             : 0em;
+  text-indent              : 4em;
+}
+p[indent="h4i1"] {
+  padding-left             : 1em;
+  text-indent              : 3em;
+}
+p[indent="h4i2"] {
+  padding-left             : 2em;
+  text-indent              : 2em;
+}
+p[indent="h4i3"] {
+  padding-left             : 3em;
+  text-indent              : 1em;
+}
+p[indent="h4i4"] {
+  padding-left             : 4em;
+  text-indent              : 0em;
+}
+p[indent="h4i5"] {
+  padding-left             : 5em;
+  text-indent              : -1em;
+}
+p[indent="h4i6"] {
+  padding-left             : 6em;
+  text-indent              : -2em;
+}
+p[indent="h4i7"] {
+  padding-left             : 7em;
+  text-indent              : -3em;
+}
+p[indent="h4i8"] {
+  padding-left             : 8em;
+  text-indent              : -4em;
+}
+p[indent="h4i9"] {
+  padding-left             : 9em;
+  text-indent              : -5em;
+}
+p[indent="h5i0"] {
+  padding-left             : 0em;
+  text-indent              : 5em;
+}
+p[indent="h5i1"] {
+  padding-left             : 1em;
+  text-indent              : 4em;
+}
+p[indent="h5i2"] {
+  padding-left             : 2em;
+  text-indent              : 3em;
+}
+p[indent="h5i3"] {
+  padding-left             : 3em;
+  text-indent              : 2em;
+}
+p[indent="h5i4"] {
+  padding-left             : 4em;
+  text-indent              : 1em;
+}
+p[indent="h5i5"] {
+  padding-left             : 5em;
+  text-indent              : 0em;
+}
+p[indent="h5i6"] {
+  padding-left             : 6em;
+  text-indent              : -1em;
+}
+p[indent="h5i7"] {
+  padding-left             : 7em;
+  text-indent              : -2em;
+}
+p[indent="h5i8"] {
+  padding-left             : 8em;
+  text-indent              : -3em;
+}
+p[indent="h5i9"] {
+  padding-left             : 9em;
+  text-indent              : -4em;
+}
+p[indent="h6i0"] {
+  padding-left             : 0em;
+  text-indent              : 6em;
+}
+p[indent="h6i1"] {
+  padding-left             : 1em;
+  text-indent              : 5em;
+}
+p[indent="h6i2"] {
+  padding-left             : 2em;
+  text-indent              : 4em;
+}
+p[indent="h6i3"] {
+  padding-left             : 3em;
+  text-indent              : 3em;
+}
+p[indent="h6i4"] {
+  padding-left             : 4em;
+  text-indent              : 2em;
+}
+p[indent="h6i5"] {
+  padding-left             : 5em;
+  text-indent              : 1em;
+}
+p[indent="h6i6"] {
+  padding-left             : 6em;
+  text-indent              : 0em;
+}
+p[indent="h6i7"] {
+  padding-left             : 7em;
+  text-indent              : -1em;
+}
+p[indent="h6i8"] {
+  padding-left             : 8em;
+  text-indent              : -2em;
+}
+p[indent="h6i9"] {
+  padding-left             : 9em;
+  text-indent              : -3em;
+}
+p[indent="h7i0"] {
+  padding-left             : 0em;
+  text-indent              : 7em;
+}
+p[indent="h7i1"] {
+  padding-left             : 1em;
+  text-indent              : 6em;
+}
+p[indent="h7i2"] {
+  padding-left             : 2em;
+  text-indent              : 5em;
+}
+p[indent="h7i3"] {
+  padding-left             : 3em;
+  text-indent              : 4em;
+}
+p[indent="h7i4"] {
+  padding-left             : 4em;
+  text-indent              : 3em;
+}
+p[indent="h7i5"] {
+  padding-left             : 5em;
+  text-indent              : 2em;
+}
+p[indent="h7i6"] {
+  padding-left             : 6em;
+  text-indent              : 1em;
+}
+p[indent="h7i7"] {
+  padding-left             : 7em;
+  text-indent              : 0em;
+}
+p[indent="h7i8"] {
+  padding-left             : 8em;
+  text-indent              : -1em;
+}
+p[indent="h7i9"] {
+  padding-left             : 9em;
+  text-indent              : -2em;
+}
+p[indent="h8i0"] {
+  padding-left             : 0em;
+  text-indent              : 8em;
+}
+p[indent="h8i1"] {
+  padding-left             : 1em;
+  text-indent              : 7em;
+}
+p[indent="h8i2"] {
+  padding-left             : 2em;
+  text-indent              : 6em;
+}
+p[indent="h8i3"] {
+  padding-left             : 3em;
+  text-indent              : 5em;
+}
+p[indent="h8i4"] {
+  padding-left             : 4em;
+  text-indent              : 4em;
+}
+p[indent="h8i5"] {
+  padding-left             : 5em;
+  text-indent              : 3em;
+}
+p[indent="h8i6"] {
+  padding-left             : 6em;
+  text-indent              : 2em;
+}
+p[indent="h8i7"] {
+  padding-left             : 7em;
+  text-indent              : 1em;
+}
+p[indent="h8i8"] {
+  padding-left             : 8em;
+  text-indent              : 0em;
+}
+p[indent="h8i9"] {
+  padding-left             : 9em;
+  text-indent              : -1em;
+}
+p[indent="h9i0"] {
+  padding-left             : 0em;
+  text-indent              : 9em;
+}
+p[indent="h9i1"] {
+  padding-left             : 1em;
+  text-indent              : 8em;
+}
+p[indent="h9i2"] {
+  padding-left             : 2em;
+  text-indent              : 7em;
+}
+p[indent="h9i3"] {
+  padding-left             : 3em;
+  text-indent              : 6em;
+}
+p[indent="h9i4"] {
+  padding-left             : 4em;
+  text-indent              : 5em;
+}
+p[indent="h9i5"] {
+  padding-left             : 5em;
+  text-indent              : 4em;
+}
+p[indent="h9i6"] {
+  padding-left             : 6em;
+  text-indent              : 3em;
+}
+p[indent="h9i7"] {
+  padding-left             : 7em;
+  text-indent              : 2em;
+}
+p[indent="h9i8"] {
+  padding-left             : 8em;
+  text-indent              : 1em;
+}
+p[indent="h9i9"] {
+  padding-left             : 9em;
+  text-indent              : 0em;
+}
 ┃");
-    string _color_ocn_light  = (doc_matters.opt.action.ocn_hidden) ? "#FFFFFF" : "#777777";
-    string _color_ocn_dark   = (doc_matters.opt.action.ocn_hidden) ? "#000000" : "#BBBBBB";
+string _color_ocn_light  = (doc_matters.opt.action.ocn_hidden) ? "#FFFFFF" : "#777777";
+string _color_ocn_dark   = (doc_matters.opt.action.ocn_hidden) ? "#000000" : "#BBBBBB";
     string _css_light_html_seg = format(q"┃
-  *{
-    padding                  : 0px;
-    margin                   : 0px;
-  }
-  body {
-    height                   : 100vh;
-    background-color         : #FFFFFF;
-  }
-  body {
-    color                    : #000000;
-    background               : #FFFFFF;
-    background-color         : #FFFFFF;
-  }
-  a:link {
-    color                    : #003399;
-    text-decoration          : none;
-  }
-  a:visited {
-    color                    : #003399;
-    text-decoration          : none;
-  }
-  a:hover {
-    color                    : #000000;
-    background-color         : #F9F9AA;
-  }
-  a.lnkocn:link {
-    color                    : %s;
-    text-decoration          : none;
-  }
-  a.lnkocn:visited {
-    color                    : #32CD32;
-    text-decoration          : none;
-  }
-  a.lnkocn:hover {
-    color                    : #777777;
-    font-size                : 120%%;
-  }
-  a:hover img {
-    background-color         : #FFFFFF;
-  }
-  a:active {
-    color                    : #003399;
-    text-decoration          : underline;
-  }
-  input {
-    color                    : #000000;
-    background-color         : #FFFFFF;
-  }
-  div {
-    margin-left              : 0;
-    margin-right             : 0;
-  }
-  div.p {
-    margin-left              : 5%%;
-    margin-right             : 1%%;
-  }
-  div.substance {
-    width                    : 100%%;
-    background-color         : #FFFFFF;
-  }
-  div.ocn {
-    width                    : 5%%;
-    float                    : right;
-    top                      : 0;
-    background-color         : #FFFFFF;
-  }
-  div.endnote {
-    width                    : 95%%;
-    background-color         : #FFFFFF;
-  }
-  div.toc {
-    position                 : absolute;
-    float                    : left;
-    margin                   : 0;
-    padding                  : 0;
-    padding-top              : 0.5em;
-    border                   : 0;
-    width                    : 13em;
-    background-color         : #EEEEEE;
-    margin-right             : 1em;
-  }
-  div.summary {
-    margin                   : 0;
-    padding                  : 0;
-    border-left              : 13em solid #EEEEEE;
-    padding-left             : 1em;
-    background-color         : #EEEEEE;
-  }
-  div.content, div.main_column {
-    margin                   : 0;
-    padding                  : 0;
-    border-left              : 13em solid #FFFFFF;
-    padding-left             : 1em;
-    padding-right            : 1em;
-  }
-  div.content0, div.main_column0 {
-    margin                   : 0;
-    padding                  : 0;
-    border-left              : 0%% solid #FFFFFF;
-    padding-left             : 5%%;
-  }
-  div.scroll {
-    margin                   : 0;
-    padding                  : 0;
-    padding-left             : 1em;
-    padding-right            : 1em;
-  }
-  div.content:after {
-    content                  : ' ';
-    clear                    : both;
-    display                  : block;
-    height                   : 0;
-    overflow                 : hidden;
-  }
-  div.footer {
-    clear                    : left;
-    padding                  : 0.5em;
-    font-size                : 80%%;
-    margin                   : 0;
-  }
-  div.toc ul {
-    list-style               : none;
-    padding                  : 0;
-    margin                   : 0;
-  }
-  div.toc li ul a, li ul span.currentlink
-  {
-    font-weight              : normal;
-    font-size                : 90%%;
-    padding-left             : 2em;
-    background-color         : #EEEEEE;
-  }
-  div.toc a, span.currentlink{
-    display                  : block;
-    text-decoration          : none;
-    padding-left             : 0.5em;
-    color                    : #0000aa;
-  }
-  hr {
-    width                    : 90%%;
-    margin-left              : 5%%;
-    margin-right             : 2em;
-    margin-top               : 1.8em;
-    margin-bottom            : 1.8em;
-  }
-  span.currentlink {
-    text-decoration          : none;
-    background-color         : #AAAAAA;
-  }
-  div.toc a:visited {
-    color                    : #0000aa;
-  }
-  div.toc a:hover {
-    color                    : #000000;
-    background-color         : #F9F9AA;
-  }
-  nav#toc ol {
-    list-style-type          : none;
-  }
-  .norm, .bold, .verse, .group, .block, .alt {
-    line-height              : 133%%;
-    margin-top               : 12px;
-    margin-bottom            : 0px;
-    padding-left             : 0em;
-    text-indent              : 0em;
-  }
-  p, h0, h1, h2, h3, h4, h5, h6, h7, ul, li {
-    display                  : block;
-    font-family              : verdana, arial, georgia, tahoma, sans-serif, helvetica, times, roman;
-    margin-left              : 5%%;
-    margin-right             : 2em;
-  }
-  p {
-    font-size                : 100%%;
-    font-weight              : normal;
-    line-height              : 133%%;
-    text-align               : justify;
-    text-indent              : 0mm;
-    margin-top               : 0.8em;
-    margin-bottom            : 0.8em;
-  }
-  img {
-    max-width                : 100%%;
-    height                   : auto;
-  }
-  pre {
-    width                    : auto;
-    display                  : block;
-    clear                    : both;
-    color                    : #555555;
-  }
-  pre.codeline {
-    display                  : table;
-    clear                    : both;
-    table-layout             : fixed;
-    margin-left              : 5%%;
-    margin-right             : 5%%;
-    width                    : 90%%;
-    white-space              : pre-wrap;
-    border-style             : none;
-    border-radius            : 5px 5px 5px 5px;
-    box-shadow               : 0 2px 5px #AAAAAA inset;
-    margin-bottom            : 1em;
-    padding                  : 0.5em 1em;
-    page-break-inside        : avoid;
-    word-wrap                : break-word;
-    font-family              : inconsolata, "liberation mono", "bitstream vera mono", "dejavu mono", monaco, consolas, "andale mono", "courier new", "courier 10 pitch", courier, monospace;
-    white-space              : pre;
-    white-space              : pre-wrap;
-    white-space              : -moz-pre-wrap;
-    white-space              : -o-pre-wrap;
-    background-color         : #EEEEEE;
-    color                    : #000000;
-    font-size                : 95%%;
-    line-height              : 100%%;
-  }
-  pre.codeline::before {
-    counter-reset            : linenum;
-  }
-  pre.codeline span.tr {
-    display                  : table-row;
-    counter-increment        : linenum;
-  }
-  pre.codeline span.th {
-    display                  : table-cell;
-    user-select              : none;
-    -moz-user-select         : none;
-    -webkit-user-select      : none;
-    padding                  : 0.5em 0.5em;
-    /* background-color         : #666666; */
-  }
-  pre.codeline span.th::before {
-    content                  : counter(linenum) ".";
-    color                    : #999999;
-    text-align               : right;
-    display                  : block;
-  }
-  pre.codeline span.th {
-    width                    : 4em;
-  }
-  pre.codeline code {
-    display                  : table-cell;
-  }
-  p.code {
-    border-style             : none;
-  }
-  p.spaced { white-space     : pre; }
-  p.block {
-    white-space              : pre;
-  }
-  p.group { }
-  p.alt { }
-  p.verse {
-    white-space              : pre;
-    margin-bottom            : 6px;
-  }
-  p.caption {
-    text-align               : left;
-    font-size                : 80%%;
-    display                  : inline;
-  }
-  p.endnote {
-    font-size                : 96%%;
-    line-height              : 120%%;
-    text-align               : left;
-    margin-right             : 15mm;
-    padding-left             : 1em;
-    text-indent              : -1em;
-  }
-  p.center {
-    text-align               : center;
-  }
-  p.bold {
-    font-weight              : bold;
-  }
-  p.bold_left {
-    font-weight              : bold;
-    text-align               : left;
-  }
-  p.centerbold {
-    text-align               : center;
-    font-weight              : bold;
-  }
-  p.em {
-    font-weight              : bold;
-    font-style               : normal;
-    background               : #FFF3B6;
-  }
-  p.small {
-    font-size                : 80%%;
-    margin-top               : 0px;
-    margin-bottom            : 0px;
-    margin-right             : 6px;
-    text-align               : left;
-  }
-  .tiny, .tiny_left, .tiny_right, .tiny_center {
-    font-size                : 75%%;
-    margin-top               : 0px;
-    margin-bottom            : 0px;
-    color                    : #777777;
-    margin-right             : 6px;
-    text-align               : left;
-  }
-  p.tiny { }
-  p.tiny_left {
-    margin-left              : 0px;
-    margin-right             : 0px;
-    text-align               : left;
-  }
-  p.tiny_right {
-    margin-right             : 1em;
-    text-align               : right;
-  }
-  p.tiny_center {
-    margin-left              : 0px;
-    margin-right             : 0px;
-    text-align               : center;
-  }
-  p.concordance_word {
-    line-height              : 150%%;
-    font-weight              : bold;
-    display                  : inline;
-    margin-top               : 4px;
-    margin-bottom            : 1px;
-  }
-  p.concordance_count {
-    font-size                : 80%%;
-    color                    : #777777;
-    display                  : inline;
-    margin-left              : 0em;
-  }
-  p.concordance_object {
-    font-size                : 80%%;
-    line-height              : 120%%;
-    text-align               : left;
-    margin-left              : 3em;
-    margin-top               : 1px;
-    margin-bottom            : 3px;
-  }
-  p.book_index_lev1 {
-    line-height              : 100%%;
-    margin-top               : 4px;
-    margin-bottom            : 1px;
-  }
-  p.book_index_lev2 {
-    line-height              : 100%%;
-    text-align               : left;
-    margin-left              : 3em;
-    margin-top               : 1px;
-    margin-bottom            : 3px;
-  }
-  tt {
-    font-family              : inconsolata, "liberation mono", "bitstream vera mono", "dejavu mono", monaco, consolas, "andale mono", "courier new", "courier 10 pitch", courier, monospace;
-    background-color         : #EEEEEE;
-    color                    : #000000;
-  }
+html {
+  font-size                : 62.5%%;
+}
+*{
+  padding                  : 0px;
+  margin                   : 0px;
+}
+body {
+  height                   : 100vh;
+  font-size                : 1.6rem;
+  background-color         : #FFFFFF;
+  color                    : #000000;
+  background               : #FFFFFF;
+  background-color         : #FFFFFF;
+}
+a:link {
+  color                    : #003399;
+  text-decoration          : none;
+}
+a:visited {
+  color                    : #003399;
+  text-decoration          : none;
+}
+a:hover {
+  color                    : #000000;
+  background-color         : #F9F9AA;
+}
+a.lnkocn:link {
+  color                    : %s;
+  text-decoration          : none;
+}
+a.lnkocn:visited {
+  color                    : #32CD32;
+  text-decoration          : none;
+}
+a.lnkocn:hover {
+  color                    : #777777;
+  font-size                : 1.8rem;
+}
+a:hover img {
+  background-color         : #FFFFFF;
+}
+a:active {
+  color                    : #003399;
+  text-decoration          : underline;
+}
+input {
+  color                    : #000000;
+  background-color         : #FFFFFF;
+}
+div {
+  margin-left              : 0;
+  margin-right             : 0;
+}
+div.p {
+  margin-left              : 5%%;
+  margin-right             : 1%%;
+}
+div.substance {
+  width                    : 100%%;
+  background-color         : #FFFFFF;
+}
+div.ocn {
+  width                    : 5%%;
+  float                    : right;
+  top                      : 0;
+  background-color         : #FFFFFF;
+}
+div.endnote {
+  width                    : 95%%;
+  background-color         : #FFFFFF;
+}
+div.toc {
+  position                 : absolute;
+  float                    : left;
+  margin                   : 0;
+  padding                  : 0;
+  padding-top              : 0.5em;
+  border                   : 0;
+  width                    : 13em;
+  background-color         : #EEEEEE;
+  margin-right             : 1em;
+}
+div.summary {
+  margin                   : 0;
+  padding                  : 0;
+  border-left              : 13em solid #EEEEEE;
+  padding-left             : 1em;
+  background-color         : #EEEEEE;
+}
+div.content, div.main_column {
+  margin                   : 0;
+  padding                  : 0;
+  border-left              : 13em solid #FFFFFF;
+  padding-left             : 1em;
+  padding-right            : 1em;
+}
+div.content0, div.main_column0 {
+  margin                   : 0;
+  padding                  : 0;
+  border-left              : 0%% solid #FFFFFF;
+  padding-left             : 5%%;
+}
+div.scroll {
+  margin                   : 0;
+  padding                  : 0;
+  padding-left             : 1em;
+  padding-right            : 1em;
+}
+div.content:after {
+  content                  : ' ';
+  clear                    : both;
+  display                  : block;
+  height                   : 0;
+  overflow                 : hidden;
+}
+div.footer {
+  clear                    : left;
+  padding                  : 0.5em;
+  font-size                : 1.4rem;
+  margin                   : 0;
+}
+div.toc ul {
+  list-style               : none;
+  padding                  : 0;
+  margin                   : 0;
+}
+div.toc li ul a, li ul span.currentlink
+{
+  font-weight              : normal;
+  font-size                : 1.5rem;
+  padding-left             : 2em;
+  background-color         : #EEEEEE;
+}
+div.toc a, span.currentlink{
+  display                  : block;
+  text-decoration          : none;
+  padding-left             : 0.5em;
+  color                    : #0000aa;
+}
+hr {
+  width                    : 90%%;
+  margin-left              : 5%%;
+  margin-right             : 2em;
+  margin-top               : 1.8em;
+  margin-bottom            : 1.8em;
+}
+span.currentlink {
+  text-decoration          : none;
+  background-color         : #AAAAAA;
+}
+div.toc a:visited {
+  color                    : #0000aa;
+}
+div.toc a:hover {
+  color                    : #000000;
+  background-color         : #F9F9AA;
+}
+nav#toc ol {
+  list-style-type          : none;
+}
+.norm, .bold, .verse, .group, .block, .alt {
+  line-height              : 133%%;
+  margin-top               : 12px;
+  margin-bottom            : 0px;
+  padding-left             : 0em;
+  text-indent              : 0em;
+}
+p, h0, h1, h2, h3, h4, h5, h6, h7, ul, li {
+  display                  : block;
+  font-family              : verdana, arial, georgia, tahoma, sans-serif, helvetica, times, roman;
+  margin-left              : 5%%;
+  margin-right             : 2em;
+}
+p {
+  font-size                : 1.6rem;
+  font-weight              : normal;
+  line-height              : 133%%;
+  text-align               : justify;
+  text-indent              : 0mm;
+  margin-top               : 0.8em;
+  margin-bottom            : 0.8em;
+}
+img {
+  max-width                : 100%%;
+  height                   : auto;
+}
+pre {
+  width                    : auto;
+  display                  : block;
+  clear                    : both;
+  color                    : #555555;
+}
+pre.codeline {
+  display                  : table;
+  clear                    : both;
+  table-layout             : fixed;
+  margin-left              : 5%%;
+  margin-right             : 5%%;
+  width                    : 90%%;
+  white-space              : pre-wrap;
+  border-style             : none;
+  border-radius            : 5px 5px 5px 5px;
+  box-shadow               : 0 2px 5px #AAAAAA inset;
+  margin-bottom            : 1em;
+  padding                  : 0.5em 1em;
+  page-break-inside        : avoid;
+  word-wrap                : break-word;
+  font-family              : inconsolata, "liberation mono", "bitstream vera mono", "dejavu mono", monaco, consolas, "andale mono", "courier new", "courier 10 pitch", courier, monospace;
+  white-space              : pre;
+  white-space              : pre-wrap;
+  white-space              : -moz-pre-wrap;
+  white-space              : -o-pre-wrap;
+  background-color         : #EEEEEE;
+  color                    : #000000;
+  font-size                : 1.5rem;
+  line-height              : 100%%;
+}
+pre.codeline::before {
+  counter-reset            : linenum;
+}
+pre.codeline span.tr {
+  display                  : table-row;
+  counter-increment        : linenum;
+}
+pre.codeline span.th {
+  display                  : table-cell;
+  user-select              : none;
+  -moz-user-select         : none;
+  -webkit-user-select      : none;
+  padding                  : 0.5em 0.5em;
+  /* background-color         : #666666; */
+}
+pre.codeline span.th::before {
+  content                  : counter(linenum) ".";
+  color                    : #999999;
+  text-align               : right;
+  display                  : block;
+}
+pre.codeline span.th {
+  width                    : 4em;
+}
+pre.codeline code {
+  display                  : table-cell;
+}
+p.code {
+  border-style             : none;
+}
+p.spaced { white-space     : pre; }
+p.block {
+  white-space              : pre;
+}
+p.group { }
+p.alt { }
+p.verse {
+  white-space              : pre;
+  margin-bottom            : 6px;
+}
+p.caption {
+  text-align               : left;
+  font-size                : 1.4rem;
+  display                  : inline;
+}
+p.endnote {
+  font-size                : 1.55rem;
+  line-height              : 120%%;
+  text-align               : left;
+  margin-right             : 15mm;
+  padding-left             : 1em;
+  text-indent              : -1em;
+}
+p.center {
+  text-align               : center;
+}
+p.bold {
+  font-weight              : bold;
+}
+p.bold_left {
+  font-weight              : bold;
+  text-align               : left;
+}
+p.centerbold {
+  text-align               : center;
+  font-weight              : bold;
+}
+p.em {
+  font-weight              : bold;
+  font-style               : normal;
+  background               : #FFF3B6;
+}
+p.small {
+  font-size                : 1.4rem;
+  margin-top               : 0px;
+  margin-bottom            : 0px;
+  margin-right             : 6px;
+  text-align               : left;
+}
+.tiny, .tiny_left, .tiny_right, .tiny_center {
+  font-size                : 1.2rem;
+  margin-top               : 0px;
+  margin-bottom            : 0px;
+  color                    : #777777;
+  margin-right             : 6px;
+  text-align               : left;
+}
+p.tiny { }
+p.tiny_left {
+  margin-left              : 0px;
+  margin-right             : 0px;
+  text-align               : left;
+}
+p.tiny_right {
+  margin-right             : 1em;
+  text-align               : right;
+}
+p.tiny_center {
+  margin-left              : 0px;
+  margin-right             : 0px;
+  text-align               : center;
+}
+p.concordance_word {
+  line-height              : 150%%;
+  font-weight              : bold;
+  display                  : inline;
+  margin-top               : 4px;
+  margin-bottom            : 1px;
+}
+p.concordance_count {
+  font-size                : 1.4rem;
+  color                    : #777777;
+  display                  : inline;
+  margin-left              : 0em;
+}
+p.concordance_object {
+  font-size                : 1.4rem;
+  line-height              : 120%%;
+  text-align               : left;
+  margin-left              : 3em;
+  margin-top               : 1px;
+  margin-bottom            : 3px;
+}
+p.book_index_lev1 {
+  line-height              : 100%%;
+  margin-top               : 4px;
+  margin-bottom            : 1px;
+}
+p.book_index_lev2 {
+  line-height              : 100%%;
+  text-align               : left;
+  margin-left              : 3em;
+  margin-top               : 1px;
+  margin-bottom            : 3px;
+}
+tt {
+  font-family              : inconsolata, "liberation mono", "bitstream vera mono", "dejavu mono", monaco, consolas, "andale mono", "courier new", "courier 10 pitch", courier, monospace;
+  background-color         : #EEEEEE;
+  color                    : #000000;
+}
 %s
-  note { white-space         : pre; }
-  label.ocn {
-    width                    : 2%%;
-    float                    : right;
-    top                      : 0;
-    font-size                : 80%%;
-    margin-top               : 0px;
-    margin-bottom            : 6px;
-    margin-right             : 6px;
-    text-align               : right;
-    color                    : %s;
-    -khtml-user-select       : none;
-    -moz-user-select         : none;
-    -ms-user-select          : none;
-    -o-user-select           : none;
-    -webkit-user-select      : none;
-    user-select              : none;
-  }
-  table {
-    display                  : block;
-    margin-left              : 5%%;
-    margin-right             : 2em;
-    background-color         : inherit;
-  }
-  tr { }
-  th,td {
-    vertical-align           : top;
-    text-align               : left;
-  }
-  th {
-    font-weight              : bold;
-  }
-  em {
-    font-weight              : bold;
-    font-style               : italic;
-  }
-  p.left,th.left,td.left {
-    text-align               : left;
-  }
-  p.small_left,th.small_left,td.small_left {
-    text-align               : left;
-    font-size                : 80%%;
-  }
-  p.right,th.right,td.right {
-    text-align               : right;
-  }
-  ul, li {
-    list-style-type          : none;
-    list-style               : none;
-    padding-left             : 20px;
-    font-weight              : normal;
-    line-height              : 150%%;
-    text-align               : left;
-    text-indent              : 0mm;
-    margin-left              : 1em;
-    margin-right             : 2em;
-    margin-top               : 3px;
-    margin-bottom            : 3px;
-  }
-  li {
-    background               : url(../image_sys/bullet_09.png) no-repeat 0px 6px;
-  }
-  ul { }
-  h0, h1, h2, h3, h4, h5, h6, h7 {
-    font-weight              : bold;
-    line-height              : 120%%;
-    text-align               : left;
-    margin-top               : 20px;
-    margin-bottom            : 10px;
-  }
-  h4.norm, h5.norm, h6.norm, h7.norm {
-    margin-top               : 10px;
-    margin-bottom            : 0px;
-  }
-  h0 { font-size             : 125%%; }
-  h1 { font-size             : 120%%; }
-  h2 { font-size             : 115%%; }
-  h3 { font-size             : 110%%; }
-  h4 { font-size             : 105%%; }
-  h5 { font-size             : 100%%; }
-  h6 { font-size             : 100%%; }
-  h7 { font-size             : 100%%; }
-  h0, h1, h2, h3, h4, h5, h6, h7 {
-    text-shadow              : .2em .2em .3em #808080;
-  }
-  h1.i { margin-left         : 2em; }
-  h2.i { margin-left         : 3em; }
-  h3.i { margin-left         : 4em; }
-  h4.i { margin-left         : 5em; }
-  h5.i { margin-left         : 6em; }
-  h6.i { margin-left         : 7em; }
-  h7.i { margin-left         : 8em; }
-  h8.i { margin-left         : 9em; }
-  h9.i { margin-left         : 10em; }
-  .toc {
-    font-weight              : normal;
-    margin-top               : 6px;
-    margin-bottom            : 6px;
-  }
-  h0.toc {
-    margin-left              : 1em;
-    font-size                : 120%%;
-    line-height              : 150%%;
-  }
-  h1.toc {
-    margin-left              : 1em;
-    font-size                : 115%%;
-    line-height              : 150%%;
-  }
-  h2.toc {
-    margin-left              : 2em;
-    font-size                : 110%%;
-    line-height              : 140%%;
-  }
-  h3.toc {
-    margin-left              : 3em;
-    font-size                : 105%%;
-    line-height              : 120%%;
-  }
-  h4.toc {
-    margin-left              : 4em;
-    font-size                : 100%%;
-    line-height              : 120%%;
-  }
-  h5.toc {
-    margin-left              : 5em;
-    font-size                : 95%%;
-    line-height              : 110%%;
-  }
-  h6.toc {
-    margin-left              : 6em;
-    font-size                : 90%%;
-    line-height              : 110%%;
-  }
-  h7.toc {
-    margin-left              : 7em;
-    font-size                : 85%%;
-    line-height              : 100%%;
-  }
-  .subtoc {
-    margin-right             : 34%%;
-    font-weight              : normal;
-  }
-  h5.subtoc {
-    margin-left              : 2em;
-    font-size                : 80%%;
-    margin-top               : 2px;
-    margin-bottom            : 2px;
-  }
-  h6.subtoc {
-    margin-left              : 3em;
-    font-size                : 75%%;
-    margin-top               : 0px;
-    margin-bottom            : 0px;
-  }
-  h7.subtoc {
-    margin-left              : 4em;
-    font-size                : 70%%;
-    margin-top               : 0px;
-    margin-bottom            : 0px;
-  }
+note { white-space         : pre; }
+label.ocn {
+  width                    : 2%%;
+  float                    : right;
+  top                      : 0;
+  font-size                : 1.4rem;
+  margin-top               : 0px;
+  margin-bottom            : 6px;
+  margin-right             : 6px;
+  text-align               : right;
+  color                    : %s;
+  -khtml-user-select       : none;
+  -moz-user-select         : none;
+  -ms-user-select          : none;
+  -o-user-select           : none;
+  -webkit-user-select      : none;
+  user-select              : none;
+}
+table {
+  display                  : block;
+  margin-left              : 5%%;
+  margin-right             : 2em;
+  background-color         : inherit;
+}
+tr { }
+th,td {
+  vertical-align           : top;
+  text-align               : left;
+}
+th {
+  font-weight              : bold;
+}
+em {
+  font-weight              : bold;
+  font-style               : italic;
+}
+p.left,th.left,td.left {
+  text-align               : left;
+}
+p.small_left,th.small_left,td.small_left {
+  text-align               : left;
+  font-size                : 1.4rem;
+}
+p.right,th.right,td.right {
+  text-align               : right;
+}
+ul, li {
+  list-style-type          : none;
+  list-style               : none;
+  padding-left             : 20px;
+  font-weight              : normal;
+  line-height              : 150%%;
+  text-align               : left;
+  text-indent              : 0mm;
+  margin-left              : 1em;
+  margin-right             : 2em;
+  margin-top               : 3px;
+  margin-bottom            : 3px;
+}
+li {
+  background               : url(../image_sys/bullet_09.png) no-repeat 0px 6px;
+}
+ul { }
+h0, h1, h2, h3, h4, h5, h6, h7 {
+  font-weight              : bold;
+  line-height              : 120%%;
+  text-align               : left;
+  margin-top               : 20px;
+  margin-bottom            : 10px;
+}
+h4.norm, h5.norm, h6.norm, h7.norm {
+  margin-top               : 10px;
+  margin-bottom            : 0px;
+}
+h0 { font-size             : 1.85rem; }
+h1 { font-size             : 1.8rem; }
+h2 { font-size             : 1.75rem; }
+h3 { font-size             : 1.7rem; }
+h4 { font-size             : 1.65rem; }
+h5 { font-size             : 1.6rem; }
+h6 { font-size             : 1.55rem; }
+h7 { font-size             : 1.5rem; }
+h0, h1, h2, h3, h4, h5, h6, h7 {
+  text-shadow              : .2em .2em .3em #808080;
+}
+h1.i { margin-left         : 2em; }
+h2.i { margin-left         : 3em; }
+h3.i { margin-left         : 4em; }
+h4.i { margin-left         : 5em; }
+h5.i { margin-left         : 6em; }
+h6.i { margin-left         : 7em; }
+h7.i { margin-left         : 8em; }
+h8.i { margin-left         : 9em; }
+h9.i { margin-left         : 10em; }
+.toc {
+  font-weight              : normal;
+  margin-top               : 6px;
+  margin-bottom            : 6px;
+}
+h0.toc {
+  margin-left              : 1em;
+  font-size                : 1.85rem;
+  line-height              : 150%%;
+}
+h1.toc {
+  margin-left              : 1em;
+  font-size                : 1.8rem;
+  line-height              : 150%%;
+}
+h2.toc {
+  margin-left              : 2em;
+  font-size                : 1.75rem;
+  line-height              : 140%%;
+}
+h3.toc {
+  margin-left              : 3em;
+  font-size                : 1.7rem;
+  line-height              : 120%%;
+}
+h4.toc {
+  margin-left              : 4em;
+  font-size                : 1.65rem;
+  line-height              : 120%%;
+}
+h5.toc {
+  margin-left              : 5em;
+  font-size                : 1.6rem;
+  line-height              : 110%%;
+}
+h6.toc {
+  margin-left              : 6em;
+  font-size                : 1.55rem;
+  line-height              : 110%%;
+}
+h7.toc {
+  margin-left              : 7em;
+  font-size                : 1.5rem;
+  line-height              : 100%%;
+}
+.subtoc {
+  margin-right             : 34%%;
+  font-weight              : normal;
+}
+h5.subtoc {
+  margin-left              : 2em;
+  font-size                : 1.45rem;
+  margin-top               : 2px;
+  margin-bottom            : 2px;
+}
+h6.subtoc {
+  margin-left              : 3em;
+  font-size                : 1.4rem;
+  margin-top               : 0px;
+  margin-bottom            : 0px;
+}
+h7.subtoc {
+  margin-left              : 4em;
+  font-size                : 1.35rem;
+  margin-top               : 0px;
+  margin-bottom            : 0px;
+}
 input, select, textarea {
-  font-size                : 150%%;
+  font-size                : 2.2rem;
 }
 input[type="text"] {
-  font-size:120%%;
+  font-size                : 1.8rem;
   line-height              : 120%%;
 }
 button[type="submit"] {
-  font-size                : 120%%;
+  font-size                : 1.8rem;
   line-height              : 120%%;
 }
 p.form {
-  font-size                : 150%%;
+  font-size                : 2.2rem;
   line-height              : 150%%;
 }
-  .icon-bar {
-    width                    : 100%%;
-    overflow                 : auto;
-    margin                   : 0em 0em 0em;
-  }
-  .left-bar {
-    width                    : 85%%;
-    float                    : left;
-    display                  : inline;
-    overflow                 : auto;
-  }
-  .toc-button {
-    position                 : absolute;
-    top                      : 8px;
-    width                    : 3em;
-    height                   : 3em;
-    border-radius            : 50%%;
-    background               : #CCCCCC;
-    fill                     : #333333;
-    box-shadow               : 0 2px 5px #AAAAAA inset;
-  }
-  .toc-button svg {
-    position                 : relative;
-    left                     : 25%%;
-    top                      : 25%%;
-    width                    : 150%%;
-    height                   : 150%%;
-  }
-  .toc-button p {
-    vertical-align           : center;
-    font-size                : 120%%;
-  }
-  .prev-next-button {
-    position                 : absolute;
-    top                      : 8px;
-    width                    : 3em;
-    height                   : 3em;
-    border-radius            : 50%%;
-    background               : #CCCCCC;
-    box-shadow               : 0 2px 5px #AAAAAA inset;
-  }
-  .prev-next-button svg {
-    position                 : relative;
-    left                     : 20%%;
-    top                      : 20%%;
-    width                    : 60%%;
-    height                   : 60%%;
-  }
-  .menu {
-    right                    : 8em;
-   }
-  .previous {
-    right                    : 4em;
-   }
-  .next {
-    right                    : 0em;
-   }
-  .arrow {
-    fill                     : #333333;
-  }
-  .minitoc {
-    line-height              : 120%%;
-    font-size                : 100%%;
-    margin-top               : 6px;
-    margin-bottom            : 0px;
-    padding-left             : 0em;
-    text-indent              : 0em;
-    -khtml-user-select       : none;
-    -moz-user-select         : none;
-    -ms-user-select          : none;
-    -o-user-select           : none;
-    -webkit-user-select      : none;
-    user-select              : none;
-  }
-  /* flex */
-  .flex-menu-bar {
-    display                  : -webkit-flex;
-    display                  : flex;
-    -webkit-flex-wrap        : wrap;
-    -webkit-align-items      : center;
-    align-items              : center;
-    width                    : 100%%;
-    margin-left              : 5%%;
-    margin-right             : 2%%;
-    background-color         : #FFFFFF;
-  }
-  .flex-menu-option {
-    background-color         : #FFFFFF;
-    margin-right             : 4px;
-  }
-  .flex-list {
-    display                  : -webkit-flex;
-    display                  : flex;
-    -webkit-align-items      : center;
-    display                  : block;
-    align-items              : center;
-    width                    : 100%%;
-    background-color         : #FFFFFF;
-  }
-  .flex-list-item {
-    background-color         : #FFFFFF;
-    margin                   : 4px;
-  }
-  /* grid */
-  .wrapper {
-    display                  : grid;
-    grid-template-columns    : 100%%;
-    grid-template-areas      :
-      "headband"
-      "doc_header"
-      "doc_title"
-      "doc_toc"
-      "doc_prefix"
-      "doc_intro"
-      "doc_body"
-      "doc_endnotes"
-      "doc_glossary"
-      "doc_biblio"
-      "doc_bookindex"
-      "doc_blurb"
-      "doc_suffix";
-    margin                   : 0px;
-    padding                  : 0px;
-    background-color         : #FFFFFF;
-  }
-  .delimit {
-    border-style             : none;
-    border-color             : #FFFFFF;
-    padding                  : 10px;
-  }
-  .headband {
-    grid-area                : headband;
-    background-color         : #FFFFFF;
-  }
-  .doc_header {
-    grid-area                : doc_header;
-  }
-  .doc_title {
-    grid-area                : doc_title;
-  }
-  .doc_toc {
-    grid-area                : doc_toc;
-  }
-  .doc_prefix {
-    grid-area                : doc_prefix;
-  }
-  .doc_intro {
-    grid-area                : doc_intro;
-  }
-  .doc_body {
-    grid-area                : doc_body;
-  }
-  .doc_endnotes {
-    grid-area                : doc_endnotes;
-  }
-  .doc_glossary {
-    grid-area                : doc_glossary;
-  }
-  .doc_biblio {
-    grid-area                : doc_biblio;
-  }
-  .doc_bookindex {
-    grid-area                : doc_bookindex;
-  }
-  .doc_blurb {
-    grid-area                : doc_blurb;
-  }
-  .doc_suffix {
-    grid-area                : doc_suffix;
-  }
-  .nav-ul {
-    list-style               : none;
-    float                    : left;
-  }
-  .nav-li {
-    float                    : left;
-    padding-right            : 0.7em;
-  }
-  .nav-li a {
-    text-decoration          : none;
-    color                    : #FFFFFF;
-  }
-  footer {
-    background-color         : #00704E;
-  }
+.icon-bar {
+  width                    : 100%%;
+  overflow                 : auto;
+  margin                   : 0em 0em 0em;
+}
+.left-bar {
+  width                    : 85%%;
+  float                    : left;
+  display                  : inline;
+  overflow                 : auto;
+}
+.toc-button {
+  position                 : absolute;
+  top                      : 8px;
+  width                    : 3em;
+  height                   : 3em;
+  border-radius            : 50%%;
+  background               : #CCCCCC;
+  fill                     : #333333;
+  box-shadow               : 0 2px 5px #AAAAAA inset;
+}
+.toc-button svg {
+  position                 : relative;
+  left                     : 25%%;
+  top                      : 25%%;
+  width                    : 150%%;
+  height                   : 150%%;
+}
+.toc-button p {
+  vertical-align           : center;
+  font-size                : 1.8rem;
+}
+.prev-next-button {
+  position                 : absolute;
+  top                      : 8px;
+  width                    : 3em;
+  height                   : 3em;
+  border-radius            : 50%%;
+  background               : #CCCCCC;
+  box-shadow               : 0 2px 5px #AAAAAA inset;
+}
+.prev-next-button svg {
+  position                 : relative;
+  left                     : 20%%;
+  top                      : 20%%;
+  width                    : 60%%;
+  height                   : 60%%;
+}
+.menu {
+  right                    : 8em;
+ }
+.previous {
+  right                    : 4em;
+ }
+.next {
+  right                    : 0em;
+ }
+.arrow {
+  fill                     : #333333;
+}
+.minitoc {
+  line-height              : 120%%;
+  font-size                : 1.6rem;
+  margin-top               : 6px;
+  margin-bottom            : 0px;
+  padding-left             : 0em;
+  text-indent              : 0em;
+  -khtml-user-select       : none;
+  -moz-user-select         : none;
+  -ms-user-select          : none;
+  -o-user-select           : none;
+  -webkit-user-select      : none;
+  user-select              : none;
+}
+/* flex */
+.flex-menu-bar {
+  display                  : -webkit-flex;
+  display                  : flex;
+  -webkit-flex-wrap        : wrap;
+  -webkit-align-items      : center;
+  align-items              : center;
+  width                    : 100%%;
+  margin-left              : 5%%;
+  margin-right             : 2%%;
+  background-color         : #FFFFFF;
+}
+.flex-menu-option {
+  background-color         : #FFFFFF;
+  margin-right             : 4px;
+}
+.flex-list {
+  display                  : -webkit-flex;
+  display                  : flex;
+  -webkit-align-items      : center;
+  display                  : block;
+  align-items              : center;
+  width                    : 100%%;
+  background-color         : #FFFFFF;
+}
+.flex-list-item {
+  background-color         : #FFFFFF;
+  margin                   : 4px;
+}
+/* grid */
+.wrapper {
+  display                  : grid;
+  grid-template-columns    : 100%%;
+  grid-template-areas      :
+    "headband"
+    "doc_header"
+    "doc_title"
+    "doc_toc"
+    "doc_prefix"
+    "doc_intro"
+    "doc_body"
+    "doc_endnotes"
+    "doc_glossary"
+    "doc_biblio"
+    "doc_bookindex"
+    "doc_blurb"
+    "doc_suffix";
+  margin                   : 0px;
+  padding                  : 0px;
+  background-color         : #FFFFFF;
+}
+.delimit {
+  border-style             : none;
+  border-color             : #FFFFFF;
+  padding                  : 10px;
+}
+.headband {
+  grid-area                : headband;
+  background-color         : #FFFFFF;
+}
+.doc_header {
+  grid-area                : doc_header;
+}
+.doc_title {
+  grid-area                : doc_title;
+}
+.doc_toc {
+  grid-area                : doc_toc;
+}
+.doc_prefix {
+  grid-area                : doc_prefix;
+}
+.doc_intro {
+  grid-area                : doc_intro;
+}
+.doc_body {
+  grid-area                : doc_body;
+}
+.doc_endnotes {
+  grid-area                : doc_endnotes;
+}
+.doc_glossary {
+  grid-area                : doc_glossary;
+}
+.doc_biblio {
+  grid-area                : doc_biblio;
+}
+.doc_bookindex {
+  grid-area                : doc_bookindex;
+}
+.doc_blurb {
+  grid-area                : doc_blurb;
+}
+.doc_suffix {
+  grid-area                : doc_suffix;
+}
+.nav-ul {
+  list-style               : none;
+  float                    : left;
+}
+.nav-li {
+  float                    : left;
+  padding-right            : 0.7em;
+}
+.nav-li a {
+  text-decoration          : none;
+  color                    : #FFFFFF;
+}
+footer {
+  background-color         : #00704E;
+}
 ┃",
     _color_ocn_light,
     _css_indent,
     _color_ocn_light,
 );
     string _css_dark_html_seg = format(q"┃
-  *{
-    padding                  : 0px;
-    margin                   : 0px;
-  }
-  body {
-    height                   : 100vh;
-    background-color         : #000000;
-  }
-  body {
-    color                    : #CCCCCC;
-    background               : #000000;
-    background-color         : #000000;
-  }
-  a:link {
-    color                    : #FFFFFF;
-    text-decoration          : none;
-  }
-  a:visited {
-    color                    : #999999;
-    text-decoration          : none;
-  }
-  a:hover {
-    color                    : #000000;
-    background-color         : #555555;
-  }
-  a.lnkocn:link {
-    color                    : %s;
-    text-decoration          : none;
-  }
-  a.lnkocn:visited {
-    color                    : #9ACD32;
-    text-decoration          : none;
-  }
-  a.lnkocn:hover {
-    color                    : #BBBBBB;
-    font-size                : 120%%;
-  }
-  a:hover img {
-    background-color         : #000000;
-  }
-  a:active {
-    color                    : #888888;
-    text-decoration          : underline;
-  }
-  input {
-    color                    : #FFFFFF;
-    background-color         : #777777;
-  }
-  div {
-    margin-left              : 0;
-    margin-right             : 0;
-  }
-  div.p {
-    margin-left              : 5%%;
-    margin-right             : 1%%;
-  }
-  div.substance {
-    width                    : 100%%;
-    background-color         : #000000;
-  }
-  div.ocn {
-    width                    : 5%%;
-    float                    : right;
-    top                      : 0;
-    background-color         : #000000;
-  }
-  div.endnote {
-    width                    : 95%%;
-    background-color         : #000000;
-  }
-  div.toc {
-    position                 : absolute;
-    float                    : left;
-    margin                   : 0;
-    padding                  : 0;
-    padding-top              : 0.5em;
-    border                   : 0;
-    width                    : 13em;
-    background-color         : #111111;
-    margin-right             : 1em;
-  }
-  div.summary {
-    margin                   : 0;
-    padding                  : 0;
-    border-left              : 13em solid #111111;
-    padding-left             : 1em;
-    background-color         : #111111;
-  }
-  div.content, div.main_column {
-    margin                   : 0;
-    padding                  : 0;
-    border-left              : 13em solid #000000;
-    padding-left             : 1em;
-    padding-right            : 1em;
-  }
-  div.content0, div.main_column0 {
-    margin                   : 0;
-    padding                  : 0;
-    border-left              : 0%% solid #000000;
-    padding-left             : 5%%;
-  }
-  div.scroll {
-    margin                   : 0;
-    padding                  : 0;
-    padding-left             : 1em;
-    padding-right            : 1em;
-  }
-  div.content:after {
-    content                  : ' ';
-    clear                    : both;
-    display                  : block;
-    height                   : 0;
-    overflow                 : hidden;
-  }
-  div.footer {
-    clear                    : left;
-    padding                  : 0.5em;
-    font-size                : 80%%;
-    margin                   : 0;
-  }
-  div.toc ul {
-    list-style               : none;
-    padding                  : 0;
-    margin                   : 0;
-  }
-  div.toc li ul a, li ul span.currentlink
-  {
-    font-weight              : normal;
-    font-size                : 90%%;
-    padding-left             : 2em;
-    background-color         : #111111;
-  }
-  div.toc a, span.currentlink{
-    display                  : block;
-    text-decoration          : none;
-    padding-left             : 0.5em;
-    color                    : #FF00AA;
-  }
-  hr {
-    width                    : 90%%;
-    margin-left              : 5%%;
-    margin-right             : 2em;
-    margin-top               : 1.8em;
-    margin-bottom            : 1.8em;
-  }
-  span.currentlink {
-    text-decoration          : none;
-    background-color         : #AAAAF9;
-  }
-  div.toc a:visited {
-    color                    : #FF00AA;
-  }
-  div.toc a:hover {
-    color                    : #CCCCCC;
-    background-color         : #F9F9AA;
-  }
-  nav#toc ol {
-    list-style-type          : none;
-  }
-  .norm, .bold, .verse, .group, .block, .alt {
-    line-height              : 133%%;
-    margin-top               : 12px;
-    margin-bottom            : 0px;
-    padding-left             : 0em;
-    text-indent              : 0em;
-  }
-  p, h0, h1, h2, h3, h4, h5, h6, h7, ul, li {
-    display                  : block;
-    font-family              : verdana, arial, georgia, tahoma, sans-serif, helvetica, times, roman;
-    margin-left              : 5%%;
-    margin-right             : 2em;
-  }
-  p {
-    font-size                : 100%%;
-    font-weight              : normal;
-    line-height              : 133%%;
-    text-align               : justify;
-    text-indent              : 0mm;
-    margin-top               : 0.8em;
-    margin-bottom            : 0.8em;
-  }
-  img {
-    max-width                : 100%%;
-    height                   : auto;
-  }
-  pre {
-    width                    : auto;
-    display                  : block;
-    clear                    : both;
-    color                    : #555555;
-  }
-  pre.codeline {
-    display                  : table;
-    clear                    : both;
-    table-layout             : fixed;
-    margin-left              : 5%%;
-    margin-right             : 5%%;
-    width                    : 90%%;
-    white-space              : pre-wrap;
-    border-style             : none;
-    border-radius            : 5px 5px 5px 5px;
-    box-shadow               : 0 2px 5px #AAAAAA inset;
-    margin-bottom            : 1em;
-    padding                  : 0.5em 1em;
-    page-break-inside        : avoid;
-    word-wrap                : break-word;
-    font-family              : inconsolata, "liberation mono", "bitstream vera mono", "dejavu mono", monaco, consolas, "andale mono", "courier new", "courier 10 pitch", courier, monospace;
-    white-space              : pre;
-    white-space              : pre-wrap;
-    white-space              : -moz-pre-wrap;
-    white-space              : -o-pre-wrap;
-    background-color         : #555555;
-    color                    : #DDDDDD;
-    font-size                : 95%%;
-    line-height              : 100%%;
-  }
-  pre.codeline::before {
-    counter-reset            : linenum;
-  }
-  pre.codeline span.tr {
-    display                  : table-row;
-    counter-increment        : linenum;
-  }
-  pre.codeline span.th {
-    display                  : table-cell;
-    user-select              : none;
-    -moz-user-select         : none;
-    -webkit-user-select      : none;
-    padding                  : 0.5em 0.5em;
-  }
-  pre.codeline span.th::before {
-    content                  : counter(linenum) ".";
-    color                    : #999999;
-    text-align               : right;
-    display                  : block;
-  }
-  pre.codeline span.th {
-    width                    : 4em;
-  }
-  pre.codeline code {
-    display                  : table-cell;
-  }
-  p.code {
-    border-style             : none;
-  }
-  p.spaced { white-space     : pre; }
-  p.block {
-    white-space              : pre;
-  }
-  p.group { }
-  p.alt { }
-  p.verse {
-    white-space              : pre;
-    margin-bottom            : 6px;
-  }
-  p.caption {
-    text-align               : left;
-    font-size                : 80%%;
-    display                  : inline;
-  }
-  p.endnote {
-    font-size                : 96%%;
-    line-height              : 120%%;
-    text-align               : left;
-    margin-right             : 15mm;
-    padding-left             : 1em;
-    text-indent              : -1em;
-  }
-  p.center {
-    text-align               : center;
-  }
-  p.bold {
-    font-weight              : bold;
-  }
-  p.bold_left {
-    font-weight              : bold;
-    text-align               : left;
-  }
-  p.centerbold {
-    text-align               : center;
-    font-weight              : bold;
-  }
-  p.em {
-    font-weight              : bold;
-    font-style               : normal;
-    background               : #FFF3B6;
-  }
-  p.small {
-    font-size                : 80%%;
-    margin-top               : 0px;
-    margin-bottom            : 0px;
-    margin-right             : 6px;
-    text-align               : left;
-  }
-  .tiny, .tiny_left, .tiny_right, .tiny_center {
-    font-size                : 75%%;
-    margin-top               : 0px;
-    margin-bottom            : 0px;
-    color                    : #EEEEEE;
-    margin-right             : 6px;
-    text-align               : left;
-  }
-  p.tiny { }
-  p.tiny_left {
-    margin-left              : 0px;
-    margin-right             : 0px;
-    text-align               : left;
-  }
-  p.tiny_right {
-    margin-right             : 1em;
-    text-align               : right;
-  }
-  p.tiny_center {
-    margin-left              : 0px;
-    margin-right             : 0px;
-    text-align               : center;
-  }
-  p.concordance_word {
-    line-height              : 150%%;
-    font-weight              : bold;
-    display                  : inline;
-    margin-top               : 4px;
-    margin-bottom            : 1px;
-  }
-  p.concordance_count {
-    font-size                : 80%%;
-    color                    : #555555;
-    display                  : inline;
-    margin-left              : 0em;
-  }
-  p.concordance_object {
-    font-size                : 80%%;
-    line-height              : 120%%;
-    text-align               : left;
-    margin-left              : 3em;
-    margin-top               : 1px;
-    margin-bottom            : 3px;
-  }
-  p.book_index_lev1 {
-    line-height              : 100%%;
-    margin-top               : 4px;
-    margin-bottom            : 1px;
-  }
-  p.book_index_lev2 {
-    line-height              : 100%%;
-    text-align               : left;
-    margin-left              : 3em;
-    margin-top               : 1px;
-    margin-bottom            : 3px;
-  }
-  tt {
-    font-family              : inconsolata, "liberation mono", "bitstream vera mono", "dejavu mono", monaco, consolas, "andale mono", "courier new", "courier 10 pitch", courier, monospace;
-    background-color         : #555555;
-    color                    : #DDDDDD;
-  }
+html {
+}
+*{
+  padding                  : 0px;
+  margin                   : 0px;
+}
+body {
+  height                   : 100vh;
+  background-color         : #000000;
+  color                    : #CCCCCC;
+  background               : #000000;
+  background-color         : #000000;
+}
+a:link {
+  color                    : #FFFFFF;
+  text-decoration          : none;
+}
+a:visited {
+  color                    : #999999;
+  text-decoration          : none;
+}
+a:hover {
+  color                    : #000000;
+  background-color         : #555555;
+}
+a.lnkocn:link {
+  color                    : %s;
+  text-decoration          : none;
+}
+a.lnkocn:visited {
+  color                    : #9ACD32;
+  text-decoration          : none;
+}
+a.lnkocn:hover {
+  color                    : #BBBBBB;
+  font-size                : 1.8rem;
+}
+a:hover img {
+  background-color         : #000000;
+}
+a:active {
+  color                    : #888888;
+  text-decoration          : underline;
+}
+input {
+  color                    : #FFFFFF;
+  background-color         : #777777;
+}
+div {
+  margin-left              : 0;
+  margin-right             : 0;
+}
+div.p {
+  margin-left              : 5%%;
+  margin-right             : 1%%;
+}
+div.substance {
+  width                    : 100%%;
+  background-color         : #000000;
+}
+div.ocn {
+  width                    : 5%%;
+  float                    : right;
+  top                      : 0;
+  background-color         : #000000;
+}
+div.endnote {
+  width                    : 95%%;
+  background-color         : #000000;
+}
+div.toc {
+  position                 : absolute;
+  float                    : left;
+  margin                   : 0;
+  padding                  : 0;
+  padding-top              : 0.5em;
+  border                   : 0;
+  width                    : 13em;
+  background-color         : #111111;
+  margin-right             : 1em;
+}
+div.summary {
+  margin                   : 0;
+  padding                  : 0;
+  border-left              : 13em solid #111111;
+  padding-left             : 1em;
+  background-color         : #111111;
+}
+div.content, div.main_column {
+  margin                   : 0;
+  padding                  : 0;
+  border-left              : 13em solid #000000;
+  padding-left             : 1em;
+  padding-right            : 1em;
+}
+div.content0, div.main_column0 {
+  margin                   : 0;
+  padding                  : 0;
+  border-left              : 0%% solid #000000;
+  padding-left             : 5%%;
+}
+div.scroll {
+  margin                   : 0;
+  padding                  : 0;
+  padding-left             : 1em;
+  padding-right            : 1em;
+}
+div.content:after {
+  content                  : ' ';
+  clear                    : both;
+  display                  : block;
+  height                   : 0;
+  overflow                 : hidden;
+}
+div.footer {
+  clear                    : left;
+  padding                  : 0.5em;
+  font-size                : 1.4rem;
+  margin                   : 0;
+}
+div.toc ul {
+  list-style               : none;
+  padding                  : 0;
+  margin                   : 0;
+}
+div.toc li ul a, li ul span.currentlink
+{
+  font-weight              : normal;
+  font-size                : 1.5rem;
+  padding-left             : 2em;
+  background-color         : #111111;
+}
+div.toc a, span.currentlink{
+  display                  : block;
+  text-decoration          : none;
+  padding-left             : 0.5em;
+  color                    : #FF00AA;
+}
+hr {
+  width                    : 90%%;
+  margin-left              : 5%%;
+  margin-right             : 2em;
+  margin-top               : 1.8em;
+  margin-bottom            : 1.8em;
+}
+span.currentlink {
+  text-decoration          : none;
+  background-color         : #AAAAF9;
+}
+div.toc a:visited {
+  color                    : #FF00AA;
+}
+div.toc a:hover {
+  color                    : #CCCCCC;
+  background-color         : #F9F9AA;
+}
+nav#toc ol {
+  list-style-type          : none;
+}
+.norm, .bold, .verse, .group, .block, .alt {
+  line-height              : 133%%;
+  margin-top               : 12px;
+  margin-bottom            : 0px;
+  padding-left             : 0em;
+  text-indent              : 0em;
+}
+p, h0, h1, h2, h3, h4, h5, h6, h7, ul, li {
+  display                  : block;
+  font-family              : verdana, arial, georgia, tahoma, sans-serif, helvetica, times, roman;
+  margin-left              : 5%%;
+  margin-right             : 2em;
+}
+p {
+  font-size                : 1.6rem;
+  font-weight              : normal;
+  line-height              : 133%%;
+  text-align               : justify;
+  text-indent              : 0mm;
+  margin-top               : 0.8em;
+  margin-bottom            : 0.8em;
+}
+img {
+  max-width                : 100%%;
+  height                   : auto;
+}
+pre {
+  width                    : auto;
+  display                  : block;
+  clear                    : both;
+  color                    : #555555;
+}
+pre.codeline {
+  display                  : table;
+  clear                    : both;
+  table-layout             : fixed;
+  margin-left              : 5%%;
+  margin-right             : 5%%;
+  width                    : 90%%;
+  white-space              : pre-wrap;
+  border-style             : none;
+  border-radius            : 5px 5px 5px 5px;
+  box-shadow               : 0 2px 5px #AAAAAA inset;
+  margin-bottom            : 1em;
+  padding                  : 0.5em 1em;
+  page-break-inside        : avoid;
+  word-wrap                : break-word;
+  font-family              : inconsolata, "liberation mono", "bitstream vera mono", "dejavu mono", monaco, consolas, "andale mono", "courier new", "courier 10 pitch", courier, monospace;
+  white-space              : pre;
+  white-space              : pre-wrap;
+  white-space              : -moz-pre-wrap;
+  white-space              : -o-pre-wrap;
+  background-color         : #555555;
+  color                    : #DDDDDD;
+  font-size                : 1.5rem;
+  line-height              : 100%%;
+}
+pre.codeline::before {
+  counter-reset            : linenum;
+}
+pre.codeline span.tr {
+  display                  : table-row;
+  counter-increment        : linenum;
+}
+pre.codeline span.th {
+  display                  : table-cell;
+  user-select              : none;
+  -moz-user-select         : none;
+  -webkit-user-select      : none;
+  padding                  : 0.5em 0.5em;
+}
+pre.codeline span.th::before {
+  content                  : counter(linenum) ".";
+  color                    : #999999;
+  text-align               : right;
+  display                  : block;
+}
+pre.codeline span.th {
+  width                    : 4em;
+}
+pre.codeline code {
+  display                  : table-cell;
+}
+p.code {
+  border-style             : none;
+}
+p.spaced { white-space     : pre; }
+p.block {
+  white-space              : pre;
+}
+p.group { }
+p.alt { }
+p.verse {
+  white-space              : pre;
+  margin-bottom            : 6px;
+}
+p.caption {
+  text-align               : left;
+  font-size                : 1.4rem;
+  display                  : inline;
+}
+p.endnote {
+  font-size                : 1.5rem;
+  line-height              : 120%%;
+  text-align               : left;
+  margin-right             : 15mm;
+  padding-left             : 1em;
+  text-indent              : -1em;
+}
+p.center {
+  text-align               : center;
+}
+p.bold {
+  font-weight              : bold;
+}
+p.bold_left {
+  font-weight              : bold;
+  text-align               : left;
+}
+p.centerbold {
+  text-align               : center;
+  font-weight              : bold;
+}
+p.em {
+  font-weight              : bold;
+  font-style               : normal;
+  background               : #FFF3B6;
+}
+p.small {
+  font-size                : 1.4rem;
+  margin-top               : 0px;
+  margin-bottom            : 0px;
+  margin-right             : 6px;
+  text-align               : left;
+}
+.tiny, .tiny_left, .tiny_right, .tiny_center {
+  font-size                : 1.35rem;
+  margin-top               : 0px;
+  margin-bottom            : 0px;
+  color                    : #EEEEEE;
+  margin-right             : 6px;
+  text-align               : left;
+}
+p.tiny { }
+p.tiny_left {
+  margin-left              : 0px;
+  margin-right             : 0px;
+  text-align               : left;
+}
+p.tiny_right {
+  margin-right             : 1em;
+  text-align               : right;
+}
+p.tiny_center {
+  margin-left              : 0px;
+  margin-right             : 0px;
+  text-align               : center;
+}
+p.concordance_word {
+  line-height              : 150%%;
+  font-weight              : bold;
+  display                  : inline;
+  margin-top               : 4px;
+  margin-bottom            : 1px;
+}
+p.concordance_count {
+  font-size                : 1.4rem;
+  color                    : #555555;
+  display                  : inline;
+  margin-left              : 0em;
+}
+p.concordance_object {
+  font-size                : 1.4rem;
+  line-height              : 120%%;
+  text-align               : left;
+  margin-left              : 3em;
+  margin-top               : 1px;
+  margin-bottom            : 3px;
+}
+p.book_index_lev1 {
+  line-height              : 100%%;
+  margin-top               : 4px;
+  margin-bottom            : 1px;
+}
+p.book_index_lev2 {
+  line-height              : 100%%;
+  text-align               : left;
+  margin-left              : 3em;
+  margin-top               : 1px;
+  margin-bottom            : 3px;
+}
+tt {
+  font-family              : inconsolata, "liberation mono", "bitstream vera mono", "dejavu mono", monaco, consolas, "andale mono", "courier new", "courier 10 pitch", courier, monospace;
+  background-color         : #555555;
+  color                    : #DDDDDD;
+}
 %s
-  note { white-space         : pre; }
-  label.ocn {
-    width                    : 2%%;
-    float                    : right;
-    top                      : 0;
-    font-size                : 80%%;
-    margin-top               : 0px;
-    margin-bottom            : 6px;
-    margin-right             : 6px;
-    text-align               : right;
-    color                    : %s;
-    -khtml-user-select       : none;
-    -moz-user-select         : none;
-    -ms-user-select          : none;
-    -o-user-select           : none;
-    -webkit-user-select      : none;
-    user-select              : none;
-  }
-  table {
-    display                  : block;
-    margin-left              : 5%%;
-    margin-right             : 2em;
-    background-color         : inherit;
-  }
-  tr { }
-  th,td {
-    vertical-align           : top;
-    text-align               : left;
-  }
-  th {
-    font-weight              : bold;
-  }
-  em {
-    font-weight              : bold;
-    font-style               : italic;
-  }
-  p.left,th.left,td.left {
-    text-align               : left;
-  }
-  p.small_left,th.small_left,td.small_left {
-    text-align               : left;
-    font-size                : 80%%;
-  }
-  p.right,th.right,td.right {
-    text-align               : right;
-  }
-  ul, li {
-    list-style-type          : none;
-    list-style               : none;
-    padding-left             : 20px;
-    font-weight              : normal;
-    line-height              : 150%%;
-    text-align               : left;
-    text-indent              : 0mm;
-    margin-left              : 1em;
-    margin-right             : 2em;
-    margin-top               : 3px;
-    margin-bottom            : 3px;
-  }
-  li {
-    background               : (../image_sys/bullet_09.png) no-repeat 0px 6px;
-  }
-  ul { }
-  h0, h1, h2, h3, h4, h5, h6, h7 {
-    font-weight              : bold;
-    line-height              : 120%%;
-    text-align               : left;
-    margin-top               : 20px;
-    margin-bottom            : 10px;
-  }
-  h4.norm, h5.norm, h6.norm, h7.norm {
-    margin-top               : 10px;
-    margin-bottom            : 0px;
-  }
-  h0 { font-size             : 125%%; }
-  h1 { font-size             : 120%%; }
-  h2 { font-size             : 115%%; }
-  h3 { font-size             : 110%%; }
-  h4 { font-size             : 105%%; }
-  h5 { font-size             : 100%%; }
-  h6 { font-size             : 100%%; }
-  h7 { font-size             : 100%%; }
-  h0, h1, h2, h3, h4, h5, h6, h7 {
-    text-shadow              : .2em .2em .3em #999999;
-  }
-  h1.i { margin-left         : 2em; }
-  h2.i { margin-left         : 3em; }
-  h3.i { margin-left         : 4em; }
-  h4.i { margin-left         : 5em; }
-  h5.i { margin-left         : 6em; }
-  h6.i { margin-left         : 7em; }
-  h7.i { margin-left         : 8em; }
-  h8.i { margin-left         : 9em; }
-  h9.i { margin-left         : 10em; }
-  .toc {
-    font-weight              : normal;
-    margin-top               : 6px;
-    margin-bottom            : 6px;
-  }
-  h0.toc {
-    margin-left              : 1em;
-    font-size                : 120%%;
-    line-height              : 150%%;
-  }
-  h1.toc {
-    margin-left              : 1em;
-    font-size                : 115%%;
-    line-height              : 150%%;
-  }
-  h2.toc {
-    margin-left              : 2em;
-    font-size                : 110%%;
-    line-height              : 140%%;
-  }
-  h3.toc {
-    margin-left              : 3em;
-    font-size                : 105%%;
-    line-height              : 120%%;
-  }
-  h4.toc {
-    margin-left              : 4em;
-    font-size                : 100%%;
-    line-height              : 120%%;
-  }
-  h5.toc {
-    margin-left              : 5em;
-    font-size                : 95%%;
-    line-height              : 110%%;
-  }
-  h6.toc {
-    margin-left              : 6em;
-    font-size                : 90%%;
-    line-height              : 110%%;
-  }
-  h7.toc {
-    margin-left              : 7em;
-    font-size                : 85%%;
-    line-height              : 100%%;
-  }
-  .subtoc {
-    margin-right             : 34%%;
-    font-weight              : normal;
-  }
-  h5.subtoc {
-    margin-left              : 2em;
-    font-size                : 80%%;
-    margin-top               : 2px;
-    margin-bottom            : 2px;
-  }
-  h6.subtoc {
-    margin-left              : 3em;
-    font-size                : 75%%;
-    margin-top               : 0px;
-    margin-bottom            : 0px;
-  }
-  h7.subtoc {
-    margin-left              : 4em;
-    font-size                : 70%%;
-    margin-top               : 0px;
-    margin-bottom            : 0px;
-  }
+note { white-space         : pre; }
+label.ocn {
+  width                    : 2%%;
+  float                    : right;
+  top                      : 0;
+  font-size                : 1.4rem;
+  margin-top               : 0px;
+  margin-bottom            : 6px;
+  margin-right             : 6px;
+  text-align               : right;
+  color                    : %s;
+  -khtml-user-select       : none;
+  -moz-user-select         : none;
+  -ms-user-select          : none;
+  -o-user-select           : none;
+  -webkit-user-select      : none;
+  user-select              : none;
+}
+table {
+  display                  : block;
+  margin-left              : 5%%;
+  margin-right             : 2em;
+  background-color         : inherit;
+}
+tr { }
+th,td {
+  vertical-align           : top;
+  text-align               : left;
+}
+th {
+  font-weight              : bold;
+}
+em {
+  font-weight              : bold;
+  font-style               : italic;
+}
+p.left,th.left,td.left {
+  text-align               : left;
+}
+p.small_left,th.small_left,td.small_left {
+  text-align               : left;
+  font-size                : 1.4rem;
+}
+p.right,th.right,td.right {
+  text-align               : right;
+}
+ul, li {
+  list-style-type          : none;
+  list-style               : none;
+  padding-left             : 20px;
+  font-weight              : normal;
+  line-height              : 150%%;
+  text-align               : left;
+  text-indent              : 0mm;
+  margin-left              : 1em;
+  margin-right             : 2em;
+  margin-top               : 3px;
+  margin-bottom            : 3px;
+}
+li {
+  background               : (../image_sys/bullet_09.png) no-repeat 0px 6px;
+}
+ul { }
+h0, h1, h2, h3, h4, h5, h6, h7 {
+  font-weight              : bold;
+  line-height              : 120%%;
+  text-align               : left;
+  margin-top               : 20px;
+  margin-bottom            : 10px;
+}
+h4.norm, h5.norm, h6.norm, h7.norm {
+  margin-top               : 10px;
+  margin-bottom            : 0px;
+}
+h0 { font-size             : 1.9rem; }
+h1 { font-size             : 1.8rem; }
+h2 { font-size             : 1.75rem; }
+h3 { font-size             : 1.7rem; }
+h4 { font-size             : 1.65rem; }
+h5 { font-size             : 1.6rem; }
+h6 { font-size             : 1.55rem; }
+h7 { font-size             : 1.5rem; }
+h0, h1, h2, h3, h4, h5, h6, h7 {
+  text-shadow              : .2em .2em .3em #999999;
+}
+h1.i { margin-left         : 2em; }
+h2.i { margin-left         : 3em; }
+h3.i { margin-left         : 4em; }
+h4.i { margin-left         : 5em; }
+h5.i { margin-left         : 6em; }
+h6.i { margin-left         : 7em; }
+h7.i { margin-left         : 8em; }
+h8.i { margin-left         : 9em; }
+h9.i { margin-left         : 10em; }
+.toc {
+  font-weight              : normal;
+  margin-top               : 6px;
+  margin-bottom            : 6px;
+}
+h0.toc {
+  margin-left              : 1em;
+  font-size                : 1.8rem;
+  line-height              : 150%%;
+}
+h1.toc {
+  margin-left              : 1em;
+  font-size                : 1.75rem;
+  line-height              : 150%%;
+}
+h2.toc {
+  margin-left              : 2em;
+  font-size                : 1.7rem;
+  line-height              : 140%%;
+}
+h3.toc {
+  margin-left              : 3em;
+  font-size                : 1.65rem;
+  line-height              : 120%%;
+}
+h4.toc {
+  margin-left              : 4em;
+  font-size                : 1.6rem;
+  line-height              : 120%%;
+}
+h5.toc {
+  margin-left              : 5em;
+  font-size                : 1.5rem;
+  line-height              : 110%%;
+}
+h6.toc {
+  margin-left              : 6em;
+  font-size                : 1.5rem;
+  line-height              : 110%%;
+}
+h7.toc {
+  margin-left              : 7em;
+  font-size                : 1.45rem;
+  line-height              : 100%%;
+}
+.subtoc {
+  margin-right             : 34%%;
+  font-weight              : normal;
+}
+h5.subtoc {
+  margin-left              : 2em;
+  font-size                : 1.4rem;
+  margin-top               : 2px;
+  margin-bottom            : 2px;
+}
+h6.subtoc {
+  margin-left              : 3em;
+  font-size                : 1.35;
+  margin-top               : 0px;
+  margin-bottom            : 0px;
+}
+h7.subtoc {
+  margin-left              : 4em;
+  font-size                : 1.3rem;
+  margin-top               : 0px;
+  margin-bottom            : 0px;
+}
 input, select, textarea {
-  font-size                : 150%%;
+  font-size                : 2.2rem;
 }
 input[type="text"] {
-  font-size:120%%;
+  font-size                : 1.8rem;
   line-height              : 120%%;
 }
 button[type="submit"] {
-  font-size                : 120%%;
+  font-size                : 1.8rem;
   line-height              : 120%%;
 }
 p.form {
-  font-size                : 150%%;
+  font-size                : 2.2rem;
   line-height              : 150%%;
 }
-  .icon-bar {
-    width                    : 100%%;
-    overflow                 : auto;
-    margin                   : 0em 0em 0em;
-  }
-  .left-bar {
-    width                    : 85%%;
-    float                    : left;
-    display                  : inline;
-    overflow                 : auto;
-  }
-  .toc-button {
-    position                 : absolute;
-    top                      : 8px;
-    width                    : 3em;
-    height                   : 3em;
-    border-radius            : 50%%;
-    background               : #555555;
-    fill                     : #DDDDDD;
-    box-shadow               : 0 2px 5px #EEEEEE inset;
-  }
-  .toc-button svg {
-    position                 : relative;
-    left                     : 25%%;
-    top                      : 25%%;
-    width                    : 150%%;
-    height                   : 150%%;
-  }
-  .toc-button p {
-    vertical-align           : center;
-    font-size                : 120%%;
-  }
-  .prev-next-button {
-    position                 : absolute;
-    top                      : 8px;
-    width                    : 3em;
-    height                   : 3em;
-    border-radius            : 50%%;
-    background               : #555555;
-    box-shadow               : 0 2px 5px #AAAAAA inset;
-  }
-  .prev-next-button svg {
-    position                 : relative;
-    left                     : 20%%;
-    top                      : 20%%;
-    width                    : 60%%;
-    height                   : 60%%;
-  }
-  .menu {
-    right                    : 8em;
-   }
-  .previous {
-    right                    : 4em;
-   }
-  .next {
-    right                    : 0em;
-   }
-  .arrow {
-     fill                    : #DDDDDD;
-  }
-  .minitoc {
-    line-height              : 120%%;
-    font-size                : 100%%;
-    margin-top               : 6px;
-    margin-bottom            : 0px;
-    padding-left             : 0em;
-    text-indent              : 0em;
-    -khtml-user-select       : none;
-    -moz-user-select         : none;
-    -ms-user-select          : none;
-    -o-user-select           : none;
-    -webkit-user-select      : none;
-    user-select              : none;
-  }
-  /* flex */
-  .flex-menu-bar {
-    display                  : -webkit-flex;
-    display                  : flex;
-    -webkit-flex-wrap        : wrap;
-    -webkit-align-items      : center;
-    align-items              : center;
-    width                    : 100%%;
-    margin-left              : 5%%;
-    margin-right             : 2%%;
-    background-color         : #000000;
-  }
-  .flex-menu-option {
-    background-color         : #000000;
-    margin-right             : 4px;
-  }
-  .flex-list {
-    display                  : -webkit-flex;
-    display                  : flex;
-    -webkit-align-items      : center;
-    display                  : block;
-    align-items              : center;
-    width                    : 100%%;
-    background-color         : #000000;
-  }
-  .flex-list-item {
-    background-color         : #000000;
-    margin                   : 4px;
-  }
-  /* grid */
-  .wrapper {
-    display                  : grid;
-    grid-template-columns    : 100%%;
-    grid-template-areas      :
-      "headband"
-      "doc_header"
-      "doc_title"
-      "doc_toc"
-      "doc_prefix"
-      "doc_intro"
-      "doc_body"
-      "doc_endnotes"
-      "doc_glossary"
-      "doc_biblio"
-      "doc_bookindex"
-      "doc_blurb"
-      "doc_suffix";
-    margin                   : 0px;
-    padding                  : 0px;
-    background-color         : #000000;
-  }
-  .delimit {
-    border-style             : none;
-    border-color             : #000000;
-    padding                  : 10px;
-  }
-  .headband {
-    grid-area                : headband;
-    background-color         : #000000;
-  }
-  .doc_header {
-    grid-area                : doc_header;
-  }
-  .doc_title {
-    grid-area                : doc_title;
-  }
-  .doc_toc {
-    grid-area                : doc_toc;
-  }
-  .doc_prefix {
-    grid-area                : doc_prefix;
-  }
-  .doc_intro {
-    grid-area                : doc_intro;
-  }
-  .doc_body {
-    grid-area                : doc_body;
-  }
-  .doc_endnotes {
-    grid-area                : doc_endnotes;
-  }
-  .doc_glossary {
-    grid-area                : doc_glossary;
-  }
-  .doc_biblio {
-    grid-area                : doc_biblio;
-  }
-  .doc_bookindex {
-    grid-area                : doc_bookindex;
-  }
-  .doc_blurb {
-    grid-area                : doc_blurb;
-  }
-  .doc_suffix {
-    grid-area                : doc_suffix;
-  }
-  .nav-ul {
-    list-style               : none;
-    float                    : left;
-  }
-  .nav-li {
-    float                    : left;
-    padding-right            : 0.7em;
-  }
-  .nav-li a {
-    text-decoration          : none;
-    color                    : #000000;
-  }
-  footer {
-    background-color         : #FF704E;
-  }
+.icon-bar {
+  width                    : 100%%;
+  overflow                 : auto;
+  margin                   : 0em 0em 0em;
+}
+.left-bar {
+  width                    : 85%%;
+  float                    : left;
+  display                  : inline;
+  overflow                 : auto;
+}
+.toc-button {
+  position                 : absolute;
+  top                      : 8px;
+  width                    : 3em;
+  height                   : 3em;
+  border-radius            : 50%%;
+  background               : #555555;
+  fill                     : #DDDDDD;
+  box-shadow               : 0 2px 5px #EEEEEE inset;
+}
+.toc-button svg {
+  position                 : relative;
+  left                     : 25%%;
+  top                      : 25%%;
+  width                    : 150%%;
+  height                   : 150%%;
+}
+.toc-button p {
+  vertical-align           : center;
+  font-size                : 1.8rem;
+}
+.prev-next-button {
+  position                 : absolute;
+  top                      : 8px;
+  width                    : 3em;
+  height                   : 3em;
+  border-radius            : 50%%;
+  background               : #555555;
+  box-shadow               : 0 2px 5px #AAAAAA inset;
+}
+.prev-next-button svg {
+  position                 : relative;
+  left                     : 20%%;
+  top                      : 20%%;
+  width                    : 60%%;
+  height                   : 60%%;
+}
+.menu {
+  right                    : 8em;
+ }
+.previous {
+  right                    : 4em;
+ }
+.next {
+  right                    : 0em;
+ }
+.arrow {
+   fill                    : #DDDDDD;
+}
+.minitoc {
+  line-height              : 120%%;
+  font-size                : 1.6rem;
+  margin-top               : 6px;
+  margin-bottom            : 0px;
+  padding-left             : 0em;
+  text-indent              : 0em;
+  -khtml-user-select       : none;
+  -moz-user-select         : none;
+  -ms-user-select          : none;
+  -o-user-select           : none;
+  -webkit-user-select      : none;
+  user-select              : none;
+}
+/* flex */
+.flex-menu-bar {
+  display                  : -webkit-flex;
+  display                  : flex;
+  -webkit-flex-wrap        : wrap;
+  -webkit-align-items      : center;
+  align-items              : center;
+  width                    : 100%%;
+  margin-left              : 5%%;
+  margin-right             : 2%%;
+  background-color         : #000000;
+}
+.flex-menu-option {
+  background-color         : #000000;
+  margin-right             : 4px;
+}
+.flex-list {
+  display                  : -webkit-flex;
+  display                  : flex;
+  -webkit-align-items      : center;
+  display                  : block;
+  align-items              : center;
+  width                    : 100%%;
+  background-color         : #000000;
+}
+.flex-list-item {
+  background-color         : #000000;
+  margin                   : 4px;
+}
+/* grid */
+.wrapper {
+  display                  : grid;
+  grid-template-columns    : 100%%;
+  grid-template-areas      :
+    "headband"
+    "doc_header"
+    "doc_title"
+    "doc_toc"
+    "doc_prefix"
+    "doc_intro"
+    "doc_body"
+    "doc_endnotes"
+    "doc_glossary"
+    "doc_biblio"
+    "doc_bookindex"
+    "doc_blurb"
+    "doc_suffix";
+  margin                   : 0px;
+  padding                  : 0px;
+  background-color         : #000000;
+}
+.delimit {
+  border-style             : none;
+  border-color             : #000000;
+  padding                  : 10px;
+}
+.headband {
+  grid-area                : headband;
+  background-color         : #000000;
+}
+.doc_header {
+  grid-area                : doc_header;
+}
+.doc_title {
+  grid-area                : doc_title;
+}
+.doc_toc {
+  grid-area                : doc_toc;
+}
+.doc_prefix {
+  grid-area                : doc_prefix;
+}
+.doc_intro {
+  grid-area                : doc_intro;
+}
+.doc_body {
+  grid-area                : doc_body;
+}
+.doc_endnotes {
+  grid-area                : doc_endnotes;
+}
+.doc_glossary {
+  grid-area                : doc_glossary;
+}
+.doc_biblio {
+  grid-area                : doc_biblio;
+}
+.doc_bookindex {
+  grid-area                : doc_bookindex;
+}
+.doc_blurb {
+  grid-area                : doc_blurb;
+}
+.doc_suffix {
+  grid-area                : doc_suffix;
+}
+.nav-ul {
+  list-style               : none;
+  float                    : left;
+}
+.nav-li {
+  float                    : left;
+  padding-right            : 0.7em;
+}
+.nav-li a {
+  text-decoration          : none;
+  color                    : #000000;
+}
+footer {
+  background-color         : #FF704E;
+}
 ┃",
     _color_ocn_dark,
     _css_indent,
     _color_ocn_dark,
 );
     string _css_light_html_scroll = format(q"┃
-  *{
-    padding                  : 0px;
-    margin                   : 0px;
-  }
-  body {
-    height                   : 100vh;
-    background-color         : #FFFFFF;
-  }
-  body {
-    color                    : #000000;
-    background               : #FFFFFF;
-    background-color         : #FFFFFF;
-  }
-  a:link {
-    color                    : #003399;
-    text-decoration          : none;
-  }
-  a:visited {
-    color                    : #003399;
-    text-decoration          : none;
-  }
-  a:hover {
-    color                    : #000000;
-    background-color         : #F9F9AA;
-  }
-  a.lnkocn:link {
-    color                    : %s;
-    text-decoration          : none;
-  }
-  a.lnkocn:visited {
-    color                    : #32CD32;
-    text-decoration          : none;
-  }
-  a.lnkocn:hover {
-    color                    : #777777;
-    font-size                : 120%%;
-  }
-  a:hover img {
-    background-color         : #FFFFFF;
-  }
-  a:active {
-    color                    : #003399;
-    text-decoration          : underline;
-  }
-  input {
-    color                    : #000000;
-    background-color         : #FFFFFF;
-  }
-  div {
-    margin-left              : 0;
-    margin-right             : 0;
-  }
-  div.p {
-    margin-left              : 5%%;
-    margin-right             : 1%%;
-  }
-  div.substance {
-    width                    : 100%%;
-    background-color         : #FFFFFF;
-  }
-  div.ocn {
-    width                    : 5%%;
-    float                    : right;
-    top                      : 0;
-    background-color         : #FFFFFF;
-  }
-  div.endnote {
-    width                    : 95%%;
-    background-color         : #FFFFFF;
-  }
-  div.toc {
-    position                 : absolute;
-    float                    : left;
-    margin                   : 0;
-    padding                  : 0;
-    padding-top              : 0.5em;
-    border                   : 0;
-    width                    : 13em;
-    background-color         : #EEEEEE;
-    margin-right             : 1em;
-  }
-  div.summary {
-    margin                   : 0;
-    padding                  : 0;
-    border-left              : 13em solid #EEEEEE;
-    padding-left             : 1em;
-    background-color         : #EEEEEE;
-  }
-  div.content, div.main_column {
-    margin                   : 0;
-    padding                  : 0;
-    border-left              : 13em solid #FFFFFF;
-    padding-left             : 1em;
-    padding-right            : 1em;
-  }
-  div.content0, div.main_column0 {
-    margin                   : 0;
-    padding                  : 0;
-    border-left              : 0%% solid #FFFFFF;
-    padding-left             : 5%%;
-  }
-  div.scroll {
-    margin                   : 0;
-    padding                  : 0;
-    padding-left             : 1em;
-    padding-right            : 1em;
-  }
-  div.content:after {
-    content                  : ' ';
-    clear                    : both;
-    display                  : block;
-    height                   : 0;
-    overflow                 : hidden;
-  }
-  div.footer {
-    clear                    : left;
-    padding                  : 0.5em;
-    font-size                : 80%%;
-    margin                   : 0;
-  }
-  div.toc ul {
-    list-style               : none;
-    padding                  : 0;
-    margin                   : 0;
-  }
-  div.toc li ul a, li ul span.currentlink
-  {
-    font-weight              : normal;
-    font-size                : 90%%;
-    padding-left             : 2em;
-    background-color         : #EEEEEE;
-  }
-  div.toc a, span.currentlink{
-    display                  : block;
-    text-decoration          : none;
-    padding-left             : 0.5em;
-    color                    : #0000aa;
-  }
-  hr {
-    width                    : 90%%;
-    margin-left              : 5%%;
-    margin-right             : 2em;
-    margin-top               : 1.8em;
-    margin-bottom            : 1.8em;
-  }
-  span.currentlink {
-    text-decoration          : none;
-    background-color         : #AAAAAA;
-  }
-  div.toc a:visited {
-    color                    : #0000aa;
-  }
-  div.toc a:hover {
-    color                    : #000000;
-    background-color         : #F9F9AA;
-  }
-  nav#toc ol {
-    list-style-type          : none;
-  }
-  .norm, .bold, .verse, .group, .block, .alt {
-    line-height              : 133%%;
-    margin-top               : 12px;
-    margin-bottom            : 0px;
-    padding-left             : 0em;
-    text-indent              : 0em;
-  }
-  p, h0, h1, h2, h3, h4, h5, h6, h7, ul, li {
-    display                  : block;
-    font-family              : verdana, arial, georgia, tahoma, sans-serif, helvetica, times, roman;
-    margin-left              : 5%%;
-    margin-right             : 2em;
-  }
-  p {
-    font-size                : 100%%;
-    font-weight              : normal;
-    line-height              : 133%%;
-    text-align               : justify;
-    text-indent              : 0mm;
-    margin-top               : 0.8em;
-    margin-bottom            : 0.8em;
-  }
-  img {
-    max-width                : 100%%;
-    height                   : auto;
-  }
-  pre {
-    width                    : auto;
-    display                  : block;
-    clear                    : both;
-    color                    : #555555;
-  }
-  pre.codeline {
-    display                  : table;
-    clear                    : both;
-    table-layout             : fixed;
-    margin-left              : 5%%;
-    margin-right             : 5%%;
-    width                    : 90%%;
-    white-space              : pre-wrap;
-    border-style             : none;
-    border-radius            : 5px 5px 5px 5px;
-    box-shadow               : 0 2px 5px #AAAAAA inset;
-    margin-bottom            : 1em;
-    padding                  : 0.5em 1em;
-    page-break-inside        : avoid;
-    word-wrap                : break-word;
-    font-family              : inconsolata, "liberation mono", "bitstream vera mono", "dejavu mono", monaco, consolas, "andale mono", "courier new", "courier 10 pitch", courier, monospace;
-    white-space              : pre;
-    white-space              : pre-wrap;
-    white-space              : -moz-pre-wrap;
-    white-space              : -o-pre-wrap;
-    background-color         : #EEEEEE;
-    color                    : #000000;
-    font-size                : 95%%;
-    line-height              : 100%%;
-  }
-  pre.codeline::before {
-    counter-reset            : linenum;
-  }
-  pre.codeline span.tr {
-    display                  : table-row;
-    counter-increment        : linenum;
-  }
-  pre.codeline span.th {
-    display                  : table-cell;
-    user-select              : none;
-    -moz-user-select         : none;
-    -webkit-user-select      : none;
-    padding                  : 0.5em 0.5em;
-    /* background-color         : #666666; */
-  }
-  pre.codeline span.th::before {
-    content                  : counter(linenum) ".";
-    color                    : #999999;
-    text-align               : right;
-    display                  : block;
-  }
-  pre.codeline span.th {
-    width                    : 4em;
-  }
-  pre.codeline code {
-    display                  : table-cell;
-  }
-  p.code {
-    border-style             : none;
-  }
-  p.spaced { white-space     : pre; }
-  p.block {
-    white-space              : pre;
-  }
-  p.group { }
-  p.alt { }
-  p.verse {
-    white-space              : pre;
-    margin-bottom            : 6px;
-  }
-  p.caption {
-    text-align               : left;
-    font-size                : 80%%;
-    display                  : inline;
-  }
-  p.endnote {
-    font-size                : 96%%;
-    line-height              : 120%%;
-    text-align               : left;
-    margin-right             : 15mm;
-    padding-left             : 1em;
-    text-indent              : -1em;
-  }
-  p.center {
-    text-align               : center;
-  }
-  p.bold {
-    font-weight              : bold;
-  }
-  p.bold_left {
-    font-weight              : bold;
-    text-align               : left;
-  }
-  p.centerbold {
-    text-align               : center;
-    font-weight              : bold;
-  }
-  p.em {
-    font-weight              : bold;
-    font-style               : normal;
-    background               : #FFF3B6;
-  }
-  p.small {
-    font-size                : 80%%;
-    margin-top               : 0px;
-    margin-bottom            : 0px;
-    margin-right             : 6px;
-    text-align               : left;
-  }
-  .tiny, .tiny_left, .tiny_right, .tiny_center {
-    font-size                : 75%%;
-    margin-top               : 0px;
-    margin-bottom            : 0px;
-    color                    : #777777;
-    margin-right             : 6px;
-    text-align               : left;
-  }
-  p.tiny { }
-  p.tiny_left {
-    margin-left              : 0px;
-    margin-right             : 0px;
-    text-align               : left;
-  }
-  p.tiny_right {
-    margin-right             : 1em;
-    text-align               : right;
-  }
-  p.tiny_center {
-    margin-left              : 0px;
-    margin-right             : 0px;
-    text-align               : center;
-  }
-  p.concordance_word {
-    line-height              : 150%%;
-    font-weight              : bold;
-    display                  : inline;
-    margin-top               : 4px;
-    margin-bottom            : 1px;
-  }
-  p.concordance_count {
-    font-size                : 80%%;
-    color                    : #777777;
-    display                  : inline;
-    margin-left              : 0em;
-  }
-  p.concordance_object {
-    font-size                : 80%%;
-    line-height              : 120%%;
-    text-align               : left;
-    margin-left              : 3em;
-    margin-top               : 1px;
-    margin-bottom            : 3px;
-  }
-  p.book_index_lev1 {
-    line-height              : 100%%;
-    margin-top               : 4px;
-    margin-bottom            : 1px;
-  }
-  p.book_index_lev2 {
-    line-height              : 100%%;
-    text-align               : left;
-    margin-left              : 3em;
-    margin-top               : 1px;
-    margin-bottom            : 3px;
-  }
-  tt {
-    font-family              : inconsolata, "liberation mono", "bitstream vera mono", "dejavu mono", monaco, consolas, "andale mono", "courier new", "courier 10 pitch", courier, monospace;
-    background-color         : #EEEEEE;
-    color                    : #000000;
-  }
+html {
+  font-size                : 62.5%%;
+}
+*{
+  padding                  : 0px;
+  margin                   : 0px;
+}
+body {
+  height                   : 100vh;
+  font-size                : 1.6rem;
+  background-color         : #FFFFFF;
+  color                    : #000000;
+  background               : #FFFFFF;
+  background-color         : #FFFFFF;
+}
+a:link {
+  color                    : #003399;
+  text-decoration          : none;
+}
+a:visited {
+  color                    : #003399;
+  text-decoration          : none;
+}
+a:hover {
+  color                    : #000000;
+  background-color         : #F9F9AA;
+}
+a.lnkocn:link {
+  color                    : %s;
+  text-decoration          : none;
+}
+a.lnkocn:visited {
+  color                    : #32CD32;
+  text-decoration          : none;
+}
+a.lnkocn:hover {
+  color                    : #777777;
+  font-size                : 1.8rem;
+}
+a:hover img {
+  background-color         : #FFFFFF;
+}
+a:active {
+  color                    : #003399;
+  text-decoration          : underline;
+}
+input {
+  color                    : #000000;
+  background-color         : #FFFFFF;
+}
+div {
+  margin-left              : 0;
+  margin-right             : 0;
+}
+div.p {
+  margin-left              : 5%%;
+  margin-right             : 1%%;
+}
+div.substance {
+  width                    : 100%%;
+  background-color         : #FFFFFF;
+}
+div.ocn {
+  width                    : 5%%;
+  float                    : right;
+  top                      : 0;
+  background-color         : #FFFFFF;
+}
+div.endnote {
+  width                    : 95%%;
+  background-color         : #FFFFFF;
+}
+div.toc {
+  position                 : absolute;
+  float                    : left;
+  margin                   : 0;
+  padding                  : 0;
+  padding-top              : 0.5em;
+  border                   : 0;
+  width                    : 13em;
+  background-color         : #EEEEEE;
+  margin-right             : 1em;
+}
+div.summary {
+  margin                   : 0;
+  padding                  : 0;
+  border-left              : 13em solid #EEEEEE;
+  padding-left             : 1em;
+  background-color         : #EEEEEE;
+}
+div.content, div.main_column {
+  margin                   : 0;
+  padding                  : 0;
+  border-left              : 13em solid #FFFFFF;
+  padding-left             : 1em;
+  padding-right            : 1em;
+}
+div.content0, div.main_column0 {
+  margin                   : 0;
+  padding                  : 0;
+  border-left              : 0%% solid #FFFFFF;
+  padding-left             : 5%%;
+}
+div.scroll {
+  margin                   : 0;
+  padding                  : 0;
+  padding-left             : 1em;
+  padding-right            : 1em;
+}
+div.content:after {
+  content                  : ' ';
+  clear                    : both;
+  display                  : block;
+  height                   : 0;
+  overflow                 : hidden;
+}
+div.footer {
+  clear                    : left;
+  padding                  : 0.5em;
+  font-size                : 1.4rem;
+  margin                   : 0;
+}
+div.toc ul {
+  list-style               : none;
+  padding                  : 0;
+  margin                   : 0;
+}
+div.toc li ul a, li ul span.currentlink
+{
+  font-weight              : normal;
+  font-size                : 1.5rem;
+  padding-left             : 2em;
+  background-color         : #EEEEEE;
+}
+div.toc a, span.currentlink{
+  display                  : block;
+  text-decoration          : none;
+  padding-left             : 0.5em;
+  color                    : #0000aa;
+}
+hr {
+  width                    : 90%%;
+  margin-left              : 5%%;
+  margin-right             : 2em;
+  margin-top               : 1.8em;
+  margin-bottom            : 1.8em;
+}
+span.currentlink {
+  text-decoration          : none;
+  background-color         : #AAAAAA;
+}
+div.toc a:visited {
+  color                    : #0000aa;
+}
+div.toc a:hover {
+  color                    : #000000;
+  background-color         : #F9F9AA;
+}
+nav#toc ol {
+  list-style-type          : none;
+}
+.norm, .bold, .verse, .group, .block, .alt {
+  line-height              : 133%%;
+  margin-top               : 12px;
+  margin-bottom            : 0px;
+  padding-left             : 0em;
+  text-indent              : 0em;
+}
+p, h0, h1, h2, h3, h4, h5, h6, h7, ul, li {
+  display                  : block;
+  font-family              : verdana, arial, georgia, tahoma, sans-serif, helvetica, times, roman;
+  margin-left              : 5%%;
+  margin-right             : 2em;
+}
+p {
+  font-size                : 1.6rem;
+  font-weight              : normal;
+  line-height              : 133%%;
+  text-align               : justify;
+  text-indent              : 0mm;
+  margin-top               : 0.8em;
+  margin-bottom            : 0.8em;
+}
+img {
+  max-width                : 100%%;
+  height                   : auto;
+}
+pre {
+  width                    : auto;
+  display                  : block;
+  clear                    : both;
+  color                    : #555555;
+}
+pre.codeline {
+  display                  : table;
+  clear                    : both;
+  table-layout             : fixed;
+  margin-left              : 5%%;
+  margin-right             : 5%%;
+  width                    : 90%%;
+  white-space              : pre-wrap;
+  border-style             : none;
+  border-radius            : 5px 5px 5px 5px;
+  box-shadow               : 0 2px 5px #AAAAAA inset;
+  margin-bottom            : 1em;
+  padding                  : 0.5em 1em;
+  page-break-inside        : avoid;
+  word-wrap                : break-word;
+  font-family              : inconsolata, "liberation mono", "bitstream vera mono", "dejavu mono", monaco, consolas, "andale mono", "courier new", "courier 10 pitch", courier, monospace;
+  white-space              : pre;
+  white-space              : pre-wrap;
+  white-space              : -moz-pre-wrap;
+  white-space              : -o-pre-wrap;
+  background-color         : #EEEEEE;
+  color                    : #000000;
+  font-size                : 1.5rem;
+  line-height              : 100%%;
+}
+pre.codeline::before {
+  counter-reset            : linenum;
+}
+pre.codeline span.tr {
+  display                  : table-row;
+  counter-increment        : linenum;
+}
+pre.codeline span.th {
+  display                  : table-cell;
+  user-select              : none;
+  -moz-user-select         : none;
+  -webkit-user-select      : none;
+  padding                  : 0.5em 0.5em;
+  /* background-color         : #666666; */
+}
+pre.codeline span.th::before {
+  content                  : counter(linenum) ".";
+  color                    : #999999;
+  text-align               : right;
+  display                  : block;
+}
+pre.codeline span.th {
+  width                    : 4em;
+}
+pre.codeline code {
+  display                  : table-cell;
+}
+p.code {
+  border-style             : none;
+}
+p.spaced { white-space     : pre; }
+p.block {
+  white-space              : pre;
+}
+p.group { }
+p.alt { }
+p.verse {
+  white-space              : pre;
+  margin-bottom            : 6px;
+}
+p.caption {
+  text-align               : left;
+  font-size                : 1.4rem;
+  display                  : inline;
+}
+p.endnote {
+  font-size                : 1.55rem;
+  line-height              : 120%%;
+  text-align               : left;
+  margin-right             : 15mm;
+  padding-left             : 1em;
+  text-indent              : -1em;
+}
+p.center {
+  text-align               : center;
+}
+p.bold {
+  font-weight              : bold;
+}
+p.bold_left {
+  font-weight              : bold;
+  text-align               : left;
+}
+p.centerbold {
+  text-align               : center;
+  font-weight              : bold;
+}
+p.em {
+  font-weight              : bold;
+  font-style               : normal;
+  background               : #FFF3B6;
+}
+p.small {
+  font-size                : 1.4rem;
+  margin-top               : 0px;
+  margin-bottom            : 0px;
+  margin-right             : 6px;
+  text-align               : left;
+}
+.tiny, .tiny_left, .tiny_right, .tiny_center {
+  font-size                : 1.2rem;
+  margin-top               : 0px;
+  margin-bottom            : 0px;
+  color                    : #777777;
+  margin-right             : 6px;
+  text-align               : left;
+}
+p.tiny { }
+p.tiny_left {
+  margin-left              : 0px;
+  margin-right             : 0px;
+  text-align               : left;
+}
+p.tiny_right {
+  margin-right             : 1em;
+  text-align               : right;
+}
+p.tiny_center {
+  margin-left              : 0px;
+  margin-right             : 0px;
+  text-align               : center;
+}
+p.concordance_word {
+  line-height              : 150%%;
+  font-weight              : bold;
+  display                  : inline;
+  margin-top               : 4px;
+  margin-bottom            : 1px;
+}
+p.concordance_count {
+  font-size                : 1.4rem;
+  color                    : #777777;
+  display                  : inline;
+  margin-left              : 0em;
+}
+p.concordance_object {
+  font-size                : 1.4rem;
+  line-height              : 120%%;
+  text-align               : left;
+  margin-left              : 3em;
+  margin-top               : 1px;
+  margin-bottom            : 3px;
+}
+p.book_index_lev1 {
+  line-height              : 100%%;
+  margin-top               : 4px;
+  margin-bottom            : 1px;
+}
+p.book_index_lev2 {
+  line-height              : 100%%;
+  text-align               : left;
+  margin-left              : 3em;
+  margin-top               : 1px;
+  margin-bottom            : 3px;
+}
+tt {
+  font-family              : inconsolata, "liberation mono", "bitstream vera mono", "dejavu mono", monaco, consolas, "andale mono", "courier new", "courier 10 pitch", courier, monospace;
+  background-color         : #EEEEEE;
+  color                    : #000000;
+}
 %s
-  note { white-space         : pre; }
-  label.ocn {
-    width                    : 2%%;
-    float                    : right;
-    top                      : 0;
-    font-size                : 80%%;
-    margin-top               : 0px;
-    margin-bottom            : 6px;
-    margin-right             : 6px;
-    text-align               : right;
-    color                    : %s;
-    -khtml-user-select       : none;
-    -moz-user-select         : none;
-    -ms-user-select          : none;
-    -o-user-select           : none;
-    -webkit-user-select      : none;
-    user-select              : none;
-  }
-  table {
-    display                  : block;
-    margin-left              : 5%%;
-    margin-right             : 2em;
-    background-color         : inherit;
-  }
-  tr { }
-  th,td {
-    vertical-align           : top;
-    text-align               : left;
-  }
-  th {
-    font-weight              : bold;
-  }
-  em {
-    font-weight              : bold;
-    font-style               : italic;
-  }
-  p.left,th.left,td.left {
-    text-align               : left;
-  }
-  p.small_left,th.small_left,td.small_left {
-    text-align               : left;
-    font-size                : 80%%;
-  }
-  p.right,th.right,td.right {
-    text-align               : right;
-  }
-  ul, li {
-    list-style-type          : none;
-    list-style               : none;
-    padding-left             : 20px;
-    font-weight              : normal;
-    line-height              : 150%%;
-    text-align               : left;
-    text-indent              : 0mm;
-    margin-left              : 1em;
-    margin-right             : 2em;
-    margin-top               : 3px;
-    margin-bottom            : 3px;
-  }
-  li {
-    background               : url(../image_sys/bullet_09.png) no-repeat 0px 6px;
-  }
-  ul { }
-  h0, h1, h2, h3, h4, h5, h6, h7 {
-    font-weight              : bold;
-    line-height              : 120%%;
-    text-align               : left;
-    margin-top               : 20px;
-    margin-bottom            : 10px;
-  }
-  h4.norm, h5.norm, h6.norm, h7.norm {
-    margin-top               : 10px;
-    margin-bottom            : 0px;
-  }
-  h0 { font-size             : 125%%; }
-  h1 { font-size             : 120%%; }
-  h2 { font-size             : 115%%; }
-  h3 { font-size             : 110%%; }
-  h4 { font-size             : 105%%; }
-  h5 { font-size             : 100%%; }
-  h6 { font-size             : 100%%; }
-  h7 { font-size             : 100%%; }
-  h0, h1, h2, h3, h4, h5, h6, h7 {
-    text-shadow              : .2em .2em .3em #808080;
-  }
-  h1.i { margin-left         : 2em; }
-  h2.i { margin-left         : 3em; }
-  h3.i { margin-left         : 4em; }
-  h4.i { margin-left         : 5em; }
-  h5.i { margin-left         : 6em; }
-  h6.i { margin-left         : 7em; }
-  h7.i { margin-left         : 8em; }
-  h8.i { margin-left         : 9em; }
-  h9.i { margin-left         : 10em; }
-  .toc {
-    font-weight              : normal;
-    margin-top               : 6px;
-    margin-bottom            : 6px;
-  }
-  h0.toc {
-    margin-left              : 1em;
-    font-size                : 120%%;
-    line-height              : 150%%;
-  }
-  h1.toc {
-    margin-left              : 1em;
-    font-size                : 115%%;
-    line-height              : 150%%;
-  }
-  h2.toc {
-    margin-left              : 2em;
-    font-size                : 110%%;
-    line-height              : 140%%;
-  }
-  h3.toc {
-    margin-left              : 3em;
-    font-size                : 105%%;
-    line-height              : 120%%;
-  }
-  h4.toc {
-    margin-left              : 4em;
-    font-size                : 100%%;
-    line-height              : 120%%;
-  }
-  h5.toc {
-    margin-left              : 5em;
-    font-size                : 95%%;
-    line-height              : 110%%;
-  }
-  h6.toc {
-    margin-left              : 6em;
-    font-size                : 90%%;
-    line-height              : 110%%;
-  }
-  h7.toc {
-    margin-left              : 7em;
-    font-size                : 85%%;
-    line-height              : 100%%;
-  }
-  .subtoc {
-    margin-right             : 34%%;
-    font-weight              : normal;
-  }
-  h5.subtoc {
-    margin-left              : 2em;
-    font-size                : 80%%;
-    margin-top               : 2px;
-    margin-bottom            : 2px;
-  }
-  h6.subtoc {
-    margin-left              : 3em;
-    font-size                : 75%%;
-    margin-top               : 0px;
-    margin-bottom            : 0px;
-  }
-  h7.subtoc {
-    margin-left              : 4em;
-    font-size                : 70%%;
-    margin-top               : 0px;
-    margin-bottom            : 0px;
-  }
+note { white-space         : pre; }
+label.ocn {
+  width                    : 2%%;
+  float                    : right;
+  top                      : 0;
+  font-size                : 1.4rem;
+  margin-top               : 0px;
+  margin-bottom            : 6px;
+  margin-right             : 6px;
+  text-align               : right;
+  color                    : %s;
+  -khtml-user-select       : none;
+  -moz-user-select         : none;
+  -ms-user-select          : none;
+  -o-user-select           : none;
+  -webkit-user-select      : none;
+  user-select              : none;
+}
+table {
+  display                  : block;
+  margin-left              : 5%%;
+  margin-right             : 2em;
+  background-color         : inherit;
+}
+tr { }
+th,td {
+  vertical-align           : top;
+  text-align               : left;
+}
+th {
+  font-weight              : bold;
+}
+em {
+  font-weight              : bold;
+  font-style               : italic;
+}
+p.left,th.left,td.left {
+  text-align               : left;
+}
+p.small_left,th.small_left,td.small_left {
+  text-align               : left;
+  font-size                : 1.4rem;
+}
+p.right,th.right,td.right {
+  text-align               : right;
+}
+ul, li {
+  list-style-type          : none;
+  list-style               : none;
+  padding-left             : 20px;
+  font-weight              : normal;
+  line-height              : 150%%;
+  text-align               : left;
+  text-indent              : 0mm;
+  margin-left              : 1em;
+  margin-right             : 2em;
+  margin-top               : 3px;
+  margin-bottom            : 3px;
+}
+li {
+  background               : url(../image_sys/bullet_09.png) no-repeat 0px 6px;
+}
+ul { }
+h0, h1, h2, h3, h4, h5, h6, h7 {
+  font-weight              : bold;
+  line-height              : 120%%;
+  text-align               : left;
+  margin-top               : 20px;
+  margin-bottom            : 10px;
+}
+h4.norm, h5.norm, h6.norm, h7.norm {
+  margin-top               : 10px;
+  margin-bottom            : 0px;
+}
+h0 { font-size             : 1.85rem; }
+h1 { font-size             : 1.8rem; }
+h2 { font-size             : 1.75rem; }
+h3 { font-size             : 1.7rem; }
+h4 { font-size             : 1.65rem; }
+h5 { font-size             : 1.6rem; }
+h6 { font-size             : 1.55rem; }
+h7 { font-size             : 1.5rem; }
+h0, h1, h2, h3, h4, h5, h6, h7 {
+  text-shadow              : .2em .2em .3em #808080;
+}
+h1.i { margin-left         : 2em; }
+h2.i { margin-left         : 3em; }
+h3.i { margin-left         : 4em; }
+h4.i { margin-left         : 5em; }
+h5.i { margin-left         : 6em; }
+h6.i { margin-left         : 7em; }
+h7.i { margin-left         : 8em; }
+h8.i { margin-left         : 9em; }
+h9.i { margin-left         : 10em; }
+.toc {
+  font-weight              : normal;
+  margin-top               : 6px;
+  margin-bottom            : 6px;
+}
+h0.toc {
+  margin-left              : 1em;
+  font-size                : 1.85rem;
+  line-height              : 150%%;
+}
+h1.toc {
+  margin-left              : 1em;
+  font-size                : 1.8rem;
+  line-height              : 150%%;
+}
+h2.toc {
+  margin-left              : 2em;
+  font-size                : 1.75rem;
+  line-height              : 140%%;
+}
+h3.toc {
+  margin-left              : 3em;
+  font-size                : 1.7rem;
+  line-height              : 120%%;
+}
+h4.toc {
+  margin-left              : 4em;
+  font-size                : 1.65rem;
+  line-height              : 120%%;
+}
+h5.toc {
+  margin-left              : 5em;
+  font-size                : 1.6rem;
+  line-height              : 110%%;
+}
+h6.toc {
+  margin-left              : 6em;
+  font-size                : 1.55rem;
+  line-height              : 110%%;
+}
+h7.toc {
+  margin-left              : 7em;
+  font-size                : 1.5rem;
+  line-height              : 100%%;
+}
+.subtoc {
+  margin-right             : 34%%;
+  font-weight              : normal;
+}
+h5.subtoc {
+  margin-left              : 2em;
+  font-size                : 1.45rem;
+  margin-top               : 2px;
+  margin-bottom            : 2px;
+}
+h6.subtoc {
+  margin-left              : 3em;
+  font-size                : 1.4rem;
+  margin-top               : 0px;
+  margin-bottom            : 0px;
+}
+h7.subtoc {
+  margin-left              : 4em;
+  font-size                : 1.35rem;
+  margin-top               : 0px;
+  margin-bottom            : 0px;
+}
 input, select, textarea {
-  font-size                : 150%%;
+  font-size                : 2.2rem;
 }
 input[type="text"] {
-  font-size:120%%;
+  font-size                : 1.8rem;
   line-height              : 120%%;
 }
 button[type="submit"] {
-  font-size                : 120%%;
+  font-size                : 1.8rem;
   line-height              : 120%%;
 }
 p.form {
-  font-size                : 150%%;
+  font-size                : 2.2rem;
   line-height              : 150%%;
 }
-  /* flex */
-  .flex-menu-bar {
-    display                  : -webkit-flex;
-    display                  : flex;
-    -webkit-flex-wrap        : wrap;
-    -webkit-align-items      : center;
-    align-items              : center;
-    width                    : 100%%;
-    margin-left              : 5%%;
-    margin-right             : 2%%;
-    background-color         : #FFFFFF;
-  }
-  .flex-menu-option {
-    background-color         : #FFFFFF;
-    margin-right             : 4px;
-  }
-  .flex-list {
-    display                  : -webkit-flex;
-    display                  : flex;
-    -webkit-align-items      : center;
-    display                  : block;
-    align-items              : center;
-    width                    : 100%%;
-    background-color         : #FFFFFF;
-  }
-  .flex-list-item {
-    background-color         : #FFFFFF;
-    margin                   : 4px;
-  }
-  /* grid */
-  .wrapper {
-    display                  : grid;
-    grid-template-columns    : 100%%;
-    grid-template-areas      :
-      "headband"
-      "doc_header"
-      "doc_title"
-      "doc_toc"
-      "doc_prefix"
-      "doc_intro"
-      "doc_body"
-      "doc_endnotes"
-      "doc_glossary"
-      "doc_biblio"
-      "doc_bookindex"
-      "doc_blurb"
-      "doc_suffix";
-    margin                   : 0px;
-    padding                  : 0px;
-    background-color         : #FFFFFF;
-  }
-  .delimit {
-    border-style             : none;
-    border-color             : #FFFFFF;
-    padding                  : 10px;
-  }
-  .headband {
-    grid-area                : headband;
-    background-color         : #FFFFFF;
-  }
-  .doc_header {
-    grid-area                : doc_header;
-  }
-  .doc_title {
-    grid-area                : doc_title;
-  }
-  .doc_toc {
-    grid-area                : doc_toc;
-  }
-  .doc_prefix {
-    grid-area                : doc_prefix;
-  }
-  .doc_intro {
-    grid-area                : doc_intro;
-  }
-  .doc_body {
-    grid-area                : doc_body;
-  }
-  .doc_endnotes {
-    grid-area                : doc_endnotes;
-  }
-  .doc_glossary {
-    grid-area                : doc_glossary;
-  }
-  .doc_biblio {
-    grid-area                : doc_biblio;
-  }
-  .doc_bookindex {
-    grid-area                : doc_bookindex;
-  }
-  .doc_blurb {
-    grid-area                : doc_blurb;
-  }
-  .doc_suffix {
-    grid-area                : doc_suffix;
-  }
-  .nav-ul {
-    list-style               : none;
-    float                    : left;
-  }
-  .nav-li {
-    float                    : left;
-    padding-right            : 0.7em;
-  }
-  .nav-li a {
-    text-decoration          : none;
-    color                    : #FFFFFF;
-  }
-  footer {
-    background-color         : #00704E;
-  }
+/* flex */
+.flex-menu-bar {
+  display                  : -webkit-flex;
+  display                  : flex;
+  -webkit-flex-wrap        : wrap;
+  -webkit-align-items      : center;
+  align-items              : center;
+  width                    : 100%%;
+  margin-left              : 5%%;
+  margin-right             : 2%%;
+  background-color         : #FFFFFF;
+}
+.flex-menu-option {
+  background-color         : #FFFFFF;
+  margin-right             : 4px;
+}
+.flex-list {
+  display                  : -webkit-flex;
+  display                  : flex;
+  -webkit-align-items      : center;
+  display                  : block;
+  align-items              : center;
+  width                    : 100%%;
+  background-color         : #FFFFFF;
+}
+.flex-list-item {
+  background-color         : #FFFFFF;
+  margin                   : 4px;
+}
+/* grid */
+.wrapper {
+  display                  : grid;
+  grid-template-columns    : 100%%;
+  grid-template-areas      :
+    "headband"
+    "doc_header"
+    "doc_title"
+    "doc_toc"
+    "doc_prefix"
+    "doc_intro"
+    "doc_body"
+    "doc_endnotes"
+    "doc_glossary"
+    "doc_biblio"
+    "doc_bookindex"
+    "doc_blurb"
+    "doc_suffix";
+  margin                   : 0px;
+  padding                  : 0px;
+  background-color         : #FFFFFF;
+}
+.delimit {
+  border-style             : none;
+  border-color             : #FFFFFF;
+  padding                  : 10px;
+}
+.headband {
+  grid-area                : headband;
+  background-color         : #FFFFFF;
+}
+.doc_header {
+  grid-area                : doc_header;
+}
+.doc_title {
+  grid-area                : doc_title;
+}
+.doc_toc {
+  grid-area                : doc_toc;
+}
+.doc_prefix {
+  grid-area                : doc_prefix;
+}
+.doc_intro {
+  grid-area                : doc_intro;
+}
+.doc_body {
+  grid-area                : doc_body;
+}
+.doc_endnotes {
+  grid-area                : doc_endnotes;
+}
+.doc_glossary {
+  grid-area                : doc_glossary;
+}
+.doc_biblio {
+  grid-area                : doc_biblio;
+}
+.doc_bookindex {
+  grid-area                : doc_bookindex;
+}
+.doc_blurb {
+  grid-area                : doc_blurb;
+}
+.doc_suffix {
+  grid-area                : doc_suffix;
+}
+.nav-ul {
+  list-style               : none;
+  float                    : left;
+}
+.nav-li {
+  float                    : left;
+  padding-right            : 0.7em;
+}
+.nav-li a {
+  text-decoration          : none;
+  color                    : #FFFFFF;
+}
+footer {
+  background-color         : #00704E;
+}
 ┃",
     _color_ocn_light,
     _css_indent,
     _color_ocn_light,
 );
     string _css_dark_html_scroll = format(q"┃
-  *{
-    padding                  : 0px;
-    margin                   : 0px;
-  }
-  body {
-    height                   : 100vh;
-    background-color         : #000000;
-  }
-  body {
-    color                    : #CCCCCC;
-    background               : #000000;
-    background-color         : #000000;
-  }
-  a:link {
-    color                    : #FFFFFF;
-    text-decoration          : none;
-  }
-  a:visited {
-    color                    : #999999;
-    text-decoration          : none;
-  }
-  a:hover {
-    color                    : #000000;
-    background-color         : #555555;
-  }
-  a.lnkocn:link {
-    color                    : %s;
-    text-decoration          : none;
-  }
-  a.lnkocn:visited {
-    color                    : #9ACD32;
-    text-decoration          : none;
-  }
-  a.lnkocn:hover {
-    color                    : #BBBBBB;
-    font-size                : 120%%;
-  }
-  a:hover img {
-    background-color         : #000000;
-  }
-  a:active {
-    color                    : #888888;
-    text-decoration          : underline;
-  }
-  input {
-    color                    : #FFFFFF;
-    background-color         : #777777;
-  }
-  div {
-    margin-left              : 0;
-    margin-right             : 0;
-  }
-  div.p {
-    margin-left              : 5%%;
-    margin-right             : 1%%;
-  }
-  div.substance {
-    width                    : 100%%;
-    background-color         : #000000;
-  }
-  div.ocn {
-    width                    : 5%%;
-    float                    : right;
-    top                      : 0;
-    background-color         : #000000;
-  }
-  div.endnote {
-    width                    : 95%%;
-    background-color         : #000000;
-  }
-  div.toc {
-    position                 : absolute;
-    float                    : left;
-    margin                   : 0;
-    padding                  : 0;
-    padding-top              : 0.5em;
-    border                   : 0;
-    width                    : 13em;
-    background-color         : #111111;
-    margin-right             : 1em;
-  }
-  div.summary {
-    margin                   : 0;
-    padding                  : 0;
-    border-left              : 13em solid #111111;
-    padding-left             : 1em;
-    background-color         : #111111;
-  }
-  div.content, div.main_column {
-    margin                   : 0;
-    padding                  : 0;
-    border-left              : 13em solid #000000;
-    padding-left             : 1em;
-    padding-right            : 1em;
-  }
-  div.content0, div.main_column0 {
-    margin                   : 0;
-    padding                  : 0;
-    border-left              : 0%% solid #000000;
-    padding-left             : 5%%;
-  }
-  div.scroll {
-    margin                   : 0;
-    padding                  : 0;
-    padding-left             : 1em;
-    padding-right            : 1em;
-  }
-  div.content:after {
-    content                  : ' ';
-    clear                    : both;
-    display                  : block;
-    height                   : 0;
-    overflow                 : hidden;
-  }
-  div.footer {
-    clear                    : left;
-    padding                  : 0.5em;
-    font-size                : 80%%;
-    margin                   : 0;
-  }
-  div.toc ul {
-    list-style               : none;
-    padding                  : 0;
-    margin                   : 0;
-  }
-  div.toc li ul a, li ul span.currentlink
-  {
-    font-weight              : normal;
-    font-size                : 90%%;
-    padding-left             : 2em;
-    background-color         : #111111;
-  }
-  div.toc a, span.currentlink{
-    display                  : block;
-    text-decoration          : none;
-    padding-left             : 0.5em;
-    color                    : #FF00AA;
-  }
-  hr {
-    width                    : 90%%;
-    margin-left              : 5%%;
-    margin-right             : 2em;
-    margin-top               : 1.8em;
-    margin-bottom            : 1.8em;
-  }
-  span.currentlink {
-    text-decoration          : none;
-    background-color         : #AAAAF9;
-  }
-  div.toc a:visited {
-    color                    : #FF00AA;
-  }
-  div.toc a:hover {
-    color                    : #CCCCCC;
-    background-color         : #F9F9AA;
-  }
-  nav#toc ol {
-    list-style-type          : none;
-  }
-  .norm, .bold, .verse, .group, .block, .alt {
-    line-height              : 133%%;
-    margin-top               : 12px;
-    margin-bottom            : 0px;
-    padding-left             : 0em;
-    text-indent              : 0em;
-  }
-  p, h0, h1, h2, h3, h4, h5, h6, h7, ul, li {
-    display                  : block;
-    font-family              : verdana, arial, georgia, tahoma, sans-serif, helvetica, times, roman;
-    margin-left              : 5%%;
-    margin-right             : 2em;
-  }
-  p {
-    font-size                : 100%%;
-    font-weight              : normal;
-    line-height              : 133%%;
-    text-align               : justify;
-    text-indent              : 0mm;
-    margin-top               : 0.8em;
-    margin-bottom            : 0.8em;
-  }
-  img {
-    max-width                : 100%%;
-    height                   : auto;
-  }
-  pre {
-    width                    : auto;
-    display                  : block;
-    clear                    : both;
-    color                    : #555555;
-  }
-  pre.codeline {
-    display                  : table;
-    clear                    : both;
-    table-layout             : fixed;
-    margin-left              : 5%%;
-    margin-right             : 5%%;
-    width                    : 90%%;
-    white-space              : pre-wrap;
-    border-style             : none;
-    border-radius            : 5px 5px 5px 5px;
-    box-shadow               : 0 2px 5px #AAAAAA inset;
-    margin-bottom            : 1em;
-    padding                  : 0.5em 1em;
-    page-break-inside        : avoid;
-    word-wrap                : break-word;
-    font-family              : inconsolata, "liberation mono", "bitstream vera mono", "dejavu mono", monaco, consolas, "andale mono", "courier new", "courier 10 pitch", courier, monospace;
-    white-space              : pre;
-    white-space              : pre-wrap;
-    white-space              : -moz-pre-wrap;
-    white-space              : -o-pre-wrap;
-    background-color         : #555555;
-    color                    : #DDDDDD;
-    font-size                : 95%%;
-    line-height              : 100%%;
-  }
-  pre.codeline::before {
-    counter-reset            : linenum;
-  }
-  pre.codeline span.tr {
-    display                  : table-row;
-    counter-increment        : linenum;
-  }
-  pre.codeline span.th {
-    display                  : table-cell;
-    user-select              : none;
-    -moz-user-select         : none;
-    -webkit-user-select      : none;
-    padding                  : 0.5em 0.5em;
-  }
-  pre.codeline span.th::before {
-    content                  : counter(linenum) ".";
-    color                    : #999999;
-    text-align               : right;
-    display                  : block;
-  }
-  pre.codeline span.th {
-    width                    : 4em;
-  }
-  pre.codeline code {
-    display                  : table-cell;
-  }
-  p.code {
-    border-style             : none;
-  }
-  p.spaced { white-space     : pre; }
-  p.block {
-    white-space              : pre;
-  }
-  p.group { }
-  p.alt { }
-  p.verse {
-    white-space              : pre;
-    margin-bottom            : 6px;
-  }
-  p.caption {
-    text-align               : left;
-    font-size                : 80%%;
-    display                  : inline;
-  }
-  p.endnote {
-    font-size                : 96%%;
-    line-height              : 120%%;
-    text-align               : left;
-    margin-right             : 15mm;
-    padding-left             : 1em;
-    text-indent              : -1em;
-  }
-  p.center {
-    text-align               : center;
-  }
-  p.bold {
-    font-weight              : bold;
-  }
-  p.bold_left {
-    font-weight              : bold;
-    text-align               : left;
-  }
-  p.centerbold {
-    text-align               : center;
-    font-weight              : bold;
-  }
-  p.em {
-    font-weight              : bold;
-    font-style               : normal;
-    background               : #FFF3B6;
-  }
-  p.small {
-    font-size                : 80%%;
-    margin-top               : 0px;
-    margin-bottom            : 0px;
-    margin-right             : 6px;
-    text-align               : left;
-  }
-  .tiny, .tiny_left, .tiny_right, .tiny_center {
-    font-size                : 75%%;
-    margin-top               : 0px;
-    margin-bottom            : 0px;
-    color                    : #EEEEEE;
-    margin-right             : 6px;
-    text-align               : left;
-  }
-  p.tiny { }
-  p.tiny_left {
-    margin-left              : 0px;
-    margin-right             : 0px;
-    text-align               : left;
-  }
-  p.tiny_right {
-    margin-right             : 1em;
-    text-align               : right;
-  }
-  p.tiny_center {
-    margin-left              : 0px;
-    margin-right             : 0px;
-    text-align               : center;
-  }
-  p.concordance_word {
-    line-height              : 150%%;
-    font-weight              : bold;
-    display                  : inline;
-    margin-top               : 4px;
-    margin-bottom            : 1px;
-  }
-  p.concordance_count {
-    font-size                : 80%%;
-    color                    : #555555;
-    display                  : inline;
-    margin-left              : 0em;
-  }
-  p.concordance_object {
-    font-size                : 80%%;
-    line-height              : 120%%;
-    text-align               : left;
-    margin-left              : 3em;
-    margin-top               : 1px;
-    margin-bottom            : 3px;
-  }
-  p.book_index_lev1 {
-    line-height              : 100%%;
-    margin-top               : 4px;
-    margin-bottom            : 1px;
-  }
-  p.book_index_lev2 {
-    line-height              : 100%%;
-    text-align               : left;
-    margin-left              : 3em;
-    margin-top               : 1px;
-    margin-bottom            : 3px;
-  }
-  tt {
-    font-family              : inconsolata, "liberation mono", "bitstream vera mono", "dejavu mono", monaco, consolas, "andale mono", "courier new", "courier 10 pitch", courier, monospace;
-    background-color         : #555555;
-    color                    : #DDDDDD;
-  }
+html {
+}
+*{
+  padding                  : 0px;
+  margin                   : 0px;
+}
+body {
+  height                   : 100vh;
+  background-color         : #000000;
+  color                    : #CCCCCC;
+  background               : #000000;
+  background-color         : #000000;
+}
+a:link {
+  color                    : #FFFFFF;
+  text-decoration          : none;
+}
+a:visited {
+  color                    : #999999;
+  text-decoration          : none;
+}
+a:hover {
+  color                    : #000000;
+  background-color         : #555555;
+}
+a.lnkocn:link {
+  color                    : %s;
+  text-decoration          : none;
+}
+a.lnkocn:visited {
+  color                    : #9ACD32;
+  text-decoration          : none;
+}
+a.lnkocn:hover {
+  color                    : #BBBBBB;
+  font-size                : 1.8rem;
+}
+a:hover img {
+  background-color         : #000000;
+}
+a:active {
+  color                    : #888888;
+  text-decoration          : underline;
+}
+input {
+  color                    : #FFFFFF;
+  background-color         : #777777;
+}
+div {
+  margin-left              : 0;
+  margin-right             : 0;
+}
+div.p {
+  margin-left              : 5%%;
+  margin-right             : 1%%;
+}
+div.substance {
+  width                    : 100%%;
+  background-color         : #000000;
+}
+div.ocn {
+  width                    : 5%%;
+  float                    : right;
+  top                      : 0;
+  background-color         : #000000;
+}
+div.endnote {
+  width                    : 95%%;
+  background-color         : #000000;
+}
+div.toc {
+  position                 : absolute;
+  float                    : left;
+  margin                   : 0;
+  padding                  : 0;
+  padding-top              : 0.5em;
+  border                   : 0;
+  width                    : 13em;
+  background-color         : #111111;
+  margin-right             : 1em;
+}
+div.summary {
+  margin                   : 0;
+  padding                  : 0;
+  border-left              : 13em solid #111111;
+  padding-left             : 1em;
+  background-color         : #111111;
+}
+div.content, div.main_column {
+  margin                   : 0;
+  padding                  : 0;
+  border-left              : 13em solid #000000;
+  padding-left             : 1em;
+  padding-right            : 1em;
+}
+div.content0, div.main_column0 {
+  margin                   : 0;
+  padding                  : 0;
+  border-left              : 0%% solid #000000;
+  padding-left             : 5%%;
+}
+div.scroll {
+  margin                   : 0;
+  padding                  : 0;
+  padding-left             : 1em;
+  padding-right            : 1em;
+}
+div.content:after {
+  content                  : ' ';
+  clear                    : both;
+  display                  : block;
+  height                   : 0;
+  overflow                 : hidden;
+}
+div.footer {
+  clear                    : left;
+  padding                  : 0.5em;
+  font-size                : 1.4rem;
+  margin                   : 0;
+}
+div.toc ul {
+  list-style               : none;
+  padding                  : 0;
+  margin                   : 0;
+}
+div.toc li ul a, li ul span.currentlink
+{
+  font-weight              : normal;
+  font-size                : 1.5rem;
+  padding-left             : 2em;
+  background-color         : #111111;
+}
+div.toc a, span.currentlink{
+  display                  : block;
+  text-decoration          : none;
+  padding-left             : 0.5em;
+  color                    : #FF00AA;
+}
+hr {
+  width                    : 90%%;
+  margin-left              : 5%%;
+  margin-right             : 2em;
+  margin-top               : 1.8em;
+  margin-bottom            : 1.8em;
+}
+span.currentlink {
+  text-decoration          : none;
+  background-color         : #AAAAF9;
+}
+div.toc a:visited {
+  color                    : #FF00AA;
+}
+div.toc a:hover {
+  color                    : #CCCCCC;
+  background-color         : #F9F9AA;
+}
+nav#toc ol {
+  list-style-type          : none;
+}
+.norm, .bold, .verse, .group, .block, .alt {
+  line-height              : 133%%;
+  margin-top               : 12px;
+  margin-bottom            : 0px;
+  padding-left             : 0em;
+  text-indent              : 0em;
+}
+p, h0, h1, h2, h3, h4, h5, h6, h7, ul, li {
+  display                  : block;
+  font-family              : verdana, arial, georgia, tahoma, sans-serif, helvetica, times, roman;
+  margin-left              : 5%%;
+  margin-right             : 2em;
+}
+p {
+  font-size                : 1.6rem;
+  font-weight              : normal;
+  line-height              : 133%%;
+  text-align               : justify;
+  text-indent              : 0mm;
+  margin-top               : 0.8em;
+  margin-bottom            : 0.8em;
+}
+img {
+  max-width                : 100%%;
+  height                   : auto;
+}
+pre {
+  width                    : auto;
+  display                  : block;
+  clear                    : both;
+  color                    : #555555;
+}
+pre.codeline {
+  display                  : table;
+  clear                    : both;
+  table-layout             : fixed;
+  margin-left              : 5%%;
+  margin-right             : 5%%;
+  width                    : 90%%;
+  white-space              : pre-wrap;
+  border-style             : none;
+  border-radius            : 5px 5px 5px 5px;
+  box-shadow               : 0 2px 5px #AAAAAA inset;
+  margin-bottom            : 1em;
+  padding                  : 0.5em 1em;
+  page-break-inside        : avoid;
+  word-wrap                : break-word;
+  font-family              : inconsolata, "liberation mono", "bitstream vera mono", "dejavu mono", monaco, consolas, "andale mono", "courier new", "courier 10 pitch", courier, monospace;
+  white-space              : pre;
+  white-space              : pre-wrap;
+  white-space              : -moz-pre-wrap;
+  white-space              : -o-pre-wrap;
+  background-color         : #555555;
+  color                    : #DDDDDD;
+  font-size                : 1.5rem;
+  line-height              : 100%%;
+}
+pre.codeline::before {
+  counter-reset            : linenum;
+}
+pre.codeline span.tr {
+  display                  : table-row;
+  counter-increment        : linenum;
+}
+pre.codeline span.th {
+  display                  : table-cell;
+  user-select              : none;
+  -moz-user-select         : none;
+  -webkit-user-select      : none;
+  padding                  : 0.5em 0.5em;
+}
+pre.codeline span.th::before {
+  content                  : counter(linenum) ".";
+  color                    : #999999;
+  text-align               : right;
+  display                  : block;
+}
+pre.codeline span.th {
+  width                    : 4em;
+}
+pre.codeline code {
+  display                  : table-cell;
+}
+p.code {
+  border-style             : none;
+}
+p.spaced { white-space     : pre; }
+p.block {
+  white-space              : pre;
+}
+p.group { }
+p.alt { }
+p.verse {
+  white-space              : pre;
+  margin-bottom            : 6px;
+}
+p.caption {
+  text-align               : left;
+  font-size                : 1.4rem;
+  display                  : inline;
+}
+p.endnote {
+  font-size                : 1.5rem;
+  line-height              : 120%%;
+  text-align               : left;
+  margin-right             : 15mm;
+  padding-left             : 1em;
+  text-indent              : -1em;
+}
+p.center {
+  text-align               : center;
+}
+p.bold {
+  font-weight              : bold;
+}
+p.bold_left {
+  font-weight              : bold;
+  text-align               : left;
+}
+p.centerbold {
+  text-align               : center;
+  font-weight              : bold;
+}
+p.em {
+  font-weight              : bold;
+  font-style               : normal;
+  background               : #FFF3B6;
+}
+p.small {
+  font-size                : 1.4rem;
+  margin-top               : 0px;
+  margin-bottom            : 0px;
+  margin-right             : 6px;
+  text-align               : left;
+}
+.tiny, .tiny_left, .tiny_right, .tiny_center {
+  font-size                : 1.35rem;
+  margin-top               : 0px;
+  margin-bottom            : 0px;
+  color                    : #EEEEEE;
+  margin-right             : 6px;
+  text-align               : left;
+}
+p.tiny { }
+p.tiny_left {
+  margin-left              : 0px;
+  margin-right             : 0px;
+  text-align               : left;
+}
+p.tiny_right {
+  margin-right             : 1em;
+  text-align               : right;
+}
+p.tiny_center {
+  margin-left              : 0px;
+  margin-right             : 0px;
+  text-align               : center;
+}
+p.concordance_word {
+  line-height              : 150%%;
+  font-weight              : bold;
+  display                  : inline;
+  margin-top               : 4px;
+  margin-bottom            : 1px;
+}
+p.concordance_count {
+  font-size                : 1.4rem;
+  color                    : #555555;
+  display                  : inline;
+  margin-left              : 0em;
+}
+p.concordance_object {
+  font-size                : 1.4rem;
+  line-height              : 120%%;
+  text-align               : left;
+  margin-left              : 3em;
+  margin-top               : 1px;
+  margin-bottom            : 3px;
+}
+p.book_index_lev1 {
+  line-height              : 100%%;
+  margin-top               : 4px;
+  margin-bottom            : 1px;
+}
+p.book_index_lev2 {
+  line-height              : 100%%;
+  text-align               : left;
+  margin-left              : 3em;
+  margin-top               : 1px;
+  margin-bottom            : 3px;
+}
+tt {
+  font-family              : inconsolata, "liberation mono", "bitstream vera mono", "dejavu mono", monaco, consolas, "andale mono", "courier new", "courier 10 pitch", courier, monospace;
+  background-color         : #555555;
+  color                    : #DDDDDD;
+}
 %s
-  note { white-space         : pre; }
-  label.ocn {
-    width                    : 2%%;
-    float                    : right;
-    top                      : 0;
-    font-size                : 80%%;
-    margin-top               : 0px;
-    margin-bottom            : 6px;
-    margin-right             : 6px;
-    text-align               : right;
-    color                    : %s;
-    -khtml-user-select       : none;
-    -moz-user-select         : none;
-    -ms-user-select          : none;
-    -o-user-select           : none;
-    -webkit-user-select      : none;
-    user-select              : none;
-  }
-  table {
-    display                  : block;
-    margin-left              : 5%%;
-    margin-right             : 2em;
-    background-color         : inherit;
-  }
-  tr { }
-  th,td {
-    vertical-align           : top;
-    text-align               : left;
-  }
-  th {
-    font-weight              : bold;
-  }
-  em {
-    font-weight              : bold;
-    font-style               : italic;
-  }
-  p.left,th.left,td.left {
-    text-align               : left;
-  }
-  p.small_left,th.small_left,td.small_left {
-    text-align               : left;
-    font-size                : 80%%;
-  }
-  p.right,th.right,td.right {
-    text-align               : right;
-  }
-  ul, li {
-    list-style-type          : none;
-    list-style               : none;
-    padding-left             : 20px;
-    font-weight              : normal;
-    line-height              : 150%%;
-    text-align               : left;
-    text-indent              : 0mm;
-    margin-left              : 1em;
-    margin-right             : 2em;
-    margin-top               : 3px;
-    margin-bottom            : 3px;
-  }
-  li {
-    background               : (../image_sys/bullet_09.png) no-repeat 0px 6px;
-  }
-  ul { }
-  h0, h1, h2, h3, h4, h5, h6, h7 {
-    font-weight              : bold;
-    line-height              : 120%%;
-    text-align               : left;
-    margin-top               : 20px;
-    margin-bottom            : 10px;
-  }
-  h4.norm, h5.norm, h6.norm, h7.norm {
-    margin-top               : 10px;
-    margin-bottom            : 0px;
-  }
-  h0 { font-size             : 125%%; }
-  h1 { font-size             : 120%%; }
-  h2 { font-size             : 115%%; }
-  h3 { font-size             : 110%%; }
-  h4 { font-size             : 105%%; }
-  h5 { font-size             : 100%%; }
-  h6 { font-size             : 100%%; }
-  h7 { font-size             : 100%%; }
-  h0, h1, h2, h3, h4, h5, h6, h7 {
-    text-shadow              : .2em .2em .3em #999999;
-  }
-  h1.i { margin-left         : 2em; }
-  h2.i { margin-left         : 3em; }
-  h3.i { margin-left         : 4em; }
-  h4.i { margin-left         : 5em; }
-  h5.i { margin-left         : 6em; }
-  h6.i { margin-left         : 7em; }
-  h7.i { margin-left         : 8em; }
-  h8.i { margin-left         : 9em; }
-  h9.i { margin-left         : 10em; }
-  .toc {
-    font-weight              : normal;
-    margin-top               : 6px;
-    margin-bottom            : 6px;
-  }
-  h0.toc {
-    margin-left              : 1em;
-    font-size                : 120%%;
-    line-height              : 150%%;
-  }
-  h1.toc {
-    margin-left              : 1em;
-    font-size                : 115%%;
-    line-height              : 150%%;
-  }
-  h2.toc {
-    margin-left              : 2em;
-    font-size                : 110%%;
-    line-height              : 140%%;
-  }
-  h3.toc {
-    margin-left              : 3em;
-    font-size                : 105%%;
-    line-height              : 120%%;
-  }
-  h4.toc {
-    margin-left              : 4em;
-    font-size                : 100%%;
-    line-height              : 120%%;
-  }
-  h5.toc {
-    margin-left              : 5em;
-    font-size                : 95%%;
-    line-height              : 110%%;
-  }
-  h6.toc {
-    margin-left              : 6em;
-    font-size                : 90%%;
-    line-height              : 110%%;
-  }
-  h7.toc {
-    margin-left              : 7em;
-    font-size                : 85%%;
-    line-height              : 100%%;
-  }
-  .subtoc {
-    margin-right             : 34%%;
-    font-weight              : normal;
-  }
-  h5.subtoc {
-    margin-left              : 2em;
-    font-size                : 80%%;
-    margin-top               : 2px;
-    margin-bottom            : 2px;
-  }
-  h6.subtoc {
-    margin-left              : 3em;
-    font-size                : 75%%;
-    margin-top               : 0px;
-    margin-bottom            : 0px;
-  }
-  h7.subtoc {
-    margin-left              : 4em;
-    font-size                : 70%%;
-    margin-top               : 0px;
-    margin-bottom            : 0px;
-  }
+note { white-space         : pre; }
+label.ocn {
+  width                    : 2%%;
+  float                    : right;
+  top                      : 0;
+  font-size                : 1.4rem;
+  margin-top               : 0px;
+  margin-bottom            : 6px;
+  margin-right             : 6px;
+  text-align               : right;
+  color                    : %s;
+  -khtml-user-select       : none;
+  -moz-user-select         : none;
+  -ms-user-select          : none;
+  -o-user-select           : none;
+  -webkit-user-select      : none;
+  user-select              : none;
+}
+table {
+  display                  : block;
+  margin-left              : 5%%;
+  margin-right             : 2em;
+  background-color         : inherit;
+}
+tr { }
+th,td {
+  vertical-align           : top;
+  text-align               : left;
+}
+th {
+  font-weight              : bold;
+}
+em {
+  font-weight              : bold;
+  font-style               : italic;
+}
+p.left,th.left,td.left {
+  text-align               : left;
+}
+p.small_left,th.small_left,td.small_left {
+  text-align               : left;
+  font-size                : 1.4rem;
+}
+p.right,th.right,td.right {
+  text-align               : right;
+}
+ul, li {
+  list-style-type          : none;
+  list-style               : none;
+  padding-left             : 20px;
+  font-weight              : normal;
+  line-height              : 150%%;
+  text-align               : left;
+  text-indent              : 0mm;
+  margin-left              : 1em;
+  margin-right             : 2em;
+  margin-top               : 3px;
+  margin-bottom            : 3px;
+}
+li {
+  background               : (../image_sys/bullet_09.png) no-repeat 0px 6px;
+}
+ul { }
+h0, h1, h2, h3, h4, h5, h6, h7 {
+  font-weight              : bold;
+  line-height              : 120%%;
+  text-align               : left;
+  margin-top               : 20px;
+  margin-bottom            : 10px;
+}
+h4.norm, h5.norm, h6.norm, h7.norm {
+  margin-top               : 10px;
+  margin-bottom            : 0px;
+}
+h0 { font-size             : 1.9rem; }
+h1 { font-size             : 1.8rem; }
+h2 { font-size             : 1.75rem; }
+h3 { font-size             : 1.7rem; }
+h4 { font-size             : 1.65rem; }
+h5 { font-size             : 1.6rem; }
+h6 { font-size             : 1.55rem; }
+h7 { font-size             : 1.5rem; }
+h0, h1, h2, h3, h4, h5, h6, h7 {
+  text-shadow              : .2em .2em .3em #999999;
+}
+h1.i { margin-left         : 2em; }
+h2.i { margin-left         : 3em; }
+h3.i { margin-left         : 4em; }
+h4.i { margin-left         : 5em; }
+h5.i { margin-left         : 6em; }
+h6.i { margin-left         : 7em; }
+h7.i { margin-left         : 8em; }
+h8.i { margin-left         : 9em; }
+h9.i { margin-left         : 10em; }
+.toc {
+  font-weight              : normal;
+  margin-top               : 6px;
+  margin-bottom            : 6px;
+}
+h0.toc {
+  margin-left              : 1em;
+  font-size                : 1.8rem;
+  line-height              : 150%%;
+}
+h1.toc {
+  margin-left              : 1em;
+  font-size                : 1.75rem;
+  line-height              : 150%%;
+}
+h2.toc {
+  margin-left              : 2em;
+  font-size                : 1.7rem;
+  line-height              : 140%%;
+}
+h3.toc {
+  margin-left              : 3em;
+  font-size                : 1.65rem;
+  line-height              : 120%%;
+}
+h4.toc {
+  margin-left              : 4em;
+  font-size                : 1.6rem;
+  line-height              : 120%%;
+}
+h5.toc {
+  margin-left              : 5em;
+  font-size                : 1.5rem;
+  line-height              : 110%%;
+}
+h6.toc {
+  margin-left              : 6em;
+  font-size                : 1.5rem;
+  line-height              : 110%%;
+}
+h7.toc {
+  margin-left              : 7em;
+  font-size                : 1.45rem;
+  line-height              : 100%%;
+}
+.subtoc {
+  margin-right             : 34%%;
+  font-weight              : normal;
+}
+h5.subtoc {
+  margin-left              : 2em;
+  font-size                : 1.4rem;
+  margin-top               : 2px;
+  margin-bottom            : 2px;
+}
+h6.subtoc {
+  margin-left              : 3em;
+  font-size                : 1.35;
+  margin-top               : 0px;
+  margin-bottom            : 0px;
+}
+h7.subtoc {
+  margin-left              : 4em;
+  font-size                : 1.3rem;
+  margin-top               : 0px;
+  margin-bottom            : 0px;
+}
 input, select, textarea {
-  font-size                : 150%%;
+  font-size                : 2.2rem;
 }
 input[type="text"] {
-  font-size:120%%;
+  font-size                : 1.8rem;
   line-height              : 120%%;
 }
 button[type="submit"] {
-  font-size                : 120%%;
+  font-size                : 1.8rem;
   line-height              : 120%%;
 }
 p.form {
-  font-size                : 150%%;
+  font-size                : 2.2rem;
   line-height              : 150%%;
 }
-  /* flex */
-  .flex-menu-bar {
-    display                  : -webkit-flex;
-    display                  : flex;
-    -webkit-flex-wrap        : wrap;
-    -webkit-align-items      : center;
-    align-items              : center;
-    width                    : 100%%;
-    margin-left              : 5%%;
-    margin-right             : 2%%;
-    background-color         : #000000;
-  }
-  .flex-menu-option {
-    background-color         : #000000;
-    margin-right             : 4px;
-  }
-  .flex-list {
-    display                  : -webkit-flex;
-    display                  : flex;
-    -webkit-align-items      : center;
-    display                  : block;
-    align-items              : center;
-    width                    : 100%%;
-    background-color         : #000000;
-  }
-  .flex-list-item {
-    background-color         : #000000;
-    margin                   : 4px;
-  }
-  /* grid */
-  .wrapper {
-    display                  : grid;
-    grid-template-columns    : 100%%;
-    grid-template-areas      :
-      "headband"
-      "doc_header"
-      "doc_title"
-      "doc_toc"
-      "doc_prefix"
-      "doc_intro"
-      "doc_body"
-      "doc_endnotes"
-      "doc_glossary"
-      "doc_biblio"
-      "doc_bookindex"
-      "doc_blurb"
-      "doc_suffix";
-    margin                   : 0px;
-    padding                  : 0px;
-    background-color         : #000000;
-  }
-  .delimit {
-    border-style             : none;
-    border-color             : #000000;
-    padding                  : 10px;
-  }
-  .headband {
-    grid-area                : headband;
-    background-color         : #000000;
-  }
-  .doc_header {
-    grid-area                : doc_header;
-  }
-  .doc_title {
-    grid-area                : doc_title;
-  }
-  .doc_toc {
-    grid-area                : doc_toc;
-  }
-  .doc_prefix {
-    grid-area                : doc_prefix;
-  }
-  .doc_intro {
-    grid-area                : doc_intro;
-  }
-  .doc_body {
-    grid-area                : doc_body;
-  }
-  .doc_endnotes {
-    grid-area                : doc_endnotes;
-  }
-  .doc_glossary {
-    grid-area                : doc_glossary;
-  }
-  .doc_biblio {
-    grid-area                : doc_biblio;
-  }
-  .doc_bookindex {
-    grid-area                : doc_bookindex;
-  }
-  .doc_blurb {
-    grid-area                : doc_blurb;
-  }
-  .doc_suffix {
-    grid-area                : doc_suffix;
-  }
-  .nav-ul {
-    list-style               : none;
-    float                    : left;
-  }
-  .nav-li {
-    float                    : left;
-    padding-right            : 0.7em;
-  }
-  .nav-li a {
-    text-decoration          : none;
-    color                    : #000000;
-  }
-  footer {
-    background-color         : #FF704E;
-  }
+/* flex */
+.flex-menu-bar {
+  display                  : -webkit-flex;
+  display                  : flex;
+  -webkit-flex-wrap        : wrap;
+  -webkit-align-items      : center;
+  align-items              : center;
+  width                    : 100%%;
+  margin-left              : 5%%;
+  margin-right             : 2%%;
+  background-color         : #000000;
+}
+.flex-menu-option {
+  background-color         : #000000;
+  margin-right             : 4px;
+}
+.flex-list {
+  display                  : -webkit-flex;
+  display                  : flex;
+  -webkit-align-items      : center;
+  display                  : block;
+  align-items              : center;
+  width                    : 100%%;
+  background-color         : #000000;
+}
+.flex-list-item {
+  background-color         : #000000;
+  margin                   : 4px;
+}
+/* grid */
+.wrapper {
+  display                  : grid;
+  grid-template-columns    : 100%%;
+  grid-template-areas      :
+    "headband"
+    "doc_header"
+    "doc_title"
+    "doc_toc"
+    "doc_prefix"
+    "doc_intro"
+    "doc_body"
+    "doc_endnotes"
+    "doc_glossary"
+    "doc_biblio"
+    "doc_bookindex"
+    "doc_blurb"
+    "doc_suffix";
+  margin                   : 0px;
+  padding                  : 0px;
+  background-color         : #000000;
+}
+.delimit {
+  border-style             : none;
+  border-color             : #000000;
+  padding                  : 10px;
+}
+.headband {
+  grid-area                : headband;
+  background-color         : #000000;
+}
+.doc_header {
+  grid-area                : doc_header;
+}
+.doc_title {
+  grid-area                : doc_title;
+}
+.doc_toc {
+  grid-area                : doc_toc;
+}
+.doc_prefix {
+  grid-area                : doc_prefix;
+}
+.doc_intro {
+  grid-area                : doc_intro;
+}
+.doc_body {
+  grid-area                : doc_body;
+}
+.doc_endnotes {
+  grid-area                : doc_endnotes;
+}
+.doc_glossary {
+  grid-area                : doc_glossary;
+}
+.doc_biblio {
+  grid-area                : doc_biblio;
+}
+.doc_bookindex {
+  grid-area                : doc_bookindex;
+}
+.doc_blurb {
+  grid-area                : doc_blurb;
+}
+.doc_suffix {
+  grid-area                : doc_suffix;
+}
+.nav-ul {
+  list-style               : none;
+  float                    : left;
+}
+.nav-li {
+  float                    : left;
+  padding-right            : 0.7em;
+}
+.nav-li a {
+  text-decoration          : none;
+  color                    : #000000;
+}
+footer {
+  background-color         : #FF704E;
+}
 ┃",
     _color_ocn_dark,
     _css_indent,
     _color_ocn_dark,
 );
     string _css_light_epub = format(q"┃
-  *{
-    padding                  : 0px;
-    margin                   : 0px;
-  }
-  body {
-    height                   : 100vh;
-    background-color         : #FFFFFF;
-  }
-  body {
-    color                    : #000000;
-    background               : #FFFFFF;
-    background-color         : #FFFFFF;
-  }
-  a:link {
-    color                    : #003399;
-    text-decoration          : none;
-  }
-  a:visited {
-    color                    : #003399;
-    text-decoration          : none;
-  }
-  a:hover {
-    color                    : #000000;
-    background-color         : #F9F9AA;
-  }
-  a.lnkocn:link {
-    color                    : %s;
-    text-decoration          : none;
-  }
-  a.lnkocn:visited {
-    color                    : #32CD32;
-    text-decoration          : none;
-  }
-  a.lnkocn:hover {
-    color                    : #777777;
-    font-size                : 120%%;
-  }
-  a:hover img {
-    background-color         : #FFFFFF;
-  }
-  a:active {
-    color                    : #003399;
-    text-decoration          : underline;
-  }
-  input {
-    color                    : #000000;
-    background-color         : #FFFFFF;
-  }
-  div {
-    margin-left              : 0;
-    margin-right             : 0;
-  }
-  div.p {
-    margin-left              : 5%%;
-    margin-right             : 1%%;
-  }
-  div.substance {
-    width                    : 100%%;
-    background-color         : #FFFFFF;
-  }
-  div.ocn {
-    width                    : 5%%;
-    float                    : right;
-    top                      : 0;
-    background-color         : #FFFFFF;
-  }
-  div.endnote {
-    width                    : 95%%;
-    background-color         : #FFFFFF;
-  }
-  div.toc {
-    position                 : absolute;
-    float                    : left;
-    margin                   : 0;
-    padding                  : 0;
-    padding-top              : 0.5em;
-    border                   : 0;
-    width                    : 13em;
-    background-color         : #EEEEEE;
-    margin-right             : 1em;
-  }
-  div.summary {
-    margin                   : 0;
-    padding                  : 0;
-    border-left              : 13em solid #EEEEEE;
-    padding-left             : 1em;
-    background-color         : #EEEEEE;
-  }
-  div.content, div.main_column {
-    margin                   : 0;
-    padding                  : 0;
-    border-left              : 13em solid #FFFFFF;
-    padding-left             : 1em;
-    padding-right            : 1em;
-  }
-  div.content0, div.main_column0 {
-    margin                   : 0;
-    padding                  : 0;
-    border-left              : 0%% solid #FFFFFF;
-    padding-left             : 5%%;
-  }
-  div.scroll {
-    margin                   : 0;
-    padding                  : 0;
-    padding-left             : 1em;
-    padding-right            : 1em;
-  }
-  div.content:after {
-    content                  : ' ';
-    clear                    : both;
-    display                  : block;
-    height                   : 0;
-    overflow                 : hidden;
-  }
-  div.footer {
-    clear                    : left;
-    padding                  : 0.5em;
-    font-size                : 80%%;
-    margin                   : 0;
-  }
-  div.toc ul {
-    list-style               : none;
-    padding                  : 0;
-    margin                   : 0;
-  }
-  div.toc li ul a, li ul span.currentlink
-  {
-    font-weight              : normal;
-    font-size                : 90%%;
-    padding-left             : 2em;
-    background-color         : #EEEEEE;
-  }
-  div.toc a, span.currentlink{
-    display                  : block;
-    text-decoration          : none;
-    padding-left             : 0.5em;
-    color                    : #0000aa;
-  }
-  hr {
-    width                    : 90%%;
-    margin-left              : 5%%;
-    margin-right             : 2em;
-    margin-top               : 1.8em;
-    margin-bottom            : 1.8em;
-  }
-  span.currentlink {
-    text-decoration          : none;
-    background-color         : #AAAAAA;
-  }
-  div.toc a:visited {
-    color                    : #0000aa;
-  }
-  div.toc a:hover {
-    color                    : #000000;
-    background-color         : #F9F9AA;
-  }
-  nav#toc ol {
-    list-style-type          : none;
-  }
-  .norm, .bold, .verse, .group, .block, .alt {
-    line-height              : 133%%;
-    margin-top               : 12px;
-    margin-bottom            : 0px;
-    padding-left             : 0em;
-    text-indent              : 0em;
-  }
-  p, h0, h1, h2, h3, h4, h5, h6, h7, ul, li {
-    display                  : block;
-    font-family              : verdana, arial, georgia, tahoma, sans-serif, helvetica, times, roman;
-    margin-left              : 5%%;
-    margin-right             : 2em;
-  }
-  p {
-    font-size                : 100%%;
-    font-weight              : normal;
-    line-height              : 133%%;
-    text-align               : justify;
-    text-indent              : 0mm;
-    margin-top               : 0.8em;
-    margin-bottom            : 0.8em;
-  }
-  img {
-    max-width                : 100%%;
-    height                   : auto;
-  }
-  pre {
-    width                    : auto;
-    display                  : block;
-    clear                    : both;
-    color                    : #555555;
-  }
-  pre.codeline {
-    display                  : table;
-    clear                    : both;
-    table-layout             : fixed;
-    margin-left              : 5%%;
-    margin-right             : 5%%;
-    width                    : 90%%;
-    white-space              : pre-wrap;
-    border-style             : none;
-    border-radius            : 5px 5px 5px 5px;
-    box-shadow               : 0 2px 5px #AAAAAA inset;
-    margin-bottom            : 1em;
-    padding                  : 0.5em 1em;
-    page-break-inside        : avoid;
-    word-wrap                : break-word;
-    font-family              : inconsolata, "liberation mono", "bitstream vera mono", "dejavu mono", monaco, consolas, "andale mono", "courier new", "courier 10 pitch", courier, monospace;
-    white-space              : pre;
-    white-space              : pre-wrap;
-    white-space              : -moz-pre-wrap;
-    white-space              : -o-pre-wrap;
-    background-color         : #EEEEEE;
-    color                    : #000000;
-    font-size                : 95%%;
-    line-height              : 100%%;
-  }
-  pre.codeline::before {
-    counter-reset            : linenum;
-  }
-  pre.codeline span.tr {
-    display                  : table-row;
-    counter-increment        : linenum;
-  }
-  pre.codeline span.th {
-    display                  : table-cell;
-    user-select              : none;
-    -moz-user-select         : none;
-    -webkit-user-select      : none;
-    padding                  : 0.5em 0.5em;
-    /* background-color         : #666666; */
-  }
-  pre.codeline span.th::before {
-    content                  : counter(linenum) ".";
-    color                    : #999999;
-    text-align               : right;
-    display                  : block;
-  }
-  pre.codeline span.th {
-    width                    : 4em;
-  }
-  pre.codeline code {
-    display                  : table-cell;
-  }
-  p.code {
-    border-style             : none;
-  }
-  p.spaced { white-space     : pre; }
-  p.block {
-    white-space              : pre;
-  }
-  p.group { }
-  p.alt { }
-  p.verse {
-    white-space              : pre;
-    margin-bottom            : 6px;
-  }
-  p.caption {
-    text-align               : left;
-    font-size                : 80%%;
-    display                  : inline;
-  }
-  p.endnote {
-    font-size                : 96%%;
-    line-height              : 120%%;
-    text-align               : left;
-    margin-right             : 15mm;
-    padding-left             : 1em;
-    text-indent              : -1em;
-  }
-  p.center {
-    text-align               : center;
-  }
-  p.bold {
-    font-weight              : bold;
-  }
-  p.bold_left {
-    font-weight              : bold;
-    text-align               : left;
-  }
-  p.centerbold {
-    text-align               : center;
-    font-weight              : bold;
-  }
-  p.em {
-    font-weight              : bold;
-    font-style               : normal;
-    background               : #FFF3B6;
-  }
-  p.small {
-    font-size                : 80%%;
-    margin-top               : 0px;
-    margin-bottom            : 0px;
-    margin-right             : 6px;
-    text-align               : left;
-  }
-  .tiny, .tiny_left, .tiny_right, .tiny_center {
-    font-size                : 75%%;
-    margin-top               : 0px;
-    margin-bottom            : 0px;
-    color                    : #777777;
-    margin-right             : 6px;
-    text-align               : left;
-  }
-  p.tiny { }
-  p.tiny_left {
-    margin-left              : 0px;
-    margin-right             : 0px;
-    text-align               : left;
-  }
-  p.tiny_right {
-    margin-right             : 1em;
-    text-align               : right;
-  }
-  p.tiny_center {
-    margin-left              : 0px;
-    margin-right             : 0px;
-    text-align               : center;
-  }
-  p.concordance_word {
-    line-height              : 150%%;
-    font-weight              : bold;
-    display                  : inline;
-    margin-top               : 4px;
-    margin-bottom            : 1px;
-  }
-  p.concordance_count {
-    font-size                : 80%%;
-    color                    : #777777;
-    display                  : inline;
-    margin-left              : 0em;
-  }
-  p.concordance_object {
-    font-size                : 80%%;
-    line-height              : 120%%;
-    text-align               : left;
-    margin-left              : 3em;
-    margin-top               : 1px;
-    margin-bottom            : 3px;
-  }
-  p.book_index_lev1 {
-    line-height              : 100%%;
-    margin-top               : 4px;
-    margin-bottom            : 1px;
-  }
-  p.book_index_lev2 {
-    line-height              : 100%%;
-    text-align               : left;
-    margin-left              : 3em;
-    margin-top               : 1px;
-    margin-bottom            : 3px;
-  }
-  tt {
-    font-family              : inconsolata, "liberation mono", "bitstream vera mono", "dejavu mono", monaco, consolas, "andale mono", "courier new", "courier 10 pitch", courier, monospace;
-    background-color         : #EEEEEE;
-    color                    : #000000;
-  }
+html {
+  font-size                : 62.5%%;
+}
+*{
+  padding                  : 0px;
+  margin                   : 0px;
+}
+body {
+  height                   : 100vh;
+  font-size                : 1.6rem;
+  background-color         : #FFFFFF;
+  color                    : #000000;
+  background               : #FFFFFF;
+  background-color         : #FFFFFF;
+}
+a:link {
+  color                    : #003399;
+  text-decoration          : none;
+}
+a:visited {
+  color                    : #003399;
+  text-decoration          : none;
+}
+a:hover {
+  color                    : #000000;
+  background-color         : #F9F9AA;
+}
+a.lnkocn:link {
+  color                    : %s;
+  text-decoration          : none;
+}
+a.lnkocn:visited {
+  color                    : #32CD32;
+  text-decoration          : none;
+}
+a.lnkocn:hover {
+  color                    : #777777;
+  font-size                : 1.8rem;
+}
+a:hover img {
+  background-color         : #FFFFFF;
+}
+a:active {
+  color                    : #003399;
+  text-decoration          : underline;
+}
+input {
+  color                    : #000000;
+  background-color         : #FFFFFF;
+}
+div {
+  margin-left              : 0;
+  margin-right             : 0;
+}
+div.p {
+  margin-left              : 5%%;
+  margin-right             : 1%%;
+}
+div.substance {
+  width                    : 100%%;
+  background-color         : #FFFFFF;
+}
+div.ocn {
+  width                    : 5%%;
+  float                    : right;
+  top                      : 0;
+  background-color         : #FFFFFF;
+}
+div.endnote {
+  width                    : 95%%;
+  background-color         : #FFFFFF;
+}
+div.toc {
+  position                 : absolute;
+  float                    : left;
+  margin                   : 0;
+  padding                  : 0;
+  padding-top              : 0.5em;
+  border                   : 0;
+  width                    : 13em;
+  background-color         : #EEEEEE;
+  margin-right             : 1em;
+}
+div.summary {
+  margin                   : 0;
+  padding                  : 0;
+  border-left              : 13em solid #EEEEEE;
+  padding-left             : 1em;
+  background-color         : #EEEEEE;
+}
+div.content, div.main_column {
+  margin                   : 0;
+  padding                  : 0;
+  border-left              : 13em solid #FFFFFF;
+  padding-left             : 1em;
+  padding-right            : 1em;
+}
+div.content0, div.main_column0 {
+  margin                   : 0;
+  padding                  : 0;
+  border-left              : 0%% solid #FFFFFF;
+  padding-left             : 5%%;
+}
+div.scroll {
+  margin                   : 0;
+  padding                  : 0;
+  padding-left             : 1em;
+  padding-right            : 1em;
+}
+div.content:after {
+  content                  : ' ';
+  clear                    : both;
+  display                  : block;
+  height                   : 0;
+  overflow                 : hidden;
+}
+div.footer {
+  clear                    : left;
+  padding                  : 0.5em;
+  font-size                : 1.4rem;
+  margin                   : 0;
+}
+div.toc ul {
+  list-style               : none;
+  padding                  : 0;
+  margin                   : 0;
+}
+div.toc li ul a, li ul span.currentlink
+{
+  font-weight              : normal;
+  font-size                : 1.5rem;
+  padding-left             : 2em;
+  background-color         : #EEEEEE;
+}
+div.toc a, span.currentlink{
+  display                  : block;
+  text-decoration          : none;
+  padding-left             : 0.5em;
+  color                    : #0000aa;
+}
+hr {
+  width                    : 90%%;
+  margin-left              : 5%%;
+  margin-right             : 2em;
+  margin-top               : 1.8em;
+  margin-bottom            : 1.8em;
+}
+span.currentlink {
+  text-decoration          : none;
+  background-color         : #AAAAAA;
+}
+div.toc a:visited {
+  color                    : #0000aa;
+}
+div.toc a:hover {
+  color                    : #000000;
+  background-color         : #F9F9AA;
+}
+nav#toc ol {
+  list-style-type          : none;
+}
+.norm, .bold, .verse, .group, .block, .alt {
+  line-height              : 133%%;
+  margin-top               : 12px;
+  margin-bottom            : 0px;
+  padding-left             : 0em;
+  text-indent              : 0em;
+}
+p, h0, h1, h2, h3, h4, h5, h6, h7, ul, li {
+  display                  : block;
+  font-family              : verdana, arial, georgia, tahoma, sans-serif, helvetica, times, roman;
+  margin-left              : 5%%;
+  margin-right             : 2em;
+}
+p {
+  font-size                : 1.6rem;
+  font-weight              : normal;
+  line-height              : 133%%;
+  text-align               : justify;
+  text-indent              : 0mm;
+  margin-top               : 0.8em;
+  margin-bottom            : 0.8em;
+}
+img {
+  max-width                : 100%%;
+  height                   : auto;
+}
+pre {
+  width                    : auto;
+  display                  : block;
+  clear                    : both;
+  color                    : #555555;
+}
+pre.codeline {
+  display                  : table;
+  clear                    : both;
+  table-layout             : fixed;
+  margin-left              : 5%%;
+  margin-right             : 5%%;
+  width                    : 90%%;
+  white-space              : pre-wrap;
+  border-style             : none;
+  border-radius            : 5px 5px 5px 5px;
+  box-shadow               : 0 2px 5px #AAAAAA inset;
+  margin-bottom            : 1em;
+  padding                  : 0.5em 1em;
+  page-break-inside        : avoid;
+  word-wrap                : break-word;
+  font-family              : inconsolata, "liberation mono", "bitstream vera mono", "dejavu mono", monaco, consolas, "andale mono", "courier new", "courier 10 pitch", courier, monospace;
+  white-space              : pre;
+  white-space              : pre-wrap;
+  white-space              : -moz-pre-wrap;
+  white-space              : -o-pre-wrap;
+  background-color         : #EEEEEE;
+  color                    : #000000;
+  font-size                : 1.5rem;
+  line-height              : 100%%;
+}
+pre.codeline::before {
+  counter-reset            : linenum;
+}
+pre.codeline span.tr {
+  display                  : table-row;
+  counter-increment        : linenum;
+}
+pre.codeline span.th {
+  display                  : table-cell;
+  user-select              : none;
+  -moz-user-select         : none;
+  -webkit-user-select      : none;
+  padding                  : 0.5em 0.5em;
+  /* background-color         : #666666; */
+}
+pre.codeline span.th::before {
+  content                  : counter(linenum) ".";
+  color                    : #999999;
+  text-align               : right;
+  display                  : block;
+}
+pre.codeline span.th {
+  width                    : 4em;
+}
+pre.codeline code {
+  display                  : table-cell;
+}
+p.code {
+  border-style             : none;
+}
+p.spaced { white-space     : pre; }
+p.block {
+  white-space              : pre;
+}
+p.group { }
+p.alt { }
+p.verse {
+  white-space              : pre;
+  margin-bottom            : 6px;
+}
+p.caption {
+  text-align               : left;
+  font-size                : 1.4rem;
+  display                  : inline;
+}
+p.endnote {
+  font-size                : 1.55rem;
+  line-height              : 120%%;
+  text-align               : left;
+  margin-right             : 15mm;
+  padding-left             : 1em;
+  text-indent              : -1em;
+}
+p.center {
+  text-align               : center;
+}
+p.bold {
+  font-weight              : bold;
+}
+p.bold_left {
+  font-weight              : bold;
+  text-align               : left;
+}
+p.centerbold {
+  text-align               : center;
+  font-weight              : bold;
+}
+p.em {
+  font-weight              : bold;
+  font-style               : normal;
+  background               : #FFF3B6;
+}
+p.small {
+  font-size                : 1.4rem;
+  margin-top               : 0px;
+  margin-bottom            : 0px;
+  margin-right             : 6px;
+  text-align               : left;
+}
+.tiny, .tiny_left, .tiny_right, .tiny_center {
+  font-size                : 1.2rem;
+  margin-top               : 0px;
+  margin-bottom            : 0px;
+  color                    : #777777;
+  margin-right             : 6px;
+  text-align               : left;
+}
+p.tiny { }
+p.tiny_left {
+  margin-left              : 0px;
+  margin-right             : 0px;
+  text-align               : left;
+}
+p.tiny_right {
+  margin-right             : 1em;
+  text-align               : right;
+}
+p.tiny_center {
+  margin-left              : 0px;
+  margin-right             : 0px;
+  text-align               : center;
+}
+p.concordance_word {
+  line-height              : 150%%;
+  font-weight              : bold;
+  display                  : inline;
+  margin-top               : 4px;
+  margin-bottom            : 1px;
+}
+p.concordance_count {
+  font-size                : 1.4rem;
+  color                    : #777777;
+  display                  : inline;
+  margin-left              : 0em;
+}
+p.concordance_object {
+  font-size                : 1.4rem;
+  line-height              : 120%%;
+  text-align               : left;
+  margin-left              : 3em;
+  margin-top               : 1px;
+  margin-bottom            : 3px;
+}
+p.book_index_lev1 {
+  line-height              : 100%%;
+  margin-top               : 4px;
+  margin-bottom            : 1px;
+}
+p.book_index_lev2 {
+  line-height              : 100%%;
+  text-align               : left;
+  margin-left              : 3em;
+  margin-top               : 1px;
+  margin-bottom            : 3px;
+}
+tt {
+  font-family              : inconsolata, "liberation mono", "bitstream vera mono", "dejavu mono", monaco, consolas, "andale mono", "courier new", "courier 10 pitch", courier, monospace;
+  background-color         : #EEEEEE;
+  color                    : #000000;
+}
 %s
-  note { white-space         : pre; }
-  label.ocn {
-    width                    : 2%%;
-    float                    : right;
-    top                      : 0;
-    font-size                : 80%%;
-    margin-top               : 0px;
-    margin-bottom            : 6px;
-    margin-right             : 6px;
-    text-align               : right;
-    color                    : %s;
-    -khtml-user-select       : none;
-    -moz-user-select         : none;
-    -ms-user-select          : none;
-    -o-user-select           : none;
-    -webkit-user-select      : none;
-    user-select              : none;
-  }
-  table {
-    display                  : block;
-    margin-left              : 5%%;
-    margin-right             : 2em;
-    background-color         : inherit;
-  }
-  tr { }
-  th,td {
-    vertical-align           : top;
-    text-align               : left;
-  }
-  th {
-    font-weight              : bold;
-  }
-  em {
-    font-weight              : bold;
-    font-style               : italic;
-  }
-  p.left,th.left,td.left {
-    text-align               : left;
-  }
-  p.small_left,th.small_left,td.small_left {
-    text-align               : left;
-    font-size                : 80%%;
-  }
-  p.right,th.right,td.right {
-    text-align               : right;
-  }
-  ul, li {
-    list-style-type          : none;
-    list-style               : none;
-    padding-left             : 20px;
-    font-weight              : normal;
-    line-height              : 150%%;
-    text-align               : left;
-    text-indent              : 0mm;
-    margin-left              : 1em;
-    margin-right             : 2em;
-    margin-top               : 3px;
-    margin-bottom            : 3px;
-  }
-  li {
-    background               : url(../image_sys/bullet_09.png) no-repeat 0px 6px;
-  }
-  ul { }
-  h0, h1, h2, h3, h4, h5, h6, h7 {
-    font-weight              : bold;
-    line-height              : 120%%;
-    text-align               : left;
-    margin-top               : 20px;
-    margin-bottom            : 10px;
-  }
-  h4.norm, h5.norm, h6.norm, h7.norm {
-    margin-top               : 10px;
-    margin-bottom            : 0px;
-  }
-  h0 { font-size             : 125%%; }
-  h1 { font-size             : 120%%; }
-  h2 { font-size             : 115%%; }
-  h3 { font-size             : 110%%; }
-  h4 { font-size             : 105%%; }
-  h5 { font-size             : 100%%; }
-  h6 { font-size             : 100%%; }
-  h7 { font-size             : 100%%; }
-  h0, h1, h2, h3, h4, h5, h6, h7 {
-    text-shadow              : .2em .2em .3em #808080;
-  }
-  h1.i { margin-left         : 2em; }
-  h2.i { margin-left         : 3em; }
-  h3.i { margin-left         : 4em; }
-  h4.i { margin-left         : 5em; }
-  h5.i { margin-left         : 6em; }
-  h6.i { margin-left         : 7em; }
-  h7.i { margin-left         : 8em; }
-  h8.i { margin-left         : 9em; }
-  h9.i { margin-left         : 10em; }
-  .toc {
-    font-weight              : normal;
-    margin-top               : 6px;
-    margin-bottom            : 6px;
-  }
-  h0.toc {
-    margin-left              : 1em;
-    font-size                : 120%%;
-    line-height              : 150%%;
-  }
-  h1.toc {
-    margin-left              : 1em;
-    font-size                : 115%%;
-    line-height              : 150%%;
-  }
-  h2.toc {
-    margin-left              : 2em;
-    font-size                : 110%%;
-    line-height              : 140%%;
-  }
-  h3.toc {
-    margin-left              : 3em;
-    font-size                : 105%%;
-    line-height              : 120%%;
-  }
-  h4.toc {
-    margin-left              : 4em;
-    font-size                : 100%%;
-    line-height              : 120%%;
-  }
-  h5.toc {
-    margin-left              : 5em;
-    font-size                : 95%%;
-    line-height              : 110%%;
-  }
-  h6.toc {
-    margin-left              : 6em;
-    font-size                : 90%%;
-    line-height              : 110%%;
-  }
-  h7.toc {
-    margin-left              : 7em;
-    font-size                : 85%%;
-    line-height              : 100%%;
-  }
-  .subtoc {
-    margin-right             : 34%%;
-    font-weight              : normal;
-  }
-  h5.subtoc {
-    margin-left              : 2em;
-    font-size                : 80%%;
-    margin-top               : 2px;
-    margin-bottom            : 2px;
-  }
-  h6.subtoc {
-    margin-left              : 3em;
-    font-size                : 75%%;
-    margin-top               : 0px;
-    margin-bottom            : 0px;
-  }
-  h7.subtoc {
-    margin-left              : 4em;
-    font-size                : 70%%;
-    margin-top               : 0px;
-    margin-bottom            : 0px;
-  }
+note { white-space         : pre; }
+label.ocn {
+  width                    : 2%%;
+  float                    : right;
+  top                      : 0;
+  font-size                : 1.4rem;
+  margin-top               : 0px;
+  margin-bottom            : 6px;
+  margin-right             : 6px;
+  text-align               : right;
+  color                    : %s;
+  -khtml-user-select       : none;
+  -moz-user-select         : none;
+  -ms-user-select          : none;
+  -o-user-select           : none;
+  -webkit-user-select      : none;
+  user-select              : none;
+}
+table {
+  display                  : block;
+  margin-left              : 5%%;
+  margin-right             : 2em;
+  background-color         : inherit;
+}
+tr { }
+th,td {
+  vertical-align           : top;
+  text-align               : left;
+}
+th {
+  font-weight              : bold;
+}
+em {
+  font-weight              : bold;
+  font-style               : italic;
+}
+p.left,th.left,td.left {
+  text-align               : left;
+}
+p.small_left,th.small_left,td.small_left {
+  text-align               : left;
+  font-size                : 1.4rem;
+}
+p.right,th.right,td.right {
+  text-align               : right;
+}
+ul, li {
+  list-style-type          : none;
+  list-style               : none;
+  padding-left             : 20px;
+  font-weight              : normal;
+  line-height              : 150%%;
+  text-align               : left;
+  text-indent              : 0mm;
+  margin-left              : 1em;
+  margin-right             : 2em;
+  margin-top               : 3px;
+  margin-bottom            : 3px;
+}
+li {
+  background               : url(../image_sys/bullet_09.png) no-repeat 0px 6px;
+}
+ul { }
+h0, h1, h2, h3, h4, h5, h6, h7 {
+  font-weight              : bold;
+  line-height              : 120%%;
+  text-align               : left;
+  margin-top               : 20px;
+  margin-bottom            : 10px;
+}
+h4.norm, h5.norm, h6.norm, h7.norm {
+  margin-top               : 10px;
+  margin-bottom            : 0px;
+}
+h0 { font-size             : 1.85rem; }
+h1 { font-size             : 1.8rem; }
+h2 { font-size             : 1.75rem; }
+h3 { font-size             : 1.7rem; }
+h4 { font-size             : 1.65rem; }
+h5 { font-size             : 1.6rem; }
+h6 { font-size             : 1.55rem; }
+h7 { font-size             : 1.5rem; }
+h0, h1, h2, h3, h4, h5, h6, h7 {
+  text-shadow              : .2em .2em .3em #808080;
+}
+h1.i { margin-left         : 2em; }
+h2.i { margin-left         : 3em; }
+h3.i { margin-left         : 4em; }
+h4.i { margin-left         : 5em; }
+h5.i { margin-left         : 6em; }
+h6.i { margin-left         : 7em; }
+h7.i { margin-left         : 8em; }
+h8.i { margin-left         : 9em; }
+h9.i { margin-left         : 10em; }
+.toc {
+  font-weight              : normal;
+  margin-top               : 6px;
+  margin-bottom            : 6px;
+}
+h0.toc {
+  margin-left              : 1em;
+  font-size                : 1.85rem;
+  line-height              : 150%%;
+}
+h1.toc {
+  margin-left              : 1em;
+  font-size                : 1.8rem;
+  line-height              : 150%%;
+}
+h2.toc {
+  margin-left              : 2em;
+  font-size                : 1.75rem;
+  line-height              : 140%%;
+}
+h3.toc {
+  margin-left              : 3em;
+  font-size                : 1.7rem;
+  line-height              : 120%%;
+}
+h4.toc {
+  margin-left              : 4em;
+  font-size                : 1.65rem;
+  line-height              : 120%%;
+}
+h5.toc {
+  margin-left              : 5em;
+  font-size                : 1.6rem;
+  line-height              : 110%%;
+}
+h6.toc {
+  margin-left              : 6em;
+  font-size                : 1.55rem;
+  line-height              : 110%%;
+}
+h7.toc {
+  margin-left              : 7em;
+  font-size                : 1.5rem;
+  line-height              : 100%%;
+}
+.subtoc {
+  margin-right             : 34%%;
+  font-weight              : normal;
+}
+h5.subtoc {
+  margin-left              : 2em;
+  font-size                : 1.45rem;
+  margin-top               : 2px;
+  margin-bottom            : 2px;
+}
+h6.subtoc {
+  margin-left              : 3em;
+  font-size                : 1.4rem;
+  margin-top               : 0px;
+  margin-bottom            : 0px;
+}
+h7.subtoc {
+  margin-left              : 4em;
+  font-size                : 1.35rem;
+  margin-top               : 0px;
+  margin-bottom            : 0px;
+}
 input, select, textarea {
-  font-size                : 150%%;
+  font-size                : 2.2rem;
 }
 input[type="text"] {
-  font-size:120%%;
+  font-size                : 1.8rem;
   line-height              : 120%%;
 }
 button[type="submit"] {
-  font-size                : 120%%;
+  font-size                : 1.8rem;
   line-height              : 120%%;
 }
 p.form {
-  font-size                : 150%%;
+  font-size                : 2.2rem;
   line-height              : 150%%;
 }
 
@@ -3758,536 +3764,536 @@ p.form {
     _color_ocn_light,
 );
     string _css_dark_epub = format(q"┃
-  *{
-    padding                  : 0px;
-    margin                   : 0px;
-  }
-  body {
-    height                   : 100vh;
-    background-color         : #000000;
-  }
-  body {
-    color                    : #CCCCCC;
-    background               : #000000;
-    background-color         : #000000;
-  }
-  a:link {
-    color                    : #FFFFFF;
-    text-decoration          : none;
-  }
-  a:visited {
-    color                    : #999999;
-    text-decoration          : none;
-  }
-  a:hover {
-    color                    : #000000;
-    background-color         : #555555;
-  }
-  a.lnkocn:link {
-    color                    : %s;
-    text-decoration          : none;
-  }
-  a.lnkocn:visited {
-    color                    : #9ACD32;
-    text-decoration          : none;
-  }
-  a.lnkocn:hover {
-    color                    : #BBBBBB;
-    font-size                : 120%%;
-  }
-  a:hover img {
-    background-color         : #000000;
-  }
-  a:active {
-    color                    : #888888;
-    text-decoration          : underline;
-  }
-  input {
-    color                    : #FFFFFF;
-    background-color         : #777777;
-  }
-  div {
-    margin-left              : 0;
-    margin-right             : 0;
-  }
-  div.p {
-    margin-left              : 5%%;
-    margin-right             : 1%%;
-  }
-  div.substance {
-    width                    : 100%%;
-    background-color         : #000000;
-  }
-  div.ocn {
-    width                    : 5%%;
-    float                    : right;
-    top                      : 0;
-    background-color         : #000000;
-  }
-  div.endnote {
-    width                    : 95%%;
-    background-color         : #000000;
-  }
-  div.toc {
-    position                 : absolute;
-    float                    : left;
-    margin                   : 0;
-    padding                  : 0;
-    padding-top              : 0.5em;
-    border                   : 0;
-    width                    : 13em;
-    background-color         : #111111;
-    margin-right             : 1em;
-  }
-  div.summary {
-    margin                   : 0;
-    padding                  : 0;
-    border-left              : 13em solid #111111;
-    padding-left             : 1em;
-    background-color         : #111111;
-  }
-  div.content, div.main_column {
-    margin                   : 0;
-    padding                  : 0;
-    border-left              : 13em solid #000000;
-    padding-left             : 1em;
-    padding-right            : 1em;
-  }
-  div.content0, div.main_column0 {
-    margin                   : 0;
-    padding                  : 0;
-    border-left              : 0%% solid #000000;
-    padding-left             : 5%%;
-  }
-  div.scroll {
-    margin                   : 0;
-    padding                  : 0;
-    padding-left             : 1em;
-    padding-right            : 1em;
-  }
-  div.content:after {
-    content                  : ' ';
-    clear                    : both;
-    display                  : block;
-    height                   : 0;
-    overflow                 : hidden;
-  }
-  div.footer {
-    clear                    : left;
-    padding                  : 0.5em;
-    font-size                : 80%%;
-    margin                   : 0;
-  }
-  div.toc ul {
-    list-style               : none;
-    padding                  : 0;
-    margin                   : 0;
-  }
-  div.toc li ul a, li ul span.currentlink
-  {
-    font-weight              : normal;
-    font-size                : 90%%;
-    padding-left             : 2em;
-    background-color         : #111111;
-  }
-  div.toc a, span.currentlink{
-    display                  : block;
-    text-decoration          : none;
-    padding-left             : 0.5em;
-    color                    : #FF00AA;
-  }
-  hr {
-    width                    : 90%%;
-    margin-left              : 5%%;
-    margin-right             : 2em;
-    margin-top               : 1.8em;
-    margin-bottom            : 1.8em;
-  }
-  span.currentlink {
-    text-decoration          : none;
-    background-color         : #AAAAF9;
-  }
-  div.toc a:visited {
-    color                    : #FF00AA;
-  }
-  div.toc a:hover {
-    color                    : #CCCCCC;
-    background-color         : #F9F9AA;
-  }
-  nav#toc ol {
-    list-style-type          : none;
-  }
-  .norm, .bold, .verse, .group, .block, .alt {
-    line-height              : 133%%;
-    margin-top               : 12px;
-    margin-bottom            : 0px;
-    padding-left             : 0em;
-    text-indent              : 0em;
-  }
-  p, h0, h1, h2, h3, h4, h5, h6, h7, ul, li {
-    display                  : block;
-    font-family              : verdana, arial, georgia, tahoma, sans-serif, helvetica, times, roman;
-    margin-left              : 5%%;
-    margin-right             : 2em;
-  }
-  p {
-    font-size                : 100%%;
-    font-weight              : normal;
-    line-height              : 133%%;
-    text-align               : justify;
-    text-indent              : 0mm;
-    margin-top               : 0.8em;
-    margin-bottom            : 0.8em;
-  }
-  img {
-    max-width                : 100%%;
-    height                   : auto;
-  }
-  pre {
-    width                    : auto;
-    display                  : block;
-    clear                    : both;
-    color                    : #555555;
-  }
-  pre.codeline {
-    display                  : table;
-    clear                    : both;
-    table-layout             : fixed;
-    margin-left              : 5%%;
-    margin-right             : 5%%;
-    width                    : 90%%;
-    white-space              : pre-wrap;
-    border-style             : none;
-    border-radius            : 5px 5px 5px 5px;
-    box-shadow               : 0 2px 5px #AAAAAA inset;
-    margin-bottom            : 1em;
-    padding                  : 0.5em 1em;
-    page-break-inside        : avoid;
-    word-wrap                : break-word;
-    font-family              : inconsolata, "liberation mono", "bitstream vera mono", "dejavu mono", monaco, consolas, "andale mono", "courier new", "courier 10 pitch", courier, monospace;
-    white-space              : pre;
-    white-space              : pre-wrap;
-    white-space              : -moz-pre-wrap;
-    white-space              : -o-pre-wrap;
-    background-color         : #555555;
-    color                    : #DDDDDD;
-    font-size                : 95%%;
-    line-height              : 100%%;
-  }
-  pre.codeline::before {
-    counter-reset            : linenum;
-  }
-  pre.codeline span.tr {
-    display                  : table-row;
-    counter-increment        : linenum;
-  }
-  pre.codeline span.th {
-    display                  : table-cell;
-    user-select              : none;
-    -moz-user-select         : none;
-    -webkit-user-select      : none;
-    padding                  : 0.5em 0.5em;
-  }
-  pre.codeline span.th::before {
-    content                  : counter(linenum) ".";
-    color                    : #999999;
-    text-align               : right;
-    display                  : block;
-  }
-  pre.codeline span.th {
-    width                    : 4em;
-  }
-  pre.codeline code {
-    display                  : table-cell;
-  }
-  p.code {
-    border-style             : none;
-  }
-  p.spaced { white-space     : pre; }
-  p.block {
-    white-space              : pre;
-  }
-  p.group { }
-  p.alt { }
-  p.verse {
-    white-space              : pre;
-    margin-bottom            : 6px;
-  }
-  p.caption {
-    text-align               : left;
-    font-size                : 80%%;
-    display                  : inline;
-  }
-  p.endnote {
-    font-size                : 96%%;
-    line-height              : 120%%;
-    text-align               : left;
-    margin-right             : 15mm;
-    padding-left             : 1em;
-    text-indent              : -1em;
-  }
-  p.center {
-    text-align               : center;
-  }
-  p.bold {
-    font-weight              : bold;
-  }
-  p.bold_left {
-    font-weight              : bold;
-    text-align               : left;
-  }
-  p.centerbold {
-    text-align               : center;
-    font-weight              : bold;
-  }
-  p.em {
-    font-weight              : bold;
-    font-style               : normal;
-    background               : #FFF3B6;
-  }
-  p.small {
-    font-size                : 80%%;
-    margin-top               : 0px;
-    margin-bottom            : 0px;
-    margin-right             : 6px;
-    text-align               : left;
-  }
-  .tiny, .tiny_left, .tiny_right, .tiny_center {
-    font-size                : 75%%;
-    margin-top               : 0px;
-    margin-bottom            : 0px;
-    color                    : #EEEEEE;
-    margin-right             : 6px;
-    text-align               : left;
-  }
-  p.tiny { }
-  p.tiny_left {
-    margin-left              : 0px;
-    margin-right             : 0px;
-    text-align               : left;
-  }
-  p.tiny_right {
-    margin-right             : 1em;
-    text-align               : right;
-  }
-  p.tiny_center {
-    margin-left              : 0px;
-    margin-right             : 0px;
-    text-align               : center;
-  }
-  p.concordance_word {
-    line-height              : 150%%;
-    font-weight              : bold;
-    display                  : inline;
-    margin-top               : 4px;
-    margin-bottom            : 1px;
-  }
-  p.concordance_count {
-    font-size                : 80%%;
-    color                    : #555555;
-    display                  : inline;
-    margin-left              : 0em;
-  }
-  p.concordance_object {
-    font-size                : 80%%;
-    line-height              : 120%%;
-    text-align               : left;
-    margin-left              : 3em;
-    margin-top               : 1px;
-    margin-bottom            : 3px;
-  }
-  p.book_index_lev1 {
-    line-height              : 100%%;
-    margin-top               : 4px;
-    margin-bottom            : 1px;
-  }
-  p.book_index_lev2 {
-    line-height              : 100%%;
-    text-align               : left;
-    margin-left              : 3em;
-    margin-top               : 1px;
-    margin-bottom            : 3px;
-  }
-  tt {
-    font-family              : inconsolata, "liberation mono", "bitstream vera mono", "dejavu mono", monaco, consolas, "andale mono", "courier new", "courier 10 pitch", courier, monospace;
-    background-color         : #555555;
-    color                    : #DDDDDD;
-  }
+html {
+}
+*{
+  padding                  : 0px;
+  margin                   : 0px;
+}
+body {
+  height                   : 100vh;
+  background-color         : #000000;
+  color                    : #CCCCCC;
+  background               : #000000;
+  background-color         : #000000;
+}
+a:link {
+  color                    : #FFFFFF;
+  text-decoration          : none;
+}
+a:visited {
+  color                    : #999999;
+  text-decoration          : none;
+}
+a:hover {
+  color                    : #000000;
+  background-color         : #555555;
+}
+a.lnkocn:link {
+  color                    : %s;
+  text-decoration          : none;
+}
+a.lnkocn:visited {
+  color                    : #9ACD32;
+  text-decoration          : none;
+}
+a.lnkocn:hover {
+  color                    : #BBBBBB;
+  font-size                : 1.8rem;
+}
+a:hover img {
+  background-color         : #000000;
+}
+a:active {
+  color                    : #888888;
+  text-decoration          : underline;
+}
+input {
+  color                    : #FFFFFF;
+  background-color         : #777777;
+}
+div {
+  margin-left              : 0;
+  margin-right             : 0;
+}
+div.p {
+  margin-left              : 5%%;
+  margin-right             : 1%%;
+}
+div.substance {
+  width                    : 100%%;
+  background-color         : #000000;
+}
+div.ocn {
+  width                    : 5%%;
+  float                    : right;
+  top                      : 0;
+  background-color         : #000000;
+}
+div.endnote {
+  width                    : 95%%;
+  background-color         : #000000;
+}
+div.toc {
+  position                 : absolute;
+  float                    : left;
+  margin                   : 0;
+  padding                  : 0;
+  padding-top              : 0.5em;
+  border                   : 0;
+  width                    : 13em;
+  background-color         : #111111;
+  margin-right             : 1em;
+}
+div.summary {
+  margin                   : 0;
+  padding                  : 0;
+  border-left              : 13em solid #111111;
+  padding-left             : 1em;
+  background-color         : #111111;
+}
+div.content, div.main_column {
+  margin                   : 0;
+  padding                  : 0;
+  border-left              : 13em solid #000000;
+  padding-left             : 1em;
+  padding-right            : 1em;
+}
+div.content0, div.main_column0 {
+  margin                   : 0;
+  padding                  : 0;
+  border-left              : 0%% solid #000000;
+  padding-left             : 5%%;
+}
+div.scroll {
+  margin                   : 0;
+  padding                  : 0;
+  padding-left             : 1em;
+  padding-right            : 1em;
+}
+div.content:after {
+  content                  : ' ';
+  clear                    : both;
+  display                  : block;
+  height                   : 0;
+  overflow                 : hidden;
+}
+div.footer {
+  clear                    : left;
+  padding                  : 0.5em;
+  font-size                : 1.4rem;
+  margin                   : 0;
+}
+div.toc ul {
+  list-style               : none;
+  padding                  : 0;
+  margin                   : 0;
+}
+div.toc li ul a, li ul span.currentlink
+{
+  font-weight              : normal;
+  font-size                : 1.5rem;
+  padding-left             : 2em;
+  background-color         : #111111;
+}
+div.toc a, span.currentlink{
+  display                  : block;
+  text-decoration          : none;
+  padding-left             : 0.5em;
+  color                    : #FF00AA;
+}
+hr {
+  width                    : 90%%;
+  margin-left              : 5%%;
+  margin-right             : 2em;
+  margin-top               : 1.8em;
+  margin-bottom            : 1.8em;
+}
+span.currentlink {
+  text-decoration          : none;
+  background-color         : #AAAAF9;
+}
+div.toc a:visited {
+  color                    : #FF00AA;
+}
+div.toc a:hover {
+  color                    : #CCCCCC;
+  background-color         : #F9F9AA;
+}
+nav#toc ol {
+  list-style-type          : none;
+}
+.norm, .bold, .verse, .group, .block, .alt {
+  line-height              : 133%%;
+  margin-top               : 12px;
+  margin-bottom            : 0px;
+  padding-left             : 0em;
+  text-indent              : 0em;
+}
+p, h0, h1, h2, h3, h4, h5, h6, h7, ul, li {
+  display                  : block;
+  font-family              : verdana, arial, georgia, tahoma, sans-serif, helvetica, times, roman;
+  margin-left              : 5%%;
+  margin-right             : 2em;
+}
+p {
+  font-size                : 1.6rem;
+  font-weight              : normal;
+  line-height              : 133%%;
+  text-align               : justify;
+  text-indent              : 0mm;
+  margin-top               : 0.8em;
+  margin-bottom            : 0.8em;
+}
+img {
+  max-width                : 100%%;
+  height                   : auto;
+}
+pre {
+  width                    : auto;
+  display                  : block;
+  clear                    : both;
+  color                    : #555555;
+}
+pre.codeline {
+  display                  : table;
+  clear                    : both;
+  table-layout             : fixed;
+  margin-left              : 5%%;
+  margin-right             : 5%%;
+  width                    : 90%%;
+  white-space              : pre-wrap;
+  border-style             : none;
+  border-radius            : 5px 5px 5px 5px;
+  box-shadow               : 0 2px 5px #AAAAAA inset;
+  margin-bottom            : 1em;
+  padding                  : 0.5em 1em;
+  page-break-inside        : avoid;
+  word-wrap                : break-word;
+  font-family              : inconsolata, "liberation mono", "bitstream vera mono", "dejavu mono", monaco, consolas, "andale mono", "courier new", "courier 10 pitch", courier, monospace;
+  white-space              : pre;
+  white-space              : pre-wrap;
+  white-space              : -moz-pre-wrap;
+  white-space              : -o-pre-wrap;
+  background-color         : #555555;
+  color                    : #DDDDDD;
+  font-size                : 1.5rem;
+  line-height              : 100%%;
+}
+pre.codeline::before {
+  counter-reset            : linenum;
+}
+pre.codeline span.tr {
+  display                  : table-row;
+  counter-increment        : linenum;
+}
+pre.codeline span.th {
+  display                  : table-cell;
+  user-select              : none;
+  -moz-user-select         : none;
+  -webkit-user-select      : none;
+  padding                  : 0.5em 0.5em;
+}
+pre.codeline span.th::before {
+  content                  : counter(linenum) ".";
+  color                    : #999999;
+  text-align               : right;
+  display                  : block;
+}
+pre.codeline span.th {
+  width                    : 4em;
+}
+pre.codeline code {
+  display                  : table-cell;
+}
+p.code {
+  border-style             : none;
+}
+p.spaced { white-space     : pre; }
+p.block {
+  white-space              : pre;
+}
+p.group { }
+p.alt { }
+p.verse {
+  white-space              : pre;
+  margin-bottom            : 6px;
+}
+p.caption {
+  text-align               : left;
+  font-size                : 1.4rem;
+  display                  : inline;
+}
+p.endnote {
+  font-size                : 1.5rem;
+  line-height              : 120%%;
+  text-align               : left;
+  margin-right             : 15mm;
+  padding-left             : 1em;
+  text-indent              : -1em;
+}
+p.center {
+  text-align               : center;
+}
+p.bold {
+  font-weight              : bold;
+}
+p.bold_left {
+  font-weight              : bold;
+  text-align               : left;
+}
+p.centerbold {
+  text-align               : center;
+  font-weight              : bold;
+}
+p.em {
+  font-weight              : bold;
+  font-style               : normal;
+  background               : #FFF3B6;
+}
+p.small {
+  font-size                : 1.4rem;
+  margin-top               : 0px;
+  margin-bottom            : 0px;
+  margin-right             : 6px;
+  text-align               : left;
+}
+.tiny, .tiny_left, .tiny_right, .tiny_center {
+  font-size                : 1.35rem;
+  margin-top               : 0px;
+  margin-bottom            : 0px;
+  color                    : #EEEEEE;
+  margin-right             : 6px;
+  text-align               : left;
+}
+p.tiny { }
+p.tiny_left {
+  margin-left              : 0px;
+  margin-right             : 0px;
+  text-align               : left;
+}
+p.tiny_right {
+  margin-right             : 1em;
+  text-align               : right;
+}
+p.tiny_center {
+  margin-left              : 0px;
+  margin-right             : 0px;
+  text-align               : center;
+}
+p.concordance_word {
+  line-height              : 150%%;
+  font-weight              : bold;
+  display                  : inline;
+  margin-top               : 4px;
+  margin-bottom            : 1px;
+}
+p.concordance_count {
+  font-size                : 1.4rem;
+  color                    : #555555;
+  display                  : inline;
+  margin-left              : 0em;
+}
+p.concordance_object {
+  font-size                : 1.4rem;
+  line-height              : 120%%;
+  text-align               : left;
+  margin-left              : 3em;
+  margin-top               : 1px;
+  margin-bottom            : 3px;
+}
+p.book_index_lev1 {
+  line-height              : 100%%;
+  margin-top               : 4px;
+  margin-bottom            : 1px;
+}
+p.book_index_lev2 {
+  line-height              : 100%%;
+  text-align               : left;
+  margin-left              : 3em;
+  margin-top               : 1px;
+  margin-bottom            : 3px;
+}
+tt {
+  font-family              : inconsolata, "liberation mono", "bitstream vera mono", "dejavu mono", monaco, consolas, "andale mono", "courier new", "courier 10 pitch", courier, monospace;
+  background-color         : #555555;
+  color                    : #DDDDDD;
+}
 %s
-  note { white-space         : pre; }
-  label.ocn {
-    width                    : 2%%;
-    float                    : right;
-    top                      : 0;
-    font-size                : 80%%;
-    margin-top               : 0px;
-    margin-bottom            : 6px;
-    margin-right             : 6px;
-    text-align               : right;
-    color                    : %s;
-    -khtml-user-select       : none;
-    -moz-user-select         : none;
-    -ms-user-select          : none;
-    -o-user-select           : none;
-    -webkit-user-select      : none;
-    user-select              : none;
-  }
-  table {
-    display                  : block;
-    margin-left              : 5%%;
-    margin-right             : 2em;
-    background-color         : inherit;
-  }
-  tr { }
-  th,td {
-    vertical-align           : top;
-    text-align               : left;
-  }
-  th {
-    font-weight              : bold;
-  }
-  em {
-    font-weight              : bold;
-    font-style               : italic;
-  }
-  p.left,th.left,td.left {
-    text-align               : left;
-  }
-  p.small_left,th.small_left,td.small_left {
-    text-align               : left;
-    font-size                : 80%%;
-  }
-  p.right,th.right,td.right {
-    text-align               : right;
-  }
-  ul, li {
-    list-style-type          : none;
-    list-style               : none;
-    padding-left             : 20px;
-    font-weight              : normal;
-    line-height              : 150%%;
-    text-align               : left;
-    text-indent              : 0mm;
-    margin-left              : 1em;
-    margin-right             : 2em;
-    margin-top               : 3px;
-    margin-bottom            : 3px;
-  }
-  li {
-    background               : (../image_sys/bullet_09.png) no-repeat 0px 6px;
-  }
-  ul { }
-  h0, h1, h2, h3, h4, h5, h6, h7 {
-    font-weight              : bold;
-    line-height              : 120%%;
-    text-align               : left;
-    margin-top               : 20px;
-    margin-bottom            : 10px;
-  }
-  h4.norm, h5.norm, h6.norm, h7.norm {
-    margin-top               : 10px;
-    margin-bottom            : 0px;
-  }
-  h0 { font-size             : 125%%; }
-  h1 { font-size             : 120%%; }
-  h2 { font-size             : 115%%; }
-  h3 { font-size             : 110%%; }
-  h4 { font-size             : 105%%; }
-  h5 { font-size             : 100%%; }
-  h6 { font-size             : 100%%; }
-  h7 { font-size             : 100%%; }
-  h0, h1, h2, h3, h4, h5, h6, h7 {
-    text-shadow              : .2em .2em .3em #999999;
-  }
-  h1.i { margin-left         : 2em; }
-  h2.i { margin-left         : 3em; }
-  h3.i { margin-left         : 4em; }
-  h4.i { margin-left         : 5em; }
-  h5.i { margin-left         : 6em; }
-  h6.i { margin-left         : 7em; }
-  h7.i { margin-left         : 8em; }
-  h8.i { margin-left         : 9em; }
-  h9.i { margin-left         : 10em; }
-  .toc {
-    font-weight              : normal;
-    margin-top               : 6px;
-    margin-bottom            : 6px;
-  }
-  h0.toc {
-    margin-left              : 1em;
-    font-size                : 120%%;
-    line-height              : 150%%;
-  }
-  h1.toc {
-    margin-left              : 1em;
-    font-size                : 115%%;
-    line-height              : 150%%;
-  }
-  h2.toc {
-    margin-left              : 2em;
-    font-size                : 110%%;
-    line-height              : 140%%;
-  }
-  h3.toc {
-    margin-left              : 3em;
-    font-size                : 105%%;
-    line-height              : 120%%;
-  }
-  h4.toc {
-    margin-left              : 4em;
-    font-size                : 100%%;
-    line-height              : 120%%;
-  }
-  h5.toc {
-    margin-left              : 5em;
-    font-size                : 95%%;
-    line-height              : 110%%;
-  }
-  h6.toc {
-    margin-left              : 6em;
-    font-size                : 90%%;
-    line-height              : 110%%;
-  }
-  h7.toc {
-    margin-left              : 7em;
-    font-size                : 85%%;
-    line-height              : 100%%;
-  }
-  .subtoc {
-    margin-right             : 34%%;
-    font-weight              : normal;
-  }
-  h5.subtoc {
-    margin-left              : 2em;
-    font-size                : 80%%;
-    margin-top               : 2px;
-    margin-bottom            : 2px;
-  }
-  h6.subtoc {
-    margin-left              : 3em;
-    font-size                : 75%%;
-    margin-top               : 0px;
-    margin-bottom            : 0px;
-  }
-  h7.subtoc {
-    margin-left              : 4em;
-    font-size                : 70%%;
-    margin-top               : 0px;
-    margin-bottom            : 0px;
-  }
+note { white-space         : pre; }
+label.ocn {
+  width                    : 2%%;
+  float                    : right;
+  top                      : 0;
+  font-size                : 1.4rem;
+  margin-top               : 0px;
+  margin-bottom            : 6px;
+  margin-right             : 6px;
+  text-align               : right;
+  color                    : %s;
+  -khtml-user-select       : none;
+  -moz-user-select         : none;
+  -ms-user-select          : none;
+  -o-user-select           : none;
+  -webkit-user-select      : none;
+  user-select              : none;
+}
+table {
+  display                  : block;
+  margin-left              : 5%%;
+  margin-right             : 2em;
+  background-color         : inherit;
+}
+tr { }
+th,td {
+  vertical-align           : top;
+  text-align               : left;
+}
+th {
+  font-weight              : bold;
+}
+em {
+  font-weight              : bold;
+  font-style               : italic;
+}
+p.left,th.left,td.left {
+  text-align               : left;
+}
+p.small_left,th.small_left,td.small_left {
+  text-align               : left;
+  font-size                : 1.4rem;
+}
+p.right,th.right,td.right {
+  text-align               : right;
+}
+ul, li {
+  list-style-type          : none;
+  list-style               : none;
+  padding-left             : 20px;
+  font-weight              : normal;
+  line-height              : 150%%;
+  text-align               : left;
+  text-indent              : 0mm;
+  margin-left              : 1em;
+  margin-right             : 2em;
+  margin-top               : 3px;
+  margin-bottom            : 3px;
+}
+li {
+  background               : (../image_sys/bullet_09.png) no-repeat 0px 6px;
+}
+ul { }
+h0, h1, h2, h3, h4, h5, h6, h7 {
+  font-weight              : bold;
+  line-height              : 120%%;
+  text-align               : left;
+  margin-top               : 20px;
+  margin-bottom            : 10px;
+}
+h4.norm, h5.norm, h6.norm, h7.norm {
+  margin-top               : 10px;
+  margin-bottom            : 0px;
+}
+h0 { font-size             : 1.9rem; }
+h1 { font-size             : 1.8rem; }
+h2 { font-size             : 1.75rem; }
+h3 { font-size             : 1.7rem; }
+h4 { font-size             : 1.65rem; }
+h5 { font-size             : 1.6rem; }
+h6 { font-size             : 1.55rem; }
+h7 { font-size             : 1.5rem; }
+h0, h1, h2, h3, h4, h5, h6, h7 {
+  text-shadow              : .2em .2em .3em #999999;
+}
+h1.i { margin-left         : 2em; }
+h2.i { margin-left         : 3em; }
+h3.i { margin-left         : 4em; }
+h4.i { margin-left         : 5em; }
+h5.i { margin-left         : 6em; }
+h6.i { margin-left         : 7em; }
+h7.i { margin-left         : 8em; }
+h8.i { margin-left         : 9em; }
+h9.i { margin-left         : 10em; }
+.toc {
+  font-weight              : normal;
+  margin-top               : 6px;
+  margin-bottom            : 6px;
+}
+h0.toc {
+  margin-left              : 1em;
+  font-size                : 1.8rem;
+  line-height              : 150%%;
+}
+h1.toc {
+  margin-left              : 1em;
+  font-size                : 1.75rem;
+  line-height              : 150%%;
+}
+h2.toc {
+  margin-left              : 2em;
+  font-size                : 1.7rem;
+  line-height              : 140%%;
+}
+h3.toc {
+  margin-left              : 3em;
+  font-size                : 1.65rem;
+  line-height              : 120%%;
+}
+h4.toc {
+  margin-left              : 4em;
+  font-size                : 1.6rem;
+  line-height              : 120%%;
+}
+h5.toc {
+  margin-left              : 5em;
+  font-size                : 1.5rem;
+  line-height              : 110%%;
+}
+h6.toc {
+  margin-left              : 6em;
+  font-size                : 1.5rem;
+  line-height              : 110%%;
+}
+h7.toc {
+  margin-left              : 7em;
+  font-size                : 1.45rem;
+  line-height              : 100%%;
+}
+.subtoc {
+  margin-right             : 34%%;
+  font-weight              : normal;
+}
+h5.subtoc {
+  margin-left              : 2em;
+  font-size                : 1.4rem;
+  margin-top               : 2px;
+  margin-bottom            : 2px;
+}
+h6.subtoc {
+  margin-left              : 3em;
+  font-size                : 1.35;
+  margin-top               : 0px;
+  margin-bottom            : 0px;
+}
+h7.subtoc {
+  margin-left              : 4em;
+  font-size                : 1.3rem;
+  margin-top               : 0px;
+  margin-bottom            : 0px;
+}
 input, select, textarea {
-  font-size                : 150%%;
+  font-size                : 2.2rem;
 }
 input[type="text"] {
-  font-size:120%%;
+  font-size                : 1.8rem;
   line-height              : 120%%;
 }
 button[type="submit"] {
-  font-size                : 120%%;
+  font-size                : 1.8rem;
   line-height              : 120%%;
 }
 p.form {
-  font-size                : 150%%;
+  font-size                : 2.2rem;
   line-height              : 150%%;
 }
 
diff --git a/sundry/spine_search_cgi/src/spine_search.d_ b/sundry/spine_search_cgi/src/spine_search.d_
index 6a673bc..30e0e9e 100755
--- a/sundry/spine_search_cgi/src/spine_search.d_
+++ b/sundry/spine_search_cgi/src/spine_search.d_
@@ -489,7 +489,7 @@ void cgi_function_intro(Cgi cgi) {
       _url_new = _url_new ~ _fn;
     }
     _matched_objects_text =
-      "<font size=\"2\" color=\"#666666\">"
+      "<font-size=\"2rem\" color=\"#666666\">"
       ~ "<a href=\""
       ~ _url_new
       ~ "\">"
@@ -530,7 +530,7 @@ void cgi_function_intro(Cgi cgi) {
       arrow_previous = "";
     } else {
       arrow_previous =
-        "<font size=\"2\" color=\"#666666\">"
+        "<font-size=\"1.8rem\" color=\"#666666\">"
         ~ "<a href=\""
         ~ _url_previous
         ~ "\">"
@@ -538,7 +538,7 @@ void cgi_function_intro(Cgi cgi) {
         ~ "</a> || </font>";
     }
     arrow_next =
-      "<font size=\"2\" color=\"#666666\">"
+      "<font-size=\"1.8rem\" color=\"#666666\">"
       ~ "<a href=\""
       ~ _url_next
       ~ "\">"
@@ -560,15 +560,16 @@ void cgi_function_intro(Cgi cgi) {
   <link rel="generator" href="sisudoc.org">
   <link rel="shortcut icon" href="%s://%s/image_sys/spine.ico">
   <style media = "all">
+    html {
+      font-size              : 62.5%%;
+    }
     *{
       padding                  : 0px;
       margin                   : 2px;
     }
     body {
       height                   : 100vh;
-      background-color         : #FFFFFF;
-    }
-    body {
+      font-size                : 1.6rem;
       color                    : #000000;
       background               : #FFFFFF;
       background-color         : #FFFFFF;
@@ -596,7 +597,7 @@ void cgi_function_intro(Cgi cgi) {
     a.matched_ocn:hover {
       color                    : #000000;
       background-color         : #F9F9AA;
-      font-size                : 100%%;
+      font-size                : 1.6rem;
     }
     a.lnkocn:link {
       color                    : #777777;
@@ -608,7 +609,7 @@ void cgi_function_intro(Cgi cgi) {
     }
     a.lnkocn:hover {
       color                    : #777777;
-      font-size                : 100%%;
+      font-size                : 1.6rem;
     }
     a:hover img {
       background-color         : #FFFFFF;
@@ -643,14 +644,14 @@ void cgi_function_intro(Cgi cgi) {
       background-color         : #FFFF48;
     }
     input, select, textarea {
-      font-size                : 150%%;
+      font-size                : 2rem;
     }
     input[type="text"] {
-      font-size                : 150%%;
+      font-size                : 2rem;
       line-height              : 150%%;
     }
     button[type="submit"] {
-      font-size                : 150%%;
+      font-size                : 2rem;
       line-height              : 150%%;
     }
     p.norm { }
@@ -670,7 +671,7 @@ void cgi_function_intro(Cgi cgi) {
       text-indent              : 0em;
     }
     p.publication {
-      font-size                : 100%%;
+      font-size                : 1.6rem;
       margin-left              : 0em;
       margin-top               : 0px;
       margin-bottom            : 0px;
@@ -678,11 +679,11 @@ void cgi_function_intro(Cgi cgi) {
       text-align               : left;
     }
     p.ocn_is {
-      font-size                : 100%%;
+      font-size                : 1.6rem;
       display                  : inline-block;
     }
     p.matched_ocn {
-      font-size                : 90%%;
+      font-size                : 1.5rem;
       margin-left              : 2em;
       margin-top               : 0px;
       margin-bottom            : 0px;
@@ -1101,7 +1102,7 @@ void cgi_function_intro(Cgi cgi) {
       display                  : inline;
     }
     p.endnote {
-      font-size                : 96%%;
+      font-size                : 1.5rem;
       line-height              : 120%%;
       text-align               : left;
       margin-right             : 15mm;
@@ -1128,14 +1129,14 @@ void cgi_function_intro(Cgi cgi) {
       background               : #FFF3B6;
     }
     p.small {
-      font-size                : 80%%;
+      font-size                : 1.4rem;
       margin-top               : 0px;
       margin-bottom            : 0px;
       margin-right             : 6px;
       text-align               : left;
     }
     .tiny, .tiny_left, .tiny_right, .tiny_center {
-      font-size                : 75%%;
+      font-size                : 1.3rem;
       margin-top               : 0px;
       margin-bottom            : 0px;
       color                    : #EEEEEE;
@@ -1202,7 +1203,7 @@ void cgi_function_intro(Cgi cgi) {
       white-space              : -o-pre-wrap;
       background-color         : #555555;
       color                    : #DDDDDD;
-      font-size                : 120%%;
+      font-size                : 1.8rem;
       line-height              : 120%%;
     }
     pre.codeline::before {
@@ -1244,7 +1245,7 @@ void cgi_function_intro(Cgi cgi) {
     }
     p.small_left,th.small_left,td.small_left {
       text-align               : left;
-      font-size                : 80%%;
+      font-size                : 1.4rem;
     }
     p.right,th.right,td.right {
       text-align               : right;
@@ -1277,14 +1278,14 @@ void cgi_function_intro(Cgi cgi) {
       margin-top               : 10px;
       margin-bottom            : 0px;
     }
-    h0 { font-size             : 125%%; }
-    h1 { font-size             : 120%%; }
-    h2 { font-size             : 115%%; }
-    h3 { font-size             : 110%%; }
-    h4 { font-size             : 105%%; }
-    h5 { font-size             : 100%%; }
-    h6 { font-size             : 100%%; }
-    h7 { font-size             : 100%%; }
+    h0 { font-size             : 2rem; }
+    h1 { font-size             : 1.9rem; }
+    h2 { font-size             : 1.8rem; }
+    h3 { font-size             : 1.7rem; }
+    h4 { font-size             : 1.6rem; }
+    h5 { font-size             : 1.6rem; }
+    h6 { font-size             : 1.6rem; }
+    h7 { font-size             : 1.6rem; }
     h0, h1, h2, h3, h4, h5, h6, h7 {
       text-shadow              : .2em .2em .3em #999999;
     }
@@ -1304,42 +1305,42 @@ void cgi_function_intro(Cgi cgi) {
     }
     h0.toc {
       margin-left              : 1em;
-      font-size                : 120%%;
+      font-size                : 2rem;
       line-height              : 150%%;
     }
     h1.toc {
       margin-left              : 1em;
-      font-size                : 115%%;
+      font-size                : 1.9rem;
       line-height              : 150%%;
     }
     h2.toc {
       margin-left              : 2em;
-      font-size                : 110%%;
+      font-size                : 1.8rem;
       line-height              : 140%%;
     }
     h3.toc {
       margin-left              : 3em;
-      font-size                : 105%%;
+      font-size                : 1.7rem;
       line-height              : 120%%;
     }
     h4.toc {
       margin-left              : 4em;
-      font-size                : 100%%;
+      font-size                : 1.6rem;
       line-height              : 120%%;
     }
     h5.toc {
       margin-left              : 5em;
-      font-size                : 95%%;
+      font-size                : 1.5rem;
       line-height              : 110%%;
     }
     h6.toc {
       margin-left              : 6em;
-      font-size                : 90%%;
+      font-size                : 1.4rem;
       line-height              : 110%%;
     }
     h7.toc {
       margin-left              : 7em;
-      font-size                : 85%%;
+      font-size                : 1.3rem;
       line-height              : 100%%;
     }
     .subtoc {
@@ -1348,19 +1349,19 @@ void cgi_function_intro(Cgi cgi) {
     }
     h5.subtoc {
       margin-left              : 2em;
-      font-size                : 80%%;
+      font-size                : 1.5rem;
       margin-top               : 2px;
       margin-bottom            : 2px;
     }
     h6.subtoc {
       margin-left              : 3em;
-      font-size                : 75%%;
+      font-size                : 1.4rem;
       margin-top               : 0px;
       margin-bottom            : 0px;
     }
     h7.subtoc {
       margin-left              : 4em;
-      font-size                : 70%%;
+      font-size                : 1.3rem;
       margin-top               : 0px;
       margin-bottom            : 0px;
     }
@@ -1451,7 +1452,7 @@ void cgi_function_intro(Cgi cgi) {
         // assert(method_get_url == environment.get("HTTP_REFERER", conf.query_base_url ~ conf.query_string));
         if (conf.request_method == "POST") {
           _the_can =
-            "<font size=\"2\" color=\"#666666\">"
+            "<font-size=\"1rem\" color=\"#666666\">"
             ~ "POST:&nbsp;"
             ~ "<a href=\""
             ~ method_post_url_construct
@@ -1461,7 +1462,7 @@ void cgi_function_intro(Cgi cgi) {
             ~ "<br>";
         } else if (conf.request_method == "GET") {
           _the_can =
-            "<font size=\"2\" color=\"#666666\">"
+            "<font-size=\"1rem\" color=\"#666666\">"
             ~ "GET:&nbsp;&nbsp;"
             ~ "<a href=\""
             ~ method_get_url
@@ -1480,25 +1481,25 @@ void cgi_function_intro(Cgi cgi) {
         string search_field = post_value("sf", "field");
         tf = text_fields;
         tip = format(q"┃
-      <font size="2" color="#666666">
-      <b>database:</b> <font size="2" color="#004000">%s</font>; <b>selected view:</b> <font size="2" color="#004000">index</font>
+      <font-size="1rem" color="#666666">
+      <b>database:</b> <font-size="1rem" color="#004000">%s</font>; <b>selected view:</b> <font-size="2" color="#004000">index</font>
       <b>search string:</b> %s %s %s %s %s %s<br>
       %s %s %s %s %s %s
       </font>
       ┃",
           cv.db_selected,
-          (tf.text.empty   ? "" : "\"text:   <font size=\"2\" color=\"#004000\">" ~ tf.text   ~ "</font>; "),
-          (tf.title.empty  ? "" : "\"title:  <font size=\"2\" color=\"#004000\">" ~ tf.title  ~ "</font>; "),
-          (tf.author.empty ? "" : "\"author: <font size=\"2\" color=\"#004000\">" ~ tf.author ~ "</font>; "),
-          (tf.date.empty   ? "" : "\"date    <font size=\"2\" color=\"#004000\">" ~ tf.date   ~ "</font>; "),
-          (tf.uid.empty    ? "" : "\"uid:    <font size=\"2\" color=\"#004000\">" ~ tf.uid    ~ "</font>; "),
-          (tf.fn.empty     ? "" : "\"fn:     <font size=\"2\" color=\"#004000\">" ~ tf.fn     ~ "</font>; "),
-          (tf.text.empty   ? "" :  "text:    <font size=\"2\" color=\"#004000\">" ~ tf.text   ~ "</font><br>"),
-          (tf.title.empty  ? "" : "title:    <font size=\"2\" color=\"#004000\">" ~ tf.title  ~ "</font><br>"),
-          (tf.author.empty ? "" :  "author:  <font size=\"2\" color=\"#004000\">" ~ tf.author ~ "</font><br>"),
-          (tf.date.empty   ? "" :  "date:    <font size=\"2\" color=\"#004000\">" ~ tf.date   ~ "</font><br>"),
-          (tf.uid.empty    ? "" : "\"uid:    <font size=\"2\" color=\"#004000\">" ~ tf.uid    ~ "</font>; "),
-          (tf.fn.empty     ? "" : "\"fn:     <font size=\"2\" color=\"#004000\">" ~ tf.fn     ~ "</font>; "),
+          (tf.text.empty   ? "" : "\"text:   <font-size=\"1rem\" color=\"#004000\">" ~ tf.text   ~ "</font>; "),
+          (tf.title.empty  ? "" : "\"title:  <font-size=\"1rem\" color=\"#004000\">" ~ tf.title  ~ "</font>; "),
+          (tf.author.empty ? "" : "\"author: <font-size=\"1rem\" color=\"#004000\">" ~ tf.author ~ "</font>; "),
+          (tf.date.empty   ? "" : "\"date    <font-size=\"1rem\" color=\"#004000\">" ~ tf.date   ~ "</font>; "),
+          (tf.uid.empty    ? "" : "\"uid:    <font-size=\"1rem\" color=\"#004000\">" ~ tf.uid    ~ "</font>; "),
+          (tf.fn.empty     ? "" : "\"fn:     <font-size=\"1rem\" color=\"#004000\">" ~ tf.fn     ~ "</font>; "),
+          (tf.text.empty   ? "" :  "text:    <font-size=\"1rem\" color=\"#004000\">" ~ tf.text   ~ "</font><br>"),
+          (tf.title.empty  ? "" : "title:    <font-size=\"1rem\" color=\"#004000\">" ~ tf.title  ~ "</font><br>"),
+          (tf.author.empty ? "" :  "author:  <font-size=\"1rem\" color=\"#004000\">" ~ tf.author ~ "</font><br>"),
+          (tf.date.empty   ? "" :  "date:    <font-size=\"1rem\" color=\"#004000\">" ~ tf.date   ~ "</font><br>"),
+          (tf.uid.empty    ? "" : "\"uid:    <font-size=\"1rem\" color=\"#004000\">" ~ tf.uid    ~ "</font>; "),
+          (tf.fn.empty     ? "" : "\"fn:     <font-size=\"1rem\" color=\"#004000\">" ~ tf.fn     ~ "</font>; "),
         );
       }
       return tip;
@@ -1515,7 +1516,7 @@ void cgi_function_intro(Cgi cgi) {
     %s
   </td></tr></table>
   <td valign=\"top\"><tr><td>
-    <font size="2" color="#222222">
+    <font-size="1rem" color="#222222">
     <input type="hidden" name="db" value="%s">
     <input type="submit" value="SiSU search">
     <input type="radio" name="rt" id="results_type_index" value="idx" %s> index
@@ -1732,7 +1733,7 @@ LIMIT %s OFFSET %s
       );
       (cv.checked_sql)
       ? cgi.write(previous_next
-          ~ "<hr><font size=\"2\" color=\"#666666\">"
+          ~ "<hr><font-size=\"1rem\" color=\"#666666\">"
           ~ sql_select.the_body.strip.split("\n  ").join(" ").split("\n").join("<br>")
           ~ "</font>\n"
         )