View difference between Paste ID: 2RdvC05x and 5s861Z2j
SHOW: | | - or go back to the newest paste.
1
#game
2
  {
3-
    background:#150c01;
3+
    background:#040014;
4
	background-size: cover;
5
	font-family: DejaVu Sans Mono, monospace;
6
	letter-spacing: 1px;
7
	font-stretch: ultra-expanded
8-
    color:#d0ff00;
8+
    color:#ff0000;
9
  }
10
11
12
.box
13
{
14-
	text-align:left;
14+
15-
	padding: 0px;
15+
16
	box-shadow:none;
17
}
18
#box-res.fullWidth
19
{
20
	width:100%;
21
	top:0%;
22
	height:5%;
23
	min-height:32px;
24
	z-index:100;
25
	position:absolute;
26
	color:#ff0000 !important;
27-
	color:#d0ff00 !important;
27+
28
.box-header,.box-footer,.box-bit
29
{
30
	background:#ff0000;
31-
	background:#d0ff00;
31+
	color:#040014;
32-
	color:#150c01;
32+
33
}
34
35
.box-header{
36
	font-size: 20px;
37
  	font-style: italic;
38
	font-weight: 1000;
39
	text-align: start;
40
	padding-left: 20px;
41
}
42
.box-bit{border-radius:0px;}
43
44
.box-header
45
{
46
	border-bottom-left-radius:0px;
47
	border-bottom-right-radius:0px;
48
	margin-bottom:0px;
49
}
50
.box-footer
51
{
52
	border-top-left-radius:0px;
53
	border-top-right-radius:0px;
54
	margin-top:4px;
55
}
56
57
58
#box-main
59
{
60
	left:0px;
61
	top:0px;
62
	bottom:0px;
63
	overflow:hidden;
64
	width:19%;
65
	position:absolute;
66
margin-bottom: 1%;
67
	margin-left: 1%;
68
	margin-right: 1%;
69
}
70
71
#box-buttons
72
{
73
	top:0px;
74
	right:0px;
75
	bottom:0px;
76
	left:0px;
77
	position:absolute;
78
}
79
#box-store
80
{
81
	right:0px;
82
	top:32px;
83
	bottom:0px;
84
	width:80% !important;
85
	position:absolute;
86
	margin-bottom: 1%;
87
	margin-left: 1%;
88
	margin-right: 1%;
89
}
90
#box-buildings,#box-upgrades, #box-buildings2,#box-upgrades2
91
{
92
	top:0px;
93
	bottom:0px;
94
	width:49%;
95
	right:0%;
96
	overflow-x:hidden;
97
	overflow-y:auto;
98
	position:absolute;
99
}
100
#box-buildings, #box-upgrades2
101
{right:51%;}
102
103
#box-buildings, #box-upgrades
104
{bottom: 52%;}
105
106
107
108
109
110
111
.thing
112
{
113
	display:inline-block;
114
	padding:0px;
115
	margin:0px;
116
	cursor:pointer;
117
}
118
.thing:hover,.thing.lit
119
{
120
	background:#ff0000;
121-
	background:#d0ff00;
121+
122
123
124
125
.upgrade.owned,.achiev.owned
126
{
127
	color:#ff0000;
128-
	color:#d0ff00;
128+
129
}
130
.thing-text,.thing-costs{
131
132
font-weight:bold;
133
font-size: 16px;
134
135
}
136
137
.building
138
{
139
	border-top-left-radius:0px;
140
	border-bottom-left-radius:0px;
141
	display:block;
142
	margin-right:0px;
143
	font-size:14px;
144
}
145
146-
.building, .upgrade{
146+
147-
padding-left: 4px;
147+
148
	display:block;
149
	margin-left:0px;
150
	margin-right:0px;
151
	z-index:10;
152
}
153
#game .fullWidth
154
{
155
	height:auto;
156
	min-height:auto;
157
}
158
159
.fullWidth:before,.fullWidth:after
160
{
161
	content:'';
162
	height:1px;
163
	position:absolute;
164
	left:0px;
165
	right:0px;
166
	z-index:-1;
167
}
168
.fullWidth:before{top:-1px;}
169
.fullWidth:after{bottom:-1px;}
170
171
.fullWidth .thing-icon
172
{
173
	margin-top:0px;
174
	margin-bottom:0px;
175
}
176
.fullWidth .thing-text
177
{
178
	margin-top:0px;
179
	margin-bottom:0px;
180
}
181
182
183
184
#box-buildingsHeader{
185
top: 0px;
186
width:49%;
187
left: 0%;
188
position: absolute;
189
height: 32px;
190
191
192
193
194
}
195
196
#box-upgradesHeader{
197
top: 0px;
198
width:49%;
199
right: 0%;
200
position: absolute;
201
height: 32px;
202
}
203
204
#box-buildings2Header{
205
top: 51%;
206
width:49%;
207
right: 0%;
208
position: absolute;
209
height: 32px;
210
211
212
213
214
}
215
216
#box-upgrades2Header{
217
top: 51%;
218
width:49%;
219
left: 0%;
220
position: absolute;
221
height: 32px;
222
}
223
224
#box-logHeader{
225
opacity: 1;
226
position: absolute;
227
top: 51%;
228
width: 86%;
229
left: 0px;
230
height: 32px;
231
margin-left: 2%;
232
margin-right: 2%;
233
}
234
235
236
#box-buildingsHeader:before, #box-upgradesHeader:before, #box-buildings2Header:before, #box-upgrades2Header:before, #box-logHeader:before{
237
238
height: 10px;
239
240
241
	content: '';
