html, 
body {
    font-family: sans-serif;
    margin: 0 auto;
    padding: 0;
}

div#contents {
    margin: 5em 0 0 60px;
}

div#navigation {
    background: black;
    font-size: 80%;
    font-weight: bold;
    height: 40px;
    margin: 0;
    padding: 0;
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
}

div#navigation ol li {
    display: inline;
    margin: 0;
    padding: 0 0 0 20px;
}

div#navigation a {
    color: gray;
    text-decoration: none;
    padding-left: 20px;
}

div#navigation a:hover,
div#navigation a:visited {
    color: lightgray;
}

div#navigation ol li + li a {
    border-left: 1px solid gray;
}



table#syllabi {
    border-collapse: collapse;
    border-spacing: 0;
    text-align: left;
    width: 60%;
}

table#syllabi tbody tr {
    border-top: 1px dotted gray;
    color: gray;
}

table#syllabi tbody tr td:nth-child(3),
table#syllabi tbody tr td:nth-child(4) {
    text-align: right;
    padding-right: 4em;
}

table#syllabi tbody {
    border-bottom: 1px solid black;
}

table#syllabi tbody th {
}

table#syllabi tbody th:first-child,
table#syllabi tbody th:first-child + th {
    padding: 10px 0 5px 0;
    text-align: left;
}



table#syllabus {
    border-collapse: collapse; 
    border-spacing: 0;
    width: 60%;
}

table#syllabi thead th,
table#syllabi tfoot th,
table#syllabus thead th,
table#syllabus tfoot th {
    background: black;
    color: white;
    font-size: 150%;
    padding: 10px 0;
}

table#syllabus tbody th {
    background: #A0A0A0;
    font-size: 125%;
    padding: 10px 10px 5px 10px;
    text-align: right;
}

table#syllabus tbody th:first-child,
table#syllabus tbody th:first-child + th {
    padding: 10px 0 5px 0;
}

table#syllabus tbody th:first-child + th + th {
    text-align: left;
}

table#syllabus tbody td {
    padding: 1px 10px 0 10px;
    text-align: right;
}

table#syllabus tbody td:first-child,
table#syllabus tbody td:first-child + td,
table#syllabus tbody td:first-child + td + td {
    padding: 1px 0 0 0;
}

table#syllabus tbody td:first-child + td + td + td {
    text-align: left;
}

table#syllabus tbody tr.lesson td {
    background: #E0E0E0;
    border-top: 1px solid black;
    font-weight: bold;
}

table#syllabus tbody tr.exercise td {
    border-top: 1px dotted gray;
    color: gray;
    font-size: 75%;
}

[data-toggle="toggle"] {
    display: none;
}