body {
    background-color: #25282c;
}

body * {
  font-family: 'Ubuntu', sans-serif;
}

h1 {
  color: #8caabb;
}

#editor {
    width: 100%;
    height: 480px;
}

.m0  { margin:        0 }
.mt0 { margin-top:    0 }
.mr0 { margin-right:  0 }
.mb0 { margin-bottom: 0 }
.ml0 { margin-left:   0 }
.mx0 { margin-left:   0; margin-right:  0 }
.my0 { margin-top:    0; margin-bottom: 0 }

.m1  { margin:        6px; }
.mt1 { margin-top:    6px; }
.mr1 { margin-right:  6px; }
.mb1 { margin-bottom: 6px; }
.ml1 { margin-left:   6px; }
.mx1 { margin-left:   5px;; margin-right:  6px; }
.my1 { margin-top:    5px;; margin-bottom: 6px; }

.m2  { margin:        12px; }
.mt2 { margin-top:    12px; }
.mr2 { margin-right:  12px; }
.mb2 { margin-bottom: 12px; }
.ml2 { margin-left:   12px; }
.mx2 { margin-left:   12px;; margin-right:  12px; }
.my2 { margin-top:    12px;; margin-bottom: 12px; }

.m3  { margin:        18px; }
.mt3 { margin-top:    18px; }
.mr3 { margin-right:  18px; }
.mb3 { margin-bottom: 18px; }
.ml3 { margin-left:   18px; }
.mx3 { margin-left:   18px;; margin-right:  18px; }
.my3 { margin-top:    18px;; margin-bottom: 18px; }

.m4  { margin:        24px; }
.mt4 { margin-top:    24px; }
.mr4 { margin-right:  24px; }
.mb4 { margin-bottom: 24px; }
.ml4 { margin-left:   24px; }
.mx4 { margin-left:   24px;; margin-right:  24px; }
.my4 { margin-top:    24px;; margin-bottom: 24px; }

.mxn1 { margin-left: -6px; margin-right: -6px; }
.mxn2 { margin-left: -12px; margin-right: -12px; }
.mxn3 { margin-left: -18px; margin-right: -18px; }
.mxn4 { margin-left: -24px; margin-right: -24px; }

.ml-auto { margin-left: auto }
.mr-auto { margin-right: auto }
.mx-auto { margin-left: auto; margin-right: auto; }