242
    position: absolute;
243
    top: 0; left: 0;
244
    border-top: 16px solid #040014;
245
    border-right: 16px solid #ff0000;
246
    width: 0;
247
}
248
249-
    border-top: 16px solid #150c01;
249+
250-
    border-right: 16px solid #d0ff00;
250+
251
252
253
254
#box-buildings, #box-upgrades{
255
top: 32px;
256
border: thick solid #ff0000;
257
color:#ff0000;
258
}
259
260
#box-buildings2, #box-upgrades2{
261-
border: thick solid #d0ff00;
261+
262-
color:#d0ff00;
262+
263
border: thick solid #ff0000;
264
color:#ff0000;
265
}
266
267
.building:hover, .upgrade:hover{
268-
border: thick solid #d0ff00;
268+
269-
color:#d0ff00;
269+
color: #040014;
270
background: #ff0000;
271
272
}
273
#bulkDisplay{
274-
color: #150c01;
274+
275-
background: #d0ff00;
275+
276
top: 0px;
277
}
278
.upgrade{
279
width:100%;
280
281
}
282
283
.thing-text, .thing-costs{
284
285
padding: 8px;
286
text-shadow: 0px 0px 0px #000;
287
288
}.box{
289
text-shadow: 0px 0px 0px #000;
290
291
}
292
293
#box-log{
294
position: absolute !important;
295
opacity: 1 !important;
296
top: 51%;
297
margin-top: 32px;
298
left: 0% !important;
299
bottom: 0%;
300
width: 86% !important;
301
background:#040014;
302
color:#ff0000;
303
border: thick solid #ff0000;
304
305
	margin-left: 2%;
306-
background:#150c01;
306+
307-
color:#d0ff00;
307+
308-
border: thick solid #d0ff00;
308+
309
background:#040014;
310
color:#ff0000;
311
312
313
}
314-
background:#150c01;
314+
315-
color:#d0ff00;
315+
316
flex-direction: column;
317
padding: 5%;
318
background:#040014;
319
color:#ff0000;
320
overflow:auto;
321
}
322
323-
background:#150c01;
323+
#thing-0{
324-
color:#d0ff00;
324+
325
326
} 
327
#box-things-Buttons{
328
position: absolute;
329
height: 50%;
330
top: 0%;
331
width: 100%;
332
}
333
334
.wobble {
335
    animation: wobble 0.5s;
336
    animation-duration: 0.5s;
337
    transition: transform 1.00s ease-out;
338
   
339
}
340
 
341
@keyframes wobble {
342
0% {
343
    opacity: 0.7;
344
    transform: scale(1);
345
}
346
5% {
347
    opacity: 1;
348
    transform: scale(0.9);
349
}
350
100%
351
    opacity: 1;
352
    transform: scale(1);
353
}
354
}
355
::-webkit-scrollbar{
356
width: 0.5vw !important;
357
358
}
359
#log::-webkit-scrollbar, #box-upgrades::-webkit-scrollbar, #box-buildings::-webkit-scrollbar, #box-upgrades2::-webkit-scrollbar, #box-buildings2::-webkit-scrollbar {
360
    width: 0.5vw !important;
361
}
362
#log::-webkit-scrollbar-thumb, #box-upgrades::-webkit-scrollbar-thumb, #box-buildings::-webkit-scrollbar-thumb, #box-upgrades2::-webkit-scrollbar-thumb, #box-buildings2::-webkit-scrollbar-thumb {
363
   background: #ff000099 !important;
