BODY {
    background-color: #FFFCEF;
    color: black;
    margin: 1.5em 1.5em 1.5em 14em;
    font-size: 16px;
    line-height: 1.5;
}

P, UL, OL, BLOCKQUOTE, H3, H4, H5, H6 { max-width: 650px; }

H1, .authorname         { font-size: 200%; }

H1 {
    text-align: center;
    background-color: #EEE;
    padding: 0.2em;
    border: 2px solid #162E6A;
}

H1, H2, H3, .authorname { line-height: 1.35 }
H1, H2, H3, H4, H5, H6, .authorname { font-family: Sans-Serif; }
H2, H3, H4, H5, H6, B, STRONG       { color: #990033; }

H2 {
    padding: 0.2em 0;
    border-top:    1px solid #990033;
    border-bottom: 1px solid #990033;
}

H1, .authorname A                   { color: #660066; }
TH, TD                              { padding: 2px 5px; }
LI {
    padding-top:    0.15em;
    padding-bottom: 0.15em;
}

HR {
    border-top: 1px solid #990033;
    border-bottom-style: none;
    border-right-style: none;
    border-left-style: none;
}

IMG.books, IMG.left { margin: 3pt 3pt 4pt 0; float: left; clear: left; }
IMG.right           { margin: 3pt 0 4pt 3pt; float: right; clear: right; }

H2, H3 { clear: left; }

BLOCKQUOTE {
  background: #EEEED1;
  border-left: 10px solid #DDDDC0;
  border-right: 10px solid #DDDDC0;
  margin: 1em;
  padding: 0.1em 10px;
}

/* Navigation bar */

.navbar {
    position: fixed;
    top: 0px;
    bottom: 0px;
    left: 1.5em;
    padding: 1.5em 0.5em;
    background-color: #EEE;
    border-left:  1px solid #162E6A;
    border-right: 1px solid #162E6A;
    width: 10em;
}

.navbar A               { text-decoration: none; }
.navbar > UL {
    padding: 0.5em 0 0 0;
    margin: 0;
    list-style-type: none;
}
.navbar * UL {
    padding: 0 0 0 1.5em;
    margin: 0;
    list-style-type: disc; }
.navbar LI              { padding-top: 0.2em; padding-bottom: 0.2em; }
.navbar LI LI           { padding-top: 0.1em; padding-bottom: 0.1em; }

/* Tables on main page */

TABLE.overview H2, TABLE.overview H3,
TABLE.books H2, TD.books H3, TD.books-last H3,
TABLE.projects H2, TD.projects H3, TD.projects-last H3 {
    text-align: center;
}

TABLE.books {
    background-color: #FFFCE6;
    border: 1px solid #162E6A;
    margin-bottom: 1em;
}

TD.books {
    border-right: 1px solid #162E6A;
}

TD.books H3, TD.books-last H3  {
    background: #FFEDCC;
    border: 1px solid #cccccc;
    border-top: 3px solid #cccccc;
    margin-bottom: 0;
}

SPAN.bookdetails {
    font-weight:bold;
    color: #990033;
}

TABLE.projects {
    background-color: #FEFAF3;
    border: 1px solid #EFCE9E;
}

TD.projects {
    border-right: 1px solid #EFCE9E;
}

TD.projects H3, TD.projects-last H3 {
    background: #FFF5E3;
    border: 1px solid #EFCE9E;
    border-top: 3px solid #EFCE9E;
}

TD.overview {
    background-color: #F7F4DD;
    border: 1px solid #162E6A;
}

TD.overview H3 {
    background: #EEEED1;
    border: 1px solid #DDDDC0;
    border-top: 3px solid #DDDDC0;
}

TD.keimform { background-color: #F1FAFF; border: 1px solid #162E6A; }

TD.keimform H4 {
    background: #E1EAEE;
    border: 1px solid #D0D9DD;
    border-top: 3px solid #D0D9DD;
    text-align: center;
}

TABLE.keimform          { border-top:   1px solid #162E6A; }
TD.keimformauthor       { border-right: 1px solid #162E6A; }

/* Relatively small devices: show book details below (rather than next to) images */
@media only screen and (min-width: 991px) and (max-width: 1149px) {
    SPAN.bookdetails { display: block; clear: left; }
}

/* Small devices: show Books and Keimform articles in a single column */
@media only screen and (max-width: 991px) {
    TD TD {
      width: auto;
      display: block;
    }

    TD.books, TD.books-last {
      border-right: 0;
      display: block;
      /* display: table-row; */
      width: auto;
    }

    TABLE.overview TD { width: auto; }

    TD.keimformmain    { border-top:   1px solid #162E6A; }
    TD.keimformauthor  { border-right: 0; }
}

/* Extra-small devices (phones, small tablets): single-column layout */
@media only screen and (max-width: 799px) {
    BODY { margin: 1.5em; }

    .overview TD {
      display: block;
      margin-bottom: 8px;
      width: auto;
    }

    .navbar {
        background-clip: content-box;
        border: 0;
        border-top: 1px solid #990033;
        padding: 0;
        padding-top: 8px;
        position: static;
        width: auto;
    }

    /* Show my name in H1 header (unless it's already there) instead of top of menu */
    .authorname { display:none; }
    H1::after { content: ' – Christian Siefkes'; }
    H1#christiansiefkes::after { content: ''; }

}