You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

1904 lines
73 KiB

  1. /**
  2. * @license Copyright (c) 2003-2017, CKSource - Frederico Knabben. All rights reserved.
  3. * For licensing, see LICENSE.md or http://ckeditor.com/license
  4. */
  5. @media (max-width: 900px) {
  6. .global-is-mobile-hidden {
  7. display: none !important;
  8. }
  9. }
  10. article,
  11. aside,
  12. details,
  13. figcaption,
  14. figure,
  15. footer,
  16. header,
  17. hgroup,
  18. main,
  19. menu,
  20. nav,
  21. section {
  22. display: block;
  23. }
  24. body,
  25. html {
  26. margin: 0;
  27. padding: 0;
  28. font: 16px / 1.8 Arial, 'Helvetica Neue', Helvetica, sans-serif;
  29. font-weight: 300;
  30. color: #575757;
  31. }
  32. .grid-width-10 {
  33. width: 10%;
  34. }
  35. .grid-width-20 {
  36. width: 20%;
  37. }
  38. .grid-width-30 {
  39. width: 30%;
  40. }
  41. .grid-width-40 {
  42. width: 40%;
  43. }
  44. .grid-width-50 {
  45. width: 50%;
  46. }
  47. .grid-width-60 {
  48. width: 60%;
  49. }
  50. .grid-width-70 {
  51. width: 70%;
  52. }
  53. .grid-width-80 {
  54. width: 80%;
  55. }
  56. .grid-width-90 {
  57. width: 90%;
  58. }
  59. .grid-width-100 {
  60. width: 100%;
  61. }
  62. @media (max-width: 900px) {
  63. .grid-width-10,
  64. .grid-width-20,
  65. .grid-width-30,
  66. .grid-width-40,
  67. .grid-width-50,
  68. .grid-width-60,
  69. .grid-width-70,
  70. .grid-width-80,
  71. .grid-width-90,
  72. .grid-width-100 {
  73. width: 100%;
  74. }
  75. }
  76. *[class*="grid-width"] {
  77. -webkit-box-sizing: border-box;
  78. -moz-box-sizing: border-box;
  79. box-sizing: border-box;
  80. padding-left: 4%;
  81. padding-right: 4%;
  82. float: left;
  83. }
  84. *[class*="grid-width"]:after,
  85. .grid-container:after,
  86. *[class*="grid-width"]:before,
  87. .grid-container:before {
  88. content: '';
  89. display: block;
  90. overflow: hidden;
  91. visibility: hidden;
  92. font-size: 0;
  93. line-height: 0;
  94. width: 0;
  95. height: 0;
  96. }
  97. *[class*="grid-width"]:after,
  98. .grid-container:after {
  99. clear: both;
  100. }
  101. .grid-container {
  102. -webkit-box-sizing: border-box;
  103. -moz-box-sizing: border-box;
  104. box-sizing: border-box;
  105. margin-left: auto;
  106. margin-right: auto;
  107. }
  108. .grid-container-nested *[class*="grid-width"]:first-child {
  109. padding-left: 0;
  110. }
  111. .grid-container-nested *[class*="grid-width"]:last-child {
  112. padding-right: 0;
  113. }
  114. @media (max-width: 900px) {
  115. .grid-container-nested *[class*="grid-width"]:first-child {
  116. padding-left: 4%;
  117. }
  118. .grid-container-nested *[class*="grid-width"]:last-child {
  119. padding-right: 4%;
  120. }
  121. }
  122. .header-a {
  123. min-height: 140px;
  124. overflow: hidden;
  125. }
  126. .header-a .header-a-logo {
  127. margin: 40px 0 0;
  128. }
  129. @media (max-width: 900px) {
  130. .header-a .header-a-logo {
  131. text-align: center;
  132. }
  133. }
  134. .header-a .header-a-logo img {
  135. border: transparent;
  136. }
  137. .navigation-a {
  138. height: 30px;
  139. background: #3D3D3D;
  140. position: absolute;
  141. left: 0;
  142. right: 0;
  143. top: 0;
  144. padding: 0;
  145. overflow: hidden;
  146. }
  147. @media (max-width: 900px) {
  148. .navigation-a {
  149. text-align: center;
  150. }
  151. }
  152. .navigation-a ul {
  153. list-style: none;
  154. margin: 0;
  155. overflow: hidden;
  156. }
  157. .navigation-a ul li,
  158. .navigation-a ul li a {
  159. display: inline-block;
  160. }
  161. @media (max-width: 900px) {
  162. .navigation-a ul {
  163. width: auto;
  164. text-overflow: ellipsis;
  165. white-space: nowrap;
  166. display: inline-block;
  167. float: none;
  168. }
  169. .navigation-a ul:before,
  170. .navigation-a ul:after {
  171. display: none;
  172. }
  173. }
  174. .navigation-a ul.navigation-a-left {
  175. text-align: left;
  176. }
  177. @media (max-width: 900px) {
  178. .navigation-a ul.navigation-a-left {
  179. padding-right: 0;
  180. }
  181. }
  182. .navigation-a ul.navigation-a-right {
  183. text-align: right;
  184. }
  185. @media (max-width: 900px) {
  186. .navigation-a ul.navigation-a-right {
  187. padding-left: 23px;
  188. }
  189. }
  190. .navigation-a ul li + li {
  191. margin-left: 23px;
  192. }
  193. .navigation-a ul li a {
  194. font-size: 10px;
  195. font-size: 0.625rem;
  196. line-height: 18px;
  197. line-height: 1.13rem;
  198. line-height: 30px;
  199. float: left;
  200. color: #ddd;
  201. font-weight: bold;
  202. text-decoration: none;
  203. text-transform: uppercase;
  204. }
  205. .navigation-a ul li a:hover {
  206. cursor: pointer;
  207. color: #fff;
  208. }
  209. .icon-navigation-a-github:before,
  210. .icon-navigation-a-github:after {
  211. background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABMAAAATCAYAAAByUDbMAAAAAXNSR0IArs4c6QAAAa9JREFUOBGNlM8rRGEUht0pDGosjKYZpUSIkuwsiCaxUEqK2VOUBcrWv2BjxUJho6wsLLDzY2fhD5iR5NeOcJvIjOfM3O927m3mmlPPnPec835nZprvjlVVJvL5fCOjMWiDCLzCLVxZlpUj/x8saYV9+IZS8UJzFWoCt2GYgk+oJG4wJUouZDANv5VsUZ47dNSzkEYHfIDEHixDWgoiB/rTHlPPwBNInPmXHRb7hdeUDFG10AN1Th1Fd5mD6BMwMVnoUyVA3t3EkjkQlDFfmwPkc7NsQTXf0bGgJWaGb16dk18+EmLYawzkC+6Q3KdK4kiZqtGdskx/kmdlCJS86RuGrDLFZJmtGi1KB0q+VhOGsDLZsiyjGsOY4qoOkrO+YUauwCDoOKWo9xk9JfM+MPdSzqZdA8UlyDO3AvKLPsIG9LsmBHUKduEHdCy6PrpJZyKXdwKMOemaissOHJ9O9xTeh57GluMYIsehWy8STW/d8ZhkI0b9PjFasA1fsAOb0KCN1PLXYyKLGNdzj2YYArnZDyDRrA3Ua4UuDzd5QM/KaoxhmAO5Om5Qt8OI2/CJP6MVa1dvltQ5AAAAAElFTkSuQmCC");
  212. }
  213. .navigation-b {
  214. text-align: right;
  215. margin: 52px 0 0;
  216. overflow: visible;
  217. }
  218. @media (max-width: 900px) {
  219. .navigation-b {
  220. text-align: center;
  221. margin-top: 20px;
  222. padding: 0;
  223. }
  224. }
  225. .navigation-b ul {
  226. padding: 0;
  227. list-style: none;
  228. margin: 0;
  229. overflow: visible;
  230. }
  231. .navigation-b ul li,
  232. .navigation-b ul li a {
  233. display: inline-block;
  234. }
  235. @media (max-width: 900px) {
  236. .navigation-b ul {
  237. display: table;
  238. width: 100%;
  239. padding-bottom: 1.5em;
  240. }
  241. }
  242. @media (max-width: 900px) {
  243. .navigation-b ul li {
  244. display: table-row;
  245. }
  246. }
  247. .navigation-b ul li + li {
  248. margin-left: 20px;
  249. }
  250. @media (max-width: 900px) {
  251. .navigation-b ul li + li {
  252. margin-left: 0;
  253. }
  254. }
  255. .navigation-b ul li a {
  256. -webkit-box-sizing: border-box;
  257. -moz-box-sizing: border-box;
  258. box-sizing: border-box;
  259. text-transform: uppercase;
  260. text-decoration: none;
  261. outline: none;
  262. }
  263. @media (max-width: 900px) {
  264. .navigation-b ul li a {
  265. width: 100%;
  266. -webkit-border-radius: 0;
  267. -webkit-background-clip: padding-box;
  268. -moz-border-radius: 0;
  269. -moz-background-clip: padding;
  270. border-radius: 0;
  271. background-clip: padding-box;
  272. }
  273. }
  274. .footer-a {
  275. font-size: 13px;
  276. font-size: 0.8125rem;
  277. line-height: 23.4px;
  278. line-height: 1.46rem;
  279. padding-top: 2.25em;
  280. padding-bottom: 2.25em;
  281. overflow: hidden;
  282. color: #8a8a8a;
  283. }
  284. .footer-a a {
  285. color: #27C0D8;
  286. text-decoration: none;
  287. border-bottom: 1px dotted #27C0D8;
  288. }
  289. .footer-a a:hover {
  290. color: #23adc2;
  291. }
  292. .footer-a p {
  293. margin: 0;
  294. display: inline-block;
  295. text-align: center;
  296. }
  297. .content {
  298. font-size: 14px;
  299. font-size: 0.875rem;
  300. line-height: 25.2px;
  301. line-height: 1.57rem;
  302. overflow: hidden;
  303. padding-top: 1.5em;
  304. padding-bottom: 1.5em;
  305. }
  306. .content p {
  307. margin: 0.75em 0;
  308. }
  309. .content ul,
  310. .content ol,
  311. .content pre,
  312. .content blockquote,
  313. .content textarea:not([class^="cke"]),
  314. .content .cke {
  315. margin: 1.875em 0;
  316. }
  317. .content code,
  318. .content kbd {
  319. -webkit-border-radius: 3px;
  320. -webkit-background-clip: padding-box;
  321. -moz-border-radius: 3px;
  322. -moz-background-clip: padding;
  323. border-radius: 3px;
  324. background-clip: padding-box;
  325. padding: 3px 4px;
  326. }
  327. .content pre,
  328. .content code,
  329. .content kbd,
  330. .content blockquote {
  331. background: #f5f5f5;
  332. }
  333. .content blockquote,
  334. .content pre {
  335. background: none;
  336. border-left: 4px solid #27C0D8;
  337. padding: 1.5em 2.25em;
  338. }
  339. .content p a,
  340. .content ul a,
  341. .content ol a,
  342. .content blockquote a,
  343. .content h1 a,
  344. .content h2 a,
  345. .content h3 a,
  346. .content h4 a,
  347. .content h5 a {
  348. color: #27C0D8;
  349. text-decoration: none;
  350. border-bottom: 1px dotted #27C0D8;
  351. }
  352. .content p a:hover,
  353. .content ul a:hover,
  354. .content ol a:hover,
  355. .content blockquote a:hover,
  356. .content h1 a:hover,
  357. .content h2 a:hover,
  358. .content h3 a:hover,
  359. .content h4 a:hover,
  360. .content h5 a:hover {
  361. color: #23adc2;
  362. }
  363. .content h1,
  364. .content h2,
  365. .content h3,
  366. .content h4,
  367. .content h5 {
  368. color: #000;
  369. font-weight: 100;
  370. }
  371. .content h1 code,
  372. .content h2 code,
  373. .content h3 code,
  374. .content h4 code,
  375. .content h5 code,
  376. .content h1 kbd,
  377. .content h2 kbd,
  378. .content h3 kbd,
  379. .content h4 kbd,
  380. .content h5 kbd {
  381. font-size: inherit;
  382. }
  383. .content h1 a.content-heading-anchor,
  384. .content h2 a.content-heading-anchor,
  385. .content h3 a.content-heading-anchor,
  386. .content h4 a.content-heading-anchor,
  387. .content h5 a.content-heading-anchor {
  388. font-weight: 100;
  389. vertical-align: middle;
  390. opacity: 0;
  391. border: 0;
  392. }
  393. .content h1:hover a.content-heading-anchor,
  394. .content h2:hover a.content-heading-anchor,
  395. .content h3:hover a.content-heading-anchor,
  396. .content h4:hover a.content-heading-anchor,
  397. .content h5:hover a.content-heading-anchor {
  398. opacity: 1;
  399. }
  400. .content h1:target a,
  401. .content h2:target a,
  402. .content h3:target a,
  403. .content h4:target a,
  404. .content h5:target a {
  405. -webkit-animation: targetLinkOpacity 0.5s linear alternate;
  406. -moz-animation: targetLinkOpacity 0.5s linear alternate;
  407. -o-animation: targetLinkOpacity 0.5s linear alternate;
  408. animation: targetLinkOpacity 0.5s linear alternate;
  409. opacity: 1;
  410. }
  411. .content input,
  412. .content select,
  413. .content textarea:not([class^="cke"]) {
  414. -webkit-border-radius: 3px;
  415. -webkit-background-clip: padding-box;
  416. -moz-border-radius: 3px;
  417. -moz-background-clip: padding;
  418. border-radius: 3px;
  419. background-clip: padding-box;
  420. -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.08);
  421. -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.08);
  422. box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.08);
  423. font: inherit;
  424. color: inherit;
  425. border: 1px solid #D9D9D9;
  426. padding: .2em .5em;
  427. }
  428. .content input:focus,
  429. .content select:focus,
  430. .content textarea:not([class^="cke"]):focus {
  431. border-color: #66afe9;
  432. outline: 0;
  433. -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.08), 0 0 8px #93c6ef;
  434. -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.08), 0 0 8px #93c6ef;
  435. box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.08), 0 0 8px #93c6ef;
  436. }
  437. .content abbr {
  438. border-bottom: 1px dotted #666;
  439. cursor: pointer;
  440. }
  441. .content blockquote {
  442. font-style: italic;
  443. font-family: Georgia, Times, "Times New Roman", serif;
  444. font-size: 16px;
  445. font-size: 1rem;
  446. line-height: 28.8px;
  447. line-height: 1.8rem;
  448. }
  449. .content em {
  450. font-style: italic;
  451. }
  452. .content h1 {
  453. font-size: 36px;
  454. font-size: 2.25rem;
  455. line-height: 64.8px;
  456. line-height: 4.05rem;
  457. margin: 1.125em 0 0;
  458. }
  459. .content h2 {
  460. font-size: 27.2px;
  461. font-size: 1.7rem;
  462. line-height: 48.96px;
  463. line-height: 3.06rem;
  464. margin: 0.9em 0 0;
  465. }
  466. .content h3 {
  467. font-size: 24px;
  468. font-size: 1.5rem;
  469. line-height: 43.2px;
  470. line-height: 2.7rem;
  471. font-weight: 500;
  472. margin: 0.75em 0 0;
  473. }
  474. .content h4 {
  475. font-size: 19.2px;
  476. font-size: 1.2rem;
  477. line-height: 34.56px;
  478. line-height: 2.16rem;
  479. font-weight: 500;
  480. margin: 0.75em 0 0;
  481. }
  482. .content h5 {
  483. font-size: 17.6px;
  484. font-size: 1.1rem;
  485. line-height: 31.68px;
  486. line-height: 1.98rem;
  487. font-weight: 500;
  488. margin: 0.75em 0 0;
  489. }
  490. .content hr {
  491. border: 0;
  492. border-top: 4px solid #D9D9D9;
  493. margin: 1.5em 0;
  494. }
  495. .content input[type="text"] {
  496. height: 1.8em;
  497. line-height: 1.8em;
  498. }
  499. .content input[type="button"] {
  500. -webkit-appearance: button;
  501. -moz-appearance: button;
  502. appearance: button;
  503. }
  504. .content kbd {
  505. font-size: 12px;
  506. font-size: 0.75rem;
  507. line-height: 21.6px;
  508. line-height: 1.35rem;
  509. font-family: Arial, 'Helvetica Neue', Helvetica, sans-serif;
  510. padding: 2px 6px;
  511. -webkit-box-shadow: 0 0 4px #fff inset, 0 2px 0 #D9D9D9;
  512. -moz-box-shadow: 0 0 4px #fff inset, 0 2px 0 #D9D9D9;
  513. box-shadow: 0 0 4px #fff inset, 0 2px 0 #D9D9D9;
  514. }
  515. .content p img {
  516. vertical-align: middle;
  517. }
  518. .content p pre {
  519. padding: 1.5em;
  520. }
  521. .content pre {
  522. padding: 0;
  523. border: 0;
  524. tab-size: 4;
  525. -o-tab-size: 4;
  526. -moz-tab-size: 4;
  527. }
  528. .content pre,
  529. .content code {
  530. font-size: 11.89px;
  531. font-size: 0.743rem;
  532. line-height: 21.4px;
  533. line-height: 1.34rem;
  534. font-family: Consolas, Menlo, Monaco, Lucida Console, Liberation Mono, DejaVu Sans Mono, Bitstream Vera Sans Mono, Courier New, monospace, serif;
  535. }
  536. .content pre a,
  537. .content code a {
  538. border: 0;
  539. }
  540. .content pre code {
  541. padding: 0.75em;
  542. display: block;
  543. }
  544. .content strong {
  545. color: #000;
  546. }
  547. .content ul ul,
  548. .content ol ul,
  549. .content ul ol,
  550. .content ol ol {
  551. margin: 0.75em 0;
  552. }
  553. .content ul li,
  554. .content ol li {
  555. font-size: 14px;
  556. font-size: 0.875rem;
  557. line-height: 30.24px;
  558. line-height: 1.89rem;
  559. }
  560. .content textarea:not([class^="cke"]) {
  561. width: 100%;
  562. }
  563. .content div.todo {
  564. border: 2px dotted #444;
  565. padding: 10px;
  566. margin: 60px 0 10px 0;
  567. /* Remove me some day */
  568. }
  569. .content div.todo:before {
  570. content: "TODO";
  571. font-weight: bold;
  572. }
  573. body a.button-a,
  574. body button.button-a,
  575. body input.button-a {
  576. -webkit-border-radius: 3px;
  577. -webkit-background-clip: padding-box;
  578. -moz-border-radius: 3px;
  579. -moz-background-clip: padding;
  580. border-radius: 3px;
  581. background-clip: padding-box;
  582. font-size: 14px;
  583. font-size: 0.875rem;
  584. line-height: 25.2px;
  585. line-height: 1.57rem;
  586. height: 36px;
  587. line-height: 36px;
  588. padding: 0 1.1em;
  589. font-weight: 700;
  590. color: #3e3e3e;
  591. white-space: nowrap;
  592. text-decoration: none;
  593. display: inline-block;
  594. cursor: pointer;
  595. border: 0;
  596. vertical-align: middle;
  597. margin: 1px 0;
  598. background: transparent;
  599. }
  600. body a.button-a.icon-pos-left,
  601. body button.button-a.icon-pos-left,
  602. body input.button-a.icon-pos-left {
  603. padding-left: .8em;
  604. }
  605. body a.button-a.icon-pos-right,
  606. body button.button-a.icon-pos-right,
  607. body input.button-a.icon-pos-right {
  608. padding-right: .8em;
  609. }
  610. body a.button-a.button-a-no-text,
  611. body button.button-a.button-a-no-text,
  612. body input.button-a.button-a-no-text {
  613. -webkit-border-radius: 100px;
  614. -webkit-background-clip: padding-box;
  615. -moz-border-radius: 100px;
  616. -moz-background-clip: padding;
  617. border-radius: 100px;
  618. background-clip: padding-box;
  619. width: 36px;
  620. padding: 0;
  621. text-indent: -999px;
  622. overflow: hidden;
  623. position: relative;
  624. text-align: center;
  625. }
  626. body a.button-a.button-a-no-text:before,
  627. body button.button-a.button-a-no-text:before,
  628. body input.button-a.button-a-no-text:before {
  629. position: absolute;
  630. left: 50%;
  631. top: 50%;
  632. margin: -9px 0 0 -9px;
  633. }
  634. @media (max-width: 900px) {
  635. body a.button-a.button-a-mobile-collapsed,
  636. body button.button-a.button-a-mobile-collapsed,
  637. body input.button-a.button-a-mobile-collapsed {
  638. -webkit-border-radius: 100px;
  639. -webkit-background-clip: padding-box;
  640. -moz-border-radius: 100px;
  641. -moz-background-clip: padding;
  642. border-radius: 100px;
  643. background-clip: padding-box;
  644. width: 36px;
  645. padding: 0;
  646. text-indent: -999px;
  647. overflow: hidden;
  648. position: relative;
  649. text-align: center;
  650. }
  651. body a.button-a.button-a-mobile-collapsed:before,
  652. body button.button-a.button-a-mobile-collapsed:before,
  653. body input.button-a.button-a-mobile-collapsed:before {
  654. position: absolute;
  655. left: 50%;
  656. top: 50%;
  657. margin: -9px 0 0 -9px;
  658. }
  659. body a.button-a.button-a-mobile-collapsed:before,
  660. body button.button-a.button-a-mobile-collapsed:before,
  661. body input.button-a.button-a-mobile-collapsed:before {
  662. position: absolute;
  663. left: 50%;
  664. top: 50%;
  665. margin: -9px 0 0 -9px;
  666. }
  667. }
  668. body a.button-a:active,
  669. body button.button-a:active,
  670. body input.button-a:active,
  671. body a.button-a:hover,
  672. body button.button-a:hover,
  673. body input.button-a:hover {
  674. color: #fff;
  675. background: #23adc2;
  676. }
  677. body a.button-a:focus,
  678. body button.button-a:focus,
  679. body input.button-a:focus {
  680. border-color: #66afe9;
  681. outline: 0;
  682. -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px #93c6ef;
  683. -moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px #93c6ef;
  684. box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px #93c6ef;
  685. }
  686. body a.button-a-soft,
  687. body button.button-a-soft,
  688. body input.button-a-soft {
  689. background: #e7e7e7;
  690. }
  691. body a.button-a-soft:active,
  692. body button.button-a-soft:active,
  693. body input.button-a-soft:active,
  694. body a.button-a-soft:hover,
  695. body button.button-a-soft:hover,
  696. body input.button-a-soft:hover {
  697. color: #3e3e3e;
  698. background: #cecece;
  699. }
  700. body a.button-a-background,
  701. body button.button-a-background,
  702. body input.button-a-background,
  703. body a.navigation-b ul li a:hover,
  704. body button.navigation-b ul li a:hover,
  705. body input.navigation-b ul li a:hover {
  706. color: #fff;
  707. background: #27C0D8;
  708. }
  709. body a.button-a-background:active,
  710. body button.button-a-background:active,
  711. body input.button-a-background:active,
  712. body a.button-a-background:hover,
  713. body button.button-a-background:hover,
  714. body input.button-a-background:hover,
  715. body a.navigation-b ul li a:hover:active,
  716. body button.navigation-b ul li a:hover:active,
  717. body input.navigation-b ul li a:hover:active,
  718. body a.navigation-b ul li a:hover:hover,
  719. body button.navigation-b ul li a:hover:hover,
  720. body input.navigation-b ul li a:hover:hover {
  721. color: #fff;
  722. background: #23adc2;
  723. }
  724. .balloon-a {
  725. font-size: 12px;
  726. font-size: 0.75rem;
  727. line-height: 21.6px;
  728. line-height: 1.35rem;
  729. -webkit-border-radius: 3px;
  730. -webkit-background-clip: padding-box;
  731. -moz-border-radius: 3px;
  732. -moz-background-clip: padding;
  733. border-radius: 3px;
  734. background-clip: padding-box;
  735. border-bottom: 3px solid #d4d4d4;
  736. background: #ebebeb;
  737. display: inline-block;
  738. white-space: nowrap;
  739. padding: .4em 1.2em .2em;
  740. font-weight: 700;
  741. position: relative;
  742. z-index: 1000;
  743. text-transform: none;
  744. color: #575757;
  745. }
  746. .balloon-a:hover {
  747. color: #575757;
  748. }
  749. .balloon-a:before {
  750. content: '';
  751. width: 0;
  752. height: 0;
  753. border-style: solid;
  754. position: absolute;
  755. }
  756. .balloon-a-ne:before,
  757. .balloon-a-nw:before {
  758. top: -13px;
  759. border-width: 0 9px 15.6px 9px;
  760. border-color: transparent transparent #ebebeb transparent;
  761. }
  762. .balloon-a-se:before,
  763. .balloon-a-sw:before {
  764. bottom: -13px;
  765. border-width: 15.6px 9px 0 9px;
  766. border-color: #ebebeb transparent transparent transparent;
  767. }
  768. .balloon-a-nw:before,
  769. .balloon-a-sw:before {
  770. left: 20px;
  771. }
  772. .balloon-a-ne:before,
  773. .balloon-a-se:before {
  774. right: 20px;
  775. }
  776. .icon-pos-left:before,
  777. .icon-pos-right:after {
  778. content: '';
  779. display: inline-block;
  780. width: 18px;
  781. height: 18px;
  782. vertical-align: middle;
  783. background-repeat: no-repeat;
  784. }
  785. .icon-pos-left:before {
  786. margin-right: 10px;
  787. }
  788. .icon-pos-right:after {
  789. margin-left: 10px;
  790. }
  791. .icon-download:before,
  792. .icon-download:after {
  793. background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAASCAYAAABWzo5XAAAAAXNSR0IArs4c6QAAAQFJREFUOBGtVDESgjAQBGfobHwE/AIa/AN/8EEWfMWGZ+gDaG2ws8BdyY13SRgGcGducre3WQ5NSJIIxnGsES3ijhhcMCdXR7ZYCqIc0SGWQE1ud7sKjRLxXHJQfWpLYwaCk6wxET/u+U2GIngd8yRViINau28bBH/YAGqvSQPhRNQHqBqj3FY0NKq27TW7qhSTDaCOhkaRAj7Hmm8S4V+c6C+gUa+crsizuWmoc70MKbWCnqPy2GvcUJxE4a/sIajRaGkU+/sf4IuISQGePR/T/QMbHEhwPLVnMWPuOCwGnWg41dwVeaN3ccHch70idIRi/6WV0WC2/zMiZm661R+2DxyEdjTuST3mAAAAAElFTkSuQmCC");
  794. }
  795. .icon-question-mark:before,
  796. .icon-question-mark:after {
  797. background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAASCAYAAABWzo5XAAAAAXNSR0IArs4c6QAAAUhJREFUOBGllLFOAkEQhjk0WthT2JFA7Czsqc7OxFLewEeAZ/AVbO0tTLTSBKhstTBUNkYLEoVAbD2//zILe5e9uwCT/JnZmX/+m83ebq0WsCRJYnANxmBhUKxcHGjJpiC1wQBUmTjtbLetKHTAT5WCVxe3kxEjoUmKRL6pvYEZyJt6VpOxCG3nmfyx+yJxBM7BFPg2SDlkTv2sxZqi4YnUvfgswI9FuHAkzz9EUTTRmqYeTifXsvoj/s9i57oi6ljz9kviFdyBCbgHe+rCn4C8jVXQ18rshuKOiTSIXwLkRZWQTurARJrE7wERpea7kD7BkcgB+yB3CFGlPmgqCNiXhEagSGif2qU1Ln8FW/tupK3pXhXZrWNDuCoikY/rHPMT5KFr2MAPTSM90rIrUjJIeq1WV0RTwN7+0rrtILb9M+LEbLq1H7Z/Ea3+RvBddl0AAAAASUVORK5CYII=");
  798. }
  799. .icon-close:before,
  800. .icon-close:after {
  801. background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAASCAYAAABWzo5XAAAAAXNSR0IArs4c6QAAAUlJREFUOBGllDFuwzAMRe3Cd+jYKUCzd/XkDtm9dsoVOuUqBnqBoodwgBwiW8ZsXTIWqPu+Iia0LMAoTOBbJEV+UZTkosjIMAwN6MARXCKky9dkUsYuglagB3OimNU4O1pM1OB7jsHNK7YekeFQJZ5kj/0LcnLA+RMnlHOvDMNv5wO7BFuQkn3hq0ALjKwPVeF4BSaqpLRy0T1ZIHFz75bE2BR8dBImqmBrwRplg09QmR/9GZyBSadAHauXCZkRROKURLlHEemepJIlIyhHotzLg1/N6erTxtmmvqA8muHGIbc1rTBqrEuwnqWnGbbmmz0hwaHtvM2QhWbrXZnosvnTWWPrdCY9w7cDJtf3h9VHjy5Zq9UZ08beyJh7Aicg6W/VYvgnIjJdNn9PMIOITJWcgnV9VvcnEitY/mitNFZZ/hsxsljdv39sfybRQ4R/kU0MAAAAAElFTkSuQmCC");
  802. }
  803. .ie8 .switch > * {
  804. vertical-align: middle;
  805. }
  806. .ie8 .switch input[type="radio"] {
  807. margin: 0 0.25em;
  808. display: inline-block;
  809. }
  810. .ie8 .switch label {
  811. margin-left: 0 !important;
  812. margin-right: 0 !important;
  813. }
  814. .ie8 .switch label[data-for="1"] {
  815. float: left;
  816. }
  817. .ie8 .switch label[data-for="2"] {
  818. float: right;
  819. }
  820. .ie8 .switch .switch-inner {
  821. display: none;
  822. }
  823. .switch {
  824. font-size: 14px;
  825. font-size: 0.875rem;
  826. line-height: 25.2px;
  827. line-height: 1.57rem;
  828. font-weight: bold;
  829. background-color: #27C0D8;
  830. overflow: hidden;
  831. display: inline-block;
  832. padding: 0.75em 0.25em;
  833. color: #fff;
  834. -webkit-border-radius: 3px;
  835. -webkit-background-clip: padding-box;
  836. -moz-border-radius: 3px;
  837. -moz-background-clip: padding;
  838. border-radius: 3px;
  839. background-clip: padding-box;
  840. position: relative;
  841. }
  842. .switch input[type="radio"] {
  843. display: none;
  844. }
  845. .switch label {
  846. position: relative;
  847. z-index: 2;
  848. float: left;
  849. cursor: pointer;
  850. padding: 0 0.75em;
  851. }
  852. .switch label:hover {
  853. text-decoration: underline;
  854. }
  855. .switch .switch-inner {
  856. float: left;
  857. background-color: #FFF;
  858. height: 1.5em;
  859. width: 4.125em;
  860. padding: 2px;
  861. margin: 0 0.25em;
  862. -webkit-border-radius: 5.5px;
  863. -webkit-background-clip: padding-box;
  864. -moz-border-radius: 5.5px;
  865. -moz-background-clip: padding;
  866. border-radius: 5.5px;
  867. background-clip: padding-box;
  868. }
  869. .switch .switch-inner .handler {
  870. overflow: hidden;
  871. position: relative;
  872. display: block;
  873. height: 1.5em;
  874. width: 1.5em;
  875. background: #25b4cb;
  876. -webkit-border-radius: 4.5px;
  877. -webkit-background-clip: padding-box;
  878. -moz-border-radius: 4.5px;
  879. -moz-background-clip: padding;
  880. border-radius: 4.5px;
  881. background-clip: padding-box;
  882. }
  883. .switch .switch-inner .handler:before {
  884. content: '';
  885. display: block;
  886. position: absolute;
  887. top: 0;
  888. right: 0;
  889. bottom: 3px;
  890. left: 0;
  891. background-color: #34c4da;
  892. -webkit-border-bottom-left-radius: 4.5px;
  893. -moz-border-radius-bottomleft: 4.5px;
  894. border-bottom-left-radius: 4.5px;
  895. -webkit-border-bottom-right-radius: 4.5px;
  896. -webkit-background-clip: padding-box;
  897. -moz-border-radius-bottomright: 4.5px;
  898. -moz-background-clip: padding;
  899. border-bottom-right-radius: 4.5px;
  900. background-clip: padding-box;
  901. }
  902. .switch:hover .switch-inner .handler:before {
  903. background: #45c9dd;
  904. }
  905. .switch input[data-num="2"]:checked ~ .switch-inner > .handler {
  906. margin-left: auto;
  907. }
  908. .switch input[data-num="2"]:checked ~ label[data-for="1"] {
  909. padding-right: 5.125em;
  910. margin-right: -4.375em;
  911. }
  912. .switch input[data-num="1"]:checked ~ label[data-for="2"] {
  913. padding-left: 5.125em;
  914. margin-left: -4.375em;
  915. }
  916. .toggler {
  917. -webkit-user-select: none;
  918. -moz-user-select: none;
  919. -ms-user-select: none;
  920. user-select: none;
  921. }
  922. .toggler label {
  923. cursor: pointer;
  924. }
  925. .toggler [data-collapse] {
  926. display: inherit;
  927. }
  928. .toggler [data-expand] {
  929. display: none;
  930. }
  931. .toggler.collapsed [data-collapse] {
  932. display: none;
  933. }
  934. .toggler.collapsed [data-expand] {
  935. display: inherit;
  936. }
  937. .toggler-container {
  938. overflow: hidden;
  939. }
  940. .toggler-container.collapsed {
  941. height: 0;
  942. }
  943. .icon-toggler-expanded:before,
  944. .icon-toggler-collapsed:before,
  945. .icon-toggler-expanded:after,
  946. .icon-toggler-collapsed:after {
  947. background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAByCAYAAABeOoENAAAAAXNSR0IArs4c6QAAAbxJREFUaAXtmT1KBEEQhRdFQdBEMfQEBoaGopl3MfECXsFERLyBh/AUIuwJDEUQM//eB11Dz1A1uzotGFTBY2rr58306+kNpmazP7Z98V8Kj8JrAT4xcgttXRVXwofwFYAcNdS6RuJegOBTuBUOhc0CfGLkqKHWJeMuFDwJJ0Jk5Kihlp6esW4embuNkVgTNdTS09MMEbkDj76sUUsPvZ2xIwTRATsQuBuxGsTIYdSSo7cztpggwprdyKlJ8ImZUUuM3s48ol1lXwQjwydm5hINl2bF53KMCL82d2mR2GvqnBfg1+aKPbb9p+oGtYXbT1GTFxKiZkfEyHgy7x0y0clR454zSGpDMzaA3fzV30hNln4qkAqkAqlAKpAKpAKpQCqQCqQCqUAqkAqkAqlAKpAKpAKpQCrw3xWY/GGcz++TP9U3Gx40GWdEAxabXA33NBywRCOfdzFcCztDJv12Rz7REMpmIc9qPBNWK0J3COWNxegxIrs+KHZcyHpjsZUSXPaypcLtseJFS3tT84WwUZG4S4vEZkl3wl5FYK4rdrT9R9Y1uIbbT12TFxKiZkfEyCYfWojMJv+NGNGPr99GI9DP7P9TCgAAAABJRU5ErkJggg==");
  948. }
  949. .icon-toggler-expanded.icon-light:before,
  950. .icon-toggler-collapsed.icon-light:before,
  951. .icon-toggler-expanded.icon-light:after,
  952. .icon-toggler-collapsed.icon-light:after {
  953. background-image: url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAByCAYAAABeOoENAAAAAXNSR0IArs4c6QAAAcVJREFUaAXtmT9KA1EQxhMlASE2SkpPkCJlStHOu3gGwRPYBAm5gYfwFBKwtrARRAh26vr7ljfx7TrLChtBcAa+zOSbPy/7vcTC6fV+04qimIArsALrBMXiJq1nUzQEc/AOmkw51QzdgUqAWyD7AEswA6MExeKUk6n2+zBInSJ7BKfuaZDKpRpcMa/UQUgTfWSd1jjEmlSTatXzpRlvJKJsacVtXrVlB72bWgjdiGwmEj8FOq1u4qapRprJVvkgXbFsZCTxomSqL4ssr0uQrY3TJ/AGjeFfVJlM8diaiCuDdlLiIfmNcP1+/wnu0hoVJ84oq7XeUhNXbE4dgPuEgU2Qh3PFbrx+Gs6E2hD/+tMJ3b+QadB2fiLZsG4/2poG3f6M5MMiDgVCgVAgFAgFQoFQIBQIBUKBUCAUCAVCgVAgFAgFQoFQIBQIBf66AiwLuv1jnAH/Zb/Go5abq/qdwvsLFhJNK583ctfg0Bnmrnwq+zVrYoDZM8E52M1yP9uvqcGmZP6O+CTl3LWYHdTm9yk4aCzilLZHe6XmAuzZEGL30ZrEpr64AUc2wDycK7a7X6P42BpzD+9fv4pIxn4tWznnwm0r/gQpiG1tFshTowAAAABJRU5ErkJggg==");
  954. }
  955. .icon-toggler-expanded:before,
  956. .icon-toggler-expanded:after {
  957. background-position: top left;
  958. }
  959. .icon-toggler-collapsed:before,
  960. .icon-toggler-collapsed:after {
  961. background-position: bottom left;
  962. }
  963. .modal {
  964. padding: 20px;
  965. border-radius: 3px;
  966. background-color: white;
  967. max-width: 700px;
  968. -webkit-box-sizing: border-box;
  969. -moz-box-sizing: border-box;
  970. box-sizing: border-box;
  971. width: 80% !important;
  972. top: 50% !important;
  973. -webkit-transform: translate(-50%, -50%) !important;
  974. -moz-transform: translate(-50%, -50%) !important;
  975. -o-transform: translate(-50%, -50%) !important;
  976. -ms-transform: translate(-50%, -50%) !important;
  977. transform: translate(-50%, -50%) !important;
  978. }
  979. .modal-close {
  980. -webkit-border-radius: 100px;
  981. -webkit-background-clip: padding-box;
  982. -moz-border-radius: 100px;
  983. -moz-background-clip: padding;
  984. border-radius: 100px;
  985. background-clip: padding-box;
  986. cursor: pointer;
  987. height: 18px;
  988. width: 18px;
  989. position: absolute;
  990. top: 10px;
  991. right: 10px;
  992. font-size: 17px;
  993. text-align: center;
  994. line-height: 19px;
  995. background: #cccccc;
  996. }
  997. main .grid-container,
  998. header .grid-container,
  999. .navigation-a > div,
  1000. footer > div {
  1001. max-width: 968px;
  1002. }
  1003. .header-a {
  1004. margin-top: 30px;
  1005. }
  1006. .footer-a {
  1007. border-top: 1px solid #D9D9D9;
  1008. }
  1009. .adjoined-top {
  1010. background-color: #27C0D8;
  1011. color: #fff;
  1012. }
  1013. .adjoined-top .content h1,
  1014. .adjoined-top .content h2,
  1015. .adjoined-top .content h3,
  1016. .adjoined-top .content h4,
  1017. .adjoined-top .content h5 {
  1018. color: #fff;
  1019. }
  1020. .adjoined-top .content p {
  1021. font-size: 18px;
  1022. font-size: 1.125rem;
  1023. line-height: 32.4px;
  1024. line-height: 2.02rem;
  1025. font-weight: 100;
  1026. }
  1027. .adjoined-top .content p a {
  1028. text-decoration: none;
  1029. border-bottom: 1px dotted #fff;
  1030. color: inherit;
  1031. }
  1032. .adjoined-top .content p a:hover {
  1033. color: #e6e6e6;
  1034. }
  1035. .adjoined-top .content button {
  1036. color: #fff;
  1037. }
  1038. .adjoined-top .content strong {
  1039. color: #fff;
  1040. }
  1041. .adjoined-top .content code {
  1042. font-size: inherit;
  1043. color: #27C0D8;
  1044. }
  1045. .adjoined-bottom {
  1046. position: relative;
  1047. }
  1048. .adjoined-bottom:before {
  1049. z-index: -1;
  1050. content: '';
  1051. background: #27C0D8;
  1052. position: absolute;
  1053. top: 0;
  1054. left: 0;
  1055. right: 0;
  1056. height: 50%;
  1057. }
  1058. main .grid-container,
  1059. header .grid-container,
  1060. .navigation-a > div,
  1061. footer > div {
  1062. max-width: 1052px;
  1063. }
  1064. main .grid-container.freed-width {
  1065. max-width: none;
  1066. }
  1067. .switch {
  1068. background: #25b4cb;
  1069. float: right;
  1070. overflow: visible;
  1071. }
  1072. .switch .balloon-a {
  1073. position: absolute;
  1074. top: -40px;
  1075. right: 50%;
  1076. margin-right: -15px;
  1077. background: #FFEFC1;
  1078. border-bottom-color: #DCDCA4;
  1079. }
  1080. .switch .balloon-a:before {
  1081. border-color: #FFEFC1 transparent transparent transparent;
  1082. }
  1083. #toolbar .editors-container {
  1084. overflow: hidden;
  1085. height: 0;
  1086. transition: height 200ms;
  1087. }
  1088. #toolbar .editors-container.active {
  1089. height: auto;
  1090. }
  1091. #main #editor {
  1092. background: #FFF;
  1093. padding: 2% 4%;
  1094. border: dashed 5px #27C0D8;
  1095. }
  1096. #main .adjoined-top:before {
  1097. height: 335px;
  1098. }
  1099. #toolbar .adjoined-top:before {
  1100. height: 219px;
  1101. }
  1102. #toolbar .adjoined-top .grid-container-nested {
  1103. height: 147px;
  1104. }
  1105. .content .grid-switch-magic {
  1106. margin: 3.5em 0 0;
  1107. }
  1108. #info-box {
  1109. padding-bottom: 0;
  1110. }
  1111. #info-box > div {
  1112. width: 100%;
  1113. text-align: right;
  1114. }
  1115. #info-box > div .toggler {
  1116. padding-right: 0;
  1117. }
  1118. #info-box > div .toggler:hover {
  1119. background: transparent;
  1120. color: #000;
  1121. }
  1122. #info-box > div .toggler:hover > label {
  1123. text-decoration: underline;
  1124. }
  1125. #info-box > div h2 {
  1126. float: left;
  1127. margin-top: 0;
  1128. }
  1129. #info-box > div#instructions-container {
  1130. text-align: left;
  1131. }
  1132. #toolbarModifierWrapper {
  1133. overflow: hidden;
  1134. height: 0;
  1135. opacity: 0;
  1136. transition: height 200ms;
  1137. }
  1138. #toolbarModifierWrapper.active {
  1139. height: auto;
  1140. opacity: 1;
  1141. }
  1142. header {
  1143. overflow: visible;
  1144. }
  1145. header div.grid-container {
  1146. overflow: visible;
  1147. }
  1148. header .navigation-b {
  1149. overflow: visible;
  1150. }
  1151. header .navigation-b ul {
  1152. overflow: visible;
  1153. }
  1154. header .navigation-b a {
  1155. position: relative;
  1156. }
  1157. header .balloon-a {
  1158. position: absolute;
  1159. top: 48px;
  1160. left: 50%;
  1161. margin-left: -35px;
  1162. }
  1163. @media (max-width: 1140px) {
  1164. header .balloon-a {
  1165. left: auto;
  1166. margin-left: auto;
  1167. right: 50%;
  1168. margin-right: -35px;
  1169. }
  1170. header .balloon-a:before {
  1171. left: auto;
  1172. right: 22px;
  1173. }
  1174. }
  1175. @media (max-width: 900px) {
  1176. header .balloon-a {
  1177. display: none;
  1178. }
  1179. }
  1180. #toolbar .cke_toolbar {
  1181. pointer-events: none;
  1182. -webkit-user-select: none;
  1183. -moz-user-select: none;
  1184. -ms-user-select: none;
  1185. user-select: none;
  1186. cursor: default;
  1187. }
  1188. .some-toolbar-active .cke_toolbar {
  1189. zoom: 1;
  1190. filter: alpha(opacity=50);
  1191. -webkit-opacity: 0.5;
  1192. -moz-opacity: 0.5;
  1193. opacity: 0.5;
  1194. }
  1195. .cke_toolbar.active {
  1196. position: relative;
  1197. zoom: 1;
  1198. filter: alpha(opacity=100);
  1199. -webkit-opacity: 1;
  1200. -moz-opacity: 1;
  1201. opacity: 1;
  1202. }
  1203. .cke_toolbar.active:after {
  1204. content: '';
  1205. display: block;
  1206. position: absolute;
  1207. top: 0;
  1208. right: 6px;
  1209. bottom: 5px;
  1210. left: 0;
  1211. -webkit-border-radius: 5px;
  1212. -webkit-background-clip: padding-box;
  1213. -moz-border-radius: 5px;
  1214. -moz-background-clip: padding;
  1215. border-radius: 5px;
  1216. background-clip: padding-box;
  1217. -webkit-box-shadow: 0px 0px 15px 3px #fff4b0;
  1218. -moz-box-shadow: 0px 0px 15px 3px #fff4b0;
  1219. box-shadow: 0px 0px 15px 3px #fff4b0;
  1220. }
  1221. .cke_toolbar.active .cke_toolgroup {
  1222. -webkit-box-shadow: none;
  1223. -moz-box-shadow: none;
  1224. box-shadow: none;
  1225. border-color: #e3c300;
  1226. }
  1227. .cke_toolbar.active .cke_combo,
  1228. .cke_toolbar.active .cke_toolgroup {
  1229. position: relative;
  1230. z-index: 2;
  1231. }
  1232. .cke_toolbar.active .cke_combo_button {
  1233. -webkit-box-shadow: none;
  1234. -moz-box-shadow: none;
  1235. box-shadow: none;
  1236. }
  1237. .unselectable {
  1238. -webkit-user-select: none;
  1239. -moz-user-select: none;
  1240. -ms-user-select: none;
  1241. user-select: none;
  1242. }
  1243. .toolbar {
  1244. padding: 5px 0;
  1245. margin-bottom: 2.4em;
  1246. overflow: hidden;
  1247. background: #fff;
  1248. }
  1249. .toolbar button.button-a.cke_button {
  1250. cursor: pointer;
  1251. display: inline-block;
  1252. padding: 4px 6px;
  1253. outline: 0;
  1254. border: 1px solid #a6a6a6;
  1255. }
  1256. .toolbar button.button-a.hidden {
  1257. display: none;
  1258. }
  1259. .toolbar button.button-a.left {
  1260. float: left;
  1261. margin-right: 8px;
  1262. }
  1263. .toolbar button.button-a.right {
  1264. float: right;
  1265. margin-left: 8px;
  1266. }
  1267. .toolbar button.button-a .highlight {
  1268. color: #ffefc1;
  1269. }
  1270. .configContainer.hidden,
  1271. .toolbarModifier.hidden,
  1272. .toolbarModifier-hints.hidden {
  1273. display: none;
  1274. }
  1275. .toolbarModifier :focus,
  1276. .toolbar button:focus,
  1277. .configContainer textarea.configCode:focus {
  1278. outline: none;
  1279. }
  1280. div.toolbarModifier {
  1281. padding: 0;
  1282. overflow: hidden;
  1283. width: 100%;
  1284. position: relative;
  1285. display: table;
  1286. border-collapse: collapse;
  1287. }
  1288. div.toolbarModifier ::-moz-focus-inner {
  1289. border: 0;
  1290. }
  1291. div.toolbarModifier .empty {
  1292. display: none;
  1293. }
  1294. div.toolbarModifier.empty-visible .empty {
  1295. display: table-row;
  1296. zoom: 1;
  1297. filter: alpha(opacity=60);
  1298. -webkit-opacity: 0.6;
  1299. -moz-opacity: 0.6;
  1300. opacity: 0.6;
  1301. }
  1302. div.toolbarModifier .empty > p {
  1303. line-height: 31px;
  1304. }
  1305. div.toolbarModifier > ul {
  1306. padding: 0;
  1307. margin: 0;
  1308. border-top: 1px solid #ccc;
  1309. width: 100%;
  1310. }
  1311. div.toolbarModifier > ul[data-type="table-header"] {
  1312. display: table-header-group;
  1313. }
  1314. div.toolbarModifier > ul[data-type="table-body"] {
  1315. display: table-row-group;
  1316. }
  1317. div.toolbarModifier > ul p {
  1318. padding: 0;
  1319. margin: 0;
  1320. }
  1321. div.toolbarModifier > ul > li {
  1322. display: table-row;
  1323. }
  1324. div.toolbarModifier > ul > li[data-type="header"] {
  1325. font-weight: bold;
  1326. user-select: none;
  1327. cursor: default;
  1328. }
  1329. div.toolbarModifier > ul > li[data-type="group"],
  1330. div.toolbarModifier > ul > li[data-type="separator"] {
  1331. border-bottom: 1px solid #ccc;
  1332. }
  1333. div.toolbarModifier > ul > li[data-type="subgroup"] {
  1334. border-top: 1px solid #eee;
  1335. }
  1336. div.toolbarModifier > ul > li[data-type="subgroup"]:first-child {
  1337. border-top: none;
  1338. }
  1339. div.toolbarModifier > ul > li[data-type="group"].active,
  1340. div.toolbarModifier > ul > li[data-type="group"]:hover,
  1341. div.toolbarModifier > ul > li[data-type="separator"].active,
  1342. div.toolbarModifier > ul > li[data-type="separator"]:hover {
  1343. overflow: hidden;
  1344. z-index: 2;
  1345. }
  1346. div.toolbarModifier > ul > li[data-type="group"].active,
  1347. div.toolbarModifier > ul > li[data-type="separator"].active,
  1348. div.toolbarModifier > ul > li[data-type="group"].active:hover,
  1349. div.toolbarModifier > ul > li[data-type="separator"].active:hover {
  1350. background: #f0fafb;
  1351. }
  1352. div.toolbarModifier > ul > li[data-type="group"]:hover,
  1353. div.toolbarModifier > ul > li[data-type="separator"]:hover {
  1354. background: #fffbe3;
  1355. }
  1356. div.toolbarModifier > ul > li[data-type="separator"] {
  1357. background: #f5f5f5;
  1358. }
  1359. div.toolbarModifier > ul > li[data-type="separator"]:after {
  1360. content: '';
  1361. width: 100%;
  1362. }
  1363. div.toolbarModifier > ul > li[data-type="separator"] > p {
  1364. padding: 2px 5px;
  1365. }
  1366. div.toolbarModifier > ul > li > p,
  1367. div.toolbarModifier > ul > li > ul {
  1368. display: table-cell;
  1369. vertical-align: middle;
  1370. }
  1371. div.toolbarModifier > ul > li p {
  1372. padding-left: 5px;
  1373. min-width: 200px;
  1374. }
  1375. div.toolbarModifier > ul > li p span {
  1376. white-space: nowrap;
  1377. cursor: default;
  1378. }
  1379. div.toolbarModifier > ul > li p span button {
  1380. font-size: 12.666px;
  1381. margin-right: 5px;
  1382. cursor: pointer;
  1383. background: #fff;
  1384. -webkit-border-radius: 5px;
  1385. -webkit-background-clip: padding-box;
  1386. -moz-border-radius: 5px;
  1387. -moz-background-clip: padding;
  1388. border-radius: 5px;
  1389. background-clip: padding-box;
  1390. border: 1px solid #bbb;
  1391. padding: 0 7px;
  1392. line-height: 12px;
  1393. height: 20px;
  1394. }
  1395. div.toolbarModifier > ul > li p span button:not(.disabled):hover,
  1396. div.toolbarModifier > ul > li p span button:not(.disabled):focus {
  1397. color: #fff;
  1398. background-color: #454545;
  1399. border-color: transparent;
  1400. }
  1401. div.toolbarModifier > ul > li p span button.move.disabled {
  1402. cursor: default;
  1403. zoom: 1;
  1404. filter: alpha(opacity=20);
  1405. -webkit-opacity: 0.2;
  1406. -moz-opacity: 0.2;
  1407. opacity: 0.2;
  1408. }
  1409. div.toolbarModifier > ul > li ul {
  1410. border-collapse: collapse;
  1411. padding: 0;
  1412. width: 100%;
  1413. }
  1414. div.toolbarModifier > ul > li ul li {
  1415. display: table-row;
  1416. list-style-type: none;
  1417. line-height: 1;
  1418. }
  1419. div.toolbarModifier > ul > li ul li[data-type="subgroup"] {
  1420. border-top: 1px solid #ddd;
  1421. }
  1422. div.toolbarModifier > ul > li ul li[data-type="subgroup"]:first-child {
  1423. border-top: 0;
  1424. }
  1425. div.toolbarModifier > ul > li ul li[data-type="subgroup"] [data-type="button"] {
  1426. -webkit-border-radius: 3px;
  1427. -webkit-background-clip: padding-box;
  1428. -moz-border-radius: 3px;
  1429. -moz-background-clip: padding;
  1430. border-radius: 3px;
  1431. background-clip: padding-box;
  1432. padding: 0 2px;
  1433. }
  1434. div.toolbarModifier > ul > li ul li[data-type="subgroup"] [data-type="button"]:focus {
  1435. background: rgba(0, 0, 0, 0.04);
  1436. }
  1437. div.toolbarModifier > ul > li ul li[data-type="subgroup"] [data-type="button"] input {
  1438. vertical-align: middle;
  1439. }
  1440. div.toolbarModifier > ul > li ul li > p,
  1441. div.toolbarModifier > ul > li ul li > ul {
  1442. display: table-cell;
  1443. vertical-align: middle;
  1444. }
  1445. div.toolbarModifier > ul > li ul li ul {
  1446. padding: 0;
  1447. }
  1448. div.toolbarModifier > ul > li ul li ul li {
  1449. padding: 0;
  1450. display: inline-block;
  1451. cursor: pointer;
  1452. margin: 2px 5px 2px 0;
  1453. }
  1454. div.toolbarModifier > ul > li ul li ul li .cke_combo_text {
  1455. cursor: pointer;
  1456. white-space: nowrap;
  1457. }
  1458. div.toolbarModifier > ul > li ul li ul li .cke_toolgroup,
  1459. div.toolbarModifier > ul > li ul li ul li .cke_combo_button {
  1460. cursor: pointer;
  1461. margin: 0;
  1462. vertical-align: middle;
  1463. border: 1px solid #ddd;
  1464. font-size: 11.41px;
  1465. font-size: 0.713rem;
  1466. line-height: 20.54px;
  1467. line-height: 1.28rem;
  1468. }
  1469. div.toolbarModifier > .codemirror-wrapper {
  1470. overflow-y: auto;
  1471. }
  1472. div.toolbarModifier-hints {
  1473. float: right;
  1474. width: 350px;
  1475. min-width: 150px;
  1476. overflow-y: auto;
  1477. margin-left: 1.5em;
  1478. }
  1479. div.toolbarModifier-hints h3 {
  1480. font-size: 18.08px;
  1481. font-size: 1.13rem;
  1482. line-height: 32.54px;
  1483. line-height: 2.03rem;
  1484. padding: 0.36em 1.5em;
  1485. background: #f5f5f5;
  1486. border-bottom: 1px solid #ddd;
  1487. margin-top: 0;
  1488. margin-bottom: 1.2em;
  1489. }
  1490. div.toolbarModifier-hints dl {
  1491. margin-bottom: 1.2em;
  1492. overflow: hidden;
  1493. }
  1494. div.toolbarModifier-hints dl .list-header {
  1495. font-weight: bold;
  1496. border: 0;
  1497. padding-bottom: 0.6em;
  1498. }
  1499. div.toolbarModifier-hints dl > p {
  1500. text-align: center;
  1501. }
  1502. div.toolbarModifier-hints dl dt {
  1503. float: left;
  1504. width: 9em;
  1505. clear: both;
  1506. text-align: right;
  1507. border-top: 1px solid #ddd;
  1508. padding-left: 1.5em;
  1509. padding-right: .1em;
  1510. -webkit-box-sizing: border-box;
  1511. -moz-box-sizing: border-box;
  1512. box-sizing: border-box;
  1513. }
  1514. div.toolbarModifier-hints dl dt code {
  1515. background: none;
  1516. border: none;
  1517. vertical-align: middle;
  1518. }
  1519. div.toolbarModifier-hints dl dd {
  1520. margin-left: 10em;
  1521. clear: right;
  1522. padding-right: 1.5em;
  1523. }
  1524. div.toolbarModifier-hints dl dd code {
  1525. line-height: 2.2em;
  1526. }
  1527. div.toolbarModifier-hints dl dd:after {
  1528. content: '\00a0';
  1529. display: block;
  1530. clear: left;
  1531. float: right;
  1532. height: 0;
  1533. width: 0;
  1534. }
  1535. .toolbarModifier-hints,
  1536. .configContainer textarea.configCode,
  1537. .CodeMirror {
  1538. -webkit-border-radius: 3px;
  1539. -webkit-background-clip: padding-box;
  1540. -moz-border-radius: 3px;
  1541. -moz-background-clip: padding;
  1542. border-radius: 3px;
  1543. background-clip: padding-box;
  1544. border: 1px solid #ccc;
  1545. font-size: 13.01px;
  1546. font-size: 0.813rem;
  1547. line-height: 23.42px;
  1548. line-height: 1.46rem;
  1549. }
  1550. .configContainer textarea.configCode,
  1551. .CodeMirror pre,
  1552. .CodeMirror-linenumber {
  1553. font-size: 13.01px;
  1554. font-size: 0.813rem;
  1555. line-height: 23.42px;
  1556. line-height: 1.46rem;
  1557. font-family: Consolas, Menlo, Monaco, Lucida Console, Liberation Mono, DejaVu Sans Mono, Bitstream Vera Sans Mono, Courier New, monospace, serif;
  1558. }
  1559. .CodeMirror pre {
  1560. border: none;
  1561. padding: 0;
  1562. margin: 0;
  1563. }
  1564. .configContainer textarea.configCode {
  1565. -webkit-box-sizing: border-box;
  1566. -moz-box-sizing: border-box;
  1567. box-sizing: border-box;
  1568. color: #575757;
  1569. padding: 10px;
  1570. width: 100%;
  1571. min-height: 500px;
  1572. margin: 0;
  1573. resize: none;
  1574. outline: none;
  1575. -moz-tab-size: 4;
  1576. tab-size: 4;
  1577. white-space: pre;
  1578. word-wrap: normal;
  1579. overflow: auto;
  1580. }
  1581. .CodeMirror-hints.toolbar-modifier {
  1582. padding: 0;
  1583. color: #575757;
  1584. font-size: 14px;
  1585. font-size: 0.875rem;
  1586. line-height: 25.2px;
  1587. line-height: 1.57rem;
  1588. font-family: Consolas, Menlo, Monaco, Lucida Console, Liberation Mono, DejaVu Sans Mono, Bitstream Vera Sans Mono, Courier New, monospace, serif;
  1589. }
  1590. .CodeMirror-hints.toolbar-modifier .CodeMirror-hint-active {
  1591. color: #575757;
  1592. background: #f0fafb;
  1593. }
  1594. .CodeMirror-hints.toolbar-modifier > li:hover {
  1595. background: #fffbe3;
  1596. }
  1597. /* Text modifier */
  1598. #toolbarModifierWrapper {
  1599. margin-bottom: 1.2em;
  1600. }
  1601. #toolbarModifierWrapper .invalid .CodeMirror {
  1602. background: #fff8f8;
  1603. border-color: red;
  1604. }
  1605. #toolbarModifierWrapper .CodeMirror {
  1606. height: auto;
  1607. padding: 0 0.6em;
  1608. }
  1609. .staticContainer {
  1610. position: fixed;
  1611. top: 0;
  1612. width: 100%;
  1613. z-index: 10;
  1614. }
  1615. .staticContainer > .grid-container {
  1616. max-width: 1052px;
  1617. }
  1618. .staticContainer > .grid-container .inner {
  1619. background: #fff;
  1620. }
  1621. .staticContainer > .grid-container .inner .toolbar {
  1622. margin-bottom: 0;
  1623. }
  1624. #help {
  1625. position: relative;
  1626. top: -15px;
  1627. left: -5px;
  1628. }
  1629. #help-content {
  1630. display: none;
  1631. }
  1632. /*# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJzb3VyY2VzIjpbIi4uLy4uL25vZGVfbW9kdWxlcy9ja3NvdXJjZS1zYW1wbGVzLWZyYW1ld29yay9jb21wb25lbnRzL2dsb2JhbC9nbG9iYWwubGVzcyIsIi4uLy4uL25vZGVfbW9kdWxlcy9ja3NvdXJjZS1zYW1wbGVzLWZyYW1ld29yay9jb21wb25lbnRzL2NvcmUvY29yZS5sZXNzIiwiLi4vLi4vbm9kZV9tb2R1bGVzL2Nrc291cmNlLXNhbXBsZXMtZnJhbWV3b3JrL2NvbXBvbmVudHMvZ3JpZC9ncmlkLmxlc3MiLCIuLi8uLi9ub2RlX21vZHVsZXMvY2tzb3VyY2Utc2FtcGxlcy1mcmFtZXdvcmsvbm9kZV9tb2R1bGVzL2xlc3NoYXQvYnVpbGQvbGVzc2hhdC5sZXNzIiwiLi4vLi4vbm9kZV9tb2R1bGVzL2Nrc291cmNlLXNhbXBsZXMtZnJhbWV3b3JrL2NvbXBvbmVudHMvaGVhZGVyLWEvaGVhZGVyLWEubGVzcyIsIi4uLy4uL25vZGVfbW9kdWxlcy9ja3NvdXJjZS1zYW1wbGVzLWZyYW1ld29yay9jb21wb25lbnRzL25hdmlnYXRpb24tYS9uYXZpZ2F0aW9uLWEubGVzcyIsIi4uLy4uL25vZGVfbW9kdWxlcy9ja3NvdXJjZS1zYW1wbGVzLWZyYW1ld29yay9jb21wb25lbnRzL25hdmlnYXRpb24tYi9uYXZpZ2F0aW9uLWIubGVzcyIsIi4uLy4uL25vZGVfbW9kdWxlcy9ja3NvdXJjZS1zYW1wbGVzLWZyYW1ld29yay9jb21wb25lbnRzL2Zvb3Rlci1hL2Zvb3Rlci1hLmxlc3MiLCIuLi8uLi9ub2RlX21vZHVsZXMvY2tzb3VyY2Utc2FtcGxlcy1mcmFtZXdvcmsvY29tcG9uZW50cy9jb250ZW50L2NvbnRlbnQubGVzcyIsIi4uLy4uL25vZGVfbW9kdWxlcy9ja3NvdXJjZS1zYW1wbGVzLWZyYW1ld29yay9jb21wb25lbnRzL2J1dHRvbi1hL2J1dHRvbi1hLmxlc3MiLCIuLi8uLi9ub2RlX21vZHVsZXMvY2tzb3VyY2Utc2FtcGxlcy1mcmFtZXdvcmsvY29tcG9uZW50cy9iYWxsb29uLWEvYmFsbG9vbi1hLmxlc3MiLCIuLi8uLi9ub2RlX21vZHVsZXMvY2tzb3VyY2Utc2FtcGxlcy1mcmFtZXdvcmsvY29tcG9uZW50cy9pY29uL2ljb24ubGVzcyIsIi4uLy4uL25vZGVfbW9kdWxlcy9ja3NvdXJjZS1zYW1wbGVzLWZyYW1ld29yay9jb21wb25lbnRzL3N3aXRjaC9zd2l0Y2gubGVzcyIsIi4uLy4uL25vZGVfbW9kdWxlcy9ja3NvdXJjZS1zYW1wbGVzLWZyYW1ld29yay9jb21wb25lbnRzL3RvZ2dsZXIvdG9nZ2xlci5sZXNzIiwiLi4vLi4vbm9kZV9tb2R1bGVzL2Nrc291cmNlLXNhbXBsZXMtZnJhbWV3b3JrL2NvbXBvbmVudHMvbW9kYWwvbW9kYWwubGVzcyIsIi4uLy4uL25vZGVfbW9kdWxlcy9ja3NvdXJjZS1zYW1wbGVzLWZyYW1ld29yay9jb21wb25lbnRzL2Jhc2ljc2FtcGxlL2NvcmUubGVzcyIsIi4uLy4uL25vZGVfbW9kdWxlcy9ja3NvdXJjZS1zYW1wbGVzLWZyYW1ld29yay9jb21wb25lbnRzL2Jhc2ljc2FtcGxlL2Fkam9pbmVkLmxlc3MiLCIuLi8uLi9zYW1wbGVzL2xlc3MvY3VzdG9tLmxlc3MiLCIuLi8uLi9zYW1wbGVzL3Rvb2xiYXJjb25maWd1cmF0b3IvbGVzcy90b29sYmFybW9kaWZpZXIubGVzcyIsIi4uLy4uL3NhbXBsZXMvdG9vbGJhcmNvbmZpZ3VyYXRvci9sZXNzL2Jhc2UubGVzcyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiOzs7O0FBc0RBLFFBSGlDO0VBeUNoQztJQUNDLHdCQUFBOzs7QUMxRkY7QUFBUztBQUFPO0FBQVM7QUFBWTtBQUFRO0FBQVE7QUFBUTtBQUFRO0FBQU07QUFBTTtBQUFLO0VBQ3JGLGNBQUE7O0FBR0Q7QUFBTTtFQUNMLFNBQUE7RUFDQSxVQUFBO0VBQ0Esd0JETitCLHVDQ00vQjtFQUNBLGdCQUFBO0VBQ0EsY0FBQTs7QUNIQSxZQUFZO0VBQ1gsVUFBQTs7QUFERCxZQUFZO0VBQ1gsVUFBQTs7QUFERCxZQUFZO0VBQ1gsVUFBQTs7QUFERCxZQUFZO0VBQ1gsVUFBQTs7QUFERCxZQUFZO0VBQ1gsVUFBQTs7QUFERCxZQUFZO0VBQ1gsVUFBQTs7QUFERCxZQUFZO0VBQ1gsVUFBQTs7QUFERCxZQUFZO0VBQ1gsVUFBQTs7QUFERCxZQUFZO0VBQ1gsVUFBQTs7QUFERCxZQUFZO0VBQ1gsV0FBQTs7QUY0Q0YsUUFIaUM7RUVqQ2hDO0VBS0MsWUFBWTtFQUFaLFlBQVk7RUFBWixZQUFZO0VBQVosWUFBWTtFQUFaLFlBQVk7RUFBWixZQUFZO0VBQVosWUFBWTtFQUFaLFlBQVk7RUFBWixZQUFZO0lBSlosV0FBQTs7O0FBYUYsQ0FBQztFQ3FSQyw4QkFBQTtFQUNBLDJCQUFBO0VBQ0Esc0JBQUE7RURyUkQsZ0JBQUE7RUFDQSxpQkFBQTtFQUNBLFdBQUE7O0FBSUEsQ0FEQSxxQkFDQztBQUFELGVBQUM7QUFBUSxDQURULHFCQUNVO0FBQUQsZUFBQztFQUNULFNBQVMsRUFBVDtFQUNBLGNBQUE7RUFDQSxnQkFBQTtFQUNBLGtCQUFBO0VBQ0EsWUFBQTtFQUNBLGNBQUE7RUFDQSxRQUFBO0VBQ0EsU0FBQTs7QUFLRCxDQURBLHFCQUNDO0FBQUQsZUFBQztFQUNBLFdBQUE7O0FBSUY7RUMyUEUsOEJBQUE7RUFDQSwyQkFBQTtFQUNBLHNCQUFBO0VEM1BELGlCQUFBO0VBQ0Esa0JBQUE7O0FBS0Msc0JBREQsRUFBQyxxQkFDQztFQUNBLGVBQUE7O0FBR0Qsc0JBTEQsRUFBQyxxQkFLQztFQUNBLGdCQUFBOztBRmpCSCxRQUhpQztFRTBCOUIsc0JBREQsRUFBQyxxQkFDQztJQUNBLGdCQUFBOztFQUdELHNCQUxELEVBQUMscUJBS0M7SUFDQSxpQkFBQTs7O0FFN0VKO0VBQ0MsaUJBQUE7RUFHQSxnQkFBQTs7QUFKRCxTQU1DO0VBQ0MsZ0JBQUE7O0FKMENGLFFBSGlDO0VBNkNqQyxTSXJGQztJQUlFLGtCQUFBOzs7QUFWSCxTQU1DLGVBT0M7RUFDQyxtQkFBQTs7QUNWSDtFQUNDLFlBQUE7RUFDQSxtQkFBQTtFQUNBLGtCQUFBO0VBQ0EsT0FBQTtFQUNBLFFBQUE7RUFDQSxNQUFBO0VBQ0EsVUFBQTtFQUNBLGdCQUFBOztBTHFDRCxRQUhpQztFQTZDakM7SUs1RUUsa0JBQUE7OztBQVhGLGFBY0M7RUFDQyxnQkFBQTtFQUNBLFNBQUE7RUFDQSxnQkFBQTs7QUFqQkYsYUFjQyxHQUtDO0FBbkJGLGFBY0MsR0FLSyxHQUFHO0VBQ04scUJBQUE7O0FMeUJILFFBSGlDO0VBNkNqQyxhS3pFQztJQVVFLFdBQUE7SUFDQSx1QkFBQTtJQUNBLG1CQUFBO0lBQ0EscUJBQUE7SUFDQSxXQUFBOztFQUVBLGFBaEJGLEdBZ0JHO0VBQVMsYUFoQlosR0FnQmE7SUFDVixhQUFBOzs7QUFLRCxhQXRCRixHQXFCRSxhQUNDO0VBQ0EsZ