SHARE
TWEET

Untitled

a guest May 19th, 2017 52 Never
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
  1. @import 'https://fonts.googleapis.com/css?family=Roboto:100,300,400,400i,500,700,900&subset=cyrillic,cyrillic-ext,greek,greek-ext,latin-ext,vietnamese';
  2. /* GLOBAL */
  3. /* FORM VARIABLES */
  4. /** COLORS */
  5. /*
  6.     Theme for header and sidebar
  7.  */
  8. .container {
  9.   max-width: 64em;
  10.   margin-left: auto;
  11.   margin-right: auto;
  12. }
  13. .col {
  14.   float: left;
  15. }
  16. .col,
  17. .col-right {
  18.   box-sizing: border-box;
  19. }
  20. .col-right {
  21.   float: right;
  22. }
  23. .col-1 {
  24.   width: 8.33333%;
  25. }
  26. .col-2 {
  27.   width: 16.66667%;
  28. }
  29. .col-3 {
  30.   width: 25%;
  31. }
  32. .col-4 {
  33.   width: 33.33333%;
  34. }
  35. .col-5 {
  36.   width: 41.66667%;
  37. }
  38. .col-6 {
  39.   width: 50%;
  40. }
  41. .col-7 {
  42.   width: 58.33333%;
  43. }
  44. .col-8 {
  45.   width: 66.66667%;
  46. }
  47. .col-9 {
  48.   width: 75%;
  49. }
  50. .col-10 {
  51.   width: 83.33333%;
  52. }
  53. .col-11 {
  54.   width: 91.66667%;
  55. }
  56. .col-12 {
  57.   width: 100%;
  58. }
  59. @media (min-width: 40em) {
  60.   .sm-col {
  61.     float: left;
  62.     box-sizing: border-box;
  63.   }
  64.   .sm-col-right {
  65.     float: right;
  66.     box-sizing: border-box;
  67.   }
  68.   .sm-col-1 {
  69.     width: 8.33333%;
  70.   }
  71.   .sm-col-2 {
  72.     width: 16.66667%;
  73.   }
  74.   .sm-col-3 {
  75.     width: 25%;
  76.   }
  77.   .sm-col-4 {
  78.     width: 33.33333%;
  79.   }
  80.   .sm-col-5 {
  81.     width: 41.66667%;
  82.   }
  83.   .sm-col-6 {
  84.     width: 50%;
  85.   }
  86.   .sm-col-7 {
  87.     width: 58.33333%;
  88.   }
  89.   .sm-col-8 {
  90.     width: 66.66667%;
  91.   }
  92.   .sm-col-9 {
  93.     width: 75%;
  94.   }
  95.   .sm-col-10 {
  96.     width: 83.33333%;
  97.   }
  98.   .sm-col-11 {
  99.     width: 91.66667%;
  100.   }
  101.   .sm-col-12 {
  102.     width: 100%;
  103.   }
  104. }
  105. @media (min-width: 52em) {
  106.   .md-col {
  107.     float: left;
  108.     box-sizing: border-box;
  109.   }
  110.   .md-col-right {
  111.     float: right;
  112.     box-sizing: border-box;
  113.   }
  114.   .md-col-1 {
  115.     width: 8.33333%;
  116.   }
  117.   .md-col-2 {
  118.     width: 16.66667%;
  119.   }
  120.   .md-col-3 {
  121.     width: 25%;
  122.   }
  123.   .md-col-4 {
  124.     width: 33.33333%;
  125.   }
  126.   .md-col-5 {
  127.     width: 41.66667%;
  128.   }
  129.   .md-col-6 {
  130.     width: 50%;
  131.   }
  132.   .md-col-7 {
  133.     width: 58.33333%;
  134.   }
  135.   .md-col-8 {
  136.     width: 66.66667%;
  137.   }
  138.   .md-col-9 {
  139.     width: 75%;
  140.   }
  141.   .md-col-10 {
  142.     width: 83.33333%;
  143.   }
  144.   .md-col-11 {
  145.     width: 91.66667%;
  146.   }
  147.   .md-col-12 {
  148.     width: 100%;
  149.   }
  150. }
  151. @media (min-width: 64em) {
  152.   .lg-col {
  153.     float: left;
  154.     box-sizing: border-box;
  155.   }
  156.   .lg-col-right {
  157.     float: right;
  158.     box-sizing: border-box;
  159.   }
  160.   .lg-col-1 {
  161.     width: 8.33333%;
  162.   }
  163.   .lg-col-2 {
  164.     width: 16.66667%;
  165.   }
  166.   .lg-col-3 {
  167.     width: 25%;
  168.   }
  169.   .lg-col-4 {
  170.     width: 33.33333%;
  171.   }
  172.   .lg-col-5 {
  173.     width: 41.66667%;
  174.   }
  175.   .lg-col-6 {
  176.     width: 50%;
  177.   }
  178.   .lg-col-7 {
  179.     width: 58.33333%;
  180.   }
  181.   .lg-col-8 {
  182.     width: 66.66667%;
  183.   }
  184.   .lg-col-9 {
  185.     width: 75%;
  186.   }
  187.   .lg-col-10 {
  188.     width: 83.33333%;
  189.   }
  190.   .lg-col-11 {
  191.     width: 91.66667%;
  192.   }
  193.   .lg-col-12 {
  194.     width: 100%;
  195.   }
  196. }
  197. .inline {
  198.   display: inline;
  199. }
  200. .block {
  201.   display: block;
  202. }
  203. .inline-block {
  204.   display: inline-block;
  205. }
  206. .clearfix:after,
  207. .clearfix:before {
  208.   content: " ";
  209.   display: table;
  210. }
  211. .clearfix:after {
  212.   clear: both;
  213. }
  214. .left {
  215.   float: left;
  216. }
  217. .right {
  218.   float: right;
  219. }
  220. .z1 {
  221.   z-index: 1;
  222. }
  223. .z2 {
  224.   z-index: 2;
  225. }
  226. .z3 {
  227.   z-index: 3;
  228. }
  229. .z4 {
  230.   z-index: 4;
  231. }
  232. .z-1 {
  233.   z-index: -1;
  234. }
  235. .z-max {
  236.   z-index: 10001;
  237. }
  238. .relative {
  239.   position: relative;
  240. }
  241. .absolute {
  242.   position: absolute;
  243. }
  244. .fixed {
  245.   position: fixed;
  246. }
  247. .top-0 {
  248.   top: 0;
  249. }
  250. .right-0 {
  251.   right: 0;
  252. }
  253. .bottom-0 {
  254.   bottom: 0;
  255. }
  256. .left-0 {
  257.   left: 0;
  258. }
  259. .right-1 {
  260.   right: 16px;
  261.   right: 1rem;
  262. }
  263. .bottom-1 {
  264.   bottom: 16px;
  265.   bottom: 1rem;
  266. }
  267. .lg-show,
  268. .md-show,
  269. .sm-show {
  270.   display: none !important;
  271. }
  272. @media (min-width: 40em) {
  273.   .sm-show {
  274.     display: block !important;
  275.   }
  276. }
  277. @media (min-width: 52em) {
  278.   .md-show {
  279.     display: block !important;
  280.   }
  281. }
  282. @media (min-width: 64em) {
  283.   .lg-show {
  284.     display: block !important;
  285.   }
  286. }
  287. @media (min-width: 40em) {
  288.   .sm-hide {
  289.     display: none !important;
  290.   }
  291. }
  292. @media (min-width: 52em) {
  293.   .md-hide {
  294.     display: none !important;
  295.   }
  296. }
  297. @media (min-width: 64em) {
  298.   .lg-hide {
  299.     display: none !important;
  300.   }
  301. }
  302. .display-none {
  303.   display: none !important;
  304. }
  305. .hide-usability {
  306.   position: absolute!important;
  307.   height: 1px;
  308.   width: 1px;
  309.   overflow: hidden;
  310.   clip: rect(1px, 1px, 1px, 1px);
  311. }
  312. .ratio-16-9 {
  313.   width: 100%;
  314.   padding-bottom: 56.25%;
  315.   position: relative;
  316. }
  317. .ratio-16-9 > div {
  318.   position: absolute;
  319.   top: 0;
  320.   bottom: 0;
  321.   left: 0;
  322.   right: 0;
  323. }
  324. .ratio-16-10 {
  325.   width: 100%;
  326.   padding-bottom: 62.5%;
  327.   position: relative;
  328. }
  329. .ratio-16-10 > div {
  330.   position: absolute;
  331.   top: 0;
  332.   bottom: 0;
  333.   left: 0;
  334.   right: 0;
  335. }
  336. .ratio-4-3 {
  337.   width: 100%;
  338.   padding-bottom: 75%;
  339.   position: relative;
  340. }
  341. .ratio-4-3 > div {
  342.   position: absolute;
  343.   top: 0;
  344.   bottom: 0;
  345.   left: 0;
  346.   right: 0;
  347. }
  348. .ratio-1-1 {
  349.   width: 100%;
  350.   padding-bottom: 100%;
  351.   position: relative;
  352. }
  353. .ratio-1-1 > div {
  354.   position: absolute;
  355.   top: 0;
  356.   bottom: 0;
  357.   left: 0;
  358.   right: 0;
  359. }
  360. .ratio-2-3 {
  361.   width: 100%;
  362.   padding-bottom: 150%;
  363.   position: relative;
  364. }
  365. .ratio-2-3 > div {
  366.   position: absolute;
  367.   top: 0;
  368.   bottom: 0;
  369.   left: 0;
  370.   right: 0;
  371. }
  372. .ratio-3-2 {
  373.   width: 100%;
  374.   padding-bottom: 66%;
  375.   position: relative;
  376. }
  377. .ratio-3-2 > div {
  378.   position: absolute;
  379.   top: 0;
  380.   bottom: 0;
  381.   left: 0;
  382.   right: 0;
  383. }
  384. .square1 {
  385.   width: 16px;
  386.   width: 1rem;
  387.   height: 16px;
  388.   height: 1rem;
  389. }
  390. .square1-5 {
  391.   width: 24px;
  392.   width: 1.5rem;
  393.   height: 24px;
  394.   height: 1.5rem;
  395. }
  396. .square2 {
  397.   width: 32px;
  398.   width: 2rem;
  399.   height: 32px;
  400.   height: 2rem;
  401. }
  402. .square2-5 {
  403.   width: 40px;
  404.   width: 2.5rem;
  405.   height: 40px;
  406.   height: 2.5rem;
  407. }
  408. .square3 {
  409.   width: 48px;
  410.   width: 3rem;
  411.   height: 48px;
  412.   height: 3rem;
  413. }
  414. .square3-5 {
  415.   width: 56px;
  416.   width: 3.5rem;
  417.   height: 56px;
  418.   height: 3.5rem;
  419. }
  420. .square4 {
  421.   width: 64px;
  422.   width: 4rem;
  423.   height: 64px;
  424.   height: 4rem;
  425. }
  426. .square5 {
  427.   width: 80px;
  428.   width: 5rem;
  429.   height: 80px;
  430.   height: 5rem;
  431. }
  432. .square6 {
  433.   width: 96px;
  434.   width: 6rem;
  435.   height: 96px;
  436.   height: 6rem;
  437. }
  438. .square8 {
  439.   width: 128px;
  440.   width: 8rem;
  441.   height: 128px;
  442.   height: 8rem;
  443. }
  444. .square10 {
  445.   height: 160px;
  446.   height: 10rem;
  447.   width: 160px;
  448.   width: 10rem;
  449. }
  450. .square12-5 {
  451.   height: 200px;
  452.   height: 12.5rem;
  453.   width: 200px;
  454.   width: 12.5rem;
  455. }
  456. .square15 {
  457.   height: 240px;
  458.   height: 15rem;
  459.   width: 240px;
  460.   width: 15rem;
  461. }
  462. .square20 {
  463.   height: 320px;
  464.   height: 20rem;
  465.   width: 320px;
  466.   width: 20rem;
  467. }
  468. .box {
  469.   position: relative;
  470.   box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
  471. }
  472. .box:after {
  473.   content: "";
  474.   position: absolute;
  475.   z-index: -1;
  476.   top: 0;
  477.   left: 0;
  478.   width: 100%;
  479.   height: 100%;
  480.   box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
  481.   opacity: 0;
  482.   transition: opacity 0.6s cubic-bezier(0.165, 0.84, 0.44, 1);
  483. }
  484. .box:hover:after {
  485.   opacity: 1;
  486. }
  487. .m0 {
  488.   margin: 0;
  489. }
  490. .mt0 {
  491.   margin-top: 0;
  492. }
  493. .mr0 {
  494.   margin-right: 0;
  495. }
  496. .mb0 {
  497.   margin-bottom: 0;
  498. }
  499. .ml0,
  500. .mx0 {
  501.   margin-left: 0;
  502. }
  503. .mx0 {
  504.   margin-right: 0;
  505. }
  506. .my0 {
  507.   margin-top: 0;
  508.   margin-bottom: 0;
  509. }
  510. .m1 {
  511.   margin: 8px;
  512.   margin: 0.5rem;
  513. }
  514. .mt1 {
  515.   margin-top: 8px;
  516.   margin-top: 0.5rem;
  517. }
  518. .mr1 {
  519.   margin-right: 8px;
  520.   margin-right: 0.5rem;
  521. }
  522. .mb1 {
  523.   margin-bottom: 8px;
  524.   margin-bottom: 0.5rem;
  525. }
  526. .ml1,
  527. .mx1 {
  528.   margin-left: 8px;
  529.   margin-left: 0.5rem;
  530. }
  531. .mx1 {
  532.   margin-right: 8px;
  533.   margin-right: 0.5rem;
  534. }
  535. .my1 {
  536.   margin-top: 8px;
  537.   margin-top: .5rem;
  538.   margin-bottom: 8px;
  539.   margin-bottom: 0.5rem;
  540. }
  541. .m2 {
  542.   margin: 16px;
  543.   margin: 1rem;
  544. }
  545. .mt2 {
  546.   margin-top: 16px;
  547.   margin-top: 1rem;
  548. }
  549. .mr2 {
  550.   margin-right: 16px;
  551.   margin-right: 1rem;
  552. }
  553. .mb2 {
  554.   margin-bottom: 16px;
  555.   margin-bottom: 1rem;
  556. }
  557. .ml2,
  558. .mx2 {
  559.   margin-left: 16px;
  560.   margin-left: 1rem;
  561. }
  562. .mx2 {
  563.   margin-right: 16px;
  564.   margin-right: 1rem;
  565. }
  566. .my2 {
  567.   margin-top: 16px;
  568.   margin-top: 1rem;
  569.   margin-bottom: 16px;
  570.   margin-bottom: 1rem;
  571. }
  572. .m3 {
  573.   margin: 32px;
  574.   margin: 2rem;
  575. }
  576. .mt3 {
  577.   margin-top: 32px;
  578.   margin-top: 2rem;
  579. }
  580. .mr3 {
  581.   margin-right: 32px;
  582.   margin-right: 2rem;
  583. }
  584. .mb3 {
  585.   margin-bottom: 32px;
  586.   margin-bottom: 2rem;
  587. }
  588. .ml3,
  589. .mx3 {
  590.   margin-left: 32px;
  591.   margin-left: 2rem;
  592. }
  593. .mx3 {
  594.   margin-right: 32px;
  595.   margin-right: 2rem;
  596. }
  597. .my3 {
  598.   margin-top: 32px;
  599.   margin-top: 2rem;
  600.   margin-bottom: 32px;
  601.   margin-bottom: 2rem;
  602. }
  603. .m4 {
  604.   margin: 64px;
  605.   margin: 4rem;
  606. }
  607. .mt4 {
  608.   margin-top: 64px;
  609.   margin-top: 4rem;
  610. }
  611. .mr4 {
  612.   margin-right: 64px;
  613.   margin-right: 4rem;
  614. }
  615. .mb4 {
  616.   margin-bottom: 64px;
  617.   margin-bottom: 4rem;
  618. }
  619. .ml4,
  620. .mx4 {
  621.   margin-left: 64px;
  622.   margin-left: 4rem;
  623. }
  624. .mx4 {
  625.   margin-right: 64px;
  626.   margin-right: 4rem;
  627. }
  628. .my4 {
  629.   margin-top: 64px;
  630.   margin-top: 4rem;
  631.   margin-bottom: 64px;
  632.   margin-bottom: 4rem;
  633. }
  634. .mxn1 {
  635.   margin-left: -8px;
  636.   margin-left: -0.5rem;
  637.   margin-right: -8px;
  638.   margin-right: -0.5rem;
  639. }
  640. .mxn2 {
  641.   margin-left: -16px;
  642.   margin-left: -1rem;
  643.   margin-right: -16px;
  644.   margin-right: -1rem;
  645. }
  646. .mxn3 {
  647.   margin-left: -32px;
  648.   margin-left: -2rem;
  649.   margin-right: -32px;
  650.   margin-right: -2rem;
  651. }
  652. .mxn4 {
  653.   margin-left: -64px;
  654.   margin-left: -4rem;
  655.   margin-right: -64px;
  656.   margin-right: -4rem;
  657. }
  658. .ml-auto {
  659.   margin-left: auto;
  660. }
  661. .mr-auto,
  662. .mx-auto {
  663.   margin-right: auto;
  664. }
  665. .mx-auto {
  666.   margin-left: auto;
  667. }
  668. .border {
  669.   border: 1px solid rgba(0, 0, 0, 0.125);
  670. }
  671. .border-top {
  672.   border-top-style: solid;
  673.   border-top-width: 1px;
  674. }
  675. .border-right {
  676.   border-right-style: solid;
  677.   border-right-width: 1px;
  678. }
  679. .border-bottom {
  680.   border-bottom-style: solid;
  681.   border-bottom-width: 1px;
  682. }
  683. .border-left {
  684.   border-left-style: solid;
  685.   border-left-width: 1px;
  686. }
  687. .rounded {
  688.   border-radius: 3px;
  689. }
  690. .circle {
  691.   border-radius: 50%;
  692. }
  693. .rounded-top {
  694.   border-radius: 3px 3px 0 0;
  695. }
  696. .rounded-right {
  697.   border-radius: 0 3px 3px 0;
  698. }
  699. .rounded-bottom {
  700.   border-radius: 0 0 3px 3px;
  701. }
  702. .rounded-left {
  703.   border-radius: 3px 0 0 3px;
  704. }
  705. .not-rounded {
  706.   border-radius: 0;
  707. }
  708. .border-1 {
  709.   border-width: 4px;
  710.   border-width: .25rem;
  711.   border-style: solid;
  712. }
  713. .border-1.border-bottom {
  714.   border-width: 0;
  715.   border-bottom-width: 4px;
  716.   border-bottom-width: 0.25rem;
  717. }
  718. .border-1.border-top {
  719.   border-width: 0;
  720.   border-top-width: 4px;
  721.   border-top-width: 0.25rem;
  722. }
  723. .border-1.border-left {
  724.   border-width: 0;
  725.   border-left-width: 4px;
  726.   border-left-width: 0.25rem;
  727. }
  728. .border-1.border-right {
  729.   border-width: 0;
  730.   border-right-width: 4px;
  731.   border-right-width: 0.25rem;
  732. }
  733. .border-2 {
  734.   border-width: 8px;
  735.   border-width: .5rem;
  736.   border-style: solid;
  737. }
  738. .border-2.border-bottom {
  739.   border-width: 0;
  740.   border-bottom-width: 8px;
  741.   border-bottom-width: 0.5rem;
  742. }
  743. .border-2.border-top {
  744.   border-width: 0;
  745.   border-top-width: 8px;
  746.   border-top-width: 0.5rem;
  747. }
  748. .border-2.border-left {
  749.   border-width: 0;
  750.   border-left-width: 8px;
  751.   border-left-width: 0.5rem;
  752. }
  753. .border-2.border-right {
  754.   border-width: 0;
  755.   border-right-width: 8px;
  756.   border-right-width: 0.5rem;
  757. }
  758. .border-3 {
  759.   border-width: 16px;
  760.   border-width: 1rem;
  761.   border-style: solid;
  762. }
  763. .border-3.border-bottom {
  764.   border-width: 0;
  765.   border-bottom-width: 16px;
  766.   border-bottom-width: 1rem;
  767. }
  768. .border-3.border-top {
  769.   border-width: 0;
  770.   border-top-width: 16px;
  771.   border-top-width: 1rem;
  772. }
  773. .border-3.border-left {
  774.   border-width: 0;
  775.   border-left-width: 16px;
  776.   border-left-width: 1rem;
  777. }
  778. .border-3.border-right {
  779.   border-width: 0;
  780.   border-right-width: 16px;
  781.   border-right-width: 1rem;
  782. }
  783. .border-4 {
  784.   border-width: 32px;
  785.   border-width: 2rem;
  786.   border-style: solid;
  787. }
  788. .border-4.border-bottom {
  789.   border-width: 0;
  790.   border-bottom-width: 32px;
  791.   border-bottom-width: 2rem;
  792. }
  793. .border-4.border-top {
  794.   border-width: 0;
  795.   border-top-width: 32px;
  796.   border-top-width: 2rem;
  797. }
  798. .border-4.border-left {
  799.   border-width: 0;
  800.   border-left-width: 32px;
  801.   border-left-width: 2rem;
  802. }
  803. .border-4.border-right {
  804.   border-width: 0;
  805.   border-right-width: 32px;
  806.   border-right-width: 2rem;
  807. }
  808. .border-inherit {
  809.   border-color: currentColor;
  810. }
  811. .border-none {
  812.   border: none;
  813. }
  814. .border.border-dashed.muted {
  815.   background-color: #f0f8ff;
  816. }
  817. .border.border-dashed {
  818.   border-style: dashed;
  819. }
  820. .border-left.border-dashed {
  821.   border-left-style: dashed;
  822. }
  823. .border-right.border-dashed {
  824.   border-right-style: dashed;
  825. }
  826. .border-bottom.border-dashed {
  827.   border-bottom-style: dashed;
  828. }
  829. .border-top.border-dashed {
  830.   border-top-style: dashed;
  831. }
  832. .p0 {
  833.   padding: 0;
  834. }
  835. .pt0 {
  836.   padding-top: 0;
  837. }
  838. .pr0 {
  839.   padding-right: 0;
  840. }
  841. .pb0 {
  842.   padding-bottom: 0;
  843. }
  844. .pl0,
  845. .px0 {
  846.   padding-left: 0;
  847. }
  848. .px0 {
  849.   padding-right: 0;
  850. }
  851. .py0 {
  852.   padding-top: 0;
  853.   padding-bottom: 0;
  854. }
  855. .p1 {
  856.   padding: 8px;
  857.   padding: 0.5rem;
  858. }
  859. .pt1 {
  860.   padding-top: 8px;
  861.   padding-top: 0.5rem;
  862. }
  863. .pr1 {
  864.   padding-right: 8px;
  865.   padding-right: 0.5rem;
  866. }
  867. .pb1 {
  868.   padding-bottom: 8px;
  869.   padding-bottom: 0.5rem;
  870. }
  871. .pl1 {
  872.   padding-left: 8px;
  873.   padding-left: 0.5rem;
  874. }
  875. .py1 {
  876.   padding-top: 8px;
  877.   padding-top: .5rem;
  878.   padding-bottom: 8px;
  879.   padding-bottom: 0.5rem;
  880. }
  881. .px1 {
  882.   padding-left: 8px;
  883.   padding-left: .5rem;
  884.   padding-right: 8px;
  885.   padding-right: 0.5rem;
  886. }
  887. .p2 {
  888.   padding: 16px;
  889.   padding: 1rem;
  890. }
  891. .pt2 {
  892.   padding-top: 16px;
  893.   padding-top: 1rem;
  894. }
  895. .pr2 {
  896.   padding-right: 16px;
  897.   padding-right: 1rem;
  898. }
  899. .pb2 {
  900.   padding-bottom: 16px;
  901.   padding-bottom: 1rem;
  902. }
  903. .pl2 {
  904.   padding-left: 16px;
  905.   padding-left: 1rem;
  906. }
  907. .py2 {
  908.   padding-top: 16px;
  909.   padding-top: 1rem;
  910.   padding-bottom: 16px;
  911.   padding-bottom: 1rem;
  912. }
  913. .px2 {
  914.   padding-left: 16px;
  915.   padding-left: 1rem;
  916.   padding-right: 16px;
  917.   padding-right: 1rem;
  918. }
  919. .p3 {
  920.   padding: 32px;
  921.   padding: 2rem;
  922. }
  923. .pt3 {
  924.   padding-top: 32px;
  925.   padding-top: 2rem;
  926. }
  927. .pr3 {
  928.   padding-right: 32px;
  929.   padding-right: 2rem;
  930. }
  931. .pb3 {
  932.   padding-bottom: 32px;
  933.   padding-bottom: 2rem;
  934. }
  935. .pl3 {
  936.   padding-left: 32px;
  937.   padding-left: 2rem;
  938. }
  939. .py3 {
  940.   padding-top: 32px;
  941.   padding-top: 2rem;
  942.   padding-bottom: 32px;
  943.   padding-bottom: 2rem;
  944. }
  945. .px3 {
  946.   padding-left: 32px;
  947.   padding-left: 2rem;
  948.   padding-right: 32px;
  949.   padding-right: 2rem;
  950. }
  951. .p4 {
  952.   padding: 64px;
  953.   padding: 4rem;
  954. }
  955. .pt4 {
  956.   padding-top: 64px;
  957.   padding-top: 4rem;
  958. }
  959. .pr4 {
  960.   padding-right: 64px;
  961.   padding-right: 4rem;
  962. }
  963. .pb4 {
  964.   padding-bottom: 64px;
  965.   padding-bottom: 4rem;
  966. }
  967. .pl4 {
  968.   padding-left: 64px;
  969.   padding-left: 4rem;
  970. }
  971. .py4 {
  972.   padding-top: 64px;
  973.   padding-top: 4rem;
  974.   padding-bottom: 64px;
  975.   padding-bottom: 4rem;
  976. }
  977. .px4 {
  978.   padding-left: 64px;
  979.   padding-left: 4rem;
  980.   padding-right: 64px;
  981.   padding-right: 4rem;
  982. }
  983. .box-shadow-1 {
  984.   box-shadow: 0 6px 6px rgba(0, 0, 0, 0.48);
  985. }
  986. .box-shadow-2 {
  987.   box-shadow: 0 6px 12px rgba(0, 0, 0, 0.32);
  988. }
  989. .box-shadow-3 {
  990.   box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), inset 0 -2px 0 rgba(0, 0, 0, 0.13);
  991. }
  992. .lift-1 {
  993.   box-shadow: 0 2px 20px rgba(0, 0, 0, 0.52);
  994. }
  995. .box-inset {
  996.   box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.48);
  997. }
  998. .overflow-hidden {
  999.   overflow: hidden;
  1000. }
  1001. .overflow-scroll {
  1002.   overflow: scroll;
  1003. }
  1004. .overflow-auto {
  1005.   overflow: auto;
  1006. }
  1007. .overflow-y {
  1008.   overflow-y: auto;
  1009. }
  1010. .fit {
  1011.   max-width: 100%;
  1012. }
  1013. .half-width {
  1014.   width: 50%;
  1015. }
  1016. .full-width {
  1017.   width: 100%;
  1018. }
  1019. .max-h,
  1020. .maxh100 {
  1021.   max-height: 100%;
  1022. }
  1023. .maxh50 {
  1024.   max-height: 50vh;
  1025. }
  1026. .maxh100vh {
  1027.   max-height: 100vh;
  1028. }
  1029. .minh50 {
  1030.   min-height: 50vh;
  1031. }
  1032. .minh66 {
  1033.   min-height: 66vh;
  1034. }
  1035. .minh100 {
  1036.   min-height: 100vh;
  1037. }
  1038. .min-vh-auto {
  1039.   min-height: auto;
  1040. }
  1041. .min-vh-1 {
  1042.   min-height: 25vh;
  1043. }
  1044. .min-vh-2 {
  1045.   min-height: 33vh;
  1046. }
  1047. .min-vh-3 {
  1048.   min-height: 50vh;
  1049. }
  1050. .min-vh-4 {
  1051.   min-height: 66vh;
  1052. }
  1053. .min-vh-5 {
  1054.   min-height: 75vh;
  1055. }
  1056. .min-vh-6 {
  1057.   min-height: 100vh;
  1058. }
  1059. .h20 {
  1060.   height: 320px;
  1061.   height: 20rem;
  1062. }
  1063. .h100 {
  1064.   height: 100%;
  1065. }
  1066. .h50 {
  1067.   height: 50%;
  1068. }
  1069. .h50vh {
  1070.   height: 50vh;
  1071. }
  1072. .border-box {
  1073.   box-sizing: border-box;
  1074. }
  1075. .content-box {
  1076.   box-sizing: content-box;
  1077. }
  1078. .clearfix {
  1079.   *zoom: 1;
  1080. }
  1081. .clearfix:before,
  1082. .clearfix:after {
  1083.   display: table;
  1084.   content: "";
  1085.   line-height: 0;
  1086. }
  1087. .clearfix:after {
  1088.   clear: both;
  1089. }
  1090. .hide-text {
  1091.   font: 0/0 a;
  1092.   color: transparent;
  1093.   text-shadow: none;
  1094.   background-color: transparent;
  1095.   border: 0;
  1096. }
  1097. .input-block-level {
  1098.   display: block;
  1099.   width: 100%;
  1100.   min-height: 30px;
  1101.   -webkit-box-sizing: border-box;
  1102.   -moz-box-sizing: border-box;
  1103.   box-sizing: border-box;
  1104. }
  1105. .text-xxs {
  1106.   font-size: 0.625rem;
  1107. }
  1108. .text-xs {
  1109.   font-size: 0.75rem;
  1110. }
  1111. .text-s {
  1112.   font-size: 0.875rem;
  1113. }
  1114. .text-m {
  1115.   font-size: 1rem;
  1116. }
  1117. .text-l {
  1118.   font-size: 1.125rem;
  1119. }
  1120. .text-xl {
  1121.   font-size: 1.25rem;
  1122. }
  1123. .text-xxl {
  1124.   font-size: 1.5rem;
  1125. }
  1126. .text-auto {
  1127.   font-size: inherit;
  1128. }
  1129. .heading-xs {
  1130.   font-size: 0.875rem;
  1131. }
  1132. .heading-s {
  1133.   font-size: 1rem;
  1134. }
  1135. .heading-m {
  1136.   font-size: 1.125rem;
  1137. }
  1138. .heading-l {
  1139.   font-size: 1.25rem;
  1140. }
  1141. .heading-xl {
  1142.   font-size: 1.5rem;
  1143. }
  1144. .heading-xxl {
  1145.   font-size: 2.25rem;
  1146. }
  1147. .heading-auto {
  1148.   font-size: inherit;
  1149. }
  1150. .thin {
  1151.   font-weight: 100;
  1152. }
  1153. .light {
  1154.   font-weight: 300;
  1155. }
  1156. .normal {
  1157.   font-weight: 400;
  1158. }
  1159. .medium {
  1160.   font-weight: 500;
  1161. }
  1162. .bold {
  1163.   font-weight: 700;
  1164. }
  1165. .heavy {
  1166.   font-weight: 900;
  1167. }
  1168. .italic {
  1169.   font-style: italic;
  1170. }
  1171. .caps {
  1172.   text-transform: uppercase;
  1173. }
  1174. .small-caps {
  1175.   -webkit-font-feature-settings: "c2sc";
  1176.   font-feature-settings: "c2sc";
  1177.   font-variant: small-caps;
  1178. }
  1179. .underline {
  1180.   text-decoration: underline;
  1181. }
  1182. .line-through {
  1183.   text-decoration: line-through;
  1184. }
  1185. .text-shadow {
  1186.   text-shadow: 0 0 2px rgba(0, 0, 0, 0.15);
  1187. }
  1188. .list-reset {
  1189.   list-style: none;
  1190.   padding-left: 0;
  1191. }
  1192. .link-reset {
  1193.   text-decoration: none;
  1194. }
  1195. .align-left {
  1196.   text-align: left;
  1197. }
  1198. .center {
  1199.   text-align: center;
  1200. }
  1201. .align-right {
  1202.   text-align: right;
  1203. }
  1204. .justify {
  1205.   text-align: justify;
  1206. }
  1207. .nowrap {
  1208.   white-space: nowrap;
  1209. }
  1210. .truncate {
  1211.   width: 100%;
  1212.   white-space: nowrap;
  1213.   overflow: hidden;
  1214.   text-overflow: ellipsis;
  1215. }
  1216. .blockquote {
  1217.   border-left: 4px solid #eee;
  1218.   padding-left: 1rem;
  1219.   /* margin-left: 1rem; */
  1220.  
  1221.   font-style: italic;
  1222. }
  1223. .fg-brand {
  1224.   color: #39a1e7;
  1225. }
  1226. .bg-brand {
  1227.   background-color: #39a1e7;
  1228. }
  1229. .br-brand {
  1230.   border-width: 1px;
  1231.   border-style: solid;
  1232.   border-color: inherit;
  1233.   border-color: #39a1e7;
  1234. }
  1235. .fg-slate {
  1236.   color: #5c7899;
  1237. }
  1238. .bg-slate {
  1239.   background-color: #5c7899;
  1240. }
  1241. .br-slate {
  1242.   border-width: 1px;
  1243.   border-style: solid;
  1244.   border-color: inherit;
  1245.   border-color: #5c7899;
  1246. }
  1247. .fg-blue {
  1248.   color: #48adf0;
  1249. }
  1250. .bg-blue {
  1251.   background-color: #48adf0;
  1252. }
  1253. .br-blue {
  1254.   border-width: 1px;
  1255.   border-style: solid;
  1256.   border-color: inherit;
  1257.   border-color: #48adf0;
  1258. }
  1259. .fg-green {
  1260.   color: #26c059;
  1261. }
  1262. .bg-green {
  1263.   background-color: #26c059;
  1264. }
  1265. .br-green {
  1266.   border-width: 1px;
  1267.   border-style: solid;
  1268.   border-color: inherit;
  1269.   border-color: #26c059;
  1270. }
  1271. .fg-yellow {
  1272.   color: #ffd351;
  1273. }
  1274. .bg-yellow {
  1275.   background-color: #ffd351;
  1276. }
  1277. .br-yellow {
  1278.   border-width: 1px;
  1279.   border-style: solid;
  1280.   border-color: inherit;
  1281.   border-color: #ffd351;
  1282. }
  1283. .fg-orange {
  1284.   color: #ff8900;
  1285. }
  1286. .bg-orange {
  1287.   background-color: #ff8900;
  1288. }
  1289. .br-orange {
  1290.   border-width: 1px;
  1291.   border-style: solid;
  1292.   border-color: inherit;
  1293.   border-color: #ff8900;
  1294. }
  1295. .fg-red {
  1296.   color: #ff0000;
  1297. }
  1298. .bg-red {
  1299.   background-color: #ff0000;
  1300. }
  1301. .br-red {
  1302.   border-width: 1px;
  1303.   border-style: solid;
  1304.   border-color: inherit;
  1305.   border-color: #ff0000;
  1306. }
  1307. .fg-pink {
  1308.   color: #ec2d71;
  1309. }
  1310. .bg-pink {
  1311.   background-color: #ec2d71;
  1312. }
  1313. .br-pink {
  1314.   border-width: 1px;
  1315.   border-style: solid;
  1316.   border-color: inherit;
  1317.   border-color: #ec2d71;
  1318. }
  1319. .fg-neutral {
  1320.   color: #2780f8;
  1321. }
  1322. .bg-neutral {
  1323.   background-color: #2780f8;
  1324. }
  1325. .br-neutral {
  1326.   border-width: 1px;
  1327.   border-style: solid;
  1328.   border-color: inherit;
  1329.   border-color: #2780f8;
  1330. }
  1331. .fg-positive {
  1332.   color: #27ae60;
  1333. }
  1334. .bg-positive {
  1335.   background-color: #27ae60;
  1336. }
  1337. .br-positive {
  1338.   border-width: 1px;
  1339.   border-style: solid;
  1340.   border-color: inherit;
  1341.   border-color: #27ae60;
  1342. }
  1343. .fg-warning {
  1344.   color: #e6b41d;
  1345. }
  1346. .bg-warning {
  1347.   background-color: #e6b41d;
  1348. }
  1349. .br-warning {
  1350.   border-width: 1px;
  1351.   border-style: solid;
  1352.   border-color: inherit;
  1353.   border-color: #e6b41d;
  1354. }
  1355. .fg-negative {
  1356.   color: #f24f40;
  1357. }
  1358. .bg-negative {
  1359.   background-color: #f24f40;
  1360. }
  1361. .br-negative {
  1362.   border-width: 1px;
  1363.   border-style: solid;
  1364.   border-color: inherit;
  1365.   border-color: #f24f40;
  1366. }
  1367. .fg-disabled {
  1368.   color: #e6e6e6;
  1369. }
  1370. .bg-disabled {
  1371.   background-color: #e6e6e6;
  1372. }
  1373. .br-disabled {
  1374.   border-width: 1px;
  1375.   border-style: solid;
  1376.   border-color: inherit;
  1377.   border-color: #e6e6e6;
  1378. }
  1379. .bg-white {
  1380.   background: #ffffff;
  1381. }
  1382. .fg-white {
  1383.   color: #ffffff;
  1384. }
  1385. .br-white {
  1386.   border-width: 1px;
  1387.   border-style: solid;
  1388.   border-color: inherit;
  1389.   border-color: #ffffff;
  1390. }
  1391. .bg-black {
  1392.   background: #ffffff;
  1393. }
  1394. .fg-black {
  1395.   color: #ffffff;
  1396. }
  1397. .br-black {
  1398.   border-width: 1px;
  1399.   border-style: solid;
  1400.   border-color: inherit;
  1401.   border-color: #000000;
  1402. }
  1403. /* Svg icon size definitions */
  1404. [class*='svg-icon'] {
  1405.   pointer-events: none;
  1406. }
  1407. .svg-icon-xxs {
  1408.   width: 12px;
  1409.   height: 12px;
  1410. }
  1411. .svg-icon-xs {
  1412.   width: 14px;
  1413.   height: 14px;
  1414. }
  1415. .svg-icon-s {
  1416.   width: 16px;
  1417.   height: 16px;
  1418. }
  1419. .svg-icon-m {
  1420.   width: 20px;
  1421.   height: 20px;
  1422. }
  1423. .svg-icon-l {
  1424.   width: 24px;
  1425.   height: 24px;
  1426. }
  1427. .svg-icon-xl {
  1428.   width: 32px;
  1429.   height: 32px;
  1430. }
  1431. .svg-icon-xxl {
  1432.   width: 48px;
  1433.   height: 48px;
  1434. }
  1435. [class*='icon-left'] {
  1436.   margin-right: .25rem;
  1437. }
  1438. [class*='icon-right'] {
  1439.   margin-left: .25rem;
  1440. }
  1441. /** NEW METHOD TO FINISH BY IMPLEMENTING ALL ICONS THIS WAY! */
  1442. /** Adding a new icon for developer will be super straight forward */
  1443. /** Define Icons and SVGs */
  1444. /** Icon generator */
  1445. /** Initialize all icons in list above */
  1446. .fkit-icon {
  1447.   display: inline-block;
  1448.   width: 24px;
  1449.   height: 24px;
  1450. }
  1451. /** Need a single icon? */
  1452. .fkit-icon.new-icon {
  1453.   background-image: url("data:image/svg+xml;utf8,replace%28%22replace%28%22%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20xmlns%3Axlink%3D%22http%3A//www.w3.org/1999/xlink%22%20x%3D%220px%22%20y%3D%220px%22%20width%3D%2224px%22%20height%3D%2224px%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cg%20transform%3D%22translate%280.5,%200.5%29%22%3E%20%3Cpath%20data-color%3D%22color-2%22%20fill%3D%22none%22%20stroke%3D%22%236c86a3%22%20stroke-width%3D%221%22%20stroke-linecap%3D%22square%22%20stroke-miterlimit%3D%2210%22%20d%3D%22M12,8%20c1.1,0,2-0.9,2-2s-2-4-2-4s-2,2.9-2,4S10.9,8,12,8z%22%20stroke-linejoin%3D%22miter%22%3E%3C/path%3E%20%3Cline%20data-color%3D%22color-2%22%20fill%3D%22none%22%20stroke%3D%22%236c86a3%22%20stroke-width%3D%221%22%20stroke-linecap%3D%22square%22%20stroke-miterlimit%3D%2210%22%20x1%3D%2212%22%20y1%3D%228%22%20x2%3D%2212%22%20y2%3D%2211%22%20stroke-linejoin%3D%22miter%22%3E%3C/line%3E%20%3Crect%20x%3D%221%22%20y%3D%2215%22%20fill%3D%22none%22%20stroke%3D%22%236c86a3%22%20stroke-width%3D%221%22%20stroke-linecap%3D%22square%22%20stroke-miterlimit%3D%2210%22%20width%3D%2222%22%20height%3D%228%22%20stroke-linejoin%3D%22miter%22%3E%3C/rect%3E%20%3Cpath%20fill%3D%22none%22%20stroke%3D%22%236c86a3%22%20stroke-width%3D%221%22%20stroke-linecap%3D%22square%22%20stroke-miterlimit%3D%2210%22%20d%3D%22M23,15c0,2.2-1.8,4-4,4%20c-1.5,0-2.8-0.9-3.5-2.1c-0.7,1.2-2,2.1-3.5,2.1s-2.8-0.9-3.5-2.1C7.8,18.1,6.5,19,5,19c-2.2,0-4-1.8-4-4%22%20stroke-linejoin%3D%22miter%22%3E%3C/path%3E%20%3Cpolyline%20fill%3D%22none%22%20stroke%3D%22%236c86a3%22%20stroke-width%3D%221%22%20stroke-linecap%3D%22square%22%20stroke-miterlimit%3D%2210%22%20points%3D%2220,15%2020,11%204,11%204,15%20%22%20stroke-linejoin%3D%22miter%22%3E%3C/polyline%3E%20%3C/g%3E%3C/svg%3E%22,%20'stroke%3D%22%28.*?%29%22',%20'stroke%3D%22%23FFF%22',%20%22g%22%29%22,%20'fill%3D%22%28?!none%29.*?%22',%20'fill%3D%22%23FFF%22',%20%22g%22%29");
  1454.   background-repeat: no-repeat;
  1455.   background-position: center center;
  1456. }
  1457. .fkit-icon.new-icon:hover {
  1458.   background-image: url("data:image/svg+xml;utf8,replace%28%22replace%28%22%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20xmlns%3Axlink%3D%22http%3A//www.w3.org/1999/xlink%22%20x%3D%220px%22%20y%3D%220px%22%20width%3D%2224px%22%20height%3D%2224px%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cg%20transform%3D%22translate%280.5,%200.5%29%22%3E%20%3Cpath%20data-color%3D%22color-2%22%20fill%3D%22none%22%20stroke%3D%22%236c86a3%22%20stroke-width%3D%221%22%20stroke-linecap%3D%22square%22%20stroke-miterlimit%3D%2210%22%20d%3D%22M12,8%20c1.1,0,2-0.9,2-2s-2-4-2-4s-2,2.9-2,4S10.9,8,12,8z%22%20stroke-linejoin%3D%22miter%22%3E%3C/path%3E%20%3Cline%20data-color%3D%22color-2%22%20fill%3D%22none%22%20stroke%3D%22%236c86a3%22%20stroke-width%3D%221%22%20stroke-linecap%3D%22square%22%20stroke-miterlimit%3D%2210%22%20x1%3D%2212%22%20y1%3D%228%22%20x2%3D%2212%22%20y2%3D%2211%22%20stroke-linejoin%3D%22miter%22%3E%3C/line%3E%20%3Crect%20x%3D%221%22%20y%3D%2215%22%20fill%3D%22none%22%20stroke%3D%22%236c86a3%22%20stroke-width%3D%221%22%20stroke-linecap%3D%22square%22%20stroke-miterlimit%3D%2210%22%20width%3D%2222%22%20height%3D%228%22%20stroke-linejoin%3D%22miter%22%3E%3C/rect%3E%20%3Cpath%20fill%3D%22none%22%20stroke%3D%22%236c86a3%22%20stroke-width%3D%221%22%20stroke-linecap%3D%22square%22%20stroke-miterlimit%3D%2210%22%20d%3D%22M23,15c0,2.2-1.8,4-4,4%20c-1.5,0-2.8-0.9-3.5-2.1c-0.7,1.2-2,2.1-3.5,2.1s-2.8-0.9-3.5-2.1C7.8,18.1,6.5,19,5,19c-2.2,0-4-1.8-4-4%22%20stroke-linejoin%3D%22miter%22%3E%3C/path%3E%20%3Cpolyline%20fill%3D%22none%22%20stroke%3D%22%236c86a3%22%20stroke-width%3D%221%22%20stroke-linecap%3D%22square%22%20stroke-miterlimit%3D%2210%22%20points%3D%2220,15%2020,11%204,11%204,15%20%22%20stroke-linejoin%3D%22miter%22%3E%3C/polyline%3E%20%3C/g%3E%3C/svg%3E%22,%20'stroke%3D%22%28.*?%29%22',%20'stroke%3D%22blue%22',%20%22g%22%29%22,%20'fill%3D%22%28?!none%29.*?%22',%20'fill%3D%22blue%22',%20%22g%22%29");
  1459.   background-repeat: no-repeat;
  1460.   background-position: center center;
  1461. }
  1462. /** Custom hover to be put inside app less pages */
  1463. .fkit-icon.random-layout:hover {
  1464.   background-image: url("data:image/svg+xml;utf8,replace%28%22replace%28%22%3Csvg%20xmlns%3D%22http%3A//www.w3.org/2000/svg%22%20xmlns%3Axlink%3D%22http%3A//www.w3.org/1999/xlink%22%20x%3D%220px%22%20y%3D%220px%22%20width%3D%2224px%22%20height%3D%2224px%22%20viewBox%3D%220%200%2024%2024%22%3E%3Cg%20transform%3D%22translate%280.5,%200.5%29%22%3E%20%3Cline%20data-color%3D%22color-2%22%20fill%3D%22none%22%20stroke%3D%22%23ffffff%22%20stroke-width%3D%221%22%20stroke-linecap%3D%22square%22%20stroke-miterlimit%3D%2210%22%20x1%3D%221%22%20y1%3D%229%22%20x2%3D%2223%22%20y2%3D%229%22%20stroke-linejoin%3D%22miter%22%3E%3C/line%3E%20%3Cline%20data-color%3D%22color-2%22%20fill%3D%22none%22%20stroke%3D%22%23ffffff%22%20stroke-width%3D%221%22%20stroke-linecap%3D%22square%22%20stroke-miterlimit%3D%2210%22%20x1%3D%228%22%20y1%3D%229%22%20x2%3D%228%22%20y2%3D%2222%22%20stroke-linejoin%3D%22miter%22%3E%3C/line%3E%20%3Crect%20x%3D%221%22%20y%3D%222%22%20fill%3D%22none%22%20stroke%3D%22%23ffffff%22%20stroke-width%3D%221%22%20stroke-linecap%3D%22square%22%20stroke-miterlimit%3D%2210%22%20width%3D%2222%22%20height%3D%2220%22%20stroke-linejoin%3D%22miter%22%3E%3C/rect%3E%20%3C/g%3E%3C/svg%3E%22,%20'stroke%3D%22%28.*?%29%22',%20'stroke%3D%22green%22',%20%22g%22%29%22,%20'fill%3D%22%28?!none%29.*?%22',%20'fill%3D%22green%22',%20%22g%22%29");
  1465.   background-repeat: no-repeat;
  1466.   background-position: center center;
  1467. }
  1468. /**
  1469. Sexy? I KNOW!
  1470. For testing
  1471.     <i class="fkit-icon random-layout"></i>
  1472.     <i class="fkit-icon new-icon"></i>
  1473.  */
  1474. .animated {
  1475.   -webkit-animation-duration: 1s;
  1476.   animation-duration: 1s;
  1477.   -webkit-animation-fill-mode: both;
  1478.   animation-fill-mode: both;
  1479. }
  1480. .animated.infinite {
  1481.   -webkit-animation-iteration-count: infinite;
  1482.   animation-iteration-count: infinite;
  1483. }
  1484. .animated.hinge {
  1485.   -webkit-animation-duration: 2s;
  1486.   animation-duration: 2s;
  1487. }
  1488. @keyframes zoomInView {
  1489.   from {
  1490.     opacity: 0;
  1491.     -webkit-transform: scale3d(0.5, 0.5, 0.5) perspective(1px) translateZ(0) translate3d(0, 0, 0);
  1492.     transform: scale3d(0.5, 0.5, 0.5) perspective(1px) translateZ(0) translate3d(0, 0, 0);
  1493.   }
  1494.   50% {
  1495.     opacity: 1;
  1496.   }
  1497. }
  1498. .moveIconRight {
  1499.   animation-duration: 0.3s;
  1500.   animation-fill-mode: both;
  1501.   animation-name: moveIconRight;
  1502. }
  1503. @keyframes moveIconRight {
  1504.   from {
  1505.     transform: translate3d(-189px, -47px, 0px);
  1506.   }
  1507.   to {
  1508.     transform: translate3d(189px, 47px, 0px);
  1509.   }
  1510. }
  1511. .zoomInView {
  1512.   animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  1513.   animation-name: zoomInView;
  1514. }
  1515. @keyframes jump {
  1516.   from {
  1517.     opacity: 0;
  1518.     transform: translate3d(0, 25%, 0);
  1519.   }
  1520.   to {
  1521.     opacity: 1;
  1522.     transform: none;
  1523.   }
  1524. }
  1525. .jumpIn {
  1526.   animation-timing-function: cubic-bezier(0.49, 0.46, 0.12, 1.32);
  1527.   animation-name: jump;
  1528. }
  1529. .jumpOut {
  1530.   animation-timing-function: cubic-bezier(0.49, 0.46, 0.12, 1.32);
  1531.   animation-name: jump;
  1532.   animation-direction: reverse;
  1533. }
  1534. @keyframes fall {
  1535.   0% {
  1536.     opacity: 0;
  1537.     transform: translate3d(0, -25%, 0);
  1538.   }
  1539.   25% {
  1540.     opacity: 0.1;
  1541.   }
  1542.   100% {
  1543.     opacity: 1;
  1544.     transform: translate3d(0, 0, 0);
  1545.   }
  1546. }
  1547. .fallIn {
  1548.   animation-timing-function: cubic-bezier(0.49, 0.46, 0.12, 1.32);
  1549.   animation-name: fall;
  1550. }
  1551. .fallOut {
  1552.   animation-timing-function: cubic-bezier(0.49, 0.46, 0.12, 1.32);
  1553.   animation-name: fall;
  1554.   animation-direction: reverse;
  1555. }
  1556. @keyframes fade {
  1557.   from {
  1558.     opacity: 0;
  1559.   }
  1560.   to {
  1561.     opacity: 1;
  1562.   }
  1563. }
  1564. .fadeIn {
  1565.   animation-timing-function: cubic-bezier(0.49, 0.46, 0.12, 1.32);
  1566.   animation-name: fade;
  1567. }
  1568. .fadeOut {
  1569.   animation-timing-function: cubic-bezier(0.49, 0.46, 0.12, 1.32);
  1570.   animation-name: fade;
  1571.   animation-direction: reverse;
  1572. }
  1573. .flex {
  1574.   display: -webkit-box;
  1575.   display: -ms-flexbox;
  1576.   display: flex;
  1577. }
  1578. .inline-flex {
  1579.   display: -webkit-inline-box;
  1580.   display: -ms-inline-flexbox;
  1581.   display: inline-flex;
  1582. }
  1583. .flex-column {
  1584.   -webkit-box-orient: vertical;
  1585.   -webkit-box-direction: normal;
  1586.   -ms-flex-direction: column;
  1587.   flex-direction: column;
  1588. }
  1589. .flex-wrap {
  1590.   -ms-flex-wrap: wrap;
  1591.   flex-wrap: wrap;
  1592. }
  1593. .align-center {
  1594.   -webkit-box-align: center;
  1595.   -ms-flex-align: center;
  1596.   align-items: center;
  1597. }
  1598. .align-baseline {
  1599.   -webkit-box-align: baseline;
  1600.   -ms-flex-align: baseline;
  1601.   align-items: baseline;
  1602. }
  1603. .align-stretch {
  1604.   -webkit-box-align: stretch;
  1605.   -ms-flex-align: stretch;
  1606.   align-items: stretch;
  1607. }
  1608. .align-start {
  1609.   -webkit-box-align: start;
  1610.   -ms-flex-align: start;
  1611.   align-items: flex-start;
  1612. }
  1613. .align-end {
  1614.   -webkit-box-align: end;
  1615.   -ms-flex-align: end;
  1616.   align-items: flex-end;
  1617. }
  1618. .align-justify,
  1619. .content-between {
  1620.   -webkit-box-pack: justify;
  1621.   -ms-flex-pack: justify;
  1622.   justify-content: space-between;
  1623. }
  1624. .content-around {
  1625.   -ms-flex-pack: distribute;
  1626.   justify-content: space-around;
  1627. }
  1628. .content-start {
  1629.   -webkit-box-pack: start;
  1630.   -ms-flex-pack: start;
  1631.   justify-content: flex-start;
  1632. }
  1633. .content-end {
  1634.   -webkit-box-pack: end;
  1635.   -ms-flex-pack: end;
  1636.   justify-content: flex-end;
  1637. }
  1638. .content-center {
  1639.   -webkit-box-pack: center;
  1640.   -ms-flex-pack: center;
  1641.   justify-content: center;
  1642. }
  1643. .order-first {
  1644.   -webkit-box-ordinal-group: 0;
  1645.   -ms-flex-order: -1;
  1646.   order: -1;
  1647. }
  1648. .order-last {
  1649.   -webkit-box-ordinal-group: 1025;
  1650.   -ms-flex-order: 1024;
  1651.   order: 1024;
  1652. }
  1653. .flex-auto {
  1654.   -webkit-box-flex: 1;
  1655.   -ms-flex: 1 1 auto;
  1656.   flex: 1 1 auto;
  1657. }
  1658. .flex-none {
  1659.   -webkit-box-flex: 0;
  1660.   -ms-flex: none;
  1661.   flex: none;
  1662. }
  1663. .flex > div {
  1664.   box-sizing: border-box;
  1665. }
  1666. .fkit_form {
  1667.   /* TODO check if needed
  1668.     input,
  1669.     textarea,
  1670.     .fc_select,
  1671.     .uneditable-input {
  1672.         width: @inputBaseWidth; // plus 12px padding and 2px border
  1673.     }
  1674.     */
  1675.  
  1676.   /*
  1677.     // Make select elements obey height by applying a border
  1678.     select {
  1679.         width: @selectDefaultWidth; //240px; // default input width + 10px of padding that doesn't get applied
  1680.         border: 1px solid @inputBorder;
  1681.         background-color: @inputBackground; // Chrome on Linux and Mobile Safari need background-color
  1682.     }
  1683.     */
  1684.  
  1685.   /*
  1686. // HTML5 invalid states
  1687. // Shares styles with the .control-group.error above
  1688. input:focus:invalid,
  1689. textarea:focus:invalid,
  1690. select:focus:invalid {
  1691.     color: #b94a48;
  1692.     border-color: #ee5f5b;
  1693.     &:focus {
  1694.         border-color: darken(#ee5f5b, 10%);
  1695.         @shadow: 0 0 6px lighten(#ee5f5b, 20%);
  1696.         .box-shadow(@shadow);
  1697.     }
  1698. }
  1699. */
  1700.  
  1701.   /**
  1702.     * Freedcamp Custom Select
  1703.     */
  1704.  
  1705.   /**
  1706.     * Freedcamp Custom Checkboxes and Radio Buttons
  1707.     */
  1708.  
  1709.   /**
  1710.     * Freedcamp Custom Switches
  1711.     */
  1712.  
  1713.   /**
  1714.     * Color Picker
  1715.      */
  1716.  
  1717. }
  1718. .fkit_form fieldset {
  1719.   padding: 0;
  1720.   margin: 0;
  1721.   border: 0;
  1722. }
  1723. .fkit_form legend {
  1724.   display: block;
  1725.   width: 100%;
  1726.   padding: 0;
  1727.   margin-bottom: 20px;
  1728.   font-size: 21px;
  1729.   line-height: 40px;
  1730.   color: #333333;
  1731.   border: 0;
  1732.   border-bottom: 1px solid #b3b3b3;
  1733. }
  1734. .fkit_form legend small {
  1735.   font-size: 15px;
  1736.   color: #cccccc;
  1737. }
  1738. .fkit_form label,
  1739. .fkit_form input,
  1740. .fkit_form button,
  1741. .fkit_form select,
  1742. .fkit_form textarea,
  1743. .fkit_form .ui-multiselect {
  1744.   font-size: 14px;
  1745.   font-weight: normal;
  1746.   line-height: 20px;
  1747. }
  1748. .fkit_form input,
  1749. .fkit_form button,
  1750. .fkit_form select,
  1751. .fkit_form textarea,
  1752. .fkit_form .ui-multiselect {
  1753.   font-family: 'Roboto', 'Segoe UI', 'Helvetica Neue', Helvetica, sans-serif;
  1754. }
  1755. .fkit_form label {
  1756.   font-size: 0.875rem;
  1757.   font-weight: 400;
  1758.   line-height: 1.6;
  1759.   margin-bottom: 0.25rem;
  1760. }
  1761. .fkit_form select,
  1762. .fkit_form textarea,
  1763. .fkit_form input[type="text"],
  1764. .fkit_form input[type="password"],
  1765. .fkit_form input[type="datetime"],
  1766. .fkit_form input[type="datetime-local"],
  1767. .fkit_form input[type="date"],
  1768. .fkit_form input[type="month"],
  1769. .fkit_form input[type="time"],
  1770. .fkit_form input[type="week"],
  1771. .fkit_form input[type="number"],
  1772. .fkit_form input[type="email"],
  1773. .fkit_form input[type="url"],
  1774. .fkit_form input[type="search"],
  1775. .fkit_form input[type="tel"],
  1776. .fkit_form input[type="color"],
  1777. .fkit_form .uneditable-input,
  1778. .fkit_form .ui-multiselect {
  1779.   height: 2.5rem;
  1780.   font-size: 0.875rem;
  1781.   background: #ffffff;
  1782.   border-radius: 4px;
  1783.   padding: 0.5rem;
  1784.   color: #4d4d4d;
  1785.   border: 1px solid #b3b3b3;
  1786.   box-shadow: 0 1px 0 rgba(0, 0, 0, 0.075) inset;
  1787.   font-weight: 400;
  1788.   line-height: 1.6;
  1789.   width: 100%;
  1790.   box-sizing: border-box;
  1791.   margin-bottom: 0.25rem;
  1792.   transition: all 0.19s cubic-bezier(0.25, 0.8, 0.25, 1);
  1793. }
  1794. .fkit_form select:hover,
  1795. .fkit_form textarea:hover,
  1796. .fkit_form input[type="text"]:hover,
  1797. .fkit_form input[type="password"]:hover,
  1798. .fkit_form input[type="datetime"]:hover,
  1799. .fkit_form input[type="datetime-local"]:hover,
  1800. .fkit_form input[type="date"]:hover,
  1801. .fkit_form input[type="month"]:hover,
  1802. .fkit_form input[type="time"]:hover,
  1803. .fkit_form input[type="week"]:hover,
  1804. .fkit_form input[type="number"]:hover,
  1805. .fkit_form input[type="email"]:hover,
  1806. .fkit_form input[type="url"]:hover,
  1807. .fkit_form input[type="search"]:hover,
  1808. .fkit_form input[type="tel"]:hover,
  1809. .fkit_form input[type="color"]:hover,
  1810. .fkit_form .uneditable-input:hover,
  1811. .fkit_form .ui-multiselect:hover {
  1812.   border-color: #2780f8;
  1813. }
  1814. .fkit_form select:focus,
  1815. .fkit_form textarea:focus,
  1816. .fkit_form input[type="text"]:focus,
  1817. .fkit_form input[type="password"]:focus,
  1818. .fkit_form input[type="datetime"]:focus,
  1819. .fkit_form input[type="datetime-local"]:focus,
  1820. .fkit_form input[type="date"]:focus,
  1821. .fkit_form input[type="month"]:focus,
  1822. .fkit_form input[type="time"]:focus,
  1823. .fkit_form input[type="week"]:focus,
  1824. .fkit_form input[type="number"]:focus,
  1825. .fkit_form input[type="email"]:focus,
  1826. .fkit_form input[type="url"]:focus,
  1827. .fkit_form input[type="search"]:focus,
  1828. .fkit_form input[type="tel"]:focus,
  1829. .fkit_form input[type="color"]:focus,
  1830. .fkit_form .uneditable-input:focus,
  1831. .fkit_form .ui-multiselect:focus {
  1832.   border-color: #2780f8;
  1833.   box-shadow: 0 0 0.5rem rgba(39, 128, 248, 0.2);
  1834. }
  1835. .fkit_form textarea {
  1836.   height: auto;
  1837. }
  1838. .fkit_form textarea,
  1839. .fkit_form input[type="text"],
  1840. .fkit_form input[type="password"],
  1841. .fkit_form input[type="datetime"],
  1842. .fkit_form input[type="datetime-local"],
  1843. .fkit_form input[type="date"],
  1844. .fkit_form input[type="month"],
  1845. .fkit_form input[type="time"],
  1846. .fkit_form input[type="week"],
  1847. .fkit_form input[type="number"],
  1848. .fkit_form input[type="email"],
  1849. .fkit_form input[type="url"],
  1850. .fkit_form input[type="search"],
  1851. .fkit_form input[type="tel"],
  1852. .fkit_form input[type="color"],
  1853. .fkit_form .uneditable-input,
  1854. .fkit_form .ui-multiselect {
  1855.   background-color: #ffffff;
  1856.   border: 1px solid #b3b3b3;
  1857.   -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  1858.   -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  1859.   box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  1860.   -webkit-transition: border linear .2s, box-shadow linear .2s;
  1861.   -moz-transition: border linear .2s, box-shadow linear .2s;
  1862.   -o-transition: border linear .2s, box-shadow linear .2s;
  1863.   transition: border linear .2s, box-shadow linear .2s;
  1864. }
  1865. .fkit_form textarea:focus,
  1866. .fkit_form input[type="text"]:focus,
  1867. .fkit_form input[type="password"]:focus,
  1868. .fkit_form input[type="datetime"]:focus,
  1869. .fkit_form input[type="datetime-local"]:focus,
  1870. .fkit_form input[type="date"]:focus,
  1871. .fkit_form input[type="month"]:focus,
  1872. .fkit_form input[type="time"]:focus,
  1873. .fkit_form input[type="week"]:focus,
  1874. .fkit_form input[type="number"]:focus,
  1875. .fkit_form input[type="email"]:focus,
  1876. .fkit_form input[type="url"]:focus,
  1877. .fkit_form input[type="search"]:focus,
  1878. .fkit_form input[type="tel"]:focus,
  1879. .fkit_form input[type="color"]:focus,
  1880. .fkit_form .uneditable-input:focus,
  1881. .fkit_form .ui-multiselect:focus {
  1882.   border-color: rgba(82, 168, 236, 0.8);
  1883.   outline: 0;
  1884.   outline: thin dotted   \9;
  1885.   /* IE6-9 */
  1886.  
  1887.   -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(82,168,236,.6);
  1888.   -moz-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(82,168,236,.6);
  1889.   box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(82,168,236,.6);
  1890. }
  1891. .fkit_form input[type="radio"],
  1892. .fkit_form input[type="checkbox"] {
  1893.   margin: 4px 0 0;
  1894.   *margin-top: 0;
  1895.   /* IE7 */
  1896.  
  1897.   margin-top: 1px   \9;
  1898.   /* IE8-9 */
  1899.  
  1900.   line-height: normal;
  1901. }
  1902. .fkit_form input[type="file"],
  1903. .fkit_form input[type="image"],
  1904. .fkit_form input[type="submit"],
  1905. .fkit_form input[type="reset"],
  1906. .fkit_form input[type="button"],
  1907. .fkit_form input[type="radio"],
  1908. .fkit_form input[type="checkbox"] {
  1909.   width: auto;
  1910. }
  1911. .fkit_form select,
  1912. .fkit_form input[type="file"] {
  1913.   height: 30px;
  1914.   /* In IE7, the height of the select element cannot be changed by height, only font-size */
  1915.  
  1916.   *margin-top: 4px;
  1917.   /* For IE7, add top margin to align select with labels */
  1918.  
  1919.   line-height: 30px;
  1920. }
  1921. .fkit_form select[multiple],
  1922. .fkit_form select[size] {
  1923.   height: auto;
  1924. }
  1925. .fkit_form select:focus,
  1926. .fkit_form input[type="file"]:focus,
  1927. .fkit_form input[type="radio"]:focus,
  1928. .fkit_form input[type="checkbox"]:focus {
  1929.   outline: thin dotted #333;
  1930.   outline: 5px auto -webkit-focus-ring-color;
  1931.   outline-offset: -2px;
  1932. }
  1933. .fkit_form input:-moz-placeholder,
  1934. .fkit_form textarea:-moz-placeholder {
  1935.   color: #808080;
  1936. }
  1937. .fkit_form input:-ms-input-placeholder,
  1938. .fkit_form textarea:-ms-input-placeholder {
  1939.   color: #808080;
  1940. }
  1941. .fkit_form input::-webkit-input-placeholder,
  1942. .fkit_form textarea::-webkit-input-placeholder {
  1943.   color: #808080;
  1944. }
  1945. .fkit_form input[disabled],
  1946. .fkit_form select[disabled],
  1947. .fkit_form textarea[disabled],
  1948. .fkit_form input[readonly],
  1949. .fkit_form select[readonly],
  1950. .fkit_form textarea[readonly] {
  1951.   cursor: not-allowed;
  1952.   background-color: #e6e6e6;
  1953.   color: #7f7f7f;
  1954. }
  1955. .fkit_form input[type="radio"][disabled],
  1956. .fkit_form input[type="checkbox"][disabled],
  1957. .fkit_form input[type="radio"][readonly],
  1958. .fkit_form input[type="checkbox"][readonly] {
  1959.   background-color: transparent;
  1960. }
  1961. .fkit_form fieldset .ui-multiselect {
  1962.   font-size: 14px;
  1963.   font-weight: normal;
  1964.   line-height: 20px;
  1965.   font-family: 'Roboto', 'Segoe UI', 'Helvetica Neue', Helvetica, sans-serif;
  1966.   height: 2.5rem;
  1967.   font-size: 0.875rem;
  1968.   background: #ffffff;
  1969.   border-radius: 4px;
  1970.   padding: 0.5rem;
  1971.   color: #4d4d4d;
  1972.   box-shadow: 0 1px 0 rgba(0, 0, 0, 0.075) inset;
  1973.   font-weight: 400;
  1974.   line-height: 1.6;
  1975.   margin-bottom: 0.25rem;
  1976.   transition: all 0.19s cubic-bezier(0.25, 0.8, 0.25, 1);
  1977.   background-color: #ffffff;
  1978.   border: 1px solid #b3b3b3;
  1979.   -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  1980.   -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  1981.   box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
  1982.   -webkit-transition: border linear .2s, box-shadow linear .2s;
  1983.   -moz-transition: border linear .2s, box-shadow linear .2s;
  1984.   -o-transition: border linear .2s, box-shadow linear .2s;
  1985.   transition: border linear .2s, box-shadow linear .2s;
  1986.   position: relative;
  1987.   width: 100%;
  1988.   box-sizing: border-box;
  1989.   box-shadow: none;
  1990.   width: 100% !important;
  1991. }
  1992. .fkit_form fieldset .ui-multiselect:hover {
  1993.   border-color: #2780f8;
  1994. }
  1995. .fkit_form fieldset .ui-multiselect:focus {
  1996.   border-color: #2780f8;
  1997.   box-shadow: 0 0 0.5rem rgba(39, 128, 248, 0.2);
  1998. }
  1999. .fkit_form fieldset .ui-multiselect:focus {
  2000.   border-color: rgba(82, 168, 236, 0.8);
  2001.   outline: 0;
  2002.   outline: thin dotted   \9;
  2003.   /* IE6-9 */
  2004.  
  2005.   -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(82,168,236,.6);
  2006.   -moz-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(82,168,236,.6);
  2007.   box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(82,168,236,.6);
  2008. }
  2009. .fkit_form fieldset .ui-multiselect select {
  2010.   -webkit-appearance: none;
  2011.   -moz-appearance: none;
  2012.   text-indent: 1px;
  2013.   text-overflow: '';
  2014.   outline: 0;
  2015.   height: 2.5rem;
  2016.   font-size: 0.875rem;
  2017.   background: #fafafa;
  2018.   border-radius: 4px;
  2019.   padding: 0.5rem;
  2020.   color: #4d4d4d;
  2021.   border: 1px solid #b3b3b3;
  2022.   box-shadow: 0 -2px 0 rgba(0, 0, 0, 0.075) inset, 0 2px 0 rgba(255, 255, 255, 0.75) inset;
  2023.   font-weight: 400;
  2024.   line-height: 1.6;
  2025.   width: 100%;
  2026.   box-sizing: border-box;
  2027.   margin-bottom: 0.25rem;
  2028.   transition: all 0.19s cubic-bezier(0.25, 0.8, 0.25, 1);
  2029.   position: relative;
  2030. }
  2031. .fkit_form fieldset .ui-multiselect:hover select {
  2032.   border-color: #2780f8;
  2033. }
  2034. .fkit_form fieldset .ui-multiselect:after {
  2035.   content: '';
  2036.   background: url("data:image/svg+xml;utf8, <svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path d='M8 11.4L2.6 6 4 4.6l4 4 4-4L13.4 6z' fill='%234d4d4d'/></svg>") no-repeat;
  2037.   width: 1rem;
  2038.   height: 1rem;
  2039.   position: absolute;
  2040.   right: .75rem;
  2041.   top: .75rem;
  2042.   transition: all 0.19s cubic-bezier(0.25, 0.8, 0.25, 1);
  2043. }
  2044. .fkit_form fieldset .ui-multiselect:hover:after {
  2045.   transform: translateY(10%);
  2046.   background: url("data:image/svg+xml;utf8, <svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path d='M8 11.4L2.6 6 4 4.6l4 4 4-4L13.4 6z' fill='%232780f8'/></svg>");
  2047. }
  2048. .fkit_form fieldset .ui-multiselect select:focus {
  2049.   box-shadow: 0 2px 0 rgba(0, 0, 0, 0.075) inset, 0 -2px 0 rgba(255, 255, 255, 0.75) inset;
  2050.   background-color: #ffffff;
  2051. }
  2052. .fkit_form fieldset .ui-multiselect:after,
  2053. .fkit_form fieldset .ui-multiselect:before {
  2054.   display: none;
  2055. }
  2056. .fkit_form fieldset .ui-multiselect span.ui-icon {
  2057.   margin-top: 2px;
  2058. }
  2059. .fkit_form .fc_form_smaller_fields .group {
  2060.   display: flex;
  2061. }
  2062. .fkit_form .fc_form_smaller_fields .group > label {
  2063.   display: block;
  2064. }
  2065. .fkit_form .fc_form_smaller_fields .group > field {
  2066.   width: 100%;
  2067.   display: flex;
  2068. }
  2069. .fkit_form .fc_form_smaller_fields .group > field input {
  2070.   width: 100%;
  2071. }
  2072. @media (max-width: 110rem) {
  2073.   .fkit_form .fc_form_smaller_fields .group {
  2074.     display: block;
  2075.   }
  2076. }
  2077. .fkit_form .body > .field_message,
  2078. .fkit_form > .field_message {
  2079.   font-size: 0.9rem;
  2080.   padding: 0.3rem;
  2081.   margin-bottom: 0.5rem;
  2082.   color: #a94442;
  2083.   background-color: #f2dede;
  2084.   border-left: 3px solid #a94442;
  2085. }
  2086. .fkit_form.fkit_form_wide_labels fieldset .group > label {
  2087.   width: 12rem;
  2088. }
  2089. .fkit_form.fkit_form_extra_wide_labels fieldset .group > label {
  2090.   width: 19rem;
  2091. }
  2092. .fkit_form fieldset .group {
  2093.   margin-bottom: 0.5rem;
  2094.   display: flex;
  2095.   box-sizing: border-box;
  2096.   padding: 0;
  2097. }
  2098. .fkit_form fieldset .group.hide {
  2099.   display: none;
  2100. }
  2101. @media (max-width: 46rem) {
  2102.   .fkit_form fieldset .group {
  2103.     display: block;
  2104.   }
  2105. }
  2106. .fkit_form fieldset .group > label {
  2107.   word-wrap: break-word;
  2108.   text-transform: capitalize;
  2109.   float: none;
  2110.   flex: none;
  2111.   padding: 0.5rem 0 0;
  2112.   width: 10rem;
  2113. }
  2114. .fkit_form fieldset .group.group_block {
  2115.   display: block;
  2116. }
  2117. .fkit_form fieldset .group.group_block.hide {
  2118.   display: none;
  2119. }
  2120. .fkit_form fieldset .group.group_block > label {
  2121.   width: 100%;
  2122. }
  2123. .fkit_form fieldset .group.group_announcement {
  2124.   display: block;
  2125.   font-size: 1rem;
  2126.   border-top: 1px solid rgba(0, 0, 0, 0.175);
  2127.   padding-top: 0.5rem;
  2128. }
  2129. .fkit_form fieldset .group .help {
  2130.   background: transparent;
  2131.   height: 2.5rem;
  2132.   width: 2.5rem;
  2133.   padding: 0.5rem;
  2134.   margin-top: 0.25rem;
  2135.   box-sizing: border-box;
  2136.   margin-right: -2.5rem;
  2137.   align-items: center;
  2138.   color: #b3b3b3;
  2139.   cursor: pointer;
  2140. }
  2141. .fkit_form fieldset .group .help svg {
  2142.   margin: 0 auto;
  2143. }
  2144. .fkit_form fieldset .group .help :hover {
  2145.   color: #4d4d4d;
  2146. }
  2147. .fkit_form fieldset .group .help.action {
  2148.   cursor: pointer;
  2149. }
  2150. .fkit_form fieldset .group:not(.group_block) field + field {
  2151.   margin-left: 1rem;
  2152. }
  2153. .fkit_form fieldset .group field {
  2154.   width: 100%;
  2155.   display: flex;
  2156.   align-items: center;
  2157.   position: relative;
  2158. }
  2159. .fkit_form fieldset .group field textarea,
  2160. .fkit_form fieldset .group field input,
  2161. .fkit_form fieldset .group field .uneditable-input,
  2162. .fkit_form fieldset .group field .ui-multiselect {
  2163.   width: 100%;
  2164.   float: none;
  2165. }
  2166. .fkit_form fieldset .group field .field_icon + input,
  2167. .fkit_form fieldset .group field .field_icon + input + input,
  2168. .fkit_form fieldset .group field .field_icon + .flatpickr-wrapper > input,
  2169. .fkit_form fieldset .group field .flatpickr-mobile {
  2170.   border-left-width: 0;
  2171.   border-top-left-radius: 0;
  2172.   border-bottom-left-radius: 0;
  2173. }
  2174. .fkit_form fieldset .group field.list_group {
  2175.   max-height: 350px;
  2176.   overflow-y: auto;
  2177.   overflow-x: visible;
  2178. }
  2179. .fkit_form fieldset .group field label {
  2180.   display: block;
  2181. }
  2182. .fkit_form fieldset .group field.multi_field {
  2183.   display: flex;
  2184. }
  2185. .fkit_form fieldset .group field.field_list {
  2186.   display: block;
  2187.   position: relative;
  2188. }
  2189. .fkit_form fieldset .group field.field_list .help {
  2190.   position: absolute;
  2191.   top: 0.34rem;
  2192.   right: 0;
  2193. }
  2194. .fkit_form fieldset .group field.field_list > field {
  2195.   display: block;
  2196.   margin: 0;
  2197. }
  2198. .fkit_form fieldset .group field .field_icon {
  2199.   display: flex;
  2200.   background: #f2f2f2;
  2201.   height: 2.5rem;
  2202.   width: 2.5rem;
  2203.   padding: 0.5rem;
  2204.   margin-bottom: 0.25rem;
  2205.   border: 1px solid #b3b3b3;
  2206.   border-radius: 4px 0 0 4px;
  2207.   box-sizing: border-box;
  2208.   align-items: center;
  2209.   color: rgba(0, 0, 0, 0.5);
  2210. }
  2211. .fkit_form fieldset .group field .field_icon svg {
  2212.   margin: 0 auto;
  2213. }
  2214. .fkit_form fieldset .group field.contains_message {
  2215.   padding-bottom: 1.2rem;
  2216. }
  2217. .fkit_form fieldset .group field.list_group {
  2218.   display: block;
  2219. }
  2220. .fkit_form fieldset .group field > label {
  2221.   float: none;
  2222.   width: 100%;
  2223.   font-size: 13px;
  2224.   padding-top: 8px;
  2225. }
  2226. .fkit_form fieldset .group.multi_column {
  2227.   display: -webkit-box;
  2228.   display: -ms-flexbox;
  2229.   display: flex;
  2230. }
  2231. .fkit_form fieldset .group.multi_column > .group {
  2232.   -webkit-box-flex: 1;
  2233.   -ms-flex: 1 1 auto;
  2234.   flex: 1 1 auto;
  2235.   box-sizing: border-box;
  2236.   width: 20%;
  2237.   padding-right: 1rem;
  2238. }
  2239. .fkit_form fieldset .group.multi_column > .group:last-of-type {
  2240.   padding-right: 0;
  2241. }
  2242. .fkit_form fieldset .group.error_group field {
  2243.   padding-bottom: 1.2rem;
  2244. }
  2245. .fkit_form fieldset .group.error_group field .field_icon {
  2246.   border-color: #f24f40;
  2247.   background-color: rgba(242, 79, 64, 0.05);
  2248.   color: rgba(121, 39, 32, 0.5);
  2249. }
  2250. .fkit_form fieldset .group.error_group field .field_message {
  2251.   color: #f24f40;
  2252. }
  2253. .fkit_form fieldset .group.error_group field.error_field .error,
  2254. .fkit_form fieldset .group.error_group .error {
  2255.   border-color: #f24f40;
  2256.   border-left-width: 5px;
  2257.   border-left-color: #f9a7a0;
  2258. }
  2259. .fkit_form fieldset .group.error_group field.error_field .error:hover,
  2260. .fkit_form fieldset .group.error_group .error:hover,
  2261. .fkit_form fieldset .group.error_group field.error_field .error:focus,
  2262. .fkit_form fieldset .group.error_group .error:focus {
  2263.   background-color: #ffffff;
  2264.   border-color: #c23f33;
  2265. }
  2266. .fkit_form fieldset .group.error_group field.error_field .error:focus,
  2267. .fkit_form fieldset .group.error_group .error:focus {
  2268.   box-shadow: 0 0 0.5rem rgba(242, 79, 64, 0.2);
  2269. }
  2270. .fkit_form fieldset .group.success field {
  2271.   padding-bottom: 1.2rem;
  2272. }
  2273. .fkit_form fieldset .group.success field .field_icon {
  2274.   border-color: #27ae60;
  2275.   background-color: rgba(39, 174, 96, 0.05);
  2276.   color: rgba(20, 87, 48, 0.5);
  2277. }
  2278. .fkit_form fieldset .group.success field .field_message {
  2279.   color: #27ae60;
  2280. }
  2281. .fkit_form fieldset .group.success field.error_field .error,
  2282. .fkit_form fieldset .group.success .error {
  2283.   border-color: #27ae60;
  2284.   border-left-width: 5px;
  2285.   border-left-color: #93d7b0;
  2286. }
  2287. .fkit_form fieldset .group.success field.error_field .error:hover,
  2288. .fkit_form fieldset .group.success .error:hover,
  2289. .fkit_form fieldset .group.success field.error_field .error:focus,
  2290. .fkit_form fieldset .group.success .error:focus {
  2291.   background-color: #ffffff;
  2292.   border-color: #1f8b4d;
  2293. }
  2294. .fkit_form fieldset .group.success field.error_field .error:focus,
  2295. .fkit_form fieldset .group.success .error:focus {
  2296.   box-shadow: 0 0 0.5rem rgba(39, 174, 96, 0.2);
  2297. }
  2298. .fkit_form fieldset .group.warning field {
  2299.   padding-bottom: 1.2rem;
  2300. }
  2301. .fkit_form fieldset .group.warning field .field_icon {
  2302.   border-color: #e6b41d;
  2303.   background-color: rgba(230, 180, 29, 0.05);
  2304.   color: rgba(115, 90, 15, 0.5);
  2305. }
  2306. .fkit_form fieldset .group.warning field .field_message {
  2307.   color: #e6b41d;
  2308. }
  2309. .fkit_form fieldset .group.warning field.error_field .error,
  2310. .fkit_form fieldset .group.warning .error {
  2311.   border-color: #e6b41d;
  2312.   border-left-width: 5px;
  2313.   border-left-color: #f3da8e;
  2314. }
  2315. .fkit_form fieldset .group.warning field.error_field .error:hover,
  2316. .fkit_form fieldset .group.warning .error:hover,
  2317. .fkit_form fieldset .group.warning field.error_field .error:focus,
  2318. .fkit_form fieldset .group.warning .error:focus {
  2319.   background-color: #ffffff;
  2320.   border-color: #b89017;
  2321. }
  2322. .fkit_form fieldset .group.warning field.error_field .error:focus,
  2323. .fkit_form fieldset .group.warning .error:focus {
  2324.   box-shadow: 0 0 0.5rem rgba(230, 180, 29, 0.2);
  2325. }
  2326. .fkit_form fieldset .group.disabled field {
  2327.   padding-bottom: 1.2rem;
  2328. }
  2329. .fkit_form fieldset .group.disabled field .field_icon {
  2330.   border-color: #e6e6e6;
  2331.   background-color: rgba(230, 230, 230, 0.05);
  2332.   color: rgba(115, 115, 115, 0.5);
  2333. }
  2334. .fkit_form fieldset .group.disabled field .field_message {
  2335.   color: #e6e6e6;
  2336. }
  2337. .fkit_form fieldset .group.disabled field.error_field .error,
  2338. .fkit_form fieldset .group.disabled .error {
  2339.   border-color: #e6e6e6;
  2340.   border-left-width: 5px;
  2341.   border-left-color: #f2f2f2;
  2342. }
  2343. .fkit_form fieldset .group.disabled field.error_field .error:hover,
  2344. .fkit_form fieldset .group.disabled .error:hover,
  2345. .fkit_form fieldset .group.disabled field.error_field .error:focus,
  2346. .fkit_form fieldset .group.disabled .error:focus {
  2347.   background-color: #ffffff;
  2348.   border-color: #b8b8b8;
  2349. }
  2350. .fkit_form fieldset .group.disabled field.error_field .error:focus,
  2351. .fkit_form fieldset .group.disabled .error:focus {
  2352.   box-shadow: 0 0 0.5rem rgba(230, 230, 230, 0.2);
  2353. }
  2354. .fkit_form fieldset .group.disabled input {
  2355.   border-color: #e6e6e6;
  2356. }
  2357. .fkit_form fieldset .group.disabled input:hover,
  2358. .fkit_form fieldset .group.disabled input:focus {
  2359.   border-color: #cfcfcf;
  2360. }
  2361. .fkit_form fieldset .group.disabled input:disabled {
  2362.   background-color: rgba(230, 230, 230, 0.3);
  2363.   box-shadow: none;
  2364. }
  2365. .fkit_form fieldset .group .toggle_f_subtask {
  2366.   margin: 0;
  2367. }
  2368. .fkit_form fieldset .group field [class*=message] {
  2369.   font-size: 0.775rem;
  2370.   color: #808080;
  2371.   text-align: left;
  2372.   display: block;
  2373.   width: 100%;
  2374.   position: absolute;
  2375.   top: 100%;
  2376.   left: 0;
  2377.   margin-top: -1.4rem;
  2378. }
  2379. .fkit_form fieldset .group.group_block field.error_field .field_message {
  2380.   margin-top: -0.2em;
  2381. }
  2382. .fkit_form fieldset.fc_mini label {
  2383.   display: block;
  2384. }
  2385. .fkit_form fieldset.fc_right_labels .group > label {
  2386.   text-align: right;
  2387.   padding-right: 15px !important;
  2388.   box-sizing: border-box;
  2389. }
  2390. .fkit_form fieldset.fc_wizard .group {
  2391.   margin: 0 0 15px 85px;
  2392. }
  2393. .fkit_form fieldset.fc_wizard .group .clear-borders {
  2394.   border-left: 0;
  2395.   border-right: 0;
  2396.   border-top: 0;
  2397. }
  2398. .fkit_form fieldset.fc_wizard .group textarea,
  2399. .fkit_form fieldset.fc_wizard .group input[type="text"],
  2400. .fkit_form fieldset.fc_wizard .group input[type="password"],
  2401. .fkit_form fieldset.fc_wizard .group input[type="datetime"],
  2402. .fkit_form fieldset.fc_wizard .group input[type="datetime-local"],
  2403. .fkit_form fieldset.fc_wizard .group input[type="date"],
  2404. .fkit_form fieldset.fc_wizard .group input[type="month"],
  2405. .fkit_form fieldset.fc_wizard .group input[type="time"],
  2406. .fkit_form fieldset.fc_wizard .group input[type="week"],
  2407. .fkit_form fieldset.fc_wizard .group input[type="number"],
  2408. .fkit_form fieldset.fc_wizard .group input[type="email"],
  2409. .fkit_form fieldset.fc_wizard .group input[type="url"],
  2410. .fkit_form fieldset.fc_wizard .group input[type="search"],
  2411. .fkit_form fieldset.fc_wizard .group input[type="tel"],
  2412. .fkit_form fieldset.fc_wizard .group input[type="color"],
  2413. .fkit_form fieldset.fc_wizard .group .uneditable-input {
  2414.   border-left: 0;
  2415.   border-right: 0;
  2416.   border-top: 0;
  2417.   box-shadow: none;
  2418. }
  2419. .fkit_form fieldset.fc_wizard .group field.contains_icon .field_icon {
  2420.   background: none;
  2421.   border-left: 0;
  2422.   border-right: 0;
  2423.   border-top: 0;
  2424. }
  2425. .fkit_form fieldset.fc_wizard .group field.contains_icon input {
  2426.   border-left: 0 !important;
  2427. }
  2428. .fkit_form .form_multi_column {
  2429.   display: flex;
  2430.   flex-wrap: wrap;
  2431.   /* one item */
  2432.  
  2433.   /* two items */
  2434.  
  2435.   /* three items */
  2436.  
  2437. }
  2438. .fkit_form .form_multi_column fieldset {
  2439.   box-sizing: border-box;
  2440. }
  2441. .fkit_form .form_multi_column fieldset:first-child {
  2442.   padding-right: 25px;
  2443. }
  2444. .fkit_form .form_multi_column fieldset:last-child {
  2445.   padding-left: 25px;
  2446. }
  2447. .fkit_form .form_multi_column fieldset:nth-child(2):nth-last-child(2) {
  2448.   padding-left: 25px;
  2449.   padding-right: 25px;
  2450. }
  2451. .fkit_form .form_multi_column fieldset:first-child:nth-last-child(1) {
  2452.   flex-grow: 1;
  2453.   width: 100%;
  2454. }
  2455. .fkit_form .form_multi_column fieldset:nth-child(1):nth-last-child(2),
  2456. .fkit_form .form_multi_column fieldset:nth-child(2):nth-last-child(1) {
  2457.   flex-grow: 1;
  2458.   width: 50%;
  2459. }
  2460. @media (max-width: 76rem) {
  2461.   .fkit_form .form_multi_column fieldset:nth-child(1):nth-last-child(2) .group,
  2462.   .fkit_form .form_multi_column fieldset:nth-child(2):nth-last-child(1) .group {
  2463.     display: block;
  2464.   }
  2465. }
  2466. .fkit_form .form_multi_column fieldset:nth-child(1):nth-last-child(3),
  2467. .fkit_form .form_multi_column fieldset:nth-child(2):nth-last-child(2),
  2468. .fkit_form .form_multi_column fieldset:nth-child(3):nth-last-child(1) {
  2469.   flex-grow: 1;
  2470.   width: 30%;
  2471. }
  2472. .fkit_form .form_multi_column fieldset:nth-child(1):nth-last-child(3) .group,
  2473. .fkit_form .form_multi_column fieldset:nth-child(2):nth-last-child(2) .group,
  2474. .fkit_form .form_multi_column fieldset:nth-child(3):nth-last-child(1) .group {
  2475.   display: flex;
  2476. }
  2477. .fkit_form .form_multi_column fieldset:nth-child(1):nth-last-child(3) .group > label,
  2478. .fkit_form .form_multi_column fieldset:nth-child(2):nth-last-child(2) .group > label,
  2479. .fkit_form .form_multi_column fieldset:nth-child(3):nth-last-child(1) .group > label {
  2480.   display: block;
  2481. }
  2482. .fkit_form .form_multi_column fieldset:nth-child(1):nth-last-child(3) .group > field,
  2483. .fkit_form .form_multi_column fieldset:nth-child(2):nth-last-child(2) .group > field,
  2484. .fkit_form .form_multi_column fieldset:nth-child(3):nth-last-child(1) .group > field {
  2485.   width: 100%;
  2486.   display: flex;
  2487. }
  2488. .fkit_form .form_multi_column fieldset:nth-child(1):nth-last-child(3) .group > field input,
  2489. .fkit_form .form_multi_column fieldset:nth-child(2):nth-last-child(2) .group > field input,
  2490. .fkit_form .form_multi_column fieldset:nth-child(3):nth-last-child(1) .group > field input {
  2491.   width: 100%;
  2492. }
  2493. @media (max-width: 110rem) {
  2494.   .fkit_form .form_multi_column fieldset:nth-child(1):nth-last-child(3) .group,
  2495.   .fkit_form .form_multi_column fieldset:nth-child(2):nth-last-child(2) .group,
  2496.   .fkit_form .form_multi_column fieldset:nth-child(3):nth-last-child(1) .group {
  2497.     display: block;
  2498.   }
  2499. }
  2500. .fkit_form div.footer {
  2501.   text-align: right;
  2502.   padding: 0.9rem 2rem 1.1rem;
  2503. }
  2504. .fkit_form div.footer input[type=submit],
  2505. .fkit_form div.footer button[type=submit] {
  2506.   background: #ffffff;
  2507.   color: #4d4d4d;
  2508.   border-color: rgba(0, 0, 0, 0.175);
  2509.   border-width: 1px;
  2510.   border-style: solid;
  2511.   width: auto;
  2512.   display: inline-flex;
  2513.   align-items: center;
  2514.   justify-content: center;
  2515.   text-align: center;
  2516.   text-transform: capitalize;
  2517.   padding: .5rem .75rem;
  2518.   margin: 0 .25rem;
  2519.   height: 2.5rem;
  2520.   min-width: 2.5rem;
  2521.   font-size: 0.875rem;
  2522.   border-radius: 4px;
  2523.   box-shadow: none;
  2524.   transition: all 0.19s cubic-bezier(0.25, 0.8, 0.25, 1);
  2525.   font-weight: 500;
  2526.   text-decoration: none;
  2527.   outline: 0;
  2528.   box-sizing: border-box;
  2529.   cursor: pointer;
  2530.   white-space: nowrap;
  2531.   text-overflow: ellipsis;
  2532.   background-color: #2780f8;
  2533.   color: #ffffff;
  2534.   text-shadow: 0 1px 0 rgba(0, 0, 0, 0.125);
  2535. }
  2536. .fkit_form div.footer input[type=submit].hide,
  2537. .fkit_form div.footer button[type=submit].hide {
  2538.   display: none;
  2539. }
  2540. .fkit_form div.footer input[type=submit]:hover,
  2541. .fkit_form div.footer button[type=submit]:hover {
  2542.   box-shadow: 0 2px 0 0 rgba(0, 0, 0, 0.0375), 0 -2px 0 0px rgba(0, 0, 0, 0.0875) inset;
  2543.   border-color: rgba(0, 0, 0, 0.25);
  2544. }
  2545. .fkit_form div.footer input[type=submit].btn-xxs,
  2546. .fkit_form div.footer button[type=submit].btn-xxs {
  2547.   font-size: .625rem;
  2548.   padding: .25rem .25rem;
  2549.   height: 1.5rem;
  2550.   min-width: 1.5rem;
  2551. }
  2552. .fkit_form div.footer input[type=submit].btn-xs,
  2553. .fkit_form div.footer button[type=submit].btn-xs {
  2554.   font-size: .625rem;
  2555.   padding: .5rem .5rem;
  2556.   height: 2rem;
  2557.   min-width: 2rem;
  2558. }
  2559. .fkit_form div.footer input[type=submit].btn-s,
  2560. .fkit_form div.footer button[type=submit].btn-s {
  2561.   font-size: .75rem;
  2562.   padding: .5rem .5rem;
  2563.   height: 2.25rem;
  2564.   min-width: 2.25rem;
  2565. }
  2566. .fkit_form div.footer input[type=submit].btn-m,
  2567. .fkit_form div.footer button[type=submit].btn-m {
  2568.   font-size: .875rem;
  2569.   padding: .5rem .75rem;
  2570.   height: 2.5rem;
  2571.   min-width: 2.5rem;
  2572. }
  2573. .fkit_form div.footer input[type=submit].btn-l,
  2574. .fkit_form div.footer button[type=submit].btn-l {
  2575.   font-size: 1rem;
  2576.   padding: .75rem 1.5rem;
  2577.   height: 2.75rem;
  2578.   min-width: 2.75rem;
  2579. }
  2580. .fkit_form div.footer input[type=submit].btn-xl,
  2581. .fkit_form div.footer button[type=submit].btn-xl {
  2582.   font-size: 1.125rem;
  2583.   padding: .875rem 1.75rem;
  2584.   height: 3rem;
  2585.   min-width: 3rem;
  2586. }
  2587. .fkit_form div.footer input[type=submit].btn-clean,
  2588. .fkit_form div.footer button[type=submit].btn-clean {
  2589.   background-color: transparent;
  2590.   border-color: transparent;
  2591.   color: #748ca8;
  2592. }
  2593. .fkit_form div.footer input[type=submit].btn-clean:hover,
  2594. .fkit_form div.footer button[type=submit].btn-clean:hover {
  2595.   background-color: #ffffff;
  2596.   color: #2373df;
  2597.   border-color: rgba(0, 0, 0, 0.175);
  2598. }
  2599. .fkit_form div.footer input[type=submit].btn-default,
  2600. .fkit_form div.footer button[type=submit].btn-default {
  2601.   background-color: #f7f8fa;
  2602.   color: #748ca8;
  2603. }
  2604. .fkit_form div.footer input[type=submit].btn-default:hover,
  2605. .fkit_form div.footer button[type=submit].btn-default:hover {
  2606.   background-color: #ffffff;
  2607.   color: #2373df;
  2608. }
  2609. .fkit_form div.footer input[type=submit].btn-neutral,
  2610. .fkit_form div.footer button[type=submit].btn-neutral {
  2611.   background-color: #2780f8;
  2612.   color: #ffffff;
  2613.   text-shadow: 0 1px 0 rgba(0, 0, 0, 0.125);
  2614. }
  2615. .fkit_form div.footer input[type=submit].btn-neutral:hover,
  2616. .fkit_form div.footer button[type=submit].btn-neutral:hover {
  2617.   background-color: #3d8df9;
  2618. }
  2619. .fkit_form div.footer input[type=submit].btn-positive,
  2620. .fkit_form div.footer button[type=submit].btn-positive {
  2621.   background-color: #27ae60;
  2622.   color: #ffffff;
  2623.   text-shadow: 0 1px 0 rgba(0, 0, 0, 0.125);
  2624. }
  2625. .fkit_form div.footer input[type=submit].btn-positive:hover,
  2626. .fkit_form div.footer button[type=submit].btn-positive:hover {
  2627.   background-color: #3db670;
  2628. }
  2629. .fkit_form div.footer input[type=submit].btn-negative,
  2630. .fkit_form div.footer button[type=submit].btn-negative {
  2631.   background-color: #f24f40;
  2632.   color: #ffffff;
  2633.   text-shadow: 0 1px 0 rgba(0, 0, 0, 0.125);
  2634. }
  2635. .fkit_form div.footer input[type=submit].btn-negative:hover,
  2636. .fkit_form div.footer button[type=submit].btn-negative:hover {
  2637.   background-color: #f36153;
  2638. }
  2639. .fkit_form div.footer input[type=submit].btn-warning,
  2640. .fkit_form div.footer button[type=submit].btn-warning {
  2641.   background-color: #e6b41d;
  2642.   color: #ffffff;
  2643.   text-shadow: 0 1px 0 rgba(0, 0, 0, 0.125);
  2644. }
  2645. .fkit_form div.footer input[type=submit].btn-warning:hover,
  2646. .fkit_form div.footer button[type=submit].btn-warning:hover {
  2647.   background-color: #e9bc34;
  2648. }
  2649. .fkit_form div.footer input[type=submit].btn-hover-neutral:hover,
  2650. .fkit_form div.footer button[type=submit].btn-hover-neutral:hover {
  2651.   background-color: #5299f9;
  2652.   color: #ffffff;
  2653.   text-shadow: 0 1px 0 rgba(0, 0, 0, 0.125);
  2654. }
  2655. .fkit_form div.footer input[type=submit].btn-hover-positive:hover,
  2656. .fkit_form div.footer button[type=submit].btn-hover-positive:hover {
  2657.   background-color: #27ae60;
  2658.   color: #ffffff;
  2659.   text-shadow: 0 1px 0 rgba(0, 0, 0, 0.125);
  2660. }
  2661. .fkit_form div.footer input[type=submit].btn-hover-negative:hover,
  2662. .fkit_form div.footer button[type=submit].btn-hover-negative:hover {
  2663.   background-color: #f24f40;
  2664.   color: #ffffff;
  2665. }
  2666. .fkit_form div.footer input[type=submit].btn-hover-warning:hover,
  2667. .fkit_form div.footer button[type=submit].btn-hover-warning:hover {
  2668.   background-color: #e6b41d;
  2669.   color: #ffffff;
  2670. }
  2671. .fkit_form div.footer input[type=submit].btn-hover-disabled:hover,
  2672. .fkit_form div.footer button[type=submit].btn-hover-disabled:hover {
  2673.   background-color: #e6e6e6;
  2674.   color: #666666;
  2675.   cursor: default;
  2676. }
  2677. .fkit_form div.footer input[type=submit].btn-disabled,
  2678. .fkit_form div.footer button[type=submit].btn-disabled,
  2679. .fkit_form div.footer input[type=submit].disabled,
  2680. .fkit_form div.footer button[type=submit].disabled {
  2681.   background-color: #e6e6e6;
  2682.   color: #666666;
  2683.   cursor: default;
  2684.   box-shadow: none;
  2685.   text-shadow: none;
  2686. }
  2687. .fkit_form div.footer input[type=submit].btn-disabled:hover,
  2688. .fkit_form div.footer button[type=submit].btn-disabled:hover,
  2689. .fkit_form div.footer input[type=submit].disabled:hover,
  2690. .fkit_form div.footer button[type=submit].disabled:hover {
  2691.   background-color: #d9d9d9;
  2692.   color: #666666;
  2693.   text-shadow: none;
  2694. }
  2695. .fkit_form div.footer input[type=submit].btn-notext,
  2696. .fkit_form div.footer button[type=submit].btn-notext {
  2697.   font-size: 0;
  2698.   line-height: 0;
  2699.   padding: .25rem;
  2700.   margin: 0;
  2701. }
  2702. .fkit_form div.footer input[type=submit].btn-notext svg,
  2703. .fkit_form div.footer button[type=submit].btn-notext svg {
  2704.   margin: 0 auto;
  2705.   pointer-events: none;
  2706. }
  2707. .fkit_form div.footer input[type=submit].btn-reset,
  2708. .fkit_form div.footer button[type=submit].btn-reset {
  2709.   border: none;
  2710.   margin: 0;
  2711. }
  2712. .fkit_form div.footer input[type=submit].btn-reset:hover,
  2713. .fkit_form div.footer button[type=submit].btn-reset:hover {
  2714.   box-shadow: none;
  2715.   border-color: rgba(0, 0, 0, 0.25);
  2716. }
  2717. .fkit_form div.footer input[type=submit].btn-asis,
  2718. .fkit_form div.footer button[type=submit].btn-asis {
  2719.   text-transform: none;
  2720. }
  2721. .fkit_form div.footer input[type=submit]:hover,
  2722. .fkit_form div.footer button[type=submit]:hover {
  2723.   background-color: #3d8df9;
  2724. }
  2725. .fkit_form div.footer .cancel {
  2726.   background: #ffffff;
  2727.   color: #4d4d4d;
  2728.   border-color: rgba(0, 0, 0, 0.175);
  2729.   border-width: 1px;
  2730.   border-style: solid;
  2731.   width: auto;
  2732.   display: inline-flex;
  2733.   align-items: center;
  2734.   justify-content: center;
  2735.   text-align: center;
  2736.   text-transform: capitalize;
  2737.   padding: .5rem .75rem;
  2738.   margin: 0 .25rem;
  2739.   height: 2.5rem;
  2740.   min-width: 2.5rem;
  2741.   font-size: 0.875rem;
  2742.   border-radius: 4px;
  2743.   box-shadow: none;
  2744.   transition: all 0.19s cubic-bezier(0.25, 0.8, 0.25, 1);
  2745.   font-weight: 500;
  2746.   text-decoration: none;
  2747.   outline: 0;
  2748.   box-sizing: border-box;
  2749.   cursor: pointer;
  2750.   white-space: nowrap;
  2751.   text-overflow: ellipsis;
  2752.   background-color: transparent;
  2753.   border-color: transparent;
  2754.   color: #748ca8;
  2755.   color: #f24f40;
  2756.   margin-right: .2rem;
  2757. }
  2758. .fkit_form div.footer .cancel.hide {
  2759.   display: none;
  2760. }
  2761. .fkit_form div.footer .cancel:hover {
  2762.   box-shadow: 0 2px 0 0 rgba(0, 0, 0, 0.0375), 0 -2px 0 0px rgba(0, 0, 0, 0.0875) inset;
  2763.   border-color: rgba(0, 0, 0, 0.25);
  2764. }
  2765. .fkit_form div.footer .cancel.btn-xxs {
  2766.   font-size: .625rem;
  2767.   padding: .25rem .25rem;
  2768.   height: 1.5rem;
  2769.   min-width: 1.5rem;
  2770. }
  2771. .fkit_form div.footer .cancel.btn-xs {
  2772.   font-size: .625rem;
  2773.   padding: .5rem .5rem;
  2774.   height: 2rem;
  2775.   min-width: 2rem;
  2776. }
  2777. .fkit_form div.footer .cancel.btn-s {
  2778.   font-size: .75rem;
  2779.   padding: .5rem .5rem;
  2780.   height: 2.25rem;
  2781.   min-width: 2.25rem;
  2782. }
  2783. .fkit_form div.footer .cancel.btn-m {
  2784.   font-size: .875rem;
  2785.   padding: .5rem .75rem;
  2786.   height: 2.5rem;
  2787.   min-width: 2.5rem;
  2788. }
  2789. .fkit_form div.footer .cancel.btn-l {
  2790.   font-size: 1rem;
  2791.   padding: .75rem 1.5rem;
  2792.   height: 2.75rem;
  2793.   min-width: 2.75rem;
  2794. }
  2795. .fkit_form div.footer .cancel.btn-xl {
  2796.   font-size: 1.125rem;
  2797.   padding: .875rem 1.75rem;
  2798.   height: 3rem;
  2799.   min-width: 3rem;
  2800. }
  2801. .fkit_form div.footer .cancel.btn-clean {
  2802.   background-color: transparent;
  2803.   border-color: transparent;
  2804.   color: #748ca8;
  2805. }
  2806. .fkit_form div.footer .cancel.btn-clean:hover {
  2807.   background-color: #ffffff;
  2808.   color: #2373df;
  2809.   border-color: rgba(0, 0, 0, 0.175);
  2810. }
  2811. .fkit_form div.footer .cancel.btn-default {
  2812.   background-color: #f7f8fa;
  2813.   color: #748ca8;
  2814. }
  2815. .fkit_form div.footer .cancel.btn-default:hover {
  2816.   background-color: #ffffff;
  2817.   color: #2373df;
  2818. }
  2819. .fkit_form div.footer .cancel.btn-neutral {
  2820.   background-color: #2780f8;
  2821.   color: #ffffff;
  2822.   text-shadow: 0 1px 0 rgba(0, 0, 0, 0.125);
  2823. }
  2824. .fkit_form div.footer .cancel.btn-neutral:hover {
  2825.   background-color: #3d8df9;
  2826. }
  2827. .fkit_form div.footer .cancel.btn-positive {
  2828.   background-color: #27ae60;
  2829.   color: #ffffff;
  2830.   text-shadow: 0 1px 0 rgba(0, 0, 0, 0.125);
  2831. }
  2832. .fkit_form div.footer .cancel.btn-positive:hover {
  2833.   background-color: #3db670;
  2834. }
  2835. .fkit_form div.footer .cancel.btn-negative {
  2836.   background-color: #f24f40;
  2837.   color: #ffffff;
  2838.   text-shadow: 0 1px 0 rgba(0, 0, 0, 0.125);
  2839. }
  2840. .fkit_form div.footer .cancel.btn-negative:hover {
  2841.   background-color: #f36153;
  2842. }
  2843. .fkit_form div.footer .cancel.btn-warning {
  2844.   background-color: #e6b41d;
  2845.   color: #ffffff;
  2846.   text-shadow: 0 1px 0 rgba(0, 0, 0, 0.125);
  2847. }
  2848. .fkit_form div.footer .cancel.btn-warning:hover {
  2849.   background-color: #e9bc34;
  2850. }
  2851. .fkit_form div.footer .cancel.btn-hover-neutral:hover {
  2852.   background-color: #5299f9;
  2853.   color: #ffffff;
  2854.   text-shadow: 0 1px 0 rgba(0, 0, 0, 0.125);
  2855. }
  2856. .fkit_form div.footer .cancel.btn-hover-positive:hover {
  2857.   background-color: #27ae60;
  2858.   color: #ffffff;
  2859.   text-shadow: 0 1px 0 rgba(0, 0, 0, 0.125);
  2860. }
  2861. .fkit_form div.footer .cancel.btn-hover-negative:hover {
  2862.   background-color: #f24f40;
  2863.   color: #ffffff;
  2864. }
  2865. .fkit_form div.footer .cancel.btn-hover-warning:hover {
  2866.   background-color: #e6b41d;
  2867.   color: #ffffff;
  2868. }
  2869. .fkit_form div.footer .cancel.btn-hover-disabled:hover {
  2870.   background-color: #e6e6e6;
  2871.   color: #666666;
  2872.   cursor: default;
  2873. }
  2874. .fkit_form div.footer .cancel.btn-disabled,
  2875. .fkit_form div.footer .cancel.disabled {
  2876.   background-color: #e6e6e6;
  2877.   color: #666666;
  2878.   cursor: default;
  2879.   box-shadow: none;
  2880.   text-shadow: none;
  2881. }
  2882. .fkit_form div.footer .cancel.btn-disabled:hover,
  2883. .fkit_form div.footer .cancel.disabled:hover {
  2884.   background-color: #d9d9d9;
  2885.   color: #666666;
  2886.   text-shadow: none;
  2887. }
  2888. .fkit_form div.footer .cancel.btn-notext {
  2889.   font-size: 0;
  2890.   line-height: 0;
  2891.   padding: .25rem;
  2892.   margin: 0;
  2893. }
  2894. .fkit_form div.footer .cancel.btn-notext svg {
  2895.   margin: 0 auto;
  2896.   pointer-events: none;
  2897. }
  2898. .fkit_form div.footer .cancel.btn-reset {
  2899.   border: none;
  2900.   margin: 0;
  2901. }
  2902. .fkit_form div.footer .cancel.btn-reset:hover {
  2903.   box-shadow: none;
  2904.   border-color: rgba(0, 0, 0, 0.25);
  2905. }
  2906. .fkit_form div.footer .cancel.btn-asis {
  2907.   text-transform: none;
  2908. }
  2909. .fkit_form div.footer .cancel:hover {
  2910.   background-color: #ffffff;
  2911.   color: #2373df;
  2912.   border-color: rgba(0, 0, 0, 0.175);
  2913. }
  2914. .fkit_form div.footer_mini {
  2915.   text-align: right;
  2916. }
  2917. .fkit_form div.footer_mini .btn {
  2918.   margin-right: 0;
  2919. }
  2920. .fkit_form div.fc-footer {
  2921.   padding: 10px;
  2922.   margin-top: 10px;
  2923.   border-top: 1px solid #b3b3b3;
  2924.   text-align: right;
  2925. }
  2926. .fkit_form .fc_select {
  2927.   position: relative;
  2928.   width: 100%;
  2929.   box-sizing: border-box;
  2930. }
  2931. .fkit_form .fc_select select {
  2932.   -webkit-appearance: none;
  2933.   -moz-appearance: none;
  2934.   text-indent: 1px;
  2935.   text-overflow: '';
  2936.   outline: 0;
  2937.   height: 2.5rem;
  2938.   font-size: 0.875rem;
  2939.   background: #fafafa;
  2940.   border-radius: 4px;
  2941.   padding: 0.5rem;
  2942.   color: #4d4d4d;
  2943.   border: 1px solid #b3b3b3;
  2944.   box-shadow: 0 -2px 0 rgba(0, 0, 0, 0.075) inset, 0 2px 0 rgba(255, 255, 255, 0.75) inset;
  2945.   font-weight: 400;
  2946.   line-height: 1.6;
  2947.   width: 100%;
  2948.   box-sizing: border-box;
  2949.   margin-bottom: 0.25rem;
  2950.   transition: all 0.19s cubic-bezier(0.25, 0.8, 0.25, 1);
  2951.   position: relative;
  2952. }
  2953. .fkit_form .fc_select:hover select {
  2954.   border-color: #2780f8;
  2955. }
  2956. .fkit_form .fc_select:after {
  2957.   content: '';
  2958.   background: url("data:image/svg+xml;utf8, <svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path d='M8 11.4L2.6 6 4 4.6l4 4 4-4L13.4 6z' fill='%234d4d4d'/></svg>") no-repeat;
  2959.   width: 1rem;
  2960.   height: 1rem;
  2961.   position: absolute;
  2962.   right: .75rem;
  2963.   top: .75rem;
  2964.   transition: all 0.19s cubic-bezier(0.25, 0.8, 0.25, 1);
  2965. }
  2966. .fkit_form .fc_select:hover:after {
  2967.   transform: translateY(10%);
  2968.   background: url("data:image/svg+xml;utf8, <svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path d='M8 11.4L2.6 6 4 4.6l4 4 4-4L13.4 6z' fill='%232780f8'/></svg>");
  2969. }
  2970. .fkit_form .fc_select select:focus {
  2971.   box-shadow: 0 2px 0 rgba(0, 0, 0, 0.075) inset, 0 -2px 0 rgba(255, 255, 255, 0.75) inset;
  2972.   background-color: #ffffff;
  2973. }
  2974. .fkit_form .option {
  2975.   display: inline-block;
  2976.   vertical-align: top;
  2977.   position: relative;
  2978.   width: 18px;
  2979.   height: 18px;
  2980.   -webkit-user-select: none;
  2981.   -moz-user-select: none;
  2982.   -ms-user-select: none;
  2983.   -o-user-select: none;
  2984.   user-select: none;
  2985. }
  2986. .fkit_form .option > input {
  2987.   position: absolute;
  2988.   left: 0;
  2989.   width: inherit;
  2990.   height: inherit;
  2991.   opacity: 0;
  2992. }
  2993. .fkit_form .radio {
  2994.   border-radius: 9px !important;
  2995. }
  2996. .fkit_form input:checked + .checkbox:before,
  2997. .fkit_form input:checked + .radio:before {
  2998.   display: block;
  2999. }
  3000. .fkit_form .radio:before {
  3001.   margin: 5px;
  3002.   width: 6px;
  3003.   height: 6px;
  3004.   background: #666666;
  3005.   border-radius: 3px;
  3006.   -webkit-box-shadow: inset 0 1px rgba(0, 0, 0, 0.1);
  3007.   box-shadow: inset 0 1px rgba(0, 0, 0, 0.1);
  3008. }
  3009. .fkit_form input:focus + .checkbox,
  3010. .fkit_form input:focus + .radio,
  3011. .fkit_form input.focus + .checkbox,
  3012. .fkit_form input.focus + .radio {
  3013.   border-color: #6e9ef7;
  3014.   -webkit-box-shadow: 0 0 2px rgba(110, 158, 247, 0.5);
  3015.   box-shadow: 0 0 2px rgba(110, 158, 247, 0.5);
  3016. }
  3017. .fkit_form .lt-ie9 .checkbox,
  3018. .fkit_form .lt-ie9 .radio {
  3019.   display: none;
  3020. }
  3021. .fkit_form input:checked + .checkbox,
  3022. .fkit_form input:checked + .radio {
  3023.   background: #eee;
  3024.   border-color: #c5c5c5 #c1c1c1 #b8b8b8;
  3025.   background-image: -webkit-linear-gradient(top, #f9f9f9, #e4e4e4);
  3026.   background-image: -moz-linear-gradient(top, #f9f9f9, #e4e4e4);
  3027.   background-image: -o-linear-gradient(top, #f9f9f9, #e4e4e4);
  3028.   background-image: linear-gradient(to bottom, #f9f9f9, #e4e4e4);
  3029.   -webkit-box-shadow: inset 0 1px #fcfcfc, 0 1px 1px rgba(0, 0, 0, 0.05);
  3030.   box-shadow: inset 0 1px #fcfcfc, 0 1px 1px rgba(0, 0, 0, 0.05);
  3031. }
  3032. .fkit_form .checkbox:before,
  3033. .fkit_form .radio:before {
  3034.   content: '';
  3035.   display: none;
  3036. }
  3037. .fkit_form .checkbox,
  3038. .fkit_form .radio {
  3039.   display: block;
  3040.   height: 100%;
  3041.   background: #fcfcfc;
  3042.   border: 1px solid #c6c6c6;
  3043.   border-top-color: #b6b6b6;
  3044.   border-radius: 2px;
  3045.   -webkit-box-sizing: border-box;
  3046.   -moz-box-sizing: border-box;
  3047.   box-sizing: border-box;
  3048.   -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.08), 0 1px rgba(255, 255, 255, 0.6);
  3049.   box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.08), 0 1px rgba(255, 255, 255, 0.6);
  3050. }
  3051. .fkit_form .lt-ie9 .option > input {
  3052.   position: static;
  3053.   padding: 0;
  3054. }
  3055. .fkit_form .checkbox:before {
  3056.   position: absolute;
  3057.   top: 5px;
  3058.   left: 4px;
  3059.   width: 8px;
  3060.   height: 3px;
  3061.   border: solid #666666;
  3062.   border-width: 0 0 3px 3px;
  3063.   -webkit-transform: rotate(-45deg);
  3064.   -moz-transform: rotate(-45deg);
  3065.   -ms-transform: rotate(-45deg);
  3066.   -o-transform: rotate(-45deg);
  3067.   transform: rotate(-45deg);
  3068. }
  3069. .fkit_form .switch_square label,
  3070. .fkit_form .switch_square label:before {
  3071.   border-radius: 2px;
  3072. }
  3073. .fkit_form .switch,
  3074. .fkit_form .switcher {
  3075.   display: inline-block;
  3076.   vertical-align: top;
  3077.   position: relative;
  3078.   width: 69px;
  3079.   -webkit-user-select: none;
  3080.   -moz-user-select: none;
  3081.   -ms-user-select: none;
  3082.   user-select: none;
  3083. }
  3084. .fkit_form .switch > input:focus,
  3085. .fkit_form .switcher > input:focus {
  3086.   opacity: 1;
  3087.   outline: 1px solid #6e9ef7;
  3088. }
  3089. .fkit_form .switch > label:before,
  3090. .fkit_form .switcher > label:before {
  3091.   content: '';
  3092.   display: block;
  3093.   margin: -1px 0 0 -1px;
  3094.   width: 34px;
  3095.   height: 32px;
  3096.   background: #eee;
  3097.   background-clip: padding-box;
  3098.   border: 1px solid #c1c1c1;
  3099.   border-radius: 2px;
  3100.   background-image: -webkit-linear-gradient(top, #f6f6f6, #e4e4e4);
  3101.   background-image: -moz-linear-gradient(top, #f6f6f6, #e4e4e4);
  3102.   background-image: -o-linear-gradient(top, #f6f6f6, #e4e4e4);
  3103.   background-image: linear-gradient(to bottom, #f6f6f6, #e4e4e4);
  3104. }
  3105. .fkit_form .switch > input:checked + label,
  3106. .fkit_form .switcher > input:checked + label {
  3107.   padding-left: 34px;
  3108.   color: #1e9545;
  3109.   text-shadow: 0 -1px rgba(255, 255, 255, 0.6);
  3110.   border-color: #22ab4f;
  3111. }
  3112. .fkit_form .switch > input:checked + label:after,
  3113. .fkit_form .switcher > input:checked + label:after {
  3114.   content: attr(data-on);
  3115.   left: 0;
  3116. }
  3117. .fkit_form .switch > input:checked + label:before,
  3118. .fkit_form .switcher > input:checked + label:before {
  3119.   border-color: #1e9545;
  3120.   border-left-color: rgba(51, 51, 51, 0.4);
  3121.   background: #26c059;
  3122.   margin-left: -2px;
  3123.   box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
  3124. }
  3125. .fkit_form .switch > input,
  3126. .fkit_form .switcher > input {
  3127.   position: absolute;
  3128.   z-index: 0;
  3129.   top: 2px;
  3130.   left: 2px;
  3131.   width: 68px;
  3132.   height: 16px;
  3133.   padding: 0;
  3134.   opacity: 0;
  3135.   -webkit-appearance: none;
  3136. }
  3137. .fkit_form .switch > input:focus,
  3138. .fkit_form .switcher > input:focus {
  3139.   outline: none;
  3140. }
  3141. .fkit_form .switch > label,
  3142. .fkit_form .switcher > label {
  3143.   display: block;
  3144.   position: relative;
  3145.   height: 32px;
  3146.   line-height: 32px;
  3147.   font-size: 10px;
  3148.   color: #999;
  3149.   text-align: center;
  3150.   text-transform: uppercase;
  3151.   text-shadow: 0 1px white;
  3152.   background: #fcfcfc;
  3153.   border: 1px solid #c6c6c6;
  3154.   border-top-color: #b6b6b6;
  3155.   border-radius: 2px;
  3156.   -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.06), 0 1px rgba(255, 255, 255, 0.8);
  3157.   box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.06), 0 1px rgba(255, 255, 255, 0.8);
  3158.   -webkit-transition: 0.15s ease-out;
  3159.   -moz-transition: 0.15s ease-out;
  3160.   -o-transition: 0.15s ease-out;
  3161.   transition: 0.15s ease-out;
  3162. }
  3163. .fkit_form .switch > label:after,
  3164. .fkit_form .switcher > label:after {
  3165.   content: attr(data-off);
  3166.   position: absolute;
  3167.   top: 0;
  3168.   right: 0;
  3169.   padding-right: 1px;
  3170.   width: 34px;
  3171. }
  3172. .fkit_form .switch.unicode > label {
  3173.   font: 12px/17px "Lucida Sans Unicode", "Arial";
  3174. }
  3175. .fkit_form .colorpicker input {
  3176.   width: auto !important;
  3177.   border-color: rgba(0, 0, 0, 0) !important;
  3178. }
  3179. .fkit_form .color_selected {
  3180.   width: 20px;
  3181.   height: 20px;
  3182.   display: inline-block;
  3183. }
  3184. .fkit_form .fkit_multi_select select {
  3185.   visibility: hidden;
  3186.   opacity: 0;
  3187.   height: 2.5rem;
  3188. }
  3189. .fkit_form .fkit_multi_select {
  3190.   position: relative;
  3191. }
  3192. .fkit_form .fkit_multi_select .ui-state-default {
  3193.   height: 2.5rem;
  3194.   font-size: 0.875rem;
  3195.   background: #fafafa;
  3196.   border-radius: 4px;
  3197.   padding: 0.5rem;
  3198.   color: #4d4d4d;
  3199.   border: 1px solid #b3b3b3;
  3200.   box-shadow: 0 -2px 0 rgba(0, 0, 0, 0.075) inset, 0 2px 0 rgba(255, 255, 255, 0.75) inset;
  3201.   font-weight: 400;
  3202.   line-height: 1.6;
  3203.   width: 100% !important;
  3204.   box-sizing: border-box;
  3205.   margin-bottom: 0.25rem;
  3206.   transition: all 0.19s cubic-bezier(0.25, 0.8, 0.25, 1);
  3207.   position: relative;
  3208. }
  3209. .fkit_form .fkit_multi_select .ui-state-default:hover {
  3210.   border-color: #2780f8;
  3211. }
  3212. .fkit_form .fkit_multi_select .ui-state-active {
  3213.   box-shadow: 0 2px 0 rgba(0, 0, 0, 0.075) inset, 0 -2px 0 rgba(255, 255, 255, 0.75) inset;
  3214.   background-color: #ffffff;
  3215. }
  3216. .fkit_form .ui-widget-content {
  3217.   box-shadow: 0 8px 64px rgba(0, 0, 0, 0.25);
  3218.   border: none !important;
  3219. }
  3220. .fkit_form .ui-widget-content .ui-widget-header {
  3221.   border: none;
  3222. }
  3223. .fkit_form .ui-widget-content .ui-multiselect-checkboxes label {
  3224.   cursor: default;
  3225.   display: flex;
  3226.   align-items: center;
  3227.   border: 1px solid transparent;
  3228.   padding: 4px 2px;
  3229. }
  3230. .fkit_form .ui-widget-content .ui-multiselect-checkboxes .ui-state-hover {
  3231.   border: 1px solid rgba(35, 115, 223, 0.2);
  3232.   font-weight: normal;
  3233.   color: #313131;
  3234.   background: rgba(39, 128, 248, 0.2);
  3235. }
  3236. .ui-multiselect-menu {
  3237.   min-width: 200px !important;
  3238. }
  3239. /* Alert panel */
  3240. /*
  3241. ===================================
  3242. #Basic usage:
  3243. #
  3244. #<div class="alert">
  3245. #<div>Alert content</div>
  3246. #<a class="close-alert" href></a>
  3247. #</div>
  3248. #This will provide base styling for alert component.
  3249. #
  3250. #Parameters:
  3251. #<div class="alert alert-info|success|warning|error|news|tip|marketplace|system">...</div>
  3252. # there are eight generic alert elements that are controlled by data-alert attribute.
  3253. #
  3254. #Example usage:
  3255. #<div class="alert alert-info">
  3256. #<div>A sample info alert</div>
  3257. #<a class="close-alert" href></a>
  3258. #</div>
  3259. # This will produce information alert with icons and text.
  3260.  
  3261. ===================================
  3262. */
  3263. .alert {
  3264.   background-color: white;
  3265.   color: #737a97;
  3266.   font-size: 13px;
  3267.   box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.18) inset;
  3268.   border-radius: 3px;
  3269.   margin: 8px 0;
  3270.   padding: 12px;
  3271.   position: relative;
  3272. }
  3273. .alert:hover {
  3274.   box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.25) inset;
  3275. }
  3276. .alert > div {
  3277.   max-width: 90%;
  3278.   margin-left: auto;
  3279.   margin-right: auto;
  3280. }
  3281. .alert a.close-alert {
  3282.   background: url('data:image/svg+xml;utf8,<svg width="17px" height="16px" viewBox="96 736 17 16" xmlns="http://www.w3.org/2000/svg"><path d="M104.006,736 C99.588,736 96.006,739.582 96.006,744 C96.006,748.418 99.588,752 104.006,752 C108.424,752 112.006,748.418 112.006,744 C112.006,739.582 108.424,736 104.006,736 Z M106.727,741.281 C106.351,740.906 105.742,740.906 105.367,741.281 L104.008,742.641 L102.648,741.281 C102.273,740.906 101.665,740.906 101.289,741.281 C100.914,741.657 100.914,742.266 101.289,742.641 L102.648,744 L101.289,745.359 C100.914,745.734 100.914,746.344 101.289,746.719 C101.665,747.094 102.273,747.094 102.648,746.719 L104.008,745.359 L105.367,746.719 C105.742,747.094 106.351,747.094 106.727,746.719 C107.102,746.344 107.102,745.734 106.727,745.359 L105.367,744 L106.727,742.641 C107.102,742.266 107.102,741.657 106.727,741.281 Z" stroke="none" fill="rgb(66, 66, 66)" fill-rule="evenodd"></path></svg>') no-repeat;
  3283.   height: 16px;
  3284.   width: 17px;
  3285.   content: "";
  3286.   display: block;
  3287.   right: 8px;
  3288.   position: absolute;
  3289.   vertical-align: middle;
  3290.   top: 50%;
  3291.   margin-top: -8px;
  3292.   opacity: .4;
  3293. }
  3294. .alert a.close-alert:hover {
  3295.   opacity: 1;
  3296. }
  3297. .alert:before {
  3298.   background-size: 100% auto;
  3299.   content: "";
  3300.   display: block;
  3301.   position: absolute;
  3302.   top: 50%;
  3303.   margin-top: -9px;
  3304. }
  3305. .alert.alert-error {
  3306.   background-color: #f2dede;
  3307.   color: #a94442;
  3308. }
  3309. .alert.alert-error:before {
  3310.   background: url('data:image/svg+xml;utf8,<svg width="19px" height="17px" viewBox="511 287 19 17" xmlns="http://www.w3.org/2000/svg"><path d="M528.889,302.529 L520.889,287.529 C520.541,286.877 519.471,286.877 519.123,287.529 L511.123,302.529 C510.958,302.839 510.968,303.213 511.148,303.515 C511.329,303.815 511.654,304 512.006,304 L528.006,304 C528.357,304 528.683,303.815 528.863,303.515 C529.044,303.213 529.054,302.839 528.889,302.529 Z M513.673,302 L520.006,290.125 L526.339,302 L513.673,302 Z M520.506,299 L519.506,299 C519.229,299 519.006,299.224 519.006,299.5 L519.006,300.5 C519.006,300.776 519.229,301 519.506,301 L520.506,301 C520.782,301 521.006,300.776 521.006,300.5 L521.006,299.5 C521.006,299.224 520.782,299 520.506,299 Z M519.006,294.5 L519.006,297.5 C519.006,297.776 519.229,298 519.506,298 L520.506,298 C520.782,298 521.006,297.776 521.006,297.5 L521.006,294.5 C521.006,294.224 520.782,294 520.506,294 L519.506,294 C519.229,294 519.006,294.224 519.006,294.5 Z" stroke="none" fill="rgb(169, 68, 66)" fill-rule="evenodd"></path></svg>') no-repeat;
  3311.   height: 17px;
  3312.   width: 19px;
  3313. }
  3314. .alert.alert-warning {
  3315.   background-color: #fcf5c0;
  3316.   color: #8a6d3b;
  3317. }
  3318. .alert.alert-warning:before {
  3319.   background: url('data:image/svg+xml;utf8,<svg width="17px" height="16px" viewBox="608 352 17 16" xmlns="http://www.w3.org/2000/svg"><path d="M617.006,363 L617.006,361.5 C617.006,361.224 616.782,361 616.506,361 L610.006,361 L610.006,355 L615.006,355 L615.006,356.5 C615.006,356.776 615.229,357 615.506,357 L622.006,357 L622.006,363 L617.006,363 L617.006,363 Z M616.006,353 L610.006,353 C610.006,352.447 609.559,352 609.006,352 C608.453,352 608.006,352.447 608.006,353 L608.006,367.5 C608.006,367.776 608.229,368 608.506,368 L609.506,368 C609.782,368 610.006,367.776 610.006,367.5 L610.006,363 L615.006,363 L615.006,364 C615.006,364.553 615.453,365 616.006,365 L623.006,365 C623.559,365 624.006,364.553 624.006,364 L624.006,356 C624.006,355.447 623.559,355 623.006,355 L617.006,355 L617.006,354 C617.006,353.447 616.559,353 616.006,353 L616.006,353 Z" stroke="none" fill="rgb(138, 109, 59)" fill-rule="evenodd"></path></svg>') no-repeat;
  3320.   height: 16px;
  3321.   width: 17px;
  3322. }
  3323. .alert.alert-info {
  3324.   background-color: #d5ebf9;
  3325.   color: #31708f;
  3326. }
  3327. .alert.alert-info:before {
  3328.   background: url('data:image/svg+xml;utf8,<svg width="17px" height="16px" viewBox="608 288 17 16" xmlns="http://www.w3.org/2000/svg"><path d="M616.006,288 C611.588,288 608.006,291.582 608.006,296 C608.006,300.418 611.588,304 616.006,304 C620.424,304 624.006,300.418 624.006,296 C624.006,291.582 620.424,288 616.006,288 Z M616.006,302 C612.697,302 610.006,299.308 610.006,296 C610.006,292.692 612.697,290 616.006,290 C619.313,290 622.006,292.692 622.006,296 C622.006,299.308 619.313,302 616.006,302 Z M616.506,292 L615.506,292 C615.229,292 615.006,292.224 615.006,292.5 L615.006,293.5 C615.006,293.776 615.229,294 615.506,294 L616.506,294 C616.782,294 617.006,293.776 617.006,293.5 L617.006,292.5 C617.006,292.224 616.782,292 616.506,292 Z M616.506,295 L615.506,295 C615.229,295 615.006,295.224 615.006,295.5 L615.006,299.5 C615.006,299.776 615.229,300 615.506,300 L616.506,300 C616.782,300 617.006,299.776 617.006,299.5 L617.006,295.5 C617.006,295.224 616.782,295 616.506,295 Z" stroke="none" fill="rgb(49, 112, 143)" fill-rule="evenodd"></path></svg>') no-repeat;
  3329.   height: 16px;
  3330.   width: 17px;
  3331. }
  3332. .alert.alert-success {
  3333.   background-color: #dff0d8;
  3334.   color: #3c763d;
  3335. }
  3336. .alert.alert-success:before {
  3337.   background: url('data:image/svg+xml;utf8,<svg width="17px" height="16px" viewBox="64 736 17 16" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M72.006,736 C67.588,736 64.006,739.582 64.006,744 C64.006,748.418 67.588,752 72.006,752 C76.424,752 80.006,748.418 80.006,744 C80.006,739.582 76.424,736 72.006,736 Z M72.006,750 C68.697,750 66.006,747.309 66.006,744 C66.006,740.691 68.697,738 72.006,738 C75.315,738 78.006,740.691 78.006,744 C78.006,747.309 75.315,750 72.006,750 Z M74.373,741.28 L70.991,744.662 L69.639,743.31 C69.265,742.936 68.66,742.936 68.286,743.31 C67.912,743.683 67.912,744.289 68.286,744.662 L70.315,746.69 C70.689,747.064 71.294,747.064 71.668,746.69 L75.726,742.633 C76.1,742.259 76.1,741.654 75.726,741.28 C75.352,740.906 74.747,740.906 74.373,741.28 Z" stroke="none" fill="rgb(60, 118, 61)" fill-rule="evenodd"></path></svg>') no-repeat;
  3338.   height: 16px;
  3339.   width: 17px;
  3340. }
  3341. .alert.alert-news:before {
  3342.   background: url('data:image/svg+xml;utf8,<svg width="17px" height="16px" viewBox="384 128 17 16" xmlns="http://www.w3.org/2000/svg"><path d="M386.006,132 L388.006,132 L388.006,141 C388.006,141.55 387.556,142 387.006,142 C386.456,142 386.006,141.55 386.006,141 L386.006,132 L386.006,132 Z M399.006,128 L389.006,128 C388.453,128 388.006,128.447 388.006,129 L388.006,130 L385.006,130 C384.453,130 384.006,130.447 384.006,131 L384.006,141 C384.006,142.66 385.346,144 387.006,144 L397.006,144 C398.666,144 400.006,142.66 400.006,141 L400.006,129 C400.006,128.447 399.559,128 399.006,128 Z M398.006,141 C398.006,141.55 397.556,142 397.006,142 L389.822,142 C389.934,141.686 390.006,141.353 390.006,141 L390.006,130 L398.006,130 L398.006,141 Z M391.506,133 L396.506,133 C396.782,133 397.006,132.776 397.006,132.5 L397.006,131.5 C397.006,131.224 396.782,131 396.506,131 L391.506,131 C391.229,131 391.006,131.224 391.006,131.5 L391.006,132.5 C391.006,132.776 391.229,133 391.506,133 Z M391.506,136 L396.506,136 C396.782,136 397.006,135.776 397.006,135.5 L397.006,134.5 C397.006,134.224 396.782,134 396.506,134 L391.506,134 C391.229,134 391.006,134.224 391.006,134.5 L391.006,135.5 C391.006,135.776 391.229,136 391.506,136 Z M391.506,139 L396.506,139 C396.782,139 397.006,138.776 397.006,138.5 L397.006,137.5 C397.006,137.224 396.782,137 396.506,137 L391.506,137 C391.229,137 391.006,137.224 391.006,137.5 L391.006,138.5 C391.006,138.776 391.229,139 391.506,139 Z" stroke="none" fill="rgb(115, 122, 151)" fill-rule="evenodd"></path></svg>') no-repeat;
  3343.   height: 16px;
  3344.   width: 17px;
  3345. }
  3346. .alert.alert-marketplace:before {
  3347.   background: url('data:image/svg+xml;utf8,<svg width="17px" height="17px" viewBox="224 352 17 17" xmlns="http://www.w3.org/2000/svg"><path d="M226.16,356.456 L227.367,354 L236.646,354 L237.852,356.457 C238.003,356.909 238.033,357.397 237.99,357.521 C237.878,357.753 237.646,358 237.331,358 C236.911,358 236.557,357.542 236.557,357 C236.557,356.447 236.109,356 235.557,356 C235.004,356 234.557,356.447 234.557,357 C234.557,357.542 234.201,358 233.78,358 C233.36,358 233.006,357.542 233.006,357 C233.006,356.447 232.559,356 232.006,356 C231.453,356 231.006,356.447 231.006,357 C231.006,357.542 230.65,358 230.23,358 C229.811,358 229.456,357.542 229.456,357 C229.456,356.447 229.008,356 228.456,356 C227.904,356 227.456,356.447 227.456,357 C227.456,357.542 227.102,358 226.681,358 C226.366,358 226.134,357.753 226.025,357.532 C225.979,357.398 226.01,356.909 226.16,356.456 L226.16,356.456 Z M226.681,360 C227.355,360 227.975,359.738 228.456,359.305 C228.938,359.738 229.557,360 230.23,360 C230.905,360 231.524,359.738 232.006,359.305 C232.486,359.738 233.105,360 233.78,360 C234.455,360 235.074,359.738 235.557,359.305 C236.038,359.738 236.656,360 237.331,360 C238.366,360 239.308,359.386 239.789,358.396 C240.271,357.403 239.814,356.006 239.719,355.735 C239.706,355.7 239.69,355.665 239.674,355.631 L238.412,353.062 C238.159,352.442 237.529,352 236.888,352 L227.125,352 C226.481,352 225.852,352.442 225.6,353.063 L224.338,355.63 C224.32,355.665 224.305,355.701 224.293,355.737 C224.196,356.008 223.742,357.408 224.223,358.396 C224.704,359.386 225.646,360 226.681,360 Z M239.506,366 L239.006,366 L239.006,361.37 C239.006,361.094 238.838,360.934 238.559,360.969 C238.391,360.99 238.243,361 238.065,361 C237.89,361 237.693,360.987 237.526,360.965 C237.248,360.929 237.006,361.094 237.006,361.37 L237.006,366 L234.006,366 L234.006,363 C234.006,362.447 233.579,362 233.019,362 L230.99,362 C230.43,362 230.006,362.447 230.006,363 L230.006,366 L227.006,366 L227.006,361.37 C227.006,361.094 226.749,360.929 226.471,360.965 C226.304,360.987 226.113,361 225.937,361 C225.759,361 225.629,360.99 225.461,360.969 C225.182,360.934 225.006,361.094 225.006,361.37 L225.006,366 L224.506,366 C224.229,366 224.006,366.224 224.006,366.5 L224.006,367.5 C224.006,367.776 224.229,368 224.506,368 L239.506,368 C239.782,368 240.006,367.776 240.006,367.5 L240.006,366.5 C240.006,366.224 239.782,366 239.506,366 Z" stroke="none" fill="rgb(115, 122, 151)" fill-rule="evenodd"></path></svg>') no-repeat;
  3348.   height: 17px;
  3349.   width: 17px;
  3350. }
  3351. .alert.alert-tip:before {
  3352.   background: url('data:image/svg+xml;utf8,<svg width="13px" height="17px" viewBox="194 447 13 17" xmlns="http://www.w3.org/2000/svg"><path d="M198.006,463 C198.006,463.553 198.453,464 199.006,464 L201.006,464 C201.559,464 202.006,463.553 202.006,463 L202.506,463 C202.782,463 203.006,462.776 203.006,462.5 L203.006,461.5 C203.006,461.224 202.782,461 202.506,461 L197.506,461 C197.229,461 197.006,461.224 197.006,461.5 L197.006,462.5 C197.006,462.776 197.229,463 197.506,463 L198.006,463 Z M194.006,453 C194.006,454.539 194.59,455.938 195.543,457 C196.37,457.827 196.746,458.897 196.904,459.51 C196.973,459.777 197.229,460 197.506,460 L202.506,460 C202.782,460 203.039,459.777 203.108,459.51 C203.266,458.897 203.642,457.827 204.469,457 C205.422,455.938 206.006,454.539 206.006,453 C206.006,449.687 203.319,447 200.006,447 C196.692,447 194.006,449.687 194.006,453 Z M203.009,455.632 C202.27,456.387 201.798,457.256 201.501,458 L198.511,458 C198.214,457.256 197.742,456.387 197.003,455.632 C196.359,454.898 196.006,453.966 196.006,453 C196.006,450.795 197.801,449 200.006,449 C202.211,449 204.006,450.795 204.006,453 C204.006,453.966 203.652,454.898 203.009,455.632 Z" stroke="none" fill="rgb(115, 122, 151)" fill-rule="evenodd"></path></svg>') no-repeat;
  3353.   height: 17px;
  3354.   width: 13px;
  3355. }
  3356. .alert.alert-system:before {
  3357.   background: url('data:image/svg+xml;utf8,<svg width="17px" height="16px" viewBox="0 0 17 16" version="1.1" xmlns="http://www.w3.org/2000/svg"><path d="M8.006,11 C6.352,11 5.006,9.654 5.006,8 C5.006,6.346 6.352,5 8.006,5 C9.66,5 11.006,6.346 11.006,8 C11.006,9.654 9.66,11 8.006,11 L8.006,11 Z M14.006,7 C13.453,7 12.926,6.557 12.715,6.048 C12.505,5.54 12.565,4.854 12.955,4.463 L13.662,3.757 C14.053,3.366 14.053,2.732 13.663,2.342 C13.273,1.951 12.639,1.951 12.248,2.342 C12.248,2.342 11.932,2.658 11.541,3.049 C11.15,3.439 10.465,3.5 9.957,3.29 C9.45,3.08 9.006,2.553 9.006,2 L9.006,1 C9.006,0.447 8.559,0 8.006,0 C7.453,0 7.006,0.447 7.006,1 L7.006,2 C7.006,2.553 6.563,3.08 6.056,3.291 C5.548,3.502 4.863,3.441 4.473,3.051 L3.764,2.344 C3.373,1.953 2.739,1.954 2.351,2.344 C1.96,2.734 1.96,3.367 2.35,3.758 L3.059,4.466 C3.449,4.856 3.518,5.545 3.346,6.063 C3.176,6.58 2.656,7.016 2.104,7.01 L1.008,7 C0.456,7 0.008,7.449 0.008,8 C0.008,8.553 0.456,9 1.008,9 L2.009,9 C2.561,9 3.096,9.438 3.34,9.925 C3.585,10.411 3.527,11.084 3.133,11.471 L2.35,12.24 C1.959,12.631 1.96,13.266 2.35,13.654 C2.74,14.045 3.374,14.045 3.764,13.655 L4.472,12.947 C4.862,12.557 5.547,12.496 6.056,12.707 C6.563,12.918 7.006,13.445 7.006,13.998 L7.006,14.999 C7.006,15.551 7.454,15.999 8.006,15.998 C8.559,15.998 9.006,15.551 9.006,14.999 L9.006,13.998 C9.006,13.445 9.45,12.918 9.957,12.709 C10.465,12.498 11.15,12.559 11.541,12.949 L12.248,13.656 C12.639,14.047 13.273,14.047 13.661,13.656 C14.052,13.266 14.053,12.632 13.663,12.242 L12.955,11.534 C12.565,11.144 12.504,10.458 12.715,9.95 C12.926,9.442 13.453,9 14.006,9 L15.006,9 C15.559,9 16.006,8.553 16.006,8 C16.006,7.447 15.559,7 15.006,7 L14.006,7 L14.006,7 Z" stroke="none" fill="rgb(115, 122, 151)" fill-rule="evenodd"></path></svg>') no-repeat;
  3358.   height: 16px;
  3359.   width: 17px;
  3360. }
  3361. /**/
  3362. /* Notification Indicator */
  3363. /*
  3364. ===================================
  3365. #Basic usage:
  3366. #
  3367. #<div class="notification">99</div>
  3368. #This will provide base styling for notification indicator. It can be combined with different shape and color class declaration.
  3369. #
  3370. #Example usage:
  3371. #<div class="notification circle bg-red">99</div>
  3372. # This will produce notification indicator with circular shape and brightpink background.
  3373.  
  3374. ===================================
  3375. */
  3376. .notification {
  3377.   position: absolute;
  3378.   top: -10px;
  3379.   right: -10px;
  3380.   min-width: 24px;
  3381.   height: 24px;
  3382.   line-height: 20px;
  3383.   color: white;
  3384.   font-size: 11px;
  3385.   box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.32) inset, 0 2px 0 0px rgba(255, 255, 255, 0.25) inset, 0 2px 0px rgba(0, 0, 0, 0.12), 0 -2px 0px rgba(0, 0, 0, 0.12) inset;
  3386.   text-align: center;
  3387.   padding: 2px;
  3388.   z-index: 20;
  3389.   box-sizing: border-box;
  3390.   background: #ec2d71;
  3391.   border-radius: 4px;
  3392. }
  3393. .notification.circle {
  3394.   border-radius: 50%;
  3395. }
  3396. .notification:hover {
  3397.   transform: scale(1.05);
  3398. }
  3399. /* Progress Component */
  3400. /*
  3401. ===================================
  3402. #Basic usage:
  3403. #
  3404. #<div class="progress">
  3405. #  <div class="progress-text"></div>
  3406. #  <div class="progress-bar">
  3407. #    <div class="progress-complete" style="width: 66%;"></div>
  3408. #  </div>
  3409. #</div>
  3410. #
  3411. #The progress component consists of two parts: progress text placeholder(1) and progress bar(2), which can be used combined or separately. (1) can serve as a container to have floated elements. (2) Can not hold anything else than div.progress-complete, which visually indicates the progress completed. Progress is achieved by moving the div to the right using CSS Transform TranslateX property using math and suming up the starting value(-100) and the progress value (number) usign the formula[(-100 + number)%]. Progress can have a custom background applied. Both Transform and Background-color should be applied inline to override default styles.
  3412. #
  3413. ===================================
  3414. */
  3415. .progress .progress-bar {
  3416.   height: 6px;
  3417.   background: #dedede;
  3418.   width: 100%;
  3419.   border-radius: 4px;
  3420.   overflow: hidden;
  3421. }
  3422. .progress .progress-complete {
  3423.   height: 6px;
  3424.   background: #656C84;
  3425.   width: 100%;
  3426.   border-radius: 4px;
  3427. }
  3428. .progress .progress-text {
  3429.   display: -webkit-box;
  3430.   display: -ms-flexbox;
  3431.   display: flex;
  3432.   -webkit-box-align: center;
  3433.   -ms-flex-align: center;
  3434.   align-items: center;
  3435.   -webkit-box-pack: justify;
  3436.   -ms-flex-pack: justify;
  3437.   justify-content: space-between;
  3438.   font-size: 11px;
  3439.   margin-bottom: 4px;
  3440.   color: #888;
  3441. }
  3442. /* define call to action button default styles */
  3443. .btn {
  3444.   background: #ffffff;
  3445.   color: #4d4d4d;
  3446.   border-color: rgba(0, 0, 0, 0.175);
  3447.   border-width: 1px;
  3448.   border-style: solid;
  3449.   width: auto;
  3450.   display: inline-flex;
  3451.   align-items: center;
  3452.   justify-content: center;
  3453.   text-align: center;
  3454.   text-transform: capitalize;
  3455.   padding: .5rem .75rem;
  3456.   margin: 0 .25rem;
  3457.   height: 2.5rem;
  3458.   min-width: 2.5rem;
  3459.   font-size: 0.875rem;
  3460.   border-radius: 4px;
  3461.   box-shadow: none;
  3462.   transition: all 0.19s cubic-bezier(0.25, 0.8, 0.25, 1);
  3463.   font-weight: 500;
  3464.   text-decoration: none;
  3465.   outline: 0;
  3466.   box-sizing: border-box;
  3467.   cursor: pointer;
  3468.   white-space: nowrap;
  3469.   text-overflow: ellipsis;
  3470. }
  3471. .btn.hide {
  3472.   display: none;
  3473. }
  3474. .btn:hover {
  3475.   box-shadow: 0 2px 0 0 rgba(0, 0, 0, 0.0375), 0 -2px 0 0px rgba(0, 0, 0, 0.0875) inset;
  3476.   border-color: rgba(0, 0, 0, 0.25);
  3477. }
  3478. .btn.btn-xxs {
  3479.   font-size: .625rem;
  3480.   padding: .25rem .25rem;
  3481.   height: 1.5rem;
  3482.   min-width: 1.5rem;
  3483. }
  3484. .btn.btn-xs {
  3485.   font-size: .625rem;
  3486.   padding: .5rem .5rem;
  3487.   height: 2rem;
  3488.   min-width: 2rem;
  3489. }
  3490. .btn.btn-s {
  3491.   font-size: .75rem;
  3492.   padding: .5rem .5rem;
  3493.   height: 2.25rem;
  3494.   min-width: 2.25rem;
  3495. }
  3496. .btn.btn-m {
  3497.   font-size: .875rem;
  3498.   padding: .5rem .75rem;
  3499.   height: 2.5rem;
  3500.   min-width: 2.5rem;
  3501. }
  3502. .btn.btn-l {
  3503.   font-size: 1rem;
  3504.   padding: .75rem 1.5rem;
  3505.   height: 2.75rem;
  3506.   min-width: 2.75rem;
  3507. }
  3508. .btn.btn-xl {
  3509.   font-size: 1.125rem;
  3510.   padding: .875rem 1.75rem;
  3511.   height: 3rem;
  3512.   min-width: 3rem;
  3513. }
  3514. .btn.btn-clean {
  3515.   background-color: transparent;
  3516.   border-color: transparent;
  3517.   color: #748ca8;
  3518. }
  3519. .btn.btn-clean:hover {
  3520.   background-color: #ffffff;
  3521.   color: #2373df;
  3522.   border-color: rgba(0, 0, 0, 0.175);
  3523. }
  3524. .btn.btn-default {
  3525.   background-color: #f7f8fa;
  3526.   color: #748ca8;
  3527. }
  3528. .btn.btn-default:hover {
  3529.   background-color: #ffffff;
  3530.   color: #2373df;
  3531. }
  3532. .btn.btn-neutral {
  3533.   background-color: #2780f8;
  3534.   color: #ffffff;
  3535.   text-shadow: 0 1px 0 rgba(0, 0, 0, 0.125);
  3536. }
  3537. .btn.btn-neutral:hover {
  3538.   background-color: #3d8df9;
  3539. }
  3540. .btn.btn-positive {
  3541.   background-color: #27ae60;
  3542.   color: #ffffff;
  3543.   text-shadow: 0 1px 0 rgba(0, 0, 0, 0.125);
  3544. }
  3545. .btn.btn-positive:hover {
  3546.   background-color: #3db670;
  3547. }
  3548. .btn.btn-negative {
  3549.   background-color: #f24f40;
  3550.   color: #ffffff;
  3551.   text-shadow: 0 1px 0 rgba(0, 0, 0, 0.125);
  3552. }
  3553. .btn.btn-negative:hover {
  3554.   background-color: #f36153;
  3555. }
  3556. .btn.btn-warning {
  3557.   background-color: #e6b41d;
  3558.   color: #ffffff;
  3559.   text-shadow: 0 1px 0 rgba(0, 0, 0, 0.125);
  3560. }
  3561. .btn.btn-warning:hover {
  3562.   background-color: #e9bc34;
  3563. }
  3564. .btn.btn-hover-neutral:hover {
  3565.   background-color: #5299f9;
  3566.   color: #ffffff;
  3567.   text-shadow: 0 1px 0 rgba(0, 0, 0, 0.125);
  3568. }
  3569. .btn.btn-hover-positive:hover {
  3570.   background-color: #27ae60;
  3571.   color: #ffffff;
  3572.   text-shadow: 0 1px 0 rgba(0, 0, 0, 0.125);
  3573. }
  3574. .btn.btn-hover-negative:hover {
  3575.   background-color: #f24f40;
  3576.   color: #ffffff;
  3577. }
  3578. .btn.btn-hover-warning:hover {
  3579.   background-color: #e6b41d;
  3580.   color: #ffffff;
  3581. }
  3582. .btn.btn-hover-disabled:hover {
  3583.   background-color: #e6e6e6;
  3584.   color: #666666;
  3585.   cursor: default;
  3586. }
  3587. .btn.btn-disabled,
  3588. .btn.disabled {
  3589.   background-color: #e6e6e6;
  3590.   color: #666666;
  3591.   cursor: default;
  3592.   box-shadow: none;
  3593.   text-shadow: none;
  3594. }
  3595. .btn.btn-disabled:hover,
  3596. .btn.disabled:hover {
  3597.   background-color: #d9d9d9;
  3598.   color: #666666;
  3599.   text-shadow: none;
  3600. }
  3601. .btn.btn-notext {
  3602.   font-size: 0;
  3603.   line-height: 0;
  3604.   padding: .25rem;
  3605.   margin: 0;
  3606. }
  3607. .btn.btn-notext svg {
  3608.   margin: 0 auto;
  3609.   pointer-events: none;
  3610. }
  3611. .btn.btn-reset {
  3612.   border: none;
  3613.   margin: 0;
  3614. }
  3615. .btn.btn-reset:hover {
  3616.   box-shadow: none;
  3617.   border-color: rgba(0, 0, 0, 0.25);
  3618. }
  3619. .btn.btn-asis {
  3620.   text-transform: none;
  3621. }
  3622. .dropdown-single {
  3623.   box-sizing: border-box;
  3624.   margin: 0 0 0 .25rem;
  3625. }
  3626. .dropdown-single > .btn {
  3627.   position: relative;
  3628.   z-index: 9;
  3629. }
  3630. .dropdown-single.is_active > .btn {
  3631.   background-color: #ffffff;
  3632.   color: #455a73;
  3633. }
  3634. .dropdown-single .dropdown-list {
  3635.   margin-top: .25rem;
  3636.   z-index: 13;
  3637. }
  3638. .dropdown-single .dropdown-list:before {
  3639.   content: '';
  3640.   width: .75rem;
  3641.   height: .75rem;
  3642.   position: absolute;
  3643.   z-index: 1;
  3644.   top: -0.375rem;
  3645.   left: calc(50% - .375rem);
  3646.   background-color: white;
  3647.   transform: rotate(45deg);
  3648.   box-shadow: -1px -1px 1px rgba(0, 0, 0, 0.125);
  3649.   border: 1px solid #aebccc;
  3650.   border-width: 1px 0 0 1px;
  3651.   margin-top: -1px;
  3652. }
  3653. .dropdown-single .dropdown-list.dropdown-side-right {
  3654.   left: auto;
  3655.   right: 0rem;
  3656. }
  3657. .dropdown-single .dropdown-list.dropdown-side-right:before {
  3658.   left: auto;
  3659.   right: 0.75rem;
  3660. }
  3661. .dropdown-group {
  3662.   box-sizing: border-box;
  3663.   margin: 0 0 0 .25rem;
  3664. }
  3665. .dropdown-group > .btn {
  3666.   padding-left: .5rem;
  3667.   padding-right: 1.875rem;
  3668.   position: relative;
  3669.   margin: 0;
  3670.   height: 2.5rem;
  3671. }
  3672. .dropdown-group > .btn:after {
  3673.   content: '';
  3674.   background: url("data:image/svg+xml;utf8, <svg xmlns='http://www.w3.org/2000/svg' viewBox='0…16'><path d='M8 11.4L2.6 6 4 4.6l4 4 4-4L13.4 6z' fill='%23ffffff'/></svg>") no-repeat;
  3675.   width: 1rem;
  3676.   height: 1rem;
  3677.   position: absolute;
  3678.   left: auto;
  3679.   right: 0;
  3680.   top: calc(50% - .5rem);
  3681.   margin-right: .5rem;
  3682.   transition: all 0.19s cubic-bezier(0.25, 0.8, 0.25, 1);
  3683. }
  3684. .dropdown-group:hover > .btn {
  3685.   border-radius: .25rem .25rem 0 0;
  3686.   box-shadow: none;
  3687.   background-color: #27ae60;
  3688. }
  3689. .dropdown-group .dropdown-list {
  3690.   width: 100%;
  3691.   border-radius: 0 0 .25rem .25rem;
  3692.   border-bottom-style: solid;
  3693.   border-top-style: none;
  3694.   padding: 0;
  3695.   overflow: hidden;
  3696.   margin-top: -1px;
  3697. }
  3698. .dropdown-input {
  3699.   position: relative;
  3700.   width: 10rem;
  3701. }
  3702. .dropdown-input .btn {
  3703.   -webkit-appearance: none;
  3704.   -moz-appearance: none;
  3705.   letter-spacing: -0.1px;
  3706.   text-overflow: '';
  3707.   outline: 0;
  3708.   height: 2.5rem;
  3709.   font-size: 0.875rem;
  3710.   background-color: #ffffff;
  3711.   border-radius: 4px;
  3712.   padding: 0 1rem;
  3713.   color: #4d4d4d;
  3714.   border: 1px solid rgba(0, 0, 0, 0.175);
  3715.   box-shadow: 0 -2px 0 rgba(0, 0, 0, 0.0375) inset;
  3716.   font-weight: 400;
  3717.   line-height: 1.6;
  3718.   width: 100%;
  3719.   box-sizing: border-box;
  3720.   margin: 0;
  3721.   transition: all 0.19s cubic-bezier(0.25, 0.8, 0.25, 1);
  3722.   position: relative;
  3723.   justify-content: flex-start;
  3724. }
  3725. .dropdown-input:hover .btn,
  3726. .dropdown-input.is_active .btn {
  3727.   border-color: #aebccc;
  3728.   border-radius: 4px 4px 0 0;
  3729.   border-bottom: none;
  3730.   background-color: white;
  3731.   box-shadow: none;
  3732. }
  3733. .dropdown-input:after {
  3734.   content: '';
  3735.   background: url("data:image/svg+xml;utf8, <svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path d='M8 11.4L2.6 6 4 4.6l4 4 4-4L13.4 6z' fill='%234d4d4d'/></svg>") no-repeat;
  3736.   width: 1rem;
  3737.   height: 1rem;
  3738.   position: absolute;
  3739.   right: .75rem;
  3740.   top: .75rem;
  3741.   transition: all 0.19s cubic-bezier(0.25, 0.8, 0.25, 1);
  3742.   pointer-events: none;
  3743. }
  3744. .dropdown-input:hover:after,
  3745. .dropdown-input.is_active:after {
  3746.   transform: translateY(10%) rotate(180deg);
  3747.   background: url("data:image/svg+xml;utf8, <svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'><path d='M8 11.4L2.6 6 4 4.6l4 4 4-4L13.4 6z' fill='%235c7899'/></svg>");
  3748. }
  3749. .dropdown-input .btn span {
  3750.   max-width: 91%;
  3751.   font-size: .86rem;
  3752.   text-align: left;
  3753.   -webkit-font-smoothing: antialiased;
  3754.   -moz-osx-font-smoothing: grayscale;
  3755. }
  3756. .dropdown-input input[type="text"] {
  3757.   max-width: 40%;
  3758.   padding: .25rem;
  3759. }
  3760. .dropdown-input > .dropdown-list {
  3761.   width: 100%;
  3762.   z-index: 15;
  3763.   border-radius: 0 0 4px 4px;
  3764.   border-top: none;
  3765.   margin-top: -2px;
  3766. }
  3767. .dropdown-input > .dropdown-list li a svg {
  3768.   display: none;
  3769. }
  3770. .dropdown-input > .dropdown-list li a.active {
  3771.   background-color: #f4fbf7;
  3772. }
  3773. .dropdown-input > .dropdown-list li a.active:hover {
  3774.   background-color: #fef6f5;
  3775. }
  3776. .dropdown-input > .dropdown-list li a.active svg {
  3777.   display: block;
  3778. }
  3779. .segment-group {
  3780.   display: flex;
  3781.   align-items: center;
  3782.   margin: 0 0 0 .25rem;
  3783. }
  3784. .segment-group > .btn {
  3785.   margin: 0;
  3786.   border-radius: 0;
  3787.   line-height: 0;
  3788.   padding: .5rem .75rem;
  3789.   border-right-width: 0;
  3790.   height: 2.5rem;
  3791.   min-width: 2.5rem;
  3792. }
  3793. .segment-group > .btn svg {
  3794.   margin: 0 auto;
  3795. }
  3796. .segment-group.segment-default > .btn {
  3797.   background-color: #f7f8fa;
  3798.   color: #6c86a3;
  3799. }
  3800. .segment-group.segment-default > .btn.disabled {
  3801.   background-color: #e6e6e6;
  3802.   color: #666666;
  3803.   pointer-events: none;
  3804. }
  3805. .segment-group.segment-default > .btn:hover {
  3806.   background-color: #ffffff;
  3807.   color: #6c86a3;
  3808. }
  3809. .segment-group > .btn:first-of-type {
  3810.   border-radius: .25rem 0 0 .25rem;
  3811. }
  3812. .segment-group > .btn:last-of-type {
  3813.   border-radius: 0 .25rem .25rem 0;
  3814.   border-right-width: 1px;
  3815. }
  3816. .segment-group > .btn.is-active {
  3817.   color: #ffffff;
  3818.   background-color: #aebccc;
  3819.   box-shadow: 0px 2px 0px 0px rgba(0, 0, 0, 0.0875) inset;
  3820.   border-color: rgba(0, 0, 0, 0.175);
  3821. }
  3822. .segment-group > .btn.is-active:hover {
  3823.   cursor: initial;
  3824.   box-shadow: none;
  3825.   color: #f7f8fa;
  3826.   background-color: #9daec2;
  3827. }
  3828. .btn-group {
  3829.   display: flex;
  3830.   align-items: center;
  3831.   margin: 0 0 0 .25rem;
  3832. }
  3833. .dropdown-list,
  3834. .dropdown-delete {
  3835.   display: none;
  3836.   position: absolute;
  3837.   top: 100%;
  3838.   margin: 0;
  3839.   left: 0;
  3840.   color: #536c8a;
  3841.   background-color: #ffffff;
  3842.   border: 1px solid #aebccc;
  3843.   box-shadow: 0 4px 8px rgba(0, 0, 0, 0.125);
  3844.   z-index: 10;
  3845.   width: 220px;
  3846.   box-sizing: border-box;
  3847.   border-radius: 4px;
  3848.   padding: .5rem;
  3849.   list-style-type: none;
  3850. }
  3851. .dropdown-list.dropdown-delete,
  3852. .dropdown-delete.dropdown-delete {
  3853.   padding: 0;
  3854.   width: 240px;
  3855.   z-index: 999999;
  3856. }
  3857. .dropdown-list.dropdown-delete .header,
  3858. .dropdown-delete.dropdown-delete .header {
  3859.   border-bottom: 1px solid #c0d2e1;
  3860.   background-color: #ebeef2;
  3861.   padding: 0.5rem;
  3862.   font-size: 1rem;
  3863.   text-align: center;
  3864.   border-radius: 4px 4px 0 0;
  3865.   font-weight: 500;
  3866. }
  3867. .dropdown-list.dropdown-delete .confirm,
  3868. .dropdown-delete.dropdown-delete .confirm {
  3869.   border-top: 1px solid #c0d2e1;
  3870.   background-color: #ebeef2;
  3871.   padding: 0.5rem;
  3872.   text-align: center;
  3873.   border-radius: 0 0 4px 4px;
  3874. }
  3875. .dropdown-list.dropdown-delete .confirm .btn,
  3876. .dropdown-delete.dropdown-delete .confirm .btn {
  3877.   width: 40%;
  3878. }
  3879. .dropdown-list.dropdown-delete .message,
  3880. .dropdown-delete.dropdown-delete .message {
  3881.   padding: 1rem 0.5rem;
  3882.   text-align: center;
  3883.   font-size: 0.9rem;
  3884. }
  3885. .dropdown-list.dropdown-delete:before,
  3886. .dropdown-delete.dropdown-delete:before {
  3887.   position: absolute;
  3888.   content: '';
  3889.   width: .75rem;
  3890.   height: .75rem;
  3891.   z-index: 1;
  3892.   top: -0.375rem;
  3893.   left: calc(50% - .375rem);
  3894.   background-color: #ebeef2;
  3895.   transform: rotate(45deg);
  3896.   box-shadow: -1px -1px 1px rgba(0, 0, 0, 0.125);
  3897.   border: 1px solid #aebccc;
  3898.   border-width: 1px 0 0 1px;
  3899.   margin-top: -1px;
  3900. }
  3901. .dropdown-list.dropdown-delete.flippedTop:before,
  3902. .dropdown-delete.dropdown-delete.flippedTop:before {
  3903.   border-width: 0 1px 1px 0;
  3904.   top: 100%;
  3905.   margin-top: -0.35rem;
  3906.   box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.125);
  3907. }
  3908. .dropdown-list li,
  3909. .dropdown-delete li {
  3910.   position: relative;
  3911. }
  3912. .dropdown-list li ul,
  3913. .dropdown-delete li ul {
  3914.   position: absolute;
  3915.   display: none;
  3916.   top: 0;
  3917.   left: 100%;
  3918. }
  3919. .dropdown-list li:hover ul,
  3920. .dropdown-delete li:hover ul {
  3921.   display: block;
  3922. }
  3923. .dropdown-list li.forced ul,
  3924. .dropdown-delete li.forced ul {
  3925.   display: block;
  3926. }
  3927. .dropdown-list li > a,
  3928. .dropdown-delete li > a {
  3929.   font-size: 0.75rem;
  3930.   display: -webkit-box;
  3931.   display: -ms-flexbox;
  3932.   display: flex;
  3933.   -webkit-box-align: center;
  3934.   -ms-flex-align: center;
  3935.   align-items: center;
  3936.   position: relative;
  3937.   font-weight: 500;
  3938.   color: #666;
  3939.   border-bottom: 1px solid #ebeef2;
  3940.   padding: .5rem;
  3941. }
  3942. .dropdown-list li > a:hover .cancel_icon,
  3943. .dropdown-delete li > a:hover .cancel_icon {
  3944.   opacity: 1;
  3945. }
  3946. .dropdown-list li > a.active,
  3947. .dropdown-delete li > a.active {
  3948.   color: black;
  3949. }
  3950. .dropdown-list li > a.active .cancel_icon,
  3951. .dropdown-delete li > a.active .cancel_icon {
  3952.   display: block;
  3953. }
  3954. .dropdown-list li > a.default .cancel_icon,
  3955. .dropdown-delete li > a.default .cancel_icon {
  3956.   display: none;
  3957. }
  3958. .dropdown-list li > a.default.active,
  3959. .dropdown-delete li > a.default.active {
  3960.   cursor: default;
  3961. }
  3962. .dropdown-list li > span,
  3963. .dropdown-delete li > span {
  3964.   font-size: 0.75rem;
  3965.   display: -webkit-box;
  3966.   display: -ms-flexbox;
  3967.   display: flex;
  3968.   -webkit-box-align: center;
  3969.   -ms-flex-align: center;
  3970.   align-items: center;
  3971.   position: relative;
  3972.   font-weight: 500;
  3973.   color: #666;
  3974.   border-bottom: 1px solid #ebeef2;
  3975.   padding: .5rem;
  3976. }
  3977. .dropdown-list li > span a,
  3978. .dropdown-delete li > span a {
  3979.   margin: 0 .25rem;
  3980. }
  3981. .dropdown-list li a:hover,
  3982. .dropdown-delete li a:hover {
  3983.   background-color: #e1f1fb;
  3984. }
  3985. .dropdown-list li:last-child > a,
  3986. .dropdown-delete li:last-child > a,
  3987. .dropdown-list li:last-child > span,
  3988. .dropdown-delete li:last-child > span {
  3989.   border-bottom: none;
  3990. }
  3991. /* Popover Component */
  3992. .popover,
  3993. .popover[data-popover-side="top"] {
  3994.   position: absolute;
  3995.   z-index: 10001;
  3996.   top: 0;
  3997.   right: 0;
  3998.   left: 50%;
  3999.   box-sizing: border-box;
  4000.   width: 16rem;
  4001.   min-height: 10rem;
  4002.   margin: 0 0 0 0;
  4003.   padding: 0;
  4004.   transition: all 400ms cubic-bezier(0.77, 0.06, 0.12, 0.98);
  4005.   transform: translateX(-50%) translateY(-80%) scale(0.8);
  4006.   transform-origin: 0% 0%;
  4007.   pointer-events: none;
  4008.   opacity: 0;
  4009.   border: 1px solid #dedede;
  4010.   border-radius: 6px;
  4011.   background: #fff;
  4012.   box-shadow: 0 1px 0px rgba(0, 0, 0, 0.025), 0 8px 24px rgba(0, 0, 0, 0.12);
  4013. }
  4014. .popover.is-active {
  4015.   top: 0;
  4016.   transform: translateX(-50%) translateY(-100%) scale(1);
  4017.   pointer-events: auto;
  4018.   opacity: 1;
  4019. }
  4020. .popover:before {
  4021.   content: '';
  4022.   width: 12px;
  4023.   height: 12px;
  4024.   position: absolute;
  4025.   z-index: 1;
  4026.   top: -6px;
  4027.   left: calc(50% - 5px);
  4028.   background: white;
  4029.   transform: rotate(45deg);
  4030.   border-radius: 3px;
  4031.   box-shadow: 1px 1px 0 rgba(0, 0, 0, 0.125);
  4032. }
  4033. /* extending popover to adopt multiple positioning */
  4034. .popover[data-popover-side="bottom"].is-active {
  4035.   transform: translateX(-50%) translateY(0%) scale(1);
  4036.   top: 100%;
  4037.   left: 50%;
  4038. }
  4039. .popover[data-popover-side="left"] {
  4040.   top: 50%;
  4041.   right: auto;
  4042.   left: calc(0% - 16rem);
  4043.   transform: scale(1) translateY(-50%);
  4044. }
  4045. .popover[data-popover-side="right"] {
  4046.   top: 50%;
  4047.   right: 0;
  4048.   left: 100%;
  4049.   transform: scale(1) translateY(-50%);
  4050. }
  4051. /* additional declarations for pointer arrow */
  4052. .popover[data-popover-side="bottom"]:before {
  4053.   top: -6px;
  4054.   box-shadow: -1px -1px 0 rgba(0, 0, 0, 0.125);
  4055. }
  4056. .popover[data-popover-side="top"]:before {
  4057.   top: auto;
  4058.   bottom: -6px;
  4059. }
  4060. .popover[data-popover-side="right"]:before {
  4061.   left: -6px;
  4062.   right: auto;
  4063.   top: calc(50% - 5px);
  4064.   border-bottom-color: transparent;
  4065.   border-right-color: white;
  4066.   box-shadow: -1px 1px 0 rgba(0, 0, 0, 0.125);
  4067. }
  4068. .popover[data-popover-side="left"]:before {
  4069.   left: auto;
  4070.   right: -6px;
  4071.   top: calc(50% - 5px);
  4072.   border-bottom-color: transparent;
  4073.   border-left-color: white;
  4074.   box-shadow: 1px -1px 0 rgba(0, 0, 0, 0.125);
  4075. }
  4076. /* Toggle component  */
  4077. .switch-control {
  4078.   width: 2.25rem;
  4079.   height: 1.125rem;
  4080.   border-radius: 4rem;
  4081.   transition: all 400ms cubic-bezier(0.77, 0.06, 0.12, 0.98);
  4082.   transition-property: background-color;
  4083.   position: relative;
  4084.   background-color: #859ab3;
  4085.   cursor: pointer;
  4086. }
  4087. .switch-control.is-active {
  4088.   background-color: #27ae60;
  4089. }
  4090. .switch-control:after {
  4091.   content: '';
  4092.   border-radius: 4rem;
  4093.   background-color: #ffffff;
  4094.   position: absolute;
  4095.   transition: all 400ms cubic-bezier(0.77, 0.06, 0.12, 0.98);
  4096.   transition-property: left, right;
  4097.   transition-delay: 0s, 0.06s;
  4098.   will-change: left, right;
  4099.   left: 0.125rem;
  4100.   right: 1.25rem;
  4101.   display: block;
  4102.   top: 0.125rem;
  4103.   bottom: 0.125rem;
  4104. }
  4105. .switch-control.is-active:after {
  4106.   transition-delay: 0.06s, 0s;
  4107.   left: 1.25rem;
  4108.   right: 0.125rem;
  4109. }
  4110. .switch {
  4111.   display: flex;
  4112.   align-items: center;
  4113.   font-size: 0.875rem;
  4114.   position: relative;
  4115.   cursor: pointer;
  4116.   -webkit-user-select: none;
  4117.   -moz-user-select: none;
  4118.   -ms-user-select: none;
  4119.   -o-user-select: none;
  4120.   user-select: none;
  4121.   -webkit-tap-highlight-color: transparent;
  4122.   tap-highlight-color: transparent;
  4123. }
  4124. .switch input {
  4125.   opacity: 0;
  4126.   position: absolute;
  4127.   margin: 0;
  4128.   padding: 0;
  4129.   z-index: -1;
  4130. }
  4131. .switch input + span {
  4132.   width: 2.25rem;
  4133.   height: 1.125rem;
  4134.   border-radius: 4rem;
  4135.   transition: all 400ms cubic-bezier(0.77, 0.06, 0.12, 0.98);
  4136.   transition-property: background-color;
  4137.   position: relative;
  4138.   background-color: #859ab3;
  4139.   cursor: pointer;
  4140.   margin: 0 .5rem;
  4141. }
  4142. .switch input + span:after {
  4143.   content: '';
  4144.   border-radius: 4rem;
  4145.   background-color: #ffffff;
  4146.   position: absolute;
  4147.   transition: all 400ms cubic-bezier(0.77, 0.06, 0.12, 0.98);
  4148.   transition-property: left, right;
  4149.   transition-delay: 0s, .06s;
  4150.   will-change: left, right;
  4151.   left: 0.125rem;
  4152.   right: 1.25rem;
  4153.   display: block;
  4154.   top: 0.125rem;
  4155.   bottom: 0.125rem;
  4156. }
  4157. .switch input:checked + span {
  4158.   background: #27ae60;
  4159. }
  4160. .switch input:checked + span:after {
  4161.   transition-delay: .06s, 0s;
  4162.   left: 1.25rem;
  4163.   right: 0.125rem;
  4164. }
  4165. .switch input:disabled + span {
  4166.   opacity: 0.6;
  4167.   cursor: default;
  4168.   background: #e6e6e6;
  4169. }
  4170. @keyframes rotate {
  4171.   from {
  4172.     -ms-transform: rotate(0deg);
  4173.     -webkit-transform: rotate(0deg);
  4174.     transform: rotate(0deg);
  4175.   }
  4176.   to {
  4177.     -ms-transform: rotate(360deg);
  4178.     -webkit-transform: rotate(360deg);
  4179.     transform: rotate(360deg);
  4180.   }
  4181. }
  4182. .fkit_loading {
  4183.   color: #141823;
  4184.   padding: 3rem;
  4185.   position: absolute;
  4186.   top: 0;
  4187.   left: 0;
  4188.   width: 100%;
  4189.   z-index: 1;
  4190. }
  4191. .content.body_width {
  4192.   position: relative;
  4193. }
  4194. /*#content.pre_load {
  4195.     z-index: 10; position: relative; background-color:#fff;
  4196. }*/
  4197. [class~='spinner'],
  4198. [class|='spinner'] {
  4199.   display: inline-block;
  4200.   border-radius: 100%;
  4201.   border-width: 5px;
  4202.   border-style: solid;
  4203.   animation: rotate 400ms linear infinite;
  4204.   border-left-color: #5c7899;
  4205.   border-right-color: #dee4eb;
  4206.   border-top-color: #dee4eb;
  4207.   border-bottom-color: #dee4eb;
  4208.   width: 1rem;
  4209.   height: 1rem;
  4210.   border-width: 0.125rem;
  4211. }
  4212. [class~='spinner'][class*='-s'],
  4213. [class|='spinner'][class*='-s'] {
  4214.   width: 0.75rem;
  4215.   height: 0.75rem;
  4216.   border-width: 0.09375rem;
  4217. }
  4218. [class~='spinner'][class*='-l'],
  4219. [class|='spinner'][class*='-l'] {
  4220.   width: 2rem;
  4221.   height: 2rem;
  4222.   border-width: 0.25rem;
  4223. }
  4224. [class~='spinner'][class*='-inverted'],
  4225. [class|='spinner'][class*='-inverted'] {
  4226.   border-left-color: #ffffff;
  4227.   border-right-color: #ffffff;
  4228.   border-top-color: #ffffff;
  4229.   border-bottom-color: #ffffff;
  4230.   border-right-color: rgba(255, 255, 255, 0.5);
  4231.   border-top-color: rgba(255, 255, 255, 0.5);
  4232.   border-bottom-color: rgba(255, 255, 255, 0.5);
  4233. }
  4234. .gb-spinner-slate {
  4235.   min-height: 40px;
  4236.   display: block;
  4237.   position: relative;
  4238. }
  4239. /*
  4240.  
  4241. */
  4242. .skeleton-screen {
  4243.   height: 360px;
  4244.   position: relative;
  4245.   min-width: 24rem;
  4246. }
  4247. .skeleton-screen .skeleton-item {
  4248.   opacity: 0;
  4249.   width: 24rem;
  4250.   height: 106px;
  4251.   /* change height to see repeat-y behavior */
  4252.  
  4253.   position: absolute;
  4254.   z-index: 10;
  4255.   background: none;
  4256.   background-image: radial-gradient(circle 1rem at 1rem 1rem, #d3d3d3 99%, transparent 0), linear-gradient(110deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, 0.5) 50%, rgba(255, 255, 255, 0) 80%), linear-gradient(#d3d3d3 0.5rem, transparent 0), linear-gradient(#d3d3d3 0.5rem, transparent 0), linear-gradient(#d3d3d3 0.5rem, transparent 0), linear-gradient(#d3d3d3 0.5rem, transparent 0);
  4257.   background-repeat: repeat-y;
  4258.   background-size: 2rem 8rem, /* circle */
  4259.  5rem 8rem, /* highlight */
  4260.  20rem 8rem, 20rem 8rem, 20rem 8rem, 15rem 8rem;
  4261.   background-position: 0 0, /* circle */
  4262.  0 0, /* highlight */
  4263.  4rem 0, 4rem 1rem, 4rem 2rem, 4rem 3rem;
  4264. }
  4265. .skeleton-screen .skeleton-item.animated {
  4266.   animation: shine 2s infinite;
  4267.   opacity: 1;
  4268. }
  4269. .skeleton-screen .skeleton-item.animated.item-3 {
  4270.   animation: shineBlink 2s infinite;
  4271. }
  4272. .skeleton-screen .skeleton-item.animate-in {
  4273.   animation: fadeInDown 0.3s linear;
  4274. }
  4275. .skeleton-screen .item-1 {
  4276.   top: 0;
  4277.   left: 0;
  4278. }
  4279. .skeleton-screen .item-2 {
  4280.   top: 116px;
  4281.   left: 0;
  4282. }
  4283. .skeleton-screen .item-3 {
  4284.   top: 232px;
  4285.   left: 0;
  4286. }
  4287. @keyframes shine {
  4288.   to {
  4289.     background-position: 0 0, 100% 0, /* move highlight to right */
  4290.    4rem 0, 4rem 1rem, 4rem 2rem, 4rem 3rem;
  4291.   }
  4292. }
  4293. @keyframes shineBlink {
  4294.   0% {
  4295.     opacity: 1;
  4296.   }
  4297.   50% {
  4298.     opacity: 0.5;
  4299.   }
  4300.   to {
  4301.     background-position: 0 0, 100% 0, /* move highlight to right */
  4302.    4rem 0, 4rem 1rem, 4rem 2rem, 4rem 3rem;
  4303.     opacity: 1;
  4304.   }
  4305. }
  4306. @keyframes fadeInDown {
  4307.   0% {
  4308.     opacity: 0;
  4309.     -webkit-transform: translate3d(0, -100px, 0);
  4310.     transform: translate3d(0, -100px, 0);
  4311.   }
  4312.   50% {
  4313.     -webkit-transform: translate3d(0, 20px, 0);
  4314.     transform: translate3d(0, 20px, 0);
  4315.   }
  4316.   90% {
  4317.     -webkit-transform: translate3d(0, 0, 0);
  4318.     transform: translate3d(0, 0, 0);
  4319.     opacity: 1;
  4320.   }
  4321.   to {
  4322.     opacity: 1;
  4323.     -webkit-transform: none;
  4324.     transform: none;
  4325.   }
  4326. }
  4327. .pace {
  4328.   display: none;
  4329.   -webkit-pointer-events: none;
  4330.   pointer-events: none;
  4331.   -webkit-user-select: none;
  4332.   -moz-user-select: none;
  4333.   user-select: none;
  4334. }
  4335. @keyframes loadingBar {
  4336.   0% {
  4337.     -webkit-backface-visibility: hidden;
  4338.     -moz-backface-visibility: hidden;
  4339.     -ms-backface-visibility: hidden;
  4340.     backface-visibility: hidden;
  4341.     -webkit-perspective: 1000;
  4342.     -moz-perspective: 1000;
  4343.     -ms-perspective: 1000;
  4344.     perspective: 1000;
  4345.     -webkit-transform: translate3d(-100%, 0, 0);
  4346.     transform: translate3d(-100%, 0, 0);
  4347.   }
  4348.   10% {
  4349.     -webkit-transform: translate3d(-60%, 0, 0);
  4350.     transform: translate3d(-60%, 0, 0);
  4351.   }
  4352.   50% {
  4353.     -webkit-transform: translate3d("-5.9469620254822075%", 0, 0);
  4354.     transform: translate3d("-12.661992427892983%", 0, 0);
  4355.   }
  4356.   70% {
  4357.     -webkit-transform: translate3d("-2.5770561303943396%", 0, 0);
  4358.     transform: translate3d("-4.466573253739625%", 0, 0);
  4359.   }
  4360.   90% {
  4361.     -webkit-transform: translate3d("-5.171607261989266%", 0, 0);
  4362.     transform: translate3d("-5.857572069391608%", 0, 0);
  4363.   }
  4364.   97% {
  4365.     -webkit-transform: translate3d(-1%, 0, 0);
  4366.     transform: translate3d(-1%, 0, 0);
  4367.   }
  4368.   100% {
  4369.     -webkit-transform: translate3d(-0.4%, 0, 0);
  4370.     transform: translate3d(-0.4%, 0, 0);
  4371.   }
  4372. }
  4373. .pace.pace-active {
  4374.   display: block;
  4375. }
  4376. .pace.pace-active .pace-progress {
  4377.   background: #29d;
  4378.   position: fixed;
  4379.   top: 0;
  4380.   left: 0;
  4381.   width: 100%;
  4382.   height: 3px;
  4383.   z-index: 99999999;
  4384.   animation-duration: 60s;
  4385.   animation-iteration-count: 1;
  4386.   animation-fill-mode: forwards;
  4387.   animation-name: loadingBar;
  4388.   animation-timing-function: ease-in-out;
  4389. }
  4390. .fkit_dropdown {
  4391.   position: relative;
  4392.   box-sizing: border-box;
  4393. }
  4394. .fkit_dropdown .fkit_dropdown_activate {
  4395.   cursor: pointer;
  4396. }
  4397. .fkit_dropdown.is_active {
  4398.   z-index: 999;
  4399. }
  4400. .fkit_dropdown.is_active .fkit_dropdown_content {
  4401.   display: block;
  4402.   z-index: -1;
  4403. }
  4404. .fkit_dropdown .fkit_dropdown_content {
  4405.   display: none;
  4406.   position: absolute;
  4407.   top: 0;
  4408.   left: 0;
  4409. }
  4410. .flatpickr-month .numInputWrapper input.numInput {
  4411.   background: transparent;
  4412.   box-sizing: border-box;
  4413.   color: inherit;
  4414.   cursor: default;
  4415.   padding: 0 0 0 .5ch;
  4416.   margin: 0;
  4417.   display: inline;
  4418.   font-size: inherit;
  4419.   font-family: inherit;
  4420.   font-weight: 300;
  4421.   line-height: inherit;
  4422.   height: initial;
  4423.   border: 0;
  4424.   border-radius: 0;
  4425.   vertical-align: initial;
  4426. }
  4427. .flatpickr-wrapper {
  4428.   width: 100%;
  4429. }
  4430. .flatpickr-calendar.static {
  4431.   margin-bottom: 100px;
  4432.   right: 0;
  4433. }
  4434. html {
  4435.   /* Adjust font size */
  4436.  
  4437.   font-size: 100%;
  4438.   -webkit-text-size-adjust: 100%;
  4439.   /* Font varient */
  4440.  
  4441.   font-variant-ligatures: none;
  4442.   -webkit-font-variant-ligatures: none;
  4443.   /* Smoothing */
  4444.  
  4445.   text-rendering: optimizeLegibility;
  4446.   -moz-osx-font-smoothing: grayscale;
  4447.   font-smoothing: antialiased;
  4448.   -webkit-font-smoothing: antialiased;
  4449.   text-shadow: rgba(0, 0, 0, 0.01) 0 0 1px;
  4450. }
  4451. body {
  4452.   font-family: 'Roboto', 'Segoe UI', 'Helvetica Neue', Helvetica, sans-serif;
  4453.   line-height: 1.6;
  4454. }
  4455. .colorpicker {
  4456.   z-index: 1120;
  4457. }
RAW Paste Data
Want to get better at CSS?
Learn to code CSS in 2017
Top