book.css

/* This .css file is directly adapted from the work of Michael Clark.
If you like it, please check their work at https://m-clark.github.io/ ! */

@import url("https://fonts.googleapis.com/css?family=Roboto|Livvic|Roboto+Mono|Roboto+Condensed|Lato|Lora|Fira+Sans");

/* Defines variables for colors */
:root {
  --accentColor: #4AAD52;
  --linkColor: #4FB0C6;
  --LinkAnimationColor : #E09F3E;
  --fontTitle : Livvic ;
  --fontBody : "Open sans" ;
}

/* title page */
.book .book-body .page-wrapper .page-inner section.normal h1.title {
  font-size: 250%;
  font-family: 'Roboto Condensed', Lora, Lato, Roboto, sans;
  font-style: normal;
  font-weight: 100;
}

.book .book-body .page-wrapper .page-inner section.normal .author .noem {
  display: block;
  margin: 0 0 10px 0;
  font-size:  125%;
  font-style:  normal;
  font-variant:  small-caps;
  font-weight: 200;
  font-family: 'Roboto Condensed', 'Fira Sans', Roboto, 'Open Sans', sans;
}

.book .book-body .page-wrapper .page-inner section.normal a.uri {
  display: block;
  margin: 0 0 10px 0;
  font-size:  75%;
  font-style:  normal;       /* ignored thanks to bootstrap random enforcement of em*/
  font-variant:  small-caps;
  font-family:  Roboto, 'Open Sans', sans;
}

.book .book-body .page-wrapper .page-inner section.normal h4.date {
  font-style: normal;
  font-size:  100%;
  font-family: var(--fontBody), 'Open Sans', sans;
}

/* main */

.book  {
  background-color: #fffff8;
}

.section {
  background-color: #fffff8;
}

.book .book-body .page-wrapper .page-inner section.normal {
    display: block;
    background-color: #fffff8;
    color: #585858;
    padding: 5px 15px;
    font-family: Roboto, 'Helvetica Neue', sans-serif;
    width: 150%;
    word-wrap: break-word;
    overflow: hidden;
    line-height: 1.7;
    text-size-adjust: 100%;
    -ms-text-size-adjust: 100%;
    -webkit-text-size-adjust: 100%;
    -moz-text-size-adjust: 100%;
}

.book .book-body {
    background: #fffff8;
    -webkit-transition: left 250ms ease;
    -moz-transition: left 250ms ease;
    -o-transition: left 250ms ease;
    transition: left 250ms ease;
}

/* Horizontal line with right width */

hr {
    width: 60%;
}

/* Removes the font settings button */
.font-settings
{
	display : none;
}

/* img */

img {
  display: block;
  margin: 0 auto;
}

.arc {
  display: block;
  width:30%;
  padding:5px 0;
  margin: 0 0 10px 0;
}

.cscar {
  display: block;
  width:21%;
  padding:5px 0;
  margin: 0 0 10px 0;
}

/* zoom for img*/
.zoom {
    transition: all .3s;
}

.zoom:hover {
    transform: scale(1.5); /* (150% zoom - Note: if the zoom is too large, it will go outside of the viewport) */
}

/* link effects */
.book .book-body .page-wrapper .page-inner section.normal a {
    color: var(--linkColor);
    background-image: linear-gradient(180deg,transparent 90%, var(--LinkAnimationColor) 0);
    background-size: 0 100%;
    background-repeat: no-repeat;
    text-decoration: none;
    -webkit-transition: background-size .4s ease;
    -moz-transition: background-size .4s ease;
    -ms-transition: background-size .4s ease;
    -o-transition: background-size .4s ease;
    transition: background-size .4s ease;
    border-bottom: 0px solid;
}

.book .book-body .page-wrapper .page-inner section.normal a:hover {
  text-decoration: none;
    background-size: 100% 100%;
    cursor: pointer;
}

.body-inner {
    background-color: #fffff8;
}

