1/* App layout */
 2
 3#editor,
 4#footer,
 5#copy,
 6#progress {
 7    position: absolute;
 8    left: 0;
 9    right: 0;
10}
11
12#editor {
13    top: 0;
14    bottom: 46px;
15}
16.readonly #editor {
17    bottom: 0;
18}
19
20.CodeMirror {
21    height: 100%;
22    font-size: 13px;
23}
24
25#footer,
26#copy {
27    bottom: 0;
28    height: 38px;
29    padding: 8px 8px 0;
30    background-color: #3b3b47;
31    display: flex;
32    flex-wrap: wrap;
33}
34#footer > *,
35#copy > * {
36    margin: 0 6px;
37}
38
39.readonly #footer {
40    display: none;
41}
42
43#progress {
44    top: 0;
45    height: 3px;
46    background: #ff79c6;
47    z-index: 5;
48    width: 0;
49}
50.grow {
51    flex-grow: 1;
52}
53
54/* Form elements */
55
56.ss-main {
57    max-width: 300px;
58    width: calc(100% - 150px);
59    font-family: sans-serif;
60}
61
62.ss-main .ss-single-selected,
63button,
64input[type='text'],
65input[type='search'] {
66    height: 28px;
67    background-color: #3b3b47 !important;
68    color: #fff !important;
69    border-radius: 2px !important;
70    border: 1px solid #ccc !important;
71    font-size: 14px !important;
72}
73input[type='text'],
74input[type='search'] {
75    height: 26px !important;
76    padding: 0 5px;
77}
78input::-moz-selection {
79    background-color: rgba(90, 95, 128, 0.99);
80}
81input::selection {
82    background-color: rgba(90, 95, 128, 0.99);
83}
84button {
85    cursor: pointer;
86    padding: 4px 8px;
87}
88button:hover {
89    background-color: rgba(255, 255, 255, 0.1) !important;
90}
91.ss-content {
92    background-color: #282936;
93    color: #dedede;
94    font-size: 14px;
95}
96.ss-content .ss-disabled {
97    background-color: #3b3b47 !important;
98}