364-
   background: #d0ff0099 !important;
364+
365
}
366
#log::-webkit-scrollbar-thumb:hover, #box-upgrades::-webkit-scrollbar-thumb:hover, #box-buildings::-webkit-scrollbar-thumb:hover, #box-upgrades2::-webkit-scrollbar-thumb:hover, #box-buildings2::-webkit-scrollbar-thumb:hover {
367
   background: #ff0000 !important;
368-
   background: #d0ff00 !important;
368+
369
}
370
371
#log::-webkit-scrollbar-track, #box-upgrades::-webkit-scrollbar-track, #box-buildings::-webkit-scrollbar-track, #box-upgrades2::-webkit-scrollbar-track, #box-buildings2::-webkit-scrollbar-track {
372
   background: #040014 !important;
373-
   background: #150c01 !important;
373+
374
  
375
}
376
377
.thing.bigButton{
378
position: absolute !important;
379
margin-left: -100%;
380
margin-top: -30%;
381
margin-right: 10%;
382
383
position: absolute;
384
width: 10vw;
385
height: 10vw;
386
top: 28vh;
387
left: 23vw;
388
}
389
390
.popup, #tooltip, .toast {
391-
.thing.bigButton .thing-icon{
391+
    background: #040014;
392
    color: #ff0000 ;
393
    border-radius: 0px;
394-
background-size: contain !important;
394+
395
    padding: 8px 8px;
396
 	border: thick solid #ff0000;
397
	box-shadow: none !important;
398-
    background: #150c01;
398+
399-
    color: #d0ff00 ;
399+
400
font-weight:bold;
401
}
402
403-
 	border: thick solid #d0ff00;
403+
404
#tooltipContent{
405
color: #ff0000;
406
font-weight: 100;
407
 
408
font-weight:bold;
409
}
410
411
#tooltip .desc, .listing.b, .listing b, .desc b{
412-
color: #d0ff00;
412+
413
color: #ff0000;
414
415
}
416
#tooltip .thing-icon{
417
418
}.tooltipPoint{
419
border: 0px !important;
420-
color: #d0ff00;
420+
421
text-shadow: none !important;
422
color: #ff0000;
423
visibility: hidden;
424
}
425
#box-things-sortup, #box-things-sortup2, #box-things-Upgrades, #box-things-upgrades2  /*if necessary, change this to the name of the box containing your upgrades. it should start with "box-things" and you can use inspect element to find it*/
426
{
427
    display:flex;
428
    flex-wrap:wrap;
429-
color: #d0ff00;
429+
430
	flex-direction: column-reverse;
431
}
432
433
#box-things-Buildings, #box-things-buildings2{
434
	display:flex;
435
    flex-wrap:wrap;
436
    justify-content:center; /*you can change this to "flex-start" if you want upgrades aligned to the left*/
437
	flex-direction: column-reverse;
438
}
439
440
.tag-sortup, .tag-sortup2, .building, .upgrade2.notOwned, .upgrade2.cantAfford{
441
    order:3;
442
}
443
.upgrade.notOwned {
444
    order:3;
445
}
446
.upgrade.owned, .upgrade2.owned
447
{
448
    order:1;
449
}
450
.achiev:hover{
451
margin-right: -1px;
452
border: 1px solid #ff0000;
453
color: #040014;
454
background: #ff0000;
455
456
}.achiev{
457
margin-right: -1px;
458
border: 1px solid #ff0000;
459-
border: 1px solid #d0ff00;
459+
color: #ff0000;
460-
color: #150c01;
460+
background: #040014;
461-
background: #d0ff00;
461+
462
}
463
464
.systemButton{
465-
border: 1px solid #d0ff00;
465+
466-
color: #d0ff00;
466+
467-
background: #150c01;
467+
468
    background: #040014;
469
    box-shadow: none;
470
    padding: 4px 6px;
471
    margin: 2px;
472
    position: relative;
473
border: 1px solid #ff000099;
474
}
475-
    background: #150c01;
475+
476
    
477
    background: #040014;
478
    
479
border: 1px solid #ff0000;
480-
border: 1px solid #d0ff0099;
480+
481
482
.tickbox.on:before {
483
    background: #ff0000;
484-
    background: #150c01;
484+
485
}
486-
border: 1px solid #d0ff00;
486+
487
.tickbox, .footerTitle{
488
color: #ff0000;
489
}
490-
    background: #d0ff00;
490+
491
.tickbox:before{
492
background: #040014;
493
}