svg-with-js.css 7.9 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372
  1. /*!
  2. * Font Awesome Free 5.15.4 by @fontawesome - https://fontawesome.com
  3. * License - https://fontawesome.com/license/free (Icons: CC BY 4.0, Fonts: SIL OFL 1.1, Code: MIT License)
  4. */
  5. svg:not(:root).svg-inline--fa {
  6. overflow: visible; }
  7. .svg-inline--fa {
  8. display: inline-block;
  9. font-size: inherit;
  10. height: 1em;
  11. overflow: visible;
  12. vertical-align: -.125em; }
  13. .svg-inline--fa.fa-lg {
  14. vertical-align: -.225em; }
  15. .svg-inline--fa.fa-w-1 {
  16. width: 0.0625em; }
  17. .svg-inline--fa.fa-w-2 {
  18. width: 0.125em; }
  19. .svg-inline--fa.fa-w-3 {
  20. width: 0.1875em; }
  21. .svg-inline--fa.fa-w-4 {
  22. width: 0.25em; }
  23. .svg-inline--fa.fa-w-5 {
  24. width: 0.3125em; }
  25. .svg-inline--fa.fa-w-6 {
  26. width: 0.375em; }
  27. .svg-inline--fa.fa-w-7 {
  28. width: 0.4375em; }
  29. .svg-inline--fa.fa-w-8 {
  30. width: 0.5em; }
  31. .svg-inline--fa.fa-w-9 {
  32. width: 0.5625em; }
  33. .svg-inline--fa.fa-w-10 {
  34. width: 0.625em; }
  35. .svg-inline--fa.fa-w-11 {
  36. width: 0.6875em; }
  37. .svg-inline--fa.fa-w-12 {
  38. width: 0.75em; }
  39. .svg-inline--fa.fa-w-13 {
  40. width: 0.8125em; }
  41. .svg-inline--fa.fa-w-14 {
  42. width: 0.875em; }
  43. .svg-inline--fa.fa-w-15 {
  44. width: 0.9375em; }
  45. .svg-inline--fa.fa-w-16 {
  46. width: 1em; }
  47. .svg-inline--fa.fa-w-17 {
  48. width: 1.0625em; }
  49. .svg-inline--fa.fa-w-18 {
  50. width: 1.125em; }
  51. .svg-inline--fa.fa-w-19 {
  52. width: 1.1875em; }
  53. .svg-inline--fa.fa-w-20 {
  54. width: 1.25em; }
  55. .svg-inline--fa.fa-pull-left {
  56. margin-right: .3em;
  57. width: auto; }
  58. .svg-inline--fa.fa-pull-right {
  59. margin-left: .3em;
  60. width: auto; }
  61. .svg-inline--fa.fa-border {
  62. height: 1.5em; }
  63. .svg-inline--fa.fa-li {
  64. width: 2em; }
  65. .svg-inline--fa.fa-fw {
  66. width: 1.25em; }
  67. .fa-layers svg.svg-inline--fa {
  68. bottom: 0;
  69. left: 0;
  70. margin: auto;
  71. position: absolute;
  72. right: 0;
  73. top: 0; }
  74. .fa-layers {
  75. display: inline-block;
  76. height: 1em;
  77. position: relative;
  78. text-align: center;
  79. vertical-align: -.125em;
  80. width: 1em; }
  81. .fa-layers svg.svg-inline--fa {
  82. -webkit-transform-origin: center center;
  83. transform-origin: center center; }
  84. .fa-layers-text, .fa-layers-counter {
  85. display: inline-block;
  86. position: absolute;
  87. text-align: center; }
  88. .fa-layers-text {
  89. left: 50%;
  90. top: 50%;
  91. -webkit-transform: translate(-50%, -50%);
  92. transform: translate(-50%, -50%);
  93. -webkit-transform-origin: center center;
  94. transform-origin: center center; }
  95. .fa-layers-counter {
  96. background-color: #ff253a;
  97. border-radius: 1em;
  98. -webkit-box-sizing: border-box;
  99. box-sizing: border-box;
  100. color: #fff;
  101. height: 1.5em;
  102. line-height: 1;
  103. max-width: 5em;
  104. min-width: 1.5em;
  105. overflow: hidden;
  106. padding: .25em;
  107. right: 0;
  108. text-overflow: ellipsis;
  109. top: 0;
  110. -webkit-transform: scale(0.25);
  111. transform: scale(0.25);
  112. -webkit-transform-origin: top right;
  113. transform-origin: top right; }
  114. .fa-layers-bottom-right {
  115. bottom: 0;
  116. right: 0;
  117. top: auto;
  118. -webkit-transform: scale(0.25);
  119. transform: scale(0.25);
  120. -webkit-transform-origin: bottom right;
  121. transform-origin: bottom right; }
  122. .fa-layers-bottom-left {
  123. bottom: 0;
  124. left: 0;
  125. right: auto;
  126. top: auto;
  127. -webkit-transform: scale(0.25);
  128. transform: scale(0.25);
  129. -webkit-transform-origin: bottom left;
  130. transform-origin: bottom left; }
  131. .fa-layers-top-right {
  132. right: 0;
  133. top: 0;
  134. -webkit-transform: scale(0.25);
  135. transform: scale(0.25);
  136. -webkit-transform-origin: top right;
  137. transform-origin: top right; }
  138. .fa-layers-top-left {
  139. left: 0;
  140. right: auto;
  141. top: 0;
  142. -webkit-transform: scale(0.25);
  143. transform: scale(0.25);
  144. -webkit-transform-origin: top left;
  145. transform-origin: top left; }
  146. .fa-lg {
  147. font-size: 1.33333em;
  148. line-height: 0.75em;
  149. vertical-align: -.0667em; }
  150. .fa-xs {
  151. font-size: .75em; }
  152. .fa-sm {
  153. font-size: .875em; }
  154. .fa-1x {
  155. font-size: 1em; }
  156. .fa-2x {
  157. font-size: 2em; }
  158. .fa-3x {
  159. font-size: 3em; }
  160. .fa-4x {
  161. font-size: 4em; }
  162. .fa-5x {
  163. font-size: 5em; }
  164. .fa-6x {
  165. font-size: 6em; }
  166. .fa-7x {
  167. font-size: 7em; }
  168. .fa-8x {
  169. font-size: 8em; }
  170. .fa-9x {
  171. font-size: 9em; }
  172. .fa-10x {
  173. font-size: 10em; }
  174. .fa-fw {
  175. text-align: center;
  176. width: 1.25em; }
  177. .fa-ul {
  178. list-style-type: none;
  179. margin-left: 2.5em;
  180. padding-left: 0; }
  181. .fa-ul > li {
  182. position: relative; }
  183. .fa-li {
  184. left: -2em;
  185. position: absolute;
  186. text-align: center;
  187. width: 2em;
  188. line-height: inherit; }
  189. .fa-border {
  190. border: solid 0.08em #eee;
  191. border-radius: .1em;
  192. padding: .2em .25em .15em; }
  193. .fa-pull-left {
  194. float: left; }
  195. .fa-pull-right {
  196. float: right; }
  197. .fa.fa-pull-left,
  198. .fas.fa-pull-left,
  199. .far.fa-pull-left,
  200. .fal.fa-pull-left,
  201. .fab.fa-pull-left {
  202. margin-right: .3em; }
  203. .fa.fa-pull-right,
  204. .fas.fa-pull-right,
  205. .far.fa-pull-right,
  206. .fal.fa-pull-right,
  207. .fab.fa-pull-right {
  208. margin-left: .3em; }
  209. .fa-spin {
  210. -webkit-animation: fa-spin 2s infinite linear;
  211. animation: fa-spin 2s infinite linear; }
  212. .fa-pulse {
  213. -webkit-animation: fa-spin 1s infinite steps(8);
  214. animation: fa-spin 1s infinite steps(8); }
  215. @-webkit-keyframes fa-spin {
  216. 0% {
  217. -webkit-transform: rotate(0deg);
  218. transform: rotate(0deg); }
  219. 100% {
  220. -webkit-transform: rotate(360deg);
  221. transform: rotate(360deg); } }
  222. @keyframes fa-spin {
  223. 0% {
  224. -webkit-transform: rotate(0deg);
  225. transform: rotate(0deg); }
  226. 100% {
  227. -webkit-transform: rotate(360deg);
  228. transform: rotate(360deg); } }
  229. .fa-rotate-90 {
  230. -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=1)";
  231. -webkit-transform: rotate(90deg);
  232. transform: rotate(90deg); }
  233. .fa-rotate-180 {
  234. -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=2)";
  235. -webkit-transform: rotate(180deg);
  236. transform: rotate(180deg); }
  237. .fa-rotate-270 {
  238. -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=3)";
  239. -webkit-transform: rotate(270deg);
  240. transform: rotate(270deg); }
  241. .fa-flip-horizontal {
  242. -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=0, mirror=1)";
  243. -webkit-transform: scale(-1, 1);
  244. transform: scale(-1, 1); }
  245. .fa-flip-vertical {
  246. -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=2, mirror=1)";
  247. -webkit-transform: scale(1, -1);
  248. transform: scale(1, -1); }
  249. .fa-flip-both, .fa-flip-horizontal.fa-flip-vertical {
  250. -ms-filter: "progid:DXImageTransform.Microsoft.BasicImage(rotation=2, mirror=1)";
  251. -webkit-transform: scale(-1, -1);
  252. transform: scale(-1, -1); }
  253. :root .fa-rotate-90,
  254. :root .fa-rotate-180,
  255. :root .fa-rotate-270,
  256. :root .fa-flip-horizontal,
  257. :root .fa-flip-vertical,
  258. :root .fa-flip-both {
  259. -webkit-filter: none;
  260. filter: none; }
  261. .fa-stack {
  262. display: inline-block;
  263. height: 2em;
  264. position: relative;
  265. width: 2.5em; }
  266. .fa-stack-1x,
  267. .fa-stack-2x {
  268. bottom: 0;
  269. left: 0;
  270. margin: auto;
  271. position: absolute;
  272. right: 0;
  273. top: 0; }
  274. .svg-inline--fa.fa-stack-1x {
  275. height: 1em;
  276. width: 1.25em; }
  277. .svg-inline--fa.fa-stack-2x {
  278. height: 2em;
  279. width: 2.5em; }
  280. .fa-inverse {
  281. color: #fff; }
  282. .sr-only {
  283. border: 0;
  284. clip: rect(0, 0, 0, 0);
  285. height: 1px;
  286. margin: -1px;
  287. overflow: hidden;
  288. padding: 0;
  289. position: absolute;
  290. width: 1px; }
  291. .sr-only-focusable:active, .sr-only-focusable:focus {
  292. clip: auto;
  293. height: auto;
  294. margin: 0;
  295. overflow: visible;
  296. position: static;
  297. width: auto; }
  298. .svg-inline--fa .fa-primary {
  299. fill: var(--fa-primary-color, currentColor);
  300. opacity: 1;
  301. opacity: var(--fa-primary-opacity, 1); }
  302. .svg-inline--fa .fa-secondary {
  303. fill: var(--fa-secondary-color, currentColor);
  304. opacity: 0.4;
  305. opacity: var(--fa-secondary-opacity, 0.4); }
  306. .svg-inline--fa.fa-swap-opacity .fa-primary {
  307. opacity: 0.4;
  308. opacity: var(--fa-secondary-opacity, 0.4); }
  309. .svg-inline--fa.fa-swap-opacity .fa-secondary {
  310. opacity: 1;
  311. opacity: var(--fa-primary-opacity, 1); }
  312. .svg-inline--fa mask .fa-primary,
  313. .svg-inline--fa mask .fa-secondary {
  314. fill: black; }
  315. .fad.fa-inverse {
  316. color: #fff; }