Advertisement
Guest User

main.css

a guest
Nov 12th, 2019
125
0
Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 47.38 KB | None | 0 0
  1. html,
  2. body,
  3. div,
  4. span,
  5. applet,
  6. object,
  7. iframe,
  8. h1,
  9. h2,
  10. h3,
  11. h4,
  12. h5,
  13. h6,
  14. p,
  15. blockquote,
  16. pre,
  17. a,
  18. abbr,
  19. acronym,
  20. address,
  21. big,
  22. cite,
  23. code,
  24. del,
  25. dfn,
  26. em,
  27. img,
  28. ins,
  29. kbd,
  30. q,
  31. s,
  32. samp,
  33. small,
  34. strike,
  35. strong,
  36. sub,
  37. sup,
  38. tt,
  39. var,
  40. b,
  41. u,
  42. i,
  43. center,
  44. dl,
  45. dt,
  46. dd,
  47. ol,
  48. ul,
  49. li,
  50. fieldset,
  51. form,
  52. label,
  53. legend,
  54. table,
  55. caption,
  56. tbody,
  57. tfoot,
  58. thead,
  59. tr,
  60. th,
  61. td,
  62. article,
  63. aside,
  64. canvas,
  65. details,
  66. embed,
  67. figure,
  68. figcaption,
  69. footer,
  70. header,
  71. hgroup,
  72. menu,
  73. nav,
  74. output,
  75. ruby,
  76. section,
  77. summary,
  78. time,
  79. mark,
  80. audio,
  81. video {
  82. margin:0;
  83. padding:0;
  84. border:0;
  85. font-size:100%;
  86. font:inherit;
  87. vertical-align:baseline
  88. }
  89. article,
  90. aside,
  91. details,
  92. figcaption,
  93. figure,
  94. footer,
  95. header,
  96. hgroup,
  97. menu,
  98. nav,
  99. section {
  100. display:block
  101. }
  102. body {
  103. line-height:1
  104. }
  105. ol,
  106. ul {
  107. list-style:none
  108. }
  109. blockquote,
  110. q {
  111. quotes:none
  112. }
  113. blockquote:before,
  114. blockquote:after,
  115. q:before,
  116. q:after {
  117. content:'';
  118. content:none
  119. }
  120. table {
  121. border-collapse:collapse;
  122. border-spacing:0
  123. }
  124. /*!
  125. * Hamburgers
  126. * @description Tasty CSS-animated hamburgers
  127. * @author Jonathan Suh @jonsuh
  128. * @site https://jonsuh.com/hamburgers
  129. * @link https://github.com/jonsuh/hamburgers
  130. */.hamburger {
  131. z-index:100;
  132. outline:0;
  133. padding:15px 15px;
  134. display:inline-block;
  135. cursor:pointer;
  136. transition-property:opacity, filter;
  137. transition-duration:0.15s;
  138. transition-timing-function:linear;
  139. font:inherit;
  140. color:inherit;
  141. text-transform:none;
  142. background-color:transparent;
  143. border:0;
  144. margin:0;
  145. overflow:visible
  146. }
  147. .hamburger:hover {
  148. opacity:0.7
  149. }
  150. .hamburger.is-active:hover {
  151. opacity:0.7
  152. }
  153. .hamburger.is-active .hamburger-inner,
  154. .hamburger.is-active .hamburger-inner::before,
  155. .hamburger.is-active .hamburger-inner::after {
  156. background-color:#000
  157. }
  158. .hamburger-box {
  159. width:25px;
  160. height:15px;
  161. display:inline-block;
  162. position:relative
  163. }
  164. .hamburger-inner {
  165. display:block;
  166. top:50%;
  167. margin-top:-2px
  168. }
  169. .hamburger-inner,
  170. .hamburger-inner::before,
  171. .hamburger-inner::after {
  172. width:25px;
  173. height:2px;
  174. background-color:#000;
  175. border-radius:0px;
  176. position:absolute;
  177. transition-property:transform;
  178. transition-duration:0.15s;
  179. transition-timing-function:ease
  180. }
  181. .hamburger-inner::before,
  182. .hamburger-inner::after {
  183. content:"";
  184. display:block
  185. }
  186. .hamburger-inner::before {
  187. top:-6px
  188. }
  189. .hamburger-inner::after {
  190. bottom:-6px
  191. }
  192. .hamburger--3dx .hamburger-box {
  193. perspective:80px
  194. }
  195. .hamburger--3dx .hamburger-inner {
  196. transition:transform 0.15s cubic-bezier(0.645, 0.045, 0.355, 1),background-color 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1)
  197. }
  198. .hamburger--3dx .hamburger-inner::before,
  199. .hamburger--3dx .hamburger-inner::after {
  200. transition:transform 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1)
  201. }
  202. .hamburger--3dx.is-active .hamburger-inner {
  203. background-color:transparent !important;
  204. transform:rotateY(180deg)
  205. }
  206. .hamburger--3dx.is-active .hamburger-inner::before {
  207. transform:translate3d(0, 10px, 0) rotate(45deg)
  208. }
  209. .hamburger--3dx.is-active .hamburger-inner::after {
  210. transform:translate3d(0, -10px, 0) rotate(-45deg)
  211. }
  212. .hamburger--3dx-r .hamburger-box {
  213. perspective:80px
  214. }
  215. .hamburger--3dx-r .hamburger-inner {
  216. transition:transform 0.15s cubic-bezier(0.645, 0.045, 0.355, 1),background-color 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1)
  217. }
  218. .hamburger--3dx-r .hamburger-inner::before,
  219. .hamburger--3dx-r .hamburger-inner::after {
  220. transition:transform 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1)
  221. }
  222. .hamburger--3dx-r.is-active .hamburger-inner {
  223. background-color:transparent !important;
  224. transform:rotateY(-180deg)
  225. }
  226. .hamburger--3dx-r.is-active .hamburger-inner::before {
  227. transform:translate3d(0, 10px, 0) rotate(45deg)
  228. }
  229. .hamburger--3dx-r.is-active .hamburger-inner::after {
  230. transform:translate3d(0, -10px, 0) rotate(-45deg)
  231. }
  232. .hamburger--3dy .hamburger-box {
  233. perspective:80px
  234. }
  235. .hamburger--3dy .hamburger-inner {
  236. transition:transform 0.15s cubic-bezier(0.645, 0.045, 0.355, 1),background-color 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1)
  237. }
  238. .hamburger--3dy .hamburger-inner::before,
  239. .hamburger--3dy .hamburger-inner::after {
  240. transition:transform 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1)
  241. }
  242. .hamburger--3dy.is-active .hamburger-inner {
  243. background-color:transparent !important;
  244. transform:rotateX(-180deg)
  245. }
  246. .hamburger--3dy.is-active .hamburger-inner::before {
  247. transform:translate3d(0, 10px, 0) rotate(45deg)
  248. }
  249. .hamburger--3dy.is-active .hamburger-inner::after {
  250. transform:translate3d(0, -10px, 0) rotate(-45deg)
  251. }
  252. .hamburger--3dy-r .hamburger-box {
  253. perspective:80px
  254. }
  255. .hamburger--3dy-r .hamburger-inner {
  256. transition:transform 0.15s cubic-bezier(0.645, 0.045, 0.355, 1),background-color 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1)
  257. }
  258. .hamburger--3dy-r .hamburger-inner::before,
  259. .hamburger--3dy-r .hamburger-inner::after {
  260. transition:transform 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1)
  261. }
  262. .hamburger--3dy-r.is-active .hamburger-inner {
  263. background-color:transparent !important;
  264. transform:rotateX(180deg)
  265. }
  266. .hamburger--3dy-r.is-active .hamburger-inner::before {
  267. transform:translate3d(0, 10px, 0) rotate(45deg)
  268. }
  269. .hamburger--3dy-r.is-active .hamburger-inner::after {
  270. transform:translate3d(0, -10px, 0) rotate(-45deg)
  271. }
  272. .hamburger--3dxy .hamburger-box {
  273. perspective:80px
  274. }
  275. .hamburger--3dxy .hamburger-inner {
  276. transition:transform 0.15s cubic-bezier(0.645, 0.045, 0.355, 1),background-color 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1)
  277. }
  278. .hamburger--3dxy .hamburger-inner::before,
  279. .hamburger--3dxy .hamburger-inner::after {
  280. transition:transform 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1)
  281. }
  282. .hamburger--3dxy.is-active .hamburger-inner {
  283. background-color:transparent !important;
  284. transform:rotateX(180deg) rotateY(180deg)
  285. }
  286. .hamburger--3dxy.is-active .hamburger-inner::before {
  287. transform:translate3d(0, 10px, 0) rotate(45deg)
  288. }
  289. .hamburger--3dxy.is-active .hamburger-inner::after {
  290. transform:translate3d(0, -10px, 0) rotate(-45deg)
  291. }
  292. .hamburger--3dxy-r .hamburger-box {
  293. perspective:80px
  294. }
  295. .hamburger--3dxy-r .hamburger-inner {
  296. transition:transform 0.15s cubic-bezier(0.645, 0.045, 0.355, 1),background-color 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1)
  297. }
  298. .hamburger--3dxy-r .hamburger-inner::before,
  299. .hamburger--3dxy-r .hamburger-inner::after {
  300. transition:transform 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1)
  301. }
  302. .hamburger--3dxy-r.is-active .hamburger-inner {
  303. background-color:transparent !important;
  304. transform:rotateX(180deg) rotateY(180deg) rotateZ(-180deg)
  305. }
  306. .hamburger--3dxy-r.is-active .hamburger-inner::before {
  307. transform:translate3d(0, 10px, 0) rotate(45deg)
  308. }
  309. .hamburger--3dxy-r.is-active .hamburger-inner::after {
  310. transform:translate3d(0, -10px, 0) rotate(-45deg)
  311. }
  312. .hamburger--arrow.is-active .hamburger-inner::before {
  313. transform:translate3d(-8px, 0, 0) rotate(-45deg) scale(0.7, 1)
  314. }
  315. .hamburger--arrow.is-active .hamburger-inner::after {
  316. transform:translate3d(-8px, 0, 0) rotate(45deg) scale(0.7, 1)
  317. }
  318. .hamburger--arrow-r.is-active .hamburger-inner::before {
  319. transform:translate3d(8px, 0, 0) rotate(45deg) scale(0.7, 1)
  320. }
  321. .hamburger--arrow-r.is-active .hamburger-inner::after {
  322. transform:translate3d(8px, 0, 0) rotate(-45deg) scale(0.7, 1)
  323. }
  324. .hamburger--arrowalt .hamburger-inner::before {
  325. transition:top 0.1s 0.1s ease,transform 0.1s cubic-bezier(0.165, 0.84, 0.44, 1)
  326. }
  327. .hamburger--arrowalt .hamburger-inner::after {
  328. transition:bottom 0.1s 0.1s ease,transform 0.1s cubic-bezier(0.165, 0.84, 0.44, 1)
  329. }
  330. .hamburger--arrowalt.is-active .hamburger-inner::before {
  331. top:0;
  332. transform:translate3d(-8px, -10px, 0) rotate(-45deg) scale(0.7, 1);
  333. transition:top 0.1s ease,transform 0.1s 0.1s cubic-bezier(0.895, 0.03, 0.685, 0.22)
  334. }
  335. .hamburger--arrowalt.is-active .hamburger-inner::after {
  336. bottom:0;
  337. transform:translate3d(-8px, 10px, 0) rotate(45deg) scale(0.7, 1);
  338. transition:bottom 0.1s ease,transform 0.1s 0.1s cubic-bezier(0.895, 0.03, 0.685, 0.22)
  339. }
  340. .hamburger--arrowalt-r .hamburger-inner::before {
  341. transition:top 0.1s 0.1s ease,transform 0.1s cubic-bezier(0.165, 0.84, 0.44, 1)
  342. }
  343. .hamburger--arrowalt-r .hamburger-inner::after {
  344. transition:bottom 0.1s 0.1s ease,transform 0.1s cubic-bezier(0.165, 0.84, 0.44, 1)
  345. }
  346. .hamburger--arrowalt-r.is-active .hamburger-inner::before {
  347. top:0;
  348. transform:translate3d(8px, -10px, 0) rotate(45deg) scale(0.7, 1);
  349. transition:top 0.1s ease,transform 0.1s 0.1s cubic-bezier(0.895, 0.03, 0.685, 0.22)
  350. }
  351. .hamburger--arrowalt-r.is-active .hamburger-inner::after {
  352. bottom:0;
  353. transform:translate3d(8px, 10px, 0) rotate(-45deg) scale(0.7, 1);
  354. transition:bottom 0.1s ease,transform 0.1s 0.1s cubic-bezier(0.895, 0.03, 0.685, 0.22)
  355. }
  356. .hamburger--arrowturn.is-active .hamburger-inner {
  357. transform:rotate(-180deg)
  358. }
  359. .hamburger--arrowturn.is-active .hamburger-inner::before {
  360. transform:translate3d(8px, 0, 0) rotate(45deg) scale(0.7, 1)
  361. }
  362. .hamburger--arrowturn.is-active .hamburger-inner::after {
  363. transform:translate3d(8px, 0, 0) rotate(-45deg) scale(0.7, 1)
  364. }
  365. .hamburger--arrowturn-r.is-active .hamburger-inner {
  366. transform:rotate(-180deg)
  367. }
  368. .hamburger--arrowturn-r.is-active .hamburger-inner::before {
  369. transform:translate3d(-8px, 0, 0) rotate(-45deg) scale(0.7, 1)
  370. }
  371. .hamburger--arrowturn-r.is-active .hamburger-inner::after {
  372. transform:translate3d(-8px, 0, 0) rotate(45deg) scale(0.7, 1)
  373. }
  374. .hamburger--boring .hamburger-inner,
  375. .hamburger--boring .hamburger-inner::before,
  376. .hamburger--boring .hamburger-inner::after {
  377. transition-property:none
  378. }
  379. .hamburger--boring.is-active .hamburger-inner {
  380. transform:rotate(45deg)
  381. }
  382. .hamburger--boring.is-active .hamburger-inner::before {
  383. top:0;
  384. opacity:0
  385. }
  386. .hamburger--boring.is-active .hamburger-inner::after {
  387. bottom:0;
  388. transform:rotate(-90deg)
  389. }
  390. .hamburger--collapse .hamburger-inner {
  391. top:auto;
  392. bottom:0;
  393. transition-duration:0.13s;
  394. transition-delay:0.13s;
  395. transition-timing-function:cubic-bezier(0.55, 0.055, 0.675, 0.19)
  396. }
  397. .hamburger--collapse .hamburger-inner::after {
  398. top:-20px;
  399. transition:top 0.2s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1),opacity 0.1s linear
  400. }
  401. .hamburger--collapse .hamburger-inner::before {
  402. transition:top 0.12s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1),transform 0.13s cubic-bezier(0.55, 0.055, 0.675, 0.19)
  403. }
  404. .hamburger--collapse.is-active .hamburger-inner {
  405. transform:translate3d(0, -10px, 0) rotate(-45deg);
  406. transition-delay:0.22s;
  407. transition-timing-function:cubic-bezier(0.215, 0.61, 0.355, 1)
  408. }
  409. .hamburger--collapse.is-active .hamburger-inner::after {
  410. top:0;
  411. opacity:0;
  412. transition:top 0.2s cubic-bezier(0.33333, 0, 0.66667, 0.33333),opacity 0.1s 0.22s linear
  413. }
  414. .hamburger--collapse.is-active .hamburger-inner::before {
  415. top:0;
  416. transform:rotate(-90deg);
  417. transition:top 0.1s 0.16s cubic-bezier(0.33333, 0, 0.66667, 0.33333),transform 0.13s 0.25s cubic-bezier(0.215, 0.61, 0.355, 1)
  418. }
  419. .hamburger--collapse-r .hamburger-inner {
  420. top:auto;
  421. bottom:0;
  422. transition-duration:0.13s;
  423. transition-delay:0.13s;
  424. transition-timing-function:cubic-bezier(0.55, 0.055, 0.675, 0.19)
  425. }
  426. .hamburger--collapse-r .hamburger-inner::after {
  427. top:-20px;
  428. transition:top 0.2s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1),opacity 0.1s linear
  429. }
  430. .hamburger--collapse-r .hamburger-inner::before {
  431. transition:top 0.12s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1),transform 0.13s cubic-bezier(0.55, 0.055, 0.675, 0.19)
  432. }
  433. .hamburger--collapse-r.is-active .hamburger-inner {
  434. transform:translate3d(0, -10px, 0) rotate(45deg);
  435. transition-delay:0.22s;
  436. transition-timing-function:cubic-bezier(0.215, 0.61, 0.355, 1)
  437. }
  438. .hamburger--collapse-r.is-active .hamburger-inner::after {
  439. top:0;
  440. opacity:0;
  441. transition:top 0.2s cubic-bezier(0.33333, 0, 0.66667, 0.33333),opacity 0.1s 0.22s linear
  442. }
  443. .hamburger--collapse-r.is-active .hamburger-inner::before {
  444. top:0;
  445. transform:rotate(90deg);
  446. transition:top 0.1s 0.16s cubic-bezier(0.33333, 0, 0.66667, 0.33333),transform 0.13s 0.25s cubic-bezier(0.215, 0.61, 0.355, 1)
  447. }
  448. .hamburger--elastic .hamburger-inner {
  449. top:2px;
  450. transition-duration:0.275s;
  451. transition-timing-function:cubic-bezier(0.68, -0.55, 0.265, 1.55)
  452. }
  453. .hamburger--elastic .hamburger-inner::before {
  454. top:10px;
  455. transition:opacity 0.125s 0.275s ease
  456. }
  457. .hamburger--elastic .hamburger-inner::after {
  458. top:20px;
  459. transition:transform 0.275s cubic-bezier(0.68, -0.55, 0.265, 1.55)
  460. }
  461. .hamburger--elastic.is-active .hamburger-inner {
  462. transform:translate3d(0, 10px, 0) rotate(135deg);
  463. transition-delay:0.075s
  464. }
  465. .hamburger--elastic.is-active .hamburger-inner::before {
  466. transition-delay:0s;
  467. opacity:0
  468. }
  469. .hamburger--elastic.is-active .hamburger-inner::after {
  470. transform:translate3d(0, -20px, 0) rotate(-270deg);
  471. transition-delay:0.075s
  472. }
  473. .hamburger--elastic-r .hamburger-inner {
  474. top:2px;
  475. transition-duration:0.275s;
  476. transition-timing-function:cubic-bezier(0.68, -0.55, 0.265, 1.55)
  477. }
  478. .hamburger--elastic-r .hamburger-inner::before {
  479. top:10px;
  480. transition:opacity 0.125s 0.275s ease
  481. }
  482. .hamburger--elastic-r .hamburger-inner::after {
  483. top:20px;
  484. transition:transform 0.275s cubic-bezier(0.68, -0.55, 0.265, 1.55)
  485. }
  486. .hamburger--elastic-r.is-active .hamburger-inner {
  487. transform:translate3d(0, 10px, 0) rotate(-135deg);
  488. transition-delay:0.075s
  489. }
  490. .hamburger--elastic-r.is-active .hamburger-inner::before {
  491. transition-delay:0s;
  492. opacity:0
  493. }
  494. .hamburger--elastic-r.is-active .hamburger-inner::after {
  495. transform:translate3d(0, -20px, 0) rotate(270deg);
  496. transition-delay:0.075s
  497. }
  498. .hamburger--emphatic {
  499. overflow:hidden
  500. }
  501. .hamburger--emphatic .hamburger-inner {
  502. transition:background-color 0.125s 0.175s ease-in
  503. }
  504. .hamburger--emphatic .hamburger-inner::before {
  505. left:0;
  506. transition:transform 0.125s cubic-bezier(0.6, 0.04, 0.98, 0.335),top 0.05s 0.125s linear,left 0.125s 0.175s ease-in
  507. }
  508. .hamburger--emphatic .hamburger-inner::after {
  509. top:10px;
  510. right:0;
  511. transition:transform 0.125s cubic-bezier(0.6, 0.04, 0.98, 0.335),top 0.05s 0.125s linear,right 0.125s 0.175s ease-in
  512. }
  513. .hamburger--emphatic.is-active .hamburger-inner {
  514. transition-delay:0s;
  515. transition-timing-function:ease-out;
  516. background-color:transparent !important
  517. }
  518. .hamburger--emphatic.is-active .hamburger-inner::before {
  519. left:-80px;
  520. top:-80px;
  521. transform:translate3d(80px, 80px, 0) rotate(45deg);
  522. transition:left 0.125s ease-out,top 0.05s 0.125s linear,transform 0.125s 0.175s cubic-bezier(0.075, 0.82, 0.165, 1)
  523. }
  524. .hamburger--emphatic.is-active .hamburger-inner::after {
  525. right:-80px;
  526. top:-80px;
  527. transform:translate3d(-80px, 80px, 0) rotate(-45deg);
  528. transition:right 0.125s ease-out,top 0.05s 0.125s linear,transform 0.125s 0.175s cubic-bezier(0.075, 0.82, 0.165, 1)
  529. }
  530. .hamburger--emphatic-r {
  531. overflow:hidden
  532. }
  533. .hamburger--emphatic-r .hamburger-inner {
  534. transition:background-color 0.125s 0.175s ease-in
  535. }
  536. .hamburger--emphatic-r .hamburger-inner::before {
  537. left:0;
  538. transition:transform 0.125s cubic-bezier(0.6, 0.04, 0.98, 0.335),top 0.05s 0.125s linear,left 0.125s 0.175s ease-in
  539. }
  540. .hamburger--emphatic-r .hamburger-inner::after {
  541. top:10px;
  542. right:0;
  543. transition:transform 0.125s cubic-bezier(0.6, 0.04, 0.98, 0.335),top 0.05s 0.125s linear,right 0.125s 0.175s ease-in
  544. }
  545. .hamburger--emphatic-r.is-active .hamburger-inner {
  546. transition-delay:0s;
  547. transition-timing-function:ease-out;
  548. background-color:transparent !important
  549. }
  550. .hamburger--emphatic-r.is-active .hamburger-inner::before {
  551. left:-80px;
  552. top:80px;
  553. transform:translate3d(80px, -80px, 0) rotate(-45deg);
  554. transition:left 0.125s ease-out,top 0.05s 0.125s linear,transform 0.125s 0.175s cubic-bezier(0.075, 0.82, 0.165, 1)
  555. }
  556. .hamburger--emphatic-r.is-active .hamburger-inner::after {
  557. right:-80px;
  558. top:80px;
  559. transform:translate3d(-80px, -80px, 0) rotate(45deg);
  560. transition:right 0.125s ease-out,top 0.05s 0.125s linear,transform 0.125s 0.175s cubic-bezier(0.075, 0.82, 0.165, 1)
  561. }
  562. .hamburger--minus .hamburger-inner::before,
  563. .hamburger--minus .hamburger-inner::after {
  564. transition:bottom 0.08s 0s ease-out, top 0.08s 0s ease-out, opacity 0s linear
  565. }
  566. .hamburger--minus.is-active .hamburger-inner::before,
  567. .hamburger--minus.is-active .hamburger-inner::after {
  568. opacity:0;
  569. transition:bottom 0.08s ease-out, top 0.08s ease-out, opacity 0s 0.08s linear
  570. }
  571. .hamburger--minus.is-active .hamburger-inner::before {
  572. top:0
  573. }
  574. .hamburger--minus.is-active .hamburger-inner::after {
  575. bottom:0
  576. }
  577. .hamburger--slider .hamburger-inner {
  578. top:2px
  579. }
  580. .hamburger--slider .hamburger-inner::before {
  581. top:10px;
  582. transition-property:transform, opacity;
  583. transition-timing-function:ease;
  584. transition-duration:0.15s
  585. }
  586. .hamburger--slider .hamburger-inner::after {
  587. top:20px
  588. }
  589. .hamburger--slider.is-active .hamburger-inner {
  590. transform:translate3d(0, 10px, 0) rotate(45deg)
  591. }
  592. .hamburger--slider.is-active .hamburger-inner::before {
  593. transform:rotate(-45deg) translate3d(-5.71429px, -6px, 0);
  594. opacity:0
  595. }
  596. .hamburger--slider.is-active .hamburger-inner::after {
  597. transform:translate3d(0, -20px, 0) rotate(-90deg)
  598. }
  599. .hamburger--slider-r .hamburger-inner {
  600. top:2px
  601. }
  602. .hamburger--slider-r .hamburger-inner::before {
  603. top:10px;
  604. transition-property:transform, opacity;
  605. transition-timing-function:ease;
  606. transition-duration:0.15s
  607. }
  608. .hamburger--slider-r .hamburger-inner::after {
  609. top:20px
  610. }
  611. .hamburger--slider-r.is-active .hamburger-inner {
  612. transform:translate3d(0, 10px, 0) rotate(-45deg)
  613. }
  614. .hamburger--slider-r.is-active .hamburger-inner::before {
  615. transform:rotate(45deg) translate3d(5.71429px, -6px, 0);
  616. opacity:0
  617. }
  618. .hamburger--slider-r.is-active .hamburger-inner::after {
  619. transform:translate3d(0, -20px, 0) rotate(90deg)
  620. }
  621. .hamburger--spin .hamburger-inner {
  622. transition-duration:0.22s;
  623. transition-timing-function:cubic-bezier(0.55, 0.055, 0.675, 0.19)
  624. }
  625. .hamburger--spin .hamburger-inner::before {
  626. transition:top 0.1s 0.25s ease-in, opacity 0.1s ease-in
  627. }
  628. .hamburger--spin .hamburger-inner::after {
  629. transition:bottom 0.1s 0.25s ease-in,transform 0.22s cubic-bezier(0.55, 0.055, 0.675, 0.19)
  630. }
  631. .hamburger--spin.is-active .hamburger-inner {
  632. transform:rotate(225deg);
  633. transition-delay:0.12s;
  634. transition-timing-function:cubic-bezier(0.215, 0.61, 0.355, 1)
  635. }
  636. .hamburger--spin.is-active .hamburger-inner::before {
  637. top:0;
  638. opacity:0;
  639. transition:top 0.1s ease-out, opacity 0.1s 0.12s ease-out
  640. }
  641. .hamburger--spin.is-active .hamburger-inner::after {
  642. bottom:0;
  643. transform:rotate(-90deg);
  644. transition:bottom 0.1s ease-out,transform 0.22s 0.12s cubic-bezier(0.215, 0.61, 0.355, 1)
  645. }
  646. .hamburger--spin-r .hamburger-inner {
  647. transition-duration:0.22s;
  648. transition-timing-function:cubic-bezier(0.55, 0.055, 0.675, 0.19)
  649. }
  650. .hamburger--spin-r .hamburger-inner::before {
  651. transition:top 0.1s 0.25s ease-in, opacity 0.1s ease-in
  652. }
  653. .hamburger--spin-r .hamburger-inner::after {
  654. transition:bottom 0.1s 0.25s ease-in,transform 0.22s cubic-bezier(0.55, 0.055, 0.675, 0.19)
  655. }
  656. .hamburger--spin-r.is-active .hamburger-inner {
  657. transform:rotate(-225deg);
  658. transition-delay:0.12s;
  659. transition-timing-function:cubic-bezier(0.215, 0.61, 0.355, 1)
  660. }
  661. .hamburger--spin-r.is-active .hamburger-inner::before {
  662. top:0;
  663. opacity:0;
  664. transition:top 0.1s ease-out, opacity 0.1s 0.12s ease-out
  665. }
  666. .hamburger--spin-r.is-active .hamburger-inner::after {
  667. bottom:0;
  668. transform:rotate(90deg);
  669. transition:bottom 0.1s ease-out,transform 0.22s 0.12s cubic-bezier(0.215, 0.61, 0.355, 1)
  670. }
  671. .hamburger--spring .hamburger-inner {
  672. top:2px;
  673. transition:background-color 0s 0.13s linear
  674. }
  675. .hamburger--spring .hamburger-inner::before {
  676. top:10px;
  677. transition:top 0.1s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1),transform 0.13s cubic-bezier(0.55, 0.055, 0.675, 0.19)
  678. }
  679. .hamburger--spring .hamburger-inner::after {
  680. top:20px;
  681. transition:top 0.2s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1),transform 0.13s cubic-bezier(0.55, 0.055, 0.675, 0.19)
  682. }
  683. .hamburger--spring.is-active .hamburger-inner {
  684. transition-delay:0.22s;
  685. background-color:transparent !important
  686. }
  687. .hamburger--spring.is-active .hamburger-inner::before {
  688. top:0;
  689. transition:top 0.1s 0.15s cubic-bezier(0.33333, 0, 0.66667, 0.33333),transform 0.13s 0.22s cubic-bezier(0.215, 0.61, 0.355, 1);
  690. transform:translate3d(0, 10px, 0) rotate(45deg)
  691. }
  692. .hamburger--spring.is-active .hamburger-inner::after {
  693. top:0;
  694. transition:top 0.2s cubic-bezier(0.33333, 0, 0.66667, 0.33333),transform 0.13s 0.22s cubic-bezier(0.215, 0.61, 0.355, 1);
  695. transform:translate3d(0, 10px, 0) rotate(-45deg)
  696. }
  697. .hamburger--spring-r .hamburger-inner {
  698. top:auto;
  699. bottom:0;
  700. transition-duration:0.13s;
  701. transition-delay:0s;
  702. transition-timing-function:cubic-bezier(0.55, 0.055, 0.675, 0.19)
  703. }
  704. .hamburger--spring-r .hamburger-inner::after {
  705. top:-20px;
  706. transition:top 0.2s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1),opacity 0s linear
  707. }
  708. .hamburger--spring-r .hamburger-inner::before {
  709. transition:top 0.1s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1),transform 0.13s cubic-bezier(0.55, 0.055, 0.675, 0.19)
  710. }
  711. .hamburger--spring-r.is-active .hamburger-inner {
  712. transform:translate3d(0, -10px, 0) rotate(-45deg);
  713. transition-delay:0.22s;
  714. transition-timing-function:cubic-bezier(0.215, 0.61, 0.355, 1)
  715. }
  716. .hamburger--spring-r.is-active .hamburger-inner::after {
  717. top:0;
  718. opacity:0;
  719. transition:top 0.2s cubic-bezier(0.33333, 0, 0.66667, 0.33333),opacity 0s 0.22s linear
  720. }
  721. .hamburger--spring-r.is-active .hamburger-inner::before {
  722. top:0;
  723. transform:rotate(90deg);
  724. transition:top 0.1s 0.15s cubic-bezier(0.33333, 0, 0.66667, 0.33333),transform 0.13s 0.22s cubic-bezier(0.215, 0.61, 0.355, 1)
  725. }
  726. .hamburger--stand .hamburger-inner {
  727. transition:transform 0.075s 0.15s cubic-bezier(0.55, 0.055, 0.675, 0.19),background-color 0s 0.075s linear
  728. }
  729. .hamburger--stand .hamburger-inner::before {
  730. transition:top 0.075s 0.075s ease-in,transform 0.075s 0s cubic-bezier(0.55, 0.055, 0.675, 0.19)
  731. }
  732. .hamburger--stand .hamburger-inner::after {
  733. transition:bottom 0.075s 0.075s ease-in,transform 0.075s 0s cubic-bezier(0.55, 0.055, 0.675, 0.19)
  734. }
  735. .hamburger--stand.is-active .hamburger-inner {
  736. transform:rotate(90deg);
  737. background-color:transparent !important;
  738. transition:transform 0.075s 0s cubic-bezier(0.215, 0.61, 0.355, 1),background-color 0s 0.15s linear
  739. }
  740. .hamburger--stand.is-active .hamburger-inner::before {
  741. top:0;
  742. transform:rotate(-45deg);
  743. transition:top 0.075s 0.1s ease-out,transform 0.075s 0.15s cubic-bezier(0.215, 0.61, 0.355, 1)
  744. }
  745. .hamburger--stand.is-active .hamburger-inner::after {
  746. bottom:0;
  747. transform:rotate(45deg);
  748. transition:bottom 0.075s 0.1s ease-out,transform 0.075s 0.15s cubic-bezier(0.215, 0.61, 0.355, 1)
  749. }
  750. .hamburger--stand-r .hamburger-inner {
  751. transition:transform 0.075s 0.15s cubic-bezier(0.55, 0.055, 0.675, 0.19),background-color 0s 0.075s linear
  752. }
  753. .hamburger--stand-r .hamburger-inner::before {
  754. transition:top 0.075s 0.075s ease-in,transform 0.075s 0s cubic-bezier(0.55, 0.055, 0.675, 0.19)
  755. }
  756. .hamburger--stand-r .hamburger-inner::after {
  757. transition:bottom 0.075s 0.075s ease-in,transform 0.075s 0s cubic-bezier(0.55, 0.055, 0.675, 0.19)
  758. }
  759. .hamburger--stand-r.is-active .hamburger-inner {
  760. transform:rotate(-90deg);
  761. background-color:transparent !important;
  762. transition:transform 0.075s 0s cubic-bezier(0.215, 0.61, 0.355, 1),background-color 0s 0.15s linear
  763. }
  764. .hamburger--stand-r.is-active .hamburger-inner::before {
  765. top:0;
  766. transform:rotate(-45deg);
  767. transition:top 0.075s 0.1s ease-out,transform 0.075s 0.15s cubic-bezier(0.215, 0.61, 0.355, 1)
  768. }
  769. .hamburger--stand-r.is-active .hamburger-inner::after {
  770. bottom:0;
  771. transform:rotate(45deg);
  772. transition:bottom 0.075s 0.1s ease-out,transform 0.075s 0.15s cubic-bezier(0.215, 0.61, 0.355, 1)
  773. }
  774. .hamburger--squeeze .hamburger-inner {
  775. transition-duration:0.075s;
  776. transition-timing-function:cubic-bezier(0.55, 0.055, 0.675, 0.19)
  777. }
  778. .hamburger--squeeze .hamburger-inner::before {
  779. transition:top 0.075s 0.12s ease, opacity 0.075s ease
  780. }
  781. .hamburger--squeeze .hamburger-inner::after {
  782. transition:bottom 0.075s 0.12s ease,transform 0.075s cubic-bezier(0.55, 0.055, 0.675, 0.19)
  783. }
  784. .hamburger--squeeze.is-active .hamburger-inner {
  785. transform:rotate(45deg);
  786. transition-delay:0.12s;
  787. transition-timing-function:cubic-bezier(0.215, 0.61, 0.355, 1)
  788. }
  789. .hamburger--squeeze.is-active .hamburger-inner::before {
  790. top:0;
  791. opacity:0;
  792. transition:top 0.075s ease, opacity 0.075s 0.12s ease
  793. }
  794. .hamburger--squeeze.is-active .hamburger-inner::after {
  795. bottom:0;
  796. transform:rotate(-90deg);
  797. transition:bottom 0.075s ease,transform 0.075s 0.12s cubic-bezier(0.215, 0.61, 0.355, 1)
  798. }
  799. .hamburger--vortex .hamburger-inner {
  800. transition-duration:0.2s;
  801. transition-timing-function:cubic-bezier(0.19, 1, 0.22, 1)
  802. }
  803. .hamburger--vortex .hamburger-inner::before,
  804. .hamburger--vortex .hamburger-inner::after {
  805. transition-duration:0s;
  806. transition-delay:0.1s;
  807. transition-timing-function:linear
  808. }
  809. .hamburger--vortex .hamburger-inner::before {
  810. transition-property:top, opacity
  811. }
  812. .hamburger--vortex .hamburger-inner::after {
  813. transition-property:bottom, transform
  814. }
  815. .hamburger--vortex.is-active .hamburger-inner {
  816. transform:rotate(765deg);
  817. transition-timing-function:cubic-bezier(0.19, 1, 0.22, 1)
  818. }
  819. .hamburger--vortex.is-active .hamburger-inner::before,
  820. .hamburger--vortex.is-active .hamburger-inner::after {
  821. transition-delay:0s
  822. }
  823. .hamburger--vortex.is-active .hamburger-inner::before {
  824. top:0;
  825. opacity:0
  826. }
  827. .hamburger--vortex.is-active .hamburger-inner::after {
  828. bottom:0;
  829. transform:rotate(90deg)
  830. }
  831. .hamburger--vortex-r .hamburger-inner {
  832. transition-duration:0.2s;
  833. transition-timing-function:cubic-bezier(0.19, 1, 0.22, 1)
  834. }
  835. .hamburger--vortex-r .hamburger-inner::before,
  836. .hamburger--vortex-r .hamburger-inner::after {
  837. transition-duration:0s;
  838. transition-delay:0.1s;
  839. transition-timing-function:linear
  840. }
  841. .hamburger--vortex-r .hamburger-inner::before {
  842. transition-property:top, opacity
  843. }
  844. .hamburger--vortex-r .hamburger-inner::after {
  845. transition-property:bottom, transform
  846. }
  847. .hamburger--vortex-r.is-active .hamburger-inner {
  848. transform:rotate(-765deg);
  849. transition-timing-function:cubic-bezier(0.19, 1, 0.22, 1)
  850. }
  851. .hamburger--vortex-r.is-active .hamburger-inner::before,
  852. .hamburger--vortex-r.is-active .hamburger-inner::after {
  853. transition-delay:0s
  854. }
  855. .hamburger--vortex-r.is-active .hamburger-inner::before {
  856. top:0;
  857. opacity:0
  858. }
  859. .hamburger--vortex-r.is-active .hamburger-inner::after {
  860. bottom:0;
  861. transform:rotate(-90deg)
  862. }
  863. h1 {
  864. font-size:44px;
  865. font-family:'Inter UI';
  866. font-weight:600;
  867. margin-bottom:8px;
  868. line-height:1.1em
  869. }
  870. h2 {
  871. font-size:32px;
  872. font-family:'Inter UI';
  873. font-weight:600;
  874. margin-bottom:8px;
  875. line-height:1.1em
  876. }
  877. h3 {
  878. font-size:24px;
  879. font-family:'Inter UI';
  880. font-weight:600;
  881. margin-bottom:8px;
  882. line-height:1.3em
  883. }
  884. h4 {
  885. font-size:19px;
  886. margin-bottom:8px;
  887. line-height:1.3em !important
  888. }
  889. p {
  890. font-size:16px;
  891. line-height:1.6em;
  892. margin-bottom:1.6em
  893. }
  894. p:last-child {
  895. margin-bottom:0
  896. }
  897. em,
  898. i {
  899. font-style:italic
  900. }
  901. strong,
  902. b {
  903. font-weight:bold
  904. }
  905. table {
  906. margin-bottom:1.6em
  907. }
  908. th {
  909. border:1px solid #222;
  910. padding:8px 12px
  911. }
  912. td {
  913. border:1px solid #222;
  914. padding:8px 12px
  915. }
  916. hr {
  917. border-top:0;
  918. border-right:0;
  919. border-bottom:1px solid #ddd;
  920. border-left:0;
  921. display:block;
  922. margin:16px 0 16px 0;
  923. width:100%
  924. }
  925. blockquote {
  926. border-left:2px solid black;
  927. padding-left:16px;
  928. font-style:italic;
  929. margin-bottom:1.6em
  930. }
  931. blockquote p:before {
  932. content:'“'
  933. }
  934. blockquote p:after {
  935. content:'”'
  936. }
  937. img {
  938. max-width:100%;
  939. vertical-align:middle
  940. }
  941. iframe {
  942. margin-bottom:1.6em;
  943. max-width:100%;
  944. max-height:281px;
  945. vertical-align:middle
  946. }
  947. pre {
  948. background-color:#151515;
  949. border-radius:4px;
  950. color:#eee;
  951. font-family:monospace;
  952. font-size:13px;
  953. margin-bottom:1.9em;
  954. padding:16px;
  955. overflow-x:auto
  956. }
  957. pre>code {
  958. position:inherit;
  959. background-color:transparent;
  960. border-radius:0;
  961. font-family:monospace;
  962. font-size:13px;
  963. padding:0;
  964. top:0;
  965. line-height:18px
  966. }
  967. code {
  968. position:relative;
  969. background-color:#222;
  970. border-radius:4px;
  971. color:#eee;
  972. font-family:monospace;
  973. font-size:13px;
  974. padding:2px 4px;
  975. top:-1px
  976. }
  977. code.inverted {
  978. background-color:#e9e9e9;
  979. color:black
  980. }
  981. kbd {
  982. background-color:#fafbfc;
  983. border:solid 1px #d1d5da;
  984. border-bottom-color:#c6cbd1;
  985. border-radius:3px;
  986. box-shadow:inset 0 -1px 0 #c6cbd1;
  987. color:#444d56;
  988. display:inline;
  989. font-family:monospace;
  990. font-size:11px;
  991. padding:2px 4px;
  992. vertical-align:middle
  993. }
  994. ol {
  995. list-style-type:decimal;
  996. margin-bottom:1.5em;
  997. padding-left:1.6em
  998. }
  999. ul {
  1000. list-style-type:disc;
  1001. margin-bottom:1.5em;
  1002. padding-left:1.6em
  1003. }
  1004. li {
  1005. line-height:26px;
  1006. margin-bottom:4px
  1007. }
  1008. p+ol {
  1009. margin-top:-8px
  1010. }
  1011. p+ul {
  1012. margin-top:-8px
  1013. }
  1014. .katex-display {
  1015. margin:1.6em 0 !important
  1016. }
  1017. @font-face {
  1018. font-family:"Inter UI";
  1019. src:url("/web/20190629023455im_/https://grin-tech.org/assets/fonts/Inter-UI-Regular.woff2") format("woff2");
  1020. font-weight:400
  1021. }
  1022. @font-face {
  1023. font-family:"Inter UI";
  1024. src:url("/web/20190629023455im_/https://grin-tech.org/assets/fonts/Inter-UI-Italic.woff2") format("woff2");
  1025. font-weight:400;
  1026. font-style:italic
  1027. }
  1028. @font-face {
  1029. font-family:"Inter UI";
  1030. src:url("/web/20190629023455im_/https://grin-tech.org/assets/fonts/Inter-UI-Medium.woff2") format("woff2");
  1031. font-weight:500
  1032. }
  1033. @font-face {
  1034. font-family:"Inter UI";
  1035. src:url("/web/20190629023455im_/https://grin-tech.org/assets/fonts/Inter-UI-SemiBold.woff2") format("woff2");
  1036. font-weight:600
  1037. }
  1038. @font-face {
  1039. font-family:"Inter UI";
  1040. src:url("/web/20190629023455im_/https://grin-tech.org/assets/fonts/Inter-UI-Bold.woff2") format("woff2");
  1041. font-weight:700
  1042. }
  1043. @font-face {
  1044. font-family:"Inter UI";
  1045. src:url("/web/20190629023455im_/https://grin-tech.org/assets/fonts/Inter-UI-BoldItalic.woff2") format("woff2");
  1046. font-weight:700;
  1047. font-style:italic
  1048. }
  1049. @font-face {
  1050. font-family:"Inter UI";
  1051. src:url("/web/20190629023455im_/https://grin-tech.org/assets/fonts/Inter-UI-ExtraBold.woff2") format("woff2");
  1052. font-weight:800
  1053. }
  1054. @font-face {
  1055. font-family:"Inter UI";
  1056. src:url("/web/20190629023455im_/https://grin-tech.org/assets/fonts/Inter-UI-ExtraBoldItalic.woff2") format("woff2");
  1057. font-weight:800;
  1058. font-style:italic
  1059. }
  1060. header>nav {
  1061. display:flex;
  1062. flex-direction:row
  1063. }
  1064. nav ul {
  1065. margin-bottom:0
  1066. }
  1067. .nav-logo {
  1068. font-weight:700
  1069. }
  1070. .nav-logo {
  1071. padding-left:24px
  1072. }
  1073. .nav-logo li {
  1074. display:flex;
  1075. height:64px;
  1076. width:100px;
  1077. align-items:center
  1078. }
  1079. .nav-logo a {
  1080. font-size:24px;
  1081. border:0 !important
  1082. }
  1083. .nav-root {
  1084. flex-grow:1;
  1085. align-items:stretch;
  1086. list-style:none;
  1087. text-align:right;
  1088. display:flex;
  1089. flex-direction:row;
  1090. justify-content:flex-end
  1091. }
  1092. .nav-root li {
  1093. padding:24px 16px 24px 0;
  1094. z-index:100
  1095. }
  1096. .nav-root li:last-child {
  1097. padding:24px 26px 24px 0
  1098. }
  1099. .nav-root li>a {
  1100. border-bottom:0
  1101. }
  1102. .nav-root li>a:hover {
  1103. border-bottom:2px solid black
  1104. }
  1105. .nav-hamburger {
  1106. display:none
  1107. }
  1108. .nav-hamburger.is-active {
  1109. background-color:white
  1110. }
  1111. .hamburger {
  1112. padding:24px
  1113. }
  1114. .hamburger.is-active {
  1115. z-index:1000;
  1116. position:fixed
  1117. }
  1118. .hamburger.is-active .hamburger-inner {
  1119. background-color:white
  1120. }
  1121. .hamburger.is-active .hamburger-inner:after {
  1122. background-color:white
  1123. }
  1124. .nav-mobile {
  1125. visibility:hidden;
  1126. top:0;
  1127. left:0;
  1128. right:0;
  1129. bottom:0;
  1130. background-color:black;
  1131. position:fixed;
  1132. color:white;
  1133. padding:26px;
  1134. list-style:none;
  1135. height:100%;
  1136. width:100%;
  1137. font-weight:700;
  1138. overflow-y:scroll;
  1139. z-index:500
  1140. }
  1141. .nav-mobile.is-active {
  1142. visibility:visible
  1143. }
  1144. .nav-mobile-fade {
  1145. position:relative;
  1146. opacity:0;
  1147. bottom:-15px;
  1148. transition:bottom .3s ease, color .15s ease, opacity .35s ease
  1149. }
  1150. .nav-mobile-fade.is-active {
  1151. opacity:1;
  1152. bottom:0
  1153. }
  1154. .nav-mobile li {
  1155. display:block;
  1156. margin-bottom:8px
  1157. }
  1158. .nav-mobile li a {
  1159. font-size:28px;
  1160. line-height:1.1em;
  1161. transition:bottom .35s ease, color .15s ease, opacity .35s ease;
  1162. border-bottom:0
  1163. }
  1164. .nav-mobile li a:hover {
  1165. color:#fef102
  1166. }
  1167. .nav-mobile-heading {
  1168. font-weight:700;
  1169. display:block;
  1170. font-size:28px;
  1171. color:#6d6d6d;
  1172. margin:20px 0 8px 0
  1173. }
  1174. .nav-mobile-heading:first-child {
  1175. margin-top:0
  1176. }
  1177. .nav-mobile-secondary {
  1178. list-style-type:circle;
  1179. padding-left:0
  1180. }
  1181. .dropdown {
  1182. cursor:pointer;
  1183. display:block;
  1184. position:relative
  1185. }
  1186. .dropdown:hover>nav {
  1187. display:block
  1188. }
  1189. .dropdown nav {
  1190. background-color:white;
  1191. white-space:nowrap;
  1192. display:none;
  1193. position:absolute;
  1194. top:16px;
  1195. right:0;
  1196. margin-top:16px;
  1197. border-radius:4px;
  1198. border:1px solid #f2f2f2;
  1199. padding:8px 0;
  1200. box-shadow:0 10px 45px -12px rgba(93,90,50,0.25),0 18px 36px -18px rgba(0,0,0,0.3);
  1201. transition:all .15s ease;
  1202. min-width:100px
  1203. }
  1204. .dropdown nav::after {
  1205. content:"";
  1206. border-color:transparent;
  1207. border-width:.5rem;
  1208. top:-16px;
  1209. margin:0;
  1210. left:0;
  1211. right:0;
  1212. position:absolute;
  1213. border-width:12px;
  1214. border-style:solid
  1215. }
  1216. .dropdown-heading {
  1217. color:#6d6d6d;
  1218. font-size:12px;
  1219. padding:0 18px 4px 16px
  1220. }
  1221. .dropdown nav a {
  1222. background-color:white;
  1223. word-break:break-all;
  1224. display:block;
  1225. border-bottom:0;
  1226. white-space:nowrap;
  1227. padding:4px 16px 4px 18px
  1228. }
  1229. .dropdown nav a:hover {
  1230. background-color:#f2f2f2
  1231. }
  1232. @media (max-width: 767px) {
  1233. .nav-root {
  1234. display:none
  1235. }
  1236. .nav-hamburger {
  1237. display:flex;
  1238. justify-content:flex-end;
  1239. align-items:center;
  1240. flex-grow:1
  1241. }
  1242. }
  1243. @media (min-width: 768px) {
  1244. .nav-mobile {
  1245. visibility:hidden !important
  1246. }
  1247. }
  1248. footer {
  1249. background-color:#f2f2f2;
  1250. padding:48px;
  1251. display:flex
  1252. }
  1253. .footer-root {
  1254. flex-wrap:wrap;
  1255. display:flex
  1256. }
  1257. .grin-logo-footer {
  1258. height:64px;
  1259. display:flex;
  1260. position:relative;
  1261. top:-8px
  1262. }
  1263. .footer-section {
  1264. min-width:150px;
  1265. display:flex;
  1266. flex-grow:10;
  1267. flex-direction:column;
  1268. margin-bottom:16px
  1269. }
  1270. .footer-section a {
  1271. color:#6d6d6d;
  1272. border:0;
  1273. line-height:24px
  1274. }
  1275. .footer-section a:hover {
  1276. color:black
  1277. }
  1278. .footer-section div {
  1279. margin-bottom:4px
  1280. }
  1281. @media (max-width: 768px) {
  1282. footer {
  1283. padding:24px
  1284. }
  1285. .footer-root {
  1286. flex-direction:column;
  1287. flex-grow:0
  1288. }
  1289. }
  1290. main>header {
  1291. align-items:center;
  1292. display:flex;
  1293. flex-grow:1;
  1294. justify-content:center
  1295. }
  1296. hr {
  1297. border-bottom-width:1px;
  1298. border-bottom-style:dotted;
  1299. border-left:0;
  1300. border-right:0;
  1301. border-top:0;
  1302. margin:24px 0
  1303. }
  1304. #intro {
  1305. display:flex;
  1306. flex-direction:column;
  1307. min-height:100vh
  1308. }
  1309. #splash {
  1310. align-items:center;
  1311. display:flex;
  1312. flex-wrap:wrap;
  1313. flex-grow:1;
  1314. justify-content:center
  1315. }
  1316. .intro {
  1317. flex-grow:5
  1318. }
  1319. .intro-logo {
  1320. justify-content:center;
  1321. flex-grow:9;
  1322. display:flex;
  1323. align-items:center
  1324. }
  1325. .intro h1 {
  1326. font-size:46px;
  1327. margin-bottom:7px;
  1328. letter-spacing:-0.03em
  1329. }
  1330. .intro-buttons {
  1331. margin-top:16px;
  1332. display:flex;
  1333. flex-direction:row
  1334. }
  1335. .intro-button {
  1336. background:black;
  1337. box-shadow:0 4px 6px rgba(50,50,93,0.11),0 1px 3px rgba(0,0,0,0.08);
  1338. border-radius:4px;
  1339. border:0;
  1340. color:white;
  1341. cursor:pointer;
  1342. display:inline-block;
  1343. font-family:"Inter UI";
  1344. font-size:16px;
  1345. flex-grow:0;
  1346. padding:10px 15px;
  1347. margin-right:20px;
  1348. outline:0;
  1349. transition:all .15s ease;
  1350. white-space:nowrap
  1351. }
  1352. .intro-button:hover {
  1353. -webkit-transform:translateY(-1px);
  1354. -webkit-box-shadow:0 13px 27px -5px rgba(50,50,93,0.25),0 8px 16px -8px rgba(0,0,0,0.3);
  1355. -webkit-box-shadow:0 7px 14px rgba(50,50,93,0.1),0 3px 6px rgba(0,0,0,0.08);
  1356. box-shadow:0 13px 27px -5px rgba(50,50,93,0.25),0 8px 16px -8px rgba(0,0,0,0.3);
  1357. box-shadow:0 7px 14px rgba(50,50,93,0.1),0 3px 6px rgba(0,0,0,0.08);
  1358. transform:translateY(-1px)
  1359. }
  1360. .intro p {
  1361. font-size:21px;
  1362. line-height:30px
  1363. }
  1364. .grin-logo {
  1365. width:320px
  1366. }
  1367. #status {
  1368. align-items:center;
  1369. background-color:white;
  1370. color:black;
  1371. display:flex;
  1372. flex-wrap:wrap;
  1373. padding:24px 16px 28px 16px;
  1374. justify-content:center
  1375. }
  1376. .status-text {
  1377. background:#22c335;
  1378. border-radius:4px;
  1379. color:white;
  1380. font-family:monospace;
  1381. font-size:13px;
  1382. font-weight:700;
  1383. min-width:100px;
  1384. padding:8px
  1385. }
  1386. .status-message {
  1387. font-size:14px;
  1388. line-height:1.6em;
  1389. margin:12px 16px 12px 16px;
  1390. text-align:center
  1391. }
  1392. #primary {
  1393. background-color:#0b0b0b;
  1394. color:white
  1395. }
  1396. #primary div {
  1397. max-width:900px
  1398. }
  1399. #primary p {
  1400. margin-bottom:16px;
  1401. font-size:17px
  1402. }
  1403. #primary hr {
  1404. border-color:grey !important;
  1405. margin-bottom:0 !important
  1406. }
  1407. .primary-root {
  1408. padding:48px;
  1409. margin:0 auto
  1410. }
  1411. .pitch {
  1412. margin-bottom:24px
  1413. }
  1414. .properties {
  1415. display:flex;
  1416. flex-wrap:wrap
  1417. }
  1418. .properties img {
  1419. height:80px;
  1420. margin-right:8px;
  1421. width:80px
  1422. }
  1423. .property {
  1424. flex:1;
  1425. margin-top:24px;
  1426. min-width:200px
  1427. }
  1428. .property-title {
  1429. align-items:center;
  1430. display:flex
  1431. }
  1432. .property p {
  1433. margin-bottom:0 !important;
  1434. padding:8px 8px 0 0
  1435. }
  1436. #secondary {
  1437. padding:48px 48px;
  1438. margin:0 auto;
  1439. max-width:900px
  1440. }
  1441. #secondary hr {
  1442. border-bottom-color:#d0d0d0
  1443. }
  1444. .info {
  1445. display:flex;
  1446. flex-wrap:wrap;
  1447. padding-bottom:2px
  1448. }
  1449. .info h2 {
  1450. margin-bottom:14px
  1451. }
  1452. .info a {
  1453. display:block;
  1454. border:0;
  1455. align-items:stretch;
  1456. flex:1;
  1457. margin:0 16px 18px 0;
  1458. min-width:200px
  1459. }
  1460. .info a:last-child {
  1461. margin-right:0
  1462. }
  1463. .info-box {
  1464. border-radius:4px;
  1465. border:1px solid #f2f2f2;
  1466. box-shadow:0 10px 45px -12px rgba(93,90,50,0.25),0 18px 36px -18px rgba(0,0,0,0.3);
  1467. padding:16px;
  1468. transition:all .15s ease
  1469. }
  1470. .info-box:hover {
  1471. box-shadow:0 15px 55px -12px rgba(93,90,50,0.25),0 18px 36px -18px rgba(0,0,0,0.3);
  1472. transform:translateY(-2px)
  1473. }
  1474. .info-box:hover>.info-learn-more:after {
  1475. margin-left:10px
  1476. }
  1477. .info-learn-more {
  1478. color:#151515;
  1479. font-size:14px;
  1480. font-weight:700
  1481. }
  1482. .info-learn-more:after {
  1483. content:"\2192";
  1484. margin-left:6px;
  1485. transition:all .15s ease
  1486. }
  1487. .info-banner {
  1488. align-items:center;
  1489. border-radius:4px;
  1490. box-shadow:0 10px 45px -12px rgba(93,90,50,0.25),0 18px 36px -18px rgba(0,0,0,0.3);
  1491. display:flex;
  1492. height:220px;
  1493. justify-content:center;
  1494. transition:all .15s ease
  1495. }
  1496. .info-banner:hover {
  1497. box-shadow:0 15px 55px -12px rgba(93,90,50,0.25),0 18px 36px -18px rgba(0,0,0,0.3);
  1498. transform:translateY(-2px)
  1499. }
  1500. .info-banner:hover>img {
  1501. opacity:1
  1502. }
  1503. .info-banner:hover>h1 {
  1504. opacity:.4
  1505. }
  1506. .info-banner-text {
  1507. color:white;
  1508. line-height:1.2em;
  1509. margin-bottom:0 !important;
  1510. padding:16px 24px;
  1511. text-align:center;
  1512. transition:all .15s ease
  1513. }
  1514. .info-grin-logo {
  1515. height:220px;
  1516. opacity:.18;
  1517. position:absolute;
  1518. transition:all .15s ease
  1519. }
  1520. .funding p {
  1521. margin-bottom:12px
  1522. }
  1523. .funding-progress-container {
  1524. background-color:#eaeaea;
  1525. border:1px solid #eaeaea;
  1526. border-radius:10px;
  1527. height:6px;
  1528. margin-bottom:10px;
  1529. position:relative;
  1530. top:-6px;
  1531. width:100%;
  1532. z-index:0
  1533. }
  1534. .funding-progress {
  1535. border-radius:10px;
  1536. background-color:#151515;
  1537. border:1px solid #151515;
  1538. margin-top:10px;
  1539. position:relative;
  1540. height:6px;
  1541. z-index:10
  1542. }
  1543. .funding-amount {
  1544. font-family:monospace
  1545. }
  1546. .funding-button {
  1547. border:2px solid #fef102;
  1548. border-radius:4px;
  1549. background:#fef102;
  1550. color:black;
  1551. cursor:pointer;
  1552. display:inline-block;
  1553. font-family:"Inter UI";
  1554. font-size:14px;
  1555. font-weight:700;
  1556. flex-grow:0;
  1557. margin-right:8px;
  1558. margin-bottom:12px;
  1559. outline:0;
  1560. padding:8px 13px;
  1561. transition:all .15s ease
  1562. }
  1563. .funding-button:hover {
  1564. color:black;
  1565. transform:translateY(-1px)
  1566. }
  1567. .funding-friends {
  1568. background:#151515;
  1569. border:2px solid #151515;
  1570. border-radius:4px;
  1571. color:white;
  1572. cursor:pointer;
  1573. display:inline-block;
  1574. flex-grow:0;
  1575. font-family:"Inter UI";
  1576. font-size:14px;
  1577. font-weight:700;
  1578. outline:0;
  1579. padding:8px 13px;
  1580. margin-right:8px;
  1581. margin-bottom:12px;
  1582. transition:all .15s ease
  1583. }
  1584. .funding-friends:hover {
  1585. background-color:black;
  1586. color:white;
  1587. transform:translateY(-1px)
  1588. }
  1589. .funding-swag {
  1590. background:white;
  1591. border:2px solid #151515;
  1592. border-radius:4px;
  1593. color:black;
  1594. cursor:pointer;
  1595. display:inline-block;
  1596. flex-grow:0;
  1597. font-family:"Inter UI";
  1598. font-size:14px;
  1599. font-weight:700;
  1600. outline:0;
  1601. padding:8px 14px;
  1602. margin-right:8px;
  1603. transition:all .15s ease
  1604. }
  1605. .funding-swag:hover {
  1606. background-color:#151515;
  1607. color:white;
  1608. transform:translateY(-1px)
  1609. }
  1610. .dev-intro {
  1611. align-items:center;
  1612. background-color:black;
  1613. display:flex;
  1614. justify-content:center
  1615. }
  1616. .dev-intro span {
  1617. color:white;
  1618. flex-grow:0;
  1619. font-family:monospace;
  1620. font-weight:700
  1621. }
  1622. @media (min-width: 768px) {
  1623. #intro {
  1624. margin-top:-77px
  1625. }
  1626. }
  1627. @media (max-width: 767px) {
  1628. #intro {
  1629. margin-top:-36px
  1630. }
  1631. #status {
  1632. padding-bottom:16px
  1633. }
  1634. .intro-button {
  1635. margin:0 10px
  1636. }
  1637. .primary-root {
  1638. padding:32px
  1639. }
  1640. #secondary {
  1641. padding:32px
  1642. }
  1643. #splash {
  1644. flex-direction:column
  1645. }
  1646. .intro {
  1647. align-items:center;
  1648. display:flex;
  1649. flex-direction:column;
  1650. flex-grow:1;
  1651. text-align:center
  1652. }
  1653. .intro-logo {
  1654. align-items:flex-end;
  1655. flex-grow:1
  1656. }
  1657. .grin-logo {
  1658. width:280px
  1659. }
  1660. .info {
  1661. display:block
  1662. }
  1663. .info a {
  1664. margin:0 0 20px 0
  1665. }
  1666. }
  1667. @media (max-width: 480px) {
  1668. #intro {
  1669. margin-top:0
  1670. }
  1671. .intro-text h1 {
  1672. font-size:42px
  1673. }
  1674. .info-banner-text {
  1675. font-size:44px
  1676. }
  1677. }
  1678. .visual-text {
  1679. display:block;
  1680. font-size:56px;
  1681. font-weight:800;
  1682. padding:24px
  1683. }
  1684. .visual-logos {
  1685. display:flex;
  1686. flex-direction:row;
  1687. flex-wrap:wrap;
  1688. justify-content:center
  1689. }
  1690. .visual-box {
  1691. flex-grow:1;
  1692. width:200px;
  1693. height:200px;
  1694. padding:1px;
  1695. display:flex;
  1696. align-items:center;
  1697. justify-content:center
  1698. }
  1699. .visual-box img {
  1700. height:200px;
  1701. width:200px
  1702. }
  1703. .banner {
  1704. display:flex;
  1705. justify-content:center;
  1706. align-items:center
  1707. }
  1708. .companies {
  1709. border-radius:4px;
  1710. padding:16px 0 3px 16px;
  1711. border:1px solid #ddd;
  1712. align-items:stretch;
  1713. display:flex;
  1714. flex-wrap:wrap;
  1715. justify-content:center;
  1716. margin-top:16px;
  1717. margin-bottom:24px
  1718. }
  1719. .companies a {
  1720. align-items:center;
  1721. background-color:#080808;
  1722. border:1px solid #f2f2f2;
  1723. border-bottom:0;
  1724. box-shadow:0 10px 45px -12px rgba(93,90,50,0.25),0 18px 36px -18px rgba(0,0,0,0.3);
  1725. border-radius:4px;
  1726. cursor:pointer;
  1727. display:flex;
  1728. height:115px;
  1729. margin:0 16px 16px 0;
  1730. transition:all .15s ease;
  1731. width:115px;
  1732. border:0
  1733. }
  1734. .companies a:hover {
  1735. transform:translateY(-2px)
  1736. }
  1737. .companies a img {
  1738. border-radius:4px;
  1739. padding:8px;
  1740. vertical-align:top;
  1741. width:115px
  1742. }
  1743. .companies a img.no-frame {
  1744. padding:0
  1745. }
  1746. .leaderboard-loading {
  1747. border-radius:4px;
  1748. width:105px;
  1749. height:105px;
  1750. background-color:#f0f0f0
  1751. }
  1752. .leaderboard-content {
  1753. flex-wrap:wrap;
  1754. margin-top:16px;
  1755. border-radius:4px;
  1756. border:1px solid #ddd;
  1757. margin-bottom:24px;
  1758. display:flex
  1759. }
  1760. .leaderboard-row {
  1761. flex:1 0 100%;
  1762. flex-wrap:wrap;
  1763. padding:16px;
  1764. border-bottom:1px solid #ddd;
  1765. display:flex;
  1766. flex-direction:row;
  1767. flex-grow:1;
  1768. justify-content:flex-start;
  1769. align-items:center;
  1770. transition:all .15s ease
  1771. }
  1772. .leaderboard-row:nth-child(even) {
  1773. background-color:#f6f6f6
  1774. }
  1775. .leaderboard-row .logo {
  1776. background-color:#080808;
  1777. border-radius:4px;
  1778. margin-right:18px;
  1779. height:105px;
  1780. width:105px;
  1781. display:flex;
  1782. align-items:center;
  1783. justify-content:center;
  1784. flex-shrink:0
  1785. }
  1786. .leaderboard-row .logo a {
  1787. border:0
  1788. }
  1789. .leaderboard-row .logo img {
  1790. border-radius:4px;
  1791. width:115px
  1792. }
  1793. .leaderboard-row .header {
  1794. flex:1 0 46%;
  1795. display:flex;
  1796. align-items:center;
  1797. padding-right:25px
  1798. }
  1799. .leaderboard-row .heading {
  1800. display:block
  1801. }
  1802. .leaderboard-row .heading a {
  1803. border:0;
  1804. font-weight:700;
  1805. line-height:1.6em
  1806. }
  1807. .leaderboard-row .heading a:hover {
  1808. border-bottom:2px solid black
  1809. }
  1810. .leaderboard-row .desc {
  1811. line-height:1.3em;
  1812. color:#6d6d6d;
  1813. font-size:13px
  1814. }
  1815. .leaderboard-row .info {
  1816. display:flex;
  1817. flex:1 0 54%;
  1818. flex-wrap:wrap;
  1819. padding-bottom:0
  1820. }
  1821. .leaderboard-row .donations {
  1822. font-size:13px;
  1823. background-color:white;
  1824. border-radius:4px;
  1825. flex:1 0 100%;
  1826. flex-wrap:wrap;
  1827. padding:16px;
  1828. margin-top:16px;
  1829. border:1px solid #ddd
  1830. }
  1831. .leaderboard-row .donations.hide {
  1832. display:none
  1833. }
  1834. .leaderboard-row .donations a {
  1835. margin-bottom:8px;
  1836. flex:1 0 100%;
  1837. border:0
  1838. }
  1839. .leaderboard-row .donations a:last-child {
  1840. margin-bottom:0;
  1841. flex:1 0 100%;
  1842. border:0
  1843. }
  1844. .leaderboard-row .donations strong {
  1845. font-weight:600
  1846. }
  1847. .leaderboard-row .donation {
  1848. padding-bottom:8px;
  1849. line-height:1.4em
  1850. }
  1851. .leaderboard-row .donation:last-child {
  1852. padding-bottom:0
  1853. }
  1854. .leaderboard-row .donation a {
  1855. border-bottom:1px solid black !important
  1856. }
  1857. .leaderboard-row .donation a:hover {
  1858. border-bottom:0 !important
  1859. }
  1860. .leaderboard-row .subheading {
  1861. display:block;
  1862. margin-bottom:4px;
  1863. font-size:13px;
  1864. color:#6d6d6d
  1865. }
  1866. .leaderboard-row .data {
  1867. flex:1;
  1868. padding-right:16px
  1869. }
  1870. .leaderboard-row .donation-number {
  1871. font-weight:600;
  1872. cursor:pointer;
  1873. border:0;
  1874. background:transparent;
  1875. outline:0;
  1876. padding:0;
  1877. font-size:16px;
  1878. font-family:'Inter UI';
  1879. position:relative;
  1880. top:-2px
  1881. }
  1882. .leaderboard-row .donation-number svg {
  1883. position:relative;
  1884. top:2px;
  1885. margin-left:4px
  1886. }
  1887. #leaderboard .empty {
  1888. color:#777;
  1889. display:flex;
  1890. justify-content:center;
  1891. align-items:center;
  1892. flex:1 0 100%;
  1893. padding:24px;
  1894. border-bottom:1px solid #ddd;
  1895. font-size:15px;
  1896. font-weight:500
  1897. }
  1898. #leaderboard .empty:nth-child(even) {
  1899. background-color:#f6f6f6
  1900. }
  1901. #leaderboard .empty:hover {
  1902. font-weight:600
  1903. }
  1904. .friends-show-more {
  1905. display:flex;
  1906. align-items:center;
  1907. justify-content:center;
  1908. margin-bottom:24px
  1909. }
  1910. #friends-show-more-btn {
  1911. border-radius:4px;
  1912. border:1px solid #ddd;
  1913. background-color:transparent;
  1914. font-family:'Inter UI';
  1915. font-size:16px;
  1916. cursor:pointer;
  1917. padding:8px 16px;
  1918. color:#999;
  1919. transition:all .15s ease;
  1920. box-shadow:0 3px 6px rgba(0,0,0,0.08);
  1921. transform:translateY(0);
  1922. outline:0
  1923. }
  1924. #friends-show-more-btn:hover {
  1925. transform:translateY(-1px);
  1926. color:black
  1927. }
  1928. .individuals {
  1929. display:flex;
  1930. flex-wrap:wrap;
  1931. margin-bottom:24px
  1932. }
  1933. .individual {
  1934. border-radius:25px;
  1935. background-color:#f1f1f1;
  1936. padding-right:16px;
  1937. margin:0 8px 8px 0
  1938. }
  1939. .individual img {
  1940. width:40px;
  1941. height:40px;
  1942. border-radius:50%;
  1943. vertical-align:middle;
  1944. margin-right:4px
  1945. }
  1946. .individual span {
  1947. font-weight:500;
  1948. font-size:13px;
  1949. vertical-align:middle
  1950. }
  1951. @media (max-width: 767px) {
  1952. .leaderboard-row .logo {
  1953. width:65px;
  1954. height:65px
  1955. }
  1956. .leaderboard-row .logo img {
  1957. width:65px
  1958. }
  1959. .leaderboard-row .info {
  1960. margin-top:12px
  1961. }
  1962. .leaderboard-row .header {
  1963. flex:1 0 100%
  1964. }
  1965. .leaderboard-row .data {
  1966. display:flex;
  1967. align-items:center;
  1968. flex-direction:column
  1969. }
  1970. }
  1971. html,
  1972. body {
  1973. font-family:'Inter UI';
  1974. background-color:white;
  1975. color:block;
  1976. margin:0 auto;
  1977. font-size:16px
  1978. }
  1979. a {
  1980. border-bottom-width:2px;
  1981. border-bottom-style:solid;
  1982. border-bottom-color:#000;
  1983. text-decoration:none;
  1984. color:inherit
  1985. }
  1986. a:hover {
  1987. border-color:transparent
  1988. }
  1989. strong {
  1990. font-weight:700
  1991. }
  1992. * {
  1993. box-sizing:border-box
  1994. }
  1995. h4 {
  1996. font-size:19px;
  1997. margin-bottom:8px
  1998. }
  1999. li {
  2000. line-height:1.6em
  2001. }
  2002. .fab {
  2003. font-size:15px;
  2004. font-family:"Font Awesome 5 Brands";
  2005. padding-left:2px
  2006. }
  2007. .fa-github:before {
  2008. content:"\f09b"
  2009. }
  2010. .container {
  2011. max-width:1040px;
  2012. width:100%;
  2013. margin:0 auto
  2014. }
  2015. .container-sm {
  2016. max-width:900px;
  2017. width:100%;
  2018. margin:0 auto
  2019. }
  2020. .main-root {
  2021. padding:48px 48px;
  2022. max-width:900px;
  2023. margin:0 auto
  2024. }
  2025. @media (max-width: 767px) {
  2026. .main-root {
  2027. padding:32px
  2028. }
  2029. }
  2030. .warning-banner {
  2031. align-items:center;
  2032. border-radius:4px;
  2033. background-color:#e74c3c;
  2034. box-shadow:0 10px 45px -12px rgba(93,90,50,0.25),0 18px 36px -18px rgba(0,0,0,0.3);
  2035. display:flex;
  2036. height:50px;
  2037. justify-content:center
  2038. }
  2039. .warning-banner a {
  2040. border-bottom:1px solid #e74c3c;
  2041. color:white;
  2042. margin-left:10px;
  2043. margin-right:10px
  2044. }
  2045.  
  2046. /*
  2047. FILE ARCHIVED ON 02:34:55 Jun 29, 2019 AND RETRIEVED FROM THE
  2048. INTERNET ARCHIVE ON 13:09:33 Nov 12, 2019.
  2049. JAVASCRIPT APPENDED BY WAYBACK MACHINE, COPYRIGHT INTERNET ARCHIVE.
  2050.  
  2051. ALL OTHER CONTENT MAY ALSO BE PROTECTED BY COPYRIGHT (17 U.S.C.
  2052. SECTION 108(a)(3)).
  2053. */
  2054. /*
  2055. playback timings (ms):
  2056. PetaboxLoader3.datanode: 50.791 (4)
  2057. exclusion.robots.policy: 0.132
  2058. captures_list: 63.421
  2059. load_resource: 95.163
  2060. RedisCDXSource: 0.611
  2061. exclusion.robots: 0.142
  2062. PetaboxLoader3.resolve: 48.403
  2063. CDXLines.iter: 9.791 (3)
  2064. LoadShardBlock: 49.504 (3)
  2065. esindex: 0.01
  2066. */
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement