html {
    height:100%;
}

body {
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-orient:vertical;
    -webkit-box-direction:normal;
        -ms-flex-direction:column;
            flex-direction:column;
    min-height:100vh;    
}

html, body {
    color:rgba(0, 0, 0, 0.78);
    font-family: Helvetica, Arial, sans-serif;
    font-size:10px;
    padding:0;
    margin:0;
}

img {
    box-shadow:0 0 5px #222;    
}

.Prose_article img {
    display:block;
    margin:0 auto;
    max-width:100%;
}

.overlay {
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
}

.Popup {
    position:fixed;
    top:0;
    left:0;
    width:100%;
    height:100vh;
    background-color:rgba(0, 0, 0, 0.5);
}

.Popup .header {
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-align:top;
        -ms-flex-align:top;
            align-items:top;
    margin-bottom:5px;
    border-bottom:2px solid black;
}

.Popup .title {
    text-align:center;
    font-size:3rem;
    -webkit-box-flex:1;
        -ms-flex:1;
            flex:1;
}

.Popup .Caption {
    color:white;
    -webkit-box-flex:0;
        -ms-flex:0 0 auto;
            flex:0 0 auto;
    margin:0 auto;
    max-width:100%;
}

.Popup img {
    box-shadow:none;
}

.Popup .img_container {
    -webkit-box-flex:0;
        -ms-flex:0 0 auto;
            flex:0 0 auto;
    position:relative;
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-pack:center;
        -ms-flex-pack:center;
            justify-content:center;
    -webkit-user-select:none;
       -moz-user-select:none;
        -ms-user-select:none;
            user-select:none;
    max-width:100%;
}

.Popup .img_container:hover .next, .Popup .img_container:hover .prev {
    opacity:1;
}

.Popup .Controls {
    -webkit-box-flex:1;
        -ms-flex:1;
            flex:1;
    height:100%;
    overflow:auto;
}

.Popup .content {
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    max-height:100vh;
    max-width:100%;
    height:100%;
}

.Popup .view {
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-orient:vertical;
    -webkit-box-direction:normal;
        -ms-flex-direction:column;
            flex-direction:column;
    -webkit-box-flex:1;
        -ms-flex:1;
            flex:1;
    overflow:auto;
    max-width:100%;
}

.Prose_gallery .close {
    font-size:3rem;
    cursor:pointer;
    text-align:right;
    font-family:monospace;
    padding:10px;
}

.Prose_gallery {
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-orient:vertical;
    -webkit-box-direction:normal;
        -ms-flex-direction:column;
            flex-direction:column;
    -webkit-box-align:center;
        -ms-flex-align:center;
            align-items:center;
    position:relative;
}

.thumbnail_grid {
    -webkit-box-align:center;
        -ms-flex-align:center;
            align-items:center;
    -webkit-box-pack:center;
        -ms-flex-pack:center;
            justify-content:center;
}

.Prose_gallery .thumbnails_display {
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -ms-flex-wrap:wrap;
        flex-wrap:wrap;
    max-height:100%;
}

.Prose_gallery .thumbnails_display > * {
    margin:0;
    outline-offset:-1px;
}

.disabled {
    cursor:default;
    display:none !important;
}

.CurrentImage {
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-orient:vertical;
    -webkit-box-direction:normal;
        -ms-flex-direction:column;
            flex-direction:column;
    -webkit-box-flex:0;
        -ms-flex:0 3 auto;
            flex:0 3 auto;
    max-height:100%;
    margin-right:5px;
    max-width:80%; 
}

.current_image {
    position:relative;        
}

.current_image::before {
    content:"";
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    background-color:rgba(255,255,255,0.5);
    border:2px solid white;
    box-sizing:border-box;               
}            

.close:hover path {
    stroke:white !important;
}

.CurrentImage .Caption p:first-child {
    margin-top:0;
}

.Prose_gallery .Thumbnails {
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -ms-flex-wrap:wrap;
        flex-wrap:wrap;
}

.Prose_gallery .Thumbnails .Thumbnail:not(:last-child) {
    margin-right:.5rem
}

.LiteralInline_tags_display {
    word-break:break-word;
}

.LiteralInline_twitter_timeline {
    height:600px;
}

