@font-face {
    font-family: 'Source Serif Pro';
    font-style: normal;
    font-weight: 400;
    src: url(source_serif_pro.woff2) format('woff2');
    unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+2000-206F, U+2074, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
}



html {
    font-family: "Source Serif Pro", serif;
    font-size:110%;

    margin: 0;
    width: 100vw;
    height: 100vh;
}

body {
    margin: 0;
    margin-bottom: 1.5em;
}

a {
    text-decoration: none;
    color: rgb(13, 81, 172);
}

h1, h2, h3, h4 {
    color:#ba3925;
    font-weight:lighter;
}

h3 {
    margin-top: 2.5em;
}


/* Table of content */
#table-of-content {
    position: fixed;
    overflow: auto;
    height: 100%;
    left: 0;
    top: 0;
    width: 250px;
    border-right: 1px solid black;
    background-color: #f8f8f7;
    font-size: 0.8em;
}



#table-of-content ul {
    list-style-type: none;
    margin:2em;
    margin-top: 3em;
    padding:0;
}

#table-of-content a,
#navigator-top a {
    color: rgb(1, 7, 97);
}


.iframe-resizable {
    height: 500px;
    width: 800px;
    overflow: hidden;
    resize: both;
}



/* To surround all main content to be centered */
#main-content {
    text-align: justify;
    max-width: 1200px;
    margin: auto;
}

#main-content-margin {
    margin-left: 260px;
    margin-right: 20px;
}



/* Top navigation with previous and next */
#navigator-top {
    position: sticky;
    top: 0;
    background-color: rgba(255, 255, 255, 0.85);
    font-style: italic;
    padding-top: 0.5em;
    border-bottom: 1px solid gray;
    font-size: 0.8em;
    line-height: 1.2em;
    width: 100%;
}

/* Previous element on the left */
.navigator-element-previous{
    float: left;
}

/* Next element on the right */
.navigator-element-next {
    float: right;
}

/* Clear after previous and next links */
.clear-float {
    clear:both;
}


/*Hack for the footnotes*/
#footnotes {
    margin-left: 280px;
    margin-right: 20px;
    font-size: 0.8em;
}

@media (max-width: 600px) {
    #table-of-content {
        display: none;
    }
    #main-content-margin {
        margin-left: 20px;
        margin-right: 20px;
    }
    #footnotes {
        margin-left: 20px;
        margin-right: 20px;
    }
}


/** Wrap word in code */
pre {
    white-space: pre-wrap;
    margin: 0;
    padding: 1.5em;
}


#page-number {
    position: fixed;
    top: 0.5em;
    left: 200px;
    color: rgb(1, 7, 97);
    font-style: italic;
    background-color: rgba(248,248,246,0.8);
}


blockquote {
    border: 2px solid rgb(230,230,230);
    background-color: rgb(240,240,240);
    color: rgb(150,50,50);
    padding-left: 1em;
    padding-right: 1em;
    font-style: italic;
    border-radius: 1em;
}


.center {
    text-align: center;
}

.border img {
    border: 1px solid black;
    box-shadow: 4px 4px 3px 0px #888888;
}


.level_0 {
    display: inline-block;
    margin-bottom: 0.5em;
}

.level_1 {
    display: inline-block;
    margin-left: 1.5em;
}

.level_2 {
    display: inline-block;
    margin-left: 2.5em;
}

.created-page ul{
    list-style-type: none;
}


code {
    font-family: 'Source Serif Pro';
    font-style: normal;
    background-color: #f0f0f0;
    padding-left: 2px;
    padding-right: 2px;
}



/********************************************/
/**              CodeRay                    */
/********************************************/

.CodeRay code {
    background-color: #f9f9f9;
    font-family: monospace;
    color: #000;
    font-size: 1.1em;
}

span.CodeRay {
    white-space: pre;
    border: 0px;
    padding: 2px
}

table.CodeRay {
    border-collapse: collapse;
    width: 100%;
    padding: 2px
}

table.CodeRay td {
    padding: 1em 0.5em;
    vertical-align: top;
}

