body {
  height: 100%;
  margin: 0;
  background: #171717; }

.editor {
  display: block;
  height: 100%; }

.CodeMirror {
  font-size: 13px !important;
  font-family: Cousine, Monaco, 'Courier New', monospace !important;
  min-height: 100vh; }
  .CodeMirror.cm-s-monokai {
    background: #171717;
    color: #d4d4d4; }
    .CodeMirror.cm-s-monokai .CodeMirror-gutters {
      background: #171717; }
    .CodeMirror.cm-s-monokai span.cm-atom, .CodeMirror.cm-s-monokai span.cm-number {
      color: #b5cea8; }
    .CodeMirror.cm-s-monokai span.cm-keyword {
      color: #9f7ec0; }
    .CodeMirror.cm-s-monokai span.cm-comment {
      color: #44864e; }
    .CodeMirror.cm-s-monokai span.cm-variable-3 {
      color: #569cd6; }
    .CodeMirror.cm-s-monokai span.cm-variable {
      color: #dcd98a; }

.CodeMirror-scroll {
  overflow: auto !important; }

.CodeMirror-linenumber.CodeMirror-gutter-elt {
  color: #5a5a5a; }

.btn {
  display: none;
  position: fixed;
  bottom: 20px;
  right: 20px;
  z-index: 100;
  padding: 8px;
  border-radius: 5px;
  text-decoration: none;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 14px;
  background: #272727;
  color: white; }

@media screen and (min-width: 960px) {
  body {
    padding: 20px; }
  .CodeMirror {
    min-height: calc(100vh - 40px); }
  .btn {
    display: block; } }
