From 77fa92faf4ab7f03d8bf4b6cfe6c57e38bba2141 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?Marek=20Fel=C5=A1=C3=B6ci?= <marek.felsoci@inria.fr>
Date: Fri, 22 Jul 2022 15:29:32 +0200
Subject: [PATCH] Add version of `readtheorginria' using system fonts

---
 README.md                                     |    4 +-
 online-theme-readtheorginria-system.setup     |    9 +
 .../css/readtheorginria-system.css            | 1403 +++++++++++++++++
 theme-readtheorginria-system.setup            |    9 +
 4 files changed, 1424 insertions(+), 1 deletion(-)
 create mode 100644 online-theme-readtheorginria-system.setup
 create mode 100644 readtheorginria/css/readtheorginria-system.css
 create mode 100644 theme-readtheorginria-system.setup

diff --git a/README.md b/README.md
index af287d3..a490d95 100644
--- a/README.md
+++ b/README.md
@@ -16,7 +16,9 @@ property of [Inria](https://www.inria.fr/en).
 
 The only theme available for now is a clone of the Fabrice Niessen's
 [readtheorg](https://github.com/fniessen/org-html-themes#about-readtheorg)
-theme that we refer to here as **readtheorginria**.
+theme that we refer to here as **readtheorginria**. A version of the latter
+using system fonts instead of Google(R) fonts is available under the name of
+**readtheorginria-system**.
 
 ### Example
 
diff --git a/online-theme-readtheorginria-system.setup b/online-theme-readtheorginria-system.setup
new file mode 100644
index 0000000..fa9a3b5
--- /dev/null
+++ b/online-theme-readtheorginria-system.setup
@@ -0,0 +1,9 @@
+# -*- mode: org; -*-
+
+#+HTML_HEAD: <link rel="stylesheet" type="text/css" href="https://mfelsoci.gitlabpages.inria.fr/inria-org-html-themes/readtheorginria/css/htmlize.css"/>
+#+HTML_HEAD: <link rel="stylesheet" type="text/css" href="https://mfelsoci.gitlabpages.inria.fr/inria-org-html-themes/readtheorginria/css/readtheorginria-system.css"/>
+
+#+HTML_HEAD: <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
+#+HTML_HEAD: <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
+#+HTML_HEAD: <script type="text/javascript" src="https://mfelsoci.gitlabpages.inria.fr/inria-org-html-themes/lib/js/jquery.stickytableheaders.min.js"></script>
+#+HTML_HEAD: <script type="text/javascript" src="https://mfelsoci.gitlabpages.inria.fr/inria-org-html-themes/readtheorginria/js/readtheorginria.js"></script>
diff --git a/readtheorginria/css/readtheorginria-system.css b/readtheorginria/css/readtheorginria-system.css
new file mode 100644
index 0000000..0544ec2
--- /dev/null
+++ b/readtheorginria/css/readtheorginria-system.css
@@ -0,0 +1,1403 @@
+@import url(https://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css);
+
+h1,
+h2,
+h3,
+h4,
+h5,
+h6,
+legend {
+  font-family: "Verdana", sans-serif;
+  font-weight: 700;
+  margin-top: 0;
+}
+
+h1 {
+  font-size: 16pt;
+}
+
+.subtitle {
+  font-size: 95%; /* of h1 */
+}
+
+h2 {
+  font-size: 13pt;
+}
+
+h3 {
+  font-size: 12pt;
+}
+
+h4 {
+  font-size: 11pt;
+}
+
+h5 {
+  font-size: 10pt;
+}
+
+h6 {
+  font-size: 10pt;
+}
+
+h4,
+h5,
+h6 {
+  color: #E63312;
+  font-weight: 300;
+}
+
+html {
+  -ms-text-size-adjust: 100%;
+  -webkit-text-size-adjust: 100%;
+  font-size: 100%;
+  height: 100%;
+  overflow-x: hidden;
+}
+
+body {
+  background: #EDF0F2;
+  color: #404040;
+  font-family: "Verdana", sans-serif;
+  font-weight: normal;
+  margin: 0;
+  min-height: 100%;
+  overflow-x: hidden;
+}
+
+#content {
+  background: #FCFCFC;
+  height: 100%;
+  margin-left: 300px;
+  max-width: 60%;
+  min-height: 100%;
+  padding: 1.618em 3.236em;
+  text-align: justify;
+}
+
+p {
+  font-size: 10pt;
+  line-height: 16pt;
+  margin: 0px 0px 16px 0px;
+}
+
+b,
+strong {
+  font-weight: bold;
+}
+
+blockquote {
+  background-color: #F0F0F0;
+  border-left: 5px solid #CCCCCC;
+  font-style: italic;
+  line-height: 16pt;
+  margin: 0px 0px 24px 0px;
+  padding: 6px 20px;
+}
+
+ul,
+ol,
+dl {
+  line-height: 16pt;
+  list-style-image: none;
+  margin: 0px 0px 24px 0px;
+  padding: 0;
+}
+
+li {
+  margin-left: 24px;
+}
+
+dd {
+  margin: 0;
+}
+
+#content .section ul,
+#content .toctree-wrapper ul,
+article ul {
+  list-style: disc;
+  line-height: 16pt;
+  margin-bottom: 24px;
+}
+
+#content .section ul li,
+#content .toctree-wrapper ul li,
+article ul li {
+  list-style: disc;
+  margin-left: 24px;
+}
+
+#content .section ul li p:last-child,
+#content .toctree-wrapper ul li p:last-child,
+article ul li p:last-child {
+  margin-bottom: 0;
+}
+
+#content .section ul li ul,
+#content .toctree-wrapper ul li ul,
+article ul li ul {
+  margin-bottom: 0;
+}
+
+#content .section ul li li,
+#content .toctree-wrapper ul li li,
+article ul li li {
+  list-style: circle;
+}
+
+#content .section ul li li li,
+#content .toctree-wrapper ul li li li,
+article ul li li li {
+  list-style: square;
+}
+
+#content .section ul li ol li,
+#content .toctree-wrapper ul li ol li,
+article ul li ol li {
+  list-style: decimal;
+}
+
+#content .section ol,
+#content ol,
+article ol {
+  list-style: decimal;
+  line-height: 16pt;
+  margin-bottom: 24px;
+}
+
+#content .section ol li,
+#content ol li,
+article ol li {
+  list-style: decimal;
+  margin-left: 24px;
+}
+
+#content .section ol li p:last-child,
+#content ol li p:last-child,
+article ol li p:last-child {
+  margin-bottom: 0;
+}
+
+#content .section ol li ul,
+#content ol li ul,
+article ol li ul {
+  margin-bottom: 0;
+}
+
+#content .section ol li ul li,
+#content ol li ul li,
+article ol li ul li {
+  list-style: disc;
+}
+
+dl dt {
+  font-weight: bold;
+}
+
+dl p,
+dl table,
+dl ul,
+dl ol {
+  margin-bottom: 12px !important;
+}
+
+dl dd {
+  margin: 0 0 12px 24px;
+}
+
+@media print {
+  .codeblock,
+  pre.src {
+    white-space: pre.src-wrap;
+  }
+}
+
+@media print {
+  html,
+  body,
+  section {
+    background: none !important;
+  }
+
+  *{
+    box-shadow: none !important;
+    text-shadow: none !important;
+    filter: none !important;
+    -ms-filter: none !important;
+  }
+
+  a,
+  a:visited {
+    text-decoration: underline;
+  }
+
+  pre.src,
+  blockquote {
+    page-break-inside: avoid;
+  }
+
+  thead {
+    display: table-header-group;
+  }
+
+  tr,
+  img {
+    page-break-inside: avoid;
+  }
+
+  img {
+    max-width: 100% !important;
+  }
+
+  @page {
+    margin: 0.5cm;
+  }
+
+  p,
+  h2,
+  h3 {
+    orphans: 3;
+    widows: 3;
+  }
+
+  h2,
+  h3 {
+    page-break-after: avoid;
+  }
+}
+
+@media print {
+  #postamble {
+    display: none;
+  }
+
+  #content {
+    margin-left: 0;
+    max-width: 100%;
+  }
+}
+
+@media print {
+  #table-of-contents {
+    display: none;
+  }
+
+  @page {
+    size: auto;
+    margin: 25mm 25mm 25mm 25mm;
+  }
+
+  body {
+    margin: 0px;
+  }
+}
+
+@media screen and (max-width: 768px){
+}
+
+@media only screen and (max-width: 480px){
+}
+
+@media screen and (max-width: 768px){
+  .tablet-hide {
+    display: none;
+  }
+}
+
+@media screen and (max-width: 480px){
+  .mobile-hide {
+    display: none;
+  }
+}
+
+@media screen and (max-width: 480px){
+}
+
+@media screen and (max-width: 768px){
+  #content {
+    margin-left: 0;
+    max-width: 100%;
+  }
+
+  #content #content {
+    padding: 1.618em;
+  }
+
+  #content.shift {
+    position: fixed;
+    min-width: 100%;
+    left: 85%;
+    top: 0;
+    height: 100%;
+    overflow: hidden;
+  }
+}
+
+@media screen and (min-width: 1400px){
+  #content {
+    background: rgba(0,0,0,0.05);
+  }
+
+  #content {
+    background: #FCFCFC;
+  }
+}
+
+@media screen and (max-width: 768px){
+  #copyright {
+    width: 85%;
+    display: none;
+  }
+
+  #copyright.shift {
+    display: block;
+  }
+
+  img {
+    width: 100%;
+    height: auto;
+  }
+}
+
+@media screen and (max-width: 480px){
+  #content .sidebar {
+    width: 100%}
+}
+
+code {
+  background: #FFF;
+  border: solid 1px #E1E4E5;
+  font-family: monospace;
+  max-width: 100%;
+  overflow-x: auto;
+  padding: 0 5px;
+  white-space: nowrap;
+}
+
+.codeblock-example {
+  border: 1px solid #E1E4E5;
+  border-bottom: none;
+  padding: 24px;
+  padding-top: 48px;
+  font-weight: 500;
+  background: #FFF;
+  position: relative;
+}
+
+.codeblock-example:after {
+  content: "Example";
+  position: absolute;
+  top: 0px;
+  left: 0px;
+  background: #9B004F;
+  color: #FFF;
+  padding: 6px 12px;
+}
+
+.codeblock-example.prettyprint-example-only {
+  border: 1px solid #E1E4E5;
+  margin-bottom: 24px;
+}
+
+.codeblock,
+pre.src,
+#content .literal-block {
+  border: 1px solid #E1E4E5;
+  padding: 12px;
+  overflow-x: auto;
+  background: #FFF;
+  margin: 1px 0 24px 0;
+}
+
+pre.src {
+  display: block;
+  font-family: monospace;
+  font-size: 12px;
+  line-height: 1.5;
+  margin: 1px 0px 24px 0px;
+  overflow: auto;
+  padding: 12px;
+  white-space: pre;
+}
+
+.example {
+  background: #F3F6F6;
+  border: 1px solid #E1E4E5;
+  color: #404040;
+  font-size: 12px;
+  line-height: 1.5;
+  margin-bottom: 24px;
+  padding: 12px;
+}
+
+table {
+  border-collapse: collapse;
+  border-spacing: 0;
+  empty-cells: show;
+  margin-bottom: 24px;
+  border-bottom: 1px solid #E1E4E5;
+  width: 100%;
+}
+
+td {
+  vertical-align: top;
+}
+
+table td,
+table th {
+  font-size: 90%;
+  margin: 0;
+  overflow: visible;
+  padding: 8px 16px;
+  background-color: white;
+  border: 1px solid #E1E4E5;
+}
+
+table thead th {
+  font-weight: bold;
+  border-top: 3px solid #E1E4E5;
+  border-bottom: 1px solid #E1E4E5;
+}
+
+table caption {
+  color: #000;
+  font: italic 85%/1 arial,sans-serif;
+  padding: 0 0 1em 0;
+}
+
+table tr:nth-child(2n-1) td {
+  background-color: #F3F6F6;
+}
+
+table tr:nth-child(2n) td {
+  background-color: white;
+}
+
+.figure p {
+  color: #000;
+  font: italic 80%/1 verdana,sans-serif;
+  padding: 0;
+}
+
+.rotate-90 {
+  -webkit-transform: rotate(90deg);
+  -moz-transform: rotate(90deg);
+  -ms-transform: rotate(90deg);
+  -o-transform: rotate(90deg);
+  transform: rotate(90deg);
+}
+
+.rotate-270 {
+  -webkit-transform: rotate(270deg);
+  -moz-transform: rotate(270deg);
+  -ms-transform: rotate(270deg);
+  -o-transform: rotate(270deg);
+  transform: rotate(270deg);
+}
+
+#toggle-sidebar,
+#table-of-contents .close-sidebar {
+  display: none;
+}
+
+@media screen and (max-width: 768px) {
+  #table-of-contents {
+    display: none;
+    width: 60%;
+  }
+
+  #table-of-contents h2 a {
+    display: block;
+  }
+
+  #table-of-contents:target {
+    display: block;
+  }
+
+  #copyright,
+  #postamble {
+    display: none;
+  }
+
+  #toggle-sidebar {
+    background-color: #E63312;
+    display: block;
+    margin-bottom: 1.6em;
+    padding: 0.6em;
+    text-align: center;
+  }
+
+  #toggle-sidebar h2 {
+    background-color: #E63312;
+    width: 100%;
+    height: 50px;
+    left: 0;
+    top: 0;
+    color: white;
+    font-size: 100%;
+    line-height: 50px;
+    position: fixed;
+    margin: 0;
+    padding: 0;
+    opacity: 0.7;
+    z-index: 10;
+  }
+
+  #table-of-contents .close-sidebar {
+     color: rgba(255, 255, 255, 0.3);
+     display: inline-block;
+     margin: 0px 10px 0px 45px;
+     padding: 10px;
+  }
+}
+
+*{
+  -webkit-box-sizing: border-box;
+  -moz-box-sizing: border-box;
+  box-sizing: border-box;
+}
+
+figcaption,
+figure,
+footer,
+header,
+hgroup,
+nav {
+  display: block;
+}
+
+ins {
+  background: #FF9;
+  color: #000;
+  text-decoration: none;
+}
+
+mark {
+  background: #FF0;
+  color: #000;
+  font-style: italic;
+  font-weight: bold;
+}
+
+small {
+  font-size: 85%}
+
+sub,
+sup {
+  font-size: 75%;
+  line-height: 0;
+  position: relative;
+  vertical-align: baseline;
+}
+
+sup {
+  top: -0.5em;
+}
+
+sub {
+  bottom: -0.25em;
+}
+
+img {
+  -ms-interpolation-mode: bicubic;
+  vertical-align: middle;
+  max-width: 100%}
+
+svg:not(:root){
+  overflow: hidden;
+}
+
+figure {
+  margin: 0;
+}
+
+label {
+  cursor: pointer;
+}
+
+legend {
+  border: 0;
+  margin-left: -7px;
+  padding: 0;
+  white-space: normal;
+}
+
+.fa:before,
+#content .admonition-title:before,
+#content h1 .headerlink:before,
+#content h2 .headerlink:before,
+#content h3 .headerlink:before,
+#content h4 .headerlink:before,
+#content h5 .headerlink:before,
+#content h6 .headerlink:before,
+#content dl dt .headerlink:before,
+.icon:before,
+.wy-dropdown .caret:before,
+.wy-inline-validate.wy-inline-validate-success .wy-input-context:before,
+.wy-inline-validate.wy-inline-validate-danger .wy-input-context:before,
+.wy-inline-validate.wy-inline-validate-warning .wy-input-context:before,
+.wy-inline-validate.wy-inline-validate-info .wy-input-context:before,
+.wy-alert,
+#content .note,
+#content .attention,
+#content .caution,
+#content .danger,
+#content .error,
+#content .hint,
+#content .important,
+#content .tip,
+#content .warning,
+#content .seealso,
+#content .admonitiontodo,
+.btn,
+input[type="text"],
+input[type="password"],
+input[type="email"],
+input[type="url"],
+input[type="date"],
+input[type="month"],
+input[type="time"],
+input[type="datetime"],
+input[type="datetime-local"],
+input[type="week"],
+input[type="number"],
+input[type="search"],
+input[type="tel"],
+input[type="color"],
+select,
+textarea,
+#table-of-contents li.on a,
+#table-of-contents li.current > a,
+.wy-side-nav-search > a,
+.wy-side-nav-search .wy-dropdown > a,
+.wy-nav-top a {
+  -webkit-font-smoothing: antialiased;
+}
+
+.fa,
+#content .admonition-title,
+.icon {
+  display: inline-block;
+  font-family: FontAwesome;
+  font-style: normal;
+  font-weight: normal;
+  line-height: 1;
+  -webkit-font-smoothing: antialiased;
+  -moz-osx-font-smoothing: grayscale;
+}
+
+.fa-ul {
+  padding-left: 0;
+  margin-left: 2.14286em;
+  list-style-type: none;
+}
+
+.fa-ul > li {
+  position: relative;
+}
+
+.fa-li {
+  position: absolute;
+  left: -2.14286em;
+  width: 2.14286em;
+  top: 0.14286em;
+  text-align: center;
+}
+
+.fa-li.fa-lg {
+  left: -1.85714em;
+}
+
+.fa-border {
+  padding:.2em .25em .15em;
+  border: solid 0.08em #EEE;
+  border-radius:.1em;
+}
+
+.fa,
+#content .admonition-title {
+  font-family: inherit;
+}
+
+.fa:before,
+#content .admonition-title:before {
+  font-family: "FontAwesome";
+  display: inline-block;
+  font-style: normal;
+  font-weight: normal;
+  line-height: 1;
+  text-decoration: inherit;
+}
+
+a .fa,
+a #content .admonition-title,
+#content a .admonition-title {
+  display: inline-block;
+  text-decoration: inherit;
+}
+
+.nav #content .admonition-title,
+#content .nav .admonition-title,
+.nav .icon {
+  display: inline;
+}
+
+.wy-alert,
+#content .note,
+#content .attention,
+#content .caution,
+#content .danger,
+#content .error,
+#content .hint,
+#content .important,
+#content .tip,
+#content .warning,
+#content .seealso,
+#content .admonitiontodo {
+  padding: 12px;
+  line-height: 16pt;
+  margin-bottom: 24px;
+}
+
+.wy-alert-title,
+#content .admonition-title {
+  color: #FFF;
+  font-weight: bold;
+  display: block;
+  color: #FFF;
+  padding: 6px 12px;
+  margin-bottom: 0px;
+}
+
+#content .danger,
+#content .error {
+  background: #FDF3F2;
+}
+
+.wy-alert.wy-alert-warning,
+#content .wy-alert-warning.note,
+#content .attention,
+#content .caution,
+#content .wy-alert-warning.danger,
+#content .wy-alert-warning.error,
+#content .wy-alert-warning.hint,
+#content .wy-alert-warning.important,
+#content .wy-alert-warning.tip,
+#content .warning,
+#content .wy-alert-warning.seealso,
+#content .admonitiontodo {
+  background: #FFEDCC;
+}
+
+#content .admonition-title.note:before,
+#content .admonition-title.seealso:before,
+#content .admonition-title.warning:before,
+#content .admonition-title.caution:before,
+#content .admonition-title.attention:before,
+#content .admonition-title.tip:before,
+#content .admonition-title.hint:before,
+#content .admonition-title.important:before,
+#content .admonition-title.error:before,
+#content .admonition-title.danger:before {
+  font-family: FontAwesome;
+  content: "";}
+
+#content .note,
+#content .seealso {
+  background: #E7F2FA;
+}
+
+.wy-alert p:last-child,
+#content .note p:last-child,
+#content .attention p:last-child,
+#content .caution p:last-child,
+#content .danger p:last-child,
+#content .error p:last-child,
+#content .hint p:last-child,
+#content .important p:last-child,
+#content .tip p:last-child,
+#content .warning p:last-child,
+#content .seealso p:last-child,
+#content .admonitiontodo p:last-child {
+  margin-bottom: 0;
+}
+
+#content .admonition-title.tip,
+#content .admonition-title.important,
+#content .admonition-title.hint {
+  line-height: 1;
+  background: #1ABC9C;
+}
+
+#content .important,
+#content .tip,
+#content .hint {
+  background: #DBFAF4;
+}
+
+#content .admonition-title.note,
+#content .admonition-title.seealso {
+  line-height: 1;
+  background: #6AB0DE;
+}
+
+#content .admonition-title.warning,
+#content .admonition-title.caution,
+#content .admonition-title.attention {
+  line-height: 1;
+  background: #F0B37E;
+}
+
+#content .admonition-title.error,
+#content .admonition-title.danger {
+  line-height: 1;
+  background: #F29F97;
+}
+
+legend {
+  display: block;
+  width: 100%;
+  border: 0;
+  padding: 0;
+  white-space: normal;
+  margin-bottom: 24px;
+  font-size: 150%;
+  *margin-left: -7px;
+}
+
+label {
+  font: italic 85%/1 arial,sans-serif;
+  color: #000000;
+  text-align: center;
+  padding-bottom: 1em;
+  display: block;
+}
+
+a {
+  color: #E63312;
+  text-decoration: none;
+  cursor: pointer;
+}
+
+
+a:hover,
+a:active {
+  outline: 0;
+}
+
+a:hover {
+  color: #1488CA;
+}
+
+a:visited {
+  color: #9B004F;
+}
+
+.left {
+  text-align: left;
+}
+
+.center {
+  text-align: center;
+}
+
+.right {
+  text-align: right;
+}
+
+hr {
+  display: block;
+  height: 1px;
+  border: 0;
+  border-top: 1px solid #E1E4E5;
+  margin: 24px 0;
+  padding: 0;
+}
+
+#table-of-contents li {
+  list-style: none;
+  margin-left: 0px;
+}
+
+#table-of-contents header {
+  height: 32px;
+  display: inline-block;
+  line-height: 32px;
+  padding: 0 1.618em;
+  display: block;
+  font-weight: bold;
+  text-transform: uppercase;
+  font-size: 80%;
+  color: #E63312;
+  white-space: nowrap;
+}
+
+#table-of-contents code,
+#table-of-contents .tag {
+  font-size: 10pt;
+}
+
+#table-of-contents .tag span {
+  padding: 0 5px;
+}
+
+#table-of-contents ul {
+  margin-bottom: 0;
+}
+
+#table-of-contents li.divide-top {
+  border-top: solid 1px #404040;
+}
+
+#table-of-contents li.divide-bottom {
+  border-bottom: solid 1px #404040;
+}
+
+#table-of-contents li.current {
+  background: #E3E3E3;
+}
+
+#table-of-contents li.current a {
+  color: gray;
+  border-right: solid 1px #C9C9C9;
+  padding: 0.4045em 2.427em;
+}
+
+#table-of-contents li.current a:hover {
+  background: #D6D6D6;
+}
+
+#table-of-contents li a {
+  padding: 0.4045em 1.618em;
+  position: relative;
+  border: none;
+  padding-left: 1.618em -4px;
+}
+
+#table-of-contents li.on a:hover,
+#table-of-contents li.current > a:hover {
+  background: #FCFCFC;
+}
+
+#table-of-contents li ul li a {
+  padding: 0.4045em 2.427em;
+}
+
+#table-of-contents li ul li ul li a {
+  padding: 0.4045em 3.236em;
+}
+
+#table-of-contents li.current ul {
+  display: block;
+}
+
+#table-of-contents .local-toc li ul {
+  display: block;
+}
+
+#table-of-contents li ul li a {
+  margin-bottom: 0;
+  color: #B3B3B3;
+  font-weight: normal;
+}
+
+#table-of-contents a {
+  display: inline-block;
+  line-height: 18px;
+  padding: 0.4045em 1.618em;
+  display: block;
+  position: relative;
+  font-size: 10pt;
+  color: #B3B3B3;
+  direction: ltr;
+}
+
+#table-of-contents a:hover {
+  background-color: #4E4A4A;
+  cursor: pointer;
+}
+
+#table-of-contents {
+  text-align: left;
+  position: fixed;
+  top: 0;
+  left: 0;
+  width: 300px;
+  overflow-x: hidden;
+  overflow-y: scroll;
+  height: 100%;
+  background: #343131;
+  z-index: 200;
+  scrollbar-base-color: #1F1D1D;
+  scrollbar-arrow-color: #B3B3B3;
+  scrollbar-shadow-color: #1F1D1D;
+  scrollbar-track-color : #343131;
+}
+
+#table-of-contents h2 {
+  z-index: 200;
+  background-color: #E63312;
+  background-image: url('inria_logo.png');
+  background-position: center top;
+  background-repeat: no-repeat;
+  text-align: center;
+  padding: 55px 0.809em 0.809em 0.809em;
+  display: block;
+  color: #FCFCFC;
+  font-size: 100%;
+  margin-bottom: 0.809em;
+}
+
+ul.nav li ul li {
+  display: none;
+}
+
+ul.nav li ul li ul li {
+  display: none;
+}
+
+ul.nav li.active ul li {
+  display: inline;
+}
+
+ul.nav li.active ul li ul li {
+  display: inline;
+}
+
+ul.nav li.active ul li a {
+  background-color: #E3E3E3;
+  color: #8099B0;
+  border-right: solid 1px #C9C9C9 !important;
+}
+
+ul.nav li.active ul li.active a {
+  background-color: #C9C9C9;
+  color: black !important;
+  font-weight: bold !important;
+}
+
+ul.nav li.active ul li.active ul li.active a {
+  color: black !important;
+  font-weight: bold !important;
+  display: block !important;
+}
+
+ul.nav li.active ul li.active ul li a {
+  color: #808080 !important;
+  font-weight: normal !important;
+  display: block !important;
+}
+
+ul.nav li.active ul li ul li a {
+  display: none !important;
+}
+
+ul.nav li ul li ul li ul li {
+  /* as long as nav is on multiple levels of ul */
+  display: none !important;
+}
+
+ul.nav li.active > a {
+  /* XXX Restrict it to 2nd level */
+  border-bottom: solid 1px #C9C9C9 !important;
+  border-right: solid 1px #C9C9C9 !important;
+}
+
+ul.nav li.active a {
+  color: gray !important;
+  font-weight: bold;
+  background-color: white;
+  border-right: solid 0px white !important;
+}
+
+ul.nav > li.active > a {
+  color: black !important;
+}
+
+footer {
+  color: #999;
+}
+
+footer p {
+  margin-bottom: 12px;
+}
+
+#copyright,
+#postamble {
+  position: fixed;
+  bottom: 0;
+  left: 0;
+  width: 300px;
+  color: #FCFCFC;
+  background: #1F1D1D;
+  border-top: solid 10px #343131;
+  font-family: "Verdana", sans-serif;
+  font-size: 10pt;
+  z-index: 400;
+  padding: 12px;
+  text-align: left;
+}
+
+#postamble .author {
+  margin-bottom: 0px;
+}
+
+#postamble .author code {
+  color: #404040;
+  font-size: 10pt;
+}
+
+#postamble .date {
+  margin-bottom: 0px;
+  color: #1488CA;
+}
+
+#postamble .creator,
+#postamble .validation {
+  display: none;
+}
+
+#copyright a {
+  color: #E63312;
+  text-decoration: none;
+}
+
+#copyright .rst-current-version {
+  padding: 12px;
+  background-color: #272525;
+  display: block;
+  text-align: right;
+  font-size: 90%;
+  cursor: pointer;
+  color: #1488CA;
+  *zoom: 1;
+}
+
+#content img {
+  max-width: 100%;
+}
+
+#content div.figure {
+  margin: 0;
+  padding: 0 1em 0 1em;
+}
+
+#content div.figure.align-center {
+  text-align: center;
+}
+
+#content .section > img,
+#content .section > a > img {
+  margin-bottom: 24px;
+}
+
+.verse {
+  border-left: 5px solid #6AB0DE;
+  background-color: #E7F2FA;
+  padding: 6px 20px;
+  font-style: italic;
+}
+
+#content .note .last,
+#content .attention .last,
+#content .caution .last,
+#content .danger .last,
+#content .error .last,
+#content .hint .last,
+#content .important .last,
+#content .tip .last,
+#content .warning .last,
+#content .seealso .last,
+#content .admonitiontodo .last {
+  margin-bottom: 0;
+}
+
+#content .admonition-title:before {
+  margin-right: 4px;
+}
+
+#content .section ol p,
+#content .section ul p {
+  margin-bottom: 12px;
+}
+
+#content h1 .headerlink,
+#content h2 .headerlink,
+#content h3 .headerlink,
+#content h4 .headerlink,
+#content h5 .headerlink,
+#content h6 .headerlink,
+#content dl dt .headerlink {
+  display: none;
+  visibility: hidden;
+  font-size: 14px;
+}
+
+#content h1 .headerlink:after,
+#content h2 .headerlink:after,
+#content h3 .headerlink:after,
+#content h4 .headerlink:after,
+#content h5 .headerlink:after,
+#content h6 .headerlink:after,
+#content dl dt .headerlink:after {
+  visibility: visible;
+  content: "";
+  font-family: FontAwesome;
+  display: inline-block;
+}
+
+#content h1:hover .headerlink,
+#content h2:hover .headerlink,
+#content h3:hover .headerlink,
+#content h4:hover .headerlink,
+#content h5:hover .headerlink,
+#content h6:hover .headerlink,
+#content dl dt:hover .headerlink {
+  display: inline-block;
+}
+
+#content .sidebar {
+  float: right;
+  width: 40%;
+  display: block;
+  margin: 0 0 24px 24px;
+  padding: 24px;
+  background: #F3F6F6;
+  border: solid 1px #E1E4E5;
+}
+
+#content .sidebar p,
+#content .sidebar ul,
+#content .sidebar dl {
+  font-size: 90%}
+
+#content .sidebar .last {
+  margin-bottom: 0;
+}
+
+#content .sidebar .sidebar-title {
+  display: block;
+  font-family: "Verdana", sans-serif;
+  font-weight: bold;
+  background: #E1E4E5;
+  padding: 6px 12px;
+  margin: -24px;
+  margin-bottom: 24px;
+  font-size: 100%;
+}
+
+#content .highlighted {
+  background: #F1C40F;
+  display: inline-block;
+  font-weight: bold;
+  padding: 0 6px;
+}
+
+#content .footnote-reference,
+#content .citation-reference {
+  vertical-align: super;
+  font-size: 90%}
+
+span[id*='MathJax-Span']{
+  color: #404040;
+}
+
+.math {
+  text-align: center;
+}
+
+#footnotes {
+  border-top: 1px solid #E1E4E5;
+  padding-top: 36px;
+}
+
+h2.footnotes {
+  display: none;
+}
+
+.footnum,
+.footref {
+  color: #E63312;
+  font-size: 10pt;
+  font-family: "Verdana", sans-serif;
+}
+
+.footnum:before,
+.footref:before {
+  content: "[";
+}
+
+.footnum:after,
+.footref:after {
+  content: "]";
+}
+
+.footpara {
+  color: #999;
+  font-size: 90%;
+  font-family: "Verdana", sans-serif;
+  padding-bottom: 8px;
+  padding-left: 16px;
+  padding-right: 16px;
+  padding-top: 8px;
+  line-height: 1.25em;
+}
+
+.todo {
+  background-color: #F29F97;
+  padding: 0px 4px;
+  color: #FFF;
+}
+
+.WAIT,
+.nilWAIT {
+  background-color: #6AB097;
+}
+
+.done {
+  background-color: #6AB0DE;
+  padding: 0px 4px;
+  color: #FFF;
+}
+
+.tag {
+  background-color: inherit;
+}
+
+.tag span {
+  background-color: #EDEDED;
+  border: 1px solid #EDEDED;
+  color: #939393;
+  cursor: pointer;
+  display: block;
+  float: right;
+  font-size: 80%;
+  font-weight: normal;
+  margin: 0 3px;
+  padding: 3px 5px;
+}
+
+.tag .FLAGGED {
+  background-color: #DB2D27;
+  border: 1px solid #DB2D27;
+  color: white;
+  font-weight: bold;
+}
+
+.timestamp {
+  font-family: monospace;
+  font-size: 90%;
+  color: navy;
+}
+
+.nav .timestamp {
+  color: inherit;
+}
+
+.inlinetask {
+  background: #FFF9E3;
+  border: 3px solid #FFEB8E;
+  padding: 9px 12px;
+  margin-bottom: 24px;
+  font-family: "Verdana", sans-serif;
+}
diff --git a/theme-readtheorginria-system.setup b/theme-readtheorginria-system.setup
new file mode 100644
index 0000000..f288a5b
--- /dev/null
+++ b/theme-readtheorginria-system.setup
@@ -0,0 +1,9 @@
+# -*- mode: org; -*-
+
+#+HTML_HEAD: <link rel="stylesheet" type="text/css" href="readtheorginria/css/htmlize.css"/>
+#+HTML_HEAD: <link rel="stylesheet" type="text/css" href="readtheorginria/css/readtheorginria-system.css"/>
+
+#+HTML_HEAD: <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
+#+HTML_HEAD: <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js"></script>
+#+HTML_HEAD: <script type="text/javascript" src="lib/js/jquery.stickytableheaders.min.js"></script>
+#+HTML_HEAD: <script type="text/javascript" src="readtheorginria/js/readtheorginria.js"></script>
-- 
GitLab