@charset "UTF-8";
@import "reset.css";

* {
    box-sizing: border-box;
}

body {
    padding: 50px;
}
body > * {
    margin: 10px;
}

h1 {
    font-size: 2.5em;
}
h2 {
    font-size: 2em;
}
h3 {
    font-size: 1.5em;
}
small {
    font-size: 0.8em;
}
code {
    font-family: monospace;
    background-color: rgb(243, 243, 243);
    border: solid rgb(225, 225, 225) 1px;
}

fieldset {
    border: solid gray 1px;
    padding: 10px;
}

td > input {
    width: 300px;
    height: 2em;
    text-align: center;
    vertical-align: baseline;
}

input {
    padding: 2px;
    background-color: hsl(0, 0%, 92%);
    border: solid black 1px;
}
input[type="radio"] {
    appearance: none;
    width: 1.2em;
    height: 1.2em;
    border-radius: 0.6em;
    vertical-align: text-bottom;
}
input[type="radio"]:checked {
    background-color: hsl(194, 82%, 80%);
}

button {
    background-color: hsl(41, 53%, 86%);

    border: solid black 1px;
    padding: 5px;
}

button:hover {
    background-color: hsl(41, 26%, 75%);
}

.error, .internal-error, .info, .warning {
    font-size: 1.4em;
    text-align: center;
    padding-top: 10px;
    padding-bottom: 10px;
    margin-top: 5px;
    margin-bottom: 5px;
}

.error {
    background-color: rgb(231, 63, 7);
    color: white;
}
.error::before,
.error::after {
    font-weight: bold;
    content: "\2717";
    margin-left: 5px;
    margin-right: 5px;
}
.error::before {
    content: "\2717  ERRORE:";
}

.internal-error {
    background-color: rgb(255, 99, 47);
    color: black;
}
.internal-error::before {
    content: "ERRORE INTERNO: ";
}

.info {
    background-color: lightcyan;
}

.warning {
    background-color: yellow;
}
.warning::before,
.warning::after {
    content: "\26A0";
    margin-left: 5px;
    margin-right: 5px;
}

ol, ul {
    list-style: circle inside;
}

li > * {
    margin-left: 10px;
}

.answer {
    margin-top: 5px;
    margin-bottom: 5px;
}
.answer > * {
    margin-right: 3px;
}

.correct-answer {
    color: green;
    list-style-type: square;
}

.wrong-answer {
    color: red;
    list-style-type: "\00D7";
}

.correction-table,
.correction-table > tbody > tr > td,
.correction-table > thead > tr > th {
    border: solid black 1px;
    border-collapse: collapse;
}

.correction-table > tbody > tr > td,
.correction-table > thead > tr > th {
    padding: 14px;
}

.correct-answer-box {
    background-color: green;
}

.incorrect-answer-box {
    background-color: red;
}

.not-given-answer-box {
    background-color: gray;
}
