body {
    font-family: sans-serif;
    font-size:12pt;
    counter-reset: numbering;
}

.hide {
    visibility: hidden !important;
    display: none !important;
}

#dropzone {
    padding:30px;
    border:10px solid grey;
    border-radius:10px;
    max-width:500px;
    margin:20px auto;
    background:white;
}
#dropzone.dragover {
    border-color: green;
    background:lightgreen;
}

code {
    font-family:monospace;
    white-space:pre-line;
}

nav {
    width:80%;
    max-width: 900px;
    margin:10px auto;
    background:grey;
    padding:20px;
}

.mc-questions {
    width:80%;
    max-width: 900px;
    margin:20px auto;
    padding:20px;
    border:2px solid grey;
}

.mc-question + .mc-question {
    margin-top:35px;
}

h3 {
    margin:0;
    line-height: 1.1;
    font-size:inherit;
}

h3:before {
    counter-increment: numbering;
}
.numbering h3:before {
    content: counter(numbering) ") ";
}

ul {
    padding:0 0 0 20px;
    list-style: none;
    margin:15px 0 0 0;
}

li {
    padding:5px 0;
}

li:before {
    float:left;
    margin-left:-20px;
    content: "☐";
}

li.incorrect:before {
    content: "☐";
}
.answers li.correct:before {
    content: "☑";
}