body {
            font-family: 'Segoe UI', 'Lucida Grande', 'Open Sans', sans-serif;
            font-size: 1.1rem;
            margin: auto;
            max-width: 45em;
            padding: 1em
        }

        p {
            line-height: 1.6
        }

        a {
            color: #0067ce;
            text-decoration: none
        }

        a:hover {
            text-decoration: underline
        }

        h1 {
            font-size: 1.7em;
            font-weight: 600;
            margin: 0em 0em 1em;
        }

        h2 {
            font-size: 1.4em;
        }
        h2:before {
            content: "#"
        }

        h3 {
            font-size: 1.5em
        }
        pre {
            border-radius: 0.4em;
            max-width: 35em;
            padding: 0;
        }

        table {
            border-collapse: collapse;
        }

        #course-title {
            margin-top: 2em;
            font-size: 1.2em;
            /* font-weight: bold; */
            /* color: rgb(126, 126, 126); */
        }

        .problem {
            border: 2px solid black;
            padding: 2em;
            margin-bottom: 2em;
        }

        input {
            width: 8em;
            margin-left: 0.6em;
            padding: 0.5em;
            border-radius: 0.6em;
            border: 1px solid black;
        }

        button {
            margin: 1.4em 0;
            display: block;
            outline: 0;
            border: none;
            cursor: pointer;
            height: 44px;
            padding: 14px 17px;
            border-radius: 10px;
            background-color: #01aaf33a;
            color: #222;
            font-size: 16px;
            font-weight: 500;
        }
        button:hover {
            background-color: #01aaf31b;
        }

        .feedback {
            font-weight: bold;
            margin-bottom: 1.4em;
        }

        .correct {
            color: #186d2c;
        }

        .incorrect {
            color: #ad2e3b;
        }

        #problems {
            /* white-space: pre-wrap; */
            counter-reset: problem;
        }

        #problems .problem::before {
            counter-increment: problem;
            content: "Problem " counter(problem) ".";
            /* display: block; */
            font-weight: bold;
            margin-bottom: 1em;
        }

        .solution {
            border: 2px solid black;
            border-radius: 8px;
            margin: 1em 0;
            padding: 0 1em;
            display: block;
            display: none;
        }

        footer {
            margin: 4em 0;
        }

        .show {
            display: contents; 
        }

        input[type='radio'] {
            accent-color: #232323;
            width: 20px;
            margin-right: 30px;
            flex: 0 0 auto;
        }
        .option {
            display: flex;
            margin-bottom: 0.6em;
            align-items: center;
        }