@font-face {
    font-family: "Gentium Book Basic";
    font-weight: normal;
    font-style: normal;
    src: url('fonts/GenBkBasR.ttf') format('truetype'),
         url('fonts/genbkbasr-webfont.woff2') format('woff2'),
         url('fonts/genbkbasr-webfont.woff') format('woff');
}

@font-face {
    font-family: "Gentium Book Basic";
    font-weight: bold;
    font-style: normal;
    src: url('fonts/GenBkBasB.ttf') format('truetype'),
         url('fonts/genbkbasb-webfont.woff2') format('woff2'),
         url('fonts/genbkbasb-webfont.woff') format('woff');
}

@font-face {
    font-family: "Gentium Book Basic";
    font-weight: normal;
    font-style: italic;
    src: url('fonts/GenBkBasI.ttf') format('truetype'),
         url('fonts/genbkbasi-webfont.woff2') format('woff2'),
         url('fonts/genbkbasi-webfont.woff') format('woff');
}

@font-face {
    font-family: "Gentium Book Basic";
    font-weight: bold;
    font-style: italic;
    src: url('fonts/GenBkBasBI.ttf') format('truetype'),
         url('fonts/genbkbasbi-webfont.woff2') format('woff2'),
         url('fonts/genbkbasbi-webfont.woff') format('woff');
}

@font-face {
    font-family: "Titillium Web";
    font-weight: 700;
    font-style: normal;
    src: url('fonts/TitilliumWeb-Bold.ttf') format('truetype'),
         url('fonts/titilliumweb-bold-webfont.woff2') format('woff2'),
         url('fonts/titilliumweb-bold-webfont.woff') format('woff');
}

@font-face {
    font-family: "Titillium Web";
    font-weight: 900;
    font-style: normal;
    src: url('fonts/TitilliumWeb-Black.ttf') format('truetype'),
         url('fonts/titilliumweb-black-webfont.woff2') format('woff2'),
         url('fonts/titilliumweb-black-webfont.woff') format('woff');
}

body {
    background: #ffffff;
    color: #321500;
    font-family: "Gentium Book Basic", serif;
}

a {
    color: #321500;
    text-decoration: underline;
    text-decoration-color: #853a00;
}

/* Page structure */

nav#table-of-contents {
    position: fixed;
    top: 1em;
    left: 1em;
    width: 18em;
    max-width: 18em;
    font-size: 90%;
    height: 95%;
    overflow-y: scroll;
}

div#body {
    top: 1em;
    left: 18em;
    margin-right: 1em;
    position: absolute;
}

footer {
    font-style: italic;
    font-size: 60%;
    text-align: right;
    width: 100%;
    background: #aaaaff;
    clear: both;
}

footer p {
    padding: 1em 1em 1em 1em;
}

/* Index page TOC */

nav#table-of-contents ol {
   padding-left: 0;
}

nav#table-of-contents ol li {
    margin-left: 2em;
}

div.toc-chapter-link {
    font-weight: bold;
}

div.toc-subheading-links {
    font-size: 80%;
    font-style: italic;
}

/* Tables */

table {
    background: #dddddd;
    text-align: left;
    border-spacing: 0;
    border: 0;
    padding: 0;
    margin-top: 0;
    margin-right: 0;
    margin-left: auto;
    margin-right: auto;
}

table tr th {
    padding: 0.1em 0.4em;
    font-weight: bold;
    background: #ffddff;
    color: #321500;
    border-left: none;
    border-right: none;
    border-top: 1px solid black;
    border-bottom: 1px solid black;
}

table tr td {
    padding: 0.1em 0.4em;
}

table tr:first-child td {
    border-top: 1px solid black;
}

table tr td:first-child {
    border-left: 1px solid black;
}

table tr td:last-child {
    border-right: 1px solid black;
}

table tr:last-child td {
     border-bottom: 1px solid black;
}

/* Headings */

h1 {
    color: #440044;
    font-family: 'Titillium Web', sans-serif;
    font-weight: 900;
}

h2 {
    color: #440044;
    font-family: 'Titillium Web', sans-serif;
    font-weight: 700;
}

h3 {
    color: #440044;
    font-family: 'Titillium Web', sans-serif;
    font-weight: 700;
}

h4 {
    color: #440044;
    font-family: 'Titillium Web', sans-serif;
    font-weight: 700;
}

h5 {
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    margin-bottom: 1em;
    color: #440044;
    font-size: 120%;
    font-family: 'Titillium Web', sans-serif;
    font-weight: 700;
}

/* Vehicles */

div.vehicle {
    margin-top: 1em;
    margin-bottom: 1em;
}

div.vehicle table {
    width: 80%;
}

div.vehicle table th {
    border: none;
    font-weight: bold;
    background: #eeee99;
    color: #440044;
}

div.vehicle table td {
        border: none;
}

div.vehicle span.vehicle-armour-notes {
    font-style: italic;
    font-size: 80%;
}

/* Weapons */

div.weapon {
    margin-top: 1em;
    margin-bottom: 1em;
    width: 100%;
}

div.weapon table th {
        border: none;
}

div.weapon table td {
        border: none;
}

div.weapon table.weapon-ranges {
    margin-left: 0;
    width: 100%;
}

div.weapon table.weapon-ranges tr:first-child th {
    font-weight: bold;
    background: #eeee99;
    color: #440044;
    border: none;
}

div.weapon table.weapon-ranges tr:first-child td {
    background: #ffffff;
}

div.weapon table.weapon-ranges tr th:first-child {
    font-weight: bold;
    background: #eeee99;
    color: #440044;
    border: none;
}

div.weapon table.weapon-details {
    width: 100%;
    border-top: 0.3em solid #440044;
}

div.weapon table.weapon-details th {
    font-weight: bold;
    background: #eeee99;
    color: #440044;
    border: none;
}

/* Spells */

div.spell {
    margin-top: 1em;
    margin-bottom: 1em;
    width: 100%;
}

div.spell table {
    width: 100%;
}

div.spell table th {
    border: none;
    width: 25%;
}

div.spell table td {
    border: none;
    width: 25%;
}

/* Magical Objects */

div.magical-object {
    margin-top: 1em;
    margin-bottom: 1em;
    width: 100%;
}

div.magical-object div.magical-object-title {
    margin-left: auto;
    margin-right: auto;
    text-align: center;
    margin-bottom: 1em;
    color: #440044;
    font-size: 120%;
}

div.magical-object table {
    width: 100%;
}

div.magical-object table th {
    border: none;
    width: 50%;
}

div.magical-object table td {
    border: none;
    width: 50%;
}

/* Cyberparts */

div.cyberpart {
    margin-top: 1em;
    margin-bottom: 1em;
    width: 100%;
}

div.cyberpart table {
    width: 100%;
}

div.cyberpart table th {
    border: none;
    width: 50%;
}

div.cyberpart table td {
    border: none;
    width: 50%;
}