li {
    margin-top:1em;
    margin-bottom:1em;
}

.plain_list {
    list-style:none;
}

.not_flagstyle {
    table-layout:fixed;
    width:100%;
}

h1, h2, h3, h4, h5, h6 {
    font-weight:normal;
    font-family: Helvetica, Arial, sans-serif;
    margin:0;
    margin-top:1rem;
}

pre, code {
    word-break:break-all;
}

pre {
    white-space:pre-wrap;
    margin-left:2rem;
}

.Literal_code, .LiteralInline_code {
    font-family:Courier, monospace;
    background-color:#f3f3f3; 
}

.Prose_article h2, .Prose_article h3, .Prose_article h4, .Prose_article h5, .Prose_article h6, .Prose_book h2, .Prose_book h3, .Prose_book h4, .Prose_book h5, .Prose_book h6 {
    text-align:center;
}

h1 {
    font-size:2.7rem;
}

h2 {
    font-size:2.5rem;
}

h3 {
    font-size:2.3rem;
}

h4 {
    font-size:2.1rem;
}

h5 {
    font-size:2.1rem;
}

h6 {
    font-size:2.1rem;
}

h2 {
    margin:0;
    padding:0;
    font-size:2.5rem;
}

.Share {
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -ms-flex-wrap:wrap;
        flex-wrap:wrap;
}

.Share > * {
    margin-right:.5rem;
}

.Email {
    background-color:#222;
    font-size:1.2rem;
    padding-left:.3rem;
    padding-right:.3rem;
    color:white;
    text-decoration:none;
    cursor:pointer;
    border-radius:2px;
    box-sizing:border-box;
    height:20px;
    border:1px solid #222;
}

.fb-share-button > span {
    vertical-align:initial !important;
}

.ProseInline_link, .LiteralInline url, .LiteralInline_ref, .IndexLink, .SectionLink {
    text-decoration:none;
    border-bottom:1px solid rgb(43, 0, 247);
    color:inherit;
    -webkit-transition:color 0.1s ease-out;
    transition:color 0.1s ease-out;
}

.ProseInline_link:hover, .LiteralInline url:hover, .LiteralInline_ref:hover, .IndexLink:hover, .SectionLink:hover {
    color:rgb(43, 0, 247); 
}

.Prose_link .LiteralInline_ref {
    display:none;
}

hr {
    border:0;
    height:1px;
    background-image:-webkit-linear-gradient(right, rgba(0,0,0,0), rgba(0,0,0,0.75), rgba(0,0,0,0));
    background-image:linear-gradient(to left, rgba(0,0,0,0), rgba(0,0,0,0.75), rgba(0,0,0,0));
}

blockquote {
    margin-left:0;
    margin-right:0;
    background-color:rgb(243, 243, 243);
    border-left:1px solid rgba(0, 0, 0, 0.78);
    padding:1.3rem;
}

.Footnotes {
    background-color:rgb(243, 243, 243);
    border-top:2px solid #222;
    padding-bottom:1.6rem;
    padding-left:4rem;
}

blockquote p:first-child {
    margin-top:0;
}

blockquote p:last-child {
    margin-bottom:0;
}

body {
    background-color:rgb(211, 211, 211);
}

body > .content > .footer {
    background-color:#222;
    color:white;
    font-size:1.8rem;
    margin-top:1rem;
}

body > .content > .footer .top {
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    padding:2rem;        
    -webkit-box-orient:horizontal;        
    -webkit-box-direction:normal;        
        -ms-flex-direction:row;        
            flex-direction:row;
}

body > .content > .footer .top > * {
    padding:1rem;
    -webkit-box-flex:1;
        -ms-flex:1;
            flex:1;
}

body > .content > .footer .top > *:last-child {
    border-left:1px solid white;
}

.navbar {
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -ms-flex-wrap:wrap;
        flex-wrap:wrap;    
}

.LiteralInline_tags_display a, .navbar {
    color:rgb(156, 156, 156);
}

.LiteralInline_tags_display a {
    display:inline-block;        
}

.navbar a, body > .content > .footer p a {
    margin-right:.5rem;
    text-decoration:none;
    cursor:default;
    font-family:Arial;
    font-size:1.6rem;
    border-bottom:0;
}

