#editor {
  background-color: #f5f5f5;
  padding: 40px;
}

.CodeMirror {
  font-family: 'Roboto Mono', monospace;
  line-height: 170%;
}

/* Define the readability classes */
.cm-readability-0   { background-color: hsl(100, 80%, 60%); color: #444444 !important; }
.cm-readability-1   { background-color: hsl( 90, 80%, 60%); color: #444444 !important; }
.cm-readability-2   { background-color: hsl( 80, 80%, 60%); color: #444444 !important; }
.cm-readability-3   { background-color: hsl( 70, 80%, 60%); color: #444444 !important; }
.cm-readability-4   { background-color: hsl( 60, 80%, 60%); color: #444444 !important; }
.cm-readability-5   { background-color: hsl( 50, 80%, 60%); color: #444444 !important; }
.cm-readability-6   { background-color: hsl( 40, 80%, 60%); color: #444444 !important; }
.cm-readability-7   { background-color: hsl( 30, 80%, 60%); color: #444444 !important; }
.cm-readability-8   { background-color: hsl( 10, 80%, 60%); color: #444444 !important; }
.cm-readability-9   { background-color: hsl(  0, 80%, 60%); color: #444444 !important; }
.cm-readability-10  { background-color: hsl(350, 80%, 60%); color: #444444 !important; }

.CodeMirror { height: auto; }