.book .book-body .page-wrapper {
    position: relative;
    outline: 0;
    background-color: #fffff8;
}

.book .book-body .page-wrapper .page-inner {
    max-width: 900px;
    margin: 0 auto;
    padding: 20px 0 40px;
}

.book .book-header {
    overflow: visible;
    height: 48px;    /* adjust to match title space*/
    padding: 0 8px;
    z-index: 2;
    font-family: Roboto sans-serif;
    font-size: .85em;
    color: #7e888b;
    background-color: #fffff8;
    /* background: 0 0; */
}

/* only way to set bgcolor of top bar?*/
.book-body.fixed {
  background-color: #fffff8;
}

/* Rather than resize the header, just get rid of line */
.book.with-summary .book-header.fixed {
  background-color: #fffff8;
  font-variant: small-caps;
  /*font-family: Stalemate Roboto Sans; ignored as all it is doing is taking from index title*/
  border-bottom: 0 solid rgba(0,0,0,.07);  /*just remove it; this makes height in .book-header above moot*/
  border-bottom-width: 0;
  border-bottom-style: solid;
  border-bottom-color: rgba(0, 0, 0, 0.07);
}

i {
  background-color: #fffff8;
}

/* toc area general */
.book .book-summary {
    position: absolute;
    font-family: var(--fontBody), "Open Sans", 'Helvetica Neue', Roboto, sans-serif;
    top: 0;
    left: -300px;
    bottom: 0;
    z-index: 1;
    width: 300px;
    color: #364149;  /**/
    background: #f5f5f540; /* #eaf5fb;  #d9edf7#bdcadb #3572D9 #fafafa*/
    border-right: 1px solid rgba(0,0,0,.07);
    -webkit-transition: left 250ms ease;
    -moz-transition: left 250ms ease;
    -o-transition: left 250ms ease;
    transition: left 250ms ease;
}

/* nav/menu area */
.book .book-summary ul.summary li a, .book .book-summary ul.summary li span {
    display: block;
    padding: 10px 25px;
    border-bottom: none;
    color: #364149; /**/
    background: 0 0;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    position: relative;
    font-family: Lato,'Roboto Condensed', sans;
    /* font-variant: small-caps; */
}


.book .book-summary ul.summary li a:hover, .book .book-summary ul.summary li.active>a {
  color: #fffff8;  /*#6197D5*/
  background-color: var(--accentColor);
}

/* so that before and after aren't treated the same as the toc, because why would they? */
.book .book-summary ul.summary li.before a {
  color: var(--accentColor);
  text-decoration: none;
  font-size: 125%;
  font-variant: small-caps;
  font-family: 'Roboto Condensed', 'Helvetica Neue', 'Open Sans', Roboto, sans-serif;
  font-weight: 500;
}


.book .book-summary ul.summary li.before a:hover,
.book .book-summary ul.summary li.before li.active>a {
  color: #fffff8;  /*#6197D5*/
  background-color: var(--accentColor);
  text-decoration: none;
}

.book .book-summary ul.summary li.after a, .book .book-summary ul.summary li.after a:hover {
  background-color: transparent;
}

/* divider line for the title before and other stuff  after toc */
.book .book-summary ul.summary li.divider{
    height:1px;
    margin:7px 0;
    overflow:hidden;
    background:rgba(0,0,0,.07)
}

.book .book-body .page-wrapper .page-inner section.normal pre {
    overflow: auto;
    word-wrap: normal;
    width: 60%;
    margin: 0 0 1.275em;
    padding: .85em 1em;
    background: #fafafa;
}


.book .book-body .page-wrapper .page-inner section.normal code,
.book .book-body .page-wrapper .page-inner section.normal pre {
    font-family: 'Roboto Mono', Monaco, Consolas, "Liberation Mono", Menlo, 'Courier New', monospace;
    direction: ltr;
    border: none;
    color: inherit;
}

