semantic-ui-sass 1.12.3.0 → 2.0.4.0

Sign up to get free protection for your applications and to get access to all the features.
Files changed (77) hide show
  1. checksums.yaml +4 -4
  2. data/CHANGELOG.md +4 -0
  3. data/app/assets/javascripts/semantic-ui.js +1 -0
  4. data/app/assets/javascripts/semantic-ui/accordion.js +67 -53
  5. data/app/assets/javascripts/semantic-ui/api.js +395 -189
  6. data/app/assets/javascripts/semantic-ui/checkbox.js +322 -114
  7. data/app/assets/javascripts/semantic-ui/colorize.js +4 -2
  8. data/app/assets/javascripts/semantic-ui/dimmer.js +74 -50
  9. data/app/assets/javascripts/semantic-ui/dropdown.js +2046 -584
  10. data/app/assets/javascripts/semantic-ui/embed.js +662 -0
  11. data/app/assets/javascripts/semantic-ui/form.js +345 -163
  12. data/app/assets/javascripts/semantic-ui/modal.js +119 -90
  13. data/app/assets/javascripts/semantic-ui/nag.js +8 -9
  14. data/app/assets/javascripts/semantic-ui/popup.js +390 -228
  15. data/app/assets/javascripts/semantic-ui/progress.js +112 -103
  16. data/app/assets/javascripts/semantic-ui/rating.js +79 -55
  17. data/app/assets/javascripts/semantic-ui/search.js +305 -123
  18. data/app/assets/javascripts/semantic-ui/shape.js +94 -48
  19. data/app/assets/javascripts/semantic-ui/sidebar.js +84 -151
  20. data/app/assets/javascripts/semantic-ui/site.js +5 -5
  21. data/app/assets/javascripts/semantic-ui/state.js +4 -4
  22. data/app/assets/javascripts/semantic-ui/sticky.js +108 -35
  23. data/app/assets/javascripts/semantic-ui/tab.js +220 -125
  24. data/app/assets/javascripts/semantic-ui/transition.js +205 -171
  25. data/app/assets/javascripts/semantic-ui/visibility.js +220 -100
  26. data/app/assets/javascripts/semantic-ui/visit.js +6 -4
  27. data/app/assets/stylesheets/semantic-ui/collections/_breadcrumb.scss +17 -16
  28. data/app/assets/stylesheets/semantic-ui/collections/_form.scss +223 -121
  29. data/app/assets/stylesheets/semantic-ui/collections/_grid.scss +462 -448
  30. data/app/assets/stylesheets/semantic-ui/collections/_menu.scss +949 -665
  31. data/app/assets/stylesheets/semantic-ui/collections/_message.scss +134 -92
  32. data/app/assets/stylesheets/semantic-ui/collections/_table.scss +270 -208
  33. data/app/assets/stylesheets/semantic-ui/elements/_all.scss +1 -0
  34. data/app/assets/stylesheets/semantic-ui/elements/_button.scss +1357 -521
  35. data/app/assets/stylesheets/semantic-ui/elements/_container.scss +125 -0
  36. data/app/assets/stylesheets/semantic-ui/elements/_divider.scss +51 -31
  37. data/app/assets/stylesheets/semantic-ui/elements/_flag.scss +3 -3
  38. data/app/assets/stylesheets/semantic-ui/elements/_header.scss +270 -144
  39. data/app/assets/stylesheets/semantic-ui/elements/_icon.scss +241 -110
  40. data/app/assets/stylesheets/semantic-ui/elements/_image.scss +30 -16
  41. data/app/assets/stylesheets/semantic-ui/elements/_input.scss +88 -53
  42. data/app/assets/stylesheets/semantic-ui/elements/_label.scss +432 -281
  43. data/app/assets/stylesheets/semantic-ui/elements/_list.scss +172 -128
  44. data/app/assets/stylesheets/semantic-ui/elements/_loader.scss +16 -14
  45. data/app/assets/stylesheets/semantic-ui/elements/_rail.scss +15 -7
  46. data/app/assets/stylesheets/semantic-ui/elements/_reveal.scss +32 -13
  47. data/app/assets/stylesheets/semantic-ui/elements/_segment.scss +329 -212
  48. data/app/assets/stylesheets/semantic-ui/elements/_step.scss +291 -99
  49. data/app/assets/stylesheets/semantic-ui/globals/_reset.scss +2 -2
  50. data/app/assets/stylesheets/semantic-ui/globals/_site.scss +19 -18
  51. data/app/assets/stylesheets/semantic-ui/modules/_accordion.scss +17 -18
  52. data/app/assets/stylesheets/semantic-ui/modules/_all.scss +1 -0
  53. data/app/assets/stylesheets/semantic-ui/modules/_checkbox.scss +265 -161
  54. data/app/assets/stylesheets/semantic-ui/modules/_dimmer.scss +29 -15
  55. data/app/assets/stylesheets/semantic-ui/modules/_dropdown.scss +441 -156
  56. data/app/assets/stylesheets/semantic-ui/modules/_embed.scss +168 -0
  57. data/app/assets/stylesheets/semantic-ui/modules/_modal.scss +163 -85
  58. data/app/assets/stylesheets/semantic-ui/modules/_nag.scss +8 -8
  59. data/app/assets/stylesheets/semantic-ui/modules/_popup.scss +88 -23
  60. data/app/assets/stylesheets/semantic-ui/modules/_progress.scss +185 -129
  61. data/app/assets/stylesheets/semantic-ui/modules/_rating.scss +75 -60
  62. data/app/assets/stylesheets/semantic-ui/modules/_search.scss +99 -52
  63. data/app/assets/stylesheets/semantic-ui/modules/_shape.scss +11 -11
  64. data/app/assets/stylesheets/semantic-ui/modules/_sidebar.scss +16 -12
  65. data/app/assets/stylesheets/semantic-ui/modules/_sticky.scss +4 -4
  66. data/app/assets/stylesheets/semantic-ui/modules/_tab.scss +3 -3
  67. data/app/assets/stylesheets/semantic-ui/modules/_transition.scss +31 -39
  68. data/app/assets/stylesheets/semantic-ui/views/_ad.scss +3 -3
  69. data/app/assets/stylesheets/semantic-ui/views/_all.scss +1 -0
  70. data/app/assets/stylesheets/semantic-ui/views/_card.scss +204 -162
  71. data/app/assets/stylesheets/semantic-ui/views/_comment.scss +6 -6
  72. data/app/assets/stylesheets/semantic-ui/views/_feed.scss +51 -26
  73. data/app/assets/stylesheets/semantic-ui/views/_item.scss +62 -36
  74. data/app/assets/stylesheets/semantic-ui/views/_statistic.scss +265 -90
  75. data/lib/semantic/ui/sass/version.rb +2 -2
  76. data/semantic-ui-sass.gemspec +2 -2
  77. metadata +9 -6
@@ -1,4 +1,5 @@
1
1
  @import 'button';
2
+ @import 'container';
2
3
  @import 'divider';
3
4
  @import 'flag';
4
5
  @import 'header';
@@ -1,9 +1,9 @@
1
1
  /*!
2
- * # Semantic UI 1.12.3 - Button
2
+ * # Semantic UI 2.0.4 - Button
3
3
  * http://github.com/semantic-org/semantic-ui/
4
4
  *
5
5
  *
6
- * Copyright 2014 Contributorss
6
+ * Copyright 2015 Contributors
7
7
  * Released under the MIT license
8
8
  * http://opensource.org/licenses/MIT
9
9
  *
@@ -21,21 +21,20 @@
21
21
  outline: none;
22
22
  border: none;
23
23
  vertical-align: baseline;
24
- background-color: #e0e0e0;
24
+ background: #e0e1e2 none;
25
25
  color: rgba(0, 0, 0, 0.6);
26
26
  font-family: 'Lato', 'Helvetica Neue', Arial, Helvetica, sans-serif;
27
27
  margin: 0em 0.25em 0em 0em;
28
- padding: 0.78571em 1.5em 0.78571em;
28
+ padding: 0.78571429em 1.5em 0.78571429em;
29
29
  text-transform: none;
30
30
  text-shadow: none;
31
31
  font-weight: bold;
32
- line-height: 1;
32
+ line-height: 1em;
33
33
  font-style: normal;
34
34
  text-align: center;
35
35
  text-decoration: none;
36
- background-image: none;
37
- border-radius: 0.2857rem;
38
- box-shadow: 0px 0px 0px 1px transparent inset, 0px 0em 0px 0px rgba(39, 41, 43, 0.15) inset;
36
+ border-radius: 0.28571429rem;
37
+ box-shadow: 0px 0px 0px 1px transparent inset, 0px 0em 0px 0px rgba(34, 36, 38, 0.15) inset;
39
38
  -webkit-user-select: none;
40
39
  -moz-user-select: none;
41
40
  -ms-user-select: none;
@@ -57,9 +56,9 @@
57
56
  ---------------*/
58
57
 
59
58
  .ui.button:hover {
60
- background-color: #e8e8e8;
59
+ background-color: #cacbcd;
61
60
  background-image: none;
62
- box-shadow: '';
61
+ box-shadow: 0px 0px 0px 1px transparent inset, 0px 0em 0px 0px rgba(34, 36, 38, 0.15) inset;
63
62
  color: rgba(0, 0, 0, 0.8);
64
63
  }
65
64
  .ui.button:hover .icon {
@@ -71,10 +70,10 @@
71
70
  ---------------*/
72
71
 
73
72
  .ui.button:focus {
74
- background-color: '';
73
+ background-color: #cacbcd;
75
74
  color: rgba(0, 0, 0, 0.8);
76
75
  background-image: '' !important;
77
- box-shadow: 0px 0px 0px 1px transparent inset, 0px 0px 1px rgba(81, 167, 232, 0.8) inset, 0px 0px 3px 2px rgba(81, 167, 232, 0.8) !important;
76
+ box-shadow: '' !important;
78
77
  }
79
78
  .ui.button:focus .icon {
80
79
  opacity: 0.85;
@@ -86,10 +85,10 @@
86
85
 
87
86
  .ui.button:active,
88
87
  .ui.active.button:active {
89
- background-color: #cccccc;
88
+ background-color: #babbbc;
90
89
  background-image: '';
91
- color: rgba(0, 0, 0, 0.8);
92
- box-shadow: 0px 0px 0px 1px transparent inset, 0px 1px 4px 0px rgba(39, 41, 43, 0.15) inset !important;
90
+ color: rgba(0, 0, 0, 0.9);
91
+ box-shadow: 0px 0px 0px 1px transparent inset, none;
93
92
  }
94
93
 
95
94
  /*--------------
@@ -97,18 +96,18 @@
97
96
  ---------------*/
98
97
 
99
98
  .ui.active.button {
100
- background-color: #d0d0d0;
99
+ background-color: #c0c1c2;
101
100
  background-image: none;
102
101
  box-shadow: 0px 0px 0px 1px transparent inset;
103
- color: rgba(0, 0, 0, 0.8);
102
+ color: rgba(0, 0, 0, 0.95);
104
103
  }
105
104
  .ui.active.button:hover {
106
- background-color: #d0d0d0;
105
+ background-color: #c0c1c2;
107
106
  background-image: none;
108
- color: rgba(0, 0, 0, 0.8);
107
+ color: rgba(0, 0, 0, 0.95);
109
108
  }
110
109
  .ui.active.button:active {
111
- background-color: #d0d0d0;
110
+ background-color: #c0c1c2;
112
111
  background-image: none;
113
112
  }
114
113
 
@@ -124,18 +123,18 @@
124
123
  text-shadow: none !important;
125
124
  color: transparent !important;
126
125
  opacity: 1;
127
- pointer-events: none;
128
- -webkit-transition: all 0s linear, opacity 0.2s ease;
129
- transition: all 0s linear, opacity 0.2s ease;
126
+ pointer-events: auto;
127
+ -webkit-transition: all 0s linear, opacity 0.1s ease;
128
+ transition: all 0s linear, opacity 0.1s ease;
130
129
  }
131
130
  .ui.loading.button:before {
132
131
  position: absolute;
133
132
  content: '';
134
133
  top: 50%;
135
134
  left: 50%;
136
- margin: -0.64285em 0em 0em -0.64285em;
137
- width: 1.2857em;
138
- height: 1.2857em;
135
+ margin: -0.64285714em 0em 0em -0.64285714em;
136
+ width: 1.28571429em;
137
+ height: 1.28571429em;
139
138
  border-radius: 500rem;
140
139
  border: 0.2em solid rgba(0, 0, 0, 0.15);
141
140
  }
@@ -144,9 +143,9 @@
144
143
  content: '';
145
144
  top: 50%;
146
145
  left: 50%;
147
- margin: -0.64285em 0em 0em -0.64285em;
148
- width: 1.2857em;
149
- height: 1.2857em;
146
+ margin: -0.64285714em 0em 0em -0.64285714em;
147
+ width: 1.28571429em;
148
+ height: 1.28571429em;
150
149
  -webkit-animation: button-spin 0.6s linear;
151
150
  animation: button-spin 0.6s linear;
152
151
  -webkit-animation-iteration-count: infinite;
@@ -185,7 +184,7 @@
185
184
  border-color: rgba(0, 0, 0, 0.1);
186
185
  }
187
186
  .ui.basic.loading.button:not(.inverted):after {
188
- border-top-color: #aaaaaa;
187
+ border-top-color: #767676;
189
188
  }
190
189
 
191
190
  /*-------------------
@@ -198,9 +197,7 @@
198
197
  .ui.disabled.button:hover,
199
198
  .ui.disabled.active.button {
200
199
  cursor: default;
201
- background-color: #dcddde !important;
202
- color: rgba(0, 0, 0, 0.4) !important;
203
- opacity: 0.3 !important;
200
+ opacity: 0.45 !important;
204
201
  background-image: none !important;
205
202
  box-shadow: none !important;
206
203
  pointer-events: none;
@@ -208,7 +205,7 @@
208
205
 
209
206
  /* Basic Group With Disabled */
210
207
  .ui.basic.buttons .ui.disabled.button {
211
- border-color: rgba(39, 41, 43, 0.5);
208
+ border-color: rgba(34, 36, 38, 0.5);
212
209
  }
213
210
 
214
211
 
@@ -224,8 +221,9 @@
224
221
  .ui.animated.button {
225
222
  position: relative;
226
223
  overflow: hidden;
227
- vertical-align: middle;
228
224
  padding-right: 0em !important;
225
+ vertical-align: middle;
226
+ z-index: 1;
229
227
  }
230
228
  .ui.animated.button .content {
231
229
  will-change: transform, opacity;
@@ -255,10 +253,12 @@
255
253
  right: -100%;
256
254
  margin-top: -0.5em;
257
255
  }
256
+ .ui.animated.button:focus .visible.content,
258
257
  .ui.animated.button:hover .visible.content {
259
258
  left: auto;
260
259
  right: 200%;
261
260
  }
261
+ .ui.animated.button:focus .hidden.content,
262
262
  .ui.animated.button:hover .hidden.content {
263
263
  left: auto;
264
264
  right: 0%;
@@ -281,12 +281,14 @@
281
281
  left: 0%;
282
282
  right: auto;
283
283
  }
284
+ .ui.vertical.animated.button:focus .visible.content,
284
285
  .ui.vertical.animated.button:hover .visible.content {
285
286
  -webkit-transform: translateY(200%);
286
287
  -ms-transform: translateY(200%);
287
288
  transform: translateY(200%);
288
289
  right: auto;
289
290
  }
291
+ .ui.vertical.animated.button:focus .hidden.content,
290
292
  .ui.vertical.animated.button:hover .hidden.content {
291
293
  top: 50%;
292
294
  right: auto;
@@ -314,6 +316,7 @@
314
316
  -ms-transform: scale(1.5);
315
317
  transform: scale(1.5);
316
318
  }
319
+ .ui.fade.animated.button:focus .visible.content,
317
320
  .ui.fade.animated.button:hover .visible.content {
318
321
  left: auto;
319
322
  right: auto;
@@ -322,6 +325,7 @@
322
325
  -ms-transform: scale(0.75);
323
326
  transform: scale(0.75);
324
327
  }
328
+ .ui.fade.animated.button:focus .hidden.content,
325
329
  .ui.fade.animated.button:hover .hidden.content {
326
330
  left: 0%;
327
331
  right: auto;
@@ -341,6 +345,8 @@
341
345
  color: #ffffff;
342
346
  text-shadow: none !important;
343
347
  }
348
+
349
+ /* Group */
344
350
  .ui.inverted.buttons .button {
345
351
  margin: 0px 0px 0px -2px;
346
352
  }
@@ -353,14 +359,18 @@
353
359
  .ui.inverted.vertical.buttons .button:first-child {
354
360
  margin-top: 0em;
355
361
  }
356
- .ui.inverted.buttons .button:hover {
357
- position: relative;
358
- }
362
+
363
+ /* States */
359
364
  .ui.inverted.button:hover {
360
365
  background: #ffffff;
361
366
  box-shadow: 0px 0px 0px 2px #ffffff inset !important;
362
367
  color: rgba(0, 0, 0, 0.8);
363
368
  }
369
+ .ui.inverted.button:focus {
370
+ background: #ffffff;
371
+ box-shadow: 0px 0px 0px 2px #ffffff inset !important;
372
+ color: rgba(0, 0, 0, 0.8);
373
+ }
364
374
 
365
375
  /*-------------------
366
376
  Social
@@ -369,57 +379,57 @@
369
379
 
370
380
  /* Facebook */
371
381
  .ui.facebook.button {
372
- background-color: #3b579d;
382
+ background-color: #3b5998;
373
383
  color: #ffffff;
374
384
  text-shadow: none;
375
385
  background-image: none;
376
- box-shadow: 0px 0em 0px 0px rgba(39, 41, 43, 0.15) inset;
386
+ box-shadow: 0px 0em 0px 0px rgba(34, 36, 38, 0.15) inset;
377
387
  }
378
388
  .ui.facebook.button:hover {
379
- background-color: #3f5da8;
389
+ background-color: #304d8a;
380
390
  color: #ffffff;
381
391
  text-shadow: none;
382
392
  }
383
393
  .ui.facebook.button:active {
384
- background-color: #314983;
394
+ background-color: #2d4373;
385
395
  color: #ffffff;
386
396
  text-shadow: none;
387
397
  }
388
398
 
389
399
  /* Twitter */
390
400
  .ui.twitter.button {
391
- background-color: #4092cc;
401
+ background-color: #0084b4;
392
402
  color: #ffffff;
393
403
  text-shadow: none;
394
404
  background-image: none;
395
- box-shadow: 0px 0em 0px 0px rgba(39, 41, 43, 0.15) inset;
405
+ box-shadow: 0px 0em 0px 0px rgba(34, 36, 38, 0.15) inset;
396
406
  }
397
407
  .ui.twitter.button:hover {
398
- background-color: #4c99cf;
408
+ background-color: #00719b;
399
409
  color: #ffffff;
400
410
  text-shadow: none;
401
411
  }
402
412
  .ui.twitter.button:active {
403
- background-color: #3180b7;
413
+ background-color: #005f81;
404
414
  color: #ffffff;
405
415
  text-shadow: none;
406
416
  }
407
417
 
408
418
  /* Google Plus */
409
419
  .ui.google.plus.button {
410
- background-color: #d34836;
420
+ background-color: #dc4a38;
411
421
  color: #ffffff;
412
422
  text-shadow: none;
413
423
  background-image: none;
414
- box-shadow: 0px 0em 0px 0px rgba(39, 41, 43, 0.15) inset;
424
+ box-shadow: 0px 0em 0px 0px rgba(34, 36, 38, 0.15) inset;
415
425
  }
416
426
  .ui.google.plus.button:hover {
417
- background-color: #d65343;
427
+ background-color: #de321d;
418
428
  color: #ffffff;
419
429
  text-shadow: none;
420
430
  }
