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.

727 lines
12 KiB

9 years ago
6 years ago
9 years ago
10 years ago
7 years ago
10 years ago
10 years ago
10 years ago
7 years ago
10 years ago
9 years ago
10 years ago
7 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
7 years ago
10 years ago
10 years ago
7 years ago
7 years ago
7 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
7 years ago
10 years ago
7 years ago
10 years ago
7 years ago
10 years ago
9 years ago
9 years ago
9 years ago
9 years ago
7 years ago
7 years ago
7 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
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
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
9 years ago
9 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
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
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
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
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
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
9 years ago
10 years ago
9 years ago
9 years ago
10 years ago
9 years ago
9 years ago
10 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
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
9 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
7 years ago
10 years ago
  1. /*!
  2. * # Semantic UI 2.3.3 - Header
  3. * http://github.com/semantic-org/semantic-ui/
  4. *
  5. *
  6. * Released under the MIT license
  7. * http://opensource.org/licenses/MIT
  8. *
  9. */
  10. /*******************************
  11. Header
  12. *******************************/
  13. /* Standard */
  14. .ui.header {
  15. border: none;
  16. margin: calc(2rem - 0.14285714em ) 0em 1rem;
  17. padding: 0em 0em;
  18. font-family: 'Lato', 'Helvetica Neue', Arial, Helvetica, sans-serif;
  19. font-weight: bold;
  20. line-height: 1.28571429em;
  21. text-transform: none;
  22. color: rgba(0, 0, 0, 0.87);
  23. }
  24. .ui.header:first-child {
  25. margin-top: -0.14285714em;
  26. }
  27. .ui.header:last-child {
  28. margin-bottom: 0em;
  29. }
  30. /*--------------
  31. Sub Header
  32. ---------------*/
  33. .ui.header .sub.header {
  34. display: block;
  35. font-weight: normal;
  36. padding: 0em;
  37. margin: 0em;
  38. font-size: 1rem;
  39. line-height: 1.2em;
  40. color: rgba(0, 0, 0, 0.6);
  41. }
  42. /*--------------
  43. Icon
  44. ---------------*/
  45. .ui.header > .icon {
  46. display: table-cell;
  47. opacity: 1;
  48. font-size: 1.5em;
  49. padding-top: 0em;
  50. vertical-align: middle;
  51. }
  52. /* With Text Node */
  53. .ui.header .icon:only-child {
  54. display: inline-block;
  55. padding: 0em;
  56. margin-right: 0.75rem;
  57. }
  58. /*-------------------
  59. Image
  60. --------------------*/
  61. .ui.header > .image:not(.icon),
  62. .ui.header > img {
  63. display: inline-block;
  64. margin-top: 0.14285714em;
  65. width: 2.5em;
  66. height: auto;
  67. vertical-align: middle;
  68. }
  69. .ui.header > .image:not(.icon):only-child,
  70. .ui.header > img:only-child {
  71. margin-right: 0.75rem;
  72. }
  73. /*--------------
  74. Content
  75. ---------------*/
  76. .ui.header .content {
  77. display: inline-block;
  78. vertical-align: top;
  79. }
  80. /* After Image */
  81. .ui.header > img + .content,
  82. .ui.header > .image + .content {
  83. padding-left: 0.75rem;
  84. vertical-align: middle;
  85. }
  86. /* After Icon */
  87. .ui.header > .icon + .content {
  88. padding-left: 0.75rem;
  89. display: table-cell;
  90. vertical-align: middle;
  91. }
  92. /*--------------
  93. Loose Coupling
  94. ---------------*/
  95. .ui.header .ui.label {
  96. font-size: '';
  97. margin-left: 0.5rem;
  98. vertical-align: middle;
  99. }
  100. /* Positioning */
  101. .ui.header + p {
  102. margin-top: 0em;
  103. }
  104. /*******************************
  105. Types
  106. *******************************/
  107. /*--------------
  108. Page
  109. ---------------*/
  110. h1.ui.header {
  111. font-size: 2rem;
  112. }
  113. h2.ui.header {
  114. font-size: 1.71428571rem;
  115. }
  116. h3.ui.header {
  117. font-size: 1.28571429rem;
  118. }
  119. h4.ui.header {
  120. font-size: 1.07142857rem;
  121. }
  122. h5.ui.header {
  123. font-size: 1rem;
  124. }
  125. /* Sub Header */
  126. h1.ui.header .sub.header {
  127. font-size: 1.14285714rem;
  128. }
  129. h2.ui.header .sub.header {
  130. font-size: 1.14285714rem;
  131. }
  132. h3.ui.header .sub.header {
  133. font-size: 1rem;
  134. }
  135. h4.ui.header .sub.header {
  136. font-size: 1rem;
  137. }
  138. h5.ui.header .sub.header {
  139. font-size: 0.92857143rem;
  140. }
  141. /*--------------
  142. Content Heading
  143. ---------------*/
  144. .ui.huge.header {
  145. min-height: 1em;
  146. font-size: 2em;
  147. }
  148. .ui.large.header {
  149. font-size: 1.71428571em;
  150. }
  151. .ui.medium.header {
  152. font-size: 1.28571429em;
  153. }
  154. .ui.small.header {
  155. font-size: 1.07142857em;
  156. }
  157. .ui.tiny.header {
  158. font-size: 1em;
  159. }
  160. /* Sub Header */
  161. .ui.huge.header .sub.header {
  162. font-size: 1.14285714rem;
  163. }
  164. .ui.large.header .sub.header {
  165. font-size: 1.14285714rem;
  166. }
  167. .ui.header .sub.header {
  168. font-size: 1rem;
  169. }
  170. .ui.small.header .sub.header {
  171. font-size: 1rem;
  172. }
  173. .ui.tiny.header .sub.header {
  174. font-size: 0.92857143rem;
  175. }
  176. /*--------------
  177. Sub Heading
  178. ---------------*/
  179. .ui.sub.header {
  180. padding: 0em;
  181. margin-bottom: 0.14285714rem;
  182. font-weight: bold;
  183. font-size: 0.85714286em;
  184. text-transform: uppercase;
  185. color: '';
  186. }
  187. .ui.small.sub.header {
  188. font-size: 0.78571429em;
  189. }
  190. .ui.sub.header {
  191. font-size: 0.85714286em;
  192. }
  193. .ui.large.sub.header {
  194. font-size: 0.92857143em;
  195. }
  196. .ui.huge.sub.header {
  197. font-size: 1em;
  198. }
  199. /*-------------------
  200. Icon
  201. --------------------*/
  202. .ui.icon.header {
  203. display: inline-block;
  204. text-align: center;
  205. margin: 2rem 0em 1rem;
  206. }
  207. .ui.icon.header:after {
  208. content: '';
  209. display: block;
  210. height: 0px;
  211. clear: both;
  212. visibility: hidden;
  213. }
  214. .ui.icon.header:first-child {
  215. margin-top: 0em;
  216. }
  217. .ui.icon.header .icon {
  218. float: none;
  219. display: block;
  220. width: auto;
  221. height: auto;
  222. line-height: 1;
  223. padding: 0em;
  224. font-size: 3em;
  225. margin: 0em auto 0.5rem;
  226. opacity: 1;
  227. }
  228. .ui.icon.header .content {
  229. display: block;
  230. padding: 0em;
  231. }
  232. .ui.icon.header .circular.icon {
  233. font-size: 2em;
  234. }
  235. .ui.icon.header .square.icon {
  236. font-size: 2em;
  237. }
  238. .ui.block.icon.header .icon {
  239. margin-bottom: 0em;
  240. }
  241. .ui.icon.header.aligned {
  242. margin-left: auto;
  243. margin-right: auto;
  244. display: block;
  245. }
  246. /*******************************
  247. States
  248. *******************************/
  249. .ui.disabled.header {
  250. opacity: 0.45;
  251. }
  252. /*******************************
  253. Variations
  254. *******************************/
  255. /*-------------------
  256. Inverted
  257. --------------------*/
  258. .ui.inverted.header {
  259. color: #FFFFFF;
  260. }
  261. .ui.inverted.header .sub.header {
  262. color: rgba(255, 255, 255, 0.8);
  263. }
  264. .ui.inverted.attached.header {
  265. background: #545454 -webkit-gradient(linear, left top, left bottom, from(transparent), to(rgba(0, 0, 0, 0.05)));
  266. background: #545454 -webkit-linear-gradient(transparent, rgba(0, 0, 0, 0.05));
  267. background: #545454 linear-gradient(transparent, rgba(0, 0, 0, 0.05));
  268. -webkit-box-shadow: none;
  269. box-shadow: none;
  270. border-color: transparent;
  271. }
  272. .ui.inverted.block.header {
  273. background: #545454 -webkit-gradient(linear, left top, left bottom, from(transparent), to(rgba(0, 0, 0, 0.05)));
  274. background: #545454 -webkit-linear-gradient(transparent, rgba(0, 0, 0, 0.05));
  275. background: #545454 linear-gradient(transparent, rgba(0, 0, 0, 0.05));
  276. -webkit-box-shadow: none;
  277. box-shadow: none;
  278. }
  279. .ui.inverted.block.header {
  280. border-bottom: none;
  281. }
  282. /*-------------------
  283. Colors
  284. --------------------*/
  285. /*--- Red ---*/
  286. .ui.red.header {
  287. color: #DB2828 !important;
  288. }
  289. a.ui.red.header:hover {
  290. color: #d01919 !important;
  291. }
  292. .ui.red.dividing.header {
  293. border-bottom: 2px solid #DB2828;
  294. }
  295. /* Inverted */
  296. .ui.inverted.red.header {
  297. color: #FF695E !important;
  298. }
  299. a.ui.inverted.red.header:hover {
  300. color: #ff5144 !important;
  301. }
  302. /*--- Orange ---*/
  303. .ui.orange.header {
  304. color: #F2711C !important;
  305. }
  306. a.ui.orange.header:hover {
  307. color: #f26202 !important;
  308. }
  309. .ui.orange.dividing.header {
  310. border-bottom: 2px solid #F2711C;
  311. }
  312. /* Inverted */
  313. .ui.inverted.orange.header {
  314. color: #FF851B !important;
  315. }
  316. a.ui.inverted.orange.header:hover {
  317. color: #ff7701 !important;
  318. }
  319. /*--- Olive ---*/
  320. .ui.olive.header {
  321. color: #B5CC18 !important;
  322. }
  323. a.ui.olive.header:hover {
  324. color: #a7bd0d !important;
  325. }
  326. .ui.olive.dividing.header {
  327. border-bottom: 2px solid #B5CC18;
  328. }
  329. /* Inverted */
  330. .ui.inverted.olive.header {
  331. color: #D9E778 !important;
  332. }
  333. a.ui.inverted.olive.header:hover {
  334. color: #d8ea5c !important;
  335. }
  336. /*--- Yellow ---*/
  337. .ui.yellow.header {
  338. color: #FBBD08 !important;
  339. }
  340. a.ui.yellow.header:hover {
  341. color: #eaae00 !important;
  342. }
  343. .ui.yellow.dividing.header {
  344. border-bottom: 2px solid #FBBD08;
  345. }
  346. /* Inverted */
  347. .ui.inverted.yellow.header {
  348. color: #FFE21F !important;
  349. }
  350. a.ui.inverted.yellow.header:hover {
  351. color: #ffdf05 !important;
  352. }
  353. /*--- Green ---*/
  354. .ui.green.header {
  355. color: #21BA45 !important;
  356. }
  357. a.ui.green.header:hover {
  358. color: #16ab39 !important;
  359. }
  360. .ui.green.dividing.header {
  361. border-bottom: 2px solid #21BA45;
  362. }
  363. /* Inverted */
  364. .ui.inverted.green.header {
  365. color: #2ECC40 !important;
  366. }
  367. a.ui.inverted.green.header:hover {
  368. color: #22be34 !important;
  369. }
  370. /*--- Teal ---*/
  371. .ui.teal.header {
  372. color: #00B5AD !important;
  373. }
  374. a.ui.teal.header:hover {
  375. color: #009c95 !important;
  376. }
  377. .ui.teal.dividing.header {
  378. border-bottom: 2px solid #00B5AD;
  379. }
  380. /* Inverted */
  381. .ui.inverted.teal.header {
  382. color: #6DFFFF !important;
  383. }
  384. a.ui.inverted.teal.header:hover {
  385. color: #54ffff !important;
  386. }
  387. /*--- Blue ---*/
  388. .ui.blue.header {
  389. color: #2185D0 !important;
  390. }
  391. a.ui.blue.header:hover {
  392. color: #1678c2 !important;
  393. }
  394. .ui.blue.dividing.header {
  395. border-bottom: 2px solid #2185D0;
  396. }
  397. /* Inverted */
  398. .ui.inverted.blue.header {
  399. color: #54C8FF !important;
  400. }
  401. a.ui.inverted.blue.header:hover {
  402. color: #3ac0ff !important;
  403. }
  404. /*--- Violet ---*/
  405. .ui.violet.header {
  406. color: #6435C9 !important;
  407. }
  408. a.ui.violet.header:hover {
  409. color: #5829bb !important;
  410. }
  411. .ui.violet.dividing.header {
  412. border-bottom: 2px solid #6435C9;
  413. }
  414. /* Inverted */
  415. .ui.inverted.violet.header {
  416. color: #A291FB !important;
  417. }
  418. a.ui.inverted.violet.header:hover {
  419. color: #8a73ff !important;
  420. }
  421. /*--- Purple ---*/
  422. .ui.purple.header {
  423. color: #A333C8 !important;
  424. }
  425. a.ui.purple.header:hover {
  426. color: #9627ba !important;
  427. }
  428. .ui.purple.dividing.header {
  429. border-bottom: 2px solid #A333C8;
  430. }
  431. /* Inverted */
  432. .ui.inverted.purple.header {
  433. color: #DC73FF !important;
  434. }
  435. a.ui.inverted.purple.header:hover {
  436. color: #d65aff !important;
  437. }
  438. /*--- Pink ---*/
  439. .ui.pink.header {
  440. color: #E03997 !important;
  441. }
  442. a.ui.pink.header:hover {
  443. color: #e61a8d !important;
  444. }
  445. .ui.pink.dividing.header {
  446. border-bottom: 2px solid #E03997;
  447. }
  448. /* Inverted */
  449. .ui.inverted.pink.header {
  450. color: #FF8EDF !important;
  451. }
  452. a.ui.inverted.pink.header:hover {
  453. color: #ff74d8 !important;
  454. }
  455. /*--- Brown ---*/
  456. .ui.brown.header {
  457. color: #A5673F !important;
  458. }
  459. a.ui.brown.header:hover {
  460. color: #975b33 !important;
  461. }
  462. .ui.brown.dividing.header {
  463. border-bottom: 2px solid #A5673F;
  464. }
  465. /* Inverted */
  466. .ui.inverted.brown.header {
  467. color: #D67C1C !important;
  468. }
  469. a.ui.inverted.brown.header:hover {
  470. color: #c86f11 !important;
  471. }
  472. /*--- Grey ---*/
  473. .ui.grey.header {
  474. color: #767676 !important;
  475. }
  476. a.ui.grey.header:hover {
  477. color: #838383 !important;
  478. }
  479. .ui.grey.dividing.header {
  480. border-bottom: 2px solid #767676;
  481. }
  482. /* Inverted */
  483. .ui.inverted.grey.header {
  484. color: #DCDDDE !important;
  485. }
  486. a.ui.inverted.grey.header:hover {
  487. color: #cfd0d2 !important;
  488. }
  489. /*-------------------
  490. Aligned
  491. --------------------*/
  492. .ui.left.aligned.header {
  493. text-align: left;
  494. }
  495. .ui.right.aligned.header {
  496. text-align: right;
  497. }
  498. .ui.centered.header,
  499. .ui.center.aligned.header {
  500. text-align: center;
  501. }
  502. .ui.justified.header {
  503. text-align: justify;
  504. }
  505. .ui.justified.header:after {
  506. display: inline-block;
  507. content: '';
  508. width: 100%;
  509. }
  510. /*-------------------
  511. Floated
  512. --------------------*/
  513. .ui.floated.header,
  514. .ui[class*="left floated"].header {
  515. float: left;
  516. margin-top: 0em;
  517. margin-right: 0.5em;
  518. }
  519. .ui[class*="right floated"].header {
  520. float: right;
  521. margin-top: 0em;
  522. margin-left: 0.5em;
  523. }
  524. /*-------------------
  525. Fitted
  526. --------------------*/
  527. .ui.fitted.header {
  528. padding: 0em;
  529. }
  530. /*-------------------
  531. Dividing
  532. --------------------*/
  533. .ui.dividing.header {
  534. padding-bottom: 0.21428571rem;
  535. border-bottom: 1px solid rgba(34, 36, 38, 0.15);
  536. }
  537. .ui.dividing.header .sub.header {
  538. padding-bottom: 0.21428571rem;
  539. }
  540. .ui.dividing.header .icon {
  541. margin-bottom: 0em;
  542. }
  543. .ui.inverted.dividing.header {
  544. border-bottom-color: rgba(255, 255, 255, 0.1);
  545. }
  546. /*-------------------
  547. Block
  548. --------------------*/
  549. .ui.block.header {
  550. background: #F3F4F5;
  551. padding: 0.78571429rem 1rem;
  552. -webkit-box-shadow: none;
  553. box-shadow: none;
  554. border: 1px solid #D4D4D5;
  555. border-radius: 0.28571429rem;
  556. }
  557. .ui.tiny.block.header {
  558. font-size: 0.85714286rem;
  559. }
  560. .ui.small.block.header {
  561. font-size: 0.92857143rem;
  562. }
  563. .ui.block.header:not(h1):not(h2):not(h3):not(h4):not(h5):not(h6) {
  564. font-size: 1rem;
  565. }
  566. .ui.large.block.header {
  567. font-size: 1.14285714rem;
  568. }
  569. .ui.huge.block.header {
  570. font-size: 1.42857143rem;
  571. }
  572. /*-------------------
  573. Attached
  574. --------------------*/
  575. .ui.attached.header {
  576. background: #FFFFFF;
  577. padding: 0.78571429rem 1rem;
  578. margin-left: -1px;
  579. margin-right: -1px;
  580. -webkit-box-shadow: none;
  581. box-shadow: none;
  582. border: 1px solid #D4D4D5;
  583. }
  584. .ui.attached.block.header {
  585. background: #F3F4F5;
  586. }
  587. .ui.attached:not(.top):not(.bottom).header {
  588. margin-top: 0em;
  589. margin-bottom: 0em;
  590. border-top: none;
  591. border-radius: 0em;
  592. }
  593. .ui.top.attached.header {
  594. margin-bottom: 0em;
  595. border-radius: 0.28571429rem 0.28571429rem 0em 0em;
  596. }
  597. .ui.bottom.attached.header {
  598. margin-top: 0em;
  599. border-top: none;
  600. border-radius: 0em 0em 0.28571429rem 0.28571429rem;
  601. }
  602. /* Attached Sizes */
  603. .ui.tiny.attached.header {
  604. font-size: 0.85714286em;
  605. }
  606. .ui.small.attached.header {
  607. font-size: 0.92857143em;
  608. }
  609. .ui.attached.header:not(h1):not(h2):not(h3):not(h4):not(h5):not(h6) {
  610. font-size: 1em;
  611. }
  612. .ui.large.attached.header {
  613. font-size: 1.14285714em;
  614. }
  615. .ui.huge.attached.header {
  616. font-size: 1.42857143em;
  617. }
  618. /*-------------------
  619. Sizing
  620. --------------------*/
  621. .ui.header:not(h1):not(h2):not(h3):not(h4):not(h5):not(h6) {
  622. font-size: 1.28571429em;
  623. }
  624. /*******************************
  625. Theme Overrides
  626. *******************************/
  627. /*******************************
  628. Site Overrides
  629. *******************************/