.navbar a:not(:last-child) {
    border-right:1px solid #ccc;
    padding-right:.5rem;
}

.Popup .next {
    right:0;
}

.Popup .prev {
    left:0;
}

.Popup .next, .Popup .prev {
    -webkit-transition:200ms;
    transition:200ms;
    opacity:0;
    position:absolute;
    height:100%;
    top:0;
    background-color:rgba(0, 0, 0, 0.5);
    color:white;
    text-decoration:none;
    font-size:3rem;
    padding:10px;
    box-sizing:border-box;
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-align:center;
        -ms-flex-align:center;
            align-items:center;
}

.Popup .next:hover:not(.disabled), .Popup .prev:hover:not(.disabled) {
    background-color:rgba(0, 0, 0, 0.7)
}

.navbar a:hover, .navbar a[active], body > .content > .footer p a:hover, body > .content > .footer p a[active] {
    color:white;
}

.subtitle {
    font-style:italic;
    font-size:1.5rem;
}

body > .Header {
    background-color:#222;
    color:white;
    -webkit-transition:200ms;
    transition:200ms;
    z-index:2;
}

.Header img {
    max-height:60px;
}

.Thumbnail {
    cursor:pointer;
    margin:5px;
    font-size:0; /* Prevent awkward height issue. */
}

.TitleContainer .title {
    font-size:2.7rem;
}

.TitleContainer {
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-orient:horizontal;
    -webkit-box-direction:normal;
        -ms-flex-direction:row;
            flex-direction:row;
}

.TitleContainer a {
    color:inherit;
    text-decoration:none;
}

.TitleContainer .subtitle {
    -webkit-box-flex:1;
        -ms-flex:1;
            flex:1;
    text-align:right;
}

.Content .Main {    
    margin:0 auto; 
    max-width:100%;
    width:936px;
    margin-top:1rem;
    font-size:1.8rem;
    -webkit-box-flex:1;
        -ms-flex:1;
            flex:1;
}

.Index {
    margin-left:1rem;
    margin-top:.5rem;
}

.BookIndex > .Index {
    margin-left:0;
    margin-top:0;
}

.BookIndex {
    display:none;
    padding:1rem;
    background-color:rgb(190, 190, 190);
    -webkit-overflow-scrolling: touch;
    -ms-overflow-style: none;
    -webkit-transition:top 200ms;
    transition:top 200ms;
}

.BookIndex .IndexLink {
    border-bottom:0;
    font-size:1.3rem;
}

.BookIndex > .Index > .IndexLink  {
    font-size:2rem;
}

.BookIndex a.active {
    border-bottom:2px solid rgb(43, 0, 247);    
}

.Title h1 {
    padding:0;
    margin:0;
}

.Thumbnail:hover {
    outline:1px solid #00ee00;
}

.Popup .content {
    padding:5px;
    border:2px solid white;
    box-sizing:border-box;
    background-color:#c0c0c0;
}

body > .Content {
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-orient:vertical;
    -webkit-box-direction:normal;
        -ms-flex-direction:column;
            flex-direction:column;
    -webkit-box-flex:1;
        -ms-flex:1 0 auto;
            flex:1 0 auto;
}

.Thumbnails {
    padding:0.5rem;
}

.Popup {
    -webkit-box-pack:center;
        -ms-flex-pack:center;
            justify-content:center;
    -webkit-box-align:center;
        -ms-flex-align:center;
            align-items:center;
    padding:20px;
    z-index:3;
    box-sizing:border-box;
}

.Prose_link {
    text-decoration:none;
    color:inherit;
    cursor:pointer;
    margin:0;
    padding:0;
    display:block;
}

.Prose_link:not(:first-child) {
    margin-top:10px;
}

.Prose_article, .Prose_book, body > .content > .main > .Prose_ {
    background-color:rgba(255,255,255,0.9);
    padding:2rem;
    box-shadow:#222 0px 0px 10px 0px;
    line-height:1.4;
    font-family:Georgia;
    -webkit-box-flex:1;
        -ms-flex:1;
            flex:1;
}

.Prose_article > .Title {
    border-bottom:2px solid #222;
    margin-bottom:1rem;
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -ms-flex-wrap:wrap;
        flex-wrap:wrap;
}