421
431
  .ui.google.plus.button:active {
422
- background-color: #bc3a29;
432
+ background-color: #bf3322;
423
433
  color: #ffffff;
424
434
  text-shadow: none;
425
435
  }
@@ -431,12 +441,12 @@
431
441
  text-shadow: none;
432
442
  }
433
443
  .ui.linkedin.button:hover {
434
- background-color: #2191cb;
444
+ background-color: #147baf;
435
445
  color: #ffffff;
436
446
  text-shadow: none;
437
447
  }
438
448
  .ui.linkedin.button:active {
439
- background-color: #1a729f;
449
+ background-color: #186992;
440
450
  color: #ffffff;
441
451
  text-shadow: none;
442
452
  }
@@ -447,15 +457,15 @@
447
457
  color: #ffffff;
448
458
  text-shadow: none;
449
459
  background-image: none;
450
- box-shadow: 0px 0em 0px 0px rgba(39, 41, 43, 0.15) inset;
460
+ box-shadow: 0px 0em 0px 0px rgba(34, 36, 38, 0.15) inset;
451
461
  }
452
462
  .ui.youtube.button:hover {
453
- background-color: #da1a20;
463
+ background-color: #bd0d13;
454
464
  color: #ffffff;
455
465
  text-shadow: none;
456
466
  }
457
467
  .ui.youtube.button:active {
458
- background-color: #ac1419;
468
+ background-color: #9e1317;
459
469
  color: #ffffff;
460
470
  text-shadow: none;
461
471
  }
@@ -466,15 +476,15 @@
466
476
  color: #ffffff;
467
477
  text-shadow: none;
468
478
  background-image: none;
469
- box-shadow: 0px 0em 0px 0px rgba(39, 41, 43, 0.15) inset;
479
+ box-shadow: 0px 0em 0px 0px rgba(34, 36, 38, 0.15) inset;
470
480
  }
471
481
  .ui.instagram.button:hover {
472
- background-color: #4e7ea6;
482
+ background-color: #3d698e;
473
483
  color: #ffffff;
474
484
  text-shadow: none;
475
485
  }
476
486
  .ui.instagram.button:active {
477
- background-color: #3e6484;
487
+ background-color: #395c79;
478
488
  color: #ffffff;
479
489
  text-shadow: none;
480
490
  }
@@ -485,15 +495,15 @@
485
495
  color: #ffffff;
486
496
  text-shadow: none;
487
497
  background-image: none;
488
- box-shadow: 0px 0em 0px 0px rgba(39, 41, 43, 0.15) inset;
498
+ box-shadow: 0px 0em 0px 0px rgba(34, 36, 38, 0.15) inset;
489
499
  }
490
500
  .ui.pinterest.button:hover {
491
- background-color: #00b7fc;
501
+ background-color: #0099d4;
492
502
  color: #ffffff;
493
503
  text-shadow: none;
494
504
  }
495
505
  .ui.pinterest.button:active {
496
- background-color: #0092c9;
506
+ background-color: #0087ba;
497
507
  color: #ffffff;
498
508
  text-shadow: none;
499
509
  }
@@ -503,14 +513,14 @@
503
513
  background-color: #4D7198;
504
514
  color: #ffffff;
505
515
  background-image: none;
506
- box-shadow: 0px 0em 0px 0px rgba(39, 41, 43, 0.15) inset;
516
+ box-shadow: 0px 0em 0px 0px rgba(34, 36, 38, 0.15) inset;
507
517
  }
508
518
  .ui.vk.button:hover {
509
- background-color: #5279a2;
519
+ background-color: #41648a;
510
520
  color: #ffffff;
511
521
  }
512
522
  .ui.vk.button:active {
513
- background-color: #415f80;
523
+ background-color: #3c5876;
514
524
  color: #ffffff;
515
525
  }
516
526
 
@@ -519,15 +529,16 @@
519
529
  ---------------*/
520
530
 
521
531
  .ui.button > .icon {
532
+ height: 0.92857143em;
522
533
  opacity: 0.8;
523
- margin: 0em 0.4em 0em -0.2em;
524
- -webkit-transition: opacity 0.2s ease;
525
- transition: opacity 0.2s ease;
526
- vertical-align: baseline;
534
+ margin: 0em 0.42857143em 0em -0.21428571em;
535
+ -webkit-transition: opacity 0.1s ease;
536
+ transition: opacity 0.1s ease;
537
+ vertical-align: '';
527
538
  color: '';
528
539
  }
529
540
  .ui.button > .right.icon {
530
- margin: 0em -0.2em 0em 0.4em;
541
+ margin: 0em -0.21428571em 0em 0.42857143em;
531
542
  }
532
543
 
533
544
 
@@ -559,15 +570,15 @@
559
570
 
560
571
  .ui.compact.buttons .button,
561
572
  .ui.compact.button {
562
- padding: 0.5892825em 1.125em 0.5892825em;
573
+ padding: 0.58928571em 1.125em 0.58928571em;
563
574
  }
564
575
  .ui.compact.icon.buttons .button,
565
576
  .ui.compact.icon.button {
566
- padding: 0.5892825em 0.5892825em 0.5892825em;
577
+ padding: 0.58928571em 0.58928571em 0.58928571em;
567
578
  }
568
579
  .ui.compact.labeled.icon.buttons .button,
569
580
  .ui.compact.labeled.icon.button {
570
- padding: 0.5892825em 3.69642em 0.5892825em;
581
+ padding: 0.58928571em 3.69642857em 0.58928571em;
571
582
  }
572
583
 
573
584
  /*-------------------
@@ -621,7 +632,7 @@
621
632
 
622
633
  .ui.icon.buttons .button,
623
634
  .ui.icon.button {
624
- padding: 0.78571em 0.78571em 0.78571em;
635
+ padding: 0.78571429em 0.78571429em 0.78571429em;
625
636
  }
626
637
  .ui.icon.buttons .button > .icon,
627
638
  .ui.icon.button > .icon {
@@ -636,40 +647,46 @@
636
647
 
637
648
  .ui.basic.buttons .button,
638
649
  .ui.basic.button {
639
- background: transparent !important;
640
- background-image: none;
650
+ background: transparent none !important;
641
651
  color: rgba(0, 0, 0, 0.6) !important;
642
652
  font-weight: normal;
643
- border-radius: 0.2857rem;
653
+ border-radius: 0.28571429rem;
644
654
  text-transform: none;
645
655
  text-shadow: none !important;
646
- box-shadow: 0px 0px 0px 1px rgba(39, 41, 43, 0.15) inset;
656
+ box-shadow: 0px 0px 0px 1px rgba(34, 36, 38, 0.15) inset;
647
657
  }
648
658
  .ui.basic.buttons {
649
- box-shadow: 0px 0px 0px 1px rgba(39, 41, 43, 0.15);
650
- border-radius: 0.2857rem;
659
+ box-shadow: none;
660
+ border: 1px solid rgba(34, 36, 38, 0.15);
661
+ border-radius: 0.28571429rem;
651
662
  }
652
663
  .ui.basic.buttons .button {
653
664
  border-radius: 0em;
654
665
  }
655
666
  .ui.basic.buttons .button:hover,
656
667
  .ui.basic.button:hover {
657
- background: #fafafa !important;
668
+ background: #ffffff !important;
669
+ color: rgba(0, 0, 0, 0.8) !important;
670
+ box-shadow: 0px 0px 0px 1px rgba(34, 36, 38, 0.35) inset, 0px 0px 0px 0px rgba(34, 36, 38, 0.15) inset;
671
+ }
672
+ .ui.basic.buttons .button:focus,
673
+ .ui.basic.button:focus {
674
+ background: #ffffff !important;
658
675
  color: rgba(0, 0, 0, 0.8) !important;
659
- box-shadow: 0px 0px 0px 1px rgba(39, 41, 43, 0.15) inset, 0px 0px 0px 0px rgba(39, 41, 43, 0.15) inset;
676
+ box-shadow: 0px 0px 0px 1px rgba(34, 36, 38, 0.35) inset, 0px 0px 0px 0px rgba(34, 36, 38, 0.15) inset;
660
677
  }
661
678
  .ui.basic.buttons .button:active,
662
679
  .ui.basic.button:active {
663
680
  background: #f8f8f8 !important;
664
- color: rgba(0, 0, 0, 0.8) !important;
665
- box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.15) inset, 0px 1px 4px 0px rgba(39, 41, 43, 0.15) inset;
681
+ color: rgba(0, 0, 0, 0.9) !important;
682
+ box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.15) inset, 0px 1px 4px 0px rgba(34, 36, 38, 0.15) inset;
666
683
  }
667
684
  .ui.basic.buttons .active.button,
668
685
  .ui.basic.active.button {
669
686
  background: rgba(0, 0, 0, 0.05) !important;
670
687
  box-shadow: '' !important;
671
- color: rgba(0, 0, 0, 0.8);
672
- box-shadow: rgba(39, 41, 43, 0.3);
688
+ color: rgba(0, 0, 0, 0.95);
689
+ box-shadow: rgba(34, 36, 38, 0.35);
673
690
  }
674
691
  .ui.basic.buttons .active.button:hover,
675
692
  .ui.basic.active.button:hover {
@@ -678,20 +695,20 @@
678
695
 
679
696
  /* Vertical */
680
697
  .ui.basic.buttons .button:hover {
681
- box-shadow: 0px 0px 0px 1px rgba(39, 41, 43, 0.15) inset, 0px 0px 0px 0px rgba(39, 41, 43, 0.15) inset inset;
698
+ box-shadow: 0px 0px 0px 1px rgba(34, 36, 38, 0.35) inset, 0px 0px 0px 0px rgba(34, 36, 38, 0.15) inset inset;
682
699
  }
683
700
  .ui.basic.buttons .button:active {
684
- box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.15) inset, 0px 1px 4px 0px rgba(39, 41, 43, 0.15) inset inset;
701
+ box-shadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.15) inset, 0px 1px 4px 0px rgba(34, 36, 38, 0.15) inset inset;
685
702
  }
686
703
  .ui.basic.buttons .active.button {
687
- box-shadow: rgba(39, 41, 43, 0.3) inset;
704
+ box-shadow: rgba(34, 36, 38, 0.35) inset;
688
705
  }
689
706
 
690
707
  /* Standard Basic Inverted */
691
708
  .ui.basic.inverted.buttons .button,
692
709
  .ui.basic.inverted.button {
693
710
  background-color: transparent !important;
694
- color: #fafafa !important;
711
+ color: #f9fafb !important;
695
712
  box-shadow: 0px 0px 0px 2px rgba(255, 255, 255, 0.5) inset !important;
696
713
  }
697
714
  .ui.basic.inverted.buttons .button:hover,
@@ -699,28 +716,33 @@
699
716
  color: #ffffff !important;
700
717
  box-shadow: 0px 0px 0px 2px #ffffff inset !important;
701
718
  }
719
+ .ui.basic.inverted.buttons .button:focus,
720
+ .ui.basic.inverted.button:focus {
721
+ color: #ffffff !important;
722
+ box-shadow: 0px 0px 0px 2px #ffffff inset !important;
723
+ }
702
724
  .ui.basic.inverted.buttons .button:active,
703
725
  .ui.basic.inverted.button:active {
704
- background-color: rgba(255, 255, 255, 0.05) !important;
726
+ background-color: rgba(255, 255, 255, 0.08) !important;
705
727
  color: #ffffff !important;
706
728
  box-shadow: 0px 0px 0px 2px rgba(255, 255, 255, 0.9) inset !important;
707
729
  }
708
730
  .ui.basic.inverted.buttons .active.button,
709
731
  .ui.basic.inverted.active.button {
710
- background-color: rgba(255, 255, 255, 0.05);
732
+ background-color: rgba(255, 255, 255, 0.08);
711
733
  color: #ffffff;
712
734
  text-shadow: none;
713
735
  box-shadow: 0px 0px 0px 2px rgba(255, 255, 255, 0.7) inset;
714
736
  }
715
737
  .ui.basic.inverted.buttons .active.button:hover,
716
738
  .ui.basic.inverted.active.button:hover {
717
- background-color: rgba(255, 255, 255, 0.07);
739
+ background-color: rgba(255, 255, 255, 0.15);
718
740
  box-shadow: 0px 0px 0px 2px #ffffff inset !important;
719
741
  }
720
742
 
721
743
  /* Basic Group */
722
744
  .ui.basic.buttons .button {
723
- border-left: 1px solid rgba(39, 41, 43, 0.15);
745
+ border-left: 1px solid rgba(34, 36, 38, 0.15);
724
746
  box-shadow: none;
725
747
  }
726
748
  .ui.basic.vertical.buttons .button {
@@ -728,7 +750,7 @@
728
750
  }
729
751
  .ui.basic.vertical.buttons .button {
730
752
  border-left-width: 0px;
731
- border-top: 1px solid rgba(39, 41, 43, 0.15);
753
+ border-top: 1px solid rgba(34, 36, 38, 0.15);
732
754
  }
733
755
  .ui.basic.vertical.buttons .button:first-child {
734
756
  border-top-width: 0px;
@@ -741,7 +763,7 @@
741
763
  .ui.labeled.icon.buttons .button,
742
764
  .ui.labeled.icon.button {
743
765
  position: relative;
744
- padding-left: 4.07142em !important;
766
+ padding-left: 4.07142857em !important;
745
767
  padding-right: 1.5em !important;
746
768
  }
747
769
 
@@ -749,13 +771,13 @@
749
771
  .ui.labeled.icon.buttons > .button > .icon,
750
772
  .ui.labeled.icon.button > .icon {
751
773
  position: absolute;
752
- width: 2.57142em;
753
774
  height: 100%;
775
+ line-height: 1;
776
+ width: 2.57142857em;
754
777
  background-color: rgba(0, 0, 0, 0.05);
755
778
  text-align: center;
756
779
  color: '';
757
- border-radius: 0.2857rem 0px 0px 0.2857rem;
758
- line-height: 1;
780
+ border-radius: 0.28571429rem 0px 0px 0.28571429rem;
759
781
  box-shadow: -1px 0px 0px 0px transparent inset;
760
782
  }
761
783
 
@@ -768,13 +790,13 @@
768
790
 
769
791
  /* Right Labeled */
770
792
  .ui[class*="right labeled"].icon.button {
771
- padding-right: 4.07142em !important;
793
+ padding-right: 4.07142857em !important;
772
794
  padding-left: 1.5em !important;
773
795
  }
774
796
  .ui[class*="right labeled"].icon.button > .icon {
775
797
  left: auto;
776
798
  right: 0em;
777
- border-radius: 0em 0.2857rem 0.2857rem 0em;
799
+ border-radius: 0em 0.28571429rem 0.28571429rem 0em;
778
800
  box-shadow: 1px 0px 0px 0px transparent inset;
779
801
  }
780
802
  .ui.labeled.icon.buttons > .button > .icon:before,
@@ -792,20 +814,20 @@
792
814
  border-radius: 0em;
793
815
  }
794
816
  .ui.labeled.icon.buttons .button:first-child > .icon {
795
- border-top-left-radius: 0.2857rem;
796
- border-bottom-left-radius: 0.2857rem;
817
+ border-top-left-radius: 0.28571429rem;
818
+ border-bottom-left-radius: 0.28571429rem;
797
819
  }
798
820
  .ui.labeled.icon.buttons .button:last-child > .icon {
799
- border-top-right-radius: 0.2857rem;
800
- border-bottom-right-radius: 0.2857rem;
821
+ border-top-right-radius: 0.28571429rem;
822
+ border-bottom-right-radius: 0.28571429rem;
801
823
  }
802
824
  .ui.vertical.labeled.icon.buttons .button:first-child > .icon {
803
825
  border-radius: 0em;
804
- border-top-left-radius: 0.2857rem;
826
+ border-top-left-radius: 0.28571429rem;
805
827
  }
806
828
  .ui.vertical.labeled.icon.buttons .button:last-child > .icon {
807
829
  border-radius: 0em;
808
- border-bottom-left-radius: 0.2857rem;
830
+ border-bottom-left-radius: 0.28571429rem;
809
831
  }
810
832
 
811
833
  /* Fluid Labeled */
@@ -824,13 +846,13 @@
824
846
  .ui.toggle.buttons .active.button,
825
847
  .ui.buttons .button.toggle.active,
826
848
  .ui.button.toggle.active {
827
- background-color: #5bbd72 !important;
849
+ background-color: #21ba45 !important;
828
850
  box-shadow: none !important;
829
851
  text-shadow: none;
830
852
  color: #ffffff !important;
831
853
  }
832
854
  .ui.button.toggle.active:hover {
833
- background-color: #66c17b !important;
855
+ background-color: #16ab39 !important;
834
856
  text-shadow: none;
835
857
  color: #ffffff !important;
836
858
  }
@@ -847,45 +869,14 @@
847
869
  vertical-align: baseline;
848
870
  }
849
871
 
850
- /*--------------
851
- Attached
852
- ---------------*/
853
-
854
- .ui.attached.button {
855
- display: block;
856
- margin: 0em;
857
- box-shadow: 0px 0px 0px 1px rgba(39, 41, 43, 0.15) !important;
858
- border-radius: 0em;
859
- }
860
- .ui.attached.top.button {
861
- border-radius: 0.2857rem 0.2857rem 0em 0em;
862
- }
863
- .ui.attached.bottom.button {
864
- border-radius: 0em 0em 0.2857rem 0.2857rem;
865
- }
866
- .ui.attached.left.button {
867
- display: inline-block;
868
- border-left: none;
869
- padding-right: 0.75em;
870
- text-align: right;
871
- border-radius: 0.2857rem 0em 0em 0.2857rem;
872
- }
873
- .ui.attached.right.button {
874
- display: inline-block;
875
- padding-left: 0.75em;
876
- text-align: left;
877
- border-radius: 0em 0.2857rem 0.2857rem 0em;
878
- }
879
-
880
872
  /*-------------------
881
873
  Or Buttons
882
874
  --------------------*/
883
875
 
884
876
  .ui.buttons .or {
885
877
  position: relative;
886
- float: left;
887
878
  width: 0.3em;
888
- height: 2.57142em;
879
+ height: 2.57142857em;
889
880
  z-index: 3;
890
881
  }
