:root {
    --main-bg-color: #ebebeb;
    --link-color:    #388872;
    --main-menu-link-color: #7872D8;
    --code-window-bg-color: #e4e4e4;
    --code-window-border-color: #838383;
}

body {
    font-family: sans;
    background: var(--main-bg-color);
    margin: 2px;
    padding:2px;

}

pre {
    border: 1px solid #e6e6e6;
    border-radius: 3px;
    background-color: #f2f2f2;
    padding: 8pt;
    font-family: monospace;
    overflow: auto;
    margin: 1.2em;
}

a {
    color: var(--link-color);
    text-decoration: none;
    font-weight: bold;
}

a:hover {
    color: var(--main-menu-link-color);
    text-decoration: underline;
    font-weight: bold;
}

code {
    background: var(--code-window-bg-color);
    border: 1px solid var(--code-window-border-color);
    font-family: mono;
    padding-left: 3pt;
    padding-right: 3pt;
    border-radius: 4px;
    font-weight: normal;
    font-size: 80%;

}

img {
    margin: auto;
    max-width: 100%;
    height: auto;
}

.figure {
    text-align: center;
}

.figure-number {
    font-weight: bold;
}

#preamble {
    margin: 0;
    padding:0;
    display: block;
    font-size: 50pt;
    text-align: center;
    background: #74B09F;
    color: var(--link-color);
    width: 100%;
    height: 100px;
}


pre.src {
    overflow: scroll;
}

.title {
    text-align: left;
    float: right;
    color: #9AC9BC;
    font-size: 50pt;
}


#main_menu {
    display: block;
    margin:  auto;
}

#main_menu ul li:before {
    content:      '\2219';
    margin-left:  1pt;
    margin-right: 1pt;
}

#main_menu ul {
    display: flex;
    flex-wrap: wrap;
}

#main_menu ul li{
    list-style-type: none;
    display: table-cell;
    color: #000000;
    text-decoration: none;
    text-align: center;
}

#main_menu ul li a{
    text-transform: capitalize;
    font-weight: bold;
    color: var(--main-menu-link-color);
    text-decoration: none;
    font-weight: bold;
}

#main_menu ul li a:hover{
    text-transform: capitalize;
    font-weight: bold;
    color: var(--link-color);
    text-decoration-line: underline;
    font-weight: bold;
}

#table-of-contents {
    width: 200px;
    background: #ebebeb;
    border: 0;
    float: left;
    margin-left: 2px;
    margin-right: 3px;
    height: 100%;
}

#table-of-contents  h2{


    text-align: center;
    margin: 0;
    padding: 2pt;
}

#table-of-contents  ul {
    margin: 0;
    padding: 2pt;
    list-style-type: none;
}

#table-of-contents  ul li a{
    text-decoration: none;
    margin: 3px 0 5px 8px;
    padding: 2pt;
    display: block;
    min-height: 25px;
    background: #9AC9BC;
    color: #004532;

}

#table-of-contents  ul li ul li a{
    text-decoration: none;
    margin: 0px 0 0px 10px;
    padding-top: 0px;
    display: block;
    background: #C0DED6;
    color: var(--link-color);
    border-bottom: thin solid #F3F5F7;
    min-height: 20px;
}

#table-of-contents  ul li ul li a:hover{
    text-decoration: none;
    margin: 0px 0 0px 10px;
    padding-top: 0px;
    display: block;
    background: var(--main-menu-link-color);
    color: #9AC9BC;
    border-bottom: thin solid #F3F5F7;
    min-height: 20px;
}

#table-of-contents  ul li ul li ul li a{
    font-size: 80%;
    text-decoration: none;
    margin: 0px 0 0px 10px;
    padding-top: 5px;
    padding-bottom: 5px;
    display: block;
    background: #C0DED6;
    color:      #553a82;
    border-bottom: thin solid #F3F5F7;
    min-height: 20px;
}

#table-of-contents  ul li ul li ul li a:hover{
    text-decoration: none;
    margin: 0px 0 0px 10px;
    padding-top: 5px;
    padding-bottom: 5px;
    display: block;
    background: var(--main-menu-link-color);
    color:      #F3F5F7;
    border-bottom: thin solid #F3F5F7;
    min-height: 20px;
}

div[class^="outline"] {

}

@media screen and (aspect-ratio > 1/1) {

    .outline-2 {
        margin-left: 220px;
        min-width:   600px;
    }

}

@media screen and (aspect-ratio < 1/1) {

    .outline-2 {

    }

}

.outline-text-3 {

}

.outline-text-2 {

}

.outline-text-3 {

}


h2[id^="sec"] {
    color: var(--link-color);
    font-size: 18pt;
}


#postamble {
    clear: both;
    border: thin solid black;
    width: 100%;
    background: #9AC9BC;
    font-size: 10px;
    margin-top: 0;
    margin-bottom: 2px;
    color: #388872;
    display: grid;
    grid-template-columns: auto auto auto;
}

.lisplogo_footer {
    height: 128px;
}

#footnotes {
    margin-left: 220px;
}

.link-color {
    color: #388872;
}