body {
    font-size: 16pt;
    line-height: 140%;
    margin: 0;
    padding: 0;
}

body.background {
    background: rgb(216, 216, 216) url("../images/Mountains.svg") repeat-x center top fixed;
    background-size: auto 100%;
}

#parallaxbackgroundone {
    position: fixed;
    width: 100%;
    height: 600px;
    bottom: -711px;
    background: url('../images/TreesBack.svg') 50% 50% repeat-x;
}

#parallaxbackgroundtwo {
    position: fixed;
    width: 100%;
    height: 600px;
    bottom: -355px;
    background: url('../images/TreesFront.svg') 50% 50% repeat-x;
}

pre {
    background-color: rgb(255, 255, 224);
    font-size: 50%;
    overflow: scroll;
}

code {
    white-space: pre;
    font-size: 50%;
    overflow: scroll;
}

strong {
    font-family: 'Open Sans Condensed', 'Verdana', 'Arial', 'Helvetica', sans-serif;
    font-weight: 700;
}

p {
    -moz-hyphens: auto;
    -webkit-hyphens: auto;
    -ms-hyphens: auto;
    hyphens: auto;
    text-align: justify;
}

.quote {
    font-family: 'Nothing You Could Do', sans-serif;
    font-size: 120%;
}

.bigbutton {
    background-color: rgb(9, 76, 121);
    color: rgb(255, 255, 255);
    padding: 2em;
    cursor: pointer;
    margin: 0.6em auto;
    text-align: center;
    box-shadow: 0.15em 0.25em 0.5em rgba(0, 0, 0, 0.5);
    -moz-border-radius: 0.25em;
    border-radius: 0.25em;
}

a .bigbutton {
    color: rgb(217, 236, 255);
    font-size: 150%;
    font-weight: bold;
    text-decoration: none;
}

.bigbutton:hover {
    background-color: rgb(154, 52, 84);
}

.textarea {
    width: 100%;
}

.textwidth {
    width: calc(100% - 2em);
    max-width: 42em;
    margin: auto;
    padding: 1em;
}

.pagebar {
    background-color: rgb(248, 248, 248);
    max-width: 100%;
    padding-top: 3em;
    padding-bottom: 3em;
    margin: 3em 0;
}

.opaquebar {
    background-color: rgba(230, 230, 230, 0.8);
    max-width: 100%;
    padding-top: 3em;
    padding-bottom: 3em;
    margin: 3em 0;
}

#logo {
    background: url("../images/Bonsai-logo.svg") no-repeat;
    height: 55px;
    width: 55px;
    display: inline-block;
    margin: 0 0.2em 0 0.5em;
}

.path {
    font-size: 80%;
}

#main-title {
    font-size: 26pt;
    font-family: 'Marcellus SC', serif;
}

.pageTitle {
    color: rgb(154, 52, 84);
    font-size: 26pt;
    font-family: 'Marcellus SC', serif;
    font-weight: 300;
    width: calc(100% - 2em);
    max-width: 24.5em;
    margin: auto;
    padding: 1em;
}

.pathCurrent {
    color: rgb(154, 52, 84);
}

#footer {
    clear: both;
    width: calc(100% - 2em);
    background-color: rgb(170, 170, 170);
    position: relative;
    top: 70px;
    padding: 1em;
    margin: 0;
    font-size: 10pt;
}

#footer div {
    /*list-style-type: none;*/
    display: inline-block;
    margin-left: 2em;
    float: right;
}

a img {
    border-width: 0;
}

ul li {
    list-style-type: square;
    margin-bottom: 0.5em;
}

ol li {
    list-style-type: decimal;
    margin-bottom: 0.5em;
}

li li {
    list-style-type: circle;
    margin-bottom: 0.25em;
}

@media projection {
    .screen {
        display: none;
    }

    .projection {
        display: block;
        padding: 65px 200px 0 24px;
        page-break-after: always;
    }
}

.selected-lang {
    color: rgba(0, 0, 0, 0.5);
}