.CodeMirror{ height:90vh !important;}
h4{font-size:18px;padding:0;margin:0;}
/* code above just for demo */

.cm-s-udb-dark.CodeMirror {background: #1B2B34;
  color: #f7f7f7;font-size: 16px;}
.cm-s-udb-dark div.CodeMirror-selected {background: rgba(255, 255, 255, 0.05);}
.cm-s-udb-dark .CodeMirror-line::selection,
.cm-s-udb-dark .CodeMirror-line > span::selection,
.cm-s-udb-dark .CodeMirror-line > span > span::selection {
  background: rgba(255, 255, 255, 0.05);
}
.cm-s-udb-dark .CodeMirror-line::-moz-selection,
.cm-s-udb-dark .CodeMirror-line > span::-moz-selection,
.cm-s-udb-dark .CodeMirror-line > span > span::-moz-selection {
  background: rgba(255, 255, 255, 0.05);
}
.cm-s-udb-dark .CodeMirror-gutters {
  background: #222;border-right: 1px solid #aaa;}

.cm-s-udb-dark .CodeMirror-guttermarker {color: white;}
.cm-s-udb-dark .CodeMirror-guttermarker-subtle {color: #aaa;}
.cm-s-udb-dark .CodeMirror-linenumber {color: #aaa;}
.cm-s-udb-dark .CodeMirror-cursor {border-left: 1px solid white;}
.cm-s-udb-dark .cm-keyword {color: #ec5f67;}
.cm-s-udb-dark .cm-atom {color: #c594c5;}
.cm-s-udb-dark .cm-number {color: #c594c5;}
.cm-s-udb-dark .cm-def {color: #f99157;}
.cm-s-udb-dark span.cm-variable {color: #ec5f67;}
.cm-s-udb-dark span.cm-variable-2{color: #6699cc;}
.cm-s-udb-dark span.cm-variable-3,
.cm-s-udb-dark span.cm-def,
.cm-s-udb-dark span.cm-type { color: #f99157;}
.cm-s-udb-dark .cm-operator { color: #cda869;}
.cm-s-udb-dark .cm-comment { color: #65737e;}
.cm-s-udb-dark .cm-string { color: #fac863;}
.cm-s-udb-dark .cm-string-2 { color: #bd6b18;}
.cm-s-udb-dark .cm-meta { background-color: #141414; color: #f7f7f7;}
.cm-s-udb-dark .cm-builtin { color: #cda869;}
.cm-s-udb-dark .cm-tag { color: #ec5f67;} /**/
.cm-s-udb-dark .cm-attribute { color: #99c794;} 
.cm-s-udb-dark .cm-property {color: #99c794;} 
.cm-s-udb-dark .cm-header { font-weight: bold;}
.cm-s-udb-dark .cm-hr { color: #AEAEAE;}
.cm-s-udb-dark .cm-link {color: #c594c5;text-decoration: none;}
.cm-s-udb-dark .cm-error {background: rgba(236, 95, 103, 0.4);}
.cm-s-udb-dark .CodeMirror-activeline-background {background: rgb(30, 61, 78);}
.cm-s-udb-dark .CodeMirror-matchingbracket {
border-bottom: 1px solid rgba(255, 255, 255, 0.5);
}
.cm-s-udb-dark .cm-qualifier { color: #ecc854;}

.box, .editor .top-boxes, .CodeMirror-gutter-wrapper, 
body.project .editor-pane, 
body.project .editor{background:#1B2B34;}
.CodeMirror-cursor{border-left-color:#FFFFFF;}.CodeMirror pre, 
.box pre,.editor .top-boxes pre,.CodeMirror-gutter-wrapper pre{color:#CDD3DE;}.cm-keyword{color:#EC5f67;}.cm-atom{color:#C594C5;}.box-html .cm-atom{color:#C594C5;}.cm-def{color:#F99157;}.cm-variable{color:#99C794;}.cm-variable-2{color:#6699CC;}.cm-variable-3{color:#CDD3DE;}.cm-header{color:#CDD3DE;}.cm-number{color:#CDD3DE;}.cm-property{color:#99C794;}.cm-attribute{color:#99C794;}.cm-builtin{color:#CDD3DE;}.cm-qualifier{color:#CDD3DE;}.cm-operator{color:#CDD3DE;}.cm-meta{color:#CDD3DE;}.cm-string{color:#FAC863;}.cm-string-2{color:#FAC863;}.cm-tag{color:#EC5f67;}.box-css .cm-tag{color:#EC5f67;}.cm-tag.cm-bracket{color:#EC5f67;}.CodeMirror-linenumber{color:#5D5D5D;}.CodeMirror-guttermarker-subtle{color:#5D5D5D;}.cm-comment{color:#65737e;}.cm-searching, .CodeMirror-focused .CodeMirror-selected, .CodeMirror-selected{background-color:#263844;}