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.

1816 lines
58 KiB

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
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
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
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
9 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
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
10 years ago
  1. /*
  2. * # Semantic UI - 1.8.1
  3. * https://github.com/Semantic-Org/Semantic-UI
  4. * http://www.semantic-ui.com/
  5. *
  6. * Copyright 2014 Contributors
  7. * Released under the MIT license
  8. * http://opensource.org/licenses/MIT
  9. *
  10. */
  11. /*******************************
  12. Standard
  13. *******************************/
  14. .ui.grid {
  15. display: block;
  16. text-align: left;
  17. font-size: 0em;
  18. padding: 0em;
  19. }
  20. .ui.grid:after,
  21. .ui.grid > .row:after {
  22. content: '';
  23. display: block;
  24. height: 0px;
  25. clear: both;
  26. visibility: hidden;
  27. }
  28. /*----------------------
  29. Remove Gutters
  30. -----------------------*/
  31. .ui.grid {
  32. margin-top: -1rem;
  33. margin-bottom: -1rem;
  34. margin-left: -1rem;
  35. margin-right: -1rem;
  36. }
  37. .ui.relaxed.grid {
  38. margin-left: -1.5rem;
  39. margin-right: -1.5rem;
  40. }
  41. .ui[class*="very relaxed"].grid {
  42. margin-left: -2.5rem;
  43. margin-right: -2.5rem;
  44. }
  45. /* Collapse Margins on Consecutive Grids */
  46. .ui.grid + .grid {
  47. margin-top: 1rem;
  48. }
  49. /*-------------------
  50. Columns
  51. --------------------*/
  52. /* Standard 16 column */
  53. .ui.grid > .column:not(.row),
  54. .ui.grid > .row > .column {
  55. position: relative;
  56. display: inline-block;
  57. font-size: 1rem;
  58. width: 6.25%;
  59. padding-left: 1rem;
  60. padding-right: 1rem;
  61. vertical-align: top;
  62. }
  63. .ui.grid > * {
  64. padding-left: 1rem;
  65. padding-right: 1rem;
  66. }
  67. /*-------------------
  68. Rows
  69. --------------------*/
  70. .ui.grid > .row {
  71. position: relative;
  72. display: block;
  73. width: auto !important;
  74. padding: 0rem;
  75. font-size: 0rem;
  76. padding-top: 1rem;
  77. padding-bottom: 1rem;
  78. }
  79. /*-------------------
  80. Columns
  81. --------------------*/
  82. /* Vertical padding when no rows */
  83. .ui.grid > .column:not(.row) {
  84. padding-top: 1rem;
  85. padding-bottom: 1rem;
  86. }
  87. .ui.grid > .row > .column {
  88. margin-top: 0em;
  89. margin-bottom: 0em;
  90. }
  91. /*-------------------
  92. Content
  93. --------------------*/
  94. .ui.grid > .row > img,
  95. .ui.grid > .row > .column > img {
  96. max-width: 100%;
  97. }
  98. /*-------------------
  99. Loose Coupling
  100. --------------------*/
  101. .ui.grid .row + .ui.divider {
  102. margin: 1rem 1rem;
  103. }
  104. /* remove Border on last horizontal segment */
  105. .ui.grid > .row > .column:last-child > .horizontal.segment,
  106. .ui.grid > .column:last-child > .horizontal.segment {
  107. box-shadow: none;
  108. }
  109. /*******************************
  110. Variations
  111. *******************************/
  112. /*-----------------------
  113. Page Grid
  114. -------------------------*/
  115. .ui.page.grid {
  116. padding-left: 8%;
  117. padding-right: 8%;
  118. width: auto;
  119. }
  120. /* Collapse Margin */
  121. .ui.grid > .ui.grid:first-child {
  122. margin-top: 0em;
  123. }
  124. .ui.grid > .ui.grid:last-child {
  125. margin-bottom: 0em;
  126. }
  127. @media only screen and (max-width: 767px) {
  128. .ui.page.grid {
  129. width: auto;
  130. padding-left: 0em;
  131. padding-right: 0em;
  132. margin-left: 0em;
  133. margin-right: 0em;
  134. }
  135. }
  136. @media only screen and (min-width: 768px) {
  137. .ui.page.grid {
  138. width: auto;
  139. margin-left: 0em;
  140. margin-right: 0em;
  141. padding-left: 4em;
  142. padding-right: 4em;
  143. }
  144. }
  145. @media only screen and (min-width: 992px) {
  146. .ui.page.grid {
  147. width: auto;
  148. margin-left: 0em;
  149. margin-right: 0em;
  150. padding-left: 8%;
  151. padding-right: 8%;
  152. }
  153. }
  154. @media only screen and (min-width: 1400px) {
  155. .ui.page.grid {
  156. width: auto;
  157. margin-left: 0em;
  158. margin-right: 0em;
  159. padding-left: 15%;
  160. padding-right: 15%;
  161. }
  162. }
  163. @media only screen and (min-width: 1920px) {
  164. .ui.page.grid {
  165. width: auto;
  166. margin-left: 0em;
  167. margin-right: 0em;
  168. padding-left: 23%;
  169. padding-right: 23%;
  170. }
  171. }
  172. /*-------------------
  173. Column Count
  174. --------------------*/
  175. /* Assume full width with one column */
  176. .ui.grid > .column:only-child,
  177. .ui.grid > .row > .column:only-child {
  178. width: 100%;
  179. }
  180. /* Grid Based */
  181. .ui[class*="one column"].grid > .row > .column,
  182. .ui[class*="one column"].grid > .column {
  183. width: 100%;
  184. }
  185. .ui[class*="two column"].grid > .row > .column,
  186. .ui[class*="two column"].grid > .column {
  187. width: 50%;
  188. }
  189. .ui[class*="three column"].grid > .row > .column,
  190. .ui[class*="three column"].grid > .column {
  191. width: 33.33333333%;
  192. }
  193. .ui[class*="four column"].grid > .row > .column,
  194. .ui[class*="four column"].grid > .column {
  195. width: 25%;
  196. }
  197. .ui[class*="five column"].grid > .row > .column,
  198. .ui[class*="five column"].grid > .column {
  199. width: 20%;
  200. }
  201. .ui[class*="six column"].grid > .row > .column,
  202. .ui[class*="six column"].grid > .column {
  203. width: 16.66666667%;
  204. }
  205. .ui[class*="seven column"].grid > .row > .column,
  206. .ui[class*="seven column"].grid > .column {
  207. width: 14.28571429%;
  208. }
  209. .ui[class*="eight column"].grid > .row > .column,
  210. .ui[class*="eight column"].grid > .column {
  211. width: 12.5%;
  212. }
  213. .ui[class*="nine column"].grid > .row > .column,
  214. .ui[class*="nine column"].grid > .column {
  215. width: 11.11111111%;
  216. }
  217. .ui[class*="ten column"].grid > .row > .column,
  218. .ui[class*="ten column"].grid > .column {
  219. width: 10%;
  220. }
  221. .ui[class*="eleven column"].grid > .row > .column,
  222. .ui[class*="eleven column"].grid > .column {
  223. width: 9.09090909%;
  224. }
  225. .ui[class*="twelve column"].grid > .row > .column,
  226. .ui[class*="twelve column"].grid > .column {
  227. width: 8.33333333%;
  228. }
  229. .ui[class*="thirteen column"].grid > .row > .column,
  230. .ui[class*="thirteen column"].grid > .column {
  231. width: 7.69230769%;
  232. }
  233. .ui[class*="fourteen column"].grid > .row > .column,
  234. .ui[class*="fourteen column"].grid > .column {
  235. width: 7.14285714%;
  236. }
  237. .ui[class*="fifteen column"].grid > .row > .column,
  238. .ui[class*="fifteen column"].grid > .column {
  239. width: 6.66666667%;
  240. }
  241. .ui[class*="sixteen column"].grid > .row > .column,
  242. .ui[class*="sixteen column"].grid > .column {
  243. width: 6.25%;
  244. }
  245. /* Row Based Overrides */
  246. .ui.grid > [class*="one column"].row > .column {
  247. width: 100% !important;
  248. }
  249. .ui.grid > [class*="two column"].row > .column {
  250. width: 50% !important;
  251. }
  252. .ui.grid > [class*="three column"].row > .column {
  253. width: 33.33333333% !important;
  254. }
  255. .ui.grid > [class*="four column"].row > .column {
  256. width: 25% !important;
  257. }
  258. .ui.grid > [class*="five column"].row > .column {
  259. width: 20% !important;
  260. }
  261. .ui.grid > [class*="six column"].row > .column {
  262. width: 16.66666667% !important;
  263. }
  264. .ui.grid > [class*="seven column"].row > .column {
  265. width: 14.28571429% !important;
  266. }
  267. .ui.grid > [class*="eight column"].row > .column {
  268. width: 12.5% !important;
  269. }
  270. .ui.grid > [class*="nine column"].row > .column {
  271. width: 11.11111111% !important;
  272. }
  273. .ui.grid > [class*="ten column"].row > .column {
  274. width: 10% !important;
  275. }
  276. .ui.grid > [class*="eleven column"].row > .column {
  277. width: 9.09090909% !important;
  278. }
  279. .ui.grid > [class*="twelve column"].row > .column {
  280. width: 8.33333333% !important;
  281. }
  282. .ui.grid > [class*="thirteen column"].row > .column {
  283. width: 7.69230769% !important;
  284. }
  285. .ui.grid > [class*="fourteen column"].row > .column {
  286. width: 7.14285714% !important;
  287. }
  288. .ui.grid > [class*="fifteen column"].row > .column {
  289. width: 6.66666667% !important;
  290. }
  291. .ui.grid > [class*="sixteen column"].row > .column {
  292. width: 6.25% !important;
  293. }
  294. /*-------------------
  295. Column Width
  296. --------------------*/
  297. /* Sizing Combinations */
  298. .ui.grid > .row > [class*="one wide"].column,
  299. .ui.grid > .column.row > [class*="one wide"].column,
  300. .ui.grid > [class*="one wide"].column,
  301. .ui.column.grid > [class*="one wide"].column {
  302. width: 6.25% !important;
  303. }
  304. .ui.grid > .row > [class*="two wide"].column,
  305. .ui.grid > .column.row > [class*="two wide"].column,
  306. .ui.grid > [class*="two wide"].column,
  307. .ui.column.grid > [class*="two wide"].column {
  308. width: 12.5% !important;
  309. }
  310. .ui.grid > .row > [class*="three wide"].column,
  311. .ui.grid > .column.row > [class*="three wide"].column,
  312. .ui.grid > [class*="three wide"].column,
  313. .ui.column.grid > [class*="three wide"].column {
  314. width: 18.75% !important;
  315. }
  316. .ui.grid > .row > [class*="four wide"].column,
  317. .ui.grid > .column.row > [class*="four wide"].column,
  318. .ui.grid > [class*="four wide"].column,
  319. .ui.column.grid > [class*="four wide"].column {
  320. width: 25% !important;
  321. }
  322. .ui.grid > .row > [class*="five wide"].column,
  323. .ui.grid > .column.row > [class*="five wide"].column,
  324. .ui.grid > [class*="five wide"].column,
  325. .ui.column.grid > [class*="five wide"].column {
  326. width: 31.25% !important;
  327. }
  328. .ui.grid > .row > [class*="six wide"].column,
  329. .ui.grid > .column.row > [class*="six wide"].column,
  330. .ui.grid > [class*="six wide"].column,
  331. .ui.column.grid > [class*="six wide"].column {
  332. width: 37.5% !important;
  333. }
  334. .ui.grid > .row > [class*="seven wide"].column,
  335. .ui.grid > .column.row > [class*="seven wide"].column,
  336. .ui.grid > [class*="seven wide"].column,
  337. .ui.column.grid > [class*="seven wide"].column {
  338. width: 43.75% !important;
  339. }
  340. .ui.grid > .row > [class*="eight wide"].column,
  341. .ui.grid > .column.row > [class*="eight wide"].column,
  342. .ui.grid > [class*="eight wide"].column,
  343. .ui.column.grid > [class*="eight wide"].column {
  344. width: 50% !important;
  345. }
  346. .ui.grid > .row > [class*="nine wide"].column,
  347. .ui.grid > .column.row > [class*="nine wide"].column,
  348. .ui.grid > [class*="nine wide"].column,
  349. .ui.column.grid > [class*="nine wide"].column {
  350. width: 56.25% !important;
  351. }
  352. .ui.grid > .row > [class*="ten wide"].column,
  353. .ui.grid > .column.row > [class*="ten wide"].column,
  354. .ui.grid > [class*="ten wide"].column,
  355. .ui.column.grid > [class*="ten wide"].column {
  356. width: 62.5% !important;
  357. }
  358. .ui.grid > .row > [class*="eleven wide"].column,
  359. .ui.grid > .column.row > [class*="eleven wide"].column,
  360. .ui.grid > [class*="eleven wide"].column,
  361. .ui.column.grid > [class*="eleven wide"].column {
  362. width: 68.75% !important;
  363. }
  364. .ui.grid > .row > [class*="twelve wide"].column,
  365. .ui.grid > .column.row > [class*="twelve wide"].column,
  366. .ui.grid > [class*="twelve wide"].column,
  367. .ui.column.grid > [class*="twelve wide"].column {
  368. width: 75% !important;
  369. }
  370. .ui.grid > .row > [class*="thirteen wide"].column,
  371. .ui.grid > .column.row > [class*="thirteen wide"].column,
  372. .ui.grid > [class*="thirteen wide"].column,
  373. .ui.column.grid > [class*="thirteen wide"].column {
  374. width: 81.25% !important;
  375. }
  376. .ui.grid > .row > [class*="fourteen wide"].column,
  377. .ui.grid > .column.row > [class*="fourteen wide"].column,
  378. .ui.grid > [class*="fourteen wide"].column,
  379. .ui.column.grid > [class*="fourteen wide"].column {
  380. width: 87.5% !important;
  381. }
  382. .ui.grid > .row > [class*="fifteen wide"].column,
  383. .ui.grid > .column.row > [class*="fifteen wide"].column,
  384. .ui.grid > [class*="fifteen wide"].column,
  385. .ui.column.grid > [class*="fifteen wide"].column {
  386. width: 93.75% !important;
  387. }
  388. .ui.grid > .row > [class*="sixteen wide"].column,
  389. .ui.grid > .column.row > [class*="sixteen wide"].column,
  390. .ui.grid > [class*="sixteen wide"].column,
  391. .ui.column.grid > [class*="sixteen wide"].column {
  392. width: 100% !important;
  393. }
  394. /*----------------------
  395. Width per Device
  396. -----------------------*/
  397. /* Mobile Sizing Combinations */
  398. @media only screen and (min-width: 320px) and (max-width: 767px) {
  399. .ui.grid > .row > [class*="one wide mobile"].column,
  400. .ui.grid > .column.row > [class*="one wide mobile"].column,
  401. .ui.grid > [class*="one wide mobile"].column,
  402. .ui.column.grid > [class*="one wide mobile"].column {
  403. width: 6.25% !important;
  404. }
  405. .ui.grid > .row > [class*="two wide mobile"].column,
  406. .ui.grid > .column.row > [class*="two wide mobile"].column,
  407. .ui.grid > [class*="two wide mobile"].column,
  408. .ui.column.grid > [class*="two wide mobile"].column {
  409. width: 12.5% !important;
  410. }
  411. .ui.grid > .row > [class*="three wide mobile"].column,
  412. .ui.grid > .column.row > [class*="three wide mobile"].column,
  413. .ui.grid > [class*="three wide mobile"].column,
  414. .ui.column.grid > [class*="three wide mobile"].column {
  415. width: 18.75% !important;
  416. }
  417. .ui.grid > .row > [class*="four wide mobile"].column,
  418. .ui.grid > .column.row > [class*="four wide mobile"].column,
  419. .ui.grid > [class*="four wide mobile"].column,
  420. .ui.column.grid > [class*="four wide mobile"].column {
  421. width: 25% !important;
  422. }
  423. .ui.grid > .row > [class*="five wide mobile"].column,
  424. .ui.grid > .column.row > [class*="five wide mobile"].column,
  425. .ui.grid > [class*="five wide mobile"].column,
  426. .ui.column.grid > [class*="five wide mobile"].column {
  427. width: 31.25% !important;
  428. }
  429. .ui.grid > .row > [class*="six wide mobile"].column,
  430. .ui.grid > .column.row > [class*="six wide mobile"].column,
  431. .ui.grid > [class*="six wide mobile"].column,
  432. .ui.column.grid > [class*="six wide mobile"].column {
  433. width: 37.5% !important;
  434. }
  435. .ui.grid > .row > [class*="seven wide mobile"].column,
  436. .ui.grid > .column.row > [class*="seven wide mobile"].column,
  437. .ui.grid > [class*="seven wide mobile"].column,
  438. .ui.column.grid > [class*="seven wide mobile"].column {
  439. width: 43.75% !important;
  440. }
  441. .ui.grid > .row > [class*="eight wide mobile"].column,
  442. .ui.grid > .column.row > [class*="eight wide mobile"].column,
  443. .ui.grid > [class*="eight wide mobile"].column,
  444. .ui.column.grid > [class*="eight wide mobile"].column {
  445. width: 50% !important;
  446. }
  447. .ui.grid > .row > [class*="nine wide mobile"].column,
  448. .ui.grid > .column.row > [class*="nine wide mobile"].column,
  449. .ui.grid > [class*="nine wide mobile"].column,
  450. .ui.column.grid > [class*="nine wide mobile"].column {
  451. width: 56.25% !important;
  452. }
  453. .ui.grid > .row > [class*="ten wide mobile"].column,
  454. .ui.grid > .column.row > [class*="ten wide mobile"].column,
  455. .ui.grid > [class*="ten wide mobile"].column,
  456. .ui.column.grid > [class*="ten wide mobile"].column {
  457. width: 62.5% !important;
  458. }
  459. .ui.grid > .row > [class*="eleven wide mobile"].column,
  460. .ui.grid > .column.row > [class*="eleven wide mobile"].column,
  461. .ui.grid > [class*="eleven wide mobile"].column,
  462. .ui.column.grid > [class*="eleven wide mobile"].column {
  463. width: 68.75% !important;
  464. }
  465. .ui.grid > .row > [class*="twelve wide mobile"].column,
  466. .ui.grid > .column.row > [class*="twelve wide mobile"].column,
  467. .ui.grid > [class*="twelve wide mobile"].column,
  468. .ui.column.grid > [class*="twelve wide mobile"].column {
  469. width: 75% !important;
  470. }
  471. .ui.grid > .row > [class*="thirteen wide mobile"].column,
  472. .ui.grid > .column.row > [class*="thirteen wide mobile"].column,
  473. .ui.grid > [class*="thirteen wide mobile"].column,
  474. .ui.column.grid > [class*="thirteen wide mobile"].column {
  475. width: 81.25% !important;
  476. }
  477. .ui.grid > .row > [class*="fourteen wide mobile"].column,
  478. .ui.grid > .column.row > [class*="fourteen wide mobile"].column,
  479. .ui.grid > [class*="fourteen wide mobile"].column,
  480. .ui.column.grid > [class*="fourteen wide mobile"].column {
  481. width: 87.5% !important;
  482. }
  483. .ui.grid > .row > [class*="fifteen wide mobile"].column,
  484. .ui.grid > .column.row > [class*="fifteen wide mobile"].column,
  485. .ui.grid > [class*="fifteen wide mobile"].column,
  486. .ui.column.grid > [class*="fifteen wide mobile"].column {
  487. width: 93.75% !important;
  488. }
  489. .ui.grid > .row > [class*="sixteen wide mobile"].column,
  490. .ui.grid > .column.row > [class*="sixteen wide mobile"].column,
  491. .ui.grid > [class*="sixteen wide mobile"].column,
  492. .ui.column.grid > [class*="sixteen wide mobile"].column {
  493. width: 100% !important;
  494. }
  495. }
  496. /* Tablet Sizing Combinations */
  497. @media only screen and (min-width: 768px) and (max-width: 991px) {
  498. .ui.grid > .row > [class*="one wide tablet"].column,
  499. .ui.grid > .column.row > [class*="one wide tablet"].column,
  500. .ui.grid > [class*="one wide tablet"].column,
  501. .ui.column.grid > [class*="one wide tablet"].column {
  502. width: 6.25% !important;
  503. }
  504. .ui.grid > .row > [class*="two wide tablet"].column,
  505. .ui.grid > .column.row > [class*="two wide tablet"].column,
  506. .ui.grid > [class*="two wide tablet"].column,
  507. .ui.column.grid > [class*="two wide tablet"].column {
  508. width: 12.5% !important;
  509. }
  510. .ui.grid > .row > [class*="three wide tablet"].column,
  511. .ui.grid > .column.row > [class*="three wide tablet"].column,
  512. .ui.grid > [class*="three wide tablet"].column,
  513. .ui.column.grid > [class*="three wide tablet"].column {
  514. width: 18.75% !important;
  515. }
  516. .ui.grid > .row > [class*="four wide tablet"].column,
  517. .ui.grid > .column.row > [class*="four wide tablet"].column,
  518. .ui.grid > [class*="four wide tablet"].column,
  519. .ui.column.grid > [class*="four wide tablet"].column {
  520. width: 25% !important;
  521. }
  522. .ui.grid > .row > [class*="five wide tablet"].column,
  523. .ui.grid > .column.row > [class*="five wide tablet"].column,
  524. .ui.grid > [class*="five wide tablet"].column,
  525. .ui.column.grid > [class*="five wide tablet"].column {
  526. width: 31.25% !important;
  527. }
  528. .ui.grid > .row > [class*="six wide tablet"].column,
  529. .ui.grid > .column.row > [class*="six wide tablet"].column,
  530. .ui.grid > [class*="six wide tablet"].column,
  531. .ui.column.grid > [class*="six wide tablet"].column {
  532. width: 37.5% !important;
  533. }
  534. .ui.grid > .row > [class*="seven wide tablet"].column,
  535. .ui.grid > .column.row > [class*="seven wide tablet"].column,
  536. .ui.grid > [class*="seven wide tablet"].column,
  537. .ui.column.grid > [class*="seven wide tablet"].column {
  538. width: 43.75% !important;
  539. }
  540. .ui.grid > .row > [class*="eight wide tablet"].column,
  541. .ui.grid > .column.row > [class*="eight wide tablet"].column,
  542. .ui.grid > [class*="eight wide tablet"].column,
  543. .ui.column.grid > [class*="eight wide tablet"].column {
  544. width: 50% !important;
  545. }
  546. .ui.grid > .row > [class*="nine wide tablet"].column,
  547. .ui.grid > .column.row > [class*="nine wide tablet"].column,
  548. .ui.grid > [class*="nine wide tablet"].column,
  549. .ui.column.grid > [class*="nine wide tablet"].column {
  550. width: 56.25% !important;
  551. }
  552. .ui.grid > .row > [class*="ten wide tablet"].column,
  553. .ui.grid > .column.row > [class*="ten wide tablet"].column,
  554. .ui.grid > [class*="ten wide tablet"].column,
  555. .ui.column.grid > [class*="ten wide tablet"].column {
  556. width: 62.5% !important;
  557. }
  558. .ui.grid > .row > [class*="eleven wide tablet"].column,
  559. .ui.grid > .column.row > [class*="eleven wide tablet"].column,
  560. .ui.grid > [class*="eleven wide tablet"].column,
  561. .ui.column.grid > [class*="eleven wide tablet"].column {
  562. width: 68.75% !important;
  563. }
  564. .ui.grid > .row > [class*="twelve wide tablet"].column,
  565. .ui.grid > .column.row > [class*="twelve wide tablet"].column,
  566. .ui.grid > [class*="twelve wide tablet"].column,
  567. .ui.column.grid > [class*="twelve wide tablet"].column {
  568. width: 75% !important;
  569. }
  570. .ui.grid > .row > [class*="thirteen wide tablet"].column,
  571. .ui.grid > .column.row > [class*="thirteen wide tablet"].column,
  572. .ui.grid > [class*="thirteen wide tablet"].column,
  573. .ui.column.grid > [class*="thirteen wide tablet"].column {
  574. width: 81.25% !important;
  575. }
  576. .ui.grid > .row > [class*="fourteen wide tablet"].column,
  577. .ui.grid > .column.row > [class*="fourteen wide tablet"].column,
  578. .ui.grid > [class*="fourteen wide tablet"].column,
  579. .ui.column.grid > [class*="fourteen wide tablet"].column {
  580. width: 87.5% !important;
  581. }
  582. .ui.grid > .row > [class*="fifteen wide tablet"].column,
  583. .ui.grid > .column.row > [class*="fifteen wide tablet"].column,
  584. .ui.grid > [class*="fifteen wide tablet"].column,
  585. .ui.column.grid > [class*="fifteen wide tablet"].column {
  586. width: 93.75% !important;
  587. }
  588. .ui.grid > .row > [class*="sixteen wide tablet"].column,
  589. .ui.grid > .column.row > [class*="sixteen wide tablet"].column,
  590. .ui.grid > [class*="sixteen wide tablet"].column,
  591. .ui.column.grid > [class*="sixteen wide tablet"].column {
  592. width: 100% !important;
  593. }
  594. }
  595. /* Computer/Desktop Sizing Combinations */
  596. @media only screen and (min-width: 992px) {
  597. .ui.grid > .row > [class*="one wide computer"].column,
  598. .ui.grid > .column.row > [class*="one wide computer"].column,
  599. .ui.grid > [class*="one wide computer"].column,
  600. .ui.column.grid > [class*="one wide computer"].column {
  601. width: 6.25% !important;
  602. }
  603. .ui.grid > .row > [class*="two wide computer"].column,
  604. .ui.grid > .column.row > [class*="two wide computer"].column,
  605. .ui.grid > [class*="two wide computer"].column,
  606. .ui.column.grid > [class*="two wide computer"].column {
  607. width: 12.5% !important;
  608. }
  609. .ui.grid > .row > [class*="three wide computer"].column,
  610. .ui.grid > .column.row > [class*="three wide computer"].column,
  611. .ui.grid > [class*="three wide computer"].column,
  612. .ui.column.grid > [class*="three wide computer"].column {
  613. width: 18.75% !important;
  614. }
  615. .ui.grid > .row > [class*="four wide computer"].column,
  616. .ui.grid > .column.row > [class*="four wide computer"].column,
  617. .ui.grid > [class*="four wide computer"].column,
  618. .ui.column.grid > [class*="four wide computer"].column {
  619. width: 25% !important;
  620. }
  621. .ui.grid > .row > [class*="five wide computer"].column,
  622. .ui.grid > .column.row > [class*="five wide computer"].column,
  623. .ui.grid > [class*="five wide computer"].column,
  624. .ui.column.grid > [class*="five wide computer"].column {
  625. width: 31.25% !important;
  626. }
  627. .ui.grid > .row > [class*="six wide computer"].column,
  628. .ui.grid > .column.row > [class*="six wide computer"].column,
  629. .ui.grid > [class*="six wide computer"].column,
  630. .ui.column.grid > [class*="six wide computer"].column {
  631. width: 37.5% !important;
  632. }
  633. .ui.grid > .row > [class*="seven wide computer"].column,
  634. .ui.grid > .column.row > [class*="seven wide computer"].column,
  635. .ui.grid > [class*="seven wide computer"].column,
  636. .ui.column.grid > [class*="seven wide computer"].column {
  637. width: 43.75% !important;
  638. }
  639. .ui.grid > .row > [class*="eight wide computer"].column,
  640. .ui.grid > .column.row > [class*="eight wide computer"].column,
  641. .ui.grid > [class*="eight wide computer"].column,
  642. .ui.column.grid > [class*="eight wide computer"].column {
  643. width: 50% !important;
  644. }
  645. .ui.grid > .row > [class*="nine wide computer"].column,
  646. .ui.grid > .column.row > [class*="nine wide computer"].column,
  647. .ui.grid > [class*="nine wide computer"].column,
  648. .ui.column.grid > [class*="nine wide computer"].column {
  649. width: 56.25% !important;
  650. }
  651. .ui.grid > .row > [class*="ten wide computer"].column,
  652. .ui.grid > .column.row > [class*="ten wide computer"].column,
  653. .ui.grid > [class*="ten wide computer"].column,
  654. .ui.column.grid > [class*="ten wide computer"].column {
  655. width: 62.5% !important;
  656. }
  657. .ui.grid > .row > [class*="eleven wide computer"].column,
  658. .ui.grid > .column.row > [class*="eleven wide computer"].column,
  659. .ui.grid > [class*="eleven wide computer"].column,
  660. .ui.column.grid > [class*="eleven wide computer"].column {
  661. width: 68.75% !important;
  662. }
  663. .ui.grid > .row > [class*="twelve wide computer"].column,
  664. .ui.grid > .column.row > [class*="twelve wide computer"].column,
  665. .ui.grid > [class*="twelve wide computer"].column,
  666. .ui.column.grid > [class*="twelve wide computer"].column {
  667. width: 75% !important;
  668. }
  669. .ui.grid > .row > [class*="thirteen wide computer"].column,
  670. .ui.grid > .column.row > [class*="thirteen wide computer"].column,
  671. .ui.grid > [class*="thirteen wide computer"].column,
  672. .ui.column.grid > [class*="thirteen wide computer"].column {
  673. width: 81.25% !important;
  674. }
  675. .ui.grid > .row > [class*="fourteen wide computer"].column,
  676. .ui.grid > .column.row > [class*="fourteen wide computer"].column,
  677. .ui.grid > [class*="fourteen wide computer"].column,
  678. .ui.column.grid > [class*="fourteen wide computer"].column {
  679. width: 87.5% !important;
  680. }
  681. .ui.grid > .row > [class*="fifteen wide computer"].column,
  682. .ui.grid > .column.row > [class*="fifteen wide computer"].column,
  683. .ui.grid > [class*="fifteen wide computer"].column,
  684. .ui.column.grid > [class*="fifteen wide computer"].column {
  685. width: 93.75% !important;
  686. }
  687. .ui.grid > .row > [class*="sixteen wide computer"].column,
  688. .ui.grid > .column.row > [class*="sixteen wide computer"].column,
  689. .ui.grid > [class*="sixteen wide computer"].column,
  690. .ui.column.grid > [class*="sixteen wide computer"].column {
  691. width: 100% !important;
  692. }
  693. }
  694. /* Large Monitor Sizing Combinations */
  695. @media only screen and (min-width: 1400px) and (max-width: 1919px) {
  696. .ui.grid > .row > [class*="one wide large screen"].column,
  697. .ui.grid > .column.row > [class*="one wide large screen"].column,
  698. .ui.grid > [class*="one wide large screen"].column,
  699. .ui.column.grid > [class*="one wide large screen"].column {
  700. width: 6.25% !important;
  701. }
  702. .ui.grid > .row > [class*="two wide large screen"].column,
  703. .ui.grid > .column.row > [class*="two wide large screen"].column,
  704. .ui.grid > [class*="two wide large screen"].column,
  705. .ui.column.grid > [class*="two wide large screen"].column {
  706. width: 12.5% !important;
  707. }
  708. .ui.grid > .row > [class*="three wide large screen"].column,
  709. .ui.grid > .column.row > [class*="three wide large screen"].column,
  710. .ui.grid > [class*="three wide large screen"].column,
  711. .ui.column.grid > [class*="three wide large screen"].column {
  712. width: 18.75% !important;
  713. }
  714. .ui.grid > .row > [class*="four wide large screen"].column,
  715. .ui.grid > .column.row > [class*="four wide large screen"].column,
  716. .ui.grid > [class*="four wide large screen"].column,
  717. .ui.column.grid > [class*="four wide large screen"].column {
  718. width: 25% !important;
  719. }
  720. .ui.grid > .row > [class*="five wide large screen"].column,
  721. .ui.grid > .column.row > [class*="five wide large screen"].column,
  722. .ui.grid > [class*="five wide large screen"].column,
  723. .ui.column.grid > [class*="five wide large screen"].column {
  724. width: 31.25% !important;
  725. }
  726. .ui.grid > .row > [class*="six wide large screen"].column,
  727. .ui.grid > .column.row > [class*="six wide large screen"].column,
  728. .ui.grid > [class*="six wide large screen"].column,
  729. .ui.column.grid > [class*="six wide large screen"].column {
  730. width: 37.5% !important;
  731. }
  732. .ui.grid > .row > [class*="seven wide large screen"].column,
  733. .ui.grid > .column.row > [class*="seven wide large screen"].column,
  734. .ui.grid > [class*="seven wide large screen"].column,
  735. .ui.column.grid > [class*="seven wide large screen"].column {
  736. width: 43.75% !important;
  737. }
  738. .ui.grid > .row > [class*="eight wide large screen"].column,
  739. .ui.grid > .column.row > [class*="eight wide large screen"].column,
  740. .ui.grid > [class*="eight wide large screen"].column,
  741. .ui.column.grid > [class*="eight wide large screen"].column {
  742. width: 50% !important;
  743. }
  744. .ui.grid > .row > [class*="nine wide large screen"].column,
  745. .ui.grid > .column.row > [class*="nine wide large screen"].column,
  746. .ui.grid > [class*="nine wide large screen"].column,
  747. .ui.column.grid > [class*="nine wide large screen"].column {
  748. width: 56.25% !important;
  749. }
  750. .ui.grid > .row > [class*="ten wide large screen"].column,
  751. .ui.grid > .column.row > [class*="ten wide large screen"].column,
  752. .ui.grid > [class*="ten wide large screen"].column,
  753. .ui.column.grid > [class*="ten wide large screen"].column {
  754. width: 62.5% !important;
  755. }
  756. .ui.grid > .row > [class*="eleven wide large screen"].column,
  757. .ui.grid > .column.row > [class*="eleven wide large screen"].column,
  758. .ui.grid > [class*="eleven wide large screen"].column,
  759. .ui.column.grid > [class*="eleven wide large screen"].column {
  760. width: 68.75% !important;
  761. }
  762. .ui.grid > .row > [class*="twelve wide large screen"].column,
  763. .ui.grid > .column.row > [class*="twelve wide large screen"].column,
  764. .ui.grid > [class*="twelve wide large screen"].column,
  765. .ui.column.grid > [class*="twelve wide large screen"].column {
  766. width: 75% !important;
  767. }
  768. .ui.grid > .row > [class*="thirteen wide large screen"].column,
  769. .ui.grid > .column.row > [class*="thirteen wide large screen"].column,
  770. .ui.grid > [class*="thirteen wide large screen"].column,
  771. .ui.column.grid > [class*="thirteen wide large screen"].column {
  772. width: 81.25% !important;
  773. }
  774. .ui.grid > .row > [class*="fourteen wide large screen"].column,
  775. .ui.grid > .column.row > [class*="fourteen wide large screen"].column,
  776. .ui.grid > [class*="fourteen wide large screen"].column,
  777. .ui.column.grid > [class*="fourteen wide large screen"].column {
  778. width: 87.5% !important;
  779. }
  780. .ui.grid > .row > [class*="fifteen wide large screen"].column,
  781. .ui.grid > .column.row > [class*="fifteen wide large screen"].column,
  782. .ui.grid > [class*="fifteen wide large screen"].column,
  783. .ui.column.grid > [class*="fifteen wide large screen"].column {
  784. width: 93.75% !important;
  785. }
  786. .ui.grid > .row > [class*="sixteen wide large screen"].column,
  787. .ui.grid > .column.row > [class*="sixteen wide large screen"].column,
  788. .ui.grid > [class*="sixteen wide large screen"].column,
  789. .ui.column.grid > [class*="sixteen wide large screen"].column {
  790. width: 100% !important;
  791. }
  792. }
  793. /* Widescreen Sizing Combinations */
  794. @media only screen and (min-width: 1920px) {
  795. .ui.grid > .row > [class*="one wide widescreen"].column,
  796. .ui.grid > .column.row > [class*="one wide widescreen"].column,
  797. .ui.grid > [class*="one wide widescreen"].column,
  798. .ui.column.grid > [class*="one wide widescreen"].column {
  799. width: 6.25% !important;
  800. }
  801. .ui.grid > .row > [class*="two wide widescreen"].column,
  802. .ui.grid > .column.row > [class*="two wide widescreen"].column,
  803. .ui.grid > [class*="two wide widescreen"].column,
  804. .ui.column.grid > [class*="two wide widescreen"].column {
  805. width: 12.5% !important;
  806. }
  807. .ui.grid > .row > [class*="three wide widescreen"].column,
  808. .ui.grid > .column.row > [class*="three wide widescreen"].column,
  809. .ui.grid > [class*="three wide widescreen"].column,
  810. .ui.column.grid > [class*="three wide widescreen"].column {
  811. width: 18.75% !important;
  812. }
  813. .ui.grid > .row > [class*="four wide widescreen"].column,
  814. .ui.grid > .column.row > [class*="four wide widescreen"].column,
  815. .ui.grid > [class*="four wide widescreen"].column,
  816. .ui.column.grid > [class*="four wide widescreen"].column {
  817. width: 25% !important;
  818. }
  819. .ui.grid > .row > [class*="five wide widescreen"].column,
  820. .ui.grid > .column.row > [class*="five wide widescreen"].column,
  821. .ui.grid > [class*="five wide widescreen"].column,
  822. .ui.column.grid > [class*="five wide widescreen"].column {
  823. width: 31.25% !important;
  824. }
  825. .ui.grid > .row > [class*="six wide widescreen"].column,
  826. .ui.grid > .column.row > [class*="six wide widescreen"].column,
  827. .ui.grid > [class*="six wide widescreen"].column,
  828. .ui.column.grid > [class*="six wide widescreen"].column {
  829. width: 37.5% !important;
  830. }
  831. .ui.grid > .row > [class*="seven wide widescreen"].column,
  832. .ui.grid > .column.row > [class*="seven wide widescreen"].column,
  833. .ui.grid > [class*="seven wide widescreen"].column,
  834. .ui.column.grid > [class*="seven wide widescreen"].column {
  835. width: 43.75% !important;
  836. }
  837. .ui.grid > .row > [class*="eight wide widescreen"].column,
  838. .ui.grid > .column.row > [class*="eight wide widescreen"].column,
  839. .ui.grid > [class*="eight wide widescreen"].column,
  840. .ui.column.grid > [class*="eight wide widescreen"].column {
  841. width: 50% !important;
  842. }
  843. .ui.grid > .row > [class*="nine wide widescreen"].column,
  844. .ui.grid > .column.row > [class*="nine wide widescreen"].column,
  845. .ui.grid > [class*="nine wide widescreen"].column,
  846. .ui.column.grid > [class*="nine wide widescreen"].column {
  847. width: 56.25% !important;
  848. }
  849. .ui.grid > .row > [class*="ten wide widescreen"].column,
  850. .ui.grid > .column.row > [class*="ten wide widescreen"].column,
  851. .ui.grid > [class*="ten wide widescreen"].column,
  852. .ui.column.grid > [class*="ten wide widescreen"].column {
  853. width: 62.5% !important;
  854. }
  855. .ui.grid > .row > [class*="eleven wide widescreen"].column,
  856. .ui.grid > .column.row > [class*="eleven wide widescreen"].column,
  857. .ui.grid > [class*="eleven wide widescreen"].column,
  858. .ui.column.grid > [class*="eleven wide widescreen"].column {
  859. width: 68.75% !important;
  860. }
  861. .ui.grid > .row > [class*="twelve wide widescreen"].column,
  862. .ui.grid > .column.row > [class*="twelve wide widescreen"].column,
  863. .ui.grid > [class*="twelve wide widescreen"].column,
  864. .ui.column.grid > [class*="twelve wide widescreen"].column {
  865. width: 75% !important;
  866. }
  867. .ui.grid > .row > [class*="thirteen wide widescreen"].column,
  868. .ui.grid > .column.row > [class*="thirteen wide widescreen"].column,
  869. .ui.grid > [class*="thirteen wide widescreen"].column,
  870. .ui.column.grid > [class*="thirteen wide widescreen"].column {
  871. width: 81.25% !important;
  872. }
  873. .ui.grid > .row > [class*="fourteen wide widescreen"].column,
  874. .ui.grid > .column.row > [class*="fourteen wide widescreen"].column,
  875. .ui.grid > [class*="fourteen wide widescreen"].column,
  876. .ui.column.grid > [class*="fourteen wide widescreen"].column {
  877. width: 87.5% !important;
  878. }
  879. .ui.grid > .row > [class*="fifteen wide widescreen"].column,
  880. .ui.grid > .column.row > [class*="fifteen wide widescreen"].column,
  881. .ui.grid > [class*="fifteen wide widescreen"].column,
  882. .ui.column.grid > [class*="fifteen wide widescreen"].column {
  883. width: 93.75% !important;
  884. }
  885. .ui.grid > .row > [class*="sixteen wide widescreen"].column,
  886. .ui.grid > .column.row > [class*="sixteen wide widescreen"].column,
  887. .ui.grid > [class*="sixteen wide widescreen"].column,
  888. .ui.column.grid > [class*="sixteen wide widescreen"].column {
  889. width: 100% !important;
  890. }
  891. }
  892. /*----------------------
  893. Centered
  894. -----------------------*/
  895. .ui.centered.grid,
  896. .ui.centered.grid > .row,
  897. .ui.grid > .centered.row {
  898. text-align: center;
  899. }
  900. .ui.centered.grid > .column:not(.aligned):not(.row),
  901. .ui.centered.grid > .row > .column:not(.aligned),
  902. .ui.centered.grid > .row:not(.centered),
  903. .ui.grid .centered.row > .column:not(.aligned) {
  904. text-align: left;
  905. }
  906. .ui.grid > .centered.column,
  907. .ui.grid > .row > .centered.column {
  908. display: block;
  909. margin-left: auto;
  910. margin-right: auto;
  911. }
  912. /*----------------------
  913. Relaxed
  914. -----------------------*/
  915. .ui.relaxed.grid > .column:not(.row),
  916. .ui.relaxed.grid > .row > .column,
  917. .ui.grid > .relaxed.row > .column {
  918. padding-left: 1.5rem;
  919. padding-right: 1.5rem;
  920. }
  921. .ui[class*="very relaxed"].grid > .column:not(.row),
  922. .ui[class*="very relaxed"].grid > .row > .column,
  923. .ui.grid > [class*="very relaxed"].row > .column {
  924. padding-left: 2.5rem;
  925. padding-right: 2.5rem;
  926. }
  927. /* Coupling with UI Divider */
  928. .ui.relaxed.grid .row + .ui.divider,
  929. .ui.grid .relaxed.row + .ui.divider {
  930. margin-left: 1.5rem;
  931. margin-right: 1.5rem;
  932. }
  933. .ui[class*="very relaxed"].grid .row + .ui.divider,
  934. .ui.grid [class*="very relaxed"].row + .ui.divider {
  935. margin-left: 2.5rem;
  936. margin-right: 2.5rem;
  937. }
  938. /*----------------------
  939. Padded
  940. -----------------------*/
  941. .ui.padded.grid:not(.vertically):not(.horizontally) {
  942. margin: 0em !important;
  943. }
  944. [class*="horizontally padded"].ui.grid {
  945. margin-left: 0em !important;
  946. margin-right: 0em !important;
  947. }
  948. [class*="vertically padded"].ui.grid {
  949. margin-top: 0em !important;
  950. margin-bottom: 0em !important;
  951. }
  952. /*----------------------
  953. "Floated"
  954. -----------------------*/
  955. .ui.grid [class*="left floated"].column {
  956. float: left;
  957. }
  958. .ui.grid [class*="right floated"].column {
  959. float: right;
  960. }
  961. /*----------------------
  962. Divided
  963. -----------------------*/
  964. .ui.divided.grid:not([class*="vertically divided"]) > .column:not(.row),
  965. .ui.divided.grid:not([class*="vertically divided"]) > .row > .column {
  966. box-shadow: -1px 0px 0px 0px rgba(39, 41, 43, 0.15);
  967. }
  968. /* Swap from padding to margin on columns to have dividers align */
  969. .ui[class*="vertically divided"].grid > .column:not(.row),
  970. .ui[class*="vertically divided"].grid > .row > .column {
  971. margin-top: 1rem;
  972. margin-bottom: 1rem;
  973. padding-top: 0rem;
  974. padding-bottom: 0rem;
  975. }
  976. .ui[class*="vertically divided"].grid > .row {
  977. margin-top: 0em;
  978. margin-bottom: 0em;
  979. padding-top: 0em;
  980. padding-bottom: 0em;
  981. }
  982. /* No divider on first column on row */
  983. .ui.divided.grid:not([class*="vertically divided"]) > .column:first-child,
  984. .ui.divided.grid:not([class*="vertically divided"]) > .row > .column:first-child {
  985. box-shadow: none;
  986. }
  987. /* Divided Row */
  988. .ui.grid > .divided.row > .column {
  989. box-shadow: -1px 0px 0px 0px rgba(39, 41, 43, 0.15);
  990. }
  991. .ui.grid > .divided.row > .column:first-child {
  992. box-shadow: none;
  993. }
  994. /* Vertically Divided */
  995. .ui[class*="vertically divided"].grid > .row {
  996. position: relative;
  997. }
  998. .ui[class*="vertically divided"].grid > .row:before {
  999. position: absolute;
  1000. content: "";
  1001. top: 0em;
  1002. left: 0px;
  1003. width: -webkit-calc(100% - 2rem );
  1004. width: calc(100% - 2rem );
  1005. height: 1px;
  1006. margin: 0% 1rem;
  1007. box-shadow: 0px -1px 0px 0px rgba(39, 41, 43, 0.15);
  1008. }
  1009. /* Padded Horizontally Divided */
  1010. [class*="horizontally padded"].ui.divided.grid,
  1011. .ui.padded.divided.grid:not(.vertically):not(.horizontally) {
  1012. width: 100%;
  1013. }
  1014. /* First Row Vertically Divided */
  1015. .ui[class*="vertically divided"].grid > .row:first-child:before {
  1016. box-shadow: none;
  1017. }
  1018. /* Inverted Divided */
  1019. .ui.inverted.divided.grid:not([class*="vertically divided"]) > .column:not(.row),
  1020. .ui.inverted.divided.grid:not([class*="vertically divided"]) > .row > .column {
  1021. box-shadow: -1px 0px 0px 0px rgba(255, 255, 255, 0.2);
  1022. }
  1023. .ui.inverted.divided.grid:not([class*="vertically divided"]) > .column:not(.row):first-child,
  1024. .ui.inverted.divided.grid:not([class*="vertically divided"]) > .row > .column:first-child {
  1025. box-shadow: none;
  1026. }
  1027. .ui.inverted[class*="vertically divided"].grid > .row:before {
  1028. box-shadow: 0px -1px 0px 0px rgba(255, 255, 255, 0.2);
  1029. }
  1030. /* Relaxed */
  1031. .ui.relaxed[class*="vertically divided"].grid > .row:before {
  1032. margin-left: 1.5rem;
  1033. margin-right: 1.5rem;
  1034. width: -webkit-calc(100% - 3rem );
  1035. width: calc(100% - 3rem );
  1036. }
  1037. .ui[class*="very relaxed"][class*="vertically divided"].grid > .row:before {
  1038. margin-left: 5rem;
  1039. margin-right: 5rem;
  1040. width: -webkit-calc(100% - 5rem );
  1041. width: calc(100% - 5rem );
  1042. }
  1043. /*----------------------
  1044. Celled
  1045. -----------------------*/
  1046. .ui.celled.grid {
  1047. display: table;
  1048. table-layout: fixed;
  1049. width: 100%;
  1050. margin: 1em 0em;
  1051. box-shadow: 0px 0px 0px 1px #d4d4d5;
  1052. }
  1053. .ui.celled.grid > .row,
  1054. .ui.celled.grid > .column.row,
  1055. .ui.celled.grid > .column.row:first-child {
  1056. display: table;
  1057. table-layout: fixed;
  1058. width: 100% !important;
  1059. margin: 0em;
  1060. padding: 0em;
  1061. box-shadow: 0px -1px 0px 0px #d4d4d5;
  1062. }
  1063. .ui.celled.grid > .column:not(.row),
  1064. .ui.celled.grid > .row > .column {
  1065. display: table-cell;
  1066. box-shadow: -1px 0px 0px 0px #d4d4d5;
  1067. }
  1068. .ui.celled.grid > .column:first-child,
  1069. .ui.celled.grid > .row > .column:first-child {
  1070. box-shadow: none;
  1071. }
  1072. .ui.celled.page.grid {
  1073. box-shadow: none;
  1074. }
  1075. .ui.celled.grid > .column:not(.row),
  1076. .ui.celled.grid > .row > .column {
  1077. padding: 0.75em;
  1078. }
  1079. .ui.relaxed.celled.grid > .column:not(.row),
  1080. .ui.relaxed.celled.grid > .row > .column {
  1081. padding: 1em;
  1082. }
  1083. .ui[class*="very relaxed"].celled.grid > .column:not(.row),
  1084. .ui[class*="very relaxed"].celled.grid > .row > .column {
  1085. padding: 2em;
  1086. }
  1087. /* Internally Celled */
  1088. .ui[class*="internally celled"].grid {
  1089. box-shadow: none;
  1090. }
  1091. .ui[class*="internally celled"].grid > .row:first-child {
  1092. box-shadow: none;
  1093. }
  1094. .ui[class*="internally celled"].grid > .row > .column:first-child {
  1095. box-shadow: none;
  1096. }
  1097. /*----------------------
  1098. Horizontally Centered
  1099. -----------------------*/
  1100. /* Left Aligned */
  1101. .ui[class*="left aligned"].grid,
  1102. .ui[class*="left aligned"].grid > .row > .column,
  1103. .ui[class*="left aligned"].grid > .column,
  1104. .ui.grid [class*="left aligned"].column,
  1105. .ui.grid > [class*="left aligned"].row > .column {
  1106. text-align: left;
  1107. }
  1108. .ui.grid [class*="left aligned"].column {
  1109. text-align: left !important;
  1110. }
  1111. /* Center Aligned */
  1112. .ui[class*="center aligned"].grid,
  1113. .ui[class*="center aligned"].grid > .row > .column,
  1114. .ui[class*="center aligned"].grid > .column,
  1115. .ui.grid > [class*="center aligned"].row > .column {
  1116. text-align: center;
  1117. }
  1118. .ui.grid [class*="center aligned"].column {
  1119. text-align: center !important;
  1120. }
  1121. /* Right Aligned */
  1122. .ui[class*="right aligned"].grid,
  1123. .ui[class*="right aligned"].grid > .row > .column,
  1124. .ui[class*="right aligned"].grid > .column,
  1125. .ui.grid > [class*="right aligned"].row > .column {
  1126. text-align: right;
  1127. }
  1128. .ui.grid [class*="right aligned"].column {
  1129. text-align: right !important;
  1130. }
  1131. /* Justified */
  1132. .ui.justified.grid,
  1133. .ui.justified.grid > .row > .column,
  1134. .ui.justified.grid > .column,
  1135. .ui.grid .justified.column,
  1136. .ui.grid > .justified.row > .column {
  1137. text-align: justify;
  1138. -webkit-hyphens: auto;
  1139. -moz-hyphens: auto;
  1140. -ms-hyphens: auto;
  1141. hyphens: auto;
  1142. }
  1143. .ui.grid .justified.column {
  1144. text-align: justify !important;
  1145. -webkit-hyphens: auto !important;
  1146. -moz-hyphens: auto !important;
  1147. -ms-hyphens: auto !important;
  1148. hyphens: auto !important;
  1149. }
  1150. /*----------------------
  1151. Vertically Aligned
  1152. -----------------------*/
  1153. /* Top Aligned */
  1154. .ui[class*="top aligned"].grid,
  1155. .ui[class*="top aligned"].grid > .row > .column,
  1156. .ui[class*="top aligned"].grid > .column,
  1157. .ui.grid [class*="top aligned"].column,
  1158. .ui.grid > [class*="top aligned"].row > .column {
  1159. vertical-align: top;
  1160. }
  1161. .ui.grid [class*="top aligned"].column {
  1162. vertical-align: top !important;
  1163. }
  1164. /* Middle Aligned */
  1165. .ui[class*="middle aligned"].grid,
  1166. .ui[class*="middle aligned"].grid > .row > .column,
  1167. .ui[class*="middle aligned"].grid > .column,
  1168. .ui.grid > [class*="middle aligned"].row > .column {
  1169. vertical-align: middle;
  1170. -webkit-box-align: center;
  1171. -webkit-align-items: center;
  1172. -ms-flex-align: center;
  1173. align-items: center;
  1174. }
  1175. .ui.grid [class*="middle aligned"].column {
  1176. vertical-align: middle !important;
  1177. }
  1178. /* Bottom Aligned */
  1179. .ui[class*="bottom aligned"].grid,
  1180. .ui[class*="bottom aligned"].grid > .row > .column,
  1181. .ui[class*="bottom aligned"].grid > .column,
  1182. .ui.grid > [class*="bottom aligned"].row > .column {
  1183. vertical-align: bottom;
  1184. -webkit-box-align: end;
  1185. -webkit-align-items: flex-end;
  1186. -ms-flex-align: end;
  1187. align-items: flex-end;
  1188. }
  1189. .ui.grid [class*="bottom aligned"].column {
  1190. vertical-align: bottom !important;
  1191. }
  1192. /*----------------------
  1193. Colored
  1194. -----------------------*/
  1195. .ui.grid > .white.row,
  1196. .ui.grid .white.column {
  1197. background-color: #ffffff !important;
  1198. color: rgba(0, 0, 0, 0.8);
  1199. }
  1200. .ui.grid > .row > .white.column {
  1201. margin-top: -1rem;
  1202. margin-bottom: -1rem;
  1203. padding-top: 1rem;
  1204. padding-bottom: 1rem;
  1205. }
  1206. .ui.grid > .black.row,
  1207. .ui.grid .black.column {
  1208. background-color: #1b1c1d !important;
  1209. color: #ffffff;
  1210. }
  1211. .ui.grid > .row > .black.column {
  1212. margin-top: -1rem;
  1213. margin-bottom: -1rem;
  1214. padding-top: 1rem;
  1215. padding-bottom: 1rem;
  1216. }
  1217. .ui.grid > .blue.row,
  1218. .ui.grid .blue.column {
  1219. background-color: #3b83c0 !important;
  1220. color: #ffffff;
  1221. }
  1222. .ui.grid > .row > .blue.column {
  1223. margin-top: -1rem;
  1224. margin-bottom: -1rem;
  1225. padding-top: 1rem;
  1226. padding-bottom: 1rem;
  1227. }
  1228. .ui.grid > .green.row,
  1229. .ui.grid .green.column {
  1230. background-color: #5bbd72 !important;
  1231. color: #ffffff;
  1232. }
  1233. .ui.grid > .row > .green.column {
  1234. margin-top: -1rem;
  1235. margin-bottom: -1rem;
  1236. padding-top: 1rem;
  1237. padding-bottom: 1rem;
  1238. }
  1239. .ui.grid > .orange.row,
  1240. .ui.grid .orange.column {
  1241. background-color: #e07b53 !important;
  1242. color: #ffffff;
  1243. }
  1244. .ui.grid > .row > .orange.column {
  1245. margin-top: -1rem;
  1246. margin-bottom: -1rem;
  1247. padding-top: 1rem;
  1248. padding-bottom: 1rem;
  1249. }
  1250. .ui.grid > .pink.row,
  1251. .ui.grid .pink.column {
  1252. background-color: #d9499a !important;
  1253. color: #ffffff;
  1254. }
  1255. .ui.grid > .row > .pink.column {
  1256. margin-top: -1rem;
  1257. margin-bottom: -1rem;
  1258. padding-top: 1rem;
  1259. padding-bottom: 1rem;
  1260. }
  1261. .ui.grid > .purple.row,
  1262. .ui.grid .purple.column {
  1263. background-color: #564f8a !important;
  1264. color: #ffffff;
  1265. }
  1266. .ui.grid > .row > .purple.column {
  1267. margin-top: -1rem;
  1268. margin-bottom: -1rem;
  1269. padding-top: 1rem;
  1270. padding-bottom: 1rem;
  1271. }
  1272. .ui.grid > .red.row,
  1273. .ui.grid .red.column {
  1274. background-color: #d95c5c !important;
  1275. color: #ffffff;
  1276. }
  1277. .ui.grid > .row > .red.column {
  1278. margin-top: -1rem;
  1279. margin-bottom: -1rem;
  1280. padding-top: 1rem;
  1281. padding-bottom: 1rem;
  1282. }
  1283. .ui.grid > .teal.row,
  1284. .ui.grid .teal.column {
  1285. background-color: #00b5ad !important;
  1286. color: #ffffff;
  1287. }
  1288. .ui.grid > .row > .teal.column {
  1289. margin-top: -1rem;
  1290. margin-bottom: -1rem;
  1291. padding-top: 1rem;
  1292. padding-bottom: 1rem;
  1293. }
  1294. .ui.grid > .yellow.row,
  1295. .ui.grid .yellow.column {
  1296. background-color: #f2c61f !important;
  1297. color: #ffffff;
  1298. }
  1299. .ui.grid > .row > .yellow.column {
  1300. margin-top: -1rem;
  1301. margin-bottom: -1rem;
  1302. padding-top: 1rem;
  1303. padding-bottom: 1rem;
  1304. }
  1305. /*----------------------
  1306. Equal Width
  1307. -----------------------*/
  1308. .ui[class*="equal width"].grid {
  1309. display: table;
  1310. table-layout: fixed;
  1311. }
  1312. .ui[class*="equal width"].grid > .row,
  1313. .ui.grid > [class*="equal width"].row {
  1314. display: table;
  1315. table-layout: fixed;
  1316. width: 100% !important;
  1317. }
  1318. .ui[class*="equal width"].grid > .column,
  1319. .ui[class*="equal width"].grid > .row > .column,
  1320. .ui.grid > [class*="equal width"].row > .column {
  1321. display: table-cell;
  1322. }
  1323. /* Flexbox (Experimental / Overrides Where Supported) */
  1324. .ui[class*="equal width"].grid {
  1325. display: -webkit-box;
  1326. display: -webkit-flex;
  1327. display: -ms-flexbox;
  1328. display: flex;
  1329. -webkit-box-orient: vertical;
  1330. -webkit-box-direction: normal;
  1331. -webkit-flex-direction: column;
  1332. -ms-flex-direction: column;
  1333. flex-direction: column;
  1334. }
  1335. .ui[class*="equal width"].grid > .row,
  1336. .ui.grid > [class*="equal width"].row {
  1337. display: -webkit-box;
  1338. display: -webkit-flex;
  1339. display: -ms-flexbox;
  1340. display: flex;
  1341. -webkit-box-orient: horizontal;
  1342. -webkit-box-direction: normal;
  1343. -webkit-flex-direction: row;
  1344. -ms-flex-direction: row;
  1345. flex-direction: row;
  1346. -webkit-box-align: stretch;
  1347. -webkit-align-items: stretch;
  1348. -ms-flex-align: stretch;
  1349. align-items: stretch;
  1350. }
  1351. .ui[class*="equal width"].grid > .column,
  1352. .ui[class*="equal width"].grid > .row > .column,
  1353. .ui.grid > [class*="equal width"].row > .column {
  1354. display: inline-block;
  1355. -webkit-box-orient: vertical;
  1356. -webkit-box-direction: normal;
  1357. -webkit-flex-direction: column;
  1358. -ms-flex-direction: column;
  1359. flex-direction: column;
  1360. -webkit-box-flex: 1;
  1361. -webkit-flex: 1 0 auto;
  1362. -ms-flex: 1 0 auto;
  1363. flex: 1 0 auto;
  1364. }
  1365. /*----------------------
  1366. Equal Height Columns
  1367. -----------------------*/
  1368. .ui[class*="equal height"].grid {
  1369. display: table;
  1370. table-layout: fixed;
  1371. }
  1372. .ui[class*="equal height"].grid > .row,
  1373. .ui.grid > [class*="equal height"].row {
  1374. display: table;
  1375. table-layout: fixed;
  1376. width: 100% !important;
  1377. }
  1378. .ui[class*="equal height"].grid > .column,
  1379. .ui[class*="equal height"].grid > .row > .column,
  1380. .ui.grid > [class*="equal height"].row > .column {
  1381. display: table-cell;
  1382. }
  1383. /* Flexbox (Experimental / Overrides Where Supported) */
  1384. .ui[class*="equal height"].grid,
  1385. .ui[class*="equal height"].grid > .row,
  1386. .ui.grid > [class*="equal height"].row {
  1387. display: -webkit-box;
  1388. display: -webkit-flex;
  1389. display: -ms-flexbox;
  1390. display: flex;
  1391. -webkit-box-orient: horizontal;
  1392. -webkit-box-direction: normal;
  1393. -webkit-flex-direction: row;
  1394. -ms-flex-direction: row;
  1395. flex-direction: row;
  1396. -webkit-box-align: stretch;
  1397. -webkit-align-items: stretch;
  1398. -ms-flex-align: stretch;
  1399. align-items: stretch;
  1400. }
  1401. .ui[class*="equal height"].grid > .column,
  1402. .ui[class*="equal height"].grid > .row > .column,
  1403. .ui.grid > [class*="equal height"].row > .column {
  1404. display: inline-block;
  1405. -webkit-box-orient: vertical;
  1406. -webkit-box-direction: normal;
  1407. -webkit-flex-direction: column;
  1408. -ms-flex-direction: column;
  1409. flex-direction: column;
  1410. -webkit-box-flex: 1;
  1411. -webkit-flex: 1 0 auto;
  1412. -ms-flex: 1 0 auto;
  1413. flex: 1 0 auto;
  1414. }
  1415. /*-------------------
  1416. Doubling
  1417. --------------------*/
  1418. /* Tablet Only */
  1419. @media only screen and (min-width: 768px) and (max-width: 991px) {
  1420. .ui.doubling.grid {
  1421. width: 100% !important;
  1422. }
  1423. .ui.grid > .doubling.row,
  1424. .ui.doubling.grid > .row {
  1425. margin: 0em !important;
  1426. padding: 0em !important;
  1427. }
  1428. .ui.grid > .doubling.row > .column,
  1429. .ui.doubling.grid > .row > .column {
  1430. display: inline-block !important;
  1431. padding-top: 1rem !important;
  1432. padding-bottom: 1rem !important;
  1433. margin: 0em;
  1434. }
  1435. .ui[class*="two column"].doubling.grid > .row > .column,
  1436. .ui[class*="two column"].doubling.grid > .column,
  1437. .ui.grid > [class*="two column"].doubling.row > .column {
  1438. width: 100% !important;
  1439. }
  1440. .ui[class*="three column"].doubling.grid > .row > .column,
  1441. .ui[class*="three column"].doubling.grid > .column,
  1442. .ui.grid > [class*="three column"].doubling.row > .column {
  1443. width: 50% !important;
  1444. }
  1445. .ui[class*="four column"].doubling.grid > .row > .column,
  1446. .ui[class*="four column"].doubling.grid > .column,
  1447. .ui.grid > [class*="four column"].doubling.row > .column {
  1448. width: 50% !important;
  1449. }
  1450. .ui[class*="five column"].doubling.grid > .row > .column,
  1451. .ui[class*="five column"].doubling.grid > .column,
  1452. .ui.grid > [class*="five column"].doubling.row > .column {
  1453. width: 33.33333333% !important;
  1454. }
  1455. .ui[class*="six column"].doubling.grid > .row > .column,
  1456. .ui[class*="six column"].doubling.grid > .column,
  1457. .ui.grid > [class*="six column"].doubling.row > .column {
  1458. width: 33.33333333% !important;
  1459. }
  1460. .ui[class*="seven column"].doubling.grid > .row > .column,
  1461. .ui[class*="seven column"].doubling.grid > .column,
  1462. .ui.grid > [class*="seven column"].doubling.row > .column {
  1463. width: 33.33333333% !important;
  1464. }
  1465. .ui[class*="eight column"].doubling.grid > .row > .column,
  1466. .ui[class*="eight column"].doubling.grid > .column,
  1467. .ui.grid > [class*="eight column"].doubling.row > .column {
  1468. width: 25% !important;
  1469. }
  1470. .ui[class*="nine column"].doubling.grid > .row > .column,
  1471. .ui[class*="nine column"].doubling.grid > .column,
  1472. .ui.grid > [class*="nine column"].doubling.row > .column {
  1473. width: 25% !important;
  1474. }
  1475. .ui[class*="ten column"].doubling.grid > .row > .column,
  1476. .ui[class*="ten column"].doubling.grid > .column,
  1477. .ui.grid > [class*="ten column"].doubling.row > .column {
  1478. width: 20% !important;
  1479. }
  1480. .ui[class*="eleven column"].doubling.grid > .row > .column,
  1481. .ui[class*="eleven column"].doubling.grid > .column,
  1482. .ui.grid > [class*="eleven column"].doubling.row > .column {
  1483. width: 20% !important;
  1484. }
  1485. .ui[class*="twelve column"].doubling.grid > .row > .column,
  1486. .ui[class*="twelve column"].doubling.grid > .column,
  1487. .ui.grid > [class*="twelve column"].doubling.row > .column {
  1488. width: 16.66666667% !important;
  1489. }
  1490. .ui[class*="thirteen column"].doubling.grid > .row > .column,
  1491. .ui[class*="thirteen column"].doubling.grid > .column,
  1492. .ui.grid > [class*="thirteen column"].doubling.row > .column {
  1493. width: 16.66666667% !important;
  1494. }
  1495. .ui[class*="fourteen column"].doubling.grid > .row > .column,
  1496. .ui[class*="fourteen column"].doubling.grid > .column,
  1497. .ui.grid > [class*="fourteen column"].doubling.row > .column {
  1498. width: 14.28571429% !important;
  1499. }
  1500. .ui[class*="fifteen column"].doubling.grid > .row > .column,
  1501. .ui[class*="fifteen column"].doubling.grid > .column,
  1502. .ui.grid > [class*="fifteen column"].doubling.row > .column {
  1503. width: 14.28571429% !important;
  1504. }
  1505. .ui[class*="sixteen column"].doubling.grid > .row > .column,
  1506. .ui[class*="sixteen column"].doubling.grid > .column,
  1507. .ui.grid > [class*="sixteen column"].doubling.row > .column {
  1508. width: 12.5% !important;
  1509. }
  1510. }
  1511. /* Mobily Only */
  1512. @media only screen and (max-width: 767px) {
  1513. .ui.grid > .doubling.row,
  1514. .ui.doubling.grid > .row {
  1515. display: block !important;
  1516. margin: 0em !important;
  1517. padding: 0em !important;
  1518. }
  1519. .ui.grid > .doubling.row > .column,
  1520. .ui.doubling.grid > .row > .column {
  1521. display: inline-block !important;
  1522. padding-top: 1rem !important;
  1523. padding-bottom: 1rem !important;
  1524. margin: 0em !important;
  1525. }
  1526. .ui[class*="two column"].doubling:not(.stackable).grid > .row > .column,
  1527. .ui[class*="two column"].doubling:not(.stackable).grid > .column,
  1528. .ui.grid > [class*="two column"].doubling:not(.stackable).row > .column {
  1529. width: 100% !important;
  1530. }
  1531. .ui[class*="three column"].doubling:not(.stackable).grid > .row > .column,
  1532. .ui[class*="three column"].doubling:not(.stackable).grid > .column,
  1533. .ui.grid > [class*="three column"].doubling:not(.stackable).row > .column {
  1534. width: 50% !important;
  1535. }
  1536. .ui[class*="four column"].doubling:not(.stackable).grid > .row > .column,
  1537. .ui[class*="four column"].doubling:not(.stackable).grid > .column,
  1538. .ui.grid > [class*="four column"].doubling:not(.stackable).row > .column {
  1539. width: 50% !important;
  1540. }
  1541. .ui[class*="five column"].doubling:not(.stackable).grid > .row > .column,
  1542. .ui[class*="five column"].doubling:not(.stackable).grid > .column,
  1543. .ui.grid > [class*="five column"].doubling:not(.stackable).row > .column {
  1544. width: 50% !important;
  1545. }
  1546. .ui[class*="six column"].doubling:not(.stackable).grid > .row > .column,
  1547. .ui[class*="six column"].doubling:not(.stackable).grid > .column,
  1548. .ui.grid > [class*="six column"].doubling:not(.stackable).row > .column {
  1549. width: 50% !important;
  1550. }
  1551. .ui[class*="seven column"].doubling:not(.stackable).grid > .row > .column,
  1552. .ui[class*="seven column"].doubling:not(.stackable).grid > .column,
  1553. .ui.grid > [class*="seven column"].doubling:not(.stackable).row > .column {
  1554. width: 50% !important;
  1555. }
  1556. .ui[class*="eight column"].doubling:not(.stackable).grid > .row > .column,
  1557. .ui[class*="eight column"].doubling:not(.stackable).grid > .column,
  1558. .ui.grid > [class*="eight column"].doubling:not(.stackable).row > .column {
  1559. width: 50% !important;
  1560. }
  1561. .ui[class*="nine column"].doubling:not(.stackable).grid > .row > .column,
  1562. .ui[class*="nine column"].doubling:not(.stackable).grid > .column,
  1563. .ui.grid > [class*="nine column"].doubling:not(.stackable).row > .column {
  1564. width: 33.33333333% !important;
  1565. }
  1566. .ui[class*="ten column"].doubling:not(.stackable).grid > .row > .column,
  1567. .ui[class*="ten column"].doubling:not(.stackable).grid > .column,
  1568. .ui.grid > [class*="ten column"].doubling:not(.stackable).row > .column {
  1569. width: 33.33333333% !important;
  1570. }
  1571. .ui[class*="eleven column"].doubling:not(.stackable).grid > .row > .column,
  1572. .ui[class*="eleven column"].doubling:not(.stackable).grid > .column,
  1573. .ui.grid > [class*="eleven column"].doubling:not(.stackable).row > .column {
  1574. width: 33.33333333% !important;
  1575. }
  1576. .ui[class*="twelve column"].doubling:not(.stackable).grid > .row > .column,
  1577. .ui[class*="twelve column"].doubling:not(.stackable).grid > .column,
  1578. .ui.grid > [class*="twelve column"].doubling:not(.stackable).row > .column {
  1579. width: 33.33333333% !important;
  1580. }
  1581. .ui[class*="thirteen column"].doubling:not(.stackable).grid > .row > .column,
  1582. .ui[class*="thirteen column"].doubling:not(.stackable).grid > .column,
  1583. .ui.grid > [class*="thirteen column"].doubling:not(.stackable).row > .column {
  1584. width: 33.33333333% !important;
  1585. }
  1586. .ui[class*="fourteen column"].doubling:not(.stackable).grid > .row > .column,
  1587. .ui[class*="fourteen column"].doubling:not(.stackable).grid > .column,
  1588. .ui.grid > [class*="fourteen column"].doubling:not(.stackable).row > .column {
  1589. width: 25% !important;
  1590. }
  1591. .ui[class*="fifteen column"].doubling:not(.stackable).grid > .row > .column,
  1592. .ui[class*="fifteen column"].doubling:not(.stackable).grid > .column,
  1593. .ui.grid > [class*="fifteen column"].doubling:not(.stackable).row > .column {
  1594. width: 25% !important;
  1595. }
  1596. .ui[class*="sixteen column"].doubling:not(.stackable).grid > .row > .column,
  1597. .ui[class*="sixteen column"].doubling:not(.stackable).grid > .column,
  1598. .ui.grid > [class*="sixteen column"].doubling:not(.stackable).row > .column {
  1599. width: 25% !important;
  1600. }
  1601. }
  1602. /*-------------------
  1603. Stackable
  1604. --------------------*/
  1605. @media only screen and (max-width: 767px) {
  1606. .ui.stackable.grid {
  1607. display: block !important;
  1608. width: auto;
  1609. margin-left: -1rem !important;
  1610. margin-right: -1rem !important;
  1611. padding: 0em;
  1612. }
  1613. .ui.stackable.grid > .row > .wide.column,
  1614. .ui.stackable.grid > .wide.column,
  1615. .ui.stackable.grid > .column.grid > .column,
  1616. .ui.stackable.grid > .column.row > .column,
  1617. .ui.stackable.grid > .row > .column,
  1618. .ui.stackable.grid > .column:not(.row) {
  1619. display: block !important;
  1620. width: auto !important;
  1621. margin: 0em 0em !important;
  1622. box-shadow: none !important;
  1623. padding: 1rem 1rem !important;
  1624. }
  1625. .ui.stackable.grid > .row {
  1626. margin: 0em;
  1627. padding: 0em;
  1628. }
  1629. .ui.stackable.page.grid {
  1630. margin-left: 0em !important;
  1631. margin-right: 0em !important;
  1632. }
  1633. /* Equal Height Stackable */
  1634. .ui[class*="equal height"].stackable.page.grid {
  1635. display: block !important;
  1636. }
  1637. /* Divided Stackable */
  1638. .ui.stackable.divided.grid > .row:first-child > .column:first-child,
  1639. .ui.stackable.celled.grid > .row:first-child > .column:first-child,
  1640. .ui.stackable.divided.grid > .column:not(.row):first-child,
  1641. .ui.stackable.celled.grid > .column:not(.row):first-child {
  1642. border-top: none !important;
  1643. }
  1644. .ui.inverted.stackable.celled.grid > .column:not(.row),
  1645. .ui.inverted.stackable.divided.grid > .column:not(.row),
  1646. .ui.inverted.stackable.celled.grid > .row > .column,
  1647. .ui.inverted.stackable.divided.grid > .row > .column {
  1648. border-top: 1px solid rgba(255, 255, 255, 0.2);
  1649. }
  1650. .ui.stackable.celled.grid > .column:not(.row),
  1651. .ui.stackable.divided.grid > .column:not(.row),
  1652. .ui.stackable.celled.grid > .row > .column,
  1653. .ui.stackable.divided.grid > .row > .column {
  1654. border-top: 1px solid rgba(39, 41, 43, 0.15);
  1655. box-shadow: none !important;
  1656. padding-top: 2rem !important;
  1657. padding-bottom: 2rem !important;
  1658. }
  1659. }
  1660. /*----------------------
  1661. Only (Device)
  1662. -----------------------*/
  1663. /* These include arbitrary class repetitions for forced specificity */
  1664. /* Mobile Only Hide */
  1665. @media only screen and (max-width: 767px) {
  1666. .ui.tablet:not(.mobile).only.grid.grid.grid,
  1667. .ui.grid.grid.grid > [class*="tablet only"].row:not(.mobile),
  1668. .ui.grid.grid.grid > [class*="tablet only"].column:not(.mobile),
  1669. .ui.grid.grid.grid > .row > [class*="tablet only"].column:not(.mobile) {
  1670. display: none !important;
  1671. }
  1672. .ui[class*="computer only"].grid.grid.grid:not(.mobile),
  1673. .ui.grid.grid.grid > [class*="computer only"].row:not(.mobile),
  1674. .ui.grid.grid.grid > [class*="computer only"].column:not(.mobile),
  1675. .ui.grid.grid.grid > .row > [class*="computer only"].column:not(.mobile) {
  1676. display: none !important;
  1677. }
  1678. }
  1679. /* Tablet Only Hide */
  1680. @media only screen and (min-width: 768px) and (max-width: 991px) {
  1681. .ui[class*="mobile only"].grid.grid.grid:not(.tablet),
  1682. .ui.grid.grid.grid > [class*="mobile only"].row:not(.tablet),
  1683. .ui.grid.grid.grid > [class*="mobile only"].column:not(.tablet),
  1684. .ui.grid.grid.grid > .row > [class*="mobile only"].column:not(.tablet) {
  1685. display: none !important;
  1686. }
  1687. .ui[class*="computer only"].grid.grid.grid:not(.tablet),
  1688. .ui.grid.grid.grid > [class*="computer only"].row:not(.tablet),
  1689. .ui.grid.grid.grid > [class*="computer only"].column:not(.tablet),
  1690. .ui.grid.grid.grid > .row > [class*="computer only"].column:not(.tablet) {
  1691. display: none !important;
  1692. }
  1693. }
  1694. /* Computer Only Hide */
  1695. @media only screen and (min-width: 992px) {
  1696. .ui[class*="mobile only"].grid.grid.grid:not(.computer),
  1697. .ui.grid.grid.grid > [class*="mobile only"].row:not(.computer),
  1698. .ui.grid.grid.grid > [class*="mobile only"].column:not(.computer),
  1699. .ui.grid.grid.grid > .row > [class*="mobile only"].column:not(.computer) {
  1700. display: none !important;
  1701. }
  1702. .ui[class*="tablet only"].grid.grid.grid:not(.computer),
  1703. .ui.grid.grid.grid > [class*="tablet only"].row:not(.computer),
  1704. .ui.grid.grid.grid > [class*="tablet only"].column:not(.computer),
  1705. .ui.grid.grid.grid > .row > [class*="tablet only"].column:not(.computer) {
  1706. display: none !important;
  1707. }
  1708. }
  1709. /*******************************
  1710. Theme Overrides
  1711. *******************************/
  1712. /*******************************
  1713. Site Overrides
  1714. *******************************/