khan-exercise.css

html, body { font-family: Helvetica, Arial; margin: 0; padding: 0; }
body { margin: 10px; }
.exercise, .vars, #next, #congrats, #oops { display: none; }
p.question { font-weight: bold; }
var { font-style: normal; }
.hint_blue { color: blue; }
.hint_orange { color: orange; }
.hint_red { color: red; }
.hint_green { color: green; }
.hint_gray { color: gray; }
#congrats { color: green; }
#oops { color: red; }
#workarea { margin-left: 10px; }
#hintsarea { margin-left: 30px; }
#sidebar { float: right; width: 300px; }
#sidebar ul { list-style: none; margin: 8px; padding: 0; }
#sidebar li { margin: 10px 0; }
#sidebar li span.value { padding-left: 5px; }
#problemarea { margin-right: 310px; position: relative; min-height: 500px;}
h1, form, #help, #debug, #extras { border: 1px solid #AAA; background: #F0F0F0; padding: 10px; margin: 10px 0; }
#debug var { font: 14px Menlo, Courier, monospace; word-wrap: break-word; }
h3 { color: #666; margin: 0; font-weight: normal; }
code { font-family: Helvetica, Arial; }
table.limit { margin: 5px; }
table.limit th { font-weight: bold; text-align: center; }
table.limit td { border: 1px solid #AAA; }
table.limit th, td { padding: 5px; }
table.limit th:first-child { text-align: right; }

input[type=text] { width: 80px;	}
.radical { font-size: 125%; padding-left: 6px; }
.radical span { font-size: 80%; border-top: 2px solid #000; padding: 4px 1px 0 3px; }

.graphie svg { position: absolute; top: 0; left: 0; }

#scratchpad { position: absolute; left: -20px; z-index: 1; width: 100%; height: 100%; overflow: hidden; }