.CodeRay .line-numbers {
    border-right: 1px solid #d8d8d8;
    padding: 0 0.5em 0 .25em
}

.CodeRay span.line-numbers {
    display: inline-block;
    margin-right: .5em;
    color: rgba(0, 0, 0, .3)
}

.CodeRay .line-numbers strong {
    color: rgba(0, 0, 0, .4)
}

table.CodeRay {
    border-collapse: separate;
    border-spacing: 0;
    margin-bottom: 0;
    border: 0;
    background: none
}

table.CodeRay td {
    vertical-align: top;
    line-height: 1.45
}

table.CodeRay td.line-numbers {
    text-align: right
}

table.CodeRay td.line-numbers>pre {
    padding: 0;
    color: rgba(0, 0, 0, .3)
}

table.CodeRay td.code {
    padding: 0 0 0 .5em
}

table.CodeRay td.code>pre {
    padding: 0
}

.CodeRay .debug {
    color: #fff !important;
    background: #000080 !important
}

.CodeRay .annotation {
    color: #007
}

.CodeRay .attribute-name {
    color: #000080
}

.CodeRay .attribute-value {
    color: #700
}

.CodeRay .binary {
    color: #509
}

.CodeRay .comment {
    color: #79A;
    font-style: italic
}

.CodeRay .char {
    color: #04d
}

.CodeRay .char .content {
    color: #04d
}

.CodeRay .char .delimiter {
    color: #039
}

.CodeRay .class {
    color: #458;
    font-weight: bold
}

.CodeRay .complex {
    color: #a08
}

.CodeRay .constant, .CodeRay .predefined-constant {
    color: #008080
}

.CodeRay .color {
    color: #099
}

.CodeRay .class-variable {
    color: #369
}

.CodeRay .decorator {
    color: #b0b
}

.CodeRay .definition {
    color: #099
}

.CodeRay .delimiter {
    color: #000
}

.CodeRay .doc {
    color: #970
}

.CodeRay .doctype {
    color: #34b
}

.CodeRay .doc-string {
    color: #d42
}

.CodeRay .escape {
    color: #666
}

.CodeRay .entity {
    color: #800
}

.CodeRay .error {
    color: #808
}

.CodeRay .exception {
    color: inherit
}

.CodeRay .filename {
    color: #099
}

.CodeRay .function {
    color: #900;
    font-weight: bold
}

.CodeRay .global-variable {
    color: #008080
}

.CodeRay .hex {
    color: #058
}

.CodeRay .integer, .CodeRay .float {
    color: #099
}

.CodeRay .include {
    color: #555
}

.CodeRay .inline {
    color: #000
}

.CodeRay .inline .inline {
    background: #ccc
}

.CodeRay .inline .inline .inline {
    background: #bbb
}

.CodeRay .inline .inline-delimiter {
    color: #d14
}

.CodeRay .inline-delimiter {
    color: #d14
}

.CodeRay .important {
    color: #555;
    font-weight: bold
}

.CodeRay .interpreted {
    color: #b2b
}

.CodeRay .instance-variable {
    color: #008080
}

.CodeRay .label {
    color: #970
}

.CodeRay .local-variable {
    color: #963
}

.CodeRay .octal {
    color: #40e
}

.CodeRay .predefined {
    color: #369
}

.CodeRay .preprocessor {
    color: #579
}

.CodeRay .pseudo-class {
    color: #555
}

.CodeRay .directive {
    font-weight: bold
}

.CodeRay .type {
    font-weight: bold
}

.CodeRay .predefined-type {
    color: inherit
}

.CodeRay .reserved, .CodeRay .keyword {
    color: #000;
    font-weight: bold
}

.CodeRay .key {
    color: #808
}

.CodeRay .key .delimiter {
    color: #606
}

.CodeRay .key .char {
    color: #80f
}

.CodeRay .value {
    color: #088
}

.CodeRay .regexp .delimiter {
    color: #808
}

.CodeRay .regexp .content {
    color: #808
}