.book .book-body .page-wrapper .page-inner section.normal .note {
  background-color: #fafafa;
  /*background-image: url('../img/R.ico');*/
  font-size: 80% ;
  margin: auto;
  font-weight: 500;
  max-width: 75%;
  border-width: 10px;
  border-color: #bfbfbf;
  box-shadow: 10px 10px 5px #EBEBEB; /*#888888*/
  padding: 1em;
}

/* headers */

h1, h2, h3, h4, h5 {
  color:var(--accentColor);
  font-family: 'Roboto Condensed';
  font-weight: bolder;
  width: 60%;
}

/* notes */

.img-note {
  vertical-align: central;
  width: 2em;
}

.footnotes {
  color: #00000080;
}


.book .book-body .page-wrapper .page-inner section.normal dl,
.book .book-body .page-wrapper .page-inner section.normal ol,
.book .book-body .page-wrapper .page-inner section.normal p,
.book .book-body .page-wrapper .page-inner section.normal ul {
    margin-top: 0;
    margin-bottom: .85em;
    width: 60%;                 /*fiddle with this relative to marginnote; div.sourceCode should be the same*/
}

/* Taking care of sub-lists, because width: 60% for ul accumulates
across sublists ! */ 

ul ul {    
	position:relative;
	width: 100% !important;
}

ul ul ul {    
	position:relative;
	width: 100% !important;
}

/* Also the case for numbered lists*/

li p {    
	position:relative;
	width: 100% !important;
}


/* taken out of the above */
.book .book-body .page-wrapper .page-inner section.normal blockquote {
 font-size: 80%;
}

/* marginnote, sidenotes, footnotes */
.book .book-body .page-wrapper .page-inner section.normal .marginnote span.mjx-chtml, span.mjx-block {
    display: block;
    font-size: 80%;
}

.book .book-body .page-wrapper .page-inner section.normal .footnotes p, ol {
  width: 100%;
  font-size: 90%;
}

.book .book-body .page-wrapper .page-inner section.normal .marginnote {
  float: right;
  clear: right;
  margin-right: -45%;
  width: 40%;
  margin-top: 0;
  margin-bottom: 0;
  padding-bottom: 5px;
  font-size: 75%;
  line-height: 1.4;
  vertical-align: baseline;
  position: relative;
}

/* code */

/* logical NA */
.ot {
 color: #337ab7;
}

/* char/string */
.ch, .st {
 color: #aa5500;
}

/* args */
.dt {

}

/* package */
code span.st {
 color: #aa5500;
}

/* float, other */
.fl, .dv {
 color: #23527c;
}

/* override pygments setting code to a tag */
.book .book-body .page-wrapper .page-inner section.normal pre code a {
  color: #585858;
}

/* creative commons, github icons */
.fab .fa-creative-commons, .fa-creative-commons-sa, .fa-creative-commons-by, .fa-github, .fa-lg {
  color: var(--accentColor);
  background-color: transparent;
}

/* text highlights */
.emph {
  color: #E32D00 ;  /*#ff5500 #D14300*/
  font-weight: 500;
}

/* pack func and objclass colors initially come from hcl(seq(90,360, length.out=4), c=80, l=80); redone for contrast*/
.pack {
  color: #990071; /*#AC9CFF #e41a1c*/
  font-weight: 500;
}

.func {
  color: #007020;   /*#007199 #00CBB6; #984ea3; can just use `` instead*/
  font-weight: bold;
}

.objclass {
  color:  #947100;  /*#AAB400 #4daf4a; #FFC5D0*/
  font-weight: 500;
}

/* tables */

.book .book-body .page-wrapper .page-inner section.normal table {
  max-width: 35%;
  margin-left: 7.5%;
  font-size: 75%;
}

.book .book-body .page-wrapper .page-inner section.normal table tr:nth-child(2n) {
    background-color: white;
}

div.datatables {
    margin-left: auto;     /* to center them when full is not necessary. */
    margin-right: auto;
}