* {
    box-sizing: border-box;
}
body > table {
    width: 100%;
}
body > table tr > td:nth-child(3) {
    text-align: right;
}
body > form {
    display: block;
    border: solid 1px black;
    margin: 1em 0;
    padding: 0.5em;
}
body > form > * {
    margin: 0.4em 0;
}
label {
    display: block;
}
textarea {
    width: 100%;
    height: 30em;
    font-family: monospace;
}
input[type=text] {
    width: 100%;
}
input[type=file] {
    display: block;
    margin-left: auto;
    margin-right: auto;
    background: #EEEEEE;
    border-radius: 4px;
}

kbd, code, samp, tt, pre {
    background: #DDDDFF;
    white-space: pre;
}
pre {
    margin: auto 2em;
    padding: .5em;
    overflow: auto;
    border: solid 1px #AAAAAA;
}

aside {
    padding: 10px;
    border-radius: 4px;
    border: solid 1px #ddd;
    background: rgb(240, 240, 240);
    opacity: 0.7;
}

.CodeMirror {
     /* match Firefox's built-in style for textearea */
    border: 1px solid rgb(232, 232, 231);
}
.CodeMirror .cm-trailingspace {
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAACCAYAAAB/qH1jAAAABmJLR0QA/wD/AP+gvaeTAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAB3RJTUUH3QUXCToH00Y1UgAAACFJREFUCNdjPMDBUc/AwNDAAAFMTAwMDA0OP34wQgX/AQBYgwYEx4f9lQAAAABJRU5ErkJggg==);
    background-position: bottom left;
    background-repeat: repeat-x;
}
.CodeMirror .cm-spell-error:not(.cm-url):not(.cm-comment):not(.cm-tag):not(.cm-word) {
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAACCAYAAAB/qH1jAAAABmJLR0QA/wD/AP+gvaeTAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAB3RJTUUH3QUXCToH00Y1UgAAACFJREFUCNdjPMDBUc/AwNDAAAFMTAwMDA0OP34wQgX/AQBYgwYEx4f9lQAAAABJRU5ErkJggg==) !important;
    background-position: bottom left !important;
    background-repeat: repeat-x !important;
    background-color: transparent !important;
}