.CodeRay .regexp .modifier {
    color: #808
}

.CodeRay .regexp .char {
    color: #d14
}

.CodeRay .regexp .function {
    color: #404;
    font-weight: bold
}

.CodeRay .string {
    color: #d20
}

.CodeRay .string .string .string {
    background: #ffd0d0
}

.CodeRay .string .content {
    color: #d14
}

.CodeRay .string .char {
    color: #d14
}

.CodeRay .string .delimiter {
    color: #d14
}

.CodeRay .shell {
    color: #d14
}

.CodeRay .shell .delimiter {
    color: #d14
}

.CodeRay .symbol {
    color: #990073
}

.CodeRay .symbol .content {
    color: #a60
}

.CodeRay .symbol .delimiter {
    color: #630
}

.CodeRay .tag {
    color: #008080
}

.CodeRay .tag-special {
    color: #d70
}

.CodeRay .variable {
    color: #036
}

.CodeRay .insert {
    background: #afa
}

.CodeRay .delete {
    background: #faa
}

.CodeRay .change {
    color: #aaf;
    background: #007
}

.CodeRay .head {
    color: #f8f;
    background: #505
}

.CodeRay .insert .insert {
    color: #080
}

.CodeRay .delete .delete {
    color: #800
}

.CodeRay .change .change {
    color: #66f
}

.CodeRay .head .head {
    color: #f4f
}




.pygments code {
    background-color: #f9f9f9;
    font-family: monospace;
    color: #000;
    font-size: 1.1em;
}

