colors.css 12 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602
  1. /* Font Colors */
  2. .font-black {
  3. color: #464646 !important;
  4. }
  5. .font-blue {
  6. color: #1f6dca !important;
  7. }
  8. .font-blue-alt {
  9. color: #65a6ff !important;
  10. }
  11. .font-azure {
  12. color: #41e5c0 !important;
  13. }
  14. .text-muted,
  15. .font-gray {
  16. color: #c2c2c2 !important;
  17. }
  18. .text-info,
  19. .font-gray-dark {
  20. color: #828282 !important;
  21. }
  22. .text-success,
  23. .font-green {
  24. color: #2ecc71 !important;
  25. }
  26. .text-warning,
  27. .font-orange {
  28. color: #fa7753 !important;
  29. }
  30. .font-yellow {
  31. color: #fc0 !important;
  32. }
  33. .font-purple {
  34. color: #984dff !important;
  35. }
  36. .has-error .help-block,
  37. .text-danger,
  38. .font-red,
  39. .parsley-required {
  40. color: #ff5757 !important;
  41. }
  42. .font-white {
  43. color: #fff !important;
  44. }
  45. /* Other Background Colors */
  46. .alert-info a,
  47. .alert-info {
  48. color: #6c6c6c;
  49. border-color: #c9c9c9;
  50. background: #dfe8f1;
  51. }
  52. .alert-notice a,
  53. .alert-notice {
  54. color: #0f2c62;
  55. border-color: #62baf6;
  56. background: #c6e8ff;
  57. }
  58. .alert-success a,
  59. .alert-success,
  60. .parsley-success {
  61. color: #1e620f;
  62. border-color: #7cd362;
  63. background: #d3ffc6;
  64. }
  65. .parsley-success {
  66. background: #fff;
  67. }
  68. .alert-warning a,
  69. .alert-warning,
  70. .warning {
  71. color: #624b0f;
  72. border-color: #ebc875;
  73. background: #ffeec6;
  74. }
  75. .alert-danger a,
  76. .alert-danger,
  77. .danger,
  78. .parsley-error {
  79. color: #620f0f;
  80. border-color: #db6a6a;
  81. background: #ffc6c6;
  82. }
  83. .parsley-error {
  84. background: #fff;
  85. }
  86. /* Social buttons */
  87. .bg-facebook {
  88. color: #fff !important;
  89. background: #3b5998;
  90. }
  91. .btn.bg-facebook:hover {
  92. background: #304b85;
  93. }
  94. .bg-twitter {
  95. color: #fff !important;
  96. background: #3a92c8;
  97. }
  98. .btn.bg-twitter:hover {
  99. background: #2b80b4;
  100. }
  101. .bg-google {
  102. color: #fff !important;
  103. background: #dd4b39;
  104. }
  105. .btn.bg-google:hover {
  106. background: #c93b2a;
  107. }
  108. /* Background Colors */
  109. /* Blue */
  110. .progress-bar-info,
  111. .bootstrap-switch-info,
  112. .checkbox-info div[id^='uniform-'] span.checked,
  113. .radio-info div[id^='uniform-'] span.checked,
  114. .badge-info,
  115. .label-info,
  116. .btn-info,
  117. .hover-blue:hover,
  118. .hover-info:hover,
  119. .bg-blue {
  120. color: #fff;
  121. border-color: #308dcc;
  122. background: #3498db;
  123. }
  124. .label-info[href]:hover,
  125. .label-info[href]:focus,
  126. .btn-info:hover,
  127. .btn-info:focus,
  128. .btn-info:active,
  129. .btn-info.active,
  130. .open .dropdown-toggle.btn-info,
  131. .btn-info.disabled,
  132. .btn-info[disabled],
  133. .btn-info.disabled:hover,
  134. .btn-info[disabled]:hover,
  135. .btn-info.disabled:focus,
  136. .btn-info[disabled]:focus,
  137. .btn-info.disabled:active,
  138. .btn-info[disabled]:active,
  139. .btn-info.disabled.active,
  140. .btn-info[disabled].active {
  141. color: #fff;
  142. border-color: #308dcc;
  143. background: #52a7e0;
  144. }
  145. /* Red */
  146. .progress-bar-danger,
  147. .bootstrap-switch-danger,
  148. .checkbox-danger div[id^='uniform-'] span.checked,
  149. .radio-danger div[id^='uniform-'] span.checked,
  150. .badge-danger,
  151. .label-danger,
  152. .btn-danger,
  153. .bg-danger,
  154. .hover-red:hover,
  155. .hover-danger:hover,
  156. .bg-red {
  157. color: #fff;
  158. border-color: #cf4436;
  159. background: #e74c3c;
  160. }
  161. .label-danger[href]:hover,
  162. .label-danger[href]:focus,
  163. .btn-danger:hover,
  164. .btn-danger:focus,
  165. .btn-danger:active,
  166. .btn-danger.active,
  167. .open .dropdown-toggle.btn-danger,
  168. .btn-danger.disabled,
  169. .btn-danger[disabled],
  170. .btn-danger.disabled:hover,
  171. .btn-danger[disabled]:hover,
  172. .btn-danger.disabled:focus,
  173. .btn-danger[disabled]:focus,
  174. .btn-danger.disabled:active,
  175. .btn-danger[disabled]:active,
  176. .btn-danger.disabled.active,
  177. .btn-danger[disabled].active {
  178. color: #fff;
  179. border-color: #cf4436;
  180. background: #eb6759;
  181. }
  182. /* Gray */
  183. .badge-gray,
  184. .label-gray,
  185. .btn-gray,
  186. .hover-gray:hover,
  187. .bg-gray {
  188. color: #666;
  189. background: #efefef;
  190. }
  191. .label-gray[href]:hover,
  192. .label-gray[href]:focus,
  193. .btn-gray:hover,
  194. .btn-gray:focus,
  195. .btn-gray:active,
  196. .btn-gray.active,
  197. .open .dropdown-toggle.btn-gray,
  198. .btn-gray.disabled,
  199. .btn-gray[disabled],
  200. .btn-gray.disabled:hover,
  201. .btn-gray[disabled]:hover,
  202. .btn-gray.disabled:focus,
  203. .btn-gray[disabled]:focus,
  204. .btn-gray.disabled:active,
  205. .btn-gray[disabled]:active,
  206. .btn-gray.disabled.active,
  207. .btn-gray[disabled].active {
  208. color: #333;
  209. background: #e7e7e7;
  210. }
  211. /* Gray Alt */
  212. .badge-gray-alt,
  213. .label-gray-alt,
  214. .btn-gray-alt,
  215. .hover-gray-alt:hover,
  216. .bg-gray-alt {
  217. color: #888;
  218. background: #f6f6f6;
  219. }
  220. .label-gray-alt[href]:hover,
  221. .label-gray-alt[href]:focus,
  222. .btn-gray-alt:hover,
  223. .btn-gray-alt:focus,
  224. .btn-gray-alt:active,
  225. .btn-gray-alt.active,
  226. .open .dropdown-toggle.btn-gray-alt,
  227. .btn-gray-alt.disabled,
  228. .btn-gray-alt[disabled],
  229. .btn-gray-alt.disabled:hover,
  230. .btn-gray-alt[disabled]:hover,
  231. .btn-gray-alt.disabled:focus,
  232. .btn-gray-alt[disabled]:focus,
  233. .btn-gray-alt.disabled:active,
  234. .btn-gray-alt[disabled]:active,
  235. .btn-gray-alt.disabled.active,
  236. .btn-gray-alt[disabled].active {
  237. color: #444;
  238. background: #ededed;
  239. }
  240. /* Black */
  241. .badge-black,
  242. .label-black,
  243. .btn-black,
  244. .hover-black:hover,
  245. .bg-black {
  246. color: #ccc;
  247. border-color: #000;
  248. background: #2d2d2d;
  249. }
  250. .boxed-layout.bg-black {
  251. background: #2d2d2d;
  252. }
  253. .label-black[href]:hover,
  254. .label-black[href]:focus,
  255. .btn-black:hover,
  256. .btn-black:focus,
  257. .btn-black:active,
  258. .btn-black.active,
  259. .open .dropdown-toggle.btn-black,
  260. .btn-black.disabled,
  261. .btn-black[disabled],
  262. .btn-black.disabled:hover,
  263. .btn-black[disabled]:hover,
  264. .btn-black.disabled:focus,
  265. .btn-black[disabled]:focus,
  266. .btn-black.disabled:active,
  267. .btn-black[disabled]:active,
  268. .btn-black.disabled.active,
  269. .btn-black[disabled].active {
  270. color: #fdfdfd;
  271. background: #151515;
  272. }
  273. /* Black Opacity */
  274. .badge-black-opacity,
  275. .label-black-opacity,
  276. .btn-black-opacity,
  277. .hover-black-opacity:hover,
  278. .bg-black-opacity {
  279. color: #a9b3bb;
  280. background: #2b323d;
  281. }
  282. .label-black-opacity[href]:hover,
  283. .label-black-opacity[href]:focus,
  284. .btn-black-opacity:hover,
  285. .btn-black-opacity:focus,
  286. .btn-black-opacity:active,
  287. .btn-black-opacity.active,
  288. .open .dropdown-toggle.btn-black-opacity,
  289. .btn-black-opacity.disabled,
  290. .btn-black-opacity[disabled],
  291. .btn-black-opacity.disabled:hover,
  292. .btn-black-opacity[disabled]:hover,
  293. .btn-black-opacity.disabled:focus,
  294. .btn-black-opacity[disabled]:focus,
  295. .btn-black-opacity.disabled:active,
  296. .btn-black-opacity[disabled]:active,
  297. .btn-black-opacity.disabled.active,
  298. .btn-black-opacity[disabled].active {
  299. color: #fff;
  300. background: #14171c;
  301. }
  302. /* Black Opacity Alt */
  303. .badge-black-opacity-alt,
  304. .label-black-opacity-alt,
  305. .btn-black-opacity-alt,
  306. .hover-black-opacity-alt:hover,
  307. .bg-black-opacity-alt {
  308. color: #fff;
  309. background: rgba(0, 0, 0, .20);
  310. border-color: transparent;
  311. }
  312. .label-black-opacity-alt[href]:hover,
  313. .label-black-opacity-alt[href]:focus,
  314. .btn-black-opacity-alt:hover,
  315. .btn-black-opacity-alt:focus,
  316. .btn-black-opacity-alt:active,
  317. .btn-black-opacity-alt.active,
  318. .open .dropdown-toggle.btn-black-opacity-alt,
  319. .btn-black-opacity-alt.disabled,
  320. .btn-black-opacity-alt[disabled],
  321. .btn-black-opacity-alt.disabled:hover,
  322. .btn-black-opacity-alt[disabled]:hover,
  323. .btn-black-opacity-alt.disabled:focus,
  324. .btn-black-opacity-alt[disabled]:focus,
  325. .btn-black-opacity-alt.disabled:active,
  326. .btn-black-opacity-alt[disabled]:active,
  327. .btn-black-opacity-alt.disabled.active,
  328. .btn-black-opacity-alt[disabled].active {
  329. color: #fff;
  330. background: rgba(0, 0, 0, .30);
  331. }
  332. /* Green */
  333. .progress-bar-success,
  334. .bootstrap-switch-success,
  335. .checkbox-success div[id^='uniform-'] span.checked,
  336. .radio-success div[id^='uniform-'] span.checked,
  337. .badge-success,
  338. .label-success,
  339. .btn-success,
  340. .hover-green:hover,
  341. .hover-success:hover,
  342. .bg-green {
  343. color: #fff;
  344. border-color: #29b765;
  345. background: #2ecc71;
  346. }
  347. .label-success[href]:hover,
  348. .label-success[href]:focus,
  349. .btn-success:hover,
  350. .btn-success:focus,
  351. .btn-success:active,
  352. .btn-success.active,
  353. .open .dropdown-toggle.btn-success,
  354. .btn-success.disabled,
  355. .btn-success[disabled],
  356. .btn-success.disabled:hover,
  357. .btn-success[disabled]:hover,
  358. .btn-success.disabled:focus,
  359. .btn-success[disabled]:focus,
  360. .btn-success.disabled:active,
  361. .btn-success[disabled]:active,
  362. .btn-success.disabled.active,
  363. .btn-success[disabled].active {
  364. color: #fff;
  365. border-color: #29b765;
  366. background: #58d68d;
  367. }
  368. /* Orange */
  369. .progress-bar-warning,
  370. .bootstrap-switch-warning,
  371. .checkbox-warning div[id^='uniform-'] span.checked,
  372. .radio-warning div[id^='uniform-'] span.checked,
  373. .badge-warning,
  374. .label-warning,
  375. .btn-warning,
  376. .bg-warning,
  377. .hover-orange:hover,
  378. .hover-warning:hover,
  379. .bg-orange {
  380. color: #fff;
  381. border-color: #d67520;
  382. background: #e67e22;
  383. }
  384. .label-warning[href]:hover,
  385. .label-warning[href]:focus,
  386. .btn-warning:hover,
  387. .btn-warning:focus,
  388. .btn-warning:active,
  389. .btn-warning.active,
  390. .open .dropdown-toggle.btn-warning,
  391. .btn-warning.disabled,
  392. .btn-warning[disabled],
  393. .btn-warning.disabled:hover,
  394. .btn-warning[disabled]:hover,
  395. .btn-warning.disabled:focus,
  396. .btn-warning[disabled]:focus,
  397. .btn-warning.disabled:active,
  398. .btn-warning[disabled]:active,
  399. .btn-warning.disabled.active,
  400. .btn-warning[disabled].active {
  401. color: #fff;
  402. border-color: #d67520;
  403. background: #ea9143;
  404. }
  405. /* White */
  406. .table,
  407. .label-white,
  408. .bg-white {
  409. background: #fff;
  410. }
  411. /* White Transparent */
  412. .bg-white-opacity {
  413. background: rgba(255, 255, 255, .85);
  414. }
  415. .hover-white:hover {
  416. background: #fafafa;
  417. }
  418. /* Yellow */
  419. .badge-yellow,
  420. .label-yellow,
  421. .btn-yellow,
  422. .hover-yellow:hover,
  423. .bg-yellow {
  424. color: #fff;
  425. background: #fc0;
  426. border-color: #deb200;
  427. }
  428. .label-yellow[href]:hover,
  429. .label-yellow[href]:focus,
  430. .btn-yellow:hover,
  431. .btn-yellow:focus,
  432. .btn-yellow:active,
  433. .btn-yellow.active,
  434. .open .dropdown-toggle.btn-yellow,
  435. .btn-yellow.disabled,
  436. .btn-yellow[disabled],
  437. .btn-yellow.disabled:hover,
  438. .btn-yellow[disabled]:hover,
  439. .btn-yellow.disabled:focus,
  440. .btn-yellow[disabled]:focus,
  441. .btn-yellow.disabled:active,
  442. .btn-yellow[disabled]:active,
  443. .btn-yellow.disabled.active,
  444. .btn-yellow[disabled].active {
  445. color: #fff;
  446. background: #e1b400;
  447. border-color: #c59e00;
  448. }
  449. /* Purple */
  450. .badge-purple,
  451. .label-purple,
  452. .btn-purple,
  453. .hover-purple:hover,
  454. .bg-purple {
  455. color: #fff;
  456. background: #984dff;
  457. border-color: #7a3ecc;
  458. }
  459. .label-purple[href]:hover,
  460. .label-purple[href]:focus,
  461. .btn-purple:hover,
  462. .btn-purple:focus,
  463. .btn-purple:active,
  464. .btn-purple.active,
  465. .open .dropdown-toggle.btn-purple,
  466. .btn-purple.disabled,
  467. .btn-purple[disabled],
  468. .btn-purple.disabled:hover,
  469. .btn-purple[disabled]:hover,
  470. .btn-purple.disabled:focus,
  471. .btn-purple[disabled]:focus,
  472. .btn-purple.disabled:active,
  473. .btn-purple[disabled]:active,
  474. .btn-purple.disabled.active,
  475. .btn-purple[disabled].active {
  476. color: #fff;
  477. background: #8134eb;
  478. border-color: #752fd6;
  479. }
  480. /* Blue Alt */
  481. .badge-blue-alt,
  482. .label-blue-alt,
  483. .btn-blue-alt,
  484. .hover-blue-alt:hover,
  485. .bg-blue-alt {
  486. color: #fff;
  487. background: #65a6ff;
  488. border-color: #5388d1;
  489. }
  490. .label-blue-alt[href]:hover,
  491. .label-blue-alt[href]:focus,
  492. .btn-blue-alt:hover,
  493. .btn-blue-alt:focus,
  494. .btn-blue-alt:active,
  495. .btn-blue-alt.active,
  496. .open .dropdown-toggle.btn-blue-alt,
  497. .btn-blue-alt.disabled,
  498. .btn-blue-alt[disabled],
  499. .btn-blue-alt.disabled:hover,
  500. .btn-blue-alt[disabled]:hover,
  501. .btn-blue-alt.disabled:focus,
  502. .btn-blue-alt[disabled]:focus,
  503. .btn-blue-alt.disabled:active,
  504. .btn-blue-alt[disabled]:active,
  505. .btn-blue-alt.disabled.active,
  506. .btn-blue-alt[disabled].active {
  507. color: #fff;
  508. background: #478ded;
  509. border-color: #4c7ec1;
  510. }
  511. /* Azure */
  512. .badge-azure,
  513. .label-azure,
  514. .btn-azure,
  515. .hover-azure:hover,
  516. .bg-azure {
  517. color: #fff;
  518. background: #41e5c0;
  519. border-color: #3acead;
  520. }
  521. .label-azure[href]:hover,
  522. .label-azure[href]:focus,
  523. .btn-azure:hover,
  524. .btn-azure:focus,
  525. .btn-azure:active,
  526. .btn-azure.active,
  527. .open .dropdown-toggle.btn-azure,
  528. .btn-azure.disabled,
  529. .btn-azure[disabled],
  530. .btn-azure.disabled:hover,
  531. .btn-azure[disabled]:hover,
  532. .btn-azure.disabled:focus,
  533. .btn-azure[disabled]:focus,
  534. .btn-azure.disabled:active,
  535. .btn-azure[disabled]:active,
  536. .btn-azure.disabled.active,
  537. .btn-azure[disabled].active {
  538. color: #fff;
  539. background: #27d1ab;
  540. border-color: #24c19e;
  541. }
  542. /* Border Colors */
  543. .border-black {
  544. border-color: #212121 !important;
  545. }
  546. .border-blue {
  547. border-color: #5bccf6 !important;
  548. }
  549. .border-blue-alt {
  550. border-color: #65a6ff !important;
  551. }
  552. .border-azure {
  553. border-color: #41e5c0 !important;
  554. }
  555. .border-gray {
  556. border-color: #c2c2c2 !important;
  557. }
  558. .border-gray-dark {
  559. border-color: #828282 !important;
  560. }
  561. .border-green {
  562. border-color: #2ecc71 !important;
  563. }
  564. .border-orange {
  565. border-color: #fa7753 !important;
  566. }
  567. .border-yellow {
  568. border-color: #fc0 !important;
  569. }
  570. .border-purple {
  571. border-color: #984dff !important;
  572. }
  573. .border-red {
  574. border-color: #ff5757 !important;
  575. }
  576. /* Box Shadow Colors */
  577. .parsley-success {
  578. border-color: #77e038 !important;
  579. }
  580. .parsley-error {
  581. border-color: #e03838 !important;
  582. }