You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

3237 lines
82 KiB

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