.listingblock .pygments .hll { background-color: #ffffcc }
.listingblock .pygments, .listingblock .pygments code { background: #f8f8f8; }
.listingblock .pygments .tok-c { color: #408080; font-style: italic } /* Comment */
.listingblock .pygments .tok-err { border: 1px solid #FF0000 } /* Error */
.listingblock .pygments .tok-k { color: #008000; font-weight: bold } /* Keyword */
.listingblock .pygments .tok-o { color: #666666 } /* Operator */
.listingblock .pygments .tok-ch { color: #408080; font-style: italic } /* Comment.Hashbang */
.listingblock .pygments .tok-cm { color: #408080; font-style: italic } /* Comment.Multiline */
.listingblock .pygments .tok-cp { color: #BC7A00 } /* Comment.Preproc */
.listingblock .pygments .tok-cpf { color: #408080; font-style: italic } /* Comment.PreprocFile */
.listingblock .pygments .tok-c1 { color: #408080; font-style: italic } /* Comment.Single */
.listingblock .pygments .tok-cs { color: #408080; font-style: italic } /* Comment.Special */
.listingblock .pygments .tok-gd { color: #A00000 } /* Generic.Deleted */
.listingblock .pygments .tok-ge { font-style: italic } /* Generic.Emph */
.listingblock .pygments .tok-gr { color: #FF0000 } /* Generic.Error */
.listingblock .pygments .tok-gh { color: #000080; font-weight: bold } /* Generic.Heading */
.listingblock .pygments .tok-gi { color: #00A000 } /* Generic.Inserted */
.listingblock .pygments .tok-go { color: #888888 } /* Generic.Output */
.listingblock .pygments .tok-gp { color: #000080; font-weight: bold } /* Generic.Prompt */
.listingblock .pygments .tok-gs { font-weight: bold } /* Generic.Strong */
.listingblock .pygments .tok-gu { color: #800080; font-weight: bold } /* Generic.Subheading */
.listingblock .pygments .tok-gt { color: #0044DD } /* Generic.Traceback */
.listingblock .pygments .tok-kc { color: #008000; font-weight: bold } /* Keyword.Constant */
.listingblock .pygments .tok-kd { color: #008000; font-weight: bold } /* Keyword.Declaration */
.listingblock .pygments .tok-kn { color: #008000; font-weight: bold } /* Keyword.Namespace */
.listingblock .pygments .tok-kp { color: #008000 } /* Keyword.Pseudo */
.listingblock .pygments .tok-kr { color: #008000; font-weight: bold } /* Keyword.Reserved */
.listingblock .pygments .tok-kt { color: #B00040 } /* Keyword.Type */
.listingblock .pygments .tok-m { color: #666666 } /* Literal.Number */
.listingblock .pygments .tok-s { color: #BA2121 } /* Literal.String */
.listingblock .pygments .tok-na { color: #7D9029 } /* Name.Attribute */
.listingblock .pygments .tok-nb { color: #008000 } /* Name.Builtin */
.listingblock .pygments .tok-nc { color: #0000FF; font-weight: bold } /* Name.Class */
.listingblock .pygments .tok-no { color: #880000 } /* Name.Constant */
.listingblock .pygments .tok-nd { color: #AA22FF } /* Name.Decorator */
.listingblock .pygments .tok-ni { color: #999999; font-weight: bold } /* Name.Entity */
.listingblock .pygments .tok-ne { color: #D2413A; font-weight: bold } /* Name.Exception */
.listingblock .pygments .tok-nf { color: #0000FF } /* Name.Function */
.listingblock .pygments .tok-nl { color: #A0A000 } /* Name.Label */
.listingblock .pygments .tok-nn { color: #0000FF; font-weight: bold } /* Name.Namespace */
.listingblock .pygments .tok-nt { color: #008000; font-weight: bold } /* Name.Tag */
.listingblock .pygments .tok-nv { color: #19177C } /* Name.Variable */
.listingblock .pygments .tok-ow { color: #AA22FF; font-weight: bold } /* Operator.Word */
.listingblock .pygments .tok-w { color: #bbbbbb } /* Text.Whitespace */
.listingblock .pygments .tok-mb { color: #666666 } /* Literal.Number.Bin */
.listingblock .pygments .tok-mf { color: #666666 } /* Literal.Number.Float */
.listingblock .pygments .tok-mh { color: #666666 } /* Literal.Number.Hex */
.listingblock .pygments .tok-mi { color: #666666 } /* Literal.Number.Integer */
.listingblock .pygments .tok-mo { color: #666666 } /* Literal.Number.Oct */
.listingblock .pygments .tok-sa { color: #BA2121 } /* Literal.String.Affix */
.listingblock .pygments .tok-sb { color: #BA2121 } /* Literal.String.Backtick */
.listingblock .pygments .tok-sc { color: #BA2121 } /* Literal.String.Char */
.listingblock .pygments .tok-dl { color: #BA2121 } /* Literal.String.Delimiter */
.listingblock .pygments .tok-sd { color: #BA2121; font-style: italic } /* Literal.String.Doc */
.listingblock .pygments .tok-s2 { color: #BA2121 } /* Literal.String.Double */
.listingblock .pygments .tok-se { color: #BB6622; font-weight: bold } /* Literal.String.Escape */
.listingblock .pygments .tok-sh { color: #BA2121 } /* Literal.String.Heredoc */
.listingblock .pygments .tok-si { color: #BB6688; font-weight: bold } /* Literal.String.Interpol */
.listingblock .pygments .tok-sx { color: #008000 } /* Literal.String.Other */
.listingblock .pygments .tok-sr { color: #BB6688 } /* Literal.String.Regex */
.listingblock .pygments .tok-s1 { color: #BA2121 } /* Literal.String.Single */
.listingblock .pygments .tok-ss { color: #19177C } /* Literal.String.Symbol */
.listingblock .pygments .tok-bp { color: #008000 } /* Name.Builtin.Pseudo */
.listingblock .pygments .tok-fm { color: #0000FF } /* Name.Function.Magic */
.listingblock .pygments .tok-vc { color: #19177C } /* Name.Variable.Class */
.listingblock .pygments .tok-vg { color: #19177C } /* Name.Variable.Global */
.listingblock .pygments .tok-vi { color: #19177C } /* Name.Variable.Instance */
.listingblock .pygments .tok-vm { color: #19177C } /* Name.Variable.Magic */
.listingblock .pygments .tok-il { color: #666666 } /* Literal.Number.Integer.Long */