/* Styles for KB Crawl code mirror element
-------------------------------------*/

.kb-codemirror .CodeMirror {
    height: 200px !important;
    font-family: Trebuchet MS;
    font-size: 1em;
    border: 1px solid #cfcfcf;
}

.kb-codemirror-preview .CodeMirror {
    height: 100% !important;
}

.kb-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;
}

.kb-codemirror .cm-string {
    color: green !important;
}

.kb-codemirror .cm-number, .kb-codemirror .cm-atom {
    color: black !important;
}

.kb-codemirror .cm-keyword {
    color: blue !important;
    font-weight: bold;
}

.kb-codemirror .cm-variable-1 {
    color: red !important;
    font-weight: bold;
}

.kb-codemirror .cm-variable-2 {
    color: red !important;
    font-weight: bold;
}

.kb-codemirror .cm-variable-3 {
    color: green !important;
    font-weight: bold;
}

.kb-codemirror .kb-codemirror.CodeMirror-nonmatchingbracket {
    font-weight: bold;
    font-size: 1.4em;
    vertical-align: middle;
}

.kb-codemirror .CodeMirror-matchingbracket {
    font-weight: bold;
    font-size: 1.4em;
    vertical-align: middle;
    color: red !important;
}

.kb-codemirror .CodeMirror-nonmatchingbracket {
    font-weight: bold;
    font-size: 1.4em;
    vertical-align: middle;
}

.kb-codemirror .cm-matchhighlight {
    background-color: green;
    color: white !important
}

.kb-codemirror .CodeMirror-selection-highlight-scrollbar {
    background-color: green
}

.kb-codemirror .CodeMirror-sizer {
    margin-left: 30px !important
}

.kb-codemirror .CodeMirror-linenumbers {
    width: 30px !important
}

.kb-codemirror .CodeMirror-gutter-elt {
    width: 0 !important
}

.kb-codemirror .CodeMirror-gutter-wrapper {
    left: -37px !important;
}