API tools faq
paste
Advertisement
Guest User

main

a guest
Mar 29th, 2020
90
0
Never
Add comment
Not a member of Pastebin yet? Sign Up, it unlocks many cool features!
text 35.35 KB | None | 0 0
raw download clone embed print report
  1. @import url(fontawesome-all.min.css);
  2. @import url("https://fonts.googleapis.com/css?family=Source+Sans+Pro:300italic,600italic,300,600");
  3.  
  4. /*
  5. Dimension by HTML5 UP
  6. html5up.net | @ajlkn
  7. Free for personal and commercial use under the CCA 3.0 license (html5up.net/license)
  8. */
  9.  
  10. html, body, div, span, applet, object,
  11. iframe, h1, h2, h3, h4, h5, h6, p, blockquote,
  12. pre, a, abbr, acronym, address, big, cite,
  13. code, del, dfn, em, img, ins, kbd, q, s, samp,
  14. small, strike, strong, sub, sup, tt, var, b,
  15. u, i, center, dl, dt, dd, ol, ul, li, fieldset,
  16. form, label, legend, table, caption, tbody,
  17. tfoot, thead, tr, th, td, article, aside,
  18. canvas, details, embed, figure, figcaption,
  19. footer, header, hgroup, menu, nav, output, ruby,
  20. section, summary, time, mark, audio, video {
  21. margin: 0;
  22. padding: 0;
  23. border: 0;
  24. font-size: 100%;
  25. font: inherit;
  26. vertical-align: baseline;}
  27.  
  28. article, aside, details, figcaption, figure,
  29. footer, header, hgroup, menu, nav, section {
  30. display: block;}
  31.  
  32. body {
  33. line-height: 1;
  34. }
  35.  
  36. ol, ul {
  37. list-style: none;
  38. }
  39.  
  40. blockquote, q {
  41. quotes: none;
  42. }
  43.  
  44. blockquote:before, blockquote:after, q:before, q:after {
  45. content: '';
  46. content: none;
  47. }
  48.  
  49. table {
  50. border-collapse: collapse;
  51. border-spacing: 0;
  52. }
  53.  
  54. body {
  55. -webkit-text-size-adjust: none;
  56. }
  57.  
  58. mark {
  59. background-color: transparent;
  60. color: inherit;
  61. }
  62.  
  63. input::-moz-focus-inner {
  64. border: 0;
  65. padding: 0;
  66. }
  67.  
  68. input, select, textarea {
  69. -moz-appearance: none;
  70. -webkit-appearance: none;
  71. -ms-appearance: none;
  72. appearance: none;
  73. }
  74.  
  75. /* Basic */
  76.  
  77. @-ms-viewport {
  78. width: device-width;
  79. }
  80.  
  81. @media screen and (max-width: 480px) {
  82.  
  83. html, body {
  84. min-width: 320px;
  85. }
  86.  
  87. }
  88.  
  89. html {
  90. box-sizing: border-box;
  91. }
  92.  
  93. *, *:before, *:after {
  94. box-sizing: inherit;
  95. }
  96.  
  97. body {
  98. background: #1b1f22;
  99. }
  100.  
  101. body.is-preload *, body.is-preload *:before, body.is-preload *:after {
  102. -moz-animation: none !important;
  103. -webkit-animation: none !important;
  104. -ms-animation: none !important;
  105. animation: none !important;
  106. -moz-transition: none !important;
  107. -webkit-transition: none !important;
  108. -ms-transition: none !important;
  109. transition: none !important;
  110. }
  111.  
  112. /* Type */
  113.  
  114. html {
  115. font-size: 16pt;
  116. }
  117.  
  118. @media screen and (max-width: 1680px) {
  119.  
  120. html {
  121. font-size: 12pt;
  122. }
  123.  
  124. }
  125.  
  126. @media screen and (max-width: 736px) {
  127.  
  128. html {
  129. font-size: 11pt;
  130. }
  131.  
  132. }
  133.  
  134. @media screen and (max-width: 360px) {
  135.  
  136. html {
  137. font-size: 10pt;
  138. }
  139.  
  140. }
  141.  
  142. body, input, select, textarea {
  143. color: #ffffff;
  144. font-family: "Source Sans Pro", sans-serif;
  145. font-weight: 300;
  146. font-size: 1rem;
  147. line-height: 1.65;
  148. }
  149.  
  150. a {
  151. -moz-transition: color 0.2s ease-in-out, background-color 0.2s ease-in-out, border-bottom-color 0.2s ease-in-out;
  152. -webkit-transition: color 0.2s ease-in-out, background-color 0.2s ease-in-out, border-bottom-color 0.2s ease-in-out;
  153. -ms-transition: color 0.2s ease-in-out, background-color 0.2s ease-in-out, border-bottom-color 0.2s ease-in-out;
  154. transition: color 0.2s ease-in-out, background-color 0.2s ease-in-out, border-bottom-color 0.2s ease-in-out;
  155. border-bottom: dotted 1px rgba(255, 255, 255, 0.5);
  156. text-decoration: none;
  157. color: inherit;
  158. }
  159.  
  160. a:hover {
  161. border-bottom-color: transparent;
  162. }
  163.  
  164. strong, b {
  165. color: #ffffff;
  166. font-weight: 600;
  167. }
  168.  
  169. em, i {
  170. font-style: italic;
  171. }
  172.  
  173. p {
  174. margin: 0 0 2rem 0;
  175. }
  176.  
  177. h1, h2, h3, h4, h5, h6 {
  178. color: #ffffff;
  179. font-weight: 600;
  180. line-height: 1.5;
  181. margin: 0 0 1rem 0;
  182. text-transform: uppercase;
  183. letter-spacing: 0.2rem;
  184. }
  185.  
  186. h1 a, h2 a, h3 a, h4 a, h5 a, h6 a {
  187. color: inherit;
  188. text-decoration: none;
  189. }
  190.  
  191. h1.major, h2.major, h3.major, h4.major, h5.major, h6.major {
  192. border-bottom: solid 1px #ffffff;
  193. width: -moz-max-content;
  194. width: -webkit-max-content;
  195. width: -ms-max-content;
  196. width: max-content;
  197. padding-bottom: 0.5rem;
  198. margin: 0 0 2rem 0;
  199. }
  200.  
  201. h1 {
  202. font-size: 2.25rem;
  203. line-height: 1.3;
  204. letter-spacing: 0.5rem;
  205. }
  206.  
  207. h2 {
  208. font-size: 1.5rem;
  209. line-height: 1.4;
  210. letter-spacing: 0.5rem;
  211. }
  212.  
  213. h3 {
  214. font-size: 1rem;
  215. }
  216.  
  217. h4 {
  218. font-size: 0.8rem;
  219. }
  220.  
  221. h5 {
  222. font-size: 0.7rem;
  223. }
  224.  
  225. h6 {
  226. font-size: 0.6rem;
  227. }
  228.  
  229. @media screen and (max-width: 736px) {
  230.  
  231. h1 {
  232. font-size: 1.75rem;
  233. line-height: 1.4;
  234. }
  235.  
  236. h2 {
  237. font-size: 1.25em;
  238. line-height: 1.5;
  239. }
  240.  
  241. }
  242.  
  243. sub {
  244. font-size: 0.8rem;
  245. position: relative;
  246. top: 0.5rem;
  247. }
  248.  
  249. sup {
  250. font-size: 0.8rem;
  251. position: relative;
  252. top: -0.5rem;
  253. }
  254.  
  255. blockquote {
  256. border-left: solid 4px #ffffff;
  257. font-style: italic;
  258. margin: 0 0 2rem 0;
  259. padding: 0.5rem 0 0.5rem 2rem;
  260. }
  261.  
  262. code {
  263. background: rgba(255, 255, 255, 0.075);
  264. border-radius: 4px;
  265. font-family: "Courier New", monospace;
  266. font-size: 0.9rem;
  267. margin: 0 0.25rem;
  268. padding: 0.25rem 0.65rem;
  269. }
  270.  
  271. pre {
  272. -webkit-overflow-scrolling: touch;
  273. font-family: "Courier New", monospace;
  274. font-size: 0.9rem;
  275. margin: 0 0 2rem 0;
  276. }
  277.  
  278. pre code {
  279. display: block;
  280. line-height: 1.75;
  281. padding: 1rem 1.5rem;
  282. overflow-x: auto;
  283. }
  284.  
  285. hr {
  286. border: 0;
  287. border-bottom: solid 1px #ffffff;
  288. margin: 2.75rem 0;
  289. }
  290.  
  291. .align-left {
  292. text-align: left;
  293. }
  294.  
  295. .align-center {
  296. text-align: center;
  297. }
  298.  
  299. .align-right {
  300. text-align: right;
  301. }
  302.  
  303. /* Form */
  304.  
  305. form {
  306. margin: 0 0 2rem 0;
  307. }
  308.  
  309. form > :last-child {
  310. margin-bottom: 0;
  311. }
  312.  
  313. form > .fields {
  314. display: -moz-flex;
  315. display: -webkit-flex;
  316. display: -ms-flex;
  317. display: flex;
  318. -moz-flex-wrap: wrap;
  319. -webkit-flex-wrap: wrap;
  320. -ms-flex-wrap: wrap;
  321. flex-wrap: wrap;
  322. width: calc(100% + 3rem);
  323. margin: -1.5rem 0 2rem -1.5rem;
  324. }
  325.  
  326. form > .fields > .field {
  327. -moz-flex-grow: 0;
  328. -webkit-flex-grow: 0;
  329. -ms-flex-grow: 0;
  330. flex-grow: 0;
  331. -moz-flex-shrink: 0;
  332. -webkit-flex-shrink: 0;
  333. -ms-flex-shrink: 0;
  334. flex-shrink: 0;
  335. padding: 1.5rem 0 0 1.5rem;
  336. width: calc(100% - 1.5rem);
  337. }
  338.  
  339. form > .fields > .field.half {
  340. width: calc(50% - 0.75rem);
  341. }
  342.  
  343. form > .fields > .field.third {
  344. width: calc(100%/3 - 0.5rem);
  345. }
  346.  
  347. form > .fields > .field.quarter {
  348. width: calc(25% - 0.375rem);
  349. }
  350.  
  351. @media screen and (max-width: 480px) {
  352.  
  353. form > .fields {
  354. width: calc(100% + 3rem);
  355. margin: -1.5rem 0 2rem -1.5rem;
  356. }
  357.  
  358. form > .fields > .field {
  359. padding: 1.5rem 0 0 1.5rem;
  360. width: calc(100% - 1.5rem);
  361. }
  362.  
  363. form > .fields > .field.half {
  364. width: calc(100% - 1.5rem);
  365. }
  366.  
  367. form > .fields > .field.third {
  368. width: calc(100% - 1.5rem);
  369. }
  370.  
  371. form > .fields > .field.quarter {
  372. width: calc(100% - 1.5rem);
  373. }
  374.  
  375. }
  376.  
  377. label {
  378. color: #ffffff;
  379. display: block;
  380. font-size: 0.8rem;
  381. font-weight: 300;
  382. letter-spacing: 0.2rem;
  383. line-height: 1.5;
  384. margin: 0 0 1rem 0;
  385. text-transform: uppercase;
  386. }
  387.  
  388. input[type="text"],
  389. input[type="password"],
  390. input[type="email"],
  391. input[type="tel"],
  392. select,
  393. textarea {
  394. -moz-appearance: none;
  395. -webkit-appearance: none;
  396. -ms-appearance: none;
  397. appearance: none;
  398. -moz-transition: border-color 0.2s ease-in-out, box-shadow 0.2s ease-in-out, background-color 0.2s ease-in-out;
  399. -webkit-transition: border-color 0.2s ease-in-out, box-shadow 0.2s ease-in-out, background-color 0.2s ease-in-out;
  400. -ms-transition: border-color 0.2s ease-in-out, box-shadow 0.2s ease-in-out, background-color 0.2s ease-in-out;
  401. transition: border-color 0.2s ease-in-out, box-shadow 0.2s ease-in-out, background-color 0.2s ease-in-out;
  402. background-color: transparent;
  403. border-radius: 4px;
  404. border: solid 1px #ffffff;
  405. color: inherit;
  406. display: block;
  407. outline: 0;
  408. padding: 0 1rem;
  409. text-decoration: none;
  410. width: 100%;
  411. }
  412.  
  413. input[type="text"]:invalid,
  414. input[type="password"]:invalid,
  415. input[type="email"]:invalid,
  416. input[type="tel"]:invalid,
  417. select:invalid,
  418. textarea:invalid {
  419. box-shadow: none;
  420. }
  421.  
  422. input[type="text"]:focus,
  423. input[type="password"]:focus,
  424. input[type="email"]:focus,
  425. input[type="tel"]:focus,
  426. select:focus,
  427. textarea:focus {
  428. background: rgba(255, 255, 255, 0.075);
  429. border-color: #ffffff;
  430. box-shadow: 0 0 0 1px #ffffff;
  431. }
  432.  
  433. select {
  434. background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='40' preserveAspectRatio='none' viewBox='0 0 40 40'%3E%3Cpath d='M9.4,12.3l10.4,10.4l10.4-10.4c0.2-0.2,0.5-0.4,0.9-0.4c0.3,0,0.6,0.1,0.9,0.4l3.3,3.3c0.2,0.2,0.4,0.5,0.4,0.9 c0,0.4-0.1,0.6-0.4,0.9L20.7,31.9c-0.2,0.2-0.5,0.4-0.9,0.4c-0.3,0-0.6-0.1-0.9-0.4L4.3,17.3c-0.2-0.2-0.4-0.5-0.4-0.9 c0-0.4,0.1-0.6,0.4-0.9l3.3-3.3c0.2-0.2,0.5-0.4,0.9-0.4S9.1,12.1,9.4,12.3z' fill='%23ffffff' /%3E%3C/svg%3E");
  435. background-size: 1.25rem;
  436. background-repeat: no-repeat;
  437. background-position: calc(100% - 1rem) center;
  438. height: 2.75rem;
  439. padding-right: 2.75rem;
  440. text-overflow: ellipsis;
  441. }
  442.  
  443. select option {
  444. color: #ffffff;
  445. background: #1b1f22;
  446. }
  447.  
  448. select:focus::-ms-value {
  449. background-color: transparent;
  450. }
  451.  
  452. select::-ms-expand {
  453. display: none;
  454. }
  455.  
  456. input[type="text"],
  457. input[type="password"],
  458. input[type="email"],
  459. select {
  460. height: 2.75rem;
  461. }
  462.  
  463. textarea {
  464. padding: 0.75rem 1rem;
  465. }
  466.  
  467. input[type="checkbox"],
  468. input[type="radio"] {
  469. -moz-appearance: none;
  470. -webkit-appearance: none;
  471. -ms-appearance: none;
  472. appearance: none;
  473. display: block;
  474. float: left;
  475. margin-right: -2rem;
  476. opacity: 0;
  477. width: 1rem;
  478. z-index: -1;
  479. }
  480.  
  481. input[type="checkbox"] + label,
  482. input[type="radio"] + label {
  483. text-decoration: none;
  484. -moz-user-select: none;
  485. -webkit-user-select: none;
  486. -ms-user-select: none;
  487. user-select: none;
  488. color: #ffffff;
  489. cursor: pointer;
  490. display: inline-block;
  491. font-size: 0.8rem;
  492. font-weight: 300;
  493. margin: 0 0 0.5rem 0;
  494. padding-left: 2.65rem;
  495. padding-right: 0.75rem;
  496. position: relative;
  497. }
  498.  
  499. input[type="checkbox"] + label:before,
  500. input[type="radio"] + label:before {
  501. -moz-osx-font-smoothing: grayscale;
  502. -webkit-font-smoothing: antialiased;
  503. display: inline-block;
  504. font-style: normal;
  505. font-variant: normal;
  506. text-rendering: auto;
  507. line-height: 1;
  508. text-transform: none !important;
  509. font-family: 'Font Awesome 5 Free';
  510. font-weight: 900;
  511. }
  512.  
  513. input[type="checkbox"] + label:before,
  514. input[type="radio"] + label:before {
  515. -moz-transition: border-color 0.2s ease-in-out, box-shadow 0.2s ease-in-out, background-color 0.2s ease-in-out;
  516. -webkit-transition: border-color 0.2s ease-in-out, box-shadow 0.2s ease-in-out, background-color 0.2s ease-in-out;
  517. -ms-transition: border-color 0.2s ease-in-out, box-shadow 0.2s ease-in-out, background-color 0.2s ease-in-out;
  518. transition: border-color 0.2s ease-in-out, box-shadow 0.2s ease-in-out, background-color 0.2s ease-in-out;
  519. border-radius: 4px;
  520. border: solid 1px #ffffff;
  521. content: '';
  522. display: inline-block;
  523. height: 1.65rem;
  524. left: 0;
  525. line-height: 1.65rem;
  526. position: absolute;
  527. text-align: center;
  528. top: -0.15rem;
  529. width: 1.65rem;
  530. }
  531.  
  532. input[type="checkbox"]:checked + label:before,
  533. input[type="radio"]:checked + label:before {
  534. background: #ffffff !important;
  535. border-color: #ffffff !important;
  536. color: #1b1f22;
  537. content: '\f00c';
  538. }
  539.  
  540. input[type="checkbox"]:focus + label:before,
  541. input[type="radio"]:focus + label:before {
  542. background: rgba(255, 255, 255, 0.075);
  543. border-color: #ffffff;
  544. box-shadow: 0 0 0 1px #ffffff;
  545. }
  546.  
  547. input[type="checkbox"] + label:before {
  548. border-radius: 4px;
  549. }
  550.  
  551. input[type="radio"] + label:before {
  552. border-radius: 100%;
  553. }
  554.  
  555. ::-webkit-input-placeholder {
  556. color: rgba(255, 255, 255, 0.5) !important;
  557. opacity: 1.0;
  558. }
  559.  
  560. :-moz-placeholder {
  561. color: rgba(255, 255, 255, 0.5) !important;
  562. opacity: 1.0;
  563. }
  564.  
  565. ::-moz-placeholder {
  566. color: rgba(255, 255, 255, 0.5) !important;
  567. opacity: 1.0;
  568. }
  569.  
  570. :-ms-input-placeholder {
  571. color: rgba(255, 255, 255, 0.5) !important;
  572. opacity: 1.0;
  573. }
  574.  
  575. .formerize-placeholder {
  576. color: rgba(255, 255, 255, 0.5) !important;
  577. opacity: 1.0;
  578. }
  579.  
  580. /* Box */
  581.  
  582. .box {
  583. border-radius: 4px;
  584. border: solid 1px #ffffff;
  585. margin-bottom: 2rem;
  586. padding: 1.5em;
  587. }
  588.  
  589. .box > :last-child,
  590. .box > :last-child > :last-child,
  591. .box > :last-child > :last-child > :last-child {
  592. margin-bottom: 0;
  593. }
  594.  
  595. .box.alt {
  596. border: 0;
  597. border-radius: 0;
  598. padding: 0;
  599. }
  600.  
  601. /* Icon */
  602.  
  603. .icon {
  604. text-decoration: none;
  605. border-bottom: none;
  606. position: relative;
  607. }
  608.  
  609. .icon:before {
  610. -moz-osx-font-smoothing: grayscale;
  611. -webkit-font-smoothing: antialiased;
  612. display: inline-block;
  613. font-style: normal;
  614. font-variant: normal;
  615. text-rendering: auto;
  616. line-height: 1;
  617. text-transform: none !important;
  618. font-family: 'Font Awesome 5 Free';
  619. font-weight: 400;
  620. }
  621.  
  622. .icon > .label {
  623. display: none;
  624. }
  625.  
  626. .icon:before {
  627. line-height: inherit;
  628. }
  629.  
  630. .icon.solid:before {
  631. font-weight: 900;
  632. }
  633.  
  634. .icon.brands:before {
  635. font-family: 'Font Awesome 5 Brands';
  636. }
  637.  
  638. /* Image */
  639.  
  640. .image {
  641. border-radius: 4px;
  642. border: 0;
  643. display: inline-block;
  644. position: relative;
  645. }
  646.  
  647. .image:before {
  648. pointer-events: none;
  649. background-image: url("../../images/overlay.png");
  650. background-color: rgba(19, 21, 25, 0.5);
  651. border-radius: 4px;
  652. content: '';
  653. display: block;
  654. height: 100%;
  655. left: 0;
  656. opacity: 0.5;
  657. position: absolute;
  658. top: 0;
  659. width: 100%;
  660. }
  661.  
  662. .image img {
  663. border-radius: 4px;
  664. display: block;
  665. }
  666.  
  667. .image.left, .image.right {
  668. max-width: 40%;
  669. }
  670.  
  671. .image.left img, .image.right img {
  672. width: 100%;
  673. }
  674.  
  675. .image.left {
  676. float: left;
  677. padding: 0 1.5em 1em 0;
  678. top: 0.25em;
  679. }
  680.  
  681. .image.right {
  682. float: right;
  683. padding: 0 0 1em 1.5em;
  684. top: 0.25em;
  685. }
  686.  
  687. .image.fit {
  688. display: block;
  689. margin: 0 0 2rem 0;
  690. width: 100%;
  691. }
  692.  
  693. .image.fit img {
  694. width: 100%;
  695. }
  696.  
  697. .image.main {
  698. display: block;
  699. margin: 2.5rem 0;
  700. width: 100%;
  701. }
  702.  
  703. .image.main img {
  704. width: 100%;
  705. }
  706.  
  707. @media screen and (max-width: 736px) {
  708.  
  709. .image.main {
  710. margin: 2rem 0;
  711. }
  712.  
  713. }
  714.  
  715. @media screen and (max-width: 480px) {
  716.  
  717. .image.main {
  718. margin: 1.5rem 0;
  719. }
  720.  
  721. }
  722.  
  723. /* List */
  724.  
  725. ol {
  726. list-style: decimal;
  727. margin: 0 0 2rem 0;
  728. padding-left: 1.25em;
  729. }
  730.  
  731. ol li {
  732. padding-left: 0.25em;
  733. }
  734.  
  735. ul {
  736. list-style: disc;
  737. margin: 0 0 2rem 0;
  738. padding-left: 1em;
  739. }
  740.  
  741. ul li {
  742. padding-left: 0.5em;
  743. }
  744.  
  745. ul.alt {
  746. list-style: none;
  747. padding-left: 0;
  748. }
  749.  
  750. ul.alt li {
  751. border-top: solid 1px #ffffff;
  752. padding: 0.5em 0;
  753. }
  754.  
  755. ul.alt li:first-child {
  756. border-top: 0;
  757. padding-top: 0;
  758. }
  759.  
  760. dl {
  761. margin: 0 0 2rem 0;
  762. }
  763.  
  764. dl dt {
  765. display: block;
  766. font-weight: 600;
  767. margin: 0 0 1rem 0;
  768. }
  769.  
  770. dl dd {
  771. margin-left: 2rem;
  772. }
  773.  
  774. /* Actions */
  775.  
  776. ul.actions {
  777. display: -moz-flex;
  778. display: -webkit-flex;
  779. display: -ms-flex;
  780. display: flex;
  781. cursor: default;
  782. list-style: none;
  783. margin-left: -1rem;
  784. padding-left: 0;
  785. }
  786.  
  787. ul.actions li {
  788. padding: 0 0 0 1rem;
  789. vertical-align: middle;
  790. }
  791.  
  792. ul.actions.special {
  793. -moz-justify-content: center;
  794. -webkit-justify-content: center;
  795. -ms-justify-content: center;
  796. justify-content: center;
  797. width: 100%;
  798. margin-left: 0;
  799. }
  800.  
  801. ul.actions.special li:first-child {
  802. padding-left: 0;
  803. }
  804.  
  805. ul.actions.stacked {
  806. -moz-flex-direction: column;
  807. -webkit-flex-direction: column;
  808. -ms-flex-direction: column;
  809. flex-direction: column;
  810. margin-left: 0;
  811. }
  812.  
  813. ul.actions.stacked li {
  814. padding: 1.3rem 0 0 0;
  815. }
  816.  
  817. ul.actions.stacked li:first-child {
  818. padding-top: 0;
  819. }
  820.  
  821. ul.actions.fit {
  822. width: calc(100% + 1rem);
  823. }
  824.  
  825. ul.actions.fit li {
  826. -moz-flex-grow: 1;
  827. -webkit-flex-grow: 1;
  828. -ms-flex-grow: 1;
  829. flex-grow: 1;
  830. -moz-flex-shrink: 1;
  831. -webkit-flex-shrink: 1;
  832. -ms-flex-shrink: 1;
  833. flex-shrink: 1;
  834. width: 100%;
  835. }
  836.  
  837. ul.actions.fit li > * {
  838. width: 100%;
  839. }
  840.  
  841. ul.actions.fit.stacked {
  842. width: 100%;
  843. }
  844.  
  845. @media screen and (max-width: 480px) {
  846.  
  847. ul.actions:not(.fixed) {
  848. -moz-flex-direction: column;
  849. -webkit-flex-direction: column;
  850. -ms-flex-direction: column;
  851. flex-direction: column;
  852. margin-left: 0;
  853. width: 100% !important;
  854. }
  855.  
  856. ul.actions:not(.fixed) li {
  857. -moz-flex-grow: 1;
  858. -webkit-flex-grow: 1;
  859. -ms-flex-grow: 1;
  860. flex-grow: 1;
  861. -moz-flex-shrink: 1;
  862. -webkit-flex-shrink: 1;
  863. -ms-flex-shrink: 1;
  864. flex-shrink: 1;
  865. padding: 1rem 0 0 0;
  866. text-align: center;
  867. width: 100%;
  868. }
  869.  
  870. ul.actions:not(.fixed) li > * {
  871. width: 100%;
  872. }
  873.  
  874. ul.actions:not(.fixed) li:first-child {
  875. padding-top: 0;
  876. }
  877.  
  878. ul.actions:not(.fixed) li input[type="submit"],
  879. ul.actions:not(.fixed) li input[type="reset"],
  880. ul.actions:not(.fixed) li input[type="button"],
  881. ul.actions:not(.fixed) li button,
  882. ul.actions:not(.fixed) li .button {
  883. width: 100%;
  884. }
  885.  
  886. ul.actions:not(.fixed) li input[type="submit"].icon:before,
  887. ul.actions:not(.fixed) li input[type="reset"].icon:before,
  888. ul.actions:not(.fixed) li input[type="button"].icon:before,
  889. ul.actions:not(.fixed) li button.icon:before,
  890. ul.actions:not(.fixed) li .button.icon:before {
  891. margin-left: -0.5em;
  892. }
  893.  
  894. }
  895.  
  896. /* Icons */
  897.  
  898. ul.icons {
  899. cursor: default;
  900. list-style: none;
  901. padding-left: 0;
  902. }
  903.  
  904. ul.icons li {
  905. display: inline-block;
  906. padding: 0 0.75em 0 0;
  907. }
  908.  
  909. ul.icons li:last-child {
  910. padding-right: 0;
  911. }
  912.  
  913. ul.icons li a {
  914. border-radius: 100%;
  915. box-shadow: inset 0 0 0 1px #ffffff;
  916. display: inline-block;
  917. height: 2.25rem;
  918. line-height: 2.25rem;
  919. text-align: center;
  920. width: 2.25rem;
  921. }
  922.  
  923. ul.icons li a:hover {
  924. background-color: rgba(255, 255, 255, 0.075);
  925. }
  926.  
  927. ul.icons li a:active {
  928. background-color: rgba(255, 255, 255, 0.175);
  929. }
  930.  
  931. /* Table */
  932.  
  933. .table-wrapper {
  934. -webkit-overflow-scrolling: touch;
  935. overflow-x: auto;
  936. }
  937.  
  938. table {
  939. margin: 0 0 2rem 0;
  940. width: 100%;
  941. }
  942.  
  943. table tbody tr {
  944. border: solid 1px #ffffff;
  945. border-left: 0;
  946. border-right: 0;
  947. }
  948.  
  949. table tbody tr:nth-child(2n + 1) {
  950. background-color: rgba(255, 255, 255, 0.075);
  951. }
  952.  
  953. table td {
  954. padding: 0.75em 0.75em;
  955. }
  956.  
  957. table th {
  958. color: #ffffff;
  959. font-size: 0.9em;
  960. font-weight: 600;
  961. padding: 0 0.75em 0.75em 0.75em;
  962. text-align: left;
  963. }
  964.  
  965. table thead {
  966. border-bottom: solid 2px #ffffff;
  967. }
  968.  
  969. table tfoot {
  970. border-top: solid 2px #ffffff;
  971. }
  972.  
  973. table.alt {
  974. border-collapse: separate;
  975. }
  976.  
  977. table.alt tbody tr td {
  978. border: solid 1px #ffffff;
  979. border-left-width: 0;
  980. border-top-width: 0;
  981. }
  982.  
  983. table.alt tbody tr td:first-child {
  984. border-left-width: 1px;
  985. }
  986.  
  987. table.alt tbody tr:first-child td {
  988. border-top-width: 1px;
  989. }
  990.  
  991. table.alt thead {
  992. border-bottom: 0;
  993. }
  994.  
  995. table.alt tfoot {
  996. border-top: 0;
  997. }
  998.  
  999. /* Button */
  1000.  
  1001. input[type="submit"],
  1002. input[type="reset"],
  1003. input[type="button"],
  1004. button,
  1005. .button {
  1006. -moz-appearance: none;
  1007. -webkit-appearance: none;
  1008. -ms-appearance: none;
  1009. appearance: none;
  1010. -moz-transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
  1011. -webkit-transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
  1012. -ms-transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
  1013. transition: background-color 0.2s ease-in-out, color 0.2s ease-in-out;
  1014. background-color: transparent;
  1015. border-radius: 4px;
  1016. border: 0;
  1017. box-shadow: inset 0 0 0 1px #ffffff;
  1018. color: #ffffff !important;
  1019. cursor: pointer;
  1020. display: inline-block;
  1021. font-size: 0.8rem;
  1022. font-weight: 300;
  1023. height: 2.75rem;
  1024. letter-spacing: 0.2rem;
  1025. line-height: 2.75rem;
  1026. outline: 0;
  1027. padding: 0 1.25rem 0 1.35rem;
  1028. text-align: center;
  1029. text-decoration: none;
  1030. text-transform: uppercase;
  1031. white-space: nowrap;
  1032. }
  1033.  
  1034. input[type="submit"]:hover,
  1035. input[type="reset"]:hover,
  1036. input[type="button"]:hover,
  1037. button:hover,
  1038. .button:hover {
  1039. background-color: rgba(255, 255, 255, 0.075);
  1040. }
  1041.  
  1042. input[type="submit"]:active,
  1043. input[type="reset"]:active,
  1044. input[type="button"]:active,
  1045. button:active,
  1046. .button:active {
  1047. background-color: rgba(255, 255, 255, 0.175);
  1048. }
  1049.  
  1050. input[type="submit"].icon:before,
  1051. input[type="reset"].icon:before,
  1052. input[type="button"].icon:before,
  1053. button.icon:before,
  1054. .button.icon:before {
  1055. margin-right: 0.5em;
  1056. }
  1057.  
  1058. input[type="submit"].fit,
  1059. input[type="reset"].fit,
  1060. input[type="button"].fit,
  1061. button.fit,
  1062. .button.fit {
  1063. width: 100%;
  1064. }
  1065.  
  1066. input[type="submit"].small,
  1067. input[type="reset"].small,
  1068. input[type="button"].small,
  1069. button.small,
  1070. .button.small {
  1071. font-size: 0.6rem;
  1072. height: 2.0625rem;
  1073. line-height: 2.0625rem;
  1074. }
  1075.  
  1076. input[type="submit"].primary,
  1077. input[type="reset"].primary,
  1078. input[type="button"].primary,
  1079. button.primary,
  1080. .button.primary {
  1081. background-color: #ffffff;
  1082. color: #1b1f22 !important;
  1083. font-weight: 600;
  1084. }
  1085.  
  1086. input[type="submit"].disabled, input[type="submit"]:disabled,
  1087. input[type="reset"].disabled,
  1088. input[type="reset"]:disabled,
  1089. input[type="button"].disabled,
  1090. input[type="button"]:disabled,
  1091. button.disabled,
  1092. button:disabled,
  1093. .button.disabled,
  1094. .button:disabled {
  1095. pointer-events: none;
  1096. cursor: default;
  1097. opacity: 0.25;
  1098. }
  1099.  
  1100. input[type="submit"],
  1101. input[type="reset"],
  1102. input[type="button"],
  1103. button {
  1104. line-height: calc(2.75rem - 2px);
  1105. }
  1106.  
  1107. /* BG */
  1108.  
  1109. #bg {
  1110. -moz-transform: scale(1.0);
  1111. -webkit-transform: scale(1.0);
  1112. -ms-transform: scale(1.0);
  1113. transform: scale(1.0);
  1114. -webkit-backface-visibility: hidden;
  1115. position: fixed;
  1116. top: 0;
  1117. left: 0;
  1118. width: 100%;
  1119. height: 100vh;
  1120. z-index: 1;
  1121. }
  1122.  
  1123. #bg:before, #bg:after {
  1124. content: '';
  1125. display: block;
  1126. position: absolute;
  1127. top: 0;
  1128. left: 0;
  1129. width: 100%;
  1130. height: 100%;
  1131. }
  1132.  
  1133. #bg:before {
  1134. -moz-transition: background-color 2.5s ease-in-out;
  1135. -webkit-transition: background-color 2.5s ease-in-out;
  1136. -ms-transition: background-color 2.5s ease-in-out;
  1137. transition: background-color 2.5s ease-in-out;
  1138. -moz-transition-delay: 0.75s;
  1139. -webkit-transition-delay: 0.75s;
  1140. -ms-transition-delay: 0.75s;
  1141. transition-delay: 0.75s;
  1142. background-image: linear-gradient(to top, rgba(19, 21, 25, 0.5), rgba(19, 21, 25, 0.5)), url("../../images/overlay.png");
  1143. background-size: auto,
  1144. 256px 256px;
  1145. background-position: center,
  1146. center;
  1147. background-repeat: no-repeat,
  1148. repeat;
  1149. z-index: 2;
  1150. }
  1151.  
  1152. #bg:after {
  1153. -moz-transform: scale(1.125);
  1154. -webkit-transform: scale(1.125);
  1155. -ms-transform: scale(1.125);
  1156. transform: scale(1.125);
  1157. -moz-transition: -moz-transform 0.325s ease-in-out, -moz-filter 0.325s ease-in-out;
  1158. -webkit-transition: -webkit-transform 0.325s ease-in-out, -webkit-filter 0.325s ease-in-out;
  1159. -ms-transition: -ms-transform 0.325s ease-in-out, -ms-filter 0.325s ease-in-out;
  1160. transition: transform 0.325s ease-in-out, filter 0.325s ease-in-out;
  1161. background-image: url("../../images/bg.jpg");
  1162. background-position: center;
  1163. background-size: cover;
  1164. background-repeat: no-repeat;
  1165. z-index: 1;
  1166. }
  1167.  
  1168. body.is-article-visible #bg:after {
  1169. -moz-transform: scale(1.0825);
  1170. -webkit-transform: scale(1.0825);
  1171. -ms-transform: scale(1.0825);
  1172. transform: scale(1.0825);
  1173. -moz-filter: blur(0.2rem);
  1174. -webkit-filter: blur(0.2rem);
  1175. -ms-filter: blur(0.2rem);
  1176. filter: blur(0.2rem);
  1177. }
  1178.  
  1179. body.is-preload #bg:before {
  1180. background-color: #000000;
  1181. }
  1182.  
  1183. /* Wrapper */
  1184.  
  1185. #wrapper {
  1186. display: -moz-flex;
  1187. display: -webkit-flex;
  1188. display: -ms-flex;
  1189. display: flex;
  1190. -moz-flex-direction: column;
  1191. -webkit-flex-direction: column;
  1192. -ms-flex-direction: column;
  1193. flex-direction: column;
  1194. -moz-align-items: center;
  1195. -webkit-align-items: center;
  1196. -ms-align-items: center;
  1197. align-items: center;
  1198. -moz-justify-content: space-between;
  1199. -webkit-justify-content: space-between;
  1200. -ms-justify-content: space-between;
  1201. justify-content: space-between;
  1202. position: relative;
  1203. min-height: 100vh;
  1204. width: 100%;
  1205. padding: 4rem 2rem;
  1206. z-index: 3;
  1207. }
  1208.  
  1209. #wrapper:before {
  1210. content: '';
  1211. display: block;
  1212. }
  1213.  
  1214. @media screen and (max-width: 1680px) {
  1215.  
  1216. #wrapper {
  1217. padding: 3rem 2rem;
  1218. }
  1219.  
  1220. }
  1221.  
  1222. @media screen and (max-width: 736px) {
  1223.  
  1224. #wrapper {
  1225. padding: 2rem 1rem;
  1226. }
  1227.  
  1228. }
  1229.  
  1230. @media screen and (max-width: 480px) {
  1231.  
  1232. #wrapper {
  1233. padding: 1rem;
  1234. }
  1235.  
  1236. }
  1237.  
  1238. /* Header */
  1239.  
  1240. #header {
  1241. display: -moz-flex;
  1242. display: -webkit-flex;
  1243. display: -ms-flex;
  1244. display: flex;
  1245. -moz-flex-direction: column;
  1246. -webkit-flex-direction: column;
  1247. -ms-flex-direction: column;
  1248. flex-direction: column;
  1249. -moz-align-items: center;
  1250. -webkit-align-items: center;
  1251. -ms-align-items: center;
  1252. align-items: center;
  1253. -moz-transition: -moz-transform 0.325s ease-in-out, -moz-filter 0.325s ease-in-out, opacity 0.325s ease-in-out;
  1254. -webkit-transition: -webkit-transform 0.325s ease-in-out, -webkit-filter 0.325s ease-in-out, opacity 0.325s ease-in-out;
  1255. -ms-transition: -ms-transform 0.325s ease-in-out, -ms-filter 0.325s ease-in-out, opacity 0.325s ease-in-out;
  1256. transition: transform 0.325s ease-in-out, filter 0.325s ease-in-out, opacity 0.325s ease-in-out;
  1257. background-image: -moz-radial-gradient(rgba(0, 0, 0, 0.25) 25%, rgba(0, 0, 0, 0) 55%);
  1258. background-image: -webkit-radial-gradient(rgba(0, 0, 0, 0.25) 25%, rgba(0, 0, 0, 0) 55%);
  1259. background-image: -ms-radial-gradient(rgba(0, 0, 0, 0.25) 25%, rgba(0, 0, 0, 0) 55%);
  1260. background-image: radial-gradient(rgba(0, 0, 0, 0.25) 25%, rgba(0, 0, 0, 0) 55%);
  1261. max-width: 100%;
  1262. text-align: center;
  1263. }
  1264.  
  1265. #header > * {
  1266. -moz-transition: opacity 0.325s ease-in-out;
  1267. -webkit-transition: opacity 0.325s ease-in-out;
  1268. -ms-transition: opacity 0.325s ease-in-out;
  1269. transition: opacity 0.325s ease-in-out;
  1270. position: relative;
  1271. margin-top: 3.5rem;
  1272. }
  1273.  
  1274. #header > *:before {
  1275. content: '';
  1276. display: block;
  1277. position: absolute;
  1278. top: calc(-3.5rem - 1px);
  1279. left: calc(50% - 1px);
  1280. width: 1px;
  1281. height: calc(3.5rem + 1px);
  1282. background: #ffffff;
  1283. }
  1284.  
  1285. #header > :first-child {
  1286. margin-top: 0;
  1287. }
  1288.  
  1289. #header > :first-child:before {
  1290. display: none;
  1291. }
  1292.  
  1293. #header .logo {
  1294. width: 5.5rem;
  1295. height: 5.5rem;
  1296. line-height: 5.5rem;
  1297. border: solid 1px #ffffff;
  1298. border-radius: 100%;
  1299. }
  1300.  
  1301. #header .logo .icon:before {
  1302. font-size: 2rem;
  1303. }
  1304. #logo-evo{
  1305. width: 100%;
  1306. border-radius: 50%;
  1307. }
  1308. #header .content {
  1309. border-style: solid;
  1310. border-color: #ffffff;
  1311. border-top-width: 1px;
  1312. border-bottom-width: 1px;
  1313. max-width: 100%;
  1314. }
  1315.  
  1316. #header .content .inner {
  1317. -moz-transition: max-height 0.75s ease, padding 0.75s ease, opacity 0.325s ease-in-out;
  1318. -webkit-transition: max-height 0.75s ease, padding 0.75s ease, opacity 0.325s ease-in-out;
  1319. -ms-transition: max-height 0.75s ease, padding 0.75s ease, opacity 0.325s ease-in-out;
  1320. transition: max-height 0.75s ease, padding 0.75s ease, opacity 0.325s ease-in-out;
  1321. -moz-transition-delay: 0.25s;
  1322. -webkit-transition-delay: 0.25s;
  1323. -ms-transition-delay: 0.25s;
  1324. transition-delay: 0.25s;
  1325. padding: 3rem 2rem;
  1326. max-height: 40rem;
  1327. overflow: hidden;
  1328. }
  1329.  
  1330. #header .content .inner > :last-child {
  1331. margin-bottom: 0;
  1332. }
  1333.  
  1334. #header .content p {
  1335. text-transform: uppercase;
  1336. letter-spacing: 0.2rem;
  1337. font-size: 0.8rem;
  1338. line-height: 2;
  1339. }
  1340.  
  1341. #header nav ul {
  1342. display: -moz-flex;
  1343. display: -webkit-flex;
  1344. display: -ms-flex;
  1345. display: flex;
  1346. margin-bottom: 0;
  1347. list-style: none;
  1348. padding-left: 0;
  1349. border: solid 1px #ffffff;
  1350. border-radius: 4px;
  1351. }
  1352.  
  1353. #header nav ul li {
  1354. padding-left: 0;
  1355. border-left: solid 1px #ffffff;
  1356. }
  1357.  
  1358. #header nav ul li:first-child {
  1359. border-left: 0;
  1360. }
  1361.  
  1362. #header nav ul li a {
  1363. display: block;
  1364. min-width: 7.5rem;
  1365. height: 2.75rem;
  1366. line-height: 2.75rem;
  1367. padding: 0 1.25rem 0 1.45rem;
  1368. text-transform: uppercase;
  1369. letter-spacing: 0.2rem;
  1370. font-size: 0.8rem;
  1371. border-bottom: 0;
  1372. }
  1373.  
  1374. #header nav ul li a:hover {
  1375. background-color: rgba(255, 255, 255, 0.075);
  1376. }
  1377.  
  1378. #header nav ul li a:active {
  1379. background-color: rgba(255, 255, 255, 0.175);
  1380. }
  1381.  
  1382. #header nav.use-middle:after {
  1383. content: '';
  1384. display: block;
  1385. position: absolute;
  1386. top: 0;
  1387. left: calc(50% - 1px);
  1388. width: 1px;
  1389. height: 100%;
  1390. background: #ffffff;
  1391. }
  1392.  
  1393. #header nav.use-middle ul li.is-middle {
  1394. border-left: 0;
  1395. }
  1396.  
  1397. body.is-article-visible #header {
  1398. -moz-transform: scale(0.95);
  1399. -webkit-transform: scale(0.95);
  1400. -ms-transform: scale(0.95);
  1401. transform: scale(0.95);
  1402. -moz-filter: blur(0.1rem);
  1403. -webkit-filter: blur(0.1rem);
  1404. -ms-filter: blur(0.1rem);
  1405. filter: blur(0.1rem);
  1406. opacity: 0;
  1407. }
  1408.  
  1409. body.is-preload #header {
  1410. -moz-filter: blur(0.125rem);
  1411. -webkit-filter: blur(0.125rem);
  1412. -ms-filter: blur(0.125rem);
  1413. filter: blur(0.125rem);
  1414. }
  1415.  
  1416. body.is-preload #header > * {
  1417. opacity: 0;
  1418. }
  1419.  
  1420. body.is-preload #header .content .inner {
  1421. max-height: 0;
  1422. padding-top: 0;
  1423. padding-bottom: 0;
  1424. opacity: 0;
  1425. }
  1426.  
  1427. @media screen and (max-width: 980px) {
  1428.  
  1429. #header .content p br {
  1430. display: none;
  1431. }
  1432.  
  1433. }
  1434.  
  1435. @media screen and (max-width: 736px) {
  1436.  
  1437. #header > * {
  1438. margin-top: 2rem;
  1439. }
  1440.  
  1441. #header > *:before {
  1442. top: calc(-2rem - 1px);
  1443. height: calc(2rem + 1px);
  1444. }
  1445.  
  1446. #header .logo {
  1447. width: 4.75rem;
  1448. height: 4.75rem;
  1449. line-height: 4.75rem;
  1450. }
  1451.  
  1452. #header .logo .icon:before {
  1453. font-size: 1.75rem;
  1454. }
  1455.  
  1456. #header .content .inner {
  1457. padding: 2.5rem 1rem;
  1458. }
  1459.  
  1460. #header .content p {
  1461. line-height: 1.875;
  1462. }
  1463.  
  1464. }
  1465.  
  1466. @media screen and (max-width: 480px) {
  1467.  
  1468. #header {
  1469. padding: 1.5rem 0;
  1470. }
  1471.  
  1472. #header .content .inner {
  1473. padding: 2.5rem 0;
  1474. }
  1475.  
  1476. #header nav ul {
  1477. -moz-flex-direction: column;
  1478. -webkit-flex-direction: column;
  1479. -ms-flex-direction: column;
  1480. flex-direction: column;
  1481. min-width: 10rem;
  1482. max-width: 100%;
  1483. }
  1484.  
  1485. #header nav ul li {
  1486. border-left: 0;
  1487. border-top: solid 1px #ffffff;
  1488. }
  1489.  
  1490. #header nav ul li:first-child {
  1491. border-top: 0;
  1492. }
  1493.  
  1494. #header nav ul li a {
  1495. height: 3rem;
  1496. line-height: 3rem;
  1497. min-width: 0;
  1498. width: 100%;
  1499. }
  1500.  
  1501. #header nav.use-middle:after {
  1502. display: none;
  1503. }
  1504.  
  1505. }
  1506.  
  1507. /* Main */
  1508.  
  1509. #main {
  1510. -moz-flex-grow: 1;
  1511. -webkit-flex-grow: 1;
  1512. -ms-flex-grow: 1;
  1513. flex-grow: 1;
  1514. -moz-flex-shrink: 1;
  1515. -webkit-flex-shrink: 1;
  1516. -ms-flex-shrink: 1;
  1517. flex-shrink: 1;
  1518. display: -moz-flex;
  1519. display: -webkit-flex;
  1520. display: -ms-flex;
  1521. display: flex;
  1522. -moz-align-items: center;
  1523. -webkit-align-items: center;
  1524. -ms-align-items: center;
  1525. align-items: center;
  1526. -moz-justify-content: center;
  1527. -webkit-justify-content: center;
  1528. -ms-justify-content: center;
  1529. justify-content: center;
  1530. -moz-flex-direction: column;
  1531. -webkit-flex-direction: column;
  1532. -ms-flex-direction: column;
  1533. flex-direction: column;
  1534. position: relative;
  1535. max-width: 100%;
  1536. z-index: 3;
  1537. }
  1538.  
  1539. #main article {
  1540. -moz-transform: translateY(0.25rem);
  1541. -webkit-transform: translateY(0.25rem);
  1542. -ms-transform: translateY(0.25rem);
  1543. transform: translateY(0.25rem);
  1544. -moz-transition: opacity 0.325s ease-in-out, -moz-transform 0.325s ease-in-out;
  1545. -webkit-transition: opacity 0.325s ease-in-out, -webkit-transform 0.325s ease-in-out;
  1546. -ms-transition: opacity 0.325s ease-in-out, -ms-transform 0.325s ease-in-out;
  1547. transition: opacity 0.325s ease-in-out, transform 0.325s ease-in-out;
  1548. padding: 4.5rem 2.5rem 1.5rem 2.5rem ;
  1549. position: relative;
  1550. width: 40rem;
  1551. max-width: 100%;
  1552. background-color: rgba(27, 31, 34, 0.85);
  1553. border-radius: 4px;
  1554. opacity: 0;
  1555. }
  1556.  
  1557. #main article.active {
  1558. -moz-transform: translateY(0);
  1559. -webkit-transform: translateY(0);
  1560. -ms-transform: translateY(0);
  1561. transform: translateY(0);
  1562. opacity: 1;
  1563. }
  1564.  
  1565. #main article .close {
  1566. display: block;
  1567. position: absolute;
  1568. top: 0;
  1569. right: 0;
  1570. width: 4rem;
  1571. height: 4rem;
  1572. cursor: pointer;
  1573. text-indent: 4rem;
  1574. overflow: hidden;
  1575. white-space: nowrap;
  1576. }
  1577.  
  1578. #main article .close:before {
  1579. -moz-transition: background-color 0.2s ease-in-out;
  1580. -webkit-transition: background-color 0.2s ease-in-out;
  1581. -ms-transition: background-color 0.2s ease-in-out;
  1582. transition: background-color 0.2s ease-in-out;
  1583. content: '';
  1584. display: block;
  1585. position: absolute;
  1586. top: 0.75rem;
  1587. left: 0.75rem;
  1588. width: 2.5rem;
  1589. height: 2.5rem;
  1590. border-radius: 100%;
  1591. background-position: center;
  1592. background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' width='20px' height='20px' viewBox='0 0 20 20' zoomAndPan='disable'%3E%3Cstyle%3Eline %7B stroke: %23ffffff%3B stroke-width: 1%3B %7D%3C/style%3E%3Cline x1='2' y1='2' x2='18' y2='18' /%3E%3Cline x1='18' y1='2' x2='2' y2='18' /%3E%3C/svg%3E");
  1593. background-size: 20px 20px;
  1594. background-repeat: no-repeat;
  1595. }
  1596.  
  1597. #main article .close:hover:before {
  1598. background-color: rgba(255, 255, 255, 0.075);
  1599. }
  1600.  
  1601. #main article .close:active:before {
  1602. background-color: rgba(255, 255, 255, 0.175);
  1603. }
  1604.  
  1605. @media screen and (max-width: 736px) {
  1606.  
  1607. #main article {
  1608. padding: 3.5rem 2rem 0.5rem 2rem ;
  1609. }
  1610.  
  1611. #main article .close:before {
  1612. top: 0.875rem;
  1613. left: 0.875rem;
  1614. width: 2.25rem;
  1615. height: 2.25rem;
  1616. background-size: 14px 14px;
  1617. }
  1618.  
  1619. }
  1620.  
  1621. @media screen and (max-width: 480px) {
  1622.  
  1623. #main article {
  1624. padding: 3rem 1.5rem 0.5rem 1.5rem ;
  1625. }
  1626.  
  1627. }
  1628.  
  1629. /* Footer */
  1630.  
  1631. #footer {
  1632. -moz-transition: -moz-transform 0.325s ease-in-out, -moz-filter 0.325s ease-in-out, opacity 0.325s ease-in-out;
  1633. -webkit-transition: -webkit-transform 0.325s ease-in-out, -webkit-filter 0.325s ease-in-out, opacity 0.325s ease-in-out;
  1634. -ms-transition: -ms-transform 0.325s ease-in-out, -ms-filter 0.325s ease-in-out, opacity 0.325s ease-in-out;
  1635. transition: transform 0.325s ease-in-out, filter 0.325s ease-in-out, opacity 0.325s ease-in-out;
  1636. width: 100%;
  1637. max-width: 100%;
  1638. margin-top: 2rem;
  1639. text-align: center;
  1640. }
  1641.  
  1642. #footer .copyright {
  1643. letter-spacing: 0.2rem;
  1644. font-size: 0.6rem;
  1645. opacity: 0.75;
  1646. margin-bottom: 0;
  1647. text-transform: uppercase;
  1648. }
  1649.  
  1650. body.is-article-visible #footer {
  1651. -moz-transform: scale(0.95);
  1652. -webkit-transform: scale(0.95);
  1653. -ms-transform: scale(0.95);
  1654. transform: scale(0.95);
  1655. -moz-filter: blur(0.1rem);
  1656. -webkit-filter: blur(0.1rem);
  1657. -ms-filter: blur(0.1rem);
  1658. filter: blur(0.1rem);
  1659. opacity: 0;
  1660. }
  1661.  
  1662. body.is-preload #footer {
  1663. opacity: 0;
  1664. }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement
Public Pastes
Advertisement
We use cookies for various purposes including analytics. By continuing to use Pastebin, you agree to our use of cookies as described in the Cookies Policy.  OK, I Understand
Not a member of Pastebin yet?
Sign Up, it unlocks many cool features!