891
882
  .ui.buttons .or:before {
@@ -897,11 +888,11 @@
897
888
  left: 50%;
898
889
  background-color: #ffffff;
899
890
  text-shadow: none;
900
- margin-top: -0.892855em;
901
- margin-left: -0.892855em;
902
- width: 1.78571em;
903
- height: 1.78571em;
904
- line-height: 1.78571em;
891
+ margin-top: -0.89285714em;
892
+ margin-left: -0.89285714em;
893
+ width: 1.78571429em;
894
+ height: 1.78571429em;
895
+ line-height: 1.78571429em;
905
896
  color: rgba(0, 0, 0, 0.4);
906
897
  font-style: normal;
907
898
  font-weight: bold;
@@ -924,166 +915,193 @@
924
915
  --------------------*/
925
916
 
926
917
 
927
- /* Plural Attached */
928
- .attached.ui.buttons {
929
- margin: 0px;
930
- border-radius: 0em 0em 0em 0em;
918
+ /* Singular */
919
+ .ui.attached.button {
920
+ position: relative;
921
+ display: block;
922
+ margin: 0em;
923
+ border-radius: 0em;
924
+ box-shadow: 0px 0px 0px 1px rgba(34, 36, 38, 0.15) !important;
925
+ }
926
+
927
+ /* Top / Bottom */
928
+ .ui.attached.top.button {
929
+ border-radius: 0.28571429rem 0.28571429rem 0em 0em;
930
+ }
931
+ .ui.attached.bottom.button {
932
+ border-radius: 0em 0em 0.28571429rem 0.28571429rem;
933
+ }
934
+
935
+ /* Left / Right */
936
+ .ui.left.attached.button {
937
+ display: inline-block;
938
+ border-left: none;
939
+ text-align: right;
940
+ padding-right: 0.75em;
941
+ border-radius: 0.28571429rem 0em 0em 0.28571429rem;
942
+ }
943
+ .ui.right.attached.button {
944
+ display: inline-block;
945
+ text-align: left;
946
+ padding-left: 0.75em;
947
+ border-radius: 0em 0.28571429rem 0.28571429rem 0em;
948
+ }
949
+
950
+ /* Plural */
951
+ .ui.attached.buttons {
952
+ position: relative;
953
+ display: -webkit-box;
954
+ display: -webkit-flex;
955
+ display: -ms-flexbox;
956
+ display: flex;
957
+ border-radius: 0em;
958
+ width: auto !important;
959
+ z-index: 2;
960
+ margin-left: -1px;
961
+ margin-right: -1px;
931
962
  }
932
- .attached.ui.buttons .button {
963
+ .ui.attached.buttons .button {
933
964
  margin: 0em;
934
965
  }
935
- .attached.ui.buttons .button:first-child {
936
- border-radius: 0em 0em 0em 0em;
966
+ .ui.attached.buttons .button:first-child {
967
+ border-radius: 0em;
937
968
  }
938
- .attached.ui.buttons .button:last-child {
939
- border-radius: 0em 0em 0em 0em;
969
+ .ui.attached.buttons .button:last-child {
970
+ border-radius: 0em;
940
971
  }
941
972
 
942
- /* Top Side */
943
- [class*="top attached"].ui.buttons {
973
+ /* Top / Bottom */
974
+ .ui[class*="top attached"].buttons {
944
975
  margin-bottom: -1px;
945
- border-radius: 0.2857rem 0.2857rem 0em 0em;
976
+ border-radius: 0.28571429rem 0.28571429rem 0em 0em;
946
977
  }
947
- [class*="top attached"].ui.buttons .button:first-child {
948
- border-radius: 0.2857rem 0em 0em 0em;
978
+ .ui[class*="top attached"].buttons .button:first-child {
979
+ border-radius: 0.28571429rem 0em 0em 0em;
949
980
  }
950
- [class*="top attached"].ui.buttons .button:last-child {
951
- border-radius: 0em 0.2857rem 0em 0em;
981
+ .ui[class*="top attached"].buttons .button:last-child {
982
+ border-radius: 0em 0.28571429rem 0em 0em;
952
983
  }
953
-
954
- /* Bottom Side */
955
- [class*="bottom attached"].ui.buttons {
984
+ .ui[class*="bottom attached"].buttons {
956
985
  margin-top: -1px;
957
- border-radius: 0em 0em 0.2857rem 0.2857rem;
986
+ border-radius: 0em 0em 0.28571429rem 0.28571429rem;
958
987
  }
959
- [class*="bottom attached"].ui.buttons .button:first-child {
960
- border-radius: 0em 0em 0em 0.2857rem;
988
+ .ui[class*="bottom attached"].buttons .button:first-child {
989
+ border-radius: 0em 0em 0em 0.28571429rem;
961
990
  }
962
- [class*="bottom attached"].ui.buttons .button:last-child {
963
- border-radius: 0em 0em 0.2857rem 0em;
991
+ .ui[class*="bottom attached"].buttons .button:last-child {
992
+ border-radius: 0em 0em 0.28571429rem 0em;
964
993
  }
965
994
 
966
- /* Left Side */
967
- [class*="left attached"].ui.buttons {
995
+ /* Left / Right */
996
+ .ui[class*="left attached"].buttons {
997
+ display: -webkit-inline-box;
998
+ display: -webkit-inline-flex;
999
+ display: -ms-inline-flexbox;
1000
+ display: inline-flex;
1001
+ margin-right: 0em;
968
1002
  margin-left: -1px;
969
- border-radius: 0em 0.2857rem 0.2857rem 0em;
1003
+ border-radius: 0em 0.28571429rem 0.28571429rem 0em;
970
1004
  }
971
- [class*="left attached"].ui.buttons .button:first-child {
1005
+ .ui[class*="left attached"].buttons .button:first-child {
972
1006
  margin-left: -1px;
973
- border-radius: 0em 0.2857rem 0em 0em;
1007
+ border-radius: 0em 0.28571429rem 0em 0em;
974
1008
  }
975
- [class*="left attached"].ui.buttons .button:last-child {
1009
+ .ui[class*="left attached"].buttons .button:last-child {
976
1010
  margin-left: -1px;
977
- border-radius: 0em 0em 0.2857rem 0em;
1011
+ border-radius: 0em 0em 0.28571429rem 0em;
978
1012
  }
979
-
980
- /* Right Side */
981
- [class*="right attached"].ui.buttons,
982
- [class*="right attached"].ui.buttons .button {
1013
+ .ui[class*="right attached"].buttons {
1014
+ display: -webkit-inline-box;
1015
+ display: -webkit-inline-flex;
1016
+ display: -ms-inline-flexbox;
1017
+ display: inline-flex;
1018
+ margin-left: 0em;
983
1019
  margin-right: -1px;
984
- border-radius: 0.2857rem 0em 0em 0.2857rem;
1020
+ border-radius: 0.28571429rem 0em 0em 0.28571429rem;
985
1021
  }
986
- [class*="right attached"].ui.buttons .button:first-child {
1022
+ .ui[class*="right attached"].buttons .button:first-child {
987
1023
  margin-left: -1px;
988
- border-radius: 0.2857rem 0em 0em 0em;
1024
+ border-radius: 0.28571429rem 0em 0em 0em;
989
1025
  }
990
- [class*="right attached"].ui.buttons .button:last-child {
1026
+ .ui[class*="right attached"].buttons .button:last-child {
991
1027
  margin-left: -1px;
992
- border-radius: 0em 0em 0em 0.2857rem;
1028
+ border-radius: 0em 0em 0em 0.28571429rem;
993
1029
  }
994
1030
 
995
- /* Fluid */
1031
+ /*-------------------
1032
+ Fluid
1033
+ --------------------*/
1034
+
996
1035
  .ui.fluid.buttons,
997
- .ui.button.fluid,
998
- .ui.fluid.buttons > .button {
999
- display: block;
1036
+ .ui.fluid.button {
1000
1037
  width: 100%;
1001
1038
  }
1002
- .ui.\32.buttons,
1039
+ .ui.fluid.button {
1040
+ display: block;
1041
+ }
1003
1042
  .ui.two.buttons {
1004
1043
  width: 100%;
1005
1044
  }
1006
- .ui.\32.buttons > .button,
1007
1045
  .ui.two.buttons > .button {
1008
1046
  width: 50%;
1009
1047
  }
1010
- .ui.\33.buttons,
1011
1048
  .ui.three.buttons {
1012
1049
  width: 100%;
1013
1050
  }
1014
- .ui.\33.buttons > .button,
1015
1051
  .ui.three.buttons > .button {
1016
1052
  width: 33.333%;
1017
1053
  }
1018
- .ui.\34.buttons,
1019
1054
  .ui.four.buttons {
1020
1055
  width: 100%;
1021
1056
  }
1022
- .ui.\34.buttons > .button,
1023
1057
  .ui.four.buttons > .button {
1024
1058
  width: 25%;
1025
1059
  }
1026
- .ui.\35.buttons,
1027
1060
  .ui.five.buttons {
1028
1061
  width: 100%;
1029
1062
  }
1030
- .ui.\35.buttons > .button,
1031
1063
  .ui.five.buttons > .button {
1032
1064
  width: 20%;
1033
1065
  }
1034
- .ui.\36.buttons,
1035
1066
  .ui.six.buttons {
1036
1067
  width: 100%;
1037
1068
  }
1038
- .ui.\36.buttons > .button,
1039
1069
  .ui.six.buttons > .button {
1040
1070
  width: 16.666%;
1041
1071
  }
1042
- .ui.\37.buttons,
1043
1072
  .ui.seven.buttons {
1044
1073
  width: 100%;
1045
1074
  }
1046
- .ui.\37.buttons > .button,
1047
1075
  .ui.seven.buttons > .button {
1048
1076
  width: 14.285%;
1049
1077
  }
1050
- .ui.\38.buttons,
1051
1078
  .ui.eight.buttons {
1052
1079
  width: 100%;
1053
1080
  }
1054
- .ui.\38.buttons > .button,
1055
1081
  .ui.eight.buttons > .button {
1056
1082
  width: 12.500%;
1057
1083
  }
1058
- .ui.\39.buttons,
1059
1084
  .ui.nine.buttons {
1060
1085
  width: 100%;
1061
1086
  }
1062
- .ui.\39.buttons > .button,
1063
1087
  .ui.nine.buttons > .button {
1064
1088
  width: 11.11%;
1065
1089
  }
1066
- .ui.\31\30.buttons,
1067
1090
  .ui.ten.buttons {
1068
1091
  width: 100%;
1069
1092
  }
1070
- .ui.\31\30.buttons > .button,
1071
1093
  .ui.ten.buttons > .button {
1072
1094
  width: 10%;
1073
1095
  }
1074
- .ui.\31\31.buttons,
1075
1096
  .ui.eleven.buttons {
1076
1097
  width: 100%;
1077
1098
  }
1078
- .ui.\31\31.buttons > .button,
1079
1099
  .ui.eleven.buttons > .button {
1080
1100
  width: 9.09%;
1081
1101
  }
1082
- .ui.\31\32.buttons,
1083
1102
  .ui.twelve.buttons {
1084
1103
  width: 100%;
1085
1104
  }
1086
- .ui.\31\32.buttons > .button,
1087
1105
  .ui.twelve.buttons > .button {
1088
1106
  width: 8.3333%;
1089
1107
  }
@@ -1091,50 +1109,42 @@
1091
1109
  /* Fluid Vertical Buttons */
1092
1110
  .ui.fluid.vertical.buttons,
1093
1111
  .ui.fluid.vertical.buttons > .button {
1094
- display: block;
1112
+ display: -webkit-box;
1113
+ display: -webkit-flex;
1114
+ display: -ms-flexbox;
1115
+ display: flex;
1095
1116
  width: auto;
1096
1117
  }
1097
- .ui.\32.vertical.buttons > .button,
1098
1118
  .ui.two.vertical.buttons > .button {
1099
1119
  height: 50%;
1100
1120
  }
1101
- .ui.\33.vertical.buttons > .button,
1102
1121
  .ui.three.vertical.buttons > .button {
1103
1122
  height: 33.333%;
1104
1123
  }
1105
- .ui.\34.vertical.buttons > .button,
1106
1124
  .ui.four.vertical.buttons > .button {
1107
1125
  height: 25%;
1108
1126
  }
1109
- .ui.\35.vertical.buttons > .button,
1110
1127
  .ui.five.vertical.buttons > .button {
1111
1128
  height: 20%;
1112
1129
  }
1113
- .ui.\36.vertical.buttons > .button,
1114
1130
  .ui.six.vertical.buttons > .button {
1115
1131
  height: 16.666%;
1116
1132
  }
1117
- .ui.\37.vertical.buttons > .button,
1118
1133
  .ui.seven.vertical.buttons > .button {
1119
1134
  height: 14.285%;
1120
1135
  }
1121
- .ui.\38.vertical.buttons > .button,
1122
1136
  .ui.eight.vertical.buttons > .button {
1123
1137
  height: 12.500%;
1124
1138
  }
1125
- .ui.\39.vertical.buttons > .button,
1126
1139
  .ui.nine.vertical.buttons > .button {
1127
1140
  height: 11.11%;
1128
1141
  }
1129
- .ui.\31\30.vertical.buttons > .button,
1130
1142
  .ui.ten.vertical.buttons > .button {
1131
1143
  height: 10%;
1132
1144
  }
1133
- .ui.\31\31.vertical.buttons > .button,
1134
1145
  .ui.eleven.vertical.buttons > .button {
1135
1146
  height: 9.09%;
1136
1147
  }
1137
- .ui.\31\32.vertical.buttons > .button,
1138
1148
  .ui.twelve.vertical.buttons > .button {
1139
1149
  height: 8.3333%;
1140
1150
  }
@@ -1154,17 +1164,23 @@
1154
1164
  background-image: none;
1155
1165
  }
1156
1166
  .ui.black.button {
1157
- box-shadow: 0px 0em 0px 0px rgba(39, 41, 43, 0.15) inset;
1167
+ box-shadow: 0px 0em 0px 0px rgba(34, 36, 38, 0.15) inset;
1158
1168
  }
1159
1169
  .ui.black.buttons .button:hover,
1160
1170
  .ui.black.button:hover {
1161
- background-color: #1b1c1d;
1171
+ background-color: #27292a;
1172
+ color: #ffffff;
1173
+ text-shadow: none;
1174
+ }
1175
+ .ui.black.buttons .button:focus,
1176
+ .ui.black.button:focus {
1177
+ background-color: #2f3032;
1162
1178
  color: #ffffff;
1163
1179
  text-shadow: none;
1164
1180
  }
1165
1181
  .ui.black.buttons .button:active,
1166
1182
  .ui.black.button:active {
1167
- background-color: #0a0a0b;
1183
+ background-color: #343637;
1168
1184
  color: #ffffff;
1169
1185
  text-shadow: none;
1170
1186
  }
@@ -1180,27 +1196,32 @@
1180
1196
  /* Basic */
1181
1197
  .ui.basic.black.buttons .button,
1182
1198
  .ui.basic.black.button {
1183
- box-shadow: 0px 0px 0px 2px rgba(39, 41, 43, 0.15) inset !important;
1199
+ box-shadow: 0px 0px 0px 1px rgba(34, 36, 38, 0.15) inset !important;
1184
1200
  color: rgba(0, 0, 0, 0.6) !important;
1185
1201
  }
1186
1202
  .ui.basic.black.buttons .button:hover,
1187
1203
  .ui.basic.black.button:hover {
1188
1204
  background: transparent !important;
1189
- box-shadow: 0px 0px 0px 2px #1b1c1d inset !important;
1190
- color: #1b1c1d !important;
1205
+ box-shadow: 0px 0px 0px 2px #27292a inset !important;
1206
+ color: #27292a !important;
1191
1207
  }
1192
- .ui.basic.black.buttons .button:active,
1193
- .ui.basic.black.button:active {
1194
- box-shadow: 0px 0px 0px 2px #0a0a0b inset !important;
1195
- color: #0a0a0b !important;
1208
+ .ui.basic.black.buttons .button:focus,
1209
+ .ui.basic.black.button:focus {
1210
+ background: transparent !important;
1211
+ box-shadow: 0px 0px 0px 2px #2f3032 inset !important;
1196
1212
  }
1197
1213
  .ui.basic.black.buttons .active.button,
1198
1214
  .ui.basic.black.active.button {
1199
1215
  background: transparent !important;
1200
- box-shadow: 0px 0px 0px 2px #0a0a0b inset !important;
1201
- color: #0a0a0b !important;
1216
+ box-shadow: 0px 0px 0px 2px #0f0f10 inset !important;
1217
+ color: #343637 !important;
1218
+ }
1219
+ .ui.basic.black.buttons .button:active,
1220
+ .ui.basic.black.button:active {
1221
+ box-shadow: 0px 0px 0px 2px #343637 inset !important;
1222
+ color: #343637 !important;
1202
1223
  }
1203
- .ui.buttons > .basic.black.button:not(:first-child) {
1224
+ .ui.buttons:not(.vertical) > .basic.black.button:not(:first-child) {
1204
1225
  margin-left: -2px;
1205
1226
  }
1206
1227
 
@@ -1212,22 +1233,31 @@
1212
1233
  color: #ffffff;
1213
1234
  }
1214
1235
  .ui.inverted.black.buttons .button:hover,
1215
- .ui.inverted.black.button:hover {
1216
- box-shadow: 0px 0px 0px 2px #333333 inset !important;
1217
- background-color: #333333;
1236
+ .ui.inverted.black.button:hover,
1237
+ .ui.inverted.black.buttons .button:focus,
1238
+ .ui.inverted.black.button:focus,
1239
+ .ui.inverted.black.buttons .button.active,
1240
+ .ui.inverted.black.button.active,
1241
+ .ui.inverted.black.buttons .button:active,
1242
+ .ui.inverted.black.button:active {
1243
+ box-shadow: none !important;
1218
1244
  color: #ffffff;
1219
1245
  }
1246
+ .ui.inverted.black.buttons .button:hover,
1247
+ .ui.inverted.black.button:hover {
1248
+ background-color: #000000;
1249
+ }
1250
+ .ui.inverted.black.buttons .button:focus,
1251
+ .ui.inverted.black.button:focus {
1252
+ background-color: #000000;
1253
+ }
1220
1254
  .ui.inverted.black.buttons .active.button,
1221
1255
  .ui.inverted.black.active.button {
1222
- box-shadow: 0px 0px 0px 2px #333333 inset !important;
1223
- background-color: #333333;
1224
- color: #ffffff;
1256
+ background-color: #000000;
1225
1257
  }
1226
1258
  .ui.inverted.black.buttons .button:active,
1227
1259
  .ui.inverted.black.button:active {
1228
- box-shadow: 0px 0px 0px 2px #212121 inset !important;
1229
- background-color: #212121;
1230
- color: #ffffff;
1260
+ background-color: #000000;
1231
1261
  }
1232
1262
 
1233
1263
  /* Inverted Basic */
@@ -1241,43 +1271,333 @@
1241
1271
  .ui.inverted.black.basic.buttons .button:hover,
1242
1272
  .ui.inverted.black.buttons .basic.button:hover,
1243
1273
  .ui.inverted.black.basic.button:hover {
1244
- box-shadow: 0px 0px 0px 2px #333333 inset !important;
1274
+ box-shadow: 0px 0px 0px 2px #000000 inset !important;
1245
1275
  color: #ffffff !important;
1246
1276
  }
1277
+ .ui.inverted.black.basic.buttons .button:focus,
1278
+ .ui.inverted.black.basic.buttons .button:focus,
1279
+ .ui.inverted.black.basic.button:focus {
1280
+ box-shadow: 0px 0px 0px 2px #000000 inset !important;
1281
+ color: #545454 !important;
1282
+ }
1247
1283
  .ui.inverted.black.basic.buttons .active.button,
1248
1284
  .ui.inverted.black.buttons .basic.active.button,
1249
1285
  .ui.inverted.black.basic.active.button {
1250
- box-shadow: 0px 0px 0px 2px #333333 inset !important;
1286
+ box-shadow: 0px 0px 0px 2px #000000 inset !important;
1251
1287
  color: #ffffff !important;
1252
1288
  }
1253
1289
  .ui.inverted.black.basic.buttons .button:active,
1254
1290
  .ui.inverted.black.buttons .basic.button:active,
1255
1291
  .ui.inverted.black.basic.button:active {
1256
- box-shadow: 0px 0px 0px 2px #212121 inset !important;
1292
+ box-shadow: 0px 0px 0px 2px #000000 inset !important;
1293
+ color: #ffffff !important;
1294
+ }
1295
+
1296
+ /*--- Grey ---*/
1297
+
1298
+ .ui.grey.buttons .button,
1299
+ .ui.grey.button {
1300
+ background-color: #767676;
1301
+ color: #ffffff;
1302
+ text-shadow: none;
1303
+ background-image: none;
1304
+ }
1305
+ .ui.grey.button {
1306
+ box-shadow: 0px 0em 0px 0px rgba(34, 36, 38, 0.15) inset;
1307
+ }
1308
+ .ui.grey.buttons .button:hover,
1309
+ .ui.grey.button:hover {
1310
+ background-color: #838383;
1311
+ color: #ffffff;
1312
+ text-shadow: none;
1313
+ }
1314
+ .ui.grey.buttons .button:focus,
1315
+ .ui.grey.button:focus {
1316
+ background-color: #8a8a8a;
1317
+ color: #ffffff;
1318
+ text-shadow: none;
1319
+ }
1320
+ .ui.grey.buttons .button:active,
1321
+ .ui.grey.button:active {
1322
+ background-color: #909090;
1323
+ color: #ffffff;
1324
+ text-shadow: none;
1325
+ }
1326
+ .ui.grey.buttons .active.button,
1327
+ .ui.grey.buttons .active.button:active,
1328
+ .ui.grey.active.button,
1329
+ .ui.grey.button .active.button:active {
1330
+ background-color: #696969;
1331
+ color: #ffffff;
1332
+ text-shadow: none;
1333
+ }
1334
+
1335
+ /* Basic */
1336
+ .ui.basic.grey.buttons .button,
1337
+ .ui.basic.grey.button {
1338
+ box-shadow: 0px 0px 0px 1px rgba(34, 36, 38, 0.15) inset !important;
1339
+ color: rgba(0, 0, 0, 0.6) !important;
1340
+ }
1341
+ .ui.basic.grey.buttons .button:hover,
1342
+ .ui.basic.grey.button:hover {
1343
+ background: transparent !important;
1344
+ box-shadow: 0px 0px 0px 2px #838383 inset !important;
1345
+ color: #838383 !important;
1346
+ }
1347
+ .ui.basic.grey.buttons .button:focus,
1348
+ .ui.basic.grey.button:focus {
1349
+ background: transparent !important;
1350
+ box-shadow: 0px 0px 0px 2px #8a8a8a inset !important;
1351
+ }
1352
+ .ui.basic.grey.buttons .active.button,
1353
+ .ui.basic.grey.active.button {
1354
+ background: transparent !important;
1355
+ box-shadow: 0px 0px 0px 2px #696969 inset !important;
1356
+ color: #909090 !important;
1357
+ }
1358
+ .ui.basic.grey.buttons .button:active,
1359
+ .ui.basic.grey.button:active {
1360
+ box-shadow: 0px 0px 0px 2px #909090 inset !important;
1361
+ color: #909090 !important;
1362
+ }
1363
+ .ui.buttons:not(.vertical) > .basic.grey.button:not(:first-child) {
1364
+ margin-left: -2px;
1365
+ }
1366
+
1367
+ /* Inverted */
1368
+ .ui.inverted.grey.buttons .button,
1369
+ .ui.inverted.grey.button {
1370
+ background-color: transparent;
1371
+ box-shadow: 0px 0px 0px 2px #d4d4d5 inset !important;
1372
+ color: #ffffff;
1373
+ }
1374
+ .ui.inverted.grey.buttons .button:hover,
1375
+ .ui.inverted.grey.button:hover,
1376
+ .ui.inverted.grey.buttons .button:focus,
1377
+ .ui.inverted.grey.button:focus,
1378
+ .ui.inverted.grey.buttons .button.active,
1379
+ .ui.inverted.grey.button.active,
1380
+ .ui.inverted.grey.buttons .button:active,
1381
+ .ui.inverted.grey.button:active {
1382
+ box-shadow: none !important;
1383
+ color: rgba(0, 0, 0, 0.6);
1384
+ }
1385
+ .ui.inverted.grey.buttons .button:hover,
1386
+ .ui.inverted.grey.button:hover {
1387
+ background-color: #cfd0d2;
1388
+ }
1389
+ .ui.inverted.grey.buttons .button:focus,
1390
+ .ui.inverted.grey.button:focus {
1391
+ background-color: #c7c9cb;
1392
+ }
1393
+ .ui.inverted.grey.buttons .active.button,
1394
+ .ui.inverted.grey.active.button {
1395
+ background-color: #cfd0d2;
1396
+ }
1397
+ .ui.inverted.grey.buttons .button:active,
1398
+ .ui.inverted.grey.button:active {
1399
+ background-color: #c2c4c5;
1400
+ }
1401
+
1402
+ /* Inverted Basic */
1403
+ .ui.inverted.grey.basic.buttons .button,
1404
+ .ui.inverted.grey.buttons .basic.button,
1405
+ .ui.inverted.grey.basic.button {
1406
+ background-color: transparent;
1407
+ box-shadow: 0px 0px 0px 2px rgba(255, 255, 255, 0.5) inset !important;
1408
+ color: #ffffff !important;
1409
+ }
1410
+ .ui.inverted.grey.basic.buttons .button:hover,
1411
+ .ui.inverted.grey.buttons .basic.button:hover,
1412
+ .ui.inverted.grey.basic.button:hover {
1413
+ box-shadow: 0px 0px 0px 2px #cfd0d2 inset !important;
1414
+ color: #ffffff !important;
1415
+ }
1416
+ .ui.inverted.grey.basic.buttons .button:focus,
1417
+ .ui.inverted.grey.basic.buttons .button:focus,
1418
+ .ui.inverted.grey.basic.button:focus {
1419
+ box-shadow: 0px 0px 0px 2px #c7c9cb inset !important;
1420
+ color: #dcddde !important;
1421
+ }
1422
+ .ui.inverted.grey.basic.buttons .active.button,
1423
+ .ui.inverted.grey.buttons .basic.active.button,
1424
+ .ui.inverted.grey.basic.active.button {
1425
+ box-shadow: 0px 0px 0px 2px #cfd0d2 inset !important;
1426
+ color: #ffffff !important;
1427
+ }
1428
+ .ui.inverted.grey.basic.buttons .button:active,
1429
+ .ui.inverted.grey.buttons .basic.button:active,
1430
+ .ui.inverted.grey.basic.button:active {
1431
+ box-shadow: 0px 0px 0px 2px #c2c4c5 inset !important;
1432
+ color: #ffffff !important;
1433
+ }
1434
+
1435
+ /*--- Brown ---*/
1436
+
1437
+ .ui.brown.buttons .button,
1438
+ .ui.brown.button {
1439
+ background-color: #a5673f;
1440
+ color: #ffffff;
1441
+ text-shadow: none;
1442
+ background-image: none;
1443
+ }
1444
+ .ui.brown.button {
1445
+ box-shadow: 0px 0em 0px 0px rgba(34, 36, 38, 0.15) inset;
1446
+ }
1447
+ .ui.brown.buttons .button:hover,
1448
+ .ui.brown.button:hover {
1449
+ background-color: #975b33;
1450
+ color: #ffffff;
1451
+ text-shadow: none;
1452
+ }
1453
+ .ui.brown.buttons .button:focus,
1454
+ .ui.brown.button:focus {
1455
+ background-color: #90532b;
1456
+ color: #ffffff;
1457
+ text-shadow: none;
1458
+ }
1459
+ .ui.brown.buttons .button:active,
1460
+ .ui.brown.button:active {
1461
+ background-color: #805031;
1462
+ color: #ffffff;
1463
+ text-shadow: none;
1464
+ }
1465
+ .ui.brown.buttons .active.button,
1466
+ .ui.brown.buttons .active.button:active,
1467
+ .ui.brown.active.button,
1468
+ .ui.brown.button .active.button:active {
1469
+ background-color: #995a31;
1470
+ color: #ffffff;
1471
+ text-shadow: none;
1472
+ }
1473
+
1474
+ /* Basic */
1475
+ .ui.basic.brown.buttons .button,
1476
+ .ui.basic.brown.button {
1477
+ box-shadow: 0px 0px 0px 1px rgba(34, 36, 38, 0.15) inset !important;
1478
+ color: rgba(0, 0, 0, 0.6) !important;
1479
+ }
1480
+ .ui.basic.brown.buttons .button:hover,
1481
+ .ui.basic.brown.button:hover {
1482
+ background: transparent !important;
1483
+ box-shadow: 0px 0px 0px 2px #975b33 inset !important;
1484
+ color: #975b33 !important;
1485
+ }
1486
+ .ui.basic.brown.buttons .button:focus,
1487
+ .ui.basic.brown.button:focus {
1488
+ background: transparent !important;
1489
+ box-shadow: 0px 0px 0px 2px #90532b inset !important;
1490
+ }
1491
+ .ui.basic.brown.buttons .active.button,
1492
+ .ui.basic.brown.active.button {
1493
+ background: transparent !important;
1494
+ box-shadow: 0px 0px 0px 2px #995a31 inset !important;
1495
+ color: #805031 !important;
1496
+ }
1497
+ .ui.basic.brown.buttons .button:active,
1498
+ .ui.basic.brown.button:active {
1499
+ box-shadow: 0px 0px 0px 2px #805031 inset !important;
1500
+ color: #805031 !important;
1501
+ }
1502
+ .ui.buttons:not(.vertical) > .basic.brown.button:not(:first-child) {
1503
+ margin-left: -2px;
1504
+ }
1505
+
1506
+ /* Inverted */
1507
+ .ui.inverted.brown.buttons .button,
1508
+ .ui.inverted.brown.button {
1509
+ background-color: transparent;
1510
+ box-shadow: 0px 0px 0px 2px #d67c1c inset !important;
1511
+ color: #d67c1c;
1512
+ }
1513
+ .ui.inverted.brown.buttons .button:hover,
1514
+ .ui.inverted.brown.button:hover,
1515
+ .ui.inverted.brown.buttons .button:focus,
1516
+ .ui.inverted.brown.button:focus,
1517
+ .ui.inverted.brown.buttons .button.active,
1518
+ .ui.inverted.brown.button.active,
1519
+ .ui.inverted.brown.buttons .button:active,
1520
+ .ui.inverted.brown.button:active {
1521
+ box-shadow: none !important;
1522
+ color: #ffffff;
1523
+ }
1524
+ .ui.inverted.brown.buttons .button:hover,
1525
+ .ui.inverted.brown.button:hover {
1526
+ background-color: #c86f11;
1527
+ }
1528
+ .ui.inverted.brown.buttons .button:focus,
1529
+ .ui.inverted.brown.button:focus {
1530
+ background-color: #c16808;
1531
+ }
1532
+ .ui.inverted.brown.buttons .active.button,
1533
+ .ui.inverted.brown.active.button {
1534
+ background-color: #cc6f0d;
1535
+ }
1536
+ .ui.inverted.brown.buttons .button:active,
1537
+ .ui.inverted.brown.button:active {
1538
+ background-color: #a96216;
1539
+ }
1540
+
1541
+ /* Inverted Basic */
1542
+ .ui.inverted.brown.basic.buttons .button,
1543
+ .ui.inverted.brown.buttons .basic.button,
1544
+ .ui.inverted.brown.basic.button {
1545
+ background-color: transparent;
1546
+ box-shadow: 0px 0px 0px 2px rgba(255, 255, 255, 0.5) inset !important;
1257
1547
  color: #ffffff !important;
1258
1548
  }
1549
+ .ui.inverted.brown.basic.buttons .button:hover,
1550
+ .ui.inverted.brown.buttons .basic.button:hover,
1551
+ .ui.inverted.brown.basic.button:hover {
1552
+ box-shadow: 0px 0px 0px 2px #c86f11 inset !important;
1553
+ color: #d67c1c !important;
1554
+ }
1555
+ .ui.inverted.brown.basic.buttons .button:focus,
1556
+ .ui.inverted.brown.basic.buttons .button:focus,
1557
+ .ui.inverted.brown.basic.button:focus {
1558
+ box-shadow: 0px 0px 0px 2px #c16808 inset !important;
1559
+ color: #d67c1c !important;
1560
+ }
1561
+ .ui.inverted.brown.basic.buttons .active.button,
1562
+ .ui.inverted.brown.buttons .basic.active.button,
1563
+ .ui.inverted.brown.basic.active.button {
1564
+ box-shadow: 0px 0px 0px 2px #cc6f0d inset !important;
1565
+ color: #d67c1c !important;
1566
+ }
1567
+ .ui.inverted.brown.basic.buttons .button:active,
1568
+ .ui.inverted.brown.buttons .basic.button:active,
1569
+ .ui.inverted.brown.basic.button:active {
1570
+ box-shadow: 0px 0px 0px 2px #a96216 inset !important;
1571
+ color: #d67c1c !important;
1572
+ }
1259
1573
 
1260
1574
  /*--- Blue ---*/
1261
1575
 
1262
1576
  .ui.blue.buttons .button,
1263
1577
  .ui.blue.button {
1264
- background-color: #3b83c0;
1578
+ background-color: #2185d0;
1265
1579
  color: #ffffff;
1266
1580
  text-shadow: none;
1267
1581
  background-image: none;
1268
1582
  }
1269
1583
  .ui.blue.button {
1270
- box-shadow: 0px 0em 0px 0px rgba(39, 41, 43, 0.15) inset;
1584
+ box-shadow: 0px 0em 0px 0px rgba(34, 36, 38, 0.15) inset;
1271
1585
  }
1272
1586
  .ui.blue.buttons .button:hover,
1273
1587
  .ui.blue.button:hover {
1274
- background-color: #458ac6;
1588
+ background-color: #1678c2;
1589
+ color: #ffffff;
1590
+ text-shadow: none;
1591
+ }
1592
+ .ui.blue.buttons .button:focus,
1593
+ .ui.blue.button:focus {
1594
+ background-color: #0d71bb;
1275
1595
  color: #ffffff;
1276
1596
  text-shadow: none;
1277
1597
  }
1278
1598
  .ui.blue.buttons .button:active,
1279
1599
  .ui.blue.button:active {
1280
- background-color: #3370a5;
1600
+ background-color: #1a69a4;
1281
1601
  color: #ffffff;
1282
1602
  text-shadow: none;
1283
1603
  }
@@ -1285,7 +1605,7 @@
1285
1605
  .ui.blue.buttons .active.button:active,
1286
1606
  .ui.blue.active.button,
1287
1607
  .ui.blue.button .active.button:active {
1288
- background-color: #3576ac;
1608
+ background-color: #1279c6;
1289
1609
  color: #ffffff;
1290
1610
  text-shadow: none;
1291
1611
  }
@@ -1293,27 +1613,32 @@
1293
1613
  /* Basic */
1294
1614
  .ui.basic.blue.buttons .button,
1295
1615
  .ui.basic.blue.button {
1296
- box-shadow: 0px 0px 0px 2px rgba(39, 41, 43, 0.15) inset !important;
1616
+ box-shadow: 0px 0px 0px 1px rgba(34, 36, 38, 0.15) inset !important;
1297
1617
  color: rgba(0, 0, 0, 0.6) !important;
1298
1618
  }
1299
1619
  .ui.basic.blue.buttons .button:hover,
1300
1620
  .ui.basic.blue.button:hover {
1301
1621
  background: transparent !important;
1302
- box-shadow: 0px 0px 0px 2px #458ac6 inset !important;
1303
- color: #458ac6 !important;
1622
+ box-shadow: 0px 0px 0px 2px #1678c2 inset !important;
1623
+ color: #1678c2 !important;
1304
1624
  }
1305
- .ui.basic.blue.buttons .button:active,
1306
- .ui.basic.blue.button:active {
1307
- box-shadow: 0px 0px 0px 2px #3370a5 inset !important;
1308
- color: #3370a5 !important;
1625
+ .ui.basic.blue.buttons .button:focus,
1626
+ .ui.basic.blue.button:focus {
1627
+ background: transparent !important;
1628
+ box-shadow: 0px 0px 0px 2px #0d71bb inset !important;
1309
1629
  }
1310
1630
  .ui.basic.blue.buttons .active.button,
1311
1631
  .ui.basic.blue.active.button {
1312
1632
  background: transparent !important;
1313
- box-shadow: 0px 0px 0px 2px #3370a5 inset !important;
1314
- color: #3370a5 !important;
1633
+ box-shadow: 0px 0px 0px 2px #1279c6 inset !important;
1634
+ color: #1a69a4 !important;
1635
+ }
1636
+ .ui.basic.blue.buttons .button:active,
1637
+ .ui.basic.blue.button:active {
1638
+ box-shadow: 0px 0px 0px 2px #1a69a4 inset !important;
1639
+ color: #1a69a4 !important;
1315
1640
  }
1316
- .ui.buttons > .basic.blue.button:not(:first-child) {
1641
+ .ui.buttons:not(.vertical) > .basic.blue.button:not(:first-child) {
1317
1642
  margin-left: -2px;
1318
1643
  }
1319
1644
 
@@ -1325,22 +1650,31 @@
1325
1650
  color: #54c8ff;
1326
1651
  }
1327
1652
  .ui.inverted.blue.buttons .button:hover,
1328
- .ui.inverted.blue.button:hover {
1329
- box-shadow: 0px 0px 0px 2px #54c8ff inset !important;
1330
- background-color: #54c8ff;
1653
+ .ui.inverted.blue.button:hover,
1654
+ .ui.inverted.blue.buttons .button:focus,
1655
+ .ui.inverted.blue.button:focus,
1656
+ .ui.inverted.blue.buttons .button.active,
1657
+ .ui.inverted.blue.button.active,
1658
+ .ui.inverted.blue.buttons .button:active,
1659
+ .ui.inverted.blue.button:active {
1660
+ box-shadow: none !important;
1331
1661
  color: #ffffff;
1332
1662
  }
1663
+ .ui.inverted.blue.buttons .button:hover,
1664
+ .ui.inverted.blue.button:hover {
1665
+ background-color: #3ac0ff;
1666
+ }
1667
+ .ui.inverted.blue.buttons .button:focus,
1668
+ .ui.inverted.blue.button:focus {
1669
+ background-color: #2bbbff;
1670
+ }
1333
1671
  .ui.inverted.blue.buttons .active.button,
1334
1672
  .ui.inverted.blue.active.button {
1335
- box-shadow: 0px 0px 0px 2px #54c8ff inset !important;
1336
- background-color: #54c8ff;
1337
- color: #ffffff;
1673
+ background-color: #3ac0ff;
1338
1674
  }
1339
1675
  .ui.inverted.blue.buttons .button:active,
1340
1676
  .ui.inverted.blue.button:active {
1341
- box-shadow: 0px 0px 0px 2px #30bdff inset !important;
1342
- background-color: #30bdff;
1343
- color: #ffffff;
1677
+ background-color: #21b8ff;
1344
1678
  }
1345
1679
 
1346
1680
  /* Inverted Basic */
@@ -1354,19 +1688,25 @@
1354
1688
  .ui.inverted.blue.basic.buttons .button:hover,
1355
1689
  .ui.inverted.blue.buttons .basic.button:hover,
1356
1690
  .ui.inverted.blue.basic.button:hover {
1357
- box-shadow: 0px 0px 0px 2px #54c8ff inset !important;
1691
+ box-shadow: 0px 0px 0px 2px #3ac0ff inset !important;
1692
+ color: #54c8ff !important;
1693
+ }
1694
+ .ui.inverted.blue.basic.buttons .button:focus,
1695
+ .ui.inverted.blue.basic.buttons .button:focus,
1696
+ .ui.inverted.blue.basic.button:focus {
1697
+ box-shadow: 0px 0px 0px 2px #2bbbff inset !important;
1358
1698
  color: #54c8ff !important;
1359
1699
  }
1360
1700
  .ui.inverted.blue.basic.buttons .active.button,
1361
1701
  .ui.inverted.blue.buttons .basic.active.button,
1362
1702
  .ui.inverted.blue.basic.active.button {
1363
- box-shadow: 0px 0px 0px 2px #54c8ff inset !important;
1703
+ box-shadow: 0px 0px 0px 2px #3ac0ff inset !important;
1364
1704
  color: #54c8ff !important;
1365
1705
  }
1366
1706
  .ui.inverted.blue.basic.buttons .button:active,
1367
1707
  .ui.inverted.blue.buttons .basic.button:active,
1368
1708
  .ui.inverted.blue.basic.button:active {
1369
- box-shadow: 0px 0px 0px 2px #30bdff inset !important;
1709
+ box-shadow: 0px 0px 0px 2px #21b8ff inset !important;
1370
1710
  color: #54c8ff !important;
1371
1711
  }
1372
1712
 
@@ -1374,23 +1714,29 @@
1374
1714
 
1375
1715
  .ui.green.buttons .button,
1376
1716
  .ui.green.button {
1377
- background-color: #5bbd72;
1717
+ background-color: #21ba45;
1378
1718
  color: #ffffff;
1379
1719
  text-shadow: none;
1380
1720
  background-image: none;
1381
1721
  }
1382
1722
  .ui.green.button {
1383
- box-shadow: 0px 0em 0px 0px rgba(39, 41, 43, 0.15) inset;
1723
+ box-shadow: 0px 0em 0px 0px rgba(34, 36, 38, 0.15) inset;
1384
1724
  }
1385
1725
  .ui.green.buttons .button:hover,
1386
1726
  .ui.green.button:hover {
1387
- background-color: #66c17b;
1727
+ background-color: #16ab39;
1728
+ color: #ffffff;
1729
+ text-shadow: none;
1730
+ }
1731
+ .ui.green.buttons .button:focus,
1732
+ .ui.green.button:focus {
1733
+ background-color: #0ea432;
1388
1734
  color: #ffffff;
1389
1735
  text-shadow: none;
1390
1736
  }
1391
1737
  .ui.green.buttons .button:active,
1392
1738
  .ui.green.button:active {
1393
- background-color: #46ae5f;
1739
+ background-color: #198f35;
1394
1740
  color: #ffffff;
1395
1741
  text-shadow: none;
1396
1742
  }
@@ -1398,7 +1744,7 @@
1398
1744
  .ui.green.buttons .active.button:active,
1399
1745
  .ui.green.active.button,
1400
1746
  .ui.green.button .active.button:active {
1401
- background-color: #49b562;
1747
+ background-color: #13ae38;
1402
1748
  color: #ffffff;
1403
1749
  text-shadow: none;
1404
1750
  }
@@ -1406,28 +1752,33 @@
1406
1752
  /* Basic */
1407
1753
  .ui.basic.green.buttons .button,
1408
1754
  .ui.basic.green.button {
1409
- box-shadow: 0px 0px 0px 2px rgba(39, 41, 43, 0.15) inset !important;
1755
+ box-shadow: 0px 0px 0px 1px rgba(34, 36, 38, 0.15) inset !important;
1410
1756
  color: rgba(0, 0, 0, 0.6) !important;
1411
1757
  }
1412
1758
  .ui.basic.green.buttons .button:hover,
1413
1759
  .ui.basic.green.button:hover {
1414
1760
  background: transparent !important;
1415
- box-shadow: 0px 0px 0px 2px #66c17b inset !important;
1416
- color: #66c17b !important;
1761
+ box-shadow: 0px 0px 0px 2px #16ab39 inset !important;
1762
+ color: #16ab39 !important;
1417
1763
  }
1418
- .ui.basic.green.buttons .button:active,
1419
- .ui.basic.green.button:active {
1420
- box-shadow: 0px 0px 0px 2px #46ae5f inset !important;
1421
- color: #46ae5f !important;
1764
+ .ui.basic.green.buttons .button:focus,
1765
+ .ui.basic.green.button:focus {
1766
+ background: transparent !important;
1767
+ box-shadow: 0px 0px 0px 2px #0ea432 inset !important;
1422
1768
  }
1423
1769
  .ui.basic.green.buttons .active.button,
1424
1770
  .ui.basic.green.active.button {
1425
1771
  background: transparent !important;
1426
- box-shadow: 0px 0px 0px 2px #46ae5f inset !important;
1427
- color: #46ae5f !important;
1428
- }
1429
- .ui.buttons > .basic.green.button:not(:first-child) {
1430
- margin-left: -2px;
1772
+ box-shadow: 0px 0px 0px 2px #13ae38 inset !important;
1773
+ color: #198f35 !important;
1774
+ }
1775
+ .ui.basic.green.buttons .button:active,
1776
+ .ui.basic.green.button:active {
1777
+ box-shadow: 0px 0px 0px 2px #198f35 inset !important;
1778
+ color: #198f35 !important;
1779
+ }
1780
+ .ui.buttons:not(.vertical) > .basic.green.button:not(:first-child) {
1781
+ margin-left: -2px;
1431
1782
  }
1432
1783
 
1433
1784
  /* Inverted */
@@ -1438,22 +1789,31 @@
1438
1789
  color: #2ecc40;
1439
1790
  }
1440
1791
  .ui.inverted.green.buttons .button:hover,
1441
- .ui.inverted.green.button:hover {
1442
- box-shadow: 0px 0px 0px 2px #2ecc40 inset !important;
1443
- background-color: #2ecc40;
1792
+ .ui.inverted.green.button:hover,
1793
+ .ui.inverted.green.buttons .button:focus,
1794
+ .ui.inverted.green.button:focus,
1795
+ .ui.inverted.green.buttons .button.active,
1796
+ .ui.inverted.green.button.active,
1797
+ .ui.inverted.green.buttons .button:active,
1798
+ .ui.inverted.green.button:active {
1799
+ box-shadlightOw: none !important;
1444
1800
  color: #ffffff;
1445
1801
  }
1802
+ .ui.inverted.green.buttons .button:hover,
1803
+ .ui.inverted.green.button:hover {
1804
+ background-color: #22be34;
1805
+ }
1806
+ .ui.inverted.green.buttons .button:focus,
1807
+ .ui.inverted.green.button:focus {
1808
+ background-color: #19b82b;
1809
+ }
1446
1810
  .ui.inverted.green.buttons .active.button,
1447
1811
  .ui.inverted.green.active.button {
1448
- box-shadow: 0px 0px 0px 2px #2ecc40 inset !important;
1449
- background-color: #2ecc40;
1450
- color: #ffffff;
1812
+ background-color: #1fc231;
1451
1813
  }
1452
1814
  .ui.inverted.green.buttons .button:active,
1453
1815
  .ui.inverted.green.button:active {
1454
- box-shadow: 0px 0px 0px 2px #27af37 inset !important;
1455
- background-color: #27af37;
1456
- color: #ffffff;
1816
+ background-color: #25a233;
1457
1817
  }
1458
1818
 
1459
1819
  /* Inverted Basic */
@@ -1467,19 +1827,25 @@
1467
1827
  .ui.inverted.green.basic.buttons .button:hover,
1468
1828
  .ui.inverted.green.buttons .basic.button:hover,
1469
1829
  .ui.inverted.green.basic.button:hover {
1470
- box-shadow: 0px 0px 0px 2px #2ecc40 inset !important;
1830
+ box-shadow: 0px 0px 0px 2px #22be34 inset !important;
1831
+ color: #2ecc40 !important;
1832
+ }
1833
+ .ui.inverted.green.basic.buttons .button:focus,
1834
+ .ui.inverted.green.basic.buttons .button:focus,
1835
+ .ui.inverted.green.basic.button:focus {
1836
+ box-shadow: 0px 0px 0px 2px #19b82b inset !important;
1471
1837
  color: #2ecc40 !important;
1472
1838
  }
1473
1839
  .ui.inverted.green.basic.buttons .active.button,
1474
1840
  .ui.inverted.green.buttons .basic.active.button,
1475
1841
  .ui.inverted.green.basic.active.button {
1476
- box-shadow: 0px 0px 0px 2px #2ecc40 inset !important;
1842
+ box-shadow: 0px 0px 0px 2px #1fc231 inset !important;
1477
1843
  color: #2ecc40 !important;
1478
1844
  }
1479
1845
  .ui.inverted.green.basic.buttons .button:active,
1480
1846
  .ui.inverted.green.buttons .basic.button:active,
1481
1847
  .ui.inverted.green.basic.button:active {
1482
- box-shadow: 0px 0px 0px 2px #27af37 inset !important;
1848
+ box-shadow: 0px 0px 0px 2px #25a233 inset !important;
1483
1849
  color: #2ecc40 !important;
1484
1850
  }
1485
1851
 
@@ -1487,23 +1853,29 @@
1487
1853
 
1488
1854
  .ui.orange.buttons .button,
1489
1855
  .ui.orange.button {
1490
- background-color: #e07b53;
1856
+ background-color: #f2711c;
1491
1857
  color: #ffffff;
1492
1858
  text-shadow: none;
1493
1859
  background-image: none;
1494
1860
  }
1495
1861
  .ui.orange.button {
1496
- box-shadow: 0px 0em 0px 0px rgba(39, 41, 43, 0.15) inset;
1862
+ box-shadow: 0px 0em 0px 0px rgba(34, 36, 38, 0.15) inset;
1497
1863
  }
1498
1864
  .ui.orange.buttons .button:hover,
1499
1865
  .ui.orange.button:hover {
1500
- background-color: #e28560;
1866
+ background-color: #f26202;
1867
+ color: #ffffff;
1868
+ text-shadow: none;
1869
+ }
1870
+ .ui.orange.buttons .button:focus,
1871
+ .ui.orange.button:focus {
1872
+ background-color: #e55b00;
1501
1873
  color: #ffffff;
1502
1874
  text-shadow: none;
1503
1875
  }
1504
1876
  .ui.orange.buttons .button:active,
1505
1877
  .ui.orange.button:active {
1506
- background-color: #db6435;
1878
+ background-color: #cf590c;
1507
1879
  color: #ffffff;
1508
1880
  text-shadow: none;
1509
1881
  }
@@ -1511,7 +1883,7 @@
1511
1883
  .ui.orange.buttons .active.button:active,
1512
1884
  .ui.orange.active.button,
1513
1885
  .ui.orange.button .active.button:active {
1514
- background-color: #dc6a3d;
1886
+ background-color: #f56100;
1515
1887
  color: #ffffff;
1516
1888
  text-shadow: none;
1517
1889
  }
@@ -1519,27 +1891,32 @@
1519
1891
  /* Basic */
1520
1892
  .ui.basic.orange.buttons .button,
1521
1893
  .ui.basic.orange.button {
1522
- box-shadow: 0px 0px 0px 2px rgba(39, 41, 43, 0.15) inset !important;
1894
+ box-shadow: 0px 0px 0px 1px rgba(34, 36, 38, 0.15) inset !important;
1523
1895
  color: rgba(0, 0, 0, 0.6) !important;
1524
1896
  }
1525
1897
  .ui.basic.orange.buttons .button:hover,
1526
1898
  .ui.basic.orange.button:hover {
1527
1899
  background: transparent !important;
1528
- box-shadow: 0px 0px 0px 2px #e28560 inset !important;
1529
- color: #e28560 !important;
1900
+ box-shadow: 0px 0px 0px 2px #f26202 inset !important;
1901
+ color: #f26202 !important;
1530
1902
  }
1531
- .ui.basic.orange.buttons .button:active,
1532
- .ui.basic.orange.button:active {
1533
- box-shadow: 0px 0px 0px 2px #db6435 inset !important;
1534
- color: #db6435 !important;
1903
+ .ui.basic.orange.buttons .button:focus,
1904
+ .ui.basic.orange.button:focus {
1905
+ background: transparent !important;
1906
+ box-shadow: 0px 0px 0px 2px #e55b00 inset !important;
1535
1907
  }
1536
1908
  .ui.basic.orange.buttons .active.button,
1537
1909
  .ui.basic.orange.active.button {
1538
1910
  background: transparent !important;
1539
- box-shadow: 0px 0px 0px 2px #db6435 inset !important;
1540
- color: #db6435 !important;
1911
+ box-shadow: 0px 0px 0px 2px #f56100 inset !important;
1912
+ color: #cf590c !important;
1913
+ }
1914
+ .ui.basic.orange.buttons .button:active,
1915
+ .ui.basic.orange.button:active {
1916
+ box-shadow: 0px 0px 0px 2px #cf590c inset !important;
1917
+ color: #cf590c !important;
1541
1918
  }
1542
- .ui.buttons > .basic.orange.button:not(:first-child) {
1919
+ .ui.buttons:not(.vertical) > .basic.orange.button:not(:first-child) {
1543
1920
  margin-left: -2px;
1544
1921
  }
1545
1922
 
@@ -1551,22 +1928,31 @@
1551
1928
  color: #ff851b;
1552
1929
  }
1553
1930
  .ui.inverted.orange.buttons .button:hover,
1554
- .ui.inverted.orange.button:hover {
1555
- box-shadow: 0px 0px 0px 2px #ff851b inset !important;
1556
- background-color: #ff851b;
1931
+ .ui.inverted.orange.button:hover,
1932
+ .ui.inverted.orange.buttons .button:focus,
1933
+ .ui.inverted.orange.button:focus,
1934
+ .ui.inverted.orange.buttons .button.active,
1935
+ .ui.inverted.orange.button.active,
1936
+ .ui.inverted.orange.buttons .button:active,
1937
+ .ui.inverted.orange.button:active {
1938
+ box-shadow: none !important;
1557
1939
  color: #ffffff;
1558
1940
  }
1941
+ .ui.inverted.orange.buttons .button:hover,
1942
+ .ui.inverted.orange.button:hover {
1943
+ background-color: #ff7701;
1944
+ }
1945
+ .ui.inverted.orange.buttons .button:focus,
1946
+ .ui.inverted.orange.button:focus {
1947
+ background-color: #f17000;
1948
+ }
1559
1949
  .ui.inverted.orange.buttons .active.button,
1560
1950
  .ui.inverted.orange.active.button {
1561
- box-shadow: 0px 0px 0px 2px #ff851b inset !important;
1562
- background-color: #ff851b;
1563
- color: #ffffff;
1951
+ background-color: #ff7701;
1564
1952
  }
1565
1953
  .ui.inverted.orange.buttons .button:active,
1566
1954
  .ui.inverted.orange.button:active {
1567
- box-shadow: 0px 0px 0px 2px #f67300 inset !important;
1568
- background-color: #f67300;
1569
- color: #ffffff;
1955
+ background-color: #e76b00;
1570
1956
  }
1571
1957
 
1572
1958
  /* Inverted Basic */
@@ -1580,19 +1966,25 @@
1580
1966
  .ui.inverted.orange.basic.buttons .button:hover,
1581
1967
  .ui.inverted.orange.buttons .basic.button:hover,
1582
1968
  .ui.inverted.orange.basic.button:hover {
1583
- box-shadow: 0px 0px 0px 2px #ff851b inset !important;
1969
+ box-shadow: 0px 0px 0px 2px #ff7701 inset !important;
1970
+ color: #ff851b !important;
1971
+ }
1972
+ .ui.inverted.orange.basic.buttons .button:focus,
1973
+ .ui.inverted.orange.basic.buttons .button:focus,
1974
+ .ui.inverted.orange.basic.button:focus {
1975
+ box-shadow: 0px 0px 0px 2px #f17000 inset !important;
1584
1976
  color: #ff851b !important;
1585
1977
  }
1586
1978
  .ui.inverted.orange.basic.buttons .active.button,
1587
1979
  .ui.inverted.orange.buttons .basic.active.button,
1588
1980
  .ui.inverted.orange.basic.active.button {
1589
- box-shadow: 0px 0px 0px 2px #ff851b inset !important;
1981
+ box-shadow: 0px 0px 0px 2px #ff7701 inset !important;
1590
1982
  color: #ff851b !important;
1591
1983
  }
1592
1984
  .ui.inverted.orange.basic.buttons .button:active,
1593
1985
  .ui.inverted.orange.buttons .basic.button:active,
1594
1986
  .ui.inverted.orange.basic.button:active {
1595
- box-shadow: 0px 0px 0px 2px #f67300 inset !important;
1987
+ box-shadow: 0px 0px 0px 2px #e76b00 inset !important;
1596
1988
  color: #ff851b !important;
1597
1989
  }
1598
1990
 
@@ -1600,23 +1992,29 @@
1600
1992
 
1601
1993
  .ui.pink.buttons .button,
1602
1994
  .ui.pink.button {
1603
- background-color: #d9499a;
1995
+ background-color: #e03997;
1604
1996
  color: #ffffff;
1605
1997
  text-shadow: none;
1606
1998
  background-image: none;
1607
1999
  }
1608
2000
  .ui.pink.button {
1609
- box-shadow: 0px 0em 0px 0px rgba(39, 41, 43, 0.15) inset;
2001
+ box-shadow: 0px 0em 0px 0px rgba(34, 36, 38, 0.15) inset;
1610
2002
  }
1611
2003
  .ui.pink.buttons .button:hover,
1612
2004
  .ui.pink.button:hover {
1613
- background-color: #dc56a1;
2005
+ background-color: #e61a8d;
2006
+ color: #ffffff;
2007
+ text-shadow: none;
2008
+ }
2009
+ .ui.pink.buttons .button:focus,
2010
+ .ui.pink.button:focus {
2011
+ background-color: #e10f85;
1614
2012
  color: #ffffff;
1615
2013
  text-shadow: none;
1616
2014
  }
1617
2015
  .ui.pink.buttons .button:active,
1618
2016
  .ui.pink.button:active {
1619
- background-color: #d22c8a;
2017
+ background-color: #c71f7e;
1620
2018
  color: #ffffff;
1621
2019
  text-shadow: none;
1622
2020
  }
@@ -1624,7 +2022,7 @@
1624
2022
  .ui.pink.buttons .active.button:active,
1625
2023
  .ui.pink.active.button,
1626
2024
  .ui.pink.button .active.button:active {
1627
- background-color: #d5348e;
2025
+ background-color: #ea158d;
1628
2026
  color: #ffffff;
1629
2027
  text-shadow: none;
1630
2028
  }
@@ -1632,27 +2030,32 @@
1632
2030
  /* Basic */
1633
2031
  .ui.basic.pink.buttons .button,
1634
2032
  .ui.basic.pink.button {
1635
- box-shadow: 0px 0px 0px 2px rgba(39, 41, 43, 0.15) inset !important;
2033
+ box-shadow: 0px 0px 0px 1px rgba(34, 36, 38, 0.15) inset !important;
1636
2034
  color: rgba(0, 0, 0, 0.6) !important;
1637
2035
  }
1638
2036
  .ui.basic.pink.buttons .button:hover,
1639
2037
  .ui.basic.pink.button:hover {
1640
2038
  background: transparent !important;
1641
- box-shadow: 0px 0px 0px 2px #dc56a1 inset !important;
1642
- color: #dc56a1 !important;
2039
+ box-shadow: 0px 0px 0px 2px #e61a8d inset !important;
2040
+ color: #e61a8d !important;
1643
2041
  }
1644
- .ui.basic.pink.buttons .button:active,
1645
- .ui.basic.pink.button:active {
1646
- box-shadow: 0px 0px 0px 2px #d22c8a inset !important;
1647
- color: #d22c8a !important;
2042
+ .ui.basic.pink.buttons .button:focus,
2043
+ .ui.basic.pink.button:focus {
2044
+ background: transparent !important;
2045
+ box-shadow: 0px 0px 0px 2px #e10f85 inset !important;
1648
2046
  }
1649
2047
  .ui.basic.pink.buttons .active.button,
1650
2048
  .ui.basic.pink.active.button {
1651
2049
  background: transparent !important;
1652
- box-shadow: 0px 0px 0px 2px #d22c8a inset !important;
1653
- color: #d22c8a !important;
2050
+ box-shadow: 0px 0px 0px 2px #ea158d inset !important;
2051
+ color: #c71f7e !important;
1654
2052
  }
1655
- .ui.buttons > .basic.pink.button:not(:first-child) {
2053
+ .ui.basic.pink.buttons .button:active,
2054
+ .ui.basic.pink.button:active {
2055
+ box-shadow: 0px 0px 0px 2px #c71f7e inset !important;
2056
+ color: #c71f7e !important;
2057
+ }
2058
+ .ui.buttons:not(.vertical) > .basic.pink.button:not(:first-child) {
1656
2059
  margin-left: -2px;
1657
2060
  }
1658
2061
 
@@ -1664,22 +2067,31 @@
1664
2067
  color: #ff8edf;
1665
2068
  }
1666
2069
  .ui.inverted.pink.buttons .button:hover,
1667
- .ui.inverted.pink.button:hover {
1668
- box-shadow: 0px 0px 0px 2px #ff8edf inset !important;
1669
- background-color: #ff8edf;
2070
+ .ui.inverted.pink.button:hover,
2071
+ .ui.inverted.pink.buttons .button:focus,
2072
+ .ui.inverted.pink.button:focus,
2073
+ .ui.inverted.pink.buttons .button.active,
2074
+ .ui.inverted.pink.button.active,
2075
+ .ui.inverted.pink.buttons .button:active,
2076
+ .ui.inverted.pink.button:active {
2077
+ box-shadow: none !important;
1670
2078
  color: #ffffff;
1671
2079
  }
2080
+ .ui.inverted.pink.buttons .button:hover,
2081
+ .ui.inverted.pink.button:hover {
2082
+ background-color: #ff74d8;
2083
+ }
2084
+ .ui.inverted.pink.buttons .button:focus,
2085
+ .ui.inverted.pink.button:focus {
2086
+ background-color: #ff65d3;
2087
+ }
1672
2088
  .ui.inverted.pink.buttons .active.button,
1673
2089
  .ui.inverted.pink.active.button {
1674
- box-shadow: 0px 0px 0px 2px #ff8edf inset !important;
1675
- background-color: #ff8edf;
1676
- color: #ffffff;
2090
+ background-color: #ff74d8;
1677
2091
  }
1678
2092
  .ui.inverted.pink.buttons .button:active,
1679
2093
  .ui.inverted.pink.button:active {
1680
- box-shadow: 0px 0px 0px 2px #ff6ad5 inset !important;
1681
- background-color: #ff6ad5;
1682
- color: #ffffff;
2094
+ background-color: #ff5bd1;
1683
2095
  }
1684
2096
 
1685
2097
  /* Inverted Basic */
@@ -1693,43 +2105,194 @@
1693
2105
  .ui.inverted.pink.basic.buttons .button:hover,
1694
2106
  .ui.inverted.pink.buttons .basic.button:hover,
1695
2107
  .ui.inverted.pink.basic.button:hover {
1696
- box-shadow: 0px 0px 0px 2px #ff8edf inset !important;
2108
+ box-shadow: 0px 0px 0px 2px #ff74d8 inset !important;
2109
+ color: #ff8edf !important;
2110
+ }
2111
+ .ui.inverted.pink.basic.buttons .button:focus,
2112
+ .ui.inverted.pink.basic.buttons .button:focus,
2113
+ .ui.inverted.pink.basic.button:focus {
2114
+ box-shadow: 0px 0px 0px 2px #ff65d3 inset !important;
1697
2115
  color: #ff8edf !important;
1698
2116
  }
1699
2117
  .ui.inverted.pink.basic.buttons .active.button,
1700
2118
  .ui.inverted.pink.buttons .basic.active.button,
1701
2119
  .ui.inverted.pink.basic.active.button {
1702
- box-shadow: 0px 0px 0px 2px #ff8edf inset !important;
2120
+ box-shadow: 0px 0px 0px 2px #ff74d8 inset !important;
1703
2121
  color: #ff8edf !important;
1704
2122
  }
1705
2123
  .ui.inverted.pink.basic.buttons .button:active,
1706
2124
  .ui.inverted.pink.buttons .basic.button:active,
1707
2125
  .ui.inverted.pink.basic.button:active {
1708
- box-shadow: 0px 0px 0px 2px #ff6ad5 inset !important;
2126
+ box-shadow: 0px 0px 0px 2px #ff5bd1 inset !important;
1709
2127
  color: #ff8edf !important;
1710
2128
  }
1711
2129
 
2130
+ /*--- Violet ---*/
2131
+
2132
+ .ui.violet.buttons .button,
2133
+ .ui.violet.button {
2134
+ background-color: #6435c9;
2135
+ color: #ffffff;
2136
+ text-shadow: none;
2137
+ background-image: none;
2138
+ }
2139
+ .ui.violet.button {
2140
+ box-shadow: 0px 0em 0px 0px rgba(34, 36, 38, 0.15) inset;
2141
+ }
2142
+ .ui.violet.buttons .button:hover,
2143
+ .ui.violet.button:hover {
2144
+ background-color: #5829bb;
2145
+ color: #ffffff;
2146
+ text-shadow: none;
2147
+ }
2148
+ .ui.violet.buttons .button:focus,
2149
+ .ui.violet.button:focus {
2150
+ background-color: #4f20b5;
2151
+ color: #ffffff;
2152
+ text-shadow: none;
2153
+ }
2154
+ .ui.violet.buttons .button:active,
2155
+ .ui.violet.button:active {
2156
+ background-color: #502aa1;
2157
+ color: #ffffff;
2158
+ text-shadow: none;
2159
+ }
2160
+ .ui.violet.buttons .active.button,
2161
+ .ui.violet.buttons .active.button:active,
2162
+ .ui.violet.active.button,
2163
+ .ui.violet.button .active.button:active {
2164
+ background-color: #5626bf;
2165
+ color: #ffffff;
2166
+ text-shadow: none;
2167
+ }
2168
+
2169
+ /* Basic */
2170
+ .ui.basic.violet.buttons .button,
2171
+ .ui.basic.violet.button {
2172
+ box-shadow: 0px 0px 0px 1px rgba(34, 36, 38, 0.15) inset !important;
2173
+ color: rgba(0, 0, 0, 0.6) !important;
2174
+ }
2175
+ .ui.basic.violet.buttons .button:hover,
2176
+ .ui.basic.violet.button:hover {
2177
+ background: transparent !important;
2178
+ box-shadow: 0px 0px 0px 2px #5829bb inset !important;
2179
+ color: #5829bb !important;
2180
+ }
2181
+ .ui.basic.violet.buttons .button:focus,
2182
+ .ui.basic.violet.button:focus {
2183
+ background: transparent !important;
2184
+ box-shadow: 0px 0px 0px 2px #4f20b5 inset !important;
2185
+ }
2186
+ .ui.basic.violet.buttons .active.button,
2187
+ .ui.basic.violet.active.button {
2188
+ background: transparent !important;
2189
+ box-shadow: 0px 0px 0px 2px #5626bf inset !important;
2190
+ color: #502aa1 !important;
2191
+ }
2192
+ .ui.basic.violet.buttons .button:active,
2193
+ .ui.basic.violet.button:active {
2194
+ box-shadow: 0px 0px 0px 2px #502aa1 inset !important;
2195
+ color: #502aa1 !important;
2196
+ }
2197
+ .ui.buttons:not(.vertical) > .basic.violet.button:not(:first-child) {
2198
+ margin-left: -2px;
2199
+ }
2200
+
2201
+ /* Inverted */
2202
+ .ui.inverted.violet.buttons .button,
2203
+ .ui.inverted.violet.button {
2204
+ background-color: transparent;
2205
+ box-shadow: 0px 0px 0px 2px #a291fb inset !important;
2206
+ color: #a291fb;
2207
+ }
2208
+ .ui.inverted.violet.buttons .button:hover,
2209
+ .ui.inverted.violet.button:hover,
2210
+ .ui.inverted.violet.buttons .button:focus,
2211
+ .ui.inverted.violet.button:focus,
2212
+ .ui.inverted.violet.buttons .button.active,
2213
+ .ui.inverted.violet.button.active,
2214
+ .ui.inverted.violet.buttons .button:active,
2215
+ .ui.inverted.violet.button:active {
2216
+ box-shadow: none !important;
2217
+ color: #ffffff;
2218
+ }
2219
+ .ui.inverted.violet.buttons .button:hover,
2220
+ .ui.inverted.violet.button:hover {
2221
+ background-color: #8a73ff;
2222
+ }
2223
+ .ui.inverted.violet.buttons .button:focus,
2224
+ .ui.inverted.violet.button:focus {
2225
+ background-color: #7d64ff;
2226
+ }
2227
+ .ui.inverted.violet.buttons .active.button,
2228
+ .ui.inverted.violet.active.button {
2229
+ background-color: #8a73ff;
2230
+ }
2231
+ .ui.inverted.violet.buttons .button:active,
2232
+ .ui.inverted.violet.button:active {
2233
+ background-color: #7860f9;
2234
+ }
2235
+
2236
+ /* Inverted Basic */
2237
+ .ui.inverted.violet.basic.buttons .button,
2238
+ .ui.inverted.violet.buttons .basic.button,
2239
+ .ui.inverted.violet.basic.button {
2240
+ background-color: transparent;
2241
+ box-shadow: 0px 0px 0px 2px rgba(255, 255, 255, 0.5) inset !important;
2242
+ color: #ffffff !important;
2243
+ }
2244
+ .ui.inverted.violet.basic.buttons .button:hover,
2245
+ .ui.inverted.violet.buttons .basic.button:hover,
2246
+ .ui.inverted.violet.basic.button:hover {
2247
+ box-shadow: 0px 0px 0px 2px #8a73ff inset !important;
2248
+ color: #a291fb !important;
2249
+ }
2250
+ .ui.inverted.violet.basic.buttons .button:focus,
2251
+ .ui.inverted.violet.basic.buttons .button:focus,
2252
+ .ui.inverted.violet.basic.button:focus {
2253
+ box-shadow: 0px 0px 0px 2px #7d64ff inset !important;
2254
+ color: #a291fb !important;
2255
+ }
2256
+ .ui.inverted.violet.basic.buttons .active.button,
2257
+ .ui.inverted.violet.buttons .basic.active.button,
2258
+ .ui.inverted.violet.basic.active.button {
2259
+ box-shadow: 0px 0px 0px 2px #8a73ff inset !important;
2260
+ color: #a291fb !important;
2261
+ }
2262
+ .ui.inverted.violet.basic.buttons .button:active,
2263
+ .ui.inverted.violet.buttons .basic.button:active,
2264
+ .ui.inverted.violet.basic.button:active {
2265
+ box-shadow: 0px 0px 0px 2px #7860f9 inset !important;
2266
+ color: #a291fb !important;
2267
+ }
2268
+
1712
2269
  /*--- Purple ---*/
1713
2270
 
1714
2271
  .ui.purple.buttons .button,
1715
2272
  .ui.purple.button {
1716
- background-color: #564f8a;
2273
+ background-color: #a333c8;
1717
2274
  color: #ffffff;
1718
2275
  text-shadow: none;
1719
2276
  background-image: none;
1720
2277
  }
1721
2278
  .ui.purple.button {
1722
- box-shadow: 0px 0em 0px 0px rgba(39, 41, 43, 0.15) inset;
2279
+ box-shadow: 0px 0em 0px 0px rgba(34, 36, 38, 0.15) inset;
1723
2280
  }
1724
2281
  .ui.purple.buttons .button:hover,
1725
2282
  .ui.purple.button:hover {
1726
- background-color: #5c5594;
2283
+ background-color: #9627ba;
2284
+ color: #ffffff;
2285
+ text-shadow: none;
2286
+ }
2287
+ .ui.purple.buttons .button:focus,
2288
+ .ui.purple.button:focus {
2289
+ background-color: #8f1eb4;
1727
2290
  color: #ffffff;
1728
2291
  text-shadow: none;
1729
2292
  }
1730
2293
  .ui.purple.buttons .button:active,
1731
2294
  .ui.purple.button:active {
1732
- background-color: #484273;
2295
+ background-color: #82299f;
1733
2296
  color: #ffffff;
1734
2297
  text-shadow: none;
1735
2298
  }
@@ -1737,7 +2300,7 @@
1737
2300
  .ui.purple.buttons .active.button:active,
1738
2301
  .ui.purple.active.button,
1739
2302
  .ui.purple.button .active.button:active {
1740
- background-color: #4c467a;
2303
+ background-color: #9724be;
1741
2304
  color: #ffffff;
1742
2305
  text-shadow: none;
1743
2306
  }
@@ -1745,27 +2308,32 @@
1745
2308
  /* Basic */
1746
2309
  .ui.basic.purple.buttons .button,
1747
2310
  .ui.basic.purple.button {
1748
- box-shadow: 0px 0px 0px 2px rgba(39, 41, 43, 0.15) inset !important;
2311
+ box-shadow: 0px 0px 0px 1px rgba(34, 36, 38, 0.15) inset !important;
1749
2312
  color: rgba(0, 0, 0, 0.6) !important;
1750
2313
  }
1751
2314
  .ui.basic.purple.buttons .button:hover,
1752
2315
  .ui.basic.purple.button:hover {
1753
2316
  background: transparent !important;
1754
- box-shadow: 0px 0px 0px 2px #5c5594 inset !important;
1755
- color: #5c5594 !important;
2317
+ box-shadow: 0px 0px 0px 2px #9627ba inset !important;
2318
+ color: #9627ba !important;
1756
2319
  }
1757
- .ui.basic.purple.buttons .button:active,
1758
- .ui.basic.purple.button:active {
1759
- box-shadow: 0px 0px 0px 2px #484273 inset !important;
1760
- color: #484273 !important;
2320
+ .ui.basic.purple.buttons .button:focus,
2321
+ .ui.basic.purple.button:focus {
2322
+ background: transparent !important;
2323
+ box-shadow: 0px 0px 0px 2px #8f1eb4 inset !important;
1761
2324
  }
1762
2325
  .ui.basic.purple.buttons .active.button,
1763
2326
  .ui.basic.purple.active.button {
1764
2327
  background: transparent !important;
1765
- box-shadow: 0px 0px 0px 2px #484273 inset !important;
1766
- color: #484273 !important;
2328
+ box-shadow: 0px 0px 0px 2px #9724be inset !important;
2329
+ color: #82299f !important;
1767
2330
  }
1768
- .ui.buttons > .basic.purple.button:not(:first-child) {
2331
+ .ui.basic.purple.buttons .button:active,
2332
+ .ui.basic.purple.button:active {
2333
+ box-shadow: 0px 0px 0px 2px #82299f inset !important;
2334
+ color: #82299f !important;
2335
+ }
2336
+ .ui.buttons:not(.vertical) > .basic.purple.button:not(:first-child) {
1769
2337
  margin-left: -2px;
1770
2338
  }
1771
2339
 
@@ -1773,26 +2341,35 @@
1773
2341
  .ui.inverted.purple.buttons .button,
1774
2342
  .ui.inverted.purple.button {
1775
2343
  background-color: transparent;
1776
- box-shadow: 0px 0px 0px 2px #cdc6ff inset !important;
1777
- color: #cdc6ff;
2344
+ box-shadow: 0px 0px 0px 2px #dc73ff inset !important;
2345
+ color: #dc73ff;
2346
+ }
2347
+ .ui.inverted.purple.buttons .button:hover,
2348
+ .ui.inverted.purple.button:hover,
2349
+ .ui.inverted.purple.buttons .button:focus,
2350
+ .ui.inverted.purple.button:focus,
2351
+ .ui.inverted.purple.buttons .button.active,
2352
+ .ui.inverted.purple.button.active,
2353
+ .ui.inverted.purple.buttons .button:active,
2354
+ .ui.inverted.purple.button:active {
2355
+ box-shadow: none !important;
2356
+ color: #ffffff;
1778
2357
  }
1779
2358
  .ui.inverted.purple.buttons .button:hover,
1780
2359
  .ui.inverted.purple.button:hover {
1781
- box-shadow: 0px 0px 0px 2px #cdc6ff inset !important;
1782
- background-color: #cdc6ff;
1783
- color: #1b1c1d;
2360
+ background-color: #d65aff;
2361
+ }
2362
+ .ui.inverted.purple.buttons .button:focus,
2363
+ .ui.inverted.purple.button:focus {
2364
+ background-color: #d24aff;
1784
2365
  }
1785
2366
  .ui.inverted.purple.buttons .active.button,
1786
2367
  .ui.inverted.purple.active.button {
1787
- box-shadow: 0px 0px 0px 2px #cdc6ff inset !important;
1788
- background-color: #cdc6ff;
1789
- color: #1b1c1d;
2368
+ background-color: #d65aff;
1790
2369
  }
1791
2370
  .ui.inverted.purple.buttons .button:active,
1792
2371
  .ui.inverted.purple.button:active {
1793
- box-shadow: 0px 0px 0px 2px #aea2ff inset !important;
1794
- background-color: #aea2ff;
1795
- color: #1b1c1d;
2372
+ background-color: #cf40ff;
1796
2373
  }
1797
2374
 
1798
2375
  /* Inverted Basic */
@@ -1806,43 +2383,55 @@
1806
2383
  .ui.inverted.purple.basic.buttons .button:hover,
1807
2384
  .ui.inverted.purple.buttons .basic.button:hover,
1808
2385
  .ui.inverted.purple.basic.button:hover {
1809
- box-shadow: 0px 0px 0px 2px #cdc6ff inset !important;
1810
- color: #cdc6ff !important;
2386
+ box-shadow: 0px 0px 0px 2px #d65aff inset !important;
2387
+ color: #dc73ff !important;
2388
+ }
2389
+ .ui.inverted.purple.basic.buttons .button:focus,
2390
+ .ui.inverted.purple.basic.buttons .button:focus,
2391
+ .ui.inverted.purple.basic.button:focus {
2392
+ box-shadow: 0px 0px 0px 2px #d24aff inset !important;
2393
+ color: #dc73ff !important;
1811
2394
  }
1812
2395
  .ui.inverted.purple.basic.buttons .active.button,
1813
2396
  .ui.inverted.purple.buttons .basic.active.button,
1814
2397
  .ui.inverted.purple.basic.active.button {
1815
- box-shadow: 0px 0px 0px 2px #cdc6ff inset !important;
1816
- color: #cdc6ff !important;
2398
+ box-shadow: 0px 0px 0px 2px #d65aff inset !important;
2399
+ color: #dc73ff !important;
1817
2400
  }
1818
2401
  .ui.inverted.purple.basic.buttons .button:active,
1819
2402
  .ui.inverted.purple.buttons .basic.button:active,
1820
2403
  .ui.inverted.purple.basic.button:active {
1821
- box-shadow: 0px 0px 0px 2px #aea2ff inset !important;
1822
- color: #cdc6ff !important;
2404
+ box-shadow: 0px 0px 0px 2px #cf40ff inset !important;
2405
+ color: #dc73ff !important;
1823
2406
  }
1824
2407
 
1825
2408
  /*--- Red ---*/
1826
2409
 
1827
2410
  .ui.red.buttons .button,
1828
2411
  .ui.red.button {
1829
- background-color: #d95c5c;
2412
+ background-color: #db2828;
1830
2413
  color: #ffffff;
1831
2414
  text-shadow: none;
1832
2415
  background-image: none;
1833
2416
  }
1834
2417
  .ui.red.button {
1835
- box-shadow: 0px 0em 0px 0px rgba(39, 41, 43, 0.15) inset;
2418
+ box-shadow: 0px 0em 0px 0px rgba(34, 36, 38, 0.15) inset;
1836
2419
  }
1837
2420
  .ui.red.buttons .button:hover,
1838
2421
  .ui.red.button:hover {
1839
- background-color: #dc6868;
2422
+ background-color: #d01919;
2423
+ color: #ffffff;
2424
+ text-shadow: none;
2425
+ }
2426
+ .ui.red.buttons .button:focus,
2427
+ .ui.red.button:focus {
2428
+ background-color: #ca1010;
1840
2429
  color: #ffffff;
1841
2430
  text-shadow: none;
1842
2431
  }
1843
2432
  .ui.red.buttons .button:active,
1844
2433
  .ui.red.button:active {
1845
- background-color: #d23f3f;
2434
+ background-color: #b21e1e;
1846
2435
  color: #ffffff;
1847
2436
  text-shadow: none;
1848
2437
  }
@@ -1850,7 +2439,7 @@
1850
2439
  .ui.red.buttons .active.button:active,
1851
2440
  .ui.red.active.button,
1852
2441
  .ui.red.button .active.button:active {
1853
- background-color: #d44747;
2442
+ background-color: #d41515;
1854
2443
  color: #ffffff;
1855
2444
  text-shadow: none;
1856
2445
  }
@@ -1858,27 +2447,32 @@
1858
2447
  /* Basic */
1859
2448
  .ui.basic.red.buttons .button,
1860
2449
  .ui.basic.red.button {
1861
- box-shadow: 0px 0px 0px 2px rgba(39, 41, 43, 0.15) inset !important;
2450
+ box-shadow: 0px 0px 0px 1px rgba(34, 36, 38, 0.15) inset !important;
1862
2451
  color: rgba(0, 0, 0, 0.6) !important;
1863
2452
  }
1864
2453
  .ui.basic.red.buttons .button:hover,
1865
2454
  .ui.basic.red.button:hover {
1866
2455
  background: transparent !important;
1867
- box-shadow: 0px 0px 0px 2px #dc6868 inset !important;
1868
- color: #dc6868 !important;
2456
+ box-shadow: 0px 0px 0px 2px #d01919 inset !important;
2457
+ color: #d01919 !important;
1869
2458
  }
1870
- .ui.basic.red.buttons .button:active,
1871
- .ui.basic.red.button:active {
1872
- box-shadow: 0px 0px 0px 2px #d23f3f inset !important;
1873
- color: #d23f3f !important;
2459
+ .ui.basic.red.buttons .button:focus,
2460
+ .ui.basic.red.button:focus {
2461
+ background: transparent !important;
2462
+ box-shadow: 0px 0px 0px 2px #ca1010 inset !important;
1874
2463
  }
1875
2464
  .ui.basic.red.buttons .active.button,
1876
2465
  .ui.basic.red.active.button {
1877
2466
  background: transparent !important;
1878
- box-shadow: 0px 0px 0px 2px #d23f3f inset !important;
1879
- color: #d23f3f !important;
2467
+ box-shadow: 0px 0px 0px 2px #d41515 inset !important;
2468
+ color: #b21e1e !important;
1880
2469
  }
1881
- .ui.buttons > .basic.red.button:not(:first-child) {
2470
+ .ui.basic.red.buttons .button:active,
2471
+ .ui.basic.red.button:active {
2472
+ box-shadow: 0px 0px 0px 2px #b21e1e inset !important;
2473
+ color: #b21e1e !important;
2474
+ }
2475
+ .ui.buttons:not(.vertical) > .basic.red.button:not(:first-child) {
1882
2476
  margin-left: -2px;
1883
2477
  }
1884
2478
 
@@ -1890,22 +2484,31 @@
1890
2484
  color: #ff695e;
1891
2485
  }
1892
2486
  .ui.inverted.red.buttons .button:hover,
1893
- .ui.inverted.red.button:hover {
1894
- box-shadow: 0px 0px 0px 2px #ff695e inset !important;
1895
- background-color: #ff695e;
2487
+ .ui.inverted.red.button:hover,
2488
+ .ui.inverted.red.buttons .button:focus,
2489
+ .ui.inverted.red.button:focus,
2490
+ .ui.inverted.red.buttons .button.active,
2491
+ .ui.inverted.red.button.active,
2492
+ .ui.inverted.red.buttons .button:active,
2493
+ .ui.inverted.red.button:active {
2494
+ box-shadow: none !important;
1896
2495
  color: #ffffff;
1897
2496
  }
2497
+ .ui.inverted.red.buttons .button:hover,
2498
+ .ui.inverted.red.button:hover {
2499
+ background-color: #ff5144;
2500
+ }
2501
+ .ui.inverted.red.buttons .button:focus,
2502
+ .ui.inverted.red.button:focus {
2503
+ background-color: #ff4335;
2504
+ }
1898
2505
  .ui.inverted.red.buttons .active.button,
1899
2506
  .ui.inverted.red.active.button {
1900
- box-shadow: 0px 0px 0px 2px #ff695e inset !important;
1901
- background-color: #ff695e;
1902
- color: #ffffff;
2507
+ background-color: #ff5144;
1903
2508
  }
1904
2509
  .ui.inverted.red.buttons .button:active,
1905
2510
  .ui.inverted.red.button:active {
1906
- box-shadow: 0px 0px 0px 2px #ff483a inset !important;
1907
- background-color: #ff483a;
1908
- color: #ffffff;
2511
+ background-color: #ff392b;
1909
2512
  }
1910
2513
 
1911
2514
  /* Inverted Basic */
@@ -1919,19 +2522,25 @@
1919
2522
  .ui.inverted.red.basic.buttons .button:hover,
1920
2523
  .ui.inverted.red.buttons .basic.button:hover,
1921
2524
  .ui.inverted.red.basic.button:hover {
1922
- box-shadow: 0px 0px 0px 2px #ff695e inset !important;
2525
+ box-shadow: 0px 0px 0px 2px #ff5144 inset !important;
2526
+ color: #ff695e !important;
2527
+ }
2528
+ .ui.inverted.red.basic.buttons .button:focus,
2529
+ .ui.inverted.red.basic.buttons .button:focus,
2530
+ .ui.inverted.red.basic.button:focus {
2531
+ box-shadow: 0px 0px 0px 2px #ff4335 inset !important;
1923
2532
  color: #ff695e !important;
1924
2533
  }
1925
2534
  .ui.inverted.red.basic.buttons .active.button,
1926
2535
  .ui.inverted.red.buttons .basic.active.button,
1927
2536
  .ui.inverted.red.basic.active.button {
1928
- box-shadow: 0px 0px 0px 2px #ff695e inset !important;
2537
+ box-shadow: 0px 0px 0px 2px #ff5144 inset !important;
1929
2538
  color: #ff695e !important;
1930
2539
  }
1931
2540
  .ui.inverted.red.basic.buttons .button:active,
1932
2541
  .ui.inverted.red.buttons .basic.button:active,
1933
2542
  .ui.inverted.red.basic.button:active {
1934
- box-shadow: 0px 0px 0px 2px #ff483a inset !important;
2543
+ box-shadow: 0px 0px 0px 2px #ff392b inset !important;
1935
2544
  color: #ff695e !important;
1936
2545
  }
1937
2546
 
@@ -1945,17 +2554,23 @@
1945
2554
  background-image: none;
1946
2555
  }
1947
2556
  .ui.teal.button {
1948
- box-shadow: 0px 0em 0px 0px rgba(39, 41, 43, 0.15) inset;
2557
+ box-shadow: 0px 0em 0px 0px rgba(34, 36, 38, 0.15) inset;
1949
2558
  }
1950
2559
  .ui.teal.buttons .button:hover,
1951
2560
  .ui.teal.button:hover {
1952
- background-color: #00c4bc;
2561
+ background-color: #009c95;
2562
+ color: #ffffff;
2563
+ text-shadow: none;
2564
+ }
2565
+ .ui.teal.buttons .button:focus,
2566
+ .ui.teal.button:focus {
2567
+ background-color: #008c86;
1953
2568
  color: #ffffff;
1954
2569
  text-shadow: none;
1955
2570
  }
1956
2571
  .ui.teal.buttons .button:active,
1957
2572
  .ui.teal.button:active {
1958
- background-color: #00918b;
2573
+ background-color: #00827c;
1959
2574
  color: #ffffff;
1960
2575
  text-shadow: none;
1961
2576
  }
@@ -1971,27 +2586,32 @@
1971
2586
  /* Basic */
1972
2587
  .ui.basic.teal.buttons .button,
1973
2588
  .ui.basic.teal.button {
1974
- box-shadow: 0px 0px 0px 2px rgba(39, 41, 43, 0.15) inset !important;
2589
+ box-shadow: 0px 0px 0px 1px rgba(34, 36, 38, 0.15) inset !important;
1975
2590
  color: rgba(0, 0, 0, 0.6) !important;
1976
2591
  }
1977
2592
  .ui.basic.teal.buttons .button:hover,
1978
2593
  .ui.basic.teal.button:hover {
1979
2594
  background: transparent !important;
1980
- box-shadow: 0px 0px 0px 2px #00c4bc inset !important;
1981
- color: #00c4bc !important;
2595
+ box-shadow: 0px 0px 0px 2px #009c95 inset !important;
2596
+ color: #009c95 !important;
1982
2597
  }
1983
- .ui.basic.teal.buttons .button:active,
1984
- .ui.basic.teal.button:active {
1985
- box-shadow: 0px 0px 0px 2px #00918b inset !important;
1986
- color: #00918b !important;
2598
+ .ui.basic.teal.buttons .button:focus,
2599
+ .ui.basic.teal.button:focus {
2600
+ background: transparent !important;
2601
+ box-shadow: 0px 0px 0px 2px #008c86 inset !important;
1987
2602
  }
1988
2603
  .ui.basic.teal.buttons .active.button,
1989
2604
  .ui.basic.teal.active.button {
1990
2605
  background: transparent !important;
1991
- box-shadow: 0px 0px 0px 2px #00918b inset !important;
1992
- color: #00918b !important;
2606
+ box-shadow: 0px 0px 0px 2px #009c95 inset !important;
2607
+ color: #00827c !important;
2608
+ }
2609
+ .ui.basic.teal.buttons .button:active,
2610
+ .ui.basic.teal.button:active {
2611
+ box-shadow: 0px 0px 0px 2px #00827c inset !important;
2612
+ color: #00827c !important;
1993
2613
  }
1994
- .ui.buttons > .basic.teal.button:not(:first-child) {
2614
+ .ui.buttons:not(.vertical) > .basic.teal.button:not(:first-child) {
1995
2615
  margin-left: -2px;
1996
2616
  }
1997
2617
 
@@ -2003,22 +2623,31 @@
2003
2623
  color: #6dffff;
2004
2624
  }
2005
2625
  .ui.inverted.teal.buttons .button:hover,
2626
+ .ui.inverted.teal.button:hover,
2627
+ .ui.inverted.teal.buttons .button:focus,
2628
+ .ui.inverted.teal.button:focus,
2629
+ .ui.inverted.teal.buttons .button.active,
2630
+ .ui.inverted.teal.button.active,
2631
+ .ui.inverted.teal.buttons .button:active,
2632
+ .ui.inverted.teal.button:active {
2633
+ box-shadow: none !important;
2634
+ color: rgba(0, 0, 0, 0.6);
2635
+ }
2636
+ .ui.inverted.teal.buttons .button:hover,
2006
2637
  .ui.inverted.teal.button:hover {
2007
- box-shadow: 0px 0px 0px 2px #6dffff inset !important;
2008
- background-color: #6dffff;
2009
- color: #1b1c1d;
2638
+ background-color: #54ffff;
2639
+ }
2640
+ .ui.inverted.teal.buttons .button:focus,
2641
+ .ui.inverted.teal.button:focus {
2642
+ background-color: #44ffff;
2010
2643
  }
2011
2644
  .ui.inverted.teal.buttons .active.button,
2012
2645
  .ui.inverted.teal.active.button {
2013
- box-shadow: 0px 0px 0px 2px #6dffff inset !important;
2014
- background-color: #6dffff;
2015
- color: #1b1c1d;
2646
+ background-color: #54ffff;
2016
2647
  }
2017
2648
  .ui.inverted.teal.buttons .button:active,
2018
2649
  .ui.inverted.teal.button:active {
2019
- box-shadow: 0px 0px 0px 2px #49ffff inset !important;
2020
- background-color: #49ffff;
2021
- color: #1b1c1d;
2650
+ background-color: #3affff;
2022
2651
  }
2023
2652
 
2024
2653
  /* Inverted Basic */
@@ -2032,43 +2661,194 @@
2032
2661
  .ui.inverted.teal.basic.buttons .button:hover,
2033
2662
  .ui.inverted.teal.buttons .basic.button:hover,
2034
2663
  .ui.inverted.teal.basic.button:hover {
2035
- box-shadow: 0px 0px 0px 2px #6dffff inset !important;
2664
+ box-shadow: 0px 0px 0px 2px #54ffff inset !important;
2665
+ color: #6dffff !important;
2666
+ }
2667
+ .ui.inverted.teal.basic.buttons .button:focus,
2668
+ .ui.inverted.teal.basic.buttons .button:focus,
2669
+ .ui.inverted.teal.basic.button:focus {
2670
+ box-shadow: 0px 0px 0px 2px #44ffff inset !important;
2036
2671
  color: #6dffff !important;
2037
2672
  }
2038
2673
  .ui.inverted.teal.basic.buttons .active.button,
2039
2674
  .ui.inverted.teal.buttons .basic.active.button,
2040
2675
  .ui.inverted.teal.basic.active.button {
2041
- box-shadow: 0px 0px 0px 2px #6dffff inset !important;
2676
+ box-shadow: 0px 0px 0px 2px #54ffff inset !important;
2042
2677
  color: #6dffff !important;
2043
2678
  }
2044
2679
  .ui.inverted.teal.basic.buttons .button:active,
2045
2680
  .ui.inverted.teal.buttons .basic.button:active,
2046
2681
  .ui.inverted.teal.basic.button:active {
2047
- box-shadow: 0px 0px 0px 2px #49ffff inset !important;
2682
+ box-shadow: 0px 0px 0px 2px #3affff inset !important;
2048
2683
  color: #6dffff !important;
2049
2684
  }
2050
2685
 
2686
+ /*--- Olive ---*/
2687
+
2688
+ .ui.olive.buttons .button,
2689
+ .ui.olive.button {
2690
+ background-color: #b5cc18;
2691
+ color: #ffffff;
2692
+ text-shadow: none;
2693
+ background-image: none;
2694
+ }
2695
+ .ui.olive.button {
2696
+ box-shadow: 0px 0em 0px 0px rgba(34, 36, 38, 0.15) inset;
2697
+ }
2698
+ .ui.olive.buttons .button:hover,
2699
+ .ui.olive.button:hover {
2700
+ background-color: #a7bd0d;
2701
+ color: #ffffff;
2702
+ text-shadow: none;
2703
+ }
2704
+ .ui.olive.buttons .button:focus,
2705
+ .ui.olive.button:focus {
2706
+ background-color: #a0b605;
2707
+ color: #ffffff;
2708
+ text-shadow: none;
2709
+ }
2710
+ .ui.olive.buttons .button:active,
2711
+ .ui.olive.button:active {
2712
+ background-color: #8d9e13;
2713
+ color: #ffffff;
2714
+ text-shadow: none;
2715
+ }
2716
+ .ui.olive.buttons .active.button,
2717
+ .ui.olive.buttons .active.button:active,
2718
+ .ui.olive.active.button,
2719
+ .ui.olive.button .active.button:active {
2720
+ background-color: #aac109;
2721
+ color: #ffffff;
2722
+ text-shadow: none;
2723
+ }
2724
+
2725
+ /* Basic */
2726
+ .ui.basic.olive.buttons .button,
2727
+ .ui.basic.olive.button {
2728
+ box-shadow: 0px 0px 0px 1px rgba(34, 36, 38, 0.15) inset !important;
2729
+ color: rgba(0, 0, 0, 0.6) !important;
2730
+ }
2731
+ .ui.basic.olive.buttons .button:hover,
2732
+ .ui.basic.olive.button:hover {
2733
+ background: transparent !important;
2734
+ box-shadow: 0px 0px 0px 2px #a7bd0d inset !important;
2735
+ color: #a7bd0d !important;
2736
+ }
2737
+ .ui.basic.olive.buttons .button:focus,
2738
+ .ui.basic.olive.button:focus {
2739
+ background: transparent !important;
2740
+ box-shadow: 0px 0px 0px 2px #a0b605 inset !important;
2741
+ }
2742
+ .ui.basic.olive.buttons .active.button,
2743
+ .ui.basic.olive.active.button {
2744
+ background: transparent !important;
2745
+ box-shadow: 0px 0px 0px 2px #aac109 inset !important;
2746
+ color: #8d9e13 !important;
2747
+ }
2748
+ .ui.basic.olive.buttons .button:active,
2749
+ .ui.basic.olive.button:active {
2750
+ box-shadow: 0px 0px 0px 2px #8d9e13 inset !important;
2751
+ color: #8d9e13 !important;
2752
+ }
2753
+ .ui.buttons:not(.vertical) > .basic.olive.button:not(:first-child) {
2754
+ margin-left: -2px;
2755
+ }
2756
+
2757
+ /* Inverted */
2758
+ .ui.inverted.olive.buttons .button,
2759
+ .ui.inverted.olive.button {
2760
+ background-color: transparent;
2761
+ box-shadow: 0px 0px 0px 2px #d9e778 inset !important;
2762
+ color: #d9e778;
2763
+ }
2764
+ .ui.inverted.olive.buttons .button:hover,
2765
+ .ui.inverted.olive.button:hover,
2766
+ .ui.inverted.olive.buttons .button:focus,
2767
+ .ui.inverted.olive.button:focus,
2768
+ .ui.inverted.olive.buttons .button.active,
2769
+ .ui.inverted.olive.button.active,
2770
+ .ui.inverted.olive.buttons .button:active,
2771
+ .ui.inverted.olive.button:active {
2772
+ box-shadow: none !important;
2773
+ color: rgba(0, 0, 0, 0.6);
2774
+ }
2775
+ .ui.inverted.olive.buttons .button:hover,
2776
+ .ui.inverted.olive.button:hover {
2777
+ background-color: #d8ea5c;
2778
+ }
2779
+ .ui.inverted.olive.buttons .button:focus,
2780
+ .ui.inverted.olive.button:focus {
2781
+ background-color: #daef47;
2782
+ }
2783
+ .ui.inverted.olive.buttons .active.button,
2784
+ .ui.inverted.olive.active.button {
2785
+ background-color: #daed59;
2786
+ }
2787
+ .ui.inverted.olive.buttons .button:active,
2788
+ .ui.inverted.olive.button:active {
2789
+ background-color: #cddf4d;
2790
+ }
2791
+
2792
+ /* Inverted Basic */
2793
+ .ui.inverted.olive.basic.buttons .button,
2794
+ .ui.inverted.olive.buttons .basic.button,
2795
+ .ui.inverted.olive.basic.button {
2796
+ background-color: transparent;
2797
+ box-shadow: 0px 0px 0px 2px rgba(255, 255, 255, 0.5) inset !important;
2798
+ color: #ffffff !important;
2799
+ }
2800
+ .ui.inverted.olive.basic.buttons .button:hover,
2801
+ .ui.inverted.olive.buttons .basic.button:hover,
2802
+ .ui.inverted.olive.basic.button:hover {
2803
+ box-shadow: 0px 0px 0px 2px #d8ea5c inset !important;
2804
+ color: #d9e778 !important;
2805
+ }
2806
+ .ui.inverted.olive.basic.buttons .button:focus,
2807
+ .ui.inverted.olive.basic.buttons .button:focus,
2808
+ .ui.inverted.olive.basic.button:focus {
2809
+ box-shadow: 0px 0px 0px 2px #daef47 inset !important;
2810
+ color: #d9e778 !important;
2811
+ }
2812
+ .ui.inverted.olive.basic.buttons .active.button,
2813
+ .ui.inverted.olive.buttons .basic.active.button,
2814
+ .ui.inverted.olive.basic.active.button {
2815
+ box-shadow: 0px 0px 0px 2px #daed59 inset !important;
2816
+ color: #d9e778 !important;
2817
+ }
2818
+ .ui.inverted.olive.basic.buttons .button:active,
2819
+ .ui.inverted.olive.buttons .basic.button:active,
2820
+ .ui.inverted.olive.basic.button:active {
2821
+ box-shadow: 0px 0px 0px 2px #cddf4d inset !important;
2822
+ color: #d9e778 !important;
2823
+ }
2824
+
2051
2825
  /*--- Yellow ---*/
2052
2826
 
2053
2827
  .ui.yellow.buttons .button,
2054
2828
  .ui.yellow.button {
2055
- background-color: #f2c61f;
2829
+ background-color: #fbbd08;
2056
2830
  color: #ffffff;
2057
2831
  text-shadow: none;
2058
2832
  background-image: none;
2059
2833
  }
2060
2834
  .ui.yellow.button {
2061
- box-shadow: 0px 0em 0px 0px rgba(39, 41, 43, 0.15) inset;
2835
+ box-shadow: 0px 0em 0px 0px rgba(34, 36, 38, 0.15) inset;
2062
2836
  }
2063
2837
  .ui.yellow.buttons .button:hover,
2064
2838
  .ui.yellow.button:hover {
2065
- background-color: #f3ca2d;
2839
+ background-color: #eaae00;
2840
+ color: #ffffff;
2841
+ text-shadow: none;
2842
+ }
2843
+ .ui.yellow.buttons .button:focus,
2844
+ .ui.yellow.button:focus {
2845
+ background-color: #daa300;
2066
2846
  color: #ffffff;
2067
2847
  text-shadow: none;
2068
2848
  }
2069
2849
  .ui.yellow.buttons .button:active,
2070
2850
  .ui.yellow.button:active {
2071
- background-color: #e0b40d;
2851
+ background-color: #cd9903;
2072
2852
  color: #ffffff;
2073
2853
  text-shadow: none;
2074
2854
  }
@@ -2076,7 +2856,7 @@
2076
2856
  .ui.yellow.buttons .active.button:active,
2077
2857
  .ui.yellow.active.button,
2078
2858
  .ui.yellow.button .active.button:active {
2079
- background-color: #eabc0e;
2859
+ background-color: #eaae00;
2080
2860
  color: #ffffff;
2081
2861
  text-shadow: none;
2082
2862
  }
@@ -2084,27 +2864,32 @@
2084
2864
  /* Basic */
2085
2865
  .ui.basic.yellow.buttons .button,
2086
2866
  .ui.basic.yellow.button {
2087
- box-shadow: 0px 0px 0px 2px rgba(39, 41, 43, 0.15) inset !important;
2867
+ box-shadow: 0px 0px 0px 1px rgba(34, 36, 38, 0.15) inset !important;
2088
2868
  color: rgba(0, 0, 0, 0.6) !important;
2089
2869
  }
2090
2870
  .ui.basic.yellow.buttons .button:hover,
2091
2871
  .ui.basic.yellow.button:hover {
2092
2872
  background: transparent !important;
2093
- box-shadow: 0px 0px 0px 2px #f3ca2d inset !important;
2094
- color: #f3ca2d !important;
2873
+ box-shadow: 0px 0px 0px 2px #eaae00 inset !important;
2874
+ color: #eaae00 !important;
2095
2875
  }
2096
- .ui.basic.yellow.buttons .button:active,
2097
- .ui.basic.yellow.button:active {
2098
- box-shadow: 0px 0px 0px 2px #e0b40d inset !important;
2099
- color: #e0b40d !important;
2876
+ .ui.basic.yellow.buttons .button:focus,
2877
+ .ui.basic.yellow.button:focus {
2878
+ background: transparent !important;
2879
+ box-shadow: 0px 0px 0px 2px #daa300 inset !important;
2100
2880
  }
2101
2881
  .ui.basic.yellow.buttons .active.button,
2102
2882
  .ui.basic.yellow.active.button {
2103
2883
  background: transparent !important;
2104
- box-shadow: 0px 0px 0px 2px #e0b40d inset !important;
2105
- color: #e0b40d !important;
2884
+ box-shadow: 0px 0px 0px 2px #eaae00 inset !important;
2885
+ color: #cd9903 !important;
2106
2886
  }
2107
- .ui.buttons > .basic.yellow.button:not(:first-child) {
2887
+ .ui.basic.yellow.buttons .button:active,
2888
+ .ui.basic.yellow.button:active {
2889
+ box-shadow: 0px 0px 0px 2px #cd9903 inset !important;
2890
+ color: #cd9903 !important;
2891
+ }
2892
+ .ui.buttons:not(.vertical) > .basic.yellow.button:not(:first-child) {
2108
2893
  margin-left: -2px;
2109
2894
  }
2110
2895
 
@@ -2116,22 +2901,31 @@
2116
2901
  color: #ffe21f;
2117
2902
  }
2118
2903
  .ui.inverted.yellow.buttons .button:hover,
2904
+ .ui.inverted.yellow.button:hover,
2905
+ .ui.inverted.yellow.buttons .button:focus,
2906
+ .ui.inverted.yellow.button:focus,
2907
+ .ui.inverted.yellow.buttons .button.active,
2908
+ .ui.inverted.yellow.button.active,
2909
+ .ui.inverted.yellow.buttons .button:active,
2910
+ .ui.inverted.yellow.button:active {
2911
+ box-shadow: none !important;
2912
+ color: rgba(0, 0, 0, 0.6);
2913
+ }
2914
+ .ui.inverted.yellow.buttons .button:hover,
2119
2915
  .ui.inverted.yellow.button:hover {
2120
- box-shadow: 0px 0px 0px 2px #ffe21f inset !important;
2121
- background-color: #ffe21f;
2122
- color: #1b1c1d;
2916
+ background-color: #ffdf05;
2917
+ }
2918
+ .ui.inverted.yellow.buttons .button:focus,
2919
+ .ui.inverted.yellow.button:focus {
2920
+ background-color: #f5d500;
2123
2921
  }
2124
2922
  .ui.inverted.yellow.buttons .active.button,
2125
2923
  .ui.inverted.yellow.active.button {
2126
- box-shadow: 0px 0px 0px 2px #ffe21f inset !important;
2127
- background-color: #ffe21f;
2128
- color: #1b1c1d;
2924
+ background-color: #ffdf05;
2129
2925
  }
2130
2926
  .ui.inverted.yellow.buttons .button:active,
2131
2927
  .ui.inverted.yellow.button:active {
2132
- box-shadow: 0px 0px 0px 2px #fada00 inset !important;
2133
- background-color: #fada00;
2134
- color: #1b1c1d;
2928
+ background-color: #ebcd00;
2135
2929
  }
2136
2930
 
2137
2931
  /* Inverted Basic */
@@ -2145,19 +2939,25 @@
2145
2939
  .ui.inverted.yellow.basic.buttons .button:hover,
2146
2940
  .ui.inverted.yellow.buttons .basic.button:hover,
2147
2941
  .ui.inverted.yellow.basic.button:hover {
2148
- box-shadow: 0px 0px 0px 2px #ffe21f inset !important;
2942
+ box-shadow: 0px 0px 0px 2px #ffdf05 inset !important;
2943
+ color: #ffe21f !important;
2944
+ }
2945
+ .ui.inverted.yellow.basic.buttons .button:focus,
2946
+ .ui.inverted.yellow.basic.buttons .button:focus,
2947
+ .ui.inverted.yellow.basic.button:focus {
2948
+ box-shadow: 0px 0px 0px 2px #f5d500 inset !important;
2149
2949
  color: #ffe21f !important;
2150
2950
  }
2151
2951
  .ui.inverted.yellow.basic.buttons .active.button,
2152
2952
  .ui.inverted.yellow.buttons .basic.active.button,
2153
2953
  .ui.inverted.yellow.basic.active.button {
2154
- box-shadow: 0px 0px 0px 2px #ffe21f inset !important;
2954
+ box-shadow: 0px 0px 0px 2px #ffdf05 inset !important;
2155
2955
  color: #ffe21f !important;
2156
2956
  }
2157
2957
  .ui.inverted.yellow.basic.buttons .button:active,
2158
2958
  .ui.inverted.yellow.buttons .basic.button:active,
2159
2959
  .ui.inverted.yellow.basic.button:active {
2160
- box-shadow: 0px 0px 0px 2px #fada00 inset !important;
2960
+ box-shadow: 0px 0px 0px 2px #ebcd00 inset !important;
2161
2961
  color: #ffe21f !important;
2162
2962
  }
2163
2963
 
@@ -2167,29 +2967,35 @@
2167
2967
 
2168
2968
  .ui.primary.buttons .button,
2169
2969
  .ui.primary.button {
2170
- background-color: #3b83c0;
2970
+ background-color: #2185d0;
2171
2971
  color: #ffffff;
2172
2972
  text-shadow: none;
2173
2973
  background-image: none;
2174
2974
  }
2175
2975
  .ui.primary.button {
2176
- box-shadow: 0px 0em 0px 0px rgba(39, 41, 43, 0.15) inset;
2976
+ box-shadow: 0px 0em 0px 0px rgba(34, 36, 38, 0.15) inset;
2177
2977
  }
2178
2978
  .ui.primary.buttons .button:hover,
2179
2979
  .ui.primary.button:hover {
2180
- background-color: #458ac6;
2980
+ background-color: #1678c2;
2981
+ color: #ffffff;
2982
+ text-shadow: none;
2983
+ }
2984
+ .ui.primary.buttons .button:focus,
2985
+ .ui.primary.button:focus {
2986
+ background-color: #0d71bb;
2181
2987
  color: #ffffff;
2182
2988
  text-shadow: none;
2183
2989
  }
2184
2990
  .ui.primary.buttons .button:active,
2185
2991
  .ui.primary.button:active {
2186
- background-color: #3370a5;
2992
+ background-color: #1a69a4;
2187
2993
  color: #ffffff;
2188
2994
  text-shadow: none;
2189
2995
  }
2190
2996
  .ui.primary.buttons .active.button,
2191
2997
  .ui.primary.active.button {
2192
- background-color: #3576ac;
2998
+ background-color: #1279c6;
2193
2999
  color: #ffffff;
2194
3000
  text-shadow: none;
2195
3001
  }
@@ -2206,23 +3012,29 @@
2206
3012
  background-image: none;
2207
3013
  }
2208
3014
  .ui.secondary.button {
2209
- box-shadow: 0px 0em 0px 0px rgba(39, 41, 43, 0.15) inset;
3015
+ box-shadow: 0px 0em 0px 0px rgba(34, 36, 38, 0.15) inset;
2210
3016
  }
2211
3017
  .ui.secondary.buttons .button:hover,
2212
3018
  .ui.secondary.button:hover {
2213
- background-color: #222425;
3019
+ background-color: #27292a;
3020
+ color: #ffffff;
3021
+ text-shadow: none;
3022
+ }
3023
+ .ui.secondary.buttons .button:focus,
3024
+ .ui.secondary.button:focus {
3025
+ background-color: #2e3032;
2214
3026
  color: #ffffff;
2215
3027
  text-shadow: none;
2216
3028
  }
2217
3029
  .ui.secondary.buttons .button:active,
2218
3030
  .ui.secondary.button:active {
2219
- background-color: #0a0a0b;
3031
+ background-color: #343637;
2220
3032
  color: #ffffff;
2221
3033
  text-shadow: none;
2222
3034
  }
2223
3035
  .ui.secondary.buttons .active.button,
2224
3036
  .ui.secondary.active.button {
2225
- background-color: #0f0f10;
3037
+ background-color: #27292a;
2226
3038
  color: #ffffff;
2227
3039
  text-shadow: none;
2228
3040
  }
@@ -2233,33 +3045,36 @@
2233
3045
 
2234
3046
  .ui.positive.buttons .button,
2235
3047
  .ui.positive.button {
2236
- background-color: #5bbd72 !important;
3048
+ background-color: #21ba45 !important;
2237
3049
  color: #ffffff;
2238
3050
  text-shadow: none;
2239
3051
  background-image: none;
2240
3052
  }
2241
3053
  .ui.positive.button {
2242
- box-shadow: 0px 0em 0px 0px rgba(39, 41, 43, 0.15) inset;
3054
+ box-shadow: 0px 0em 0px 0px rgba(34, 36, 38, 0.15) inset;
2243
3055
  }
2244
3056
  .ui.positive.buttons .button:hover,
2245
- .ui.positive.button:hover,
2246
- .ui.positive.buttons .active.button,
2247
- .ui.positive.active.button {
2248
- background-color: #66c17b !important;
3057
+ .ui.positive.button:hover {
3058
+ background-color: #16ab39 !important;
3059
+ color: #ffffff;
3060
+ text-shadow: none;
3061
+ }
3062
+ .ui.positive.buttons .button:focus,
3063
+ .ui.positive.button:focus {
3064
+ background-color: #0ea432 !important;
2249
3065
  color: #ffffff;
2250
3066
  text-shadow: none;
2251
3067
  }
2252
3068
  .ui.positive.buttons .button:active,
2253
3069
  .ui.positive.button:active {
2254
- background-color: #46ae5f !important;
3070
+ background-color: #198f35 !important;
2255
3071
  color: #ffffff;
2256
3072
  text-shadow: none;
2257
3073
  }
2258
3074
  .ui.positive.buttons .active.button,
2259
- .ui.positive.buttons .active.button:active,
2260
3075
  .ui.positive.active.button,
2261
- .ui.positive.button .active.button:active {
2262
- background-color: #49b562;
3076
+ .ui.positive.buttons .active.button:active {
3077
+ background-color: #13ae38;
2263
3078
  color: #ffffff;
2264
3079
  text-shadow: none;
2265
3080
  }
@@ -2270,33 +3085,36 @@
2270
3085
 
2271
3086
  .ui.negative.buttons .button,
2272
3087
  .ui.negative.button {
2273
- background-color: #d95c5c !important;
3088
+ background-color: #db2828 !important;
2274
3089
  color: #ffffff;
2275
3090
  text-shadow: none;
2276
3091
  background-image: none;
2277
3092
  }
2278
3093
  .ui.negative.button {
2279
- box-shadow: 0px 0em 0px 0px rgba(39, 41, 43, 0.15) inset;
3094
+ box-shadow: 0px 0em 0px 0px rgba(34, 36, 38, 0.15) inset;
2280
3095
  }
2281
3096
  .ui.negative.buttons .button:hover,
2282
- .ui.negative.button:hover,
2283
- .ui.negative.buttons .active.button,
2284
- .ui.negative.active.button {
2285
- background-color: #dc6868 !important;
3097
+ .ui.negative.button:hover {
3098
+ background-color: #d01919 !important;
3099
+ color: #ffffff;
3100
+ text-shadow: none;
3101
+ }
3102
+ .ui.negative.buttons .button:focus,
3103
+ .ui.negative.button:focus {
3104
+ background-color: #ca1010 !important;
2286
3105
  color: #ffffff;
2287
3106
  text-shadow: none;
2288
3107
  }
2289
3108
  .ui.negative.buttons .button:active,
2290
3109
  .ui.negative.button:active {
2291
- background-color: #d23f3f !important;
3110
+ background-color: #b21e1e !important;
2292
3111
  color: #ffffff;
2293
3112
  text-shadow: none;
2294
3113
  }
2295
3114
  .ui.negative.buttons .active.button,
2296
- .ui.negative.buttons .active.button:active,
2297
3115
  .ui.negative.active.button,
2298
- .ui.negative.button .active.button:active {
2299
- background-color: #d44747;
3116
+ .ui.negative.buttons .active.button:active {
3117
+ background-color: #d41515;
2300
3118
  color: #ffffff;
2301
3119
  text-shadow: none;
2302
3120
  }
@@ -2307,14 +3125,24 @@
2307
3125
  *******************************/
2308
3126
 
2309
3127
  .ui.buttons {
2310
- display: inline-block;
2311
- vertical-align: middle;
3128
+ display: -webkit-inline-box;
3129
+ display: -webkit-inline-flex;
3130
+ display: -ms-inline-flexbox;
3131
+ display: inline-flex;
3132
+ -webkit-box-orient: horizontal;
3133
+ -webkit-box-direction: normal;
3134
+ -webkit-flex-direction: row;
3135
+ -ms-flex-direction: row;
3136
+ flex-direction: row;
3137
+ font-size: 0em;
3138
+ vertical-align: baseline;
2312
3139
  margin: 0em 0.25em 0em 0em;
2313
3140
  }
2314
- .ui.buttons > .button:hover,
2315
- .ui.buttons > .active.button {
2316
- position: relative;
3141
+ .ui.buttons:not(.basic):not(.inverted) {
3142
+ box-shadow: none;
2317
3143
  }
3144
+
3145
+ /* Clearfix */
2318
3146
  .ui.buttons:after {
2319
3147
  content: ".";
2320
3148
  display: block;
@@ -2322,35 +3150,43 @@
2322
3150
  clear: both;
2323
3151
  visibility: hidden;
2324
3152
  }
2325
- .ui.buttons .button:first-child {
2326
- border-left: none;
2327
- }
2328
- .ui.buttons:not(.basic):not(.inverted) {
2329
- box-shadow: none;
2330
- }
2331
- .ui.buttons > .ui.button:not(.basic):not(.inverted),
2332
- .ui.buttons:not(.basic):not(.inverted) > .button {
2333
- box-shadow: 0px 0px 0px 1px transparent inset, 0px 0em 0px 0px rgba(39, 41, 43, 0.15) inset;
2334
- }
3153
+
3154
+ /* Standard Group */
2335
3155
  .ui.buttons .button {
3156
+ -webkit-box-flex: 1;
3157
+ -webkit-flex: 1 0 auto;
3158
+ -ms-flex: 1 0 auto;
3159
+ flex: 1 0 auto;
2336
3160
  margin: 0em;
2337
- float: left;
2338
3161
  border-radius: 0em;
2339
3162
  margin: 0px 0px 0px 0px;
2340
3163
  }
3164
+ .ui.buttons > .ui.button:not(.basic):not(.inverted),
3165
+ .ui.buttons:not(.basic):not(.inverted) > .button {
3166
+ box-shadow: 0px 0px 0px 1px transparent inset, 0px 0em 0px 0px rgba(34, 36, 38, 0.15) inset;
3167
+ }
2341
3168
  .ui.buttons .button:first-child {
3169
+ border-left: none;
2342
3170
  margin-left: 0em;
2343
- border-top-left-radius: 0.2857rem;
2344
- border-bottom-left-radius: 0.2857rem;
3171
+ border-top-left-radius: 0.28571429rem;
3172
+ border-bottom-left-radius: 0.28571429rem;
2345
3173
  }
2346
3174
  .ui.buttons .button:last-child {
2347
- border-top-right-radius: 0.2857rem;
2348
- border-bottom-right-radius: 0.2857rem;
3175
+ border-top-right-radius: 0.28571429rem;
3176
+ border-bottom-right-radius: 0.28571429rem;
2349
3177
  }
2350
3178
 
2351
3179
  /* Vertical Style */
2352
3180
  .ui.vertical.buttons {
2353
- display: inline-block;
3181
+ display: -webkit-inline-box;
3182
+ display: -webkit-inline-flex;
3183
+ display: -ms-inline-flexbox;
3184
+ display: inline-flex;
3185
+ -webkit-box-orient: vertical;
3186
+ -webkit-box-direction: normal;
3187
+ -webkit-flex-direction: column;
3188
+ -ms-flex-direction: column;
3189
+ flex-direction: column;
2354
3190
  }
2355
3191
  .ui.vertical.buttons .button {
2356
3192
  display: block;
@@ -2365,7 +3201,7 @@
2365
3201
  .ui.vertical.buttons .small.button:first-child,
2366
3202
  .ui.vertical.buttons .massive.button:first-child,
2367
3203
  .ui.vertical.buttons .huge.button:first-child {
2368
- border-radius: 0.2857rem 0.2857rem 0px 0px;
3204
+ border-radius: 0.28571429rem 0.28571429rem 0px 0px;
2369
3205
  }
2370
3206
  .ui.vertical.buttons .button:last-child,
2371
3207
  .ui.vertical.buttons .mini.button:last-child,
@@ -2375,7 +3211,7 @@
2375
3211
  .ui.vertical.buttons .huge.button:last-child,
2376
3212
  .ui.vertical.buttons .gigantic.button:last-child {
2377
3213
  margin-bottom: 0px;
2378
- border-radius: 0px 0px 0.2857rem 0.2857rem;
3214
+ border-radius: 0px 0px 0.28571429rem 0.28571429rem;
2379
3215
  }
2380
3216
 
2381
3217