.Prose_book > .Title > *:not(:first-child) {
    margin-top:10px;
}

.Prose_book > .Title {
    border:2px solid black;
    text-align:center;
    padding:5px;
    margin-bottom:1em;
}

.Prose_book > .Title .TitleBase {
    font-size:3rem;
}

.Prose_book > .Title .author {
    font-style:italic;
}

.Prose_book > .Title .edition {
    font-size:1rem;
}

.Prose_book > .Title .subtitle {
    font-size:2.5rem;
}

.Prose_book > .Title .summary {
    font-size:2rem;
}

.Prose_book > .Title .date {
    display:none;
}

.Prose_document .Title .date {
    text-align:right;
    -webkit-box-flex:1;
        -ms-flex:1;
            flex:1;
    font-family:Courier, monospace;
    font-size:8pt;
}

.Prose_article .footer .top {
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;    
}

.Prose_article .footer .Tags {
    -webkit-box-flex:1;
        -ms-flex:1;
            flex:1;
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-pack:end;
        -ms-flex-pack:end;
            justify-content:flex-end;
}

.Tags .Tag {
    color:rgb(119, 119, 255);
    font-size:1.2rem;
    text-decoration:underline;
    border-bottom:none;
}

.Tags .Tag:not(:last-child) {
    margin-right:3px;
}

.Continue {
    color:rgb(87, 173, 104);
    font-size:1.2rem;
    text-decoration:underline;
}

.Popup .Prose_image {
    background-color:rgba(0, 0, 0, 0.5);
}

.Prose_image img {
    margin:0 auto;
    margin-bottom:1rem;
    max-width:100%;
}

.Prose_image {
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-orient:vertical;
    -webkit-box-direction:normal;
        -ms-flex-direction:column;
            flex-direction:column;
    -webkit-box-pack:center;
        -ms-flex-pack:center;
            justify-content:center;
    text-align:center;
}

.powered_by, .powered_by .Link {
    color:#ccc;
    font-size:1.2rem;
    text-align:right;
    padding-bottom:2px;
    padding-right:2px;
}

/* Disables firefox ugly outline on links when they are clicked */
a {
   outline: 0;
}

/*.Prose_site > .footer a:not([is_tag]) {
    color:inherit;
}*/

/* I.e mobile */
@media (max-width : 936px) {
    .TitleContainer .subtitle {
        display:none;
    }
    
    body > .content > .footer .top {
        -webkit-box-orient:vertical;
        -webkit-box-direction:normal;
            -ms-flex-direction:column;
                flex-direction:column;
    }
    
    body > .content > .footer .top > *:last-child {
        border-left:none;
        border-top:1px solid white;
    }

    .BookIndex {
        display:none;
    }

    .show_index {
        margin-right:5px;
        -ms-flex-item-align:center;
            -ms-grid-row-align:center;
            align-self:center;
        display:block;
        width:100%;
        margin-top:5px;
    }

    .Popup .Controls {
        display:none;        
    }

    .Popup .CurrentImage {
        max-width:100%;
    }

    .Popup {
        padding:0;
    }
}

/* I.e desktop */
@media (min-width : 936px) {
    .BookIndex {
        max-width:300px;
        margin-right:1rem;
        overflow:auto;
    }
    
    .show_index {
        display:none;
    }

    body[book_index=true] .BookIndex {
        display:block;
    }
    
    body[book_index=true] {
        max-height:100vh;
        height:100vh
    }
    
    body[book_index=true] > .Content > .Main {
        margin:0;
        max-width:initial;
        width:initial;
        display:-webkit-box;
        display:-ms-flexbox;
        display:flex;
/*        height:100vh;*/
        /* Fixes FF for some weird reason regarding independently scrolling panels. */
    /*    overflow:auto; */
    }
    
    body[book_index=true] .Main > *:not(.BookIndex) {
        position:relative;
/*        overflow:auto;*/
        margin:1rem;
        -webkit-box-flex:1;
            -ms-flex:1;
                flex:1;
        -webkit-overflow-scrolling: touch;
        -ms-overflow-style: none;
        box-shadow:#222 0px 0px 10px 0px;
    }
    
    body[book_index=true] > .content > .Footer {
        margin-top:0;
    }
}