html { min-height: 100%; } body { padding: 20px; background-color: #191919; color: white; font-family: monospace; margin-bottom: 100px; } h1, h2, h3, h4, h5, h6 { color: orange; } a { text-decoration: none; color: orange; } a:hover { color: #191919; background-color: orange; } input { border: 1px solid black; background-color: white; } footer { background-color: black; position: fixed; left: 0; bottom: 0; width: calc(100vw - 20px); padding: 10px; text-align: center; overflow: hidden; } ul { padding-left: 20px; padding-bottom: 0px; list-style-type: none; } main { display: flex; gap: 20px; min-height: 80vh; } nav { padding-right: 10px; display: flex; flex-direction: column; border-right: 1px solid orange; width: 200px; } article { flex-grow: 1; } pre { background-color: #000; color: #DDD; padding: 10px; padding-left: 20px; } .grayed { color: gray; } .editor-toolbar { border-top: 0px solid #444; border-left: 0px solid #444; border-right: 0px solid #444; border-radius: 0px; } .EasyMDEContainer .CodeMirror { border: 1px solid #444; } .editor-toolbar .fa { color: white; } .editor-toolbar button.active, .editor-toolbar button:hover { background-color: black; } .CodeMirror { color: white; background-color: black; } .CodeMirror-cursor { border-left: 2px solid gray; }