body {
    margin: 8px;
}

h1 {
    font-size: x-large;
    margin-bottom: 1em;
}

h2 {
    font-size: x-large;
    margin-bottom: 0.2em;
}

h3 {
    font-size: large;
    margin-bottom: 0.2em;
}

p, ul, li {
    font-size: medium;
    margin-top: 0.4em;
    margin-bottom: 0.4em;
}

li {
    line-height: 1.3;
}

.breadcrumb {
    font-size: small;
}

ul.nav {
    padding: 0px;
}

ul.nav li {
    display: inline;
}

ul.nav li a {
    text-decoration: none;
    color: #558;
    background-color: #ddd;
    border: 1px solid #aaa;

    padding: 0.5em;
}

ul.nav li a:hover {
    color: #336;
    background-color: #eee;
    border: 1px solid #ddd;
}

ol {
    list-style-type: decimal;
}

ol ol {
    list-style-type: lower-latin;
}

.control {
    font-style: italic;
}

table.problem_set_stats {
    border-collapse: collapse;
}

table.problem_set_stats tr td {
    border-width: 1px 0px;
    border-style: solid;
    border-color: black;
    padding: 2px 10px 2px;
}

.selection {
    background-color: yellow;
}

.hash {
    color: goldenrod;
}

.added {
    color: limegreen;
}

.removed {
    color: crimson;
}

.staged {
    color: limegreen;
}

.unstaged {
    color: crimson;
}

code.example {
    display: block;
    background-color: #f3f3f3;
    margin: 1.5em;
    padding: 1em 1em;
    border-radius: 3px;
    border: 1px solid #5c5c5c;
    box-sizing: border-box;
    white-space: pre;
    width: 80em;
    max-width: 95%;
    font-size: 90%;
    line-height: 1.15;
}

@supports (-webkit-overflow-scrolling: touch) {
    code.example {
        background-color: white;
        border: 0;
        margin: 0;
    }
}

code.inline {
    background-color: #f3f3f3;
    margin: 0;
    padding: 0.1em 0.3em;
    border-radius: 3px;
    border: 1px solid #c0c0c0;
    font-size: 90%;
}