1
0

dropdown.css 44 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192939495969798991001011021031041051061071081091101111121131141151161171181191201211221231241251261271281291301311321331341351361371381391401411421431441451461471481491501511521531541551561571581591601611621631641651661671681691701711721731741751761771781791801811821831841851861871881891901911921931941951961971981992002012022032042052062072082092102112122132142152162172182192202212222232242252262272282292302312322332342352362372382392402412422432442452462472482492502512522532542552562572582592602612622632642652662672682692702712722732742752762772782792802812822832842852862872882892902912922932942952962972982993003013023033043053063073083093103113123133143153163173183193203213223233243253263273283293303313323333343353363373383393403413423433443453463473483493503513523533543553563573583593603613623633643653663673683693703713723733743753763773783793803813823833843853863873883893903913923933943953963973983994004014024034044054064074084094104114124134144154164174184194204214224234244254264274284294304314324334344354364374384394404414424434444454464474484494504514524534544554564574584594604614624634644654664674684694704714724734744754764774784794804814824834844854864874884894904914924934944954964974984995005015025035045055065075085095105115125135145155165175185195205215225235245255265275285295305315325335345355365375385395405415425435445455465475485495505515525535545555565575585595605615625635645655665675685695705715725735745755765775785795805815825835845855865875885895905915925935945955965975985996006016026036046056066076086096106116126136146156166176186196206216226236246256266276286296306316326336346356366376386396406416426436446456466476486496506516526536546556566576586596606616626636646656666676686696706716726736746756766776786796806816826836846856866876886896906916926936946956966976986997007017027037047057067077087097107117127137147157167177187197207217227237247257267277287297307317327337347357367377387397407417427437447457467477487497507517527537547557567577587597607617627637647657667677687697707717727737747757767777787797807817827837847857867877887897907917927937947957967977987998008018028038048058068078088098108118128138148158168178188198208218228238248258268278288298308318328338348358368378388398408418428438448458468478488498508518528538548558568578588598608618628638648658668678688698708718728738748758768778788798808818828838848858868878888898908918928938948958968978988999009019029039049059069079089099109119129139149159169179189199209219229239249259269279289299309319329339349359369379389399409419429439449459469479489499509519529539549559569579589599609619629639649659669679689699709719729739749759769779789799809819829839849859869879889899909919929939949959969979989991000100110021003100410051006100710081009101010111012101310141015101610171018101910201021102210231024102510261027102810291030103110321033103410351036103710381039104010411042104310441045104610471048104910501051105210531054105510561057105810591060106110621063106410651066106710681069107010711072107310741075107610771078107910801081108210831084108510861087108810891090109110921093109410951096109710981099110011011102110311041105110611071108110911101111111211131114111511161117111811191120112111221123112411251126112711281129113011311132113311341135113611371138113911401141114211431144114511461147114811491150115111521153115411551156115711581159116011611162116311641165116611671168116911701171117211731174117511761177117811791180118111821183118411851186118711881189119011911192119311941195119611971198119912001201120212031204120512061207120812091210121112121213121412151216121712181219122012211222122312241225122612271228122912301231123212331234123512361237123812391240124112421243124412451246124712481249125012511252125312541255125612571258125912601261126212631264126512661267126812691270127112721273127412751276127712781279128012811282128312841285128612871288128912901291129212931294129512961297129812991300130113021303130413051306130713081309131013111312131313141315131613171318131913201321132213231324132513261327132813291330133113321333133413351336133713381339134013411342134313441345134613471348134913501351135213531354135513561357135813591360136113621363136413651366136713681369137013711372137313741375137613771378137913801381138213831384138513861387138813891390139113921393139413951396139713981399140014011402140314041405140614071408140914101411141214131414141514161417141814191420142114221423142414251426142714281429143014311432143314341435143614371438143914401441144214431444144514461447144814491450145114521453145414551456145714581459146014611462146314641465146614671468146914701471147214731474147514761477147814791480148114821483148414851486148714881489149014911492149314941495149614971498149915001501150215031504150515061507150815091510151115121513151415151516151715181519152015211522152315241525152615271528152915301531153215331534153515361537153815391540154115421543154415451546154715481549155015511552155315541555155615571558155915601561156215631564156515661567156815691570157115721573157415751576157715781579158015811582158315841585158615871588158915901591159215931594159515961597159815991600160116021603160416051606160716081609161016111612161316141615161616171618161916201621162216231624162516261627162816291630163116321633163416351636163716381639164016411642164316441645164616471648164916501651165216531654165516561657165816591660166116621663166416651666166716681669167016711672167316741675167616771678167916801681168216831684168516861687168816891690169116921693169416951696169716981699170017011702170317041705170617071708170917101711171217131714171517161717171817191720172117221723172417251726172717281729173017311732173317341735173617371738173917401741174217431744174517461747174817491750175117521753175417551756175717581759176017611762176317641765176617671768176917701771177217731774177517761777177817791780178117821783178417851786178717881789179017911792179317941795179617971798179918001801180218031804180518061807180818091810181118121813181418151816181718181819182018211822182318241825182618271828182918301831
  1. /*!
  2. * # Fomantic-UI - Dropdown
  3. * http://github.com/fomantic/Fomantic-UI/
  4. *
  5. *
  6. * Released under the MIT license
  7. * http://opensource.org/licenses/MIT
  8. *
  9. */
  10. /*******************************
  11. Dropdown
  12. *******************************/
  13. .ui.dropdown {
  14. cursor: pointer;
  15. position: relative;
  16. display: inline-block;
  17. outline: none;
  18. text-align: left;
  19. -webkit-transition: width 0.1s ease, -webkit-box-shadow 0.1s ease;
  20. transition: width 0.1s ease, -webkit-box-shadow 0.1s ease;
  21. transition: box-shadow 0.1s ease, width 0.1s ease;
  22. transition: box-shadow 0.1s ease, width 0.1s ease, -webkit-box-shadow 0.1s ease;
  23. -webkit-user-select: none;
  24. -moz-user-select: none;
  25. -ms-user-select: none;
  26. user-select: none;
  27. -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
  28. }
  29. /*******************************
  30. Content
  31. *******************************/
  32. /*--------------
  33. Menu
  34. ---------------*/
  35. .ui.dropdown .menu {
  36. cursor: auto;
  37. position: absolute;
  38. display: none;
  39. outline: none;
  40. top: 100%;
  41. min-width: -webkit-max-content;
  42. min-width: -moz-max-content;
  43. min-width: max-content;
  44. margin: 0;
  45. padding: 0 0;
  46. background: #FFFFFF;
  47. font-size: 1em;
  48. text-shadow: none;
  49. text-align: left;
  50. -webkit-box-shadow: 0 2px 3px 0 rgba(34, 36, 38, 0.15);
  51. box-shadow: 0 2px 3px 0 rgba(34, 36, 38, 0.15);
  52. border: 1px solid rgba(34, 36, 38, 0.15);
  53. border-radius: 0.28571429rem;
  54. -webkit-transition: opacity 0.1s ease;
  55. transition: opacity 0.1s ease;
  56. z-index: 11;
  57. will-change: transform, opacity;
  58. }
  59. .ui.dropdown .menu > * {
  60. white-space: nowrap;
  61. }
  62. /*--------------
  63. Hidden Input
  64. ---------------*/
  65. .ui.dropdown > input:not(.search):first-child,
  66. .ui.dropdown > select {
  67. display: none !important;
  68. }
  69. /*--------------
  70. Dropdown Icon
  71. ---------------*/
  72. .ui.dropdown > .dropdown.icon.icon {
  73. position: relative;
  74. width: auto;
  75. font-size: 0.85714286em;
  76. margin: 0 0 0 1em;
  77. }
  78. .ui.dropdown .menu > .item .dropdown.icon {
  79. width: auto;
  80. float: right;
  81. margin: 0em 0 0 1em;
  82. }
  83. .ui.dropdown .menu > .item .dropdown.icon + .text {
  84. margin-right: 1em;
  85. }
  86. /*--------------
  87. Text
  88. ---------------*/
  89. .ui.dropdown > .text {
  90. display: inline-block;
  91. -webkit-transition: none;
  92. transition: none;
  93. }
  94. /*--------------
  95. Menu Item
  96. ---------------*/
  97. .ui.dropdown .menu > .item {
  98. position: relative;
  99. cursor: pointer;
  100. display: block;
  101. border: none;
  102. height: auto;
  103. text-align: left;
  104. border-top: none;
  105. line-height: 1em;
  106. font-size: 1rem;
  107. color: #AAAAAA;
  108. padding: 0.78571429rem 1.14285714rem !important;
  109. text-transform: none;
  110. font-weight: normal;
  111. -webkit-box-shadow: none;
  112. box-shadow: none;
  113. -webkit-touch-callout: none;
  114. }
  115. .ui.dropdown .menu > .item:first-child {
  116. border-top-width: 0;
  117. }
  118. /*--------------
  119. Floated Content
  120. ---------------*/
  121. .ui.dropdown > .text > [class*="right floated"],
  122. .ui.dropdown .menu .item > [class*="right floated"] {
  123. float: right !important;
  124. margin-right: 0 !important;
  125. margin-left: 1em !important;
  126. }
  127. .ui.dropdown > .text > [class*="left floated"],
  128. .ui.dropdown .menu .item > [class*="left floated"] {
  129. float: left !important;
  130. margin-left: 0 !important;
  131. margin-right: 1em !important;
  132. }
  133. .ui.dropdown .menu .item > .icon.floated,
  134. .ui.dropdown .menu .item > .flag.floated,
  135. .ui.dropdown .menu .item > .image.floated,
  136. .ui.dropdown .menu .item > img.floated {
  137. margin-top: 0em;
  138. }
  139. /*--------------
  140. Menu Divider
  141. ---------------*/
  142. .ui.dropdown .menu > .header {
  143. margin: 1rem 0 0.75rem;
  144. padding: 0 1.14285714rem;
  145. font-weight: bold;
  146. text-transform: uppercase;
  147. }
  148. .ui.dropdown .menu > .header:not(.ui) {
  149. color: rgba(0, 0, 0, 0.85);
  150. font-size: 0.78571429em;
  151. }
  152. .ui.dropdown .menu > .divider {
  153. border-top: 1px solid rgba(34, 36, 38, 0.1);
  154. height: 0;
  155. margin: 0.5em 0;
  156. }
  157. .ui.dropdown .menu > .horizontal.divider {
  158. border-top: none;
  159. }
  160. .ui.dropdown.dropdown .menu > .input {
  161. width: auto;
  162. display: -webkit-box;
  163. display: -ms-flexbox;
  164. display: flex;
  165. margin: 1.14285714rem 0.78571429rem;
  166. min-width: 10rem;
  167. }
  168. .ui.dropdown .menu > .header + .input {
  169. margin-top: 0;
  170. }
  171. .ui.dropdown .menu > .input:not(.transparent) input {
  172. padding: 0.5em 1em;
  173. }
  174. .ui.dropdown .menu > .input:not(.transparent) .button,
  175. .ui.dropdown .menu > .input:not(.transparent) .icon,
  176. .ui.dropdown .menu > .input:not(.transparent) .label {
  177. padding-top: 0.5em;
  178. padding-bottom: 0.5em;
  179. }
  180. /*-----------------
  181. Item Description
  182. -------------------*/
  183. .ui.dropdown > .text > .description,
  184. .ui.dropdown .menu > .item > .description {
  185. float: right;
  186. margin: 0 0 0 1em;
  187. color: rgba(0, 0, 0, 0.4);
  188. }
  189. /*-----------------
  190. Message
  191. -------------------*/
  192. .ui.dropdown .menu > .message {
  193. padding: 0.78571429rem 1.14285714rem;
  194. font-weight: normal;
  195. }
  196. .ui.dropdown .menu > .message:not(.ui) {
  197. color: rgba(0, 0, 0, 0.4);
  198. }
  199. /*--------------
  200. Sub Menu
  201. ---------------*/
  202. .ui.dropdown .menu .menu {
  203. top: 0;
  204. left: 100%;
  205. right: auto;
  206. margin: 0 0 0 -0.5em !important;
  207. border-radius: 0.28571429rem !important;
  208. z-index: 21 !important;
  209. }
  210. /* Hide Arrow */
  211. .ui.dropdown .menu .menu:after {
  212. display: none;
  213. }
  214. /*--------------
  215. Sub Elements
  216. ---------------*/
  217. /* Icons / Flags / Labels / Image */
  218. .ui.dropdown > .text > .icon,
  219. .ui.dropdown > .text > .label,
  220. .ui.dropdown > .text > .flag,
  221. .ui.dropdown > .text > img,
  222. .ui.dropdown > .text > .image {
  223. margin-top: 0em;
  224. }
  225. .ui.dropdown .menu > .item > .icon,
  226. .ui.dropdown .menu > .item > .label,
  227. .ui.dropdown .menu > .item > .flag,
  228. .ui.dropdown .menu > .item > .image,
  229. .ui.dropdown .menu > .item > img {
  230. margin-top: 0em;
  231. }
  232. .ui.dropdown > .text > .icon,
  233. .ui.dropdown > .text > .label,
  234. .ui.dropdown > .text > .flag,
  235. .ui.dropdown > .text > img,
  236. .ui.dropdown > .text > .image,
  237. .ui.dropdown .menu > .item > .icon,
  238. .ui.dropdown .menu > .item > .label,
  239. .ui.dropdown .menu > .item > .flag,
  240. .ui.dropdown .menu > .item > .image,
  241. .ui.dropdown .menu > .item > img {
  242. margin-left: 0;
  243. float: none;
  244. margin-right: 0.78571429rem;
  245. }
  246. /*--------------
  247. Image
  248. ---------------*/
  249. .ui.dropdown > .text > img,
  250. .ui.dropdown > .text > .image:not(.icon),
  251. .ui.dropdown .menu > .item > .image:not(.icon),
  252. .ui.dropdown .menu > .item > img {
  253. display: inline-block;
  254. vertical-align: top;
  255. width: auto;
  256. margin-top: -0.5em;
  257. margin-bottom: -0.5em;
  258. max-height: 2em;
  259. }
  260. /*******************************
  261. Coupling
  262. *******************************/
  263. /*--------------
  264. Menu
  265. ---------------*/
  266. /* Remove Menu Item Divider */
  267. .ui.dropdown .ui.menu > .item:before,
  268. .ui.menu .ui.dropdown .menu > .item:before {
  269. display: none;
  270. }
  271. /* Prevent Menu Item Border */
  272. .ui.menu .ui.dropdown .menu .active.item {
  273. border-left: none;
  274. }
  275. /* Automatically float dropdown menu right on last menu item */
  276. .ui.menu .right.menu .dropdown:last-child .menu,
  277. .ui.menu .right.dropdown.item .menu,
  278. .ui.buttons > .ui.dropdown:last-child .menu {
  279. left: auto;
  280. right: 0;
  281. }
  282. /*--------------
  283. Label
  284. ---------------*/
  285. /* Dropdown Menu */
  286. .ui.label.dropdown .menu {
  287. min-width: 100%;
  288. }
  289. /*--------------
  290. Button
  291. ---------------*/
  292. /* No Margin On Icon Button */
  293. .ui.dropdown.icon.button > .dropdown.icon {
  294. margin: 0;
  295. }
  296. .ui.button.dropdown .menu {
  297. min-width: 100%;
  298. }
  299. /*******************************
  300. Types
  301. *******************************/
  302. /*--------------
  303. Selection
  304. ---------------*/
  305. /* Displays like a select box */
  306. .ui.selection.dropdown {
  307. cursor: pointer;
  308. word-wrap: break-word;
  309. line-height: 1em;
  310. white-space: normal;
  311. outline: 0;
  312. -webkit-transform: rotateZ(0deg);
  313. transform: rotateZ(0deg);
  314. min-width: 14em;
  315. min-height: 2.71428571em;
  316. background: #FFFFFF;
  317. display: inline-block;
  318. padding: 0.78571429em 3.2em 0.78571429em 1em;
  319. color: #AAAAAA;
  320. -webkit-box-shadow: none;
  321. box-shadow: none;
  322. border: 1px solid rgba(34, 36, 38, 0.15);
  323. border-radius: 0.28571429rem;
  324. -webkit-transition: width 0.1s ease, -webkit-box-shadow 0.1s ease;
  325. transition: width 0.1s ease, -webkit-box-shadow 0.1s ease;
  326. transition: box-shadow 0.1s ease, width 0.1s ease;
  327. transition: box-shadow 0.1s ease, width 0.1s ease, -webkit-box-shadow 0.1s ease;
  328. }
  329. .ui.selection.dropdown.visible,
  330. .ui.selection.dropdown.active {
  331. z-index: 10;
  332. }
  333. select.ui.dropdown {
  334. height: 38px;
  335. padding: 0.5em;
  336. border: 1px solid rgba(34, 36, 38, 0.15);
  337. visibility: visible;
  338. }
  339. .ui.selection.dropdown > .search.icon,
  340. .ui.selection.dropdown > .delete.icon,
  341. .ui.selection.dropdown > .dropdown.icon {
  342. cursor: pointer;
  343. position: absolute;
  344. width: auto;
  345. height: auto;
  346. line-height: 1.21428571em;
  347. top: 0.78571429em;
  348. right: 1em;
  349. z-index: 3;
  350. margin: -0.78571429em;
  351. padding: 0.91666667em;
  352. opacity: 0.8;
  353. -webkit-transition: opacity 0.1s ease;
  354. transition: opacity 0.1s ease;
  355. }
  356. /* Compact */
  357. .ui.compact.selection.dropdown {
  358. min-width: 0;
  359. }
  360. /* Selection Menu */
  361. .ui.selection.dropdown .menu {
  362. overflow-x: hidden;
  363. overflow-y: auto;
  364. -webkit-backface-visibility: hidden;
  365. backface-visibility: hidden;
  366. -webkit-overflow-scrolling: touch;
  367. border-top-width: 0 !important;
  368. width: auto;
  369. outline: none;
  370. margin: 0 -1px;
  371. min-width: calc(100% + 2px);
  372. width: calc(100% + 2px);
  373. border-radius: 0 0 0.28571429rem 0.28571429rem;
  374. -webkit-box-shadow: 0 2px 3px 0 rgba(34, 36, 38, 0.15);
  375. box-shadow: 0 2px 3px 0 rgba(34, 36, 38, 0.15);
  376. -webkit-transition: opacity 0.1s ease;
  377. transition: opacity 0.1s ease;
  378. }
  379. .ui.selection.dropdown .menu:after,
  380. .ui.selection.dropdown .menu:before {
  381. display: none;
  382. }
  383. /*--------------
  384. Message
  385. ---------------*/
  386. .ui.selection.dropdown .menu > .message {
  387. padding: 0.78571429rem 1.14285714rem;
  388. }
  389. @media only screen and (max-width: 767.98px) {
  390. .ui.selection.dropdown[class*="very short"] .menu {
  391. max-height: 4.00714286rem;
  392. }
  393. .ui.selection.dropdown.short .menu {
  394. max-height: 6.01071429rem;
  395. }
  396. .ui.selection.dropdown .menu {
  397. max-height: 8.01428571rem;
  398. }
  399. .ui.selection.dropdown.long .menu {
  400. max-height: 16.02857143rem;
  401. }
  402. .ui.selection.dropdown[class*="very long"] .menu {
  403. max-height: 24.04285714rem;
  404. }
  405. }
  406. @media only screen and (min-width: 768px) {
  407. .ui.selection.dropdown[class*="very short"] .menu {
  408. max-height: 5.34285714rem;
  409. }
  410. .ui.selection.dropdown.short .menu {
  411. max-height: 8.01428571rem;
  412. }
  413. .ui.selection.dropdown .menu {
  414. max-height: 10.68571429rem;
  415. }
  416. .ui.selection.dropdown.long .menu {
  417. max-height: 21.37142857rem;
  418. }
  419. .ui.selection.dropdown[class*="very long"] .menu {
  420. max-height: 32.05714286rem;
  421. }
  422. }
  423. @media only screen and (min-width: 992px) {
  424. .ui.selection.dropdown[class*="very short"] .menu {
  425. max-height: 8.01428571rem;
  426. }
  427. .ui.selection.dropdown.short .menu {
  428. max-height: 12.02142857rem;
  429. }
  430. .ui.selection.dropdown .menu {
  431. max-height: 16.02857143rem;
  432. }
  433. .ui.selection.dropdown.long .menu {
  434. max-height: 32.05714286rem;
  435. }
  436. .ui.selection.dropdown[class*="very long"] .menu {
  437. max-height: 48.08571429rem;
  438. }
  439. }
  440. @media only screen and (min-width: 1920px) {
  441. .ui.selection.dropdown[class*="very short"] .menu {
  442. max-height: 10.68571429rem;
  443. }
  444. .ui.selection.dropdown.short .menu {
  445. max-height: 16.02857143rem;
  446. }
  447. .ui.selection.dropdown .menu {
  448. max-height: 21.37142857rem;
  449. }
  450. .ui.selection.dropdown.long .menu {
  451. max-height: 42.74285714rem;
  452. }
  453. .ui.selection.dropdown[class*="very long"] .menu {
  454. max-height: 64.11428571rem;
  455. }
  456. }
  457. /* Menu Item */
  458. .ui.selection.dropdown .menu > .item {
  459. border-top: 1px solid #FAFAFA;
  460. padding: 0.78571429rem 1.14285714rem !important;
  461. white-space: normal;
  462. word-wrap: normal;
  463. }
  464. /* User Item */
  465. .ui.selection.dropdown .menu > .hidden.addition.item {
  466. display: none;
  467. }
  468. /* Hover */
  469. .ui.selection.dropdown:hover {
  470. border-color: rgba(34, 36, 38, 0.35);
  471. -webkit-box-shadow: none;
  472. box-shadow: none;
  473. }
  474. /* Active */
  475. .ui.selection.active.dropdown {
  476. border-color: #96C8DA;
  477. -webkit-box-shadow: 0 2px 3px 0 rgba(34, 36, 38, 0.15);
  478. box-shadow: 0 2px 3px 0 rgba(34, 36, 38, 0.15);
  479. }
  480. .ui.selection.active.dropdown .menu {
  481. border-color: #96C8DA;
  482. -webkit-box-shadow: 0 2px 3px 0 rgba(34, 36, 38, 0.15);
  483. box-shadow: 0 2px 3px 0 rgba(34, 36, 38, 0.15);
  484. }
  485. /* Focus */
  486. .ui.selection.dropdown:focus {
  487. border-color: #96C8DA;
  488. -webkit-box-shadow: none;
  489. box-shadow: none;
  490. }
  491. .ui.selection.dropdown:focus .menu {
  492. border-color: #96C8DA;
  493. -webkit-box-shadow: 0 2px 3px 0 rgba(34, 36, 38, 0.15);
  494. box-shadow: 0 2px 3px 0 rgba(34, 36, 38, 0.15);
  495. }
  496. /* Visible */
  497. .ui.selection.visible.dropdown > .text:not(.default) {
  498. font-weight: normal;
  499. color: rgba(0, 0, 0, 0.8);
  500. }
  501. /* Visible Hover */
  502. .ui.selection.active.dropdown:hover {
  503. border-color: #96C8DA;
  504. -webkit-box-shadow: 0 2px 3px 0 rgba(34, 36, 38, 0.15);
  505. box-shadow: 0 2px 3px 0 rgba(34, 36, 38, 0.15);
  506. }
  507. .ui.selection.active.dropdown:hover .menu {
  508. border-color: #96C8DA;
  509. -webkit-box-shadow: 0 2px 3px 0 rgba(34, 36, 38, 0.15);
  510. box-shadow: 0 2px 3px 0 rgba(34, 36, 38, 0.15);
  511. }
  512. /* Dropdown Icon */
  513. .ui.active.selection.dropdown > .dropdown.icon,
  514. .ui.visible.selection.dropdown > .dropdown.icon {
  515. opacity: '';
  516. z-index: 3;
  517. }
  518. /* Connecting Border */
  519. .ui.active.selection.dropdown {
  520. border-bottom-left-radius: 0 !important;
  521. border-bottom-right-radius: 0 !important;
  522. }
  523. /* Empty Connecting Border */
  524. .ui.active.empty.selection.dropdown {
  525. border-radius: 0.28571429rem !important;
  526. -webkit-box-shadow: none !important;
  527. box-shadow: none !important;
  528. }
  529. .ui.active.empty.selection.dropdown .menu {
  530. border: none !important;
  531. -webkit-box-shadow: none !important;
  532. box-shadow: none !important;
  533. }
  534. /*--------------
  535. Searchable
  536. ---------------*/
  537. /* Search Selection */
  538. .ui.search.dropdown {
  539. min-width: '';
  540. }
  541. /* Search Dropdown */
  542. .ui.search.dropdown > input.search {
  543. background: none transparent !important;
  544. border: none !important;
  545. -webkit-box-shadow: none !important;
  546. box-shadow: none !important;
  547. cursor: text;
  548. top: 0;
  549. left: 1px;
  550. width: 100%;
  551. outline: none;
  552. -webkit-tap-highlight-color: rgba(255, 255, 255, 0);
  553. padding: inherit;
  554. }
  555. /* Text Layering */
  556. .ui.search.dropdown > input.search {
  557. position: absolute;
  558. z-index: 2;
  559. }
  560. .ui.search.dropdown > .text {
  561. cursor: text;
  562. position: relative;
  563. left: 1px;
  564. z-index: 3;
  565. }
  566. /* Search Selection */
  567. .ui.search.selection.dropdown > input.search {
  568. line-height: 1.21428571em;
  569. padding: 0.67857143em 3.2em 0.67857143em 1em;
  570. }
  571. /* Used to size multi select input to character width */
  572. .ui.search.selection.dropdown > span.sizer {
  573. line-height: 1.21428571em;
  574. padding: 0.67857143em 3.2em 0.67857143em 1em;
  575. display: none;
  576. white-space: pre;
  577. }
  578. /* Active/Visible Search */
  579. .ui.search.dropdown.active > input.search,
  580. .ui.search.dropdown.visible > input.search {
  581. cursor: auto;
  582. }
  583. .ui.search.dropdown.active > .text,
  584. .ui.search.dropdown.visible > .text {
  585. pointer-events: none;
  586. }
  587. /* Filtered Text */
  588. .ui.active.search.dropdown input.search:focus + .text .icon,
  589. .ui.active.search.dropdown input.search:focus + .text .flag {
  590. opacity: 0.45;
  591. }
  592. .ui.active.search.dropdown input.search:focus + .text {
  593. color: #ffffff !important;
  594. }
  595. /* Search Menu */
  596. .ui.search.dropdown .menu {
  597. overflow-x: hidden;
  598. overflow-y: auto;
  599. -webkit-backface-visibility: hidden;
  600. backface-visibility: hidden;
  601. -webkit-overflow-scrolling: touch;
  602. }
  603. @media only screen and (max-width: 767.98px) {
  604. .ui.search.dropdown .menu {
  605. max-height: 8.01428571rem;
  606. }
  607. }
  608. @media only screen and (min-width: 768px) {
  609. .ui.search.dropdown .menu {
  610. max-height: 10.68571429rem;
  611. }
  612. }
  613. @media only screen and (min-width: 992px) {
  614. .ui.search.dropdown .menu {
  615. max-height: 16.02857143rem;
  616. }
  617. }
  618. @media only screen and (min-width: 1920px) {
  619. .ui.search.dropdown .menu {
  620. max-height: 21.37142857rem;
  621. }
  622. }
  623. /* Clearable Selection */
  624. .ui.dropdown > .remove.icon {
  625. cursor: pointer;
  626. font-size: 0.85714286em;
  627. margin: -0.78571429em;
  628. padding: 0.91666667em;
  629. right: 3em;
  630. top: 0.78571429em;
  631. position: absolute;
  632. opacity: 0.6;
  633. z-index: 3;
  634. }
  635. .ui.clearable.dropdown .text,
  636. .ui.clearable.dropdown a:last-of-type {
  637. margin-right: 1.5em;
  638. }
  639. .ui.dropdown select.noselection ~ .remove.icon,
  640. .ui.dropdown input[value=''] ~ .remove.icon,
  641. .ui.dropdown input:not([value]) ~ .remove.icon,
  642. .ui.dropdown.loading > .remove.icon {
  643. display: none;
  644. }
  645. /*--------------
  646. Multiple
  647. ---------------*/
  648. /* Multiple Selection */
  649. .ui.multiple.dropdown {
  650. padding: 0.22619048em 3.2em 0.22619048em 0.35714286em;
  651. }
  652. .ui.multiple.dropdown .menu {
  653. cursor: auto;
  654. }
  655. /* Multiple Search Selection */
  656. .ui.multiple.search.dropdown,
  657. .ui.multiple.search.dropdown > input.search {
  658. cursor: text;
  659. }
  660. /* Selection Label */
  661. .ui.multiple.dropdown > .label {
  662. display: inline-block;
  663. white-space: normal;
  664. font-size: 1em;
  665. padding: 0.35714286em 0.78571429em;
  666. margin: 0.14285714rem 0.28571429rem 0.14285714rem 0;
  667. -webkit-box-shadow: 0 0 0 1px rgba(34, 36, 38, 0.15) inset;
  668. box-shadow: 0 0 0 1px rgba(34, 36, 38, 0.15) inset;
  669. }
  670. /* Dropdown Icon */
  671. .ui.multiple.dropdown .dropdown.icon {
  672. margin: '';
  673. padding: '';
  674. }
  675. /* Text */
  676. .ui.multiple.dropdown > .text {
  677. position: static;
  678. padding: 0;
  679. max-width: 100%;
  680. margin: 0.45238095em 0 0.45238095em 0.64285714em;
  681. line-height: 1.21428571em;
  682. }
  683. .ui.multiple.dropdown > .label ~ input.search {
  684. margin-left: 0.14285714em !important;
  685. }
  686. .ui.multiple.dropdown > .label ~ .text {
  687. display: none;
  688. }
  689. .ui.multiple.dropdown > .label:not(.image) > img:not(.centered) {
  690. margin-right: 0.78571429rem;
  691. }
  692. .ui.multiple.dropdown > .label:not(.image) > img.ui:not(.avatar) {
  693. margin-bottom: 0.39285714rem;
  694. }
  695. .ui.multiple.dropdown > .image.label img {
  696. margin: -0.35714286em 0.78571429em -0.35714286em -0.78571429em;
  697. height: 1.71428571em;
  698. }
  699. /*-----------------
  700. Multiple Search
  701. -----------------*/
  702. /* Prompt Text */
  703. .ui.multiple.search.dropdown > .text {
  704. display: inline-block;
  705. position: absolute;
  706. top: 0;
  707. left: 0;
  708. padding: inherit;
  709. margin: 0.45238095em 0 0.45238095em 0.64285714em;
  710. line-height: 1.21428571em;
  711. }
  712. .ui.multiple.search.dropdown > .label ~ .text {
  713. display: none;
  714. }
  715. /* Search */
  716. .ui.multiple.search.dropdown > input.search {
  717. position: static;
  718. padding: 0;
  719. max-width: 100%;
  720. margin: 0.45238095em 0 0.45238095em 0.64285714em;
  721. width: 2.2em;
  722. line-height: 1.21428571em;
  723. }
  724. /*--------------
  725. Inline
  726. ---------------*/
  727. .ui.inline.dropdown {
  728. cursor: pointer;
  729. display: inline-block;
  730. color: inherit;
  731. }
  732. .ui.inline.dropdown .dropdown.icon {
  733. margin: 0 0.21428571em 0 0.21428571em;
  734. vertical-align: baseline;
  735. }
  736. .ui.inline.dropdown > .text {
  737. font-weight: bold;
  738. }
  739. .ui.inline.dropdown .menu {
  740. cursor: auto;
  741. margin-top: 0.21428571em;
  742. border-radius: 0.28571429rem;
  743. }
  744. /*******************************
  745. States
  746. *******************************/
  747. /*--------------------
  748. Active
  749. ----------------------*/
  750. /* Menu Item Active */
  751. .ui.dropdown .menu .active.item {
  752. background: transparent;
  753. font-weight: bold;
  754. color: rgba(0, 0, 0, 0.95);
  755. -webkit-box-shadow: none;
  756. box-shadow: none;
  757. z-index: 12;
  758. }
  759. /*--------------------
  760. Hover
  761. ----------------------*/
  762. /* Menu Item Hover */
  763. .ui.dropdown .menu > .item:hover {
  764. background: rgba(0, 0, 0, 0.05);
  765. color: rgba(0, 0, 0, 0.95);
  766. z-index: 13;
  767. }
  768. /*--------------------
  769. Loading
  770. ---------------------*/
  771. .ui.loading.dropdown > i.icon {
  772. height: 1em !important;
  773. }
  774. .ui.loading.selection.dropdown > i.icon {
  775. padding: 1.5em 1.28571429em !important;
  776. }
  777. .ui.loading.dropdown > i.icon:before {
  778. position: absolute;
  779. content: '';
  780. top: 50%;
  781. left: 50%;
  782. margin: -0.64285714em 0 0 -0.64285714em;
  783. width: 1.28571429em;
  784. height: 1.28571429em;
  785. border-radius: 500rem;
  786. border: 0.2em solid rgba(0, 0, 0, 0.1);
  787. }
  788. .ui.loading.dropdown > i.icon:after {
  789. position: absolute;
  790. content: '';
  791. top: 50%;
  792. left: 50%;
  793. -webkit-box-shadow: 0 0 0 1px transparent;
  794. box-shadow: 0 0 0 1px transparent;
  795. margin: -0.64285714em 0 0 -0.64285714em;
  796. width: 1.28571429em;
  797. height: 1.28571429em;
  798. -webkit-animation: loader 0.6s infinite linear;
  799. animation: loader 0.6s infinite linear;
  800. border: 0.2em solid #767676;
  801. border-radius: 500rem;
  802. }
  803. /* Coupling */
  804. .ui.loading.dropdown.button > i.icon:before,
  805. .ui.loading.dropdown.button > i.icon:after {
  806. display: none;
  807. }
  808. /*--------------------
  809. Default Text
  810. ----------------------*/
  811. .ui.dropdown:not(.button) > .default.text,
  812. .ui.default.dropdown:not(.button) > .text {
  813. color: #ffffff;
  814. }
  815. .ui.dropdown:not(.button) > input:focus ~ .default.text,
  816. .ui.default.dropdown:not(.button) > input:focus ~ .text {
  817. color: #ffffff;
  818. }
  819. /*--------------------
  820. Loading
  821. ----------------------*/
  822. .ui.loading.dropdown > .text {
  823. -webkit-transition: none;
  824. transition: none;
  825. }
  826. /* Used To Check Position */
  827. .ui.dropdown .loading.menu {
  828. display: block;
  829. visibility: hidden;
  830. z-index: -1;
  831. }
  832. .ui.dropdown > .loading.menu {
  833. left: 0 !important;
  834. right: auto !important;
  835. }
  836. .ui.dropdown > .menu .loading.menu {
  837. left: 100% !important;
  838. right: auto !important;
  839. }
  840. /*--------------------
  841. Keyboard Select
  842. ----------------------*/
  843. /* Selected Item */
  844. .ui.dropdown.selected,
  845. .ui.dropdown .menu .selected.item {
  846. background: rgba(0, 0, 0, 0.03);
  847. color: rgba(0, 0, 0, 0.95);
  848. }
  849. /*--------------------
  850. Search Filtered
  851. ----------------------*/
  852. /* Filtered Item */
  853. .ui.dropdown > .filtered.text {
  854. visibility: hidden;
  855. }
  856. .ui.dropdown .filtered.item {
  857. display: none !important;
  858. }
  859. /*--------------------
  860. Error
  861. ----------------------*/
  862. .ui.dropdown.error,
  863. .ui.dropdown.error > .text,
  864. .ui.dropdown.error > .default.text {
  865. color: #9F3A38;
  866. }
  867. .ui.selection.dropdown.error {
  868. background: #FFF6F6;
  869. border-color: #E0B4B4;
  870. }
  871. .ui.selection.dropdown.error:hover {
  872. border-color: #E0B4B4;
  873. }
  874. .ui.dropdown.error > .menu,
  875. .ui.dropdown.error > .menu .menu {
  876. border-color: #E0B4B4;
  877. }
  878. .ui.dropdown.error > .menu > .item {
  879. color: #9F3A38;
  880. }
  881. .ui.multiple.selection.error.dropdown > .label {
  882. border-color: #E0B4B4;
  883. }
  884. /* Item Hover */
  885. .ui.dropdown.error > .menu > .item:hover {
  886. background-color: #FFF2F2;
  887. }
  888. /* Item Active */
  889. .ui.dropdown.error > .menu .active.item {
  890. background-color: #FDCFCF;
  891. }
  892. /*--------------------
  893. Clear
  894. ----------------------*/
  895. .ui.dropdown > .clear.dropdown.icon {
  896. opacity: 0.8;
  897. -webkit-transition: opacity 0.1s ease;
  898. transition: opacity 0.1s ease;
  899. }
  900. .ui.dropdown > .clear.dropdown.icon:hover {
  901. opacity: 1;
  902. }
  903. /*--------------------
  904. Disabled
  905. ----------------------*/
  906. /* Disabled */
  907. .ui.disabled.dropdown,
  908. .ui.dropdown .menu > .disabled.item {
  909. cursor: default;
  910. pointer-events: none;
  911. opacity: 0.45;
  912. }
  913. /*******************************
  914. Variations
  915. *******************************/
  916. /*--------------
  917. Direction
  918. ---------------*/
  919. /* Flyout Direction */
  920. .ui.dropdown .menu {
  921. left: 0;
  922. }
  923. /* Default Side (Right) */
  924. .ui.dropdown .right.menu > .menu,
  925. .ui.dropdown .menu .right.menu {
  926. left: 100% !important;
  927. right: auto !important;
  928. border-radius: 0.28571429rem !important;
  929. }
  930. /* Leftward Opening Menu */
  931. .ui.dropdown > .left.menu {
  932. left: auto !important;
  933. right: 0 !important;
  934. }
  935. .ui.dropdown > .left.menu .menu,
  936. .ui.dropdown .menu .left.menu {
  937. left: auto;
  938. right: 100%;
  939. margin: 0 -0.5em 0 0 !important;
  940. border-radius: 0.28571429rem !important;
  941. }
  942. .ui.dropdown .item .left.dropdown.icon,
  943. .ui.dropdown .left.menu .item .dropdown.icon {
  944. width: auto;
  945. float: left;
  946. margin: 0em 0 0 0;
  947. }
  948. .ui.dropdown .item .left.dropdown.icon,
  949. .ui.dropdown .left.menu .item .dropdown.icon {
  950. width: auto;
  951. float: left;
  952. margin: 0em 0 0 0;
  953. }
  954. .ui.dropdown .item .left.dropdown.icon + .text,
  955. .ui.dropdown .left.menu .item .dropdown.icon + .text {
  956. margin-left: 1em;
  957. margin-right: 0;
  958. }
  959. /*--------------
  960. Upward
  961. ---------------*/
  962. /* Upward Main Menu */
  963. .ui.upward.dropdown > .menu {
  964. top: auto;
  965. bottom: 100%;
  966. -webkit-box-shadow: 0 0 3px 0 rgba(0, 0, 0, 0.08);
  967. box-shadow: 0 0 3px 0 rgba(0, 0, 0, 0.08);
  968. border-radius: 0.28571429rem 0.28571429rem 0 0;
  969. }
  970. /* Upward Sub Menu */
  971. .ui.dropdown .upward.menu {
  972. top: auto !important;
  973. bottom: 0 !important;
  974. }
  975. /* Active Upward */
  976. .ui.simple.upward.active.dropdown,
  977. .ui.simple.upward.dropdown:hover {
  978. border-radius: 0.28571429rem 0.28571429rem 0 0 !important;
  979. }
  980. .ui.upward.dropdown.button:not(.pointing):not(.floating).active {
  981. border-radius: 0.28571429rem 0.28571429rem 0 0;
  982. }
  983. /* Selection */
  984. .ui.upward.selection.dropdown .menu {
  985. border-top-width: 1px !important;
  986. border-bottom-width: 0 !important;
  987. -webkit-box-shadow: 0 -2px 3px 0 rgba(0, 0, 0, 0.08);
  988. box-shadow: 0 -2px 3px 0 rgba(0, 0, 0, 0.08);
  989. }
  990. .ui.upward.selection.dropdown:hover {
  991. -webkit-box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.05);
  992. box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.05);
  993. }
  994. /* Active Upward */
  995. .ui.active.upward.selection.dropdown {
  996. border-radius: 0 0 0.28571429rem 0.28571429rem !important;
  997. }
  998. /* Visible Upward */
  999. .ui.upward.selection.dropdown.visible {
  1000. -webkit-box-shadow: 0 0 3px 0 rgba(0, 0, 0, 0.08);
  1001. box-shadow: 0 0 3px 0 rgba(0, 0, 0, 0.08);
  1002. border-radius: 0 0 0.28571429rem 0.28571429rem !important;
  1003. }
  1004. /* Visible Hover Upward */
  1005. .ui.upward.active.selection.dropdown:hover {
  1006. -webkit-box-shadow: 0 0 3px 0 rgba(0, 0, 0, 0.05);
  1007. box-shadow: 0 0 3px 0 rgba(0, 0, 0, 0.05);
  1008. }
  1009. .ui.upward.active.selection.dropdown:hover .menu {
  1010. -webkit-box-shadow: 0 -2px 3px 0 rgba(0, 0, 0, 0.08);
  1011. box-shadow: 0 -2px 3px 0 rgba(0, 0, 0, 0.08);
  1012. }
  1013. /*--------------
  1014. Scrolling
  1015. ---------------*/
  1016. /* Selection Menu */
  1017. .ui.scrolling.dropdown .menu,
  1018. .ui.dropdown .scrolling.menu {
  1019. overflow-x: hidden;
  1020. overflow-y: auto;
  1021. }
  1022. .ui.scrolling.dropdown .menu {
  1023. overflow-x: hidden;
  1024. overflow-y: auto;
  1025. -webkit-backface-visibility: hidden;
  1026. backface-visibility: hidden;
  1027. -webkit-overflow-scrolling: touch;
  1028. min-width: 100% !important;
  1029. width: auto !important;
  1030. }
  1031. .ui.dropdown .scrolling.menu {
  1032. position: static;
  1033. overflow-y: auto;
  1034. border: none;
  1035. -webkit-box-shadow: none !important;
  1036. box-shadow: none !important;
  1037. border-radius: 0 !important;
  1038. margin: 0 !important;
  1039. min-width: 100% !important;
  1040. width: auto !important;
  1041. border-top: 1px solid rgba(34, 36, 38, 0.15);
  1042. }
  1043. .ui.scrolling.dropdown .menu .item.item.item,
  1044. .ui.dropdown .scrolling.menu > .item.item.item {
  1045. border-top: none;
  1046. }
  1047. .ui.scrolling.dropdown .menu .item:first-child,
  1048. .ui.dropdown .scrolling.menu .item:first-child {
  1049. border-top: none;
  1050. }
  1051. .ui.dropdown > .animating.menu .scrolling.menu,
  1052. .ui.dropdown > .visible.menu .scrolling.menu {
  1053. display: block;
  1054. }
  1055. /* Scrollbar in IE */
  1056. @media all and (-ms-high-contrast: none) {
  1057. .ui.scrolling.dropdown .menu,
  1058. .ui.dropdown .scrolling.menu {
  1059. min-width: calc(100% - 17px);
  1060. }
  1061. }
  1062. @media only screen and (max-width: 767.98px) {
  1063. .ui.scrolling.dropdown .menu,
  1064. .ui.dropdown .scrolling.menu {
  1065. max-height: 10.28571429rem;
  1066. }
  1067. }
  1068. @media only screen and (min-width: 768px) {
  1069. .ui.scrolling.dropdown .menu,
  1070. .ui.dropdown .scrolling.menu {
  1071. max-height: 15.42857143rem;
  1072. }
  1073. }
  1074. @media only screen and (min-width: 992px) {
  1075. .ui.scrolling.dropdown .menu,
  1076. .ui.dropdown .scrolling.menu {
  1077. max-height: 20.57142857rem;
  1078. }
  1079. }
  1080. @media only screen and (min-width: 1920px) {
  1081. .ui.scrolling.dropdown .menu,
  1082. .ui.dropdown .scrolling.menu {
  1083. max-height: 20.57142857rem;
  1084. }
  1085. }
  1086. /*--------------
  1087. Columnar
  1088. ---------------*/
  1089. .ui.dropdown[class*="two column"] > .menu > .item {
  1090. display: inline-block;
  1091. width: 50%;
  1092. }
  1093. .ui.dropdown[class*="three column"] > .menu > .item {
  1094. display: inline-block;
  1095. width: 33%;
  1096. }
  1097. .ui.dropdown[class*="four column"] > .menu > .item {
  1098. display: inline-block;
  1099. width: 25%;
  1100. }
  1101. .ui.dropdown[class*="five column"] > .menu > .item {
  1102. display: inline-block;
  1103. width: 20%;
  1104. }
  1105. /*--------------
  1106. Simple
  1107. ---------------*/
  1108. /* Displays without javascript */
  1109. .ui.simple.dropdown .menu:before,
  1110. .ui.simple.dropdown .menu:after {
  1111. display: none;
  1112. }
  1113. .ui.simple.dropdown .menu {
  1114. position: absolute;
  1115. /* IE hack to make dropdown icons appear inline */
  1116. display: -ms-inline-flexbox !important;
  1117. display: block;
  1118. overflow: hidden;
  1119. top: -9999px;
  1120. opacity: 0;
  1121. width: 0;
  1122. height: 0;
  1123. -webkit-transition: opacity 0.1s ease;
  1124. transition: opacity 0.1s ease;
  1125. margin-top: 0 !important;
  1126. }
  1127. .ui.simple.active.dropdown,
  1128. .ui.simple.dropdown:hover {
  1129. border-bottom-left-radius: 0 !important;
  1130. border-bottom-right-radius: 0 !important;
  1131. }
  1132. .ui.simple.active.dropdown > .menu,
  1133. .ui.simple.dropdown:hover > .menu {
  1134. overflow: visible;
  1135. width: auto;
  1136. height: auto;
  1137. top: 100%;
  1138. opacity: 1;
  1139. }
  1140. .ui.simple.dropdown > .menu > .item:active > .menu,
  1141. .ui.simple.dropdown:hover > .menu > .item:hover > .menu {
  1142. overflow: visible;
  1143. width: auto;
  1144. height: auto;
  1145. top: 0 !important;
  1146. left: 100% !important;
  1147. opacity: 1;
  1148. }
  1149. .ui.simple.disabled.dropdown:hover .menu {
  1150. display: none;
  1151. height: 0;
  1152. width: 0;
  1153. overflow: hidden;
  1154. }
  1155. /* Visible */
  1156. .ui.simple.visible.dropdown > .menu {
  1157. display: block;
  1158. }
  1159. /* Scrolling */
  1160. .ui.simple.scrolling.active.dropdown > .menu,
  1161. .ui.simple.scrolling.dropdown:hover > .menu {
  1162. overflow-x: hidden;
  1163. overflow-y: auto;
  1164. }
  1165. /*--------------
  1166. Fluid
  1167. ---------------*/
  1168. .ui.fluid.dropdown {
  1169. display: block;
  1170. width: 100% !important;
  1171. min-width: 0;
  1172. }
  1173. .ui.fluid.dropdown > .dropdown.icon {
  1174. float: right;
  1175. }
  1176. /*--------------
  1177. Floating
  1178. ---------------*/
  1179. .ui.floating.dropdown .menu {
  1180. left: 0;
  1181. right: auto;
  1182. -webkit-box-shadow: 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15) !important;
  1183. box-shadow: 0 2px 4px 0 rgba(34, 36, 38, 0.12), 0 2px 10px 0 rgba(34, 36, 38, 0.15) !important;
  1184. border-radius: 0.28571429rem !important;
  1185. }
  1186. .ui.floating.dropdown > .menu {
  1187. border-radius: 0.28571429rem !important;
  1188. }
  1189. .ui:not(.upward).floating.dropdown > .menu {
  1190. margin-top: 0.5em;
  1191. }
  1192. .ui.upward.floating.dropdown > .menu {
  1193. margin-bottom: 0.5em;
  1194. }
  1195. /*--------------
  1196. Pointing
  1197. ---------------*/
  1198. .ui.pointing.dropdown > .menu {
  1199. top: 100%;
  1200. margin-top: 0.78571429rem;
  1201. border-radius: 0.28571429rem;
  1202. }
  1203. .ui.pointing.dropdown > .menu:not(.hidden):after {
  1204. display: block;
  1205. position: absolute;
  1206. pointer-events: none;
  1207. content: '';
  1208. visibility: visible;
  1209. -webkit-transform: rotate(45deg);
  1210. transform: rotate(45deg);
  1211. width: 0.5em;
  1212. height: 0.5em;
  1213. -webkit-box-shadow: -1px -1px 0 0 rgba(34, 36, 38, 0.15);
  1214. box-shadow: -1px -1px 0 0 rgba(34, 36, 38, 0.15);
  1215. background: #FFFFFF;
  1216. z-index: 2;
  1217. }
  1218. .ui.pointing.dropdown > .menu:not(.hidden):after {
  1219. top: -0.25em;
  1220. left: 50%;
  1221. margin: 0 0 0 -0.25em;
  1222. }
  1223. /* Top Left Pointing */
  1224. .ui.top.left.pointing.dropdown > .menu {
  1225. top: 100%;
  1226. bottom: auto;
  1227. left: 0;
  1228. right: auto;
  1229. margin: 1em 0 0;
  1230. }
  1231. .ui.top.left.pointing.dropdown > .menu {
  1232. top: 100%;
  1233. bottom: auto;
  1234. left: 0;
  1235. right: auto;
  1236. margin: 1em 0 0;
  1237. }
  1238. .ui.top.left.pointing.dropdown > .menu:after {
  1239. top: -0.25em;
  1240. left: 1em;
  1241. right: auto;
  1242. margin: 0;
  1243. -webkit-transform: rotate(45deg);
  1244. transform: rotate(45deg);
  1245. }
  1246. /* Top Right Pointing */
  1247. .ui.top.right.pointing.dropdown > .menu {
  1248. top: 100%;
  1249. bottom: auto;
  1250. right: 0;
  1251. left: auto;
  1252. margin: 1em 0 0;
  1253. }
  1254. .ui.top.pointing.dropdown > .left.menu:after,
  1255. .ui.top.right.pointing.dropdown > .menu:after {
  1256. top: -0.25em;
  1257. left: auto !important;
  1258. right: 1em !important;
  1259. margin: 0;
  1260. -webkit-transform: rotate(45deg);
  1261. transform: rotate(45deg);
  1262. }
  1263. /* Left Pointing */
  1264. .ui.left.pointing.dropdown > .menu {
  1265. top: 0;
  1266. left: 100%;
  1267. right: auto;
  1268. margin: 0 0 0 1em;
  1269. }
  1270. .ui.left.pointing.dropdown > .menu:after {
  1271. top: 1em;
  1272. left: -0.25em;
  1273. margin: 0 0 0 0;
  1274. -webkit-transform: rotate(-45deg);
  1275. transform: rotate(-45deg);
  1276. }
  1277. .ui.left:not(.top):not(.bottom).pointing.dropdown > .left.menu {
  1278. left: auto !important;
  1279. right: 100% !important;
  1280. margin: 0 1em 0 0;
  1281. }
  1282. .ui.left:not(.top):not(.bottom).pointing.dropdown > .left.menu:after {
  1283. top: 1em;
  1284. left: auto;
  1285. right: -0.25em;
  1286. margin: 0 0 0 0;
  1287. -webkit-transform: rotate(135deg);
  1288. transform: rotate(135deg);
  1289. }
  1290. /* Right Pointing */
  1291. .ui.right.pointing.dropdown > .menu {
  1292. top: 0;
  1293. left: auto;
  1294. right: 100%;
  1295. margin: 0 1em 0 0;
  1296. }
  1297. .ui.right.pointing.dropdown > .menu:after {
  1298. top: 1em;
  1299. left: auto;
  1300. right: -0.25em;
  1301. margin: 0 0 0 0;
  1302. -webkit-transform: rotate(135deg);
  1303. transform: rotate(135deg);
  1304. }
  1305. /* Bottom Pointing */
  1306. .ui.bottom.pointing.dropdown > .menu {
  1307. top: auto;
  1308. bottom: 100%;
  1309. left: 0;
  1310. right: auto;
  1311. margin: 0 0 1em;
  1312. }
  1313. .ui.bottom.pointing.dropdown > .menu:after {
  1314. top: auto;
  1315. bottom: -0.25em;
  1316. right: auto;
  1317. margin: 0;
  1318. -webkit-transform: rotate(-135deg);
  1319. transform: rotate(-135deg);
  1320. }
  1321. /* Reverse Sub-Menu Direction */
  1322. .ui.bottom.pointing.dropdown > .menu .menu {
  1323. top: auto !important;
  1324. bottom: 0 !important;
  1325. }
  1326. /* Bottom Left */
  1327. .ui.bottom.left.pointing.dropdown > .menu {
  1328. left: 0;
  1329. right: auto;
  1330. }
  1331. .ui.bottom.left.pointing.dropdown > .menu:after {
  1332. left: 1em;
  1333. right: auto;
  1334. }
  1335. /* Bottom Right */
  1336. .ui.bottom.right.pointing.dropdown > .menu {
  1337. right: 0;
  1338. left: auto;
  1339. }
  1340. .ui.bottom.right.pointing.dropdown > .menu:after {
  1341. left: auto;
  1342. right: 1em;
  1343. }
  1344. /* Upward pointing */
  1345. .ui.pointing.upward.dropdown .menu,
  1346. .ui.top.pointing.upward.dropdown .menu {
  1347. top: auto !important;
  1348. bottom: 100% !important;
  1349. margin: 0 0 0.78571429rem;
  1350. border-radius: 0.28571429rem;
  1351. }
  1352. .ui.pointing.upward.dropdown .menu:after,
  1353. .ui.top.pointing.upward.dropdown .menu:after {
  1354. top: 100% !important;
  1355. bottom: auto !important;
  1356. -webkit-box-shadow: 1px 1px 0 0 rgba(34, 36, 38, 0.15);
  1357. box-shadow: 1px 1px 0 0 rgba(34, 36, 38, 0.15);
  1358. margin: -0.25em 0 0;
  1359. }
  1360. /* Right Pointing Upward */
  1361. .ui.right.pointing.upward.dropdown:not(.top):not(.bottom) .menu {
  1362. top: auto !important;
  1363. bottom: 0 !important;
  1364. margin: 0 1em 0 0;
  1365. }
  1366. .ui.right.pointing.upward.dropdown:not(.top):not(.bottom) .menu:after {
  1367. top: auto !important;
  1368. bottom: 0 !important;
  1369. margin: 0 0 1em 0;
  1370. -webkit-box-shadow: -1px -1px 0 0 rgba(34, 36, 38, 0.15);
  1371. box-shadow: -1px -1px 0 0 rgba(34, 36, 38, 0.15);
  1372. }
  1373. /* Left Pointing Upward */
  1374. .ui.left.pointing.upward.dropdown:not(.top):not(.bottom) .menu {
  1375. top: auto !important;
  1376. bottom: 0 !important;
  1377. margin: 0 0 0 1em;
  1378. }
  1379. .ui.left.pointing.upward.dropdown:not(.top):not(.bottom) .menu:after {
  1380. top: auto !important;
  1381. bottom: 0 !important;
  1382. margin: 0 0 1em 0;
  1383. -webkit-box-shadow: -1px -1px 0 0 rgba(34, 36, 38, 0.15);
  1384. box-shadow: -1px -1px 0 0 rgba(34, 36, 38, 0.15);
  1385. }
  1386. /*--------------------
  1387. Sizes
  1388. ---------------------*/
  1389. /* Dropdown Size */
  1390. .ui.mini.dropdown {
  1391. font-size: 0.78571429rem;
  1392. }
  1393. .ui.tiny.dropdown {
  1394. font-size: 0.85714286rem;
  1395. }
  1396. .ui.small.dropdown {
  1397. font-size: 0.92857143rem;
  1398. }
  1399. .ui.dropdown {
  1400. font-size: 1rem;
  1401. }
  1402. .ui.large.dropdown {
  1403. font-size: 1.14285714rem;
  1404. }
  1405. .ui.big.dropdown {
  1406. font-size: 1.28571429rem;
  1407. }
  1408. .ui.huge.dropdown {
  1409. font-size: 1.42857143rem;
  1410. }
  1411. .ui.massive.dropdown {
  1412. font-size: 1.71428571rem;
  1413. }
  1414. /* Dropdown Item Size */
  1415. .ui.mini.dropdown .menu > .item {
  1416. font-size: 0.78571429rem;
  1417. }
  1418. .ui.tiny.dropdown .menu > .item {
  1419. font-size: 0.85714286rem;
  1420. }
  1421. .ui.small.dropdown .menu > .item {
  1422. font-size: 0.92857143rem;
  1423. }
  1424. .ui.dropdown .menu > .item {
  1425. font-size: 1rem;
  1426. }
  1427. .ui.large.dropdown .menu > .item {
  1428. font-size: 1.14285714rem;
  1429. }
  1430. .ui.big.dropdown .menu > .item {
  1431. font-size: 1.28571429rem;
  1432. }
  1433. .ui.huge.dropdown .menu > .item {
  1434. font-size: 1.42857143rem;
  1435. }
  1436. .ui.massive.dropdown .menu > .item {
  1437. font-size: 1.71428571rem;
  1438. }
  1439. /*--------------
  1440. Inverted
  1441. ---------------*/
  1442. /* General rules and basic dropdowns */
  1443. .ui.inverted.dropdown .menu {
  1444. background: #1B1C1D;
  1445. -webkit-box-shadow: none;
  1446. box-shadow: none;
  1447. border: 1px solid rgba(255, 255, 255, 0.15);
  1448. }
  1449. .ui.inverted.dropdown .menu > .item {
  1450. color: rgba(255, 255, 255, 0.8);
  1451. }
  1452. .ui.inverted.dropdown .menu .active.item {
  1453. background: transparent;
  1454. color: rgba(255, 255, 255, 0.8);
  1455. -webkit-box-shadow: none;
  1456. box-shadow: none;
  1457. }
  1458. .ui.inverted.dropdown .menu > .item:hover {
  1459. background: rgba(255, 255, 255, 0.08);
  1460. color: rgba(255, 255, 255, 0.8);
  1461. }
  1462. .ui.inverted.dropdown.selected,
  1463. .ui.inverted.dropdown .menu .selected.item {
  1464. background: rgba(255, 255, 255, 0.15);
  1465. color: rgba(255, 255, 255, 0.8);
  1466. }
  1467. .ui.inverted.dropdown .menu > .header {
  1468. color: #FFFFFF;
  1469. }
  1470. .ui.inverted.dropdown > .text > .description,
  1471. .ui.inverted.dropdown .menu > .item > .description {
  1472. color: rgba(255, 255, 255, 0.5);
  1473. }
  1474. .ui.inverted.dropdown .menu > .divider {
  1475. border-top: 1px solid rgba(255, 255, 255, 0.15);
  1476. }
  1477. .ui.inverted.dropdown .scrolling.menu {
  1478. border: none;
  1479. border-top: 1px solid rgba(255, 255, 255, 0.15);
  1480. }
  1481. /* Selection */
  1482. .ui.inverted.selection.dropdown {
  1483. border: 1px solid rgba(255, 255, 255, 0.15);
  1484. background: #1B1C1D;
  1485. color: rgba(255, 255, 255, 0.8);
  1486. }
  1487. .ui.inverted.selection.dropdown:hover {
  1488. border-color: rgba(255, 255, 255, 0.25);
  1489. -webkit-box-shadow: none;
  1490. box-shadow: none;
  1491. }
  1492. .ui.inverted.selection.dropdown input {
  1493. color: #FFFFFF;
  1494. }
  1495. .ui.inverted.dropdown:not(.button) > .default.text,
  1496. .ui.inverted.default.dropdown:not(.button) > .text {
  1497. color: rgba(255, 255, 255, 0.5);
  1498. }
  1499. .ui.inverted.dropdown:not(.button) > input:focus ~ .default.text,
  1500. .ui.inverted.default.dropdown:not(.button) > input:focus ~ .text {
  1501. color: rgba(255, 255, 255, 0.7);
  1502. }
  1503. .ui.inverted.selection.visible.dropdown > .text:not(.default) {
  1504. color: rgba(255, 255, 255, 0.9);
  1505. }
  1506. .ui.inverted.active.search.dropdown input.search:focus + .text .icon,
  1507. .ui.inverted.active.search.dropdown input.search:focus + .text .flag {
  1508. opacity: 0.45;
  1509. }
  1510. .ui.inverted.active.search.dropdown input.search:focus + .text {
  1511. color: rgba(255, 255, 255, 0.7) !important;
  1512. }
  1513. .ui.inverted.selection.active.dropdown .menu,
  1514. .ui.inverted.selection.active.dropdown:hover {
  1515. border-color: rgba(255, 255, 255, 0.15);
  1516. }
  1517. .ui.inverted.selection.dropdown .menu > .item {
  1518. border-top: 1px solid #242526;
  1519. }
  1520. .ui.inverted.dropdown .menu > .message:not(.ui) {
  1521. color: rgba(255, 255, 255, 0.5);
  1522. }
  1523. /* Fixing the border */
  1524. .ui.inverted.dropdown .menu > .item:first-child {
  1525. border-top-width: 0;
  1526. }
  1527. /* Labels */
  1528. .ui.inverted.multiple.dropdown > .label {
  1529. background-color: rgba(255, 255, 255, 0.7);
  1530. background-image: none;
  1531. color: #000000;
  1532. -webkit-box-shadow: 0 0 0 1px rgba(255, 255, 255, 0) inset;
  1533. box-shadow: 0 0 0 1px rgba(255, 255, 255, 0) inset;
  1534. }
  1535. .ui.inverted.multiple.dropdown > .label:hover {
  1536. background-color: rgba(255, 255, 255, 0.9);
  1537. border-color: rgba(255, 255, 255, 0.9);
  1538. background-image: none;
  1539. color: #000000;
  1540. }
  1541. .ui.inverted.multiple.dropdown > .label > .close.icon,
  1542. .ui.inverted.multiple.dropdown > .label > .delete.icon {
  1543. opacity: 0.6;
  1544. }
  1545. .ui.inverted.multiple.dropdown > .label > .close.icon:hover,
  1546. .ui.inverted.multiple.dropdown > .label > .delete.icon:hover {
  1547. opacity: 0.8;
  1548. }
  1549. /* Selection for form elements */
  1550. .ui.inverted.dropdown textarea::-webkit-selection,
  1551. .ui.inverted.dropdown input::-webkit-selection {
  1552. background-color: rgba(255, 255, 255, 0.25);
  1553. color: rgba(255, 255, 255, 0.8);
  1554. }
  1555. .ui.inverted.dropdown textarea::-moz-selection,
  1556. .ui.inverted.dropdown input::-moz-selection {
  1557. background-color: rgba(255, 255, 255, 0.25);
  1558. color: rgba(255, 255, 255, 0.8);
  1559. }
  1560. .ui.inverted.dropdown textarea::-moz-selection, .ui.inverted.dropdown input::-moz-selection {
  1561. background-color: rgba(255, 255, 255, 0.25);
  1562. color: rgba(255, 255, 255, 0.8);
  1563. }
  1564. .ui.inverted.dropdown textarea::selection,
  1565. .ui.inverted.dropdown input::selection {
  1566. background-color: rgba(255, 255, 255, 0.25);
  1567. color: rgba(255, 255, 255, 0.8);
  1568. }
  1569. /* Scrollbars */
  1570. .ui.inverted.dropdown .menu::-webkit-scrollbar-track {
  1571. background: rgba(255, 255, 255, 0.1);
  1572. }
  1573. .ui.inverted.dropdown .menu::-webkit-scrollbar-thumb {
  1574. background: rgba(255, 255, 255, 0.25);
  1575. }
  1576. .ui.inverted.dropdown .menu::-webkit-scrollbar-thumb:window-inactive {
  1577. background: rgba(255, 255, 255, 0.15);
  1578. }
  1579. .ui.inverted.dropdown .menu::-webkit-scrollbar-thumb:hover {
  1580. background: rgba(255, 255, 255, 0.35);
  1581. }
  1582. .ui.inverted.pointing.dropdown > .menu:after {
  1583. background: #1B1C1D;
  1584. -webkit-box-shadow: -1px -1px 0 0 rgba(255, 255, 255, 0.15);
  1585. box-shadow: -1px -1px 0 0 rgba(255, 255, 255, 0.15);
  1586. }
  1587. /*******************************
  1588. Theme Overrides
  1589. *******************************/
  1590. /* Dropdown Carets */
  1591. @font-face {
  1592. font-family: 'Dropdown';
  1593. src: url(data:application/x-font-ttf;charset=utf-8;base64,AAEAAAALAIAAAwAwT1MvMggjB5AAAAC8AAAAYGNtYXAPfuIIAAABHAAAAExnYXNwAAAAEAAAAWgAAAAIZ2x5Zjo82LgAAAFwAAABVGhlYWQAQ88bAAACxAAAADZoaGVhAwcB6QAAAvwAAAAkaG10eAS4ABIAAAMgAAAAIGxvY2EBNgDeAAADQAAAABJtYXhwAAoAFgAAA1QAAAAgbmFtZVcZpu4AAAN0AAABRXBvc3QAAwAAAAAEvAAAACAAAwIAAZAABQAAAUwBZgAAAEcBTAFmAAAA9QAZAIQAAAAAAAAAAAAAAAAAAAABEAAAAAAAAAAAAAAAAAAAAABAAADw2gHg/+D/4AHgACAAAAABAAAAAAAAAAAAAAAgAAAAAAACAAAAAwAAABQAAwABAAAAFAAEADgAAAAKAAgAAgACAAEAIPDa//3//wAAAAAAIPDX//3//wAB/+MPLQADAAEAAAAAAAAAAAAAAAEAAf//AA8AAQAAAAAAAAAAAAIAADc5AQAAAAABAAAAAAAAAAAAAgAANzkBAAAAAAEAAAAAAAAAAAACAAA3OQEAAAAAAQAAAIABJQElABMAABM0NzY3BTYXFhUUDwEGJwYvASY1AAUGBwEACAUGBoAFCAcGgAUBEgcGBQEBAQcECQYHfwYBAQZ/BwYAAQAAAG4BJQESABMAADc0PwE2MzIfARYVFAcGIyEiJyY1AAWABgcIBYAGBgUI/wAHBgWABwaABQWABgcHBgUFBgcAAAABABIASQC3AW4AEwAANzQ/ATYXNhcWHQEUBwYnBi8BJjUSBoAFCAcFBgYFBwgFgAbbBwZ/BwEBBwQJ/wgEBwEBB38GBgAAAAABAAAASQClAW4AEwAANxE0NzYzMh8BFhUUDwEGIyInJjUABQYHCAWABgaABQgHBgVbAQAIBQYGgAUIBwWABgYFBwAAAAEAAAABAADZuaKOXw889QALAgAAAAAA0ABHWAAAAADQAEdYAAAAAAElAW4AAAAIAAIAAAAAAAAAAQAAAeD/4AAAAgAAAAAAASUAAQAAAAAAAAAAAAAAAAAAAAgAAAAAAAAAAAAAAAABAAAAASUAAAElAAAAtwASALcAAAAAAAAACgAUAB4AQgBkAIgAqgAAAAEAAAAIABQAAQAAAAAAAgAAAAAAAAAAAAAAAAAAAAAAAAAOAK4AAQAAAAAAAQAOAAAAAQAAAAAAAgAOAEcAAQAAAAAAAwAOACQAAQAAAAAABAAOAFUAAQAAAAAABQAWAA4AAQAAAAAABgAHADIAAQAAAAAACgA0AGMAAwABBAkAAQAOAAAAAwABBAkAAgAOAEcAAwABBAkAAwAOACQAAwABBAkABAAOAFUAAwABBAkABQAWAA4AAwABBAkABgAOADkAAwABBAkACgA0AGMAaQBjAG8AbQBvAG8AbgBWAGUAcgBzAGkAbwBuACAAMQAuADAAaQBjAG8AbQBvAG8Abmljb21vb24AaQBjAG8AbQBvAG8AbgBSAGUAZwB1AGwAYQByAGkAYwBvAG0AbwBvAG4ARgBvAG4AdAAgAGcAZQBuAGUAcgBhAHQAZQBkACAAYgB5ACAASQBjAG8ATQBvAG8AbgAuAAAAAAMAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA=) format('truetype'), url(data:application/font-woff;charset=utf-8;base64,d09GRk9UVE8AAAVwAAoAAAAABSgAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAABDRkYgAAAA9AAAAdkAAAHZLDXE/09TLzIAAALQAAAAYAAAAGAIIweQY21hcAAAAzAAAABMAAAATA9+4ghnYXNwAAADfAAAAAgAAAAIAAAAEGhlYWQAAAOEAAAANgAAADYAQ88baGhlYQAAA7wAAAAkAAAAJAMHAelobXR4AAAD4AAAACAAAAAgBLgAEm1heHAAAAQAAAAABgAAAAYACFAAbmFtZQAABAgAAAFFAAABRVcZpu5wb3N0AAAFUAAAACAAAAAgAAMAAAEABAQAAQEBCGljb21vb24AAQIAAQA6+BwC+BsD+BgEHgoAGVP/i4seCgAZU/+LiwwHi2v4lPh0BR0AAACIDx0AAACNER0AAAAJHQAAAdASAAkBAQgPERMWGyAlKmljb21vb25pY29tb29udTB1MXUyMHVGMEQ3dUYwRDh1RjBEOXVGMERBAAACAYkABgAIAgABAAQABwAKAA0AVgCfAOgBL/yUDvyUDvyUDvuUDvtvi/emFYuQjZCOjo+Pj42Qiwj3lIsFkIuQiY6Hj4iNhouGi4aJh4eHCPsU+xQFiIiGiYaLhouHjYeOCPsU9xQFiI+Jj4uQCA77b4v3FBWLkI2Pjo8I9xT3FAWPjo+NkIuQi5CJjogI9xT7FAWPh42Hi4aLhomHh4eIiIaJhosI+5SLBYaLh42HjoiPiY+LkAgO+92d928Vi5CNkI+OCPcU9xQFjo+QjZCLkIuPiY6Hj4iNhouGCIv7lAWLhomHh4iIh4eJhouGi4aNiI8I+xT3FAWHjomPi5AIDvvdi+YVi/eUBYuQjZCOjo+Pj42Qi5CLkImOhwj3FPsUBY+IjYaLhouGiYeHiAj7FPsUBYiHhomGi4aLh42Hj4iOiY+LkAgO+JQU+JQViwwKAAAAAAMCAAGQAAUAAAFMAWYAAABHAUwBZgAAAPUAGQCEAAAAAAAAAAAAAAAAAAAAARAAAAAAAAAAAAAAAAAAAAAAQAAA8NoB4P/g/+AB4AAgAAAAAQAAAAAAAAAAAAAAIAAAAAAAAgAAAAMAAAAUAAMAAQAAABQABAA4AAAACgAIAAIAAgABACDw2v/9//8AAAAAACDw1//9//8AAf/jDy0AAwABAAAAAAAAAAAAAAABAAH//wAPAAEAAAABAAA5emozXw889QALAgAAAAAA0ABHWAAAAADQAEdYAAAAAAElAW4AAAAIAAIAAAAAAAAAAQAAAeD/4AAAAgAAAAAAASUAAQAAAAAAAAAAAAAAAAAAAAgAAAAAAAAAAAAAAAABAAAAASUAAAElAAAAtwASALcAAAAAUAAACAAAAAAADgCuAAEAAAAAAAEADgAAAAEAAAAAAAIADgBHAAEAAAAAAAMADgAkAAEAAAAAAAQADgBVAAEAAAAAAAUAFgAOAAEAAAAAAAYABwAyAAEAAAAAAAoANABjAAMAAQQJAAEADgAAAAMAAQQJAAIADgBHAAMAAQQJAAMADgAkAAMAAQQJAAQADgBVAAMAAQQJAAUAFgAOAAMAAQQJAAYADgA5AAMAAQQJAAoANABjAGkAYwBvAG0AbwBvAG4AVgBlAHIAcwBpAG8AbgAgADEALgAwAGkAYwBvAG0AbwBvAG5pY29tb29uAGkAYwBvAG0AbwBvAG4AUgBlAGcAdQBsAGEAcgBpAGMAbwBtAG8AbwBuAEYAbwBuAHQAIABnAGUAbgBlAHIAYQB0AGUAZAAgAGIAeQAgAEkAYwBvAE0AbwBvAG4ALgAAAAADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA) format('woff');
  1594. font-weight: normal;
  1595. font-style: normal;
  1596. }
  1597. .ui.dropdown > .dropdown.icon {
  1598. font-family: 'Dropdown';
  1599. line-height: 1;
  1600. height: 1em;
  1601. width: 1.23em;
  1602. -webkit-backface-visibility: hidden;
  1603. backface-visibility: hidden;
  1604. font-weight: normal;
  1605. font-style: normal;
  1606. text-align: center;
  1607. }
  1608. .ui.dropdown > .dropdown.icon {
  1609. width: auto;
  1610. }
  1611. .ui.dropdown > .dropdown.icon:before {
  1612. content: '\f0d7';
  1613. }
  1614. /* Sub Menu */
  1615. .ui.dropdown .menu .item .dropdown.icon:before {
  1616. content: '\f0da' /*rtl:'\f0d9'*/;
  1617. }
  1618. .ui.dropdown .item .left.dropdown.icon:before,
  1619. .ui.dropdown .left.menu .item .dropdown.icon:before {
  1620. content: "\f0d9" /*rtl:"\f0da"*/;
  1621. }
  1622. /* Vertical Menu Dropdown */
  1623. .ui.vertical.menu .dropdown.item > .dropdown.icon:before {
  1624. content: "\f0da" /*rtl:"\f0d9"*/;
  1625. }
  1626. /* Icons for Reference
  1627. .dropdown.down.icon {
  1628. content: "\f0d7";
  1629. }
  1630. .dropdown.up.icon {
  1631. content: "\f0d8";
  1632. }
  1633. .dropdown.left.icon {
  1634. content: "\f0d9";
  1635. }
  1636. .dropdown.icon.icon {
  1637. content: "\f0da";
  1638. }
  1639. */
  1640. /*******************************
  1641. User Overrides
  1642. *******************************/