API tools faq
paste
Advertisement
Guest User

Untitled

a guest
Jan 26th, 2017
116
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 69.74 KB | None | 0 0
raw download clone embed print report
  1. ::selection {
  2. color: #fff;
  3. text-shadow: 0 0 0
  4. }
  5.  
  6. ::-moz-selection {
  7. color: #fff;
  8. text-shadow: 0 0 0
  9. }
  10.  
  11. ::-webkit-selection {
  12. color: #fff;
  13. text-shadow: 0 0 0
  14. }
  15.  
  16. html {
  17. -webkit-font-smoothing: antialiased;
  18. -moz-osx-font-smoothing: grayscale;
  19. height: 100%
  20. }
  21.  
  22. body {
  23. padding: 64px 96px;
  24. }
  25.  
  26. .errorText {
  27. color: red;
  28. text-align: center
  29. }
  30.  
  31. .errorText ul {
  32. list-style-type: none;
  33. padding: 0;
  34. margin: 0
  35. }
  36.  
  37. .errorText a {
  38. text-decoration: none;
  39. font-style: italic;
  40. color: red
  41. }
  42.  
  43. ::selection {
  44. color: #fff;
  45. text-shadow: 0 0 0
  46. }
  47.  
  48. ::-moz-selection {
  49. color: #fff;
  50. text-shadow: 0 0 0
  51. }
  52.  
  53. ::-webkit-selection {
  54. color: #fff;
  55. text-shadow: 0 0 0
  56. }
  57.  
  58. html {
  59. -webkit-font-smoothing: antialiased;
  60. -moz-osx-font-smoothing: grayscale;
  61. height: 100%
  62. }
  63.  
  64. body {
  65. padding-top: 5em
  66. }
  67.  
  68. .errorText {
  69. color: red;
  70. text-align: center
  71. }
  72.  
  73. .errorText ul {
  74. list-style-type: none;
  75. padding: 0;
  76. margin: 0
  77. }
  78.  
  79. .errorText a {
  80. text-decoration: none;
  81. font-style: italic;
  82. color: red
  83. }
  84.  
  85. @font-face {
  86. font-family: 'Simple-Line-Icons';
  87. src: url('icons/Simple-Line-Icons.eot');
  88. src: url('icons/Simple-Line-Icons.eot?#iefix') format('embedded-opentype'), url('icons/Simple-Line-Icons.woff') format('woff'), url('icons/Simple-Line-Icons.ttf') format('truetype'), url('icons/Simple-Line-Icons.svg#Simple-Line-Icons') format('svg');
  89. font-weight: normal;
  90. font-style: normal;
  91. }
  92. /* Use the following CSS code if you want to use data attributes for inserting your icons */
  93. [data-icon]:before {
  94. font-family: 'Simple-Line-Icons';
  95. content: attr(data-icon);
  96. speak: none;
  97. font-weight: normal;
  98. font-variant: normal;
  99. text-transform: none;
  100. line-height: 1;
  101. -webkit-font-smoothing: antialiased;
  102. -moz-osx-font-smoothing: grayscale;
  103. }
  104. /* Use the following CSS code if you want to have a class per icon */
  105. /*
  106. Instead of a list of all class selectors,
  107. you can use the generic selector below, but it's slower:
  108. [class*="icon-"] {
  109. */
  110. .icon-user-female,
  111. .icon-user-follow,
  112. .icon-user-following,
  113. .icon-user-unfollow,
  114. .icon-trophy,
  115. .icon-screen-smartphone,
  116. .icon-screen-desktop,
  117. .icon-plane,
  118. .icon-notebook,
  119. .icon-moustache,
  120. .icon-mouse,
  121. .icon-magnet,
  122. .icon-energy,
  123. .icon-emoticon-smile,
  124. .icon-disc,
  125. .icon-cursor-move,
  126. .icon-crop,
  127. .icon-credit-card,
  128. .icon-chemistry,
  129. .icon-user,
  130. .icon-speedometer,
  131. .icon-social-youtube,
  132. .icon-social-twitter,
  133. .icon-social-tumblr,
  134. .icon-social-facebook,
  135. .icon-social-dropbox,
  136. .icon-social-dribbble,
  137. .icon-shield,
  138. .icon-screen-tablet,
  139. .icon-magic-wand,
  140. .icon-hourglass,
  141. .icon-graduation,
  142. .icon-ghost,
  143. .icon-game-controller,
  144. .icon-fire,
  145. .icon-eyeglasses,
  146. .icon-envelope-open,
  147. .icon-envelope-letter,
  148. .icon-bell,
  149. .icon-badge,
  150. .icon-anchor,
  151. .icon-wallet,
  152. .icon-vector,
  153. .icon-speech,
  154. .icon-puzzle,
  155. .icon-printer,
  156. .icon-present,
  157. .icon-playlist,
  158. .icon-pin,
  159. .icon-picture,
  160. .icon-map,
  161. .icon-layers,
  162. .icon-handbag,
  163. .icon-globe-alt,
  164. .icon-globe,
  165. .icon-frame,
  166. .icon-folder-alt,
  167. .icon-film,
  168. .icon-feed,
  169. .icon-earphones-alt,
  170. .icon-earphones,
  171. .icon-drop,
  172. .icon-drawer,
  173. .icon-docs,
  174. .icon-directions,
  175. .icon-direction,
  176. .icon-diamond,
  177. .icon-cup,
  178. .icon-compass,
  179. .icon-call-out,
  180. .icon-call-in,
  181. .icon-call-end,
  182. .icon-calculator,
  183. .icon-bubbles,
  184. .icon-briefcase,
  185. .icon-book-open,
  186. .icon-basket-loaded,
  187. .icon-basket,
  188. .icon-bag,
  189. .icon-action-undo,
  190. .icon-action-redo,
  191. .icon-wrench,
  192. .icon-umbrella,
  193. .icon-trash,
  194. .icon-tag,
  195. .icon-support,
  196. .icon-size-fullscreen,
  197. .icon-size-actual,
  198. .icon-shuffle,
  199. .icon-share-alt,
  200. .icon-share,
  201. .icon-rocket,
  202. .icon-question,
  203. .icon-pie-chart,
  204. .icon-pencil,
  205. .icon-note,
  206. .icon-music-tone-alt,
  207. .icon-music-tone,
  208. .icon-microphone,
  209. .icon-loop,
  210. .icon-logout,
  211. .icon-login,
  212. .icon-list,
  213. .icon-like,
  214. .icon-home,
  215. .icon-grid,
  216. .icon-graph,
  217. .icon-equalizer,
  218. .icon-dislike,
  219. .icon-cursor,
  220. .icon-control-start,
  221. .icon-control-rewind,
  222. .icon-control-play,
  223. .icon-control-pause,
  224. .icon-control-forward,
  225. .icon-control-end,
  226. .icon-calendar,
  227. .icon-bulb,
  228. .icon-bar-chart,
  229. .icon-arrow-up,
  230. .icon-arrow-right,
  231. .icon-arrow-left,
  232. .icon-arrow-down,
  233. .icon-ban,
  234. .icon-bubble,
  235. .icon-camcorder,
  236. .icon-camera,
  237. .icon-check,
  238. .icon-clock,
  239. .icon-close,
  240. .icon-cloud-download,
  241. .icon-cloud-upload,
  242. .icon-doc,
  243. .icon-envelope,
  244. .icon-eye,
  245. .icon-flag,
  246. .icon-folder,
  247. .icon-heart,
  248. .icon-info,
  249. .icon-key,
  250. .icon-link,
  251. .icon-lock,
  252. .icon-lock-open,
  253. .icon-magnifier,
  254. .icon-magnifier-add,
  255. .icon-magnifier-remove,
  256. .icon-paper-clip,
  257. .icon-paper-plane,
  258. .icon-plus,
  259. .icon-pointer,
  260. .icon-power,
  261. .icon-refresh,
  262. .icon-reload,
  263. .icon-settings,
  264. .icon-star,
  265. .icon-symbol-female,
  266. .icon-symbol-male,
  267. .icon-target,
  268. .icon-volume-1,
  269. .icon-volume-2,
  270. .icon-volume-off,
  271. .icon-users {
  272. font-family: 'Simple-Line-Icons';
  273. speak: none;
  274. font-style: normal;
  275. font-weight: normal;
  276. font-variant: normal;
  277. text-transform: none;
  278. line-height: 1;
  279. -webkit-font-smoothing: antialiased;
  280. }
  281. .icon-user-female:before {
  282. content: "\e000";
  283. }
  284. .icon-user-follow:before {
  285. content: "\e002";
  286. }
  287. .icon-user-following:before {
  288. content: "\e003";
  289. }
  290. .icon-user-unfollow:before {
  291. content: "\e004";
  292. }
  293. .icon-trophy:before {
  294. content: "\e006";
  295. }
  296. .icon-screen-smartphone:before {
  297. content: "\e010";
  298. }
  299. .icon-screen-desktop:before {
  300. content: "\e011";
  301. }
  302. .icon-plane:before {
  303. content: "\e012";
  304. }
  305. .icon-notebook:before {
  306. content: "\e013";
  307. }
  308. .icon-moustache:before {
  309. content: "\e014";
  310. }
  311. .icon-mouse:before {
  312. content: "\e015";
  313. }
  314. .icon-magnet:before {
  315. content: "\e016";
  316. }
  317. .icon-energy:before {
  318. content: "\e020";
  319. }
  320. .icon-emoticon-smile:before {
  321. content: "\e021";
  322. }
  323. .icon-disc:before {
  324. content: "\e022";
  325. }
  326. .icon-cursor-move:before {
  327. content: "\e023";
  328. }
  329. .icon-crop:before {
  330. content: "\e024";
  331. }
  332. .icon-credit-card:before {
  333. content: "\e025";
  334. }
  335. .icon-chemistry:before {
  336. content: "\e026";
  337. }
  338. .icon-user:before {
  339. content: "\e005";
  340. }
  341. .icon-speedometer:before {
  342. content: "\e007";
  343. }
  344. .icon-social-youtube:before {
  345. content: "\e008";
  346. }
  347. .icon-social-twitter:before {
  348. content: "\e009";
  349. }
  350. .icon-social-tumblr:before {
  351. content: "\e00a";
  352. }
  353. .icon-social-facebook:before {
  354. content: "\e00b";
  355. }
  356. .icon-social-dropbox:before {
  357. content: "\e00c";
  358. }
  359. .icon-social-dribbble:before {
  360. content: "\e00d";
  361. }
  362. .icon-shield:before {
  363. content: "\e00e";
  364. }
  365. .icon-screen-tablet:before {
  366. content: "\e00f";
  367. }
  368. .icon-magic-wand:before {
  369. content: "\e017";
  370. }
  371. .icon-hourglass:before {
  372. content: "\e018";
  373. }
  374. .icon-graduation:before {
  375. content: "\e019";
  376. }
  377. .icon-ghost:before {
  378. content: "\e01a";
  379. }
  380. .icon-game-controller:before {
  381. content: "\e01b";
  382. }
  383. .icon-fire:before {
  384. content: "\e01c";
  385. }
  386. .icon-eyeglasses:before {
  387. content: "\e01d";
  388. }
  389. .icon-envelope-open:before {
  390. content: "\e01e";
  391. }
  392. .icon-envelope-letter:before {
  393. content: "\e01f";
  394. }
  395. .icon-bell:before {
  396. content: "\e027";
  397. }
  398. .icon-badge:before {
  399. content: "\e028";
  400. }
  401. .icon-anchor:before {
  402. content: "\e029";
  403. }
  404. .icon-wallet:before {
  405. content: "\e02a";
  406. }
  407. .icon-vector:before {
  408. content: "\e02b";
  409. }
  410. .icon-speech:before {
  411. content: "\e02c";
  412. }
  413. .icon-puzzle:before {
  414. content: "\e02d";
  415. }
  416. .icon-printer:before {
  417. content: "\e02e";
  418. }
  419. .icon-present:before {
  420. content: "\e02f";
  421. }
  422. .icon-playlist:before {
  423. content: "\e030";
  424. }
  425. .icon-pin:before {
  426. content: "\e031";
  427. }
  428. .icon-picture:before {
  429. content: "\e032";
  430. }
  431. .icon-map:before {
  432. content: "\e033";
  433. }
  434. .icon-layers:before {
  435. content: "\e034";
  436. }
  437. .icon-handbag:before {
  438. content: "\e035";
  439. }
  440. .icon-globe-alt:before {
  441. content: "\e036";
  442. }
  443. .icon-globe:before {
  444. content: "\e037";
  445. }
  446. .icon-frame:before {
  447. content: "\e038";
  448. }
  449. .icon-folder-alt:before {
  450. content: "\e039";
  451. }
  452. .icon-film:before {
  453. content: "\e03a";
  454. }
  455. .icon-feed:before {
  456. content: "\e03b";
  457. }
  458. .icon-earphones-alt:before {
  459. content: "\e03c";
  460. }
  461. .icon-earphones:before {
  462. content: "\e03d";
  463. }
  464. .icon-drop:before {
  465. content: "\e03e";
  466. }
  467. .icon-drawer:before {
  468. content: "\e03f";
  469. }
  470. .icon-docs:before {
  471. content: "\e040";
  472. }
  473. .icon-directions:before {
  474. content: "\e041";
  475. }
  476. .icon-direction:before {
  477. content: "\e042";
  478. }
  479. .icon-diamond:before {
  480. content: "\e043";
  481. }
  482. .icon-cup:before {
  483. content: "\e044";
  484. }
  485. .icon-compass:before {
  486. content: "\e045";
  487. }
  488. .icon-call-out:before {
  489. content: "\e046";
  490. }
  491. .icon-call-in:before {
  492. content: "\e047";
  493. }
  494. .icon-call-end:before {
  495. content: "\e048";
  496. }
  497. .icon-calculator:before {
  498. content: "\e049";
  499. }
  500. .icon-bubbles:before {
  501. content: "\e04a";
  502. }
  503. .icon-briefcase:before {
  504. content: "\e04b";
  505. }
  506. .icon-book-open:before {
  507. content: "\e04c";
  508. }
  509. .icon-basket-loaded:before {
  510. content: "\e04d";
  511. }
  512. .icon-basket:before {
  513. content: "\e04e";
  514. }
  515. .icon-bag:before {
  516. content: "\e04f";
  517. }
  518. .icon-action-undo:before {
  519. content: "\e050";
  520. }
  521. .icon-action-redo:before {
  522. content: "\e051";
  523. }
  524. .icon-wrench:before {
  525. content: "\e052";
  526. }
  527. .icon-umbrella:before {
  528. content: "\e053";
  529. }
  530. .icon-trash:before {
  531. content: "\e054";
  532. }
  533. .icon-tag:before {
  534. content: "\e055";
  535. }
  536. .icon-support:before {
  537. content: "\e056";
  538. }
  539. .icon-size-fullscreen:before {
  540. content: "\e057";
  541. }
  542. .icon-size-actual:before {
  543. content: "\e058";
  544. }
  545. .icon-shuffle:before {
  546. content: "\e059";
  547. }
  548. .icon-share-alt:before {
  549. content: "\e05a";
  550. }
  551. .icon-share:before {
  552. content: "\e05b";
  553. }
  554. .icon-rocket:before {
  555. content: "\e05c";
  556. }
  557. .icon-question:before {
  558. content: "\e05d";
  559. }
  560. .icon-pie-chart:before {
  561. content: "\e05e";
  562. }
  563. .icon-pencil:before {
  564. content: "\e05f";
  565. }
  566. .icon-note:before {
  567. content: "\e060";
  568. }
  569. .icon-music-tone-alt:before {
  570. content: "\e061";
  571. }
  572. .icon-music-tone:before {
  573. content: "\e062";
  574. }
  575. .icon-microphone:before {
  576. content: "\e063";
  577. }
  578. .icon-loop:before {
  579. content: "\e064";
  580. }
  581. .icon-logout:before {
  582. content: "\e065";
  583. }
  584. .icon-login:before {
  585. content: "\e066";
  586. }
  587. .icon-list:before {
  588. content: "\e067";
  589. }
  590. .icon-like:before {
  591. content: "\e068";
  592. }
  593. .icon-home:before {
  594. content: "\e069";
  595. }
  596. .icon-grid:before {
  597. content: "\e06a";
  598. }
  599. .icon-graph:before {
  600. content: "\e06b";
  601. }
  602. .icon-equalizer:before {
  603. content: "\e06c";
  604. }
  605. .icon-dislike:before {
  606. content: "\e06d";
  607. }
  608. .icon-cursor:before {
  609. content: "\e06e";
  610. }
  611. .icon-control-start:before {
  612. content: "\e06f";
  613. }
  614. .icon-control-rewind:before {
  615. content: "\e070";
  616. }
  617. .icon-control-play:before {
  618. content: "\e071";
  619. }
  620. .icon-control-pause:before {
  621. content: "\e072";
  622. }
  623. .icon-control-forward:before {
  624. content: "\e073";
  625. }
  626. .icon-control-end:before {
  627. content: "\e074";
  628. }
  629. .icon-calendar:before {
  630. content: "\e075";
  631. }
  632. .icon-bulb:before {
  633. content: "\e076";
  634. }
  635. .icon-bar-chart:before {
  636. content: "\e077";
  637. }
  638. .icon-arrow-up:before {
  639. content: "\e078";
  640. }
  641. .icon-arrow-right:before {
  642. content: "\e079";
  643. }
  644. .icon-arrow-left:before {
  645. content: "\e07a";
  646. }
  647. .icon-arrow-down:before {
  648. content: "\e07b";
  649. }
  650. .icon-ban:before {
  651. content: "\e07c";
  652. }
  653. .icon-bubble:before {
  654. content: "\e07d";
  655. }
  656. .icon-camcorder:before {
  657. content: "\e07e";
  658. }
  659. .icon-camera:before {
  660. content: "\e07f";
  661. }
  662. .icon-check:before {
  663. content: "\e080";
  664. }
  665. .icon-clock:before {
  666. content: "\e081";
  667. }
  668. .icon-close:before {
  669. content: "\e082";
  670. }
  671. .icon-cloud-download:before {
  672. content: "\e083";
  673. }
  674. .icon-cloud-upload:before {
  675. content: "\e084";
  676. }
  677. .icon-doc:before {
  678. content: "\e085";
  679. }
  680. .icon-envelope:before {
  681. content: "\e086";
  682. }
  683. .icon-eye:before {
  684. content: "\e087";
  685. }
  686. .icon-flag:before {
  687. content: "\e088";
  688. }
  689. .icon-folder:before {
  690. content: "\e089";
  691. }
  692. .icon-heart:before {
  693. content: "\e08a";
  694. }
  695. .icon-info:before {
  696. content: "\e08b";
  697. }
  698. .icon-key:before {
  699. content: "\e08c";
  700. }
  701. .icon-link:before {
  702. content: "\e08d";
  703. }
  704. .icon-lock:before {
  705. content: "\e08e";
  706. }
  707. .icon-lock-open:before {
  708. content: "\e08f";
  709. }
  710. .icon-magnifier:before {
  711. content: "\e090";
  712. }
  713. .icon-magnifier-add:before {
  714. content: "\e091";
  715. }
  716. .icon-magnifier-remove:before {
  717. content: "\e092";
  718. }
  719. .icon-paper-clip:before {
  720. content: "\e093";
  721. }
  722. .icon-paper-plane:before {
  723. content: "\e094";
  724. }
  725. .icon-plus:before {
  726. content: "\e095";
  727. }
  728. .icon-pointer:before {
  729. content: "\e096";
  730. }
  731. .icon-power:before {
  732. content: "\e097";
  733. }
  734. .icon-refresh:before {
  735. content: "\e098";
  736. }
  737. .icon-reload:before {
  738. content: "\e099";
  739. }
  740. .icon-settings:before {
  741. content: "\e09a";
  742. }
  743. .icon-star:before {
  744. content: "\e09b";
  745. }
  746. .icon-symbol-female:before {
  747. content: "\e09c";
  748. }
  749. .icon-symbol-male:before {
  750. content: "\e09d";
  751. }
  752. .icon-target:before {
  753. content: "\e09e";
  754. }
  755. .icon-volume-1:before {
  756. content: "\e09f";
  757. }
  758. .icon-volume-2:before {
  759. content: "\e0a0";
  760. }
  761. .icon-volume-off:before {
  762. content: "\e0a1";
  763. }
  764. .icon-users:before {
  765. content: "\e001";
  766. }
  767. /*! normalize.css v1.1.2 | MIT License | git.io/normalize */
  768. /* ==========================================================================
  769. HTML5 display definitions
  770. ========================================================================== */
  771. /**
  772. * Correct `block` display not defined in IE 6/7/8/9 and Firefox 3.
  773. */
  774. article,
  775. aside,
  776. details,
  777. figcaption,
  778. figure,
  779. footer,
  780. header,
  781. hgroup,
  782. main,
  783. nav,
  784. section,
  785. summary {
  786. display: block;
  787. }
  788. /**
  789. * Correct `inline-block` display not defined in IE 6/7/8/9 and Firefox 3.
  790. */
  791. audio,
  792. canvas,
  793. video {
  794. display: inline-block;
  795. *display: inline;
  796. *zoom: 1;
  797. }
  798. /**
  799. * Prevent modern browsers from displaying `audio` without controls.
  800. * Remove excess height in iOS 5 devices.
  801. */
  802. audio:not([controls]) {
  803. display: none;
  804. height: 0;
  805. }
  806. /**
  807. * Address styling not present in IE 7/8/9, Firefox 3, and Safari 4.
  808. * Known issue: no IE 6 support.
  809. */
  810. [hidden] {
  811. display: none;
  812. }
  813. /* ==========================================================================
  814. Base
  815. ========================================================================== */
  816. /**
  817. * 1. Correct text resizing oddly in IE 6/7 when body `font-size` is set using
  818. * `em` units.
  819. * 2. Prevent iOS text size adjust after orientation change, without disabling
  820. * user zoom.
  821. */
  822. html {
  823. font-size: 100%;
  824. /* 1 */
  825. -ms-text-size-adjust: 100%;
  826. /* 2 */
  827. -webkit-text-size-adjust: 100%;
  828. /* 2 */
  829. }
  830. /**
  831. * Address `font-family` inconsistency between `textarea` and other form
  832. * elements.
  833. */
  834. html,
  835. button,
  836. input,
  837. select,
  838. textarea {
  839. font-family: sans-serif;
  840. }
  841. /**
  842. * Address margins handled incorrectly in IE 6/7.
  843. */
  844. body {
  845. margin: 0;
  846. }
  847. /* ==========================================================================
  848. Links
  849. ========================================================================== */
  850. /**
  851. * Address `outline` inconsistency between Chrome and other browsers.
  852. */
  853. a:focus {
  854. outline: thin dotted;
  855. }
  856. /**
  857. * Improve readability when focused and also mouse hovered in all browsers.
  858. */
  859. a:active,
  860. a:hover {
  861. outline: 0;
  862. }
  863. /* ==========================================================================
  864. Typography
  865. ========================================================================== */
  866. /**
  867. * Address font sizes and margins set differently in IE 6/7.
  868. * Address font sizes within `section` and `article` in Firefox 4+, Safari 5,
  869. * and Chrome.
  870. */
  871. h1 {
  872. font-size: 2em;
  873. margin: 0.67em 0;
  874. }
  875. h2 {
  876. font-size: 1.5em;
  877. margin: 0.83em 0;
  878. }
  879. h3 {
  880. font-size: 1.17em;
  881. margin: 1em 0;
  882. }
  883. h4 {
  884. font-size: 1em;
  885. margin: 1.33em 0;
  886. }
  887. h5 {
  888. font-size: 0.83em;
  889. margin: 1.67em 0;
  890. }
  891. h6 {
  892. font-size: 0.67em;
  893. margin: 2.33em 0;
  894. }
  895. /**
  896. * Address styling not present in IE 7/8/9, Safari 5, and Chrome.
  897. */
  898. abbr[title] {
  899. border-bottom: 1px dotted;
  900. }
  901. /**
  902. * Address style set to `bolder` in Firefox 3+, Safari 4/5, and Chrome.
  903. */
  904. b,
  905. strong {
  906. font-weight: bold;
  907. }
  908. blockquote {
  909. margin: 1em 40px;
  910. }
  911. /**
  912. * Address styling not present in Safari 5 and Chrome.
  913. */
  914. dfn {
  915. font-style: italic;
  916. }
  917. /**
  918. * Address differences between Firefox and other browsers.
  919. * Known issue: no IE 6/7 normalization.
  920. */
  921. hr {
  922. -moz-box-sizing: content-box;
  923. box-sizing: content-box;
  924. height: 0;
  925. }
  926. /**
  927. * Address styling not present in IE 6/7/8/9.
  928. */
  929. mark {
  930. background: #ff0;
  931. color: #000;
  932. }
  933. /**
  934. * Address margins set differently in IE 6/7.
  935. */
  936. p,
  937. pre {
  938. margin: 1em 0;
  939. }
  940. /**
  941. * Correct font family set oddly in IE 6, Safari 4/5, and Chrome.
  942. */
  943. code,
  944. kbd,
  945. pre,
  946. samp {
  947. font-family: monospace, serif;
  948. _font-family: 'courier new', monospace;
  949. font-size: 1em;
  950. }
  951. /**
  952. * Improve readability of pre-formatted text in all browsers.
  953. */
  954. pre {
  955. white-space: pre;
  956. white-space: pre-wrap;
  957. word-wrap: break-word;
  958. }
  959. /**
  960. * Address CSS quotes not supported in IE 6/7.
  961. */
  962. q {
  963. quotes: none;
  964. }
  965. /**
  966. * Address `quotes` property not supported in Safari 4.
  967. */
  968. q:before,
  969. q:after {
  970. content: '';
  971. content: none;
  972. }
  973. /**
  974. * Address inconsistent and variable font size in all browsers.
  975. */
  976. small {
  977. font-size: 80%;
  978. }
  979. /**
  980. * Prevent `sub` and `sup` affecting `line-height` in all browsers.
  981. */
  982. sub,
  983. sup {
  984. font-size: 75%;
  985. line-height: 0;
  986. position: relative;
  987. vertical-align: baseline;
  988. }
  989. sup {
  990. top: -0.5em;
  991. }
  992. sub {
  993. bottom: -0.25em;
  994. }
  995. /* ==========================================================================
  996. Lists
  997. ========================================================================== */
  998. /**
  999. * Address margins set differently in IE 6/7.
  1000. */
  1001. dl,
  1002. menu,
  1003. ol,
  1004. ul {
  1005. margin: 1em 0;
  1006. }
  1007. dd {
  1008. margin: 0 0 0 40px;
  1009. }
  1010. /**
  1011. * Address paddings set differently in IE 6/7.
  1012. */
  1013. menu,
  1014. ol,
  1015. ul {
  1016. padding: 0 0 0 40px;
  1017. }
  1018. /**
  1019. * Correct list images handled incorrectly in IE 7.
  1020. */
  1021. nav ul,
  1022. nav ol {
  1023. list-style: none;
  1024. list-style-image: none;
  1025. }
  1026. /* ==========================================================================
  1027. Embedded content
  1028. ========================================================================== */
  1029. /**
  1030. * 1. Remove border when inside `a` element in IE 6/7/8/9 and Firefox 3.
  1031. * 2. Improve image quality when scaled in IE 7.
  1032. */
  1033. img {
  1034. border: 0;
  1035. /* 1 */
  1036. -ms-interpolation-mode: bicubic;
  1037. /* 2 */
  1038. }
  1039. /**
  1040. * Correct overflow displayed oddly in IE 9.
  1041. */
  1042. svg:not(:root) {
  1043. overflow: hidden;
  1044. }
  1045. /* ==========================================================================
  1046. Figures
  1047. ========================================================================== */
  1048. /**
  1049. * Address margin not present in IE 6/7/8/9, Safari 5, and Opera 11.
  1050. */
  1051. figure {
  1052. margin: 0;
  1053. }
  1054. /* ==========================================================================
  1055. Forms
  1056. ========================================================================== */
  1057. /**
  1058. * Correct margin displayed oddly in IE 6/7.
  1059. */
  1060. form {
  1061. margin: 0;
  1062. }
  1063. /**
  1064. * Define consistent border, margin, and padding.
  1065. */
  1066. fieldset {
  1067. border: 1px solid #c0c0c0;
  1068. margin: 0 2px;
  1069. padding: 0.35em 0.625em 0.75em;
  1070. }
  1071. /**
  1072. * 1. Correct color not being inherited in IE 6/7/8/9.
  1073. * 2. Correct text not wrapping in Firefox 3.
  1074. * 3. Correct alignment displayed oddly in IE 6/7.
  1075. */
  1076. legend {
  1077. border: 0;
  1078. /* 1 */
  1079. padding: 0;
  1080. white-space: normal;
  1081. /* 2 */
  1082. *margin-left: -7px;
  1083. /* 3 */
  1084. }
  1085. /**
  1086. * 1. Correct font size not being inherited in all browsers.
  1087. * 2. Address margins set differently in IE 6/7, Firefox 3+, Safari 5,
  1088. * and Chrome.
  1089. * 3. Improve appearance and consistency in all browsers.
  1090. */
  1091. button,
  1092. input,
  1093. select,
  1094. textarea {
  1095. font-size: 100%;
  1096. /* 1 */
  1097. margin: 0;
  1098. /* 2 */
  1099. vertical-align: baseline;
  1100. /* 3 */
  1101. *vertical-align: middle;
  1102. /* 3 */
  1103. }
  1104. /**
  1105. * Address Firefox 3+ setting `line-height` on `input` using `!important` in
  1106. * the UA stylesheet.
  1107. */
  1108. button,
  1109. input {
  1110. line-height: normal;
  1111. }
  1112. /**
  1113. * Address inconsistent `text-transform` inheritance for `button` and `select`.
  1114. * All other form control elements do not inherit `text-transform` values.
  1115. * Correct `button` style inheritance in Chrome, Safari 5+, and IE 6+.
  1116. * Correct `select` style inheritance in Firefox 4+ and Opera.
  1117. */
  1118. button,
  1119. select {
  1120. text-transform: none;
  1121. }
  1122. /**
  1123. * 1. Avoid the WebKit bug in Android 4.0.* where (2) destroys native `audio`
  1124. * and `video` controls.
  1125. * 2. Correct inability to style clickable `input` types in iOS.
  1126. * 3. Improve usability and consistency of cursor style between image-type
  1127. * `input` and others.
  1128. * 4. Remove inner spacing in IE 7 without affecting normal text inputs.
  1129. * Known issue: inner spacing remains in IE 6.
  1130. */
  1131. button,
  1132. html input[type="button"],
  1133. input[type="reset"],
  1134. input[type="submit"] {
  1135. -webkit-appearance: button;
  1136. /* 2 */
  1137. cursor: pointer;
  1138. /* 3 */
  1139. *overflow: visible;
  1140. /* 4 */
  1141. }
  1142. /**
  1143. * Re-set default cursor for disabled elements.
  1144. */
  1145. button[disabled],
  1146. html input[disabled] {
  1147. cursor: default;
  1148. }
  1149. /**
  1150. * 1. Address box sizing set to content-box in IE 8/9.
  1151. * 2. Remove excess padding in IE 8/9.
  1152. * 3. Remove excess padding in IE 7.
  1153. * Known issue: excess padding remains in IE 6.
  1154. */
  1155. input[type="checkbox"],
  1156. input[type="radio"] {
  1157. box-sizing: border-box;
  1158. /* 1 */
  1159. padding: 0;
  1160. /* 2 */
  1161. *height: 13px;
  1162. /* 3 */
  1163. *width: 13px;
  1164. /* 3 */
  1165. }
  1166. /**
  1167. * 1. Address `appearance` set to `searchfield` in Safari 5 and Chrome.
  1168. * 2. Address `box-sizing` set to `border-box` in Safari 5 and Chrome
  1169. * (include `-moz` to future-proof).
  1170. */
  1171. input[type="search"] {
  1172. -webkit-appearance: textfield;
  1173. /* 1 */
  1174. -moz-box-sizing: content-box;
  1175. -webkit-box-sizing: content-box;
  1176. /* 2 */
  1177. box-sizing: content-box;
  1178. }
  1179. /**
  1180. * Remove inner padding and search cancel button in Safari 5 and Chrome
  1181. * on OS X.
  1182. */
  1183. input[type="search"]::-webkit-search-cancel-button,
  1184. input[type="search"]::-webkit-search-decoration {
  1185. -webkit-appearance: none;
  1186. }
  1187. /**
  1188. * Remove inner padding and border in Firefox 3+.
  1189. */
  1190. button::-moz-focus-inner,
  1191. input::-moz-focus-inner {
  1192. border: 0;
  1193. padding: 0;
  1194. }
  1195. /**
  1196. * 1. Remove default vertical scrollbar in IE 6/7/8/9.
  1197. * 2. Improve readability and alignment in all browsers.
  1198. */
  1199. textarea {
  1200. overflow: auto;
  1201. /* 1 */
  1202. vertical-align: top;
  1203. /* 2 */
  1204. }
  1205. /* ==========================================================================
  1206. Tables
  1207. ========================================================================== */
  1208. /**
  1209. * Remove most spacing between table cells.
  1210. */
  1211. table {
  1212. border-collapse: collapse;
  1213. border-spacing: 0;
  1214. }
  1215. *,
  1216. *:before,
  1217. *:after {
  1218. -webkit-box-sizing: border-box;
  1219. -moz-box-sizing: border-box;
  1220. box-sizing: border-box;
  1221. }
  1222. article,
  1223. aside,
  1224. details,
  1225. figcaption,
  1226. figure,
  1227. footer,
  1228. header,
  1229. hgroup,
  1230. main,
  1231. nav,
  1232. section,
  1233. summary {
  1234. display: block;
  1235. }
  1236. html,
  1237. button,
  1238. input,
  1239. select,
  1240. textarea {
  1241. font-family: sans-serif;
  1242. }
  1243. body,
  1244. form,
  1245. fieldset,
  1246. legend,
  1247. input,
  1248. select,
  1249. textarea,
  1250. button {
  1251. margin: 0;
  1252. }
  1253. html {
  1254. font-size: 100%;
  1255. }
  1256. .section {
  1257. position: relative;
  1258. }
  1259. .container {
  1260. max-width: 960px;
  1261. margin-left: auto;
  1262. margin-right: auto;
  1263. padding-left: 10px;
  1264. padding-right: 10px;
  1265. }
  1266. .container-full {
  1267. max-width: 960px;
  1268. margin-left: auto;
  1269. margin-right: auto;
  1270. }
  1271. .col {
  1272. float: left;
  1273. padding-left: 10px;
  1274. padding-right: 10px;
  1275. }
  1276. [class*="pull-"],
  1277. [class*="push-"] {
  1278. position: relative;
  1279. }
  1280. .no-gutter {
  1281. padding-left: 0;
  1282. padding-right: 0;
  1283. }
  1284. .col-1 {
  1285. width: 8.33333%;
  1286. width: calc(100% / 12 * 1);
  1287. width: -webkit-calc(100% / 12 * 1);
  1288. width: -moz-calc(100% / 12 * 1);
  1289. }
  1290. .col-2 {
  1291. width: 16.66667%;
  1292. width: calc(100% / 12 * 2);
  1293. width: -webkit-calc(100% / 12 * 2);
  1294. width: -moz-calc(100% / 12 * 2);
  1295. }
  1296. .col-3,
  1297. .col-1-4 {
  1298. width: 25%;
  1299. width: calc(100% / 12 * 3);
  1300. width: -webkit-calc(100% / 12 * 3);
  1301. width: -moz-calc(100% / 12 * 3);
  1302. }
  1303. .col-4,
  1304. .col-1-3 {
  1305. width: 33.33333%;
  1306. width: calc(100% / 12 * 4);
  1307. width: -webkit-calc(100% / 12 * 4);
  1308. width: -moz-calc(100% / 12 * 4);
  1309. }
  1310. .col-5 {
  1311. width: 41.66665%;
  1312. width: calc(100% / 12 * 5);
  1313. width: -webkit-calc(100% / 12 * 5);
  1314. width: -moz-calc(100% / 12 * 5);
  1315. }
  1316. .col-6,
  1317. .col-1-2 {
  1318. width: 50%;
  1319. width: calc(100% / 12 * 6);
  1320. width: -webkit-calc(100% / 12 * 6);
  1321. width: -moz-calc(100% / 12 * 6);
  1322. }
  1323. .col-7 {
  1324. width: 58.33333%;
  1325. width: calc(100% / 12 * 7);
  1326. width: -webkit-calc(100% / 12 * 7);
  1327. width: -moz-calc(100% / 12 * 7);
  1328. }
  1329. .col-8 {
  1330. width: 66.66666%;
  1331. width: calc(100% / 12 * 8);
  1332. width: -webkit-calc(100% / 12 * 8);
  1333. width: -moz-calc(100% / 12 * 8);
  1334. }
  1335. .col-9,
  1336. .col-3-4 {
  1337. width: 75%;
  1338. width: calc(100% / 12 * 9);
  1339. width: -webkit-calc(100% / 12 * 9);
  1340. width: -moz-calc(100% / 12 * 9);
  1341. }
  1342. .col-10 {
  1343. width: 83.33333%;
  1344. width: calc(100% / 12 * 10);
  1345. width: -webkit-calc(100% / 12 * 10);
  1346. width: -moz-calc(100% / 12 * 10);
  1347. }
  1348. .col-11 {
  1349. width: 91.66666%;
  1350. width: calc(100% / 12 * 11);
  1351. width: -webkit-calc(100% / 12 * 11);
  1352. width: -moz-calc(100% / 12 * 11);
  1353. }
  1354. .col-12 {
  1355. width: 100%;
  1356. }
  1357. .push-1 {
  1358. left: 8.33333%;
  1359. left: calc(100% / 12 * 1);
  1360. left: -webkit-calc(100% / 12 * 1);
  1361. left: -moz-calc(100% / 12 * 1);
  1362. }
  1363. .pull-1 {
  1364. left: -8.33333%;
  1365. left: calc(-100% / 12 * 1);
  1366. left: -webkit-calc(-100% / 12 * 1);
  1367. left: -moz-calc(-100% / 12 * 1);
  1368. }
  1369. .push-2 {
  1370. left: 16.66667%;
  1371. left: calc(100% / 12 * 2);
  1372. left: -webkit-calc(100% / 12 * 2);
  1373. left: -moz-calc(100% / 12 * 2);
  1374. }
  1375. .pull-2 {
  1376. left: -16.66667%;
  1377. left: calc(-100% / 12 * 2);
  1378. left: -webkit-calc(-100% / 12 * 2);
  1379. left: -moz-calc(-100% / 12 * 2);
  1380. }
  1381. .push-3,
  1382. .push-1-4 {
  1383. left: 25%;
  1384. left: calc(100% / 12 * 3);
  1385. left: -webkit-calc(100% / 12 * 3);
  1386. left: -moz-calc(100% / 12 * 3);
  1387. }
  1388. .pull-3,
  1389. .pull-1-4 {
  1390. left: -25%;
  1391. left: calc(-100% / 12 * 3);
  1392. left: -webkit-calc(-100% / 12 * 3);
  1393. left: -moz-calc(-100% / 12 * 3);
  1394. }
  1395. .push-4,
  1396. .push-1-3 {
  1397. left: 33.33333%;
  1398. left: calc(100% / 12 * 4);
  1399. left: -webkit-calc(100% / 12 * 4);
  1400. left: -moz-calc(100% / 12 * 4);
  1401. }
  1402. .pull-4,
  1403. .pull-1-3 {
  1404. left: -33.33333%;
  1405. left: calc(-100% / 12 * 4);
  1406. left: -webkit-calc(-100% / 12 * 4);
  1407. left: -moz-calc(-100% / 12 * 4);
  1408. }
  1409. .push-5 {
  1410. left: 41.66665%;
  1411. left: calc(100% / 12 * 5);
  1412. left: -webkit-calc(100% / 12 * 5);
  1413. left: -moz-calc(100% / 12 * 5);
  1414. }
  1415. .pull-5 {
  1416. left: -41.66665%;
  1417. left: calc(-100% / 12 * 5);
  1418. left: -webkit-calc(-100% / 12 * 5);
  1419. left: -moz-calc(-100% / 12 * 5);
  1420. }
  1421. .push-6,
  1422. .push-1-2 {
  1423. left: 50%;
  1424. left: calc(100% / 12 * 6);
  1425. left: -webkit-calc(100% / 12 * 6);
  1426. left: -moz-calc(100% / 12 * 6);
  1427. }
  1428. .pull-6,
  1429. .pull-1-2 {
  1430. left: -50%;
  1431. left: calc(-100% / 12 * 6);
  1432. left: -webkit-calc(-100% / 12 * 6);
  1433. left: -moz-calc(-100% / 12 * 6);
  1434. }
  1435. .push-7 {
  1436. left: 58.33333%;
  1437. left: calc(100% / 12 * 7);
  1438. left: -webkit-calc(100% / 12 * 7);
  1439. left: -moz-calc(100% / 12 * 7);
  1440. }
  1441. .pull-7 {
  1442. left: -58.33333%;
  1443. left: calc(-100% / 12 * 7);
  1444. left: -webkit-calc(-100% / 12 * 7);
  1445. left: -moz-calc(-100% / 12 * 7);
  1446. }
  1447. .push-8 {
  1448. left: 66.66666%;
  1449. left: calc(100% / 12 * 8);
  1450. left: -webkit-calc(100% / 12 * 8);
  1451. left: -moz-calc(100% / 12 * 8);
  1452. }
  1453. .pull-8 {
  1454. left: -66.66666%;
  1455. left: calc(-100% / 12 * 8);
  1456. left: -webkit-calc(-100% / 12 * 8);
  1457. left: -moz-calc(-100% / 12 * 8);
  1458. }
  1459. .push-9,
  1460. .push-3-4 {
  1461. left: 75%;
  1462. left: calc(100% / 12 * 9);
  1463. left: -webkit-calc(100% / 12 * 9);
  1464. left: -moz-calc(100% / 12 * 9);
  1465. }
  1466. .pull-9,
  1467. .pull-3-4 {
  1468. left: -75%;
  1469. left: calc(-100% / 12 * 9);
  1470. left: -webkit-calc(-100% / 12 * 9);
  1471. left: -moz-calc(-100% / 12 * 9);
  1472. }
  1473. .push-10 {
  1474. left: 83.33333%;
  1475. left: calc(100% / 12 * 10);
  1476. left: -webkit-calc(100% / 12 * 10);
  1477. left: -moz-calc(100% / 12 * 10);
  1478. }
  1479. .pull-10 {
  1480. left: -83.33333%;
  1481. left: calc(-100% / 12 * 10);
  1482. left: -webkit-calc(-100% / 12 * 10);
  1483. left: -moz-calc(-100% / 12 * 10);
  1484. }
  1485. .push-11 {
  1486. left: 91.66666%;
  1487. left: calc(100% / 12 * 11);
  1488. left: -webkit-calc(100% / 12 * 11);
  1489. left: -moz-calc(100% / 12 * 11);
  1490. }
  1491. .pull-11 {
  1492. left: -91.66666%;
  1493. left: calc(-100% / 12 * 11);
  1494. left: -webkit-calc(-100% / 12 * 11);
  1495. left: -moz-calc(-100% / 12 * 11);
  1496. }
  1497. .row {
  1498. padding-top: 1em;
  1499. padding-bottom: 1em;
  1500. }
  1501. .no-desktop {
  1502. display: none;
  1503. }
  1504. .no-margin {
  1505. margin: 0;
  1506. }
  1507. .no-padding {
  1508. padding: 0;
  1509. }
  1510. @media only screen and (min-width: 660px) and (max-width: 959px) {
  1511. .container,
  1512. .tablet-container {
  1513. max-width: 960px;
  1514. padding-left: 20px;
  1515. padding-right: 20px;
  1516. margin-left: auto;
  1517. margin-right: auto;
  1518. float: none;
  1519. }
  1520. .container:first-child,
  1521. .tablet-container:first-child {
  1522. margin-left: auto;
  1523. }
  1524. .tablet-container-full {
  1525. padding-left: 0;
  1526. padding-right: 0;
  1527. margin-left: auto;
  1528. margin-right: auto;
  1529. float: none;
  1530. }
  1531. .tablet-container-full:first-child {
  1532. margin-left: auto;
  1533. }
  1534. .tablet-no-gutter {
  1535. padding-left: 0;
  1536. padding-right: 0;
  1537. }
  1538. .tablet-col-1 {
  1539. width: 8.33333%;
  1540. width: calc(100% / 12 * 1);
  1541. width: -webkit-calc(100% / 12 * 1);
  1542. width: -moz-calc(100% / 12 * 1);
  1543. }
  1544. .tablet-col-2 {
  1545. width: 16.66667%;
  1546. width: calc(100% / 12 * 2);
  1547. width: -webkit-calc(100% / 12 * 2);
  1548. width: -moz-calc(100% / 12 * 2);
  1549. }
  1550. .tablet-col-3,
  1551. .tablet-col-1-4 {
  1552. width: 25%;
  1553. width: calc(100% / 12 * 3);
  1554. width: -webkit-calc(100% / 12 * 3);
  1555. width: -moz-calc(100% / 12 * 3);
  1556. }
  1557. .tablet-col-4,
  1558. .tablet-col-1-3 {
  1559. width: 33.33333%;
  1560. width: calc(100% / 12 * 4);
  1561. width: -webkit-calc(100% / 12 * 4);
  1562. width: -moz-calc(100% / 12 * 4);
  1563. }
  1564. .tablet-col-5 {
  1565. width: 41.66665%;
  1566. width: calc(100% / 12 * 5);
  1567. width: -webkit-calc(100% / 12 * 5);
  1568. width: -moz-calc(100% / 12 * 5);
  1569. }
  1570. .tablet-col-6,
  1571. .tablet-col-1-2 {
  1572. width: 50%;
  1573. width: calc(100% / 12 * 6);
  1574. width: -webkit-calc(100% / 12 * 6);
  1575. width: -moz-calc(100% / 12 * 6);
  1576. }
  1577. .tablet-col-7 {
  1578. width: 58.33333%;
  1579. width: calc(100% / 12 * 7);
  1580. width: -webkit-calc(100% / 12 * 7);
  1581. width: -moz-calc(100% / 12 * 7);
  1582. }
  1583. .tablet-col-8 {
  1584. width: 66.66666%;
  1585. width: calc(100% / 12 * 8);
  1586. width: -webkit-calc(100% / 12 * 8);
  1587. width: -moz-calc(100% / 12 * 8);
  1588. }
  1589. .tablet-col-9,
  1590. .tablet-col-3-4 {
  1591. width: 75%;
  1592. width: calc(100% / 12 * 9);
  1593. width: -webkit-calc(100% / 12 * 9);
  1594. width: -moz-calc(100% / 12 * 9);
  1595. }
  1596. .tablet-col-10 {
  1597. width: 83.33333%;
  1598. width: calc(100% / 12 * 10);
  1599. width: -webkit-calc(100% / 12 * 10);
  1600. width: -moz-calc(100% / 12 * 10);
  1601. }
  1602. .tablet-col-11 {
  1603. width: 91.66666%;
  1604. width: calc(100% / 12 * 11);
  1605. width: -webkit-calc(100% / 12 * 11);
  1606. width: -moz-calc(100% / 12 * 11);
  1607. }
  1608. .tablet-col-12 {
  1609. width: 100%;
  1610. }
  1611. .tablet-push-1 {
  1612. left: 8.33333%;
  1613. left: calc(100% / 12 * 1);
  1614. left: -webkit-calc(100% / 12 * 1);
  1615. left: -moz-calc(100% / 12 * 1);
  1616. }
  1617. .tablet-pull-1 {
  1618. left: -8.33333%;
  1619. left: calc(-100% / 12 * 1);
  1620. left: -webkit-calc(-100% / 12 * 1);
  1621. left: -moz-calc(-100% / 12 * 1);
  1622. }
  1623. .tablet-push-2 {
  1624. left: 16.66667%;
  1625. left: calc(100% / 12 * 2);
  1626. left: -webkit-calc(100% / 12 * 2);
  1627. left: -moz-calc(100% / 12 * 2);
  1628. }
  1629. .tablet-pull-2 {
  1630. left: -16.66667%;
  1631. left: calc(-100% / 12 * 2);
  1632. left: -webkit-calc(-100% / 12 * 2);
  1633. left: -moz-calc(-100% / 12 * 2);
  1634. }
  1635. .tablet-push-3,
  1636. .tablet-push-1-4 {
  1637. left: 25%;
  1638. left: calc(100% / 12 * 3);
  1639. left: -webkit-calc(100% / 12 * 3);
  1640. left: -moz-calc(100% / 12 * 3);
  1641. }
  1642. .tablet-pull-3,
  1643. .tablet-pull-1-4 {
  1644. left: -25%;
  1645. left: calc(-100% / 12 * 3);
  1646. left: -webkit-calc(-100% / 12 * 3);
  1647. left: -moz-calc(-100% / 12 * 3);
  1648. }
  1649. .tablet-push-4,
  1650. .tablet-push-1-3 {
  1651. left: 33.33333%;
  1652. left: calc(100% / 12 * 4);
  1653. left: -webkit-calc(100% / 12 * 4);
  1654. left: -moz-calc(100% / 12 * 4);
  1655. }
  1656. .tablet-pull-4,
  1657. .tablet-pull-1-3 {
  1658. left: -33.33333%;
  1659. left: calc(-100% / 12 * 4);
  1660. left: -webkit-calc(-100% / 12 * 4);
  1661. left: -moz-calc(-100% / 12 * 4);
  1662. }
  1663. .tablet-push-5 {
  1664. left: 41.66665%;
  1665. left: calc(100% / 12 * 5);
  1666. left: -webkit-calc(100% / 12 * 5);
  1667. left: -moz-calc(100% / 12 * 5);
  1668. }
  1669. .tablet-pull-5 {
  1670. left: -41.66665%;
  1671. left: calc(-100% / 12 * 5);
  1672. left: -webkit-calc(-100% / 12 * 5);
  1673. left: -moz-calc(-100% / 12 * 5);
  1674. }
  1675. .tablet-push-6,
  1676. .tablet-push-1-2 {
  1677. left: 50%;
  1678. left: calc(100% / 12 * 6);
  1679. left: -webkit-calc(100% / 12 * 6);
  1680. left: -moz-calc(100% / 12 * 6);
  1681. }
  1682. .tablet-pull-6,
  1683. .tablet-pull-1-2 {
  1684. left: -50%;
  1685. left: calc(-100% / 12 * 6);
  1686. left: -webkit-calc(-100% / 12 * 6);
  1687. left: -moz-calc(-100% / 12 * 6);
  1688. }
  1689. .tablet-push-7 {
  1690. left: 58.33333%;
  1691. left: calc(100% / 12 * 7);
  1692. left: -webkit-calc(100% / 12 * 7);
  1693. left: -moz-calc(100% / 12 * 7);
  1694. }
  1695. .tablet-pull-7 {
  1696. left: -58.33333%;
  1697. left: calc(-100% / 12 * 7);
  1698. left: -webkit-calc(-100% / 12 * 7);
  1699. left: -moz-calc(-100% / 12 * 7);
  1700. }
  1701. .tablet-push-8 {
  1702. left: 66.66666%;
  1703. left: calc(100% / 12 * 8);
  1704. left: -webkit-calc(100% / 12 * 8);
  1705. left: -moz-calc(100% / 12 * 8);
  1706. }
  1707. .tablet-pull-8 {
  1708. left: -66.66666%;
  1709. left: calc(-100% / 12 * 8);
  1710. left: -webkit-calc(-100% / 12 * 8);
  1711. left: -moz-calc(-100% / 12 * 8);
  1712. }
  1713. .tablet-push-9,
  1714. .tablet-push-3-4 {
  1715. left: 75%;
  1716. left: calc(100% / 12 * 9);
  1717. left: -webkit-calc(100% / 12 * 9);
  1718. left: -moz-calc(100% / 12 * 9);
  1719. }
  1720. .tablet-pull-9,
  1721. .tablet-pull-3-4 {
  1722. left: -75%;
  1723. left: calc(-100% / 12 * 9);
  1724. left: -webkit-calc(-100% / 12 * 9);
  1725. left: -moz-calc(-100% / 12 * 9);
  1726. }
  1727. .tablet-push-10 {
  1728. left: 83.33333%;
  1729. left: calc(100% / 12 * 10);
  1730. left: -webkit-calc(100% / 12 * 10);
  1731. left: -moz-calc(100% / 12 * 10);
  1732. }
  1733. .tablet-pull-10 {
  1734. left: -83.33333%;
  1735. left: calc(-100% / 12 * 10);
  1736. left: -webkit-calc(-100% / 12 * 10);
  1737. left: -moz-calc(-100% / 12 * 10);
  1738. }
  1739. .tablet-push-11 {
  1740. left: 91.66666%;
  1741. left: calc(100% / 12 * 11);
  1742. left: -webkit-calc(100% / 12 * 11);
  1743. left: -moz-calc(100% / 12 * 11);
  1744. }
  1745. .tablet-pull-11 {
  1746. left: -91.66666%;
  1747. left: calc(-100% / 12 * 11);
  1748. left: -webkit-calc(-100% / 12 * 11);
  1749. left: -moz-calc(-100% / 12 * 11);
  1750. }
  1751. .tablet-no-push,
  1752. .tablet-no-pull {
  1753. left: auto;
  1754. }
  1755. .tablet-row {
  1756. padding-top: 1em;
  1757. padding-bottom: 1em;
  1758. }
  1759. .tablet-full {
  1760. left: auto;
  1761. clear: both;
  1762. float: none;
  1763. width: 100%;
  1764. margin: 1em 0 0 0;
  1765. display: block;
  1766. }
  1767. .tablet-full:first-child {
  1768. margin-top: 0;
  1769. }
  1770. .tablet-text-left {
  1771. text-align: left;
  1772. }
  1773. .tablet-text-right {
  1774. text-align: right;
  1775. }
  1776. .tablet-text-center {
  1777. text-align: center;
  1778. }
  1779. .tablet-left {
  1780. float: left;
  1781. }
  1782. .tablet-right {
  1783. float: right;
  1784. }
  1785. .tablet-no-float {
  1786. float: none;
  1787. }
  1788. .tablet-no-margin {
  1789. margin: 0;
  1790. }
  1791. .tablet-no-padding {
  1792. padding: 0;
  1793. }
  1794. .no-tablet {
  1795. display: none;
  1796. }
  1797. .show-tablet {
  1798. display: block;
  1799. }
  1800. }
  1801. @media only screen and (max-width: 659px) {
  1802. .container,
  1803. .mobile-container {
  1804. padding-left: 20px;
  1805. padding-right: 20px;
  1806. margin-left: auto;
  1807. margin-right: auto;
  1808. float: none;
  1809. }
  1810. .container:first-child,
  1811. .mobile-container:first-child {
  1812. margin-left: auto;
  1813. }
  1814. .mobile-container-full {
  1815. padding-left: 0;
  1816. padding-right: 0;
  1817. margin-left: auto;
  1818. margin-right: auto;
  1819. float: none;
  1820. }
  1821. .mobile-container-full:first-child {
  1822. margin-left: auto;
  1823. }
  1824. .mobile-no-gutter {
  1825. padding-left: 0;
  1826. padding-right: 0;
  1827. }
  1828. .mobile-col-1-2 {
  1829. width: 50%;
  1830. width: calc(100% / 12 * 6);
  1831. width: -webkit-calc(100% / 12 * 6);
  1832. width: -moz-calc(100% / 12 * 6);
  1833. }
  1834. .mobile-col-1-3 {
  1835. width: 33.33333%;
  1836. width: calc(100% / 12 * 4);
  1837. width: -webkit-calc(100% / 12 * 4);
  1838. width: -moz-calc(100% / 12 * 4);
  1839. }
  1840. .mobile-col-1-4 {
  1841. width: 25%;
  1842. width: calc(100% / 12 * 3);
  1843. width: -webkit-calc(100% / 12 * 3);
  1844. width: -moz-calc(100% / 12 * 3);
  1845. }
  1846. .mobile-col-3-4 {
  1847. width: 75%;
  1848. width: calc(100% / 12 * 9);
  1849. width: -webkit-calc(100% / 12 * 9);
  1850. width: -moz-calc(100% / 12 * 9);
  1851. }
  1852. .mobile-push-1-2 {
  1853. left: 50%;
  1854. left: calc(100% / 12 * 6);
  1855. left: -webkit-calc(100% / 12 * 6);
  1856. left: -moz-calc(100% / 12 * 6);
  1857. }
  1858. .mobile-pull-1-2 {
  1859. left: -50%;
  1860. left: calc(-100% / 12 * 6);
  1861. left: -webkit-calc(-100% / 12 * 6);
  1862. left: -moz-calc(-100% / 12 * 6);
  1863. }
  1864. .mobile-push-1-3 {
  1865. left: 25%;
  1866. left: calc(100% / 12 * 3);
  1867. left: -webkit-calc(100% / 12 * 3);
  1868. left: -moz-calc(100% / 12 * 3);
  1869. }
  1870. .mobile-pull-1-3 {
  1871. left: -25%;
  1872. left: calc(-100% / 12 * 3);
  1873. left: -webkit-calc(-100% / 12 * 3);
  1874. left: -moz-calc(-100% / 12 * 3);
  1875. }
  1876. .mobile-push-1-4 {
  1877. left: 33.33333%;
  1878. left: calc(100% / 12 * 4);
  1879. left: -webkit-calc(100% / 12 * 4);
  1880. left: -moz-calc(100% / 12 * 4);
  1881. }
  1882. .mobile-pull-1-4 {
  1883. left: -33.33333%;
  1884. left: calc(-100% / 12 * 4);
  1885. left: -webkit-calc(-100% / 12 * 4);
  1886. left: -moz-calc(-100% / 12 * 4);
  1887. }
  1888. .mobile-push-3-4 {
  1889. left: 75%;
  1890. left: calc(100% / 12 * 9);
  1891. left: -webkit-calc(100% / 12 * 9);
  1892. left: -moz-calc(100% / 12 * 9);
  1893. }
  1894. .mobile-pull-3-4 {
  1895. left: -75%;
  1896. left: calc(-100% / 12 * 9);
  1897. left: -webkit-calc(-100% / 12 * 9);
  1898. left: -moz-calc(-100% / 12 * 9);
  1899. }
  1900. .mobile-no-push,
  1901. .mobile-no-pull {
  1902. left: auto;
  1903. }
  1904. .mobile-row {
  1905. padding-top: 1em;
  1906. padding-bottom: 1em;
  1907. }
  1908. .mobile-full {
  1909. left: auto;
  1910. clear: both;
  1911. float: none;
  1912. width: 100%;
  1913. margin: 0.2em 0 0 0;
  1914. display: block;
  1915. }
  1916. .mobile-full:first-child {
  1917. margin-top: 0;
  1918. }
  1919. .mobile-text-left {
  1920. text-align: left;
  1921. }
  1922. .mobile-text-right {
  1923. text-align: right;
  1924. }
  1925. .mobile-text-center {
  1926. text-align: center;
  1927. }
  1928. .mobile-left {
  1929. float: left;
  1930. }
  1931. .mobile-right {
  1932. float: right;
  1933. }
  1934. .mobile-no-float {
  1935. float: none;
  1936. }
  1937. .mobile-no-margin {
  1938. margin: 0;
  1939. }
  1940. .mobile-no-padding {
  1941. padding: 0;
  1942. }
  1943. .no-mobile {
  1944. display: none;
  1945. }
  1946. .show-mobile {
  1947. display: block;
  1948. }
  1949. }
  1950. @media print {
  1951. * {
  1952. background: transparent;
  1953. }
  1954. a,
  1955. a:visited {
  1956. text-decoration: underline;
  1957. }
  1958. abbr[title]:after {
  1959. content: " (" attr(title) ")";
  1960. }
  1961. pre,
  1962. blockquote {
  1963. border: 1px solid #999;
  1964. page-break-inside: avoid;
  1965. }
  1966. thead {
  1967. display: table-header-group;
  1968. }
  1969. tr,
  1970. img {
  1971. page-break-inside: avoid;
  1972. }
  1973. img {
  1974. max-width: 100%;
  1975. }
  1976. @page {
  1977. margin: 0.5cm;
  1978. }
  1979. p,
  1980. h2,
  1981. h3 {
  1982. orphans: 3;
  1983. widows: 3;
  1984. }
  1985. h2,
  1986. h3 {
  1987. page-break-after: avoid;
  1988. }
  1989. }
  1990. @font-face {
  1991. font-family: 'Source Sans Pro';
  1992. src: url('fonts/SourceSansPro-ExtraLight.otf');
  1993. font-weight: 100;
  1994. font-style: normal;
  1995. }
  1996. @font-face {
  1997. font-family: 'Source Sans Pro';
  1998. src: url('fonts/SourceSansPro-ExtraLightIt.otf');
  1999. font-weight: 100;
  2000. font-style: italic;
  2001. }
  2002. @font-face {
  2003. font-family: 'Source Sans Pro';
  2004. src: url('fonts/SourceSansPro-Light.otf');
  2005. font-weight: 300;
  2006. font-style: normal;
  2007. }
  2008. @font-face {
  2009. font-family: 'Source Sans Pro';
  2010. src: url('fonts/SourceSansPro-Regular.otf');
  2011. font-weight: 400;
  2012. font-style: normal;
  2013. }
  2014. @font-face {
  2015. font-family: 'Source Sans Pro';
  2016. src: url('fonts/SourceSansPro-Semibold.otf');
  2017. font-weight: 500;
  2018. font-style: normal;
  2019. }
  2020. @font-face {
  2021. font-family: 'Source Sans Pro';
  2022. src: url('fonts/SourceSansPro-Bold.otf');
  2023. font-weight: 700;
  2024. font-style: normal;
  2025. }
  2026. @font-face {
  2027. font-family: 'Montserrat';
  2028. src: url('fonts/Montserrat-Regular.otf');
  2029. font-weight: 400;
  2030. font-style: normal;
  2031. }
  2032. .dapp-clear-fix {
  2033. clear: both;
  2034. }
  2035. .dapp-overflow {
  2036. overflow-y: auto;
  2037. overflow-x: hidden;
  2038. -webkit-overflow-scrolling: touch;
  2039. }
  2040. .dapp-shorten-text {
  2041. display: inline-block;
  2042. -o-text-overflow: ellipsis;
  2043. text-overflow: ellipsis;
  2044. overflow: hidden;
  2045. white-space: nowrap;
  2046. max-width: 100%;
  2047. }
  2048. .dapp-button-reset {
  2049. background: none;
  2050. border: 0;
  2051. padding: 0;
  2052. margin: 0;
  2053. -webkit-box-sizing: content-box;
  2054. -moz-box-sizing: content-box;
  2055. box-sizing: content-box;
  2056. }
  2057. .dapp-button-reset:hover,
  2058. .dapp-button-reset:focus {
  2059. outline: 0;
  2060. }
  2061. .dapp-shadow-none {
  2062. -webkit-box-shadow: 0 0 0 rgba(0, 0, 0, 0);
  2063. -moz-box-shadow: 0 0 0 rgba(0, 0, 0, 0);
  2064. box-shadow: 0 0 0 rgba(0, 0, 0, 0);
  2065. }
  2066. .dapp-shadow-small {
  2067. -webkit-box-shadow: 0 0px 1px rgba(0, 0, 0, 0.3);
  2068. -moz-box-shadow: 0 0px 1px rgba(0, 0, 0, 0.3);
  2069. box-shadow: 0 0px 1px rgba(0, 0, 0, 0.3);
  2070. }
  2071. .dapp-shadow-medium {
  2072. -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3);
  2073. -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3);
  2074. box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3);
  2075. }
  2076. .dapp-shadow-large {
  2077. -webkit-box-shadow: 0 1px 16px rgba(0, 0, 0, 0.3);
  2078. -moz-box-shadow: 0 1px 16px rgba(0, 0, 0, 0.3);
  2079. box-shadow: 0 1px 16px rgba(0, 0, 0, 0.3);
  2080. }
  2081. .dapp-horizontal-menu,
  2082. .dapp-vertical-menu {
  2083. padding: 0;
  2084. margin: 0;
  2085. list-style: none;
  2086. }
  2087. .dapp-horizontal-menu li {
  2088. display: inline-block;
  2089. padding: 0;
  2090. margin: 0;
  2091. }
  2092. .dapp-vertical-menu li {
  2093. display: block;
  2094. padding: 0;
  2095. margin: 0;
  2096. }
  2097. .cubic-bezier {
  2098. -webkit-transition-timing-function: cubic-bezier(0.15, 0.3, 0.1, 1);
  2099. -moz-transition-timing-function: cubic-bezier(0.15, 0.3, 0.1, 1);
  2100. -o-transition-timing-function: cubic-bezier(0.15, 0.3, 0.1, 1);
  2101. transition-timing-function: cubic-bezier(0.15, 0.3, 0.1, 1);
  2102. }
  2103. .cubic-bezier.animate {
  2104. -webkit-transition-timing-function: cubic-bezier(0.5, 0.1, 0.2, 1);
  2105. -moz-transition-timing-function: cubic-bezier(0.5, 0.1, 0.2, 1);
  2106. -o-transition-timing-function: cubic-bezier(0.5, 0.1, 0.2, 1);
  2107. transition-timing-function: cubic-bezier(0.5, 0.1, 0.2, 1);
  2108. }
  2109. #dapp-form-helper-iframe {
  2110. display: none;
  2111. }
  2112. /* PROGRESSBAR */
  2113. progress {
  2114. -webkit-appearance: none;
  2115. appearance: none;
  2116. height: 9.2px;
  2117. margin: 4.6px;
  2118. color: #0e73b8;
  2119. }
  2120. progress::-webkit-progress-bar {
  2121. background-color: rgba(245, 244, 242, 0.9);
  2122. border-radius: 2px;
  2123. box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.2);
  2124. }
  2125. progress::-moz-progress-bar {
  2126. background-color: rgba(245, 244, 242, 0.9);
  2127. border-radius: 2px;
  2128. box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.2);
  2129. }
  2130. progress::progress-bar {
  2131. background-color: rgba(245, 244, 242, 0.9);
  2132. border-radius: 2px;
  2133. box-shadow: inset 0 1px 4px rgba(0, 0, 0, 0.2);
  2134. }
  2135. progress::-webkit-progress-value {
  2136. background-color: #0e73b8;
  2137. opacity: 0.8;
  2138. border-radius: 2px;
  2139. }
  2140. progress::-moz-progress-value {
  2141. background-color: #0e73b8;
  2142. opacity: 0.8;
  2143. border-radius: 2px;
  2144. }
  2145. progress::progress-value {
  2146. background-color: #0e73b8;
  2147. opacity: 0.8;
  2148. border-radius: 2px;
  2149. }
  2150. .dapp-progress {
  2151. position: relative;
  2152. width: 100%;
  2153. height: 18.4px;
  2154. border-bottom: 1px solid #0e73b8;
  2155. }
  2156. .dapp-progress > span {
  2157. display: block;
  2158. position: absolute;
  2159. top: 0;
  2160. bottom: 0;
  2161. left: 0;
  2162. right: 0;
  2163. line-height: 18.4px;
  2164. text-align: center;
  2165. font-size: 0.7em;
  2166. }
  2167. .dapp-progress .dapp-bar {
  2168. height: 100%;
  2169. background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB3aWR0aD0iMTAwJSIgaGVpZ2h0PSIxMDAlIiB2aWV3Qm94PSIwIDAgMSAxIiBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJub25lIj48bGluZWFyR3JhZGllbnQgaWQ9Imxlc3NoYXQtZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMTAwJSIgeDI9IjAlIiB5Mj0iMCUiPjxzdG9wIG9mZnNldD0iMCUiIHN0b3AtY29sb3I9IiMwZTczYjgiIHN0b3Atb3BhY2l0eT0iMSIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzNjYTdmMCIgc3RvcC1vcGFjaXR5PSIxIi8+PC9saW5lYXJHcmFkaWVudD48cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2xlc3NoYXQtZ2VuZXJhdGVkKSIgLz48L3N2Zz4=);
  2170. background-image: -webkit-linear-gradient(bottom, #0e73b8 0%, #3ca7f0 100%);
  2171. background-image: -moz-linear-gradient(bottom, #0e73b8 0%, #3ca7f0 100%);
  2172. background-image: -o-linear-gradient(bottom, #0e73b8 0%, #3ca7f0 100%);
  2173. background-image: linear-gradient(to top, #0e73b8 0%, #3ca7f0 100%);
  2174. -webkit-transition: width 10400ms linear;
  2175. -moz-transition: width 10400ms linear;
  2176. -o-transition: width 10400ms linear;
  2177. transition: width 10400ms linear;
  2178. }
  2179. .dapp-message {
  2180. position: relative;
  2181. max-width: 512px;
  2182. margin: 48px 0;
  2183. font-size: 1.5em;
  2184. font-weight: 100;
  2185. line-height: 27pt;
  2186. }
  2187. .dapp-count {
  2188. display: -webkit-box;
  2189. display: -moz-box;
  2190. display: -webkit-flex;
  2191. display: -ms-flexbox;
  2192. display: flex;
  2193. -webkit-box-align: center;
  2194. -moz-box-align: center;
  2195. -webkit-align-items: center;
  2196. -ms-flex-align: center;
  2197. align-items: center;
  2198. position: absolute;
  2199. top: 0;
  2200. bottom: 0;
  2201. right: 0;
  2202. padding: 0 8px;
  2203. color: #FAFAFA;
  2204. font-weight: 100;
  2205. zoom: 1;
  2206. filter: alpha(opacity=70);
  2207. -webkit-opacity: 0.7;
  2208. -moz-opacity: 0.7;
  2209. opacity: 0.7;
  2210. -webkit-transition: opacity 400ms;
  2211. -moz-transition: opacity 400ms;
  2212. -o-transition: opacity 400ms;
  2213. transition: opacity 400ms;
  2214. }
  2215. .dapp-count.animate {
  2216. zoom: 1;
  2217. filter: alpha(opacity=0);
  2218. -webkit-opacity: 0;
  2219. -moz-opacity: 0;
  2220. opacity: 0;
  2221. }
  2222. .active .dapp-count {
  2223. background-color: #f5f4f2;
  2224. color: #9c9090;
  2225. }
  2226. .dapp-url-bar {
  2227. display: block;
  2228. text-align: center;
  2229. width: 100%;
  2230. -webkit-background-clip: padding-box;
  2231. -moz-background-clip: padding;
  2232. background-clip: padding-box;
  2233. -webkit-border-radius: 8px;
  2234. -moz-border-radius: 8px;
  2235. border-radius: 8px;
  2236. }
  2237. .dapp-account-list {
  2238. list-style-type: none;
  2239. overflow: auto;
  2240. padding-left: 0;
  2241. padding: 0;
  2242. margin: 0;
  2243. list-style: none;
  2244. }
  2245. .dapp-account-list li {
  2246. display: block;
  2247. padding: 0;
  2248. margin: 0;
  2249. }
  2250. .dapp-account-list li {
  2251. padding: 4.6px 0;
  2252. padding-left: 48px;
  2253. min-height: 46px;
  2254. position: relative;
  2255. overflow: hidden;
  2256. border-bottom: solid 1px #FAFAFA;
  2257. background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB3aWR0aD0iMTAwJSIgaGVpZ2h0PSIxMDAlIiB2aWV3Qm94PSIwIDAgMSAxIiBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJub25lIj48bGluZWFyR3JhZGllbnQgaWQ9Imxlc3NoYXQtZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMTAwJSIgeDI9IjAlIiB5Mj0iMCUiPjxzdG9wIG9mZnNldD0iMCUiIHN0b3AtY29sb3I9InJnYigwLDAsMCkiIHN0b3Atb3BhY2l0eT0iMCIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2Y1ZjRmMiIgc3RvcC1vcGFjaXR5PSIxIi8+PC9saW5lYXJHcmFkaWVudD48cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2xlc3NoYXQtZ2VuZXJhdGVkKSIgLz48L3N2Zz4=);
  2258. background-image: -webkit-linear-gradient(bottom, transparent 0%, #f5f4f2 100%);
  2259. background-image: -moz-linear-gradient(bottom, transparent 0%, #f5f4f2 100%);
  2260. background-image: -o-linear-gradient(bottom, transparent 0%, #f5f4f2 100%);
  2261. background-image: linear-gradient(to top, transparent 0%, #f5f4f2 100%);
  2262. font-family: 'Source Sans Pro', 'Helvetica Neue', Helvetica, Arial, Sans;
  2263. }
  2264. .dapp-account-list li.selected,
  2265. .dapp-account-list li button.selected {
  2266. background: #02A8F3;
  2267. min-height: 36.8px;
  2268. }
  2269. .dapp-account-list li.selected:hover,
  2270. .dapp-account-list li button.selected:hover,
  2271. .dapp-account-list li.selected:focus,
  2272. .dapp-account-list li button.selected:focus {
  2273. background: #02A8F3;
  2274. }
  2275. .dapp-account-list li.selected h3,
  2276. .dapp-account-list li button.selected h3,
  2277. .dapp-account-list li.selected span,
  2278. .dapp-account-list li button.selected span {
  2279. color: #FAFAFA;
  2280. text-shadow: rgba(0, 0, 0, 0.2) 0 -1px 0;
  2281. }
  2282. .dapp-account-list li.selected figure,
  2283. .dapp-account-list li button.selected figure {
  2284. position: absolute;
  2285. color: #FAFAFA;
  2286. right: 0;
  2287. top: 0;
  2288. font-size: 160%;
  2289. z-index: 10;
  2290. bottom: 0;
  2291. text-align: center;
  2292. padding-top: 4px;
  2293. padding: 9px 10px;
  2294. background: linear-gradient(to right, transparent, #02A8F3 50%);
  2295. }
  2296. .dapp-account-list li button {
  2297. position: relative;
  2298. display: block;
  2299. display: flex;
  2300. flex-direction: column;
  2301. justify-content: center;
  2302. padding: 4.6px 0;
  2303. padding-left: 48px;
  2304. margin: -4.6px 0;
  2305. margin-left: -48px;
  2306. width: 100%;
  2307. height: 100%;
  2308. min-height: 36.8px;
  2309. font-family: 'Source Sans Pro', 'Helvetica Neue', Helvetica, Arial, Sans;
  2310. text-align: left;
  2311. }
  2312. .dapp-account-list li button:hover,
  2313. .dapp-account-list li button:focus {
  2314. background: #FAFAFA;
  2315. border: 0;
  2316. }
  2317. .dapp-account-list li .dapp-identicon {
  2318. position: absolute;
  2319. top: 6.13333333px;
  2320. left: 8px;
  2321. }
  2322. .dapp-account-list li h3 {
  2323. display: inline-block;
  2324. -o-text-overflow: ellipsis;
  2325. text-overflow: ellipsis;
  2326. overflow: hidden;
  2327. white-space: nowrap;
  2328. max-width: 100%;
  2329. display: block;
  2330. padding: 0;
  2331. margin: 0;
  2332. color: #02A8F3;
  2333. text-transform: none;
  2334. font-weight: 400;
  2335. font-size: 90%;
  2336. text-shadow: #fff 0 1px 0;
  2337. }
  2338. .dapp-account-list li h3 + span {
  2339. white-space: nowrap;
  2340. overflow: hidden;
  2341. text-overflow: ellipsis;
  2342. font-size: 75%;
  2343. opacity: 0.5;
  2344. color: #827a7a;
  2345. }
  2346. a,
  2347. a:visited,
  2348. button {
  2349. text-decoration: none;
  2350. color: #02A8F3;
  2351. outline: 0;
  2352. font-weight: 400;
  2353. }
  2354. a:hover,
  2355. a:visited:hover,
  2356. button:hover,
  2357. a:focus,
  2358. a:visited:focus,
  2359. button:focus {
  2360. outline: 0;
  2361. }
  2362. a:focus,
  2363. a:visited:focus,
  2364. button:focus {
  2365. border-bottom: 1px dotted #02A8F3;
  2366. }
  2367. a:active,
  2368. a:visited:active,
  2369. button:active {
  2370. -webkit-transform: scale(0.95);
  2371. -moz-transform: scale(0.95);
  2372. -o-transform: scale(0.95);
  2373. -ms-transform: scale(0.95);
  2374. transform: scale(0.95);
  2375. border-bottom: 0;
  2376. }
  2377. button {
  2378. background: none;
  2379. border: 0;
  2380. padding: 0;
  2381. margin: 0;
  2382. -webkit-box-sizing: content-box;
  2383. -moz-box-sizing: content-box;
  2384. box-sizing: content-box;
  2385. font-weight: inherit;
  2386. }
  2387. button:hover,
  2388. button:focus {
  2389. outline: 0;
  2390. }
  2391. hr {
  2392. border: 0;
  2393. height: 0;
  2394. margin: 32px 0;
  2395. background-color: transparent;
  2396. border-bottom: 1px solid #CCC6C6;
  2397. }
  2398. h1 {
  2399. margin: 16px 0;
  2400. margin-top: 48px;
  2401. font-weight: 100;
  2402. font-size: 2.2em;
  2403. color: #827a7a;
  2404. }
  2405. h1 span {
  2406. font-weight: 500;
  2407. }
  2408. h1 + h2 {
  2409. margin-top: 0;
  2410. }
  2411. h1 strong {
  2412. font-weight: 400;
  2413. }
  2414. h2 {
  2415. display: inline-block;
  2416. padding-bottom: 1px;
  2417. font-weight: 500;
  2418. font-size: 1.2em;
  2419. text-transform: uppercase;
  2420. color: #827a7a;
  2421. font-weight: 600;
  2422. }
  2423. h2 + table {
  2424. margin-top: 0;
  2425. }
  2426. h3 {
  2427. margin: 16px 0;
  2428. padding: 0;
  2429. color: rgba(130, 122, 122, 0.7);
  2430. text-transform: uppercase;
  2431. font-weight: 500;
  2432. font-size: 1em;
  2433. }
  2434. h4 {
  2435. margin: 16px 0;
  2436. padding: 0;
  2437. color: rgba(130, 122, 122, 0.7);
  2438. font-weight: 500;
  2439. font-size: 1em;
  2440. }
  2441. pre,
  2442. code {
  2443. /* overflow-y: auto; */
  2444. /* overflow-x: hidden; */
  2445. -webkit-overflow-scrolling: touch;
  2446. word-break: break-word;
  2447. padding: 6.13333333px;
  2448. background-color: #f5f4f2;
  2449. font-size: 0.9em;
  2450. text-align: left;
  2451. line-height: 2
  2452. }
  2453. table {
  2454. width: 100%;
  2455. margin: 16px 0;
  2456. }
  2457. table.dapp-zebra tbody tr:nth-child(odd) {
  2458. background-color: rgba(204, 198, 198, 0.3);
  2459. }
  2460. table.dapp-zebra thead + tbody tr:nth-child(even) {
  2461. background-color: rgba(204, 198, 198, 0.3);
  2462. }
  2463. table + h2,
  2464. table + h3 {
  2465. margin-top: 32px;
  2466. }
  2467. table td {
  2468. padding: 12.26666667px 16px;
  2469. }
  2470. table td h2 {
  2471. margin: 0;
  2472. padding: 0;
  2473. background-color: transparent;
  2474. color: #827a7a;
  2475. text-transform: none;
  2476. font-style: normal;
  2477. }
  2478. table td p {
  2479. padding-top: 8px;
  2480. margin: 0;
  2481. font-size: 0.9em;
  2482. }
  2483. table thead {
  2484. background-color: #827a7a;
  2485. color: #FAFAFA;
  2486. text-transform: uppercase;
  2487. }
  2488. table tbody tr td span {
  2489. display: inline-block;
  2490. -o-text-overflow: ellipsis;
  2491. text-overflow: ellipsis;
  2492. overflow: hidden;
  2493. white-space: nowrap;
  2494. max-width: 100%;
  2495. }
  2496. .dapp-input {
  2497. border: 0;
  2498. border-bottom: solid 2px #CCC6C6;
  2499. background-color: #f5f4f2;
  2500. color: #02A8F3;
  2501. }
  2502. .dapp-input::-webkit-input-placeholder {
  2503. color: #CCC6C6;
  2504. }
  2505. .dapp-input:-moz-placeholder {
  2506. color: #CCC6C6;
  2507. }
  2508. .dapp-input::-moz-placeholder {
  2509. color: #CCC6C6;
  2510. }
  2511. .dapp-input:-ms-input-placeholder {
  2512. color: #CCC6C6;
  2513. }
  2514. .dapp-input:disabled {
  2515. color: #695e5e;
  2516. }
  2517. .dapp-input.dapp-tiny {
  2518. font-size: 0.6em;
  2519. border-bottom-width: 1px;
  2520. }
  2521. .dapp-input.dapp-small {
  2522. font-size: 0.8em;
  2523. }
  2524. .dapp-input.dapp-large {
  2525. font-size: 1.5em;
  2526. }
  2527. .dapp-input.dapp-error {
  2528. color: #C20E25;
  2529. background: rgba(194, 14, 37, 0.1);
  2530. border-color: rgba(194, 14, 37, 0.15);
  2531. }
  2532. .dapp-address-input input {
  2533. border: 0;
  2534. border-bottom: solid 2px #CCC6C6;
  2535. background-color: #f5f4f2;
  2536. color: #02A8F3;
  2537. }
  2538. .dapp-address-input input::-webkit-input-placeholder {
  2539. color: #CCC6C6;
  2540. }
  2541. .dapp-address-input input:-moz-placeholder {
  2542. color: #CCC6C6;
  2543. }
  2544. .dapp-address-input input::-moz-placeholder {
  2545. color: #CCC6C6;
  2546. }
  2547. .dapp-address-input input:-ms-input-placeholder {
  2548. color: #CCC6C6;
  2549. }
  2550. .dapp-address-input input:disabled {
  2551. color: #695e5e;
  2552. }
  2553. .dapp-address-input input.dapp-tiny {
  2554. font-size: 0.6em;
  2555. border-bottom-width: 1px;
  2556. }
  2557. .dapp-address-input input.dapp-small {
  2558. font-size: 0.8em;
  2559. }
  2560. .dapp-address-input input.dapp-large {
  2561. font-size: 1.5em;
  2562. }
  2563. .dapp-address-input input.dapp-error {
  2564. color: #C20E25;
  2565. background: rgba(194, 14, 37, 0.1);
  2566. border-color: rgba(194, 14, 37, 0.15);
  2567. }
  2568. input,
  2569. select,
  2570. textarea {
  2571. border: 0;
  2572. border-bottom: solid 2px #CCC6C6;
  2573. background-color: #f5f4f2;
  2574. color: #02A8F3;
  2575. display: inline-block;
  2576. width: 300px;
  2577. max-width: 100%;
  2578. margin-top: 18.4px;
  2579. padding: 6.13333333px 16px;
  2580. padding-bottom: 4.08888889px;
  2581. -webkit-box-sizing: border-box;
  2582. -moz-box-sizing: border-box;
  2583. box-sizing: border-box;
  2584. -webkit-background-clip: padding-box;
  2585. -moz-background-clip: padding;
  2586. background-clip: padding-box;
  2587. -webkit-border-radius: 0;
  2588. -moz-border-radius: 0;
  2589. border-radius: 0;
  2590. font-size: 1em;
  2591. font-weight: 300;
  2592. }
  2593. input::-webkit-input-placeholder,
  2594. select::-webkit-input-placeholder,
  2595. textarea::-webkit-input-placeholder {
  2596. color: #CCC6C6;
  2597. }
  2598. input:-moz-placeholder,
  2599. select:-moz-placeholder,
  2600. textarea:-moz-placeholder {
  2601. color: #CCC6C6;
  2602. }
  2603. input::-moz-placeholder,
  2604. select::-moz-placeholder,
  2605. textarea::-moz-placeholder {
  2606. color: #CCC6C6;
  2607. }
  2608. input:-ms-input-placeholder,
  2609. select:-ms-input-placeholder,
  2610. textarea:-ms-input-placeholder {
  2611. color: #CCC6C6;
  2612. }
  2613. input:disabled,
  2614. select:disabled,
  2615. textarea:disabled {
  2616. color: #695e5e;
  2617. }
  2618. input.dapp-tiny,
  2619. select.dapp-tiny,
  2620. textarea.dapp-tiny {
  2621. font-size: 0.6em;
  2622. border-bottom-width: 1px;
  2623. }
  2624. input.dapp-small,
  2625. select.dapp-small,
  2626. textarea.dapp-small {
  2627. font-size: 0.8em;
  2628. }
  2629. input.dapp-large,
  2630. select.dapp-large,
  2631. textarea.dapp-large {
  2632. font-size: 1.5em;
  2633. }
  2634. input.dapp-error,
  2635. select.dapp-error,
  2636. textarea.dapp-error {
  2637. color: #C20E25;
  2638. background: rgba(194, 14, 37, 0.1);
  2639. border-color: rgba(194, 14, 37, 0.15);
  2640. }
  2641. input:focus,
  2642. select:focus,
  2643. textarea:focus {
  2644. outline: 0;
  2645. border-color: #02A8F3;
  2646. }
  2647. h1 + input,
  2648. h1 + select,
  2649. h1 + textarea,
  2650. h2 + input,
  2651. h2 + select,
  2652. h2 + textarea,
  2653. h3 + input,
  2654. h3 + select,
  2655. h3 + textarea {
  2656. margin-top: 0;
  2657. }
  2658. :disabled {
  2659. color: #695e5e;
  2660. }
  2661. input[type="checkbox"],
  2662. input[type="radio"] {
  2663. display: inline-block;
  2664. position: relative;
  2665. margin: 0;
  2666. outline: none !important;
  2667. -webkit-appearance: none;
  2668. width: auto;
  2669. width: 24px;
  2670. height: 24px;
  2671. }
  2672. input[type="checkbox"]::before,
  2673. input[type="radio"]::before {
  2674. content: '';
  2675. position: relative;
  2676. top: 0;
  2677. left: 0;
  2678. display: block;
  2679. background: #f5f4f2;
  2680. border: 1px solid #f5f4f2;
  2681. -webkit-box-shadow: inset 0 0 2px rgba(0, 0, 0, 0.2);
  2682. -moz-box-shadow: inset 0 0 2px rgba(0, 0, 0, 0.2);
  2683. box-shadow: inset 0 0 2px rgba(0, 0, 0, 0.2);
  2684. width: 24px;
  2685. height: 24px;
  2686. }
  2687. input[type="checkbox"]:focus::before,
  2688. input[type="radio"]:focus::before {
  2689. border-color: rgba(102, 145, 194, 0.4);
  2690. }
  2691. input[type="checkbox"]:disabled::before,
  2692. input[type="radio"]:disabled::before {
  2693. cursor: not-allowed;
  2694. background-color: rgba(245, 244, 242, 0.8);
  2695. border-color: #f5f4f2;
  2696. }
  2697. input[type="checkbox"]:after,
  2698. input[type="radio"]:after {
  2699. content: '';
  2700. display: inline-block;
  2701. position: absolute;
  2702. top: 6px;
  2703. left: 6px;
  2704. background: #02A8F3;
  2705. -webkit-box-shadow: 0 0px 1px rgba(0, 0, 0, 0.3);
  2706. -moz-box-shadow: 0 0px 1px rgba(0, 0, 0, 0.3);
  2707. box-shadow: 0 0px 1px rgba(0, 0, 0, 0.3);
  2708. width: 12px;
  2709. height: 12px;
  2710. -webkit-transition: -webkit-transform 400ms;
  2711. -moz-transition: -moz-transform 400ms;
  2712. -o-transition: -o-transform 400ms;
  2713. transition: -webkit-transform 400ms,-moz-transform 400ms,-o-transform 400ms,transform 400ms;
  2714. -webkit-transform: scale(0);
  2715. -moz-transform: scale(0);
  2716. -o-transform: scale(0);
  2717. -ms-transform: scale(0);
  2718. transform: scale(0);
  2719. }
  2720. input[type="checkbox"]:checked:after,
  2721. input[type="radio"]:checked:after {
  2722. -webkit-transform: scale(1);
  2723. -moz-transform: scale(1);
  2724. -o-transform: scale(1);
  2725. -ms-transform: scale(1);
  2726. transform: scale(1);
  2727. }
  2728. input[type="checkbox"]:disabled:after,
  2729. input[type="radio"]:disabled:after {
  2730. background: rgba(102, 145, 194, 0.4);
  2731. }
  2732. input[type="radio"] {
  2733. -webkit-background-clip: padding-box;
  2734. -moz-background-clip: padding;
  2735. background-clip: padding-box;
  2736. -webkit-border-radius: 50%;
  2737. -moz-border-radius: 50%;
  2738. border-radius: 50%;
  2739. }
  2740. input[type="radio"]:before {
  2741. -webkit-background-clip: padding-box;
  2742. -moz-background-clip: padding;
  2743. background-clip: padding-box;
  2744. -webkit-border-radius: 50%;
  2745. -moz-border-radius: 50%;
  2746. border-radius: 50%;
  2747. }
  2748. input[type="radio"]:after {
  2749. -webkit-background-clip: padding-box;
  2750. -moz-background-clip: padding;
  2751. background-clip: padding-box;
  2752. -webkit-border-radius: 50%;
  2753. -moz-border-radius: 50%;
  2754. border-radius: 50%;
  2755. }
  2756. input[type="range"] {
  2757. -webkit-appearance: none;
  2758. padding: 0;
  2759. border: 0;
  2760. background-color: transparent;
  2761. }
  2762. input[type="range"]::-webkit-slider-runnable-track {
  2763. height: 5px;
  2764. background-color: #CCC6C6;
  2765. border: none;
  2766. -webkit-background-clip: padding-box;
  2767. -moz-background-clip: padding;
  2768. background-clip: padding-box;
  2769. -webkit-border-radius: 3px;
  2770. -moz-border-radius: 3px;
  2771. border-radius: 3px;
  2772. }
  2773. input[type="range"]::-webkit-slider-thumb {
  2774. -webkit-appearance: none;
  2775. border: none;
  2776. height: 16px;
  2777. width: 16px;
  2778. border-radius: 50%;
  2779. background-color: #695e5e;
  2780. margin-top: -6px;
  2781. }
  2782. input[type="range"]:focus {
  2783. outline: none;
  2784. }
  2785. input[type="range"]:focus::-webkit-slider-thumb {
  2786. background-color: #02A8F3;
  2787. }
  2788. input[type="range"]::-moz-range-track {
  2789. height: 5px;
  2790. background-color: #CCC6C6;
  2791. border: none;
  2792. -webkit-background-clip: padding-box;
  2793. -moz-background-clip: padding;
  2794. background-clip: padding-box;
  2795. -webkit-border-radius: 3px;
  2796. -moz-border-radius: 3px;
  2797. border-radius: 3px;
  2798. }
  2799. input[type="range"]::-moz-range-thumb {
  2800. -webkit-appearance: none;
  2801. border: none;
  2802. height: 16px;
  2803. width: 16px;
  2804. border-radius: 50%;
  2805. background-color: #695e5e;
  2806. margin-top: -4px;
  2807. }
  2808. input[type="range"]:focus {
  2809. outline: none;
  2810. }
  2811. input[type="range"]:focus::-moz-range-thumb {
  2812. background-color: #02A8F3;
  2813. }
  2814. label {
  2815. font-weight: 300;
  2816. }
  2817. fieldset {
  2818. border: 0;
  2819. padding: 0;
  2820. margin: 16px;
  2821. }
  2822. select {
  2823. height: 45px;
  2824. }
  2825. body {
  2826. display: -webkit-box;
  2827. display: -moz-box;
  2828. display: -webkit-flex;
  2829. display: -ms-flexbox;
  2830. display: flex;
  2831. -webkit-box-direction: normal;
  2832. -moz-box-direction: normal;
  2833. -webkit-box-orient: vertical;
  2834. -moz-box-orient: vertical;
  2835. -webkit-flex-direction: column;
  2836. -ms-flex-direction: column;
  2837. flex-direction: column;
  2838. min-height: 100vh;
  2839. padding: 0;
  2840. margin: 0;
  2841. background-color: #FAFAFA;
  2842. font: 100 16px 'Source Sans Pro', 'Helvetica Neue', arial, sans-serif;
  2843. color: #111;
  2844. padding: 64px 92px;
  2845. }
  2846. body.disable-scroll {
  2847. overflow: hidden;
  2848. }
  2849. body.blur .dapp-flex-content,
  2850. body.blur .dapp-footer,
  2851. body.blur .dapp-header {
  2852. -webkit-filter: blur(4px);
  2853. -moz-filter: blur(4px);
  2854. -ms-filter: blur(4px);
  2855. filter: blur(4px);
  2856. }
  2857. .ethereum-dapp-url-bar-style-transparent .dapp-header {
  2858. padding-top: 73.6px;
  2859. }
  2860. .dapp-grid {
  2861. z-index: 999;
  2862. background: #FFF url('dapp-styles/hex-grid-tile.png');
  2863. background-size: 64px 111px;
  2864. position: absolute;
  2865. min-height: 100%;
  2866. left: 0;
  2867. right: 0;
  2868. opacity: 0.05;
  2869. pointer-events: none;
  2870. }
  2871. .dapp-container {
  2872. display: block;
  2873. position: relative;
  2874. margin: 0 auto;
  2875. max-width: 960px;
  2876. }
  2877. .dapp-header,
  2878. .dapp-aside,
  2879. .dapp-content,
  2880. .dapp-footer {
  2881. position: relative;
  2882. padding: 12.26666667px 32px;
  2883. -webkit-box-sizing: border-box;
  2884. -moz-box-sizing: border-box;
  2885. box-sizing: border-box;
  2886. }
  2887. .dapp-header {
  2888. height: 64px;
  2889. margin-top: -5px;
  2890. padding-top: 17.26666667px;
  2891. -webkit-box-sizing: content-box;
  2892. -moz-box-sizing: content-box;
  2893. box-sizing: content-box;
  2894. background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB3aWR0aD0iMTAwJSIgaGVpZ2h0PSIxMDAlIiB2aWV3Qm94PSIwIDAgMSAxIiBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJub25lIj48bGluZWFyR3JhZGllbnQgaWQ9Imxlc3NoYXQtZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPjxzdG9wIG9mZnNldD0iMCUiIHN0b3AtY29sb3I9IiNmZmZmZmYiIHN0b3Atb3BhY2l0eT0iMSIvPjxzdG9wIG9mZnNldD0iOTAlIiBzdG9wLWNvbG9yPSIjZTRkZWRlIiBzdG9wLW9wYWNpdHk9IjEiLz48L2xpbmVhckdyYWRpZW50PjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxIiBoZWlnaHQ9IjEiIGZpbGw9InVybCgjbGVzc2hhdC1nZW5lcmF0ZWQpIiAvPjwvc3ZnPg==);
  2895. background-image: -webkit-linear-gradient(top, #ffffff 0, #e4dede 90%);
  2896. background-image: -moz-linear-gradient(top, #ffffff 0, #e4dede 90%);
  2897. background-image: -o-linear-gradient(top, #ffffff 0, #e4dede 90%);
  2898. background-image: linear-gradient(to bottom, #ffffff 0, #e4dede 90%);
  2899. }
  2900. .dapp-header.dapp-small {
  2901. height: 18.4px;
  2902. }
  2903. .dapp-header.dapp-small nav li a i {
  2904. zoom: 1;
  2905. filter: alpha(opacity=0);
  2906. -webkit-opacity: 0;
  2907. -moz-opacity: 0;
  2908. opacity: 0;
  2909. }
  2910. .dapp-header nav {
  2911. position: absolute;
  2912. bottom: 0;
  2913. }
  2914. .dapp-header nav ul {
  2915. padding: 0;
  2916. margin: 0;
  2917. list-style: none;
  2918. }
  2919. .dapp-header nav ul li {
  2920. padding: 0;
  2921. margin: 0;
  2922. }
  2923. .dapp-header nav ul a {
  2924. display: inline-block;
  2925. padding: 6.13333333px 32px;
  2926. text-align: center;
  2927. border-bottom: 5px solid transparent;
  2928. color: #4677af;
  2929. }
  2930. .dapp-header nav ul a:focus {
  2931. border-color: #FAFAFA;
  2932. }
  2933. .dapp-header nav ul a.active {
  2934. -webkit-transform-origin: 50% 100%;
  2935. -moz-transform-origin: 50% 100%;
  2936. -o-transform-origin: 50% 100%;
  2937. -ms-transform-origin: 50% 100%;
  2938. transform-origin: 50% 100%;
  2939. color: #b7a6a6;
  2940. border-bottom: 5px solid #FAFAFA;
  2941. }
  2942. .dapp-header nav ul a:active {
  2943. border-bottom: transparent;
  2944. }
  2945. .dapp-header nav ul a i {
  2946. font-size: 1.5em;
  2947. -webkit-transition: opacity 200ms;
  2948. -moz-transition: opacity 200ms;
  2949. -o-transition: opacity 200ms;
  2950. transition: opacity 200ms;
  2951. }
  2952. .dapp-header nav ul a span {
  2953. display: block;
  2954. text-transform: uppercase;
  2955. font-weight: 400;
  2956. }
  2957. .dapp-footer {
  2958. height: 96px;
  2959. background-color: #111;
  2960. }
  2961. .dapp-flex-content {
  2962. display: -webkit-box;
  2963. display: -moz-box;
  2964. display: -webkit-flex;
  2965. display: -ms-flexbox;
  2966. display: flex;
  2967. -webkit-box-flex: 1;
  2968. -moz-box-flex: 1;
  2969. -webkit-flex: 1;
  2970. -ms-flex: 1;
  2971. flex: 1;
  2972. }
  2973. .dapp-content {
  2974. -webkit-box-flex: 1;
  2975. -moz-box-flex: 1;
  2976. -webkit-flex: 1;
  2977. -ms-flex: 1;
  2978. flex: 1;
  2979. background: #FAFAFA;
  2980. }
  2981. .dapp-content.dapp-has-header {
  2982. padding-top: 156.8px;
  2983. }
  2984. .dapp-content .dapp-content-header {
  2985. position: fixed;
  2986. top: 0;
  2987. width: 80%;
  2988. min-height: 36.8px;
  2989. padding: 12.26666667px 16px;
  2990. margin-left: -32px;
  2991. background: rgba(245, 244, 242, 0.8);
  2992. z-index: 10;
  2993. line-height: 36.8px;
  2994. -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3);
  2995. -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3);
  2996. box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3);
  2997. -webkit-box-sizing: border-box;
  2998. -moz-box-sizing: border-box;
  2999. box-sizing: border-box;
  3000. }
  3001. .dapp-aside {
  3002. -webkit-box-flex: 0;
  3003. -moz-box-flex: 0;
  3004. -webkit-flex: 0 0 224px;
  3005. -ms-flex: 0 0 224px;
  3006. flex: 0 0 224px;
  3007. padding-right: 0;
  3008. background-image: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/PjxzdmcgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB3aWR0aD0iMTAwJSIgaGVpZ2h0PSIxMDAlIiB2aWV3Qm94PSIwIDAgMSAxIiBwcmVzZXJ2ZUFzcGVjdFJhdGlvPSJub25lIj48bGluZWFyR3JhZGllbnQgaWQ9Imxlc3NoYXQtZ2VuZXJhdGVkIiBncmFkaWVudFVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgeDE9IjAlIiB5MT0iMCUiIHgyPSIwJSIgeTI9IjEwMCUiPjxzdG9wIG9mZnNldD0iMCUiIHN0b3AtY29sb3I9IiNmMGVlZWUiIHN0b3Atb3BhY2l0eT0iMSIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI0NDQzZDNiIgc3RvcC1vcGFjaXR5PSIxIi8+PC9saW5lYXJHcmFkaWVudD48cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMSIgaGVpZ2h0PSIxIiBmaWxsPSJ1cmwoI2xlc3NoYXQtZ2VuZXJhdGVkKSIgLz48L3N2Zz4=);
  3009. background-image: -webkit-linear-gradient(top, #f0eeee 0, #CCC6C6 100px);
  3010. background-image: -moz-linear-gradient(top, #f0eeee 0, #CCC6C6 100px);
  3011. background-image: -o-linear-gradient(top, #f0eeee 0, #CCC6C6 100px);
  3012. background-image: linear-gradient(to bottom, #f0eeee 0, #CCC6C6 100px);
  3013. -webkit-transition: flex 400ms;
  3014. -moz-transition: flex 400ms;
  3015. -o-transition: flex 400ms;
  3016. transition: flex 400ms;
  3017. }
  3018. .dapp-aside nav ul {
  3019. padding: 0;
  3020. margin: 0;
  3021. list-style: none;
  3022. padding-top: 18.4px;
  3023. }
  3024. .dapp-aside nav ul li {
  3025. display: block;
  3026. padding: 0;
  3027. margin: 0;
  3028. }
  3029. .dapp-aside nav ul li a,
  3030. .dapp-aside nav ul li a:visited,
  3031. .dapp-aside nav ul li button {
  3032. display: -webkit-box;
  3033. display: -moz-box;
  3034. display: -webkit-flex;
  3035. display: -ms-flexbox;
  3036. display: flex;
  3037. -webkit-box-align: center;
  3038. -moz-box-align: center;
  3039. -webkit-align-items: center;
  3040. -ms-flex-align: center;
  3041. align-items: center;
  3042. position: relative;
  3043. min-height: 73.6px;
  3044. max-height: 92px;
  3045. padding: 12.26666667px 32px;
  3046. padding-left: 10.66666667px;
  3047. overflow: hidden;
  3048. border-top: #b9b0b0 solid 1px;
  3049. -webkit-background-clip: padding-box;
  3050. -moz-background-clip: padding;
  3051. background-clip: padding-box;
  3052. -webkit-border-radius: 3px 0 0 3px;
  3053. -moz-border-radius: 3px 0 0 3px;
  3054. border-radius: 3px 0 0 3px;
  3055. -webkit-box-sizing: border-box;
  3056. -moz-box-sizing: border-box;
  3057. box-sizing: border-box;
  3058. color: #111;
  3059. font-weight: 300;
  3060. line-height: 20px;
  3061. }
  3062. .dapp-aside nav ul li a:active,
  3063. .dapp-aside nav ul li a:visited:active,
  3064. .dapp-aside nav ul li button:active {
  3065. -webkit-transform-origin: 100% 50%;
  3066. -moz-transform-origin: 100% 50%;
  3067. -o-transform-origin: 100% 50%;
  3068. -ms-transform-origin: 100% 50%;
  3069. transform-origin: 100% 50%;
  3070. -webkit-transform: scale(0.98);
  3071. -moz-transform: scale(0.98);
  3072. -o-transform: scale(0.98);
  3073. -ms-transform: scale(0.98);
  3074. transform: scale(0.98);
  3075. }
  3076. .dapp-aside nav ul li a > i,
  3077. .dapp-aside nav ul li a:visited > i,
  3078. .dapp-aside nav ul li button > i {
  3079. margin-right: 4px;
  3080. }
  3081. .dapp-aside nav ul li a > span,
  3082. .dapp-aside nav ul li a:visited > span,
  3083. .dapp-aside nav ul li button > span {
  3084. max-width: 115px;
  3085. display: -webkit-box;
  3086. -webkit-line-clamp: 3;
  3087. -webkit-box-orient: vertical;
  3088. overflow: hidden;
  3089. text-overflow: ellipsis;
  3090. }
  3091. .dapp-aside nav ul li .dapp-main-button {
  3092. position: relative;
  3093. width: 100%;
  3094. margin-bottom: 73.6px;
  3095. -webkit-background-clip: padding-box;
  3096. -moz-background-clip: padding;
  3097. background-clip: padding-box;
  3098. -webkit-border-radius: 3px 0 0 3px;
  3099. -moz-border-radius: 3px 0 0 3px;
  3100. border-radius: 3px 0 0 3px;
  3101. background: #665F5F;
  3102. color: #FAFAFA;
  3103. border-top: none;
  3104. }
  3105. .dapp-aside nav ul li .dapp-main-button i {
  3106. position: absolute;
  3107. right: 8px;
  3108. top: 27.6px;
  3109. }
  3110. .dapp-aside nav ul li.active a {
  3111. background: #FAFAFA;
  3112. border-top: none;
  3113. color: #111;
  3114. font-weight: 500;
  3115. }
  3116. .dapp-aside nav ul li:first-child a,
  3117. .dapp-aside nav ul li.active + li > a,
  3118. .dapp-aside nav ul li.dapp-main-button + li {
  3119. border-top: 0;
  3120. }
  3121. .dapp-actionbar {
  3122. z-index: 20;
  3123. -webkit-box-flex: 0;
  3124. -moz-box-flex: 0;
  3125. -webkit-flex: 0 0 64px;
  3126. -ms-flex: 0 0 64px;
  3127. flex: 0 0 64px;
  3128. background: #FAFAFA;
  3129. }
  3130. .dapp-actionbar nav ul {
  3131. padding: 0;
  3132. margin: 0;
  3133. list-style: none;
  3134. }
  3135. .dapp-actionbar nav ul li {
  3136. display: block;
  3137. padding: 0;
  3138. margin: 0;
  3139. }
  3140. .dapp-actionbar nav ul li {
  3141. margin: 16px 0;
  3142. color: #02A8F3;
  3143. position: relative;
  3144. overflow: hidden;
  3145. text-align: center;
  3146. -webkit-transition: height 400ms;
  3147. -moz-transition: height 400ms;
  3148. -o-transition: height 400ms;
  3149. transition: height 400ms;
  3150. }
  3151. .dapp-actionbar nav ul li button,
  3152. .dapp-actionbar nav ul li a,
  3153. .dapp-actionbar nav ul li a:visited {
  3154. background: none;
  3155. border: 0;
  3156. padding: 0;
  3157. margin: 0;
  3158. -webkit-box-sizing: content-box;
  3159. -moz-box-sizing: content-box;
  3160. box-sizing: content-box;
  3161. display: inline-block;
  3162. color: #111;
  3163. color: #0e73b8;
  3164. font-size: 0.8em;
  3165. font-weight: 400;
  3166. }
  3167. .dapp-actionbar nav ul li button:hover,
  3168. .dapp-actionbar nav ul li a:hover,
  3169. .dapp-actionbar nav ul li a:visited:hover,
  3170. .dapp-actionbar nav ul li button:focus,
  3171. .dapp-actionbar nav ul li a:focus,
  3172. .dapp-actionbar nav ul li a:visited:focus {
  3173. outline: 0;
  3174. }
  3175. .dapp-actionbar nav ul li button:active,
  3176. .dapp-actionbar nav ul li a:active,
  3177. .dapp-actionbar nav ul li a:visited:active {
  3178. -webkit-transform: scale(0.95);
  3179. -moz-transform: scale(0.95);
  3180. -o-transform: scale(0.95);
  3181. -ms-transform: scale(0.95);
  3182. transform: scale(0.95);
  3183. }
  3184. .dapp-actionbar nav ul li button:hover,
  3185. .dapp-actionbar nav ul li a:hover,
  3186. .dapp-actionbar nav ul li a:visited:hover {
  3187. opacity: 0.9;
  3188. }
  3189. .dapp-actionbar nav ul li button i,
  3190. .dapp-actionbar nav ul li a i,
  3191. .dapp-actionbar nav ul li a:visited i {
  3192. font-size: 2em;
  3193. display: block;
  3194. }
  3195. .dapp-box {
  3196. display: inline-block;
  3197. float: left;
  3198. width: 192px;
  3199. height: 220.8px;
  3200. padding-top: 18.4px;
  3201. padding-left: 16px;
  3202. padding-bottom: 9.2px;
  3203. padding-right: 16px;
  3204. margin-bottom: 9.2px;
  3205. margin-right: 16px;
  3206. background-color: #FAFAFA;
  3207. -webkit-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3);
  3208. -moz-box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3);
  3209. box-shadow: 0 1px 4px rgba(0, 0, 0, 0.3);
  3210. }
  3211. .dapp-box h2 {
  3212. margin: 0;
  3213. padding: 0;
  3214. background-color: transparent;
  3215. color: #827a7a;
  3216. font-family: 'Source Sans Pro', 'Helvetica Neue', Helvetica, Arial, Sans;
  3217. text-transform: none;
  3218. font-size: 1.5em;
  3219. font-weight: 100;
  3220. }
  3221. .dapp-modal-overlay {
  3222. background: rgba(0, 0, 0, 0);
  3223. }
  3224. .dapp-modal-container {
  3225. background: #FAFAFA;
  3226. }
  3227. .dapp-icon-button {
  3228. background: none;
  3229. border: 0;
  3230. padding: 0;
  3231. margin: 0;
  3232. -webkit-box-sizing: content-box;
  3233. -moz-box-sizing: content-box;
  3234. box-sizing: content-box;
  3235. display: inline-block;
  3236. color: #111;
  3237. }
  3238. .dapp-icon-button:hover,
  3239. .dapp-icon-button:focus {
  3240. outline: 0;
  3241. }
  3242. .dapp-icon-button:active {
  3243. -webkit-transform: scale(0.95);
  3244. -moz-transform: scale(0.95);
  3245. -o-transform: scale(0.95);
  3246. -ms-transform: scale(0.95);
  3247. transform: scale(0.95);
  3248. }
  3249. .dapp-icon-button:hover {
  3250. opacity: 0.9;
  3251. }
  3252. .dapp-block-button,
  3253. .dapp-block-button:visited {
  3254. background: none;
  3255. border: 0;
  3256. padding: 0;
  3257. margin: 0;
  3258. -webkit-box-sizing: content-box;
  3259. -moz-box-sizing: content-box;
  3260. box-sizing: content-box;
  3261. height: 36.8px;
  3262. min-width: 100px;
  3263. padding: 4.6px 10.66666667px;
  3264. background: #02A8F3;
  3265. color: #FAFAFA;
  3266. border-bottom: 3px solid #5484bb;
  3267. -webkit-background-clip: padding-box;
  3268. -moz-background-clip: padding;
  3269. background-clip: padding-box;
  3270. -webkit-border-radius: 2px;
  3271. -moz-border-radius: 2px;
  3272. border-radius: 2px;
  3273. display: inline-block;
  3274. -o-text-overflow: ellipsis;
  3275. text-overflow: ellipsis;
  3276. overflow: hidden;
  3277. white-space: nowrap;
  3278. max-width: 100%;
  3279. font-family: 'Source Sans Pro', 'Helvetica Neue', Helvetica, Arial, Sans;
  3280. font-size: 1em;
  3281. font-weight: 400;
  3282. text-transform: uppercase;
  3283. }
  3284. .dapp-block-button:hover,
  3285. .dapp-block-button:visited:hover,
  3286. .dapp-block-button:focus,
  3287. .dapp-block-button:visited:focus {
  3288. outline: 0;
  3289. }
  3290. .dapp-block-button:focus,
  3291. .dapp-block-button:visited:focus {
  3292. border-bottom: 3px solid #5484bb;
  3293. zoom: 1;
  3294. filter: alpha(opacity=80);
  3295. -webkit-opacity: 0.8;
  3296. -moz-opacity: 0.8;
  3297. opacity: 0.8;
  3298. }
  3299. .dapp-block-button:active,
  3300. .dapp-block-button:visited:active {
  3301. border-bottom-width: 3px;
  3302. }
  3303. .dapp-block-button i,
  3304. .dapp-block-button:visited i {
  3305. position: relative;
  3306. top: 2px;
  3307. }
  3308. .dapp-tag-button {
  3309. background: none;
  3310. border: 0;
  3311. padding: 0;
  3312. margin: 0;
  3313. -webkit-box-sizing: content-box;
  3314. -moz-box-sizing: content-box;
  3315. box-sizing: content-box;
  3316. padding: 4.6px 8px;
  3317. background: #CCC6C6;
  3318. color: #111;
  3319. -webkit-background-clip: padding-box;
  3320. -moz-background-clip: padding;
  3321. background-clip: padding-box;
  3322. -webkit-border-radius: 4px;
  3323. -moz-border-radius: 4px;
  3324. border-radius: 4px;
  3325. display: inline-block;
  3326. -o-text-overflow: ellipsis;
  3327. text-overflow: ellipsis;
  3328. overflow: hidden;
  3329. white-space: nowrap;
  3330. max-width: 100%;
  3331. font-size: 0.7em;
  3332. }
  3333. .dapp-tag-button:hover,
  3334. .dapp-tag-button:focus {
  3335. outline: 0;
  3336. }
  3337. .dapp-tag-button.active {
  3338. background: #02A8F3;
  3339. color: #FAFAFA;
  3340. }
  3341. /* #### All small screens #### */
  3342. /* #### All small tablets screens #### */
  3343. /* #### All small phone screens landscape #### */
  3344. @media screen and (max-width: 576px) {
  3345. aside.dapp-main {
  3346. -webkit-box-flex: 0;
  3347. -moz-box-flex: 0;
  3348. -webkit-flex: 0 0 64px;
  3349. -ms-flex: 0 0 64px;
  3350. flex: 0 0 64px;
  3351. }
  3352. .dapp-actionbar {
  3353. flex: 1 auto;
  3354. }
  3355. .dapp-actionbar nav ul {
  3356. display: flex;
  3357. }
  3358. .dapp-actionbar nav ul li {
  3359. flex: 1;
  3360. }
  3361. }
  3362. /* #### All small phone screens porttrait #### */
  3363. /* #### Mobile Phones Portrait #### */
  3364. @media screen and (max-device-width: 480px) and (orientation: portrait) {
  3365. body {
  3366. font-size: 14px;
  3367. }
  3368. }
  3369. /* #### Mobile Phones Landscape #### */
  3370. @media screen and (max-device-width: 640px) and (orientation: landscape) {
  3371. body {
  3372. font-size: 15px;
  3373. }
  3374. }
  3375. /* #### Mobile Phones Portrait or Landscape #### */
  3376. /* #### iPhone 4+ Portrait or Landscape #### */
  3377. /* #### Tablets Portrait #### */
  3378. /* #### Tablets Landscape #### */
  3379. /* #### Desktops #### */
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!