BookStack Code Mirror - bookstack/blob - public/dist/export-styles.css

   1 @charset "UTF-8";
   2 * {
   3   box-sizing: border-box; }
   4
   5 html {
   6   background-color: #FFFFFF;
   7   height: 100%;
   8   overflow-y: scroll; }
   9   html.flexbox {
  10     overflow-y: hidden; }
  11   html.shaded {
  12     background-color: #F2F2F2; }
  13
  14 body {
  15   font-size: 15px;
  16   line-height: 1.6;
  17   color: #616161;
  18   -webkit-font-smoothing: antialiased; }
  19   body.shaded {
  20     background-color: #F2F2F2; }
  21
  22 button {
  23   font-size: 100%; }
  24
  25 /**
  26  * Fonts
  27  */
  28 body, button, input, select, label, textarea {
  29   font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Oxygen", "Ubuntu", "Roboto", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif; }
  30
  31 .Codemirror, pre, #markdown-editor-input, .editor-toolbar, .code-base, code, span.code {
  32   font-family: "Lucida Console", "DejaVu Sans Mono", "Ubunto Mono", Monaco, monospace; }
  33
  34 /*
  35  * Header Styles
  36  */
  37 h1 {
  38   font-size: 3.425em;
  39   line-height: 1.22222222em;
  40   margin-top: 0.48888889em;
  41   margin-bottom: 0.48888889em; }
  42
  43 h2 {
  44   font-size: 2.8275em;
  45   line-height: 1.294117647em;
  46   margin-top: 0.8627451em;
  47   margin-bottom: 0.43137255em; }
  48
  49 h3 {
  50   font-size: 2.333em;
  51   line-height: 1.221428572em;
  52   margin-top: 0.78571429em;
  53   margin-bottom: 0.43137255em; }
  54
  55 h4 {
  56   font-size: 1.666em;
  57   line-height: 1.375em;
  58   margin-top: 0.78571429em;
  59   margin-bottom: 0.43137255em; }
  60
  61 h1, h2, h3, h4, h5, h6 {
  62   font-weight: 400;
  63   position: relative;
  64   display: block;
  65   color: #555; }
  66   h1 .subheader, h2 .subheader, h3 .subheader, h4 .subheader, h5 .subheader, h6 .subheader {
  67     font-size: 0.5em;
  68     line-height: 1em;
  69     color: #969696; }
  70
  71 h5 {
  72   font-size: 1.4em; }
  73
  74 h5, h6 {
  75   font-weight: 500;
  76   line-height: 1.2em;
  77   margin-top: 0.78571429em;
  78   margin-bottom: 0.66em; }
  79
  80 @media screen and (max-width: 600px) {
  81   h1 {
  82     font-size: 2.8275em; }
  83   h2 {
  84     font-size: 2.333em; }
  85   h3 {
  86     font-size: 1.666em; }
  87   h4 {
  88     font-size: 1.333em; }
  89   h5 {
  90     font-size: 1.161616em; } }
  91
  92 /*
  93  * Link styling
  94  */
  95 a, .link {
  96   color: #0288D1;
  97   cursor: pointer;
  98   text-decoration: none;
  99   transition: color ease-in-out 80ms;
 100   line-height: 1.6; }
 101   a:hover, .link:hover {
 102     text-decoration: underline;
 103     color: #01466c; }
 104   a.icon, .link.icon {
 105     display: inline-block; }
 106   a svg, .link svg {
 107     position: relative;
 108     display: inline-block; }
 109
 110 /*
 111  * Other HTML Text Elements
 112  */
 113 p, ul, ol, pre, table, blockquote {
 114   margin-top: 0.3em;
 115   margin-bottom: 1.375em; }
 116
 117 hr {
 118   border: 0;
 119   height: 1px;
 120   background: #EAEAEA;
 121   margin-bottom: 24px; }
 122   hr.faded {
 123     background-image: linear-gradient(to right, #FFF, #e3e0e0 20%, #e3e0e0 80%, #FFF); }
 124   hr.margin-top, hr.even {
 125     margin-top: 24px; }
 126
 127 strong, b, .bold, .strong {
 128   font-weight: bold; }
 129   strong > strong, strong > b, strong > .bold, strong > .strong, b > strong, b > b, b > .bold, b > .strong, .bold > strong, .bold > b, .bold > .bold, .bold > .strong, .strong > strong, .strong > b, .strong > .bold, .strong > .strong {
 130     font-weight: bolder; }
 131
 132 em, i, .italic {
 133   font-style: italic; }
 134
 135 small, p.small, span.small, .text-small {
 136   font-size: 0.8em;
 137   color: #777777; }
 138   small small, small p.small, small span.small, small .text-small, p.small small, p.small p.small, p.small span.small, p.small .text-small, span.small small, span.small p.small, span.small span.small, span.small .text-small, .text-small small, .text-small p.small, .text-small span.small, .text-small .text-small {
 139     font-size: 1em; }
 140
 141 sup, .superscript {
 142   vertical-align: super;
 143   font-size: 0.8em; }
 144
 145 sub, .subscript {
 146   vertical-align: sub;
 147   font-size: 0.8em; }
 148
 149 pre {
 150   font-size: 12px;
 151   background-color: #f5f5f5;
 152   border: 1px solid #DDD;
 153   padding-left: 31px;
 154   position: relative;
 155   padding-top: 3px;
 156   padding-bottom: 3px; }
 157   pre:after {
 158     content: '';
 159     display: block;
 160     position: absolute;
 161     top: 0;
 162     width: 29px;
 163     left: 0;
 164     background-color: #f5f5f5;
 165     height: 100%;
 166     border-right: 1px solid #DDD; }
 167
 168 @media print {
 169   pre {
 170     padding-left: 12px; }
 171   pre:after {
 172     display: none; } }
 173
 174 blockquote {
 175   display: block;
 176   position: relative;
 177   border-left: 4px solid #0288D1;
 178   background-color: #F8F8F8;
 179   padding: 12px 16px 12px 32px; }
 180   blockquote:before {
 181     content: "\201C";
 182     font-size: 2em;
 183     font-weight: bold;
 184     position: absolute;
 185     top: 12px;
 186     left: 12px;
 187     color: #777777; }
 188
 189 .code-base, code, span.code {
 190   background-color: #F8F8F8;
 191   font-size: 0.80em;
 192   border: 1px solid #DDD;
 193   border-radius: 3px; }
 194
 195 code {
 196   display: inline;
 197   padding: 1px 3px;
 198   white-space: pre;
 199   line-height: 1.2em;
 200   margin-bottom: 1.2em; }
 201
 202 span.code {
 203   padding: 1px 6px; }
 204
 205 pre code {
 206   background-color: transparent;
 207   border: 0;
 208   font-size: 1em;
 209   display: block;
 210   line-height: 1.6; }
 211
 212 /*
 213  * Text colors
 214  */
 215 p.pos, p .pos, span.pos, .text-pos {
 216   color: #52A256;
 217   fill: #52A256; }
 218   p.pos:hover, p .pos:hover, span.pos:hover, .text-pos:hover {
 219     color: #52A256;
 220     fill: #52A256; }
 221
 222 p.neg, p .neg, span.neg, .text-neg {
 223   color: #E84F4F;
 224   fill: #E84F4F; }
 225   p.neg:hover, p .neg:hover, span.neg:hover, .text-neg:hover {
 226     color: #E84F4F;
 227     fill: #E84F4F; }
 228
 229 p.muted, p .muted, span.muted, .text-muted {
 230   color: #868686;
 231   fill: #868686; }
 232   p.muted.small, p.muted .small, p .muted.small, p .muted .small, span.muted.small, span.muted .small, .text-muted.small, .text-muted .small {
 233     color: #969696;
 234     fill: #969696; }
 235
 236 p.primary, p .primary, span.primary, .text-primary {
 237   color: #0288D1;
 238   fill: #0288D1; }
 239   p.primary:hover, p .primary:hover, span.primary:hover, .text-primary:hover {
 240     color: #0288D1;
 241     fill: #0288D1; }
 242
 243 p.secondary, p .secondary, span.secondary, .text-secondary {
 244   color: #e27b41;
 245   fill: #e27b41; }
 246   p.secondary:hover, p .secondary:hover, span.secondary:hover, .text-secondary:hover {
 247     color: #e27b41;
 248     fill: #e27b41; }
 249
 250 .text-book {
 251   color: #009688;
 252   fill: #009688; }
 253   .text-book:hover {
 254     color: #009688;
 255     fill: #009688; }
 256
 257 .text-page {
 258   color: #0288D1;
 259   fill: #0288D1; }
 260   .text-page:hover {
 261     color: #0288D1;
 262     fill: #0288D1; }
 263   .text-page.draft {
 264     color: #9A60DA;
 265     fill: #9A60DA; }
 266   .text-page.draft:hover {
 267     color: #9A60DA;
 268     fill: #9A60DA; }
 269
 270 .text-chapter {
 271   color: #ef7c3c;
 272   fill: #ef7c3c; }
 273   .text-chapter:hover {
 274     color: #ef7c3c;
 275     fill: #ef7c3c; }
 276
 277 .faded .text-book:hover {
 278   color: #009688 !important;
 279   fill: #009688 !important; }
 280
 281 .faded .text-chapter:hover {
 282   color: #ef7c3c !important;
 283   fill: #ef7c3c !important; }
 284
 285 .faded .text-page:hover {
 286   color: #0288D1 !important;
 287   fill: #0288D1 !important; }
 288
 289 span.highlight {
 290   font-weight: bold;
 291   padding: 2px 4px; }
 292
 293 /*
 294  * Lists
 295  */
 296 ul, ol {
 297   overflow: hidden; }
 298   ul p, ol p {
 299     margin: 0; }
 300
 301 ul {
 302   padding-left: 20.8px;
 303   list-style: disc; }
 304   ul ul {
 305     list-style: circle;
 306     margin-top: 0;
 307     margin-bottom: 0; }
 308   ul label {
 309     margin: 0; }
 310
 311 ol {
 312   list-style: decimal;
 313   padding-left: 32px; }
 314
 315 li.checkbox-item, li.task-list-item {
 316   list-style: none;
 317   margin-left: -20.8px; }
 318   li.checkbox-item input[type="checkbox"], li.task-list-item input[type="checkbox"] {
 319     margin-right: 6px; }
 320
 321 /*
 322  * Generic text styling classes
 323  */
 324 .underlined {
 325   text-decoration: underline; }
 326
 327 .text-center {
 328   text-align: center; }
 329
 330 .text-left {
 331   text-align: left; }
 332
 333 .text-right {
 334   text-align: right; }
 335
 336 .text-bigger {
 337   font-size: 1.1em; }
 338
 339 .text-large {
 340   font-size: 1.6666em; }
 341
 342 .no-color {
 343   color: inherit; }
 344
 345 .break-text {
 346   word-wrap: break-word;
 347   overflow-wrap: break-word; }
 348
 349 /**
 350  * Grouping
 351  */
 352 .header-group {
 353   margin: 16px 0; }
 354   .header-group h1, .header-group h2, .header-group h3, .header-group h4, .header-group h5, .header-group h6 {
 355     margin: 0; }
 356
 357 span.sep {
 358   color: #BBB;
 359   padding: 0 6px; }
 360
 361 .list > * {
 362   display: block; }
 363
 364 /**
 365   * Icons
 366   */
 367 i {
 368   padding-right: 6px; }
 369
 370 .svg-icon {
 371   width: 1em;
 372   height: 1em;
 373   display: inline-block;
 374   position: relative;
 375   bottom: -0.105em;
 376   margin-right: 6px; }
 377
 378 /** Flexbox styling rules **/
 379 body.flexbox {
 380   display: flex;
 381   flex-direction: column;
 382   align-items: stretch;
 383   height: 100%;
 384   min-height: 100%;
 385   max-height: 100%;
 386   overflow: hidden; }
 387   body.flexbox #content {
 388     flex: 1;
 389     display: flex;
 390     min-height: 0; }
 391
 392 .flex-fill {
 393   display: flex;
 394   align-items: stretch;
 395   min-height: 0;
 396   max-width: 100%;
 397   position: relative; }
 398   .flex-fill.rows {
 399     flex-direction: row; }
 400   .flex-fill.columns {
 401     flex-direction: column; }
 402
 403 .flex {
 404   min-height: 0;
 405   flex: 1; }
 406
 407 .flex.scroll {
 408   display: flex; }
 409   .flex.scroll.sidebar {
 410     margin-right: -14px; }
 411
 412 .flex.scroll .scroll-body {
 413   overflow-y: scroll;
 414   flex: 1; }
 415
 416 .flex-child > div {
 417   flex: 1; }
 418
 419 .flex.sidebar {
 420   flex: 1;
 421   background-color: #F2F2F2;
 422   max-width: 360px;
 423   min-height: 90vh; }
 424
 425 .flex.sidebar + .flex.content {
 426   flex: 3;
 427   background-color: #FFFFFF;
 428   padding: 0 24px;
 429   border-left: 1px solid #DDD;
 430   max-width: 100%; }
 431
 432 .flex.sidebar .sidebar-toggle {
 433   display: none; }
 434
 435 @media screen and (max-width: 1100px) {
 436   body.sidebar-layout {
 437     padding-left: 30px; }
 438   .flex.sidebar {
 439     position: fixed;
 440     top: 0;
 441     left: 0;
 442     bottom: 0;
 443     z-index: 100;
 444     padding-right: 30px;
 445     width: 360px;
 446     box-shadow: none;
 447     -webkit-transform: translate3d(-330px, 0, 0);
 448             transform: translate3d(-330px, 0, 0);
 449     transition: -webkit-transform ease-in-out 120ms;
 450     transition: transform ease-in-out 120ms;
 451     transition: transform ease-in-out 120ms, -webkit-transform ease-in-out 120ms;
 452     display: flex;
 453     flex-direction: column; }
 454   .flex.sidebar.open {
 455     box-shadow: 1px 2px 2px 1px rgba(0, 0, 0, 0.1);
 456     -webkit-transform: translate3d(0, 0, 0);
 457             transform: translate3d(0, 0, 0); }
 458     .flex.sidebar.open .sidebar-toggle i {
 459       -webkit-transform: rotate(180deg);
 460               transform: rotate(180deg); }
 461   .flex.sidebar .sidebar-toggle {
 462     display: block;
 463     position: absolute;
 464     opacity: 0.9;
 465     right: 0;
 466     top: 0;
 467     bottom: 0;
 468     width: 30px;
 469     fill: #666;
 470     font-size: 20px;
 471     vertical-align: middle;
 472     text-align: center;
 473     border: 1px solid #DDD;
 474     border-top: 1px solid #BBB;
 475     padding-top: 16px;
 476     cursor: pointer; }
 477     .flex.sidebar .sidebar-toggle svg {
 478       opacity: 0.5;
 479       transition: all ease-in-out 120ms;
 480       margin: 0; }
 481     .flex.sidebar .sidebar-toggle:hover i {
 482       opacity: 1; }
 483   .sidebar .scroll-body {
 484     flex: 1;
 485     overflow-y: scroll; }
 486   #sidebar .scroll-body.fixed {
 487     width: auto !important; } }
 488
 489 @media screen and (min-width: 1100px) {
 490   #sidebar .scroll-body.fixed {
 491     z-index: 5;
 492     position: fixed;
 493     top: 0;
 494     padding-right: 16px;
 495     width: 30%;
 496     left: 0;
 497     height: 100%;
 498     overflow-y: auto;
 499     -ms-overflow-style: none;
 500     border-left: 1px solid #DDD; }
 501     #sidebar .scroll-body.fixed::-webkit-scrollbar {
 502       width: 0 !important; } }
 503
 504 /** Rules for all columns */
 505 div[class^="col-"] img {
 506   max-width: 100%; }
 507
 508 .container {
 509   max-width: 1400px;
 510   margin-left: auto;
 511   margin-right: auto;
 512   padding-left: 16px;
 513   padding-right: 16px; }
 514   .container.fluid {
 515     max-width: 100%; }
 516   .container.medium {
 517     max-width: 992px; }
 518   .container.small {
 519     max-width: 840px; }
 520   .container.nopad {
 521     padding-left: 0;
 522     padding-right: 0; }
 523
 524 .row {
 525   margin-left: -16px;
 526   margin-right: -16px; }
 527
 528 .grid {
 529   display: grid;
 530   grid-column-gap: 24px;
 531   grid-row-gap: 24px; }
 532   .grid.third {
 533     grid-template-columns: 1fr 1fr 1fr; }
 534
 535 .grid-card {
 536   display: flex;
 537   flex-direction: column;
 538   border: 1px solid #ddd;
 539   min-width: 100px; }
 540   .grid-card .grid-card-content {
 541     flex: 1; }
 542   .grid-card .grid-card-content, .grid-card .grid-card-footer {
 543     padding: 24px; }
 544   .grid-card .grid-card-content + .grid-card-footer {
 545     padding-top: 0; }
 546
 547 @media screen and (max-width: 800px) {
 548   .grid.third {
 549     grid-template-columns: 1fr 1fr; } }
 550
 551 @media screen and (max-width: 600px) {
 552   .grid.third {
 553     grid-template-columns: 1fr; } }
 554
 555 .float {
 556   float: left; }
 557   .float.right {
 558     float: right; }
 559
 560 .block {
 561   display: block;
 562   position: relative; }
 563
 564 .inline {
 565   display: inline; }
 566
 567 .block.inline {
 568   display: inline-block; }
 569
 570 .col-xs-1, .col-sm-1, .col-md-1, .col-lg-1, .col-xs-2, .col-sm-2, .col-md-2, .col-lg-2, .col-xs-3, .col-sm-3, .col-md-3, .col-lg-3, .col-xs-4, .col-sm-4, .col-md-4, .col-lg-4, .col-xs-5, .col-sm-5, .col-md-5, .col-lg-5, .col-xs-6, .col-sm-6, .col-md-6, .col-lg-6, .col-xs-7, .col-sm-7, .col-md-7, .col-lg-7, .col-xs-8, .col-sm-8, .col-md-8, .col-lg-8, .col-xs-9, .col-sm-9, .col-md-9, .col-lg-9, .col-xs-10, .col-sm-10, .col-md-10, .col-lg-10, .col-xs-11, .col-sm-11, .col-md-11, .col-lg-11, .col-xs-12, .col-sm-12, .col-md-12, .col-lg-12 {
 571   position: relative;
 572   min-height: 1px;
 573   padding-left: 16px;
 574   padding-right: 16px; }
 575
 576 .col-xs-1, .col-xs-2, .col-xs-3, .col-xs-4, .col-xs-5, .col-xs-6, .col-xs-7, .col-xs-8, .col-xs-9, .col-xs-10, .col-xs-11, .col-xs-12 {
 577   float: left; }
 578
 579 .col-xs-12 {
 580   width: 100%; }
 581
 582 .col-xs-11 {
 583   width: 91.66666667%; }
 584
 585 .col-xs-10 {
 586   width: 83.33333333%; }
 587
 588 .col-xs-9 {
 589   width: 75%; }
 590
 591 .col-xs-8 {
 592   width: 66.66666667%; }
 593
 594 .col-xs-7 {
 595   width: 58.33333333%; }
 596
 597 .col-xs-6 {
 598   width: 50%; }
 599
 600 .col-xs-5 {
 601   width: 41.66666667%; }
 602
 603 .col-xs-4 {
 604   width: 33.33333333%; }
 605
 606 .col-xs-3 {
 607   width: 25%; }
 608
 609 .col-xs-2 {
 610   width: 16.66666667%; }
 611
 612 .col-xs-1 {
 613   width: 8.33333333%; }
 614
 615 .col-xs-pull-12 {
 616   right: 100%; }
 617
 618 .col-xs-pull-11 {
 619   right: 91.66666667%; }
 620
 621 .col-xs-pull-10 {
 622   right: 83.33333333%; }
 623
 624 .col-xs-pull-9 {
 625   right: 75%; }
 626
 627 .col-xs-pull-8 {
 628   right: 66.66666667%; }
 629
 630 .col-xs-pull-7 {
 631   right: 58.33333333%; }
 632
 633 .col-xs-pull-6 {
 634   right: 50%; }
 635
 636 .col-xs-pull-5 {
 637   right: 41.66666667%; }
 638
 639 .col-xs-pull-4 {
 640   right: 33.33333333%; }
 641
 642 .col-xs-pull-3 {
 643   right: 25%; }
 644
 645 .col-xs-pull-2 {
 646   right: 16.66666667%; }
 647
 648 .col-xs-pull-1 {
 649   right: 8.33333333%; }
 650
 651 .col-xs-pull-0 {
 652   right: auto; }
 653
 654 .col-xs-push-12 {
 655   left: 100%; }
 656
 657 .col-xs-push-11 {
 658   left: 91.66666667%; }
 659
 660 .col-xs-push-10 {
 661   left: 83.33333333%; }
 662
 663 .col-xs-push-9 {
 664   left: 75%; }
 665
 666 .col-xs-push-8 {
 667   left: 66.66666667%; }
 668
 669 .col-xs-push-7 {
 670   left: 58.33333333%; }
 671
 672 .col-xs-push-6 {
 673   left: 50%; }
 674
 675 .col-xs-push-5 {
 676   left: 41.66666667%; }
 677
 678 .col-xs-push-4 {
 679   left: 33.33333333%; }
 680
 681 .col-xs-push-3 {
 682   left: 25%; }
 683
 684 .col-xs-push-2 {
 685   left: 16.66666667%; }
 686
 687 .col-xs-push-1 {
 688   left: 8.33333333%; }
 689
 690 .col-xs-push-0 {
 691   left: auto; }
 692
 693 .col-xs-offset-12 {
 694   margin-left: 100%; }
 695
 696 .col-xs-offset-11 {
 697   margin-left: 91.66666667%; }
 698
 699 .col-xs-offset-10 {
 700   margin-left: 83.33333333%; }
 701
 702 .col-xs-offset-9 {
 703   margin-left: 75%; }
 704
 705 .col-xs-offset-8 {
 706   margin-left: 66.66666667%; }
 707
 708 .col-xs-offset-7 {
 709   margin-left: 58.33333333%; }
 710
 711 .col-xs-offset-6 {
 712   margin-left: 50%; }
 713
 714 .col-xs-offset-5 {
 715   margin-left: 41.66666667%; }
 716
 717 .col-xs-offset-4 {
 718   margin-left: 33.33333333%; }
 719
 720 .col-xs-offset-3 {
 721   margin-left: 25%; }
 722
 723 .col-xs-offset-2 {
 724   margin-left: 16.66666667%; }
 725
 726 .col-xs-offset-1 {
 727   margin-left: 8.33333333%; }
 728
 729 .col-xs-offset-0 {
 730   margin-left: 0%; }
 731
 732 @media (min-width: 768px) {
 733   .col-sm-1, .col-sm-2, .col-sm-3, .col-sm-4, .col-sm-5, .col-sm-6, .col-sm-7, .col-sm-8, .col-sm-9, .col-sm-10, .col-sm-11, .col-sm-12 {
 734     float: left; }
 735   .col-sm-12 {
 736     width: 100%; }
 737   .col-sm-11 {
 738     width: 91.66666667%; }
 739   .col-sm-10 {
 740     width: 83.33333333%; }
 741   .col-sm-9 {
 742     width: 75%; }
 743   .col-sm-8 {
 744     width: 66.66666667%; }
 745   .col-sm-7 {
 746     width: 58.33333333%; }
 747   .col-sm-6 {
 748     width: 50%; }
 749   .col-sm-5 {
 750     width: 41.66666667%; }
 751   .col-sm-4 {
 752     width: 33.33333333%; }
 753   .col-sm-3 {
 754     width: 25%; }
 755   .col-sm-2 {
 756     width: 16.66666667%; }
 757   .col-sm-1 {
 758     width: 8.33333333%; }
 759   .col-sm-pull-12 {
 760     right: 100%; }
 761   .col-sm-pull-11 {
 762     right: 91.66666667%; }
 763   .col-sm-pull-10 {
 764     right: 83.33333333%; }
 765   .col-sm-pull-9 {
 766     right: 75%; }
 767   .col-sm-pull-8 {
 768     right: 66.66666667%; }
 769   .col-sm-pull-7 {
 770     right: 58.33333333%; }
 771   .col-sm-pull-6 {
 772     right: 50%; }
 773   .col-sm-pull-5 {
 774     right: 41.66666667%; }
 775   .col-sm-pull-4 {
 776     right: 33.33333333%; }
 777   .col-sm-pull-3 {
 778     right: 25%; }
 779   .col-sm-pull-2 {
 780     right: 16.66666667%; }
 781   .col-sm-pull-1 {
 782     right: 8.33333333%; }
 783   .col-sm-pull-0 {
 784     right: auto; }
 785   .col-sm-push-12 {
 786     left: 100%; }
 787   .col-sm-push-11 {
 788     left: 91.66666667%; }
 789   .col-sm-push-10 {
 790     left: 83.33333333%; }
 791   .col-sm-push-9 {
 792     left: 75%; }
 793   .col-sm-push-8 {
 794     left: 66.66666667%; }
 795   .col-sm-push-7 {
 796     left: 58.33333333%; }
 797   .col-sm-push-6 {
 798     left: 50%; }
 799   .col-sm-push-5 {
 800     left: 41.66666667%; }
 801   .col-sm-push-4 {
 802     left: 33.33333333%; }
 803   .col-sm-push-3 {
 804     left: 25%; }
 805   .col-sm-push-2 {
 806     left: 16.66666667%; }
 807   .col-sm-push-1 {
 808     left: 8.33333333%; }
 809   .col-sm-push-0 {
 810     left: auto; }
 811   .col-sm-offset-12 {
 812     margin-left: 100%; }
 813   .col-sm-offset-11 {
 814     margin-left: 91.66666667%; }
 815   .col-sm-offset-10 {
 816     margin-left: 83.33333333%; }
 817   .col-sm-offset-9 {
 818     margin-left: 75%; }
 819   .col-sm-offset-8 {
 820     margin-left: 66.66666667%; }
 821   .col-sm-offset-7 {
 822     margin-left: 58.33333333%; }
 823   .col-sm-offset-6 {
 824     margin-left: 50%; }
 825   .col-sm-offset-5 {
 826     margin-left: 41.66666667%; }
 827   .col-sm-offset-4 {
 828     margin-left: 33.33333333%; }
 829   .col-sm-offset-3 {
 830     margin-left: 25%; }
 831   .col-sm-offset-2 {
 832     margin-left: 16.66666667%; }
 833   .col-sm-offset-1 {
 834     margin-left: 8.33333333%; }
 835   .col-sm-offset-0 {
 836     margin-left: 0%; } }
 837
 838 @media (min-width: 992px) {
 839   .col-md-1, .col-md-2, .col-md-3, .col-md-4, .col-md-5, .col-md-6, .col-md-7, .col-md-8, .col-md-9, .col-md-10, .col-md-11, .col-md-12 {
 840     float: left; }
 841   .col-md-12 {
 842     width: 100%; }
 843   .col-md-11 {
 844     width: 91.66666667%; }
 845   .col-md-10 {
 846     width: 83.33333333%; }
 847   .col-md-9 {
 848     width: 75%; }
 849   .col-md-8 {
 850     width: 66.66666667%; }
 851   .col-md-7 {
 852     width: 58.33333333%; }
 853   .col-md-6 {
 854     width: 50%; }
 855   .col-md-5 {
 856     width: 41.66666667%; }
 857   .col-md-4 {
 858     width: 33.33333333%; }
 859   .col-md-3 {
 860     width: 25%; }
 861   .col-md-2 {
 862     width: 16.66666667%; }
 863   .col-md-1 {
 864     width: 8.33333333%; }
 865   .col-md-pull-12 {
 866     right: 100%; }
 867   .col-md-pull-11 {
 868     right: 91.66666667%; }
 869   .col-md-pull-10 {
 870     right: 83.33333333%; }
 871   .col-md-pull-9 {
 872     right: 75%; }
 873   .col-md-pull-8 {
 874     right: 66.66666667%; }
 875   .col-md-pull-7 {
 876     right: 58.33333333%; }
 877   .col-md-pull-6 {
 878     right: 50%; }
 879   .col-md-pull-5 {
 880     right: 41.66666667%; }
 881   .col-md-pull-4 {
 882     right: 33.33333333%; }
 883   .col-md-pull-3 {
 884     right: 25%; }
 885   .col-md-pull-2 {
 886     right: 16.66666667%; }
 887   .col-md-pull-1 {
 888     right: 8.33333333%; }
 889   .col-md-pull-0 {
 890     right: auto; }
 891   .col-md-push-12 {
 892     left: 100%; }
 893   .col-md-push-11 {
 894     left: 91.66666667%; }
 895   .col-md-push-10 {
 896     left: 83.33333333%; }
 897   .col-md-push-9 {
 898     left: 75%; }
 899   .col-md-push-8 {
 900     left: 66.66666667%; }
 901   .col-md-push-7 {
 902     left: 58.33333333%; }
 903   .col-md-push-6 {
 904     left: 50%; }
 905   .col-md-push-5 {
 906     left: 41.66666667%; }
 907   .col-md-push-4 {
 908     left: 33.33333333%; }
 909   .col-md-push-3 {
 910     left: 25%; }
 911   .col-md-push-2 {
 912     left: 16.66666667%; }
 913   .col-md-push-1 {
 914     left: 8.33333333%; }
 915   .col-md-push-0 {
 916     left: auto; }
 917   .col-md-offset-12 {
 918     margin-left: 100%; }
 919   .col-md-offset-11 {
 920     margin-left: 91.66666667%; }
 921   .col-md-offset-10 {
 922     margin-left: 83.33333333%; }
 923   .col-md-offset-9 {
 924     margin-left: 75%; }
 925   .col-md-offset-8 {
 926     margin-left: 66.66666667%; }
 927   .col-md-offset-7 {
 928     margin-left: 58.33333333%; }
 929   .col-md-offset-6 {
 930     margin-left: 50%; }
 931   .col-md-offset-5 {
 932     margin-left: 41.66666667%; }
 933   .col-md-offset-4 {
 934     margin-left: 33.33333333%; }
 935   .col-md-offset-3 {
 936     margin-left: 25%; }
 937   .col-md-offset-2 {
 938     margin-left: 16.66666667%; }
 939   .col-md-offset-1 {
 940     margin-left: 8.33333333%; }
 941   .col-md-offset-0 {
 942     margin-left: 0%; } }
 943
 944 @media (min-width: 1200px) {
 945   .col-lg-1, .col-lg-2, .col-lg-3, .col-lg-4, .col-lg-5, .col-lg-6, .col-lg-7, .col-lg-8, .col-lg-9, .col-lg-10, .col-lg-11, .col-lg-12 {
 946     float: left; }
 947   .col-lg-12 {
 948     width: 100%; }
 949   .col-lg-11 {
 950     width: 91.66666667%; }
 951   .col-lg-10 {
 952     width: 83.33333333%; }
 953   .col-lg-9 {
 954     width: 75%; }
 955   .col-lg-8 {
 956     width: 66.66666667%; }
 957   .col-lg-7 {
 958     width: 58.33333333%; }
 959   .col-lg-6 {
 960     width: 50%; }
 961   .col-lg-5 {
 962     width: 41.66666667%; }
 963   .col-lg-4 {
 964     width: 33.33333333%; }
 965   .col-lg-3 {
 966     width: 25%; }
 967   .col-lg-2 {
 968     width: 16.66666667%; }
 969   .col-lg-1 {
 970     width: 8.33333333%; }
 971   .col-lg-pull-12 {
 972     right: 100%; }
 973   .col-lg-pull-11 {
 974     right: 91.66666667%; }
 975   .col-lg-pull-10 {
 976     right: 83.33333333%; }
 977   .col-lg-pull-9 {
 978     right: 75%; }
 979   .col-lg-pull-8 {
 980     right: 66.66666667%; }
 981   .col-lg-pull-7 {
 982     right: 58.33333333%; }
 983   .col-lg-pull-6 {
 984     right: 50%; }
 985   .col-lg-pull-5 {
 986     right: 41.66666667%; }
 987   .col-lg-pull-4 {
 988     right: 33.33333333%; }
 989   .col-lg-pull-3 {
 990     right: 25%; }
 991   .col-lg-pull-2 {
 992     right: 16.66666667%; }
 993   .col-lg-pull-1 {
 994     right: 8.33333333%; }
 995   .col-lg-pull-0 {
 996     right: auto; }
 997   .col-lg-push-12 {
 998     left: 100%; }
 999   .col-lg-push-11 {
1000     left: 91.66666667%; }
1001   .col-lg-push-10 {
1002     left: 83.33333333%; }
1003   .col-lg-push-9 {
1004     left: 75%; }
1005   .col-lg-push-8 {
1006     left: 66.66666667%; }
1007   .col-lg-push-7 {
1008     left: 58.33333333%; }
1009   .col-lg-push-6 {
1010     left: 50%; }
1011   .col-lg-push-5 {
1012     left: 41.66666667%; }
1013   .col-lg-push-4 {
1014     left: 33.33333333%; }
1015   .col-lg-push-3 {
1016     left: 25%; }
1017   .col-lg-push-2 {
1018     left: 16.66666667%; }
1019   .col-lg-push-1 {
1020     left: 8.33333333%; }
1021   .col-lg-push-0 {
1022     left: auto; }
1023   .col-lg-offset-12 {
1024     margin-left: 100%; }
1025   .col-lg-offset-11 {
1026     margin-left: 91.66666667%; }
1027   .col-lg-offset-10 {
1028     margin-left: 83.33333333%; }
1029   .col-lg-offset-9 {
1030     margin-left: 75%; }
1031   .col-lg-offset-8 {
1032     margin-left: 66.66666667%; }
1033   .col-lg-offset-7 {
1034     margin-left: 58.33333333%; }
1035   .col-lg-offset-6 {
1036     margin-left: 50%; }
1037   .col-lg-offset-5 {
1038     margin-left: 41.66666667%; }
1039   .col-lg-offset-4 {
1040     margin-left: 33.33333333%; }
1041   .col-lg-offset-3 {
1042     margin-left: 25%; }
1043   .col-lg-offset-2 {
1044     margin-left: 16.66666667%; }
1045   .col-lg-offset-1 {
1046     margin-left: 8.33333333%; }
1047   .col-lg-offset-0 {
1048     margin-left: 0%; } }
1049
1050 .clearfix:before,
1051 .clearfix:after,
1052 .container:before,
1053 .container:after,
1054 .container-fluid:before,
1055 .container-fluid:after,
1056 .row:before,
1057 .row:after {
1058   content: " ";
1059   display: table; }
1060
1061 .clearfix:after,
1062 .container:after,
1063 .container-fluid:after,
1064 .row:after {
1065   clear: both; }
1066
1067 .center-block {
1068   display: block;
1069   margin-left: auto;
1070   margin-right: auto; }
1071
1072 /*
1073 * This file container all block styling including background shading,
1074 * margins, paddings & borders.
1075 */
1076 /*
1077 * Background Shading
1078 */
1079 .shaded {
1080   background-color: #f1f1f1; }
1081   .shaded.pos {
1082     background-color: #d6ead7; }
1083   .shaded.neg {
1084     background-color: #f4a9a9; }
1085   .shaded.primary {
1086     background-color: #a1ddfe; }
1087   .shaded.secondary {
1088     background-color: #f6d7c6; }
1089
1090 /*
1091 * Bordering
1092 */
1093 .bordered {
1094   border: 1px solid #BBB; }
1095   .bordered.pos {
1096     border-color: #52A256; }
1097   .bordered.neg {
1098     border-color: #E84F4F; }
1099   .bordered.primary {
1100     border-color: #0288D1; }
1101   .bordered.secondary {
1102     border-color: #e27b41; }
1103   .bordered.thick {
1104     border-width: 2px; }
1105
1106 .rounded {
1107   border-radius: 3px; }
1108
1109 /*
1110 * Padding
1111 */
1112 .nopadding {
1113   padding: 0; }
1114
1115 .padded {
1116   padding: 24px; }
1117   .padded.large {
1118     padding: 32px; }
1119   .padded > h1:first-child, .padded > h2:first-child, .padded > h3:first-child, .padded > h4:first-child {
1120     margin-top: 0.1em; }
1121
1122 .padded-vertical, .padded-top {
1123   padding-top: 16px; }
1124   .padded-vertical.large, .padded-top.large {
1125     padding-top: 32px; }
1126
1127 .padded-vertical, .padded-bottom {
1128   padding-bottom: 16px; }
1129   .padded-vertical.large, .padded-bottom.large {
1130     padding-bottom: 32px; }
1131
1132 .padded-horizontal, .padded-left {
1133   padding-left: 16px; }
1134   .padded-horizontal.large, .padded-left.large {
1135     padding-left: 32px; }
1136
1137 .padded-horizontal, .padded-right {
1138   padding-right: 16px; }
1139   .padded-horizontal.large, .padded-right.large {
1140     padding-right: 32px; }
1141
1142 /*
1143 * Margins
1144 */
1145 .margins {
1146   margin: 24px; }
1147   .margins.large {
1148     margin: 32px; }
1149
1150 .margins-vertical, .margin-top {
1151   margin-top: 16px; }
1152   .margins-vertical.large, .margin-top.large {
1153     margin-top: 32px; }
1154
1155 .margins-vertical, .margin-bottom {
1156   margin-bottom: 16px; }
1157   .margins-vertical.large, .margin-bottom.large {
1158     margin-bottom: 32px; }
1159
1160 .margins-horizontal, .margin-left {
1161   margin-left: 16px; }
1162   .margins-horizontal.large, .margin-left.large {
1163     margin-left: 32px; }
1164
1165 .margins-horizontal, .margin-right {
1166   margin-right: 16px; }
1167   .margins-horizontal.large, .margin-right.large {
1168     margin-right: 32px; }
1169
1170 /**
1171  * Callouts
1172  */
1173 .callout {
1174   border-left: 3px solid #BBB;
1175   background-color: #EEE;
1176   padding: 12px 12px 12px 32px;
1177   display: block;
1178   position: relative; }
1179   .callout:before {
1180     background-image: url("/icon/info-filled.svg?color=015380");
1181     background-repeat: no-repeat;
1182     content: '';
1183     width: 1.2em;
1184     height: 1.2em;
1185     left: 7px;
1186     top: 50%;
1187     margin-top: -9px;
1188     display: inline-block;
1189     position: absolute;
1190     line-height: 1;
1191     opacity: 0.8; }
1192   .callout.success {
1193     border-left-color: #52A256;
1194     background-color: #e7f3e7;
1195     color: #376c39; }
1196   .callout.success:before {
1197     background-image: url("/icon/check-circle.svg?color=376c39"); }
1198   .callout.danger {
1199     border-left-color: #E84F4F;
1200     background-color: #fce8e8;
1201     color: #b91818; }
1202   .callout.danger:before {
1203     background-image: url("/icon/danger.svg?color=b91818"); }
1204   .callout.info {
1205     border-left-color: #0288D1;
1206     background-color: #d3efff;
1207     color: #015380; }
1208   .callout.warning {
1209     border-left-color: #e27b41;
1210     background-color: #faeae0;
1211     color: #b6531c; }
1212   .callout.warning:before {
1213     background-image: url("/icon/warning.svg?color=b6531c"); }
1214
1215 .card {
1216   margin: 16px;
1217   background-color: #FFF;
1218   box-shadow: 0 0 1px 0 rgba(0, 0, 0, 0.2); }
1219   .card h3 {
1220     padding: 16px;
1221     border-bottom: 1px solid #E8E8E8;
1222     margin: 0;
1223     font-size: 14px;
1224     color: #888;
1225     fill: #888;
1226     font-weight: 400;
1227     text-transform: uppercase; }
1228   .card h3 a {
1229     line-height: 1; }
1230   .card .body, .card p.empty-text {
1231     padding: 16px; }
1232   .card a, .card p {
1233     word-wrap: break-word;
1234     word-break: break-word; }
1235
1236 .card.drag-card {
1237   border: 1px solid #DDD;
1238   border-radius: 4px;
1239   display: flex;
1240   padding: 0;
1241   padding-left: 40px;
1242   margin: 12px 0;
1243   position: relative; }
1244   .card.drag-card .drag-card-action {
1245     cursor: pointer; }
1246   .card.drag-card .handle, .card.drag-card .drag-card-action {
1247     display: flex;
1248     padding: 0;
1249     align-items: center;
1250     text-align: center;
1251     justify-content: center;
1252     width: 28px;
1253     padding-left: 6px;
1254     padding-right: 6px; }
1255     .card.drag-card .handle:hover, .card.drag-card .drag-card-action:hover {
1256       background-color: #EEE; }
1257     .card.drag-card .handle .svg-icon, .card.drag-card .drag-card-action .svg-icon {
1258       margin-right: 0px; }
1259   .card.drag-card > div .outline input {
1260     margin: 12px 0; }
1261   .card.drag-card > div.padded {
1262     padding: 12px 0 !important; }
1263   .card.drag-card .handle {
1264     background-color: #EEE;
1265     left: 0;
1266     position: absolute;
1267     top: 0;
1268     bottom: 0; }
1269   .card.drag-card > div {
1270     padding: 0 12px;
1271     max-width: 80%; }
1272
1273 .well {
1274   background-color: #F8F8F8;
1275   padding: 16px;
1276   border: 1px solid #DDD; }
1277
1278 .input-base, .fake-input, input[type="text"], input[type="number"], input[type="email"], input[type="date"], input[type="search"], input[type="url"], input[type="password"], select, textarea {
1279   background-color: #FFF;
1280   border-radius: 3px;
1281   border: 1px solid #D4D4D4;
1282   display: inline-block;
1283   font-size: 14px;
1284   padding: 9px;
1285   color: #666;
1286   width: 250px;
1287   max-width: 100%; }
1288   .input-base.neg, .neg.fake-input, input.neg[type="text"], input.neg[type="number"], input.neg[type="email"], input.neg[type="date"], input.neg[type="search"], input.neg[type="url"], input.neg[type="password"], select.neg, textarea.neg, .input-base.invalid, .invalid.fake-input, input.invalid[type="text"], input.invalid[type="number"], input.invalid[type="email"], input.invalid[type="date"], input.invalid[type="search"], input.invalid[type="url"], input.invalid[type="password"], select.invalid, textarea.invalid {
1289     border: 1px solid #E84F4F; }
1290   .input-base.pos, .pos.fake-input, input.pos[type="text"], input.pos[type="number"], input.pos[type="email"], input.pos[type="date"], input.pos[type="search"], input.pos[type="url"], input.pos[type="password"], select.pos, textarea.pos, .input-base.valid, .valid.fake-input, input.valid[type="text"], input.valid[type="number"], input.valid[type="email"], input.valid[type="date"], input.valid[type="search"], input.valid[type="url"], input.valid[type="password"], select.valid, textarea.valid {
1291     border: 1px solid #52A256; }
1292   .input-base.disabled, .disabled.fake-input, input.disabled[type="text"], input.disabled[type="number"], input.disabled[type="email"], input.disabled[type="date"], input.disabled[type="search"], input.disabled[type="url"], input.disabled[type="password"], select.disabled, textarea.disabled, .input-base[disabled], [disabled].fake-input, input[disabled][type="text"], input[disabled][type="number"], input[disabled][type="email"], input[disabled][type="date"], input[disabled][type="search"], input[disabled][type="url"], input[disabled][type="password"], select[disabled], textarea[disabled] {
1293     background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAcAAAAHCAYAAADEUlfTAAAAMUlEQVQIW2NkwAGuXbv2nxGbHEhCS0uLEUMSJgHShCKJLIEiiS4Bl8QmAZbEJQGSBAC62BuJ+tt7zgAAAABJRU5ErkJggg==); }
1294   .input-base:focus, .fake-input:focus, input[type="text"]:focus, input[type="number"]:focus, input[type="email"]:focus, input[type="date"]:focus, input[type="search"]:focus, input[type="url"]:focus, input[type="password"]:focus, select:focus, textarea:focus {
1295     outline: 0; }
1296
1297 .fake-input {
1298   overflow: auto; }
1299
1300 #html-editor {
1301   display: none; }
1302
1303 #markdown-editor {
1304   position: relative;
1305   z-index: 5; }
1306   #markdown-editor #markdown-editor-input {
1307     font-style: normal;
1308     font-weight: 400;
1309     padding: 6px 16px;
1310     color: #444;
1311     border-radius: 0;
1312     max-height: 100%;
1313     flex: 1;
1314     border: 0;
1315     width: 100%; }
1316     #markdown-editor #markdown-editor-input:focus {
1317       outline: 0; }
1318   #markdown-editor .markdown-display, #markdown-editor .markdown-editor-wrap {
1319     flex: 1;
1320     position: relative; }
1321   #markdown-editor .markdown-editor-wrap {
1322     display: flex;
1323     flex-direction: column;
1324     border: 1px solid #DDD;
1325     width: 50%;
1326     max-width: 50%; }
1327
1328 .markdown-display {
1329   padding: 0 16px 0;
1330   margin-left: -1px;
1331   overflow-y: scroll; }
1332   .markdown-display.page-content {
1333     margin: 0 auto;
1334     width: 100%;
1335     max-width: 100%; }
1336   .markdown-display [drawio-diagram]:hover {
1337     outline: 2px solid #0288D1; }
1338
1339 .editor-toolbar {
1340   width: 100%;
1341   padding: 6px 16px;
1342   font-size: 11px;
1343   line-height: 1.6;
1344   border-bottom: 1px solid #DDD;
1345   background-color: #EEE;
1346   flex: none; }
1347   .editor-toolbar:after {
1348     content: '';
1349     display: block;
1350     clear: both; }
1351
1352 label {
1353   display: block;
1354   line-height: 1.4em;
1355   font-size: 0.94em;
1356   font-weight: 400;
1357   color: #999;
1358   padding-bottom: 2px;
1359   margin-bottom: 0.2em; }
1360   label.inline {
1361     display: inline-block; }
1362
1363 label.radio, label.checkbox {
1364   font-weight: 400;
1365   -webkit-user-select: none;
1366      -moz-user-select: none;
1367       -ms-user-select: none;
1368           user-select: none; }
1369   label.radio input[type="radio"], label.radio input[type="checkbox"], label.checkbox input[type="radio"], label.checkbox input[type="checkbox"] {
1370     margin-right: 6px; }
1371
1372 label.inline.checkbox {
1373   margin-right: 16px; }
1374
1375 label + p.small {
1376   margin-bottom: 0.8em; }
1377
1378 table.form-table {
1379   max-width: 100%; }
1380   table.form-table td {
1381     overflow: hidden;
1382     padding: 1.5px 0; }
1383
1384 input[type=date] {
1385   width: 190px; }
1386
1387 .toggle-switch {
1388   display: inline-block;
1389   background-color: #BBB;
1390   width: 36px;
1391   height: 14px;
1392   border-radius: 7px;
1393   position: relative;
1394   transition: all ease-in-out 120ms;
1395   cursor: pointer;
1396   -webkit-user-select: none;
1397      -moz-user-select: none;
1398       -ms-user-select: none;
1399           user-select: none; }
1400   .toggle-switch:after {
1401     content: '';
1402     display: block;
1403     position: relative;
1404     left: 0;
1405     margin-top: -3px;
1406     width: 20px;
1407     height: 20px;
1408     border-radius: 50%;
1409     background-color: #fafafa;
1410     border: 1px solid #CCC;
1411     box-shadow: 0 2px 2px 0 rgba(0, 0, 0, 0.14), 0 3px 1px -2px rgba(0, 0, 0, 0.2), 0 1px 5px 0 rgba(0, 0, 0, 0.12);
1412     transition: all ease-in-out 120ms; }
1413   .toggle-switch.active {
1414     background-color: rgba(82, 162, 86, 0.4); }
1415     .toggle-switch.active:after {
1416       left: 16px;
1417       background-color: #52A256;
1418       border: #305e32; }
1419
1420 .toggle-switch-checkbox {
1421   display: none; }
1422
1423 input:checked + .toggle-switch {
1424   background-color: rgba(82, 162, 86, 0.4); }
1425   input:checked + .toggle-switch:after {
1426     left: 16px;
1427     background-color: #52A256;
1428     border: #305e32; }
1429
1430 .form-group {
1431   margin-bottom: 12px; }
1432   .form-group textarea {
1433     display: block;
1434     width: 100%;
1435     min-height: 64px; }
1436
1437 .simple-code-input {
1438   background-color: #F8F8F8;
1439   font-family: monospace;
1440   font-size: 12px;
1441   min-height: 100px; }
1442
1443 .form-group .text-pos, .form-group .text-neg {
1444   padding: 6px 0; }
1445
1446 .form-group[collapsible] {
1447   margin-left: -16px;
1448   margin-right: -16px;
1449   padding: 0 16px;
1450   border-top: 1px solid #DDD;
1451   border-bottom: 1px solid #DDD; }
1452   .form-group[collapsible] .collapse-title {
1453     margin-left: -16px;
1454     margin-right: -16px;
1455     padding: 12px 16px; }
1456   .form-group[collapsible] .collapse-title, .form-group[collapsible] .collapse-title label {
1457     cursor: pointer; }
1458   .form-group[collapsible] .collapse-title label {
1459     padding-bottom: 0;
1460     margin-bottom: 0;
1461     color: inherit; }
1462   .form-group[collapsible] .collapse-title label:before {
1463     display: inline-block;
1464     content: '\25B8';
1465     margin-right: 16px;
1466     transition: all ease-in-out 400ms;
1467     -webkit-transform: rotate(0);
1468             transform: rotate(0); }
1469   .form-group[collapsible] .collapse-content {
1470     display: none;
1471     padding-bottom: 16px; }
1472   .form-group[collapsible].open .collapse-title label:before {
1473     -webkit-transform: rotate(90deg);
1474             transform: rotate(90deg); }
1475
1476 .inline-input-style, .title-input input[type="text"], .description-input textarea {
1477   display: block;
1478   width: 100%;
1479   padding: 12px; }
1480
1481 .title-input input[type="text"] {
1482   margin-top: 0;
1483   font-size: 2em; }
1484
1485 .title-input.page-title {
1486   font-size: 0.8em; }
1487   .title-input.page-title .input {
1488     border: 0;
1489     margin-bottom: -1px; }
1490   .title-input.page-title input[type="text"] {
1491     max-width: 840px;
1492     margin: 0 auto;
1493     border: none; }
1494
1495 .page-title input {
1496   display: block;
1497   width: 100%;
1498   font-size: 1.4em; }
1499
1500 .description-input textarea {
1501   font-size: 15px;
1502   color: #666;
1503   width: 100%; }
1504
1505 div[editor-type="markdown"] .title-input.page-title input[type="text"] {
1506   max-width: 100%; }
1507
1508 .search-box {
1509   max-width: 100%;
1510   position: relative; }
1511   .search-box button {
1512     background-color: transparent;
1513     border: none;
1514     color: #0288D1;
1515     padding: 0;
1516     cursor: pointer;
1517     position: absolute;
1518     left: 8px;
1519     top: 9.5px; }
1520   .search-box input {
1521     display: block;
1522     padding-left: 24px;
1523     width: 300px;
1524     max-width: 100%; }
1525
1526 .outline > input {
1527   border: 0;
1528   border-bottom: 2px solid #DDD;
1529   border-radius: 0; }
1530   .outline > input:focus, .outline > input:active {
1531     border: 0;
1532     border-bottom: 2px solid #AAA;
1533     outline: 0; }
1534
1535 #login-form label[for="remember"] {
1536   margin: 0; }
1537
1538 #login-form label.toggle-switch {
1539   margin-left: 32px; }
1540
1541 .image-picker img {
1542   background-color: #BBB; }
1543
1544 table {
1545   min-width: 100px;
1546   max-width: 100%; }
1547   table thead {
1548     background-color: #F8F8F8;
1549     font-weight: 500; }
1550   table td, table th {
1551     min-width: 10px;
1552     padding: 6px 8px;
1553     border: 1px solid #DDD;
1554     overflow: auto;
1555     line-height: 1.2; }
1556   table td p, table th p {
1557     margin: 0; }
1558
1559 table.table {
1560   width: 100%; }
1561   table.table tr {
1562     border-bottom: 1px solid #DDD; }
1563   table.table th, table.table td {
1564     text-align: left;
1565     border: none;
1566     padding: 6px 6px;
1567     vertical-align: middle;
1568     margin: 0; }
1569   table.table th {
1570     font-weight: bold; }
1571   table.table tr:hover {
1572     background-color: #EEE; }
1573   table.table .text-right {
1574     text-align: right; }
1575   table.table .text-center {
1576     text-align: center; }
1577
1578 table.no-style td {
1579   border: 0;
1580   padding: 0; }
1581
1582 table.list-table {
1583   margin: -6px; }
1584   table.list-table td {
1585     border: 0;
1586     vertical-align: middle;
1587     padding: 6px; }
1588
1589 /**
1590  * Includes the main navigation header and the faded toolbar.
1591  */
1592 header {
1593   display: block;
1594   z-index: 2;
1595   top: 0;
1596   background-color: #0288D1;
1597   color: #fff;
1598   fill: #fff;
1599   border-bottom: 1px solid #DDD; }
1600   header .padded {
1601     padding: 16px; }
1602   header .links {
1603     display: inline-block;
1604     vertical-align: top;
1605     margin-right: 32px; }
1606     @media screen and (max-width: 992px) {
1607       header .links {
1608         margin-right: 16px; } }
1609   header .links a {
1610     display: inline-block;
1611     padding: 16px 24px;
1612     color: #FFF;
1613     fill: #FFF; }
1614     header .links a:last-child {
1615       padding-right: 0; }
1616     @media screen and (max-width: 992px) {
1617       header .links a {
1618         padding: 16px 12px; } }
1619   header .avatar, header .user-name {
1620     display: inline-block; }
1621   header .avatar {
1622     width: 30px;
1623     height: 30px; }
1624   header .user-name {
1625     vertical-align: top;
1626     padding-top: 16px;
1627     position: relative;
1628     top: -3px;
1629     display: inline-block;
1630     cursor: pointer; }
1631     header .user-name > * {
1632       vertical-align: top; }
1633     header .user-name > span {
1634       padding-left: 6px;
1635       display: inline-block;
1636       padding-top: 3px; }
1637     header .user-name > svg {
1638       padding-top: 4px;
1639       font-size: 18px; }
1640     @media screen and (max-width: 992px) {
1641       header .user-name {
1642         padding-left: 6px; }
1643         header .user-name .name {
1644           display: none; } }
1645   @media screen and (max-width: 768px) {
1646     header {
1647       text-align: center; }
1648       header .float.right {
1649         float: none; }
1650       header .links a {
1651         padding: 12px; }
1652       header .user-name {
1653         padding-top: 12px; } }
1654
1655 .header-search {
1656   display: inline-block; }
1657
1658 header .search-box {
1659   display: inline-block;
1660   margin-top: 10px; }
1661   header .search-box input {
1662     background-color: rgba(0, 0, 0, 0.2);
1663     border: 1px solid rgba(255, 255, 255, 0.3);
1664     color: #EEE; }
1665   header .search-box button {
1666     color: #EEE;
1667     fill: #EEE; }
1668   header .search-box ::-webkit-input-placeholder {
1669     /* Chrome/Opera/Safari */
1670     color: #DDD; }
1671   header .search-box ::-moz-placeholder {
1672     /* Firefox 19+ */
1673     color: #DDD; }
1674   header .search-box :-ms-input-placeholder {
1675     /* IE 10+ */
1676     color: #DDD; }
1677   header .search-box :-moz-placeholder {
1678     /* Firefox 18- */
1679     color: #DDD; }
1680   @media screen and (max-width: 1200px) {
1681     header .search-box {
1682       max-width: 250px; } }
1683   @media screen and (max-width: 1000px) {
1684     header .search-box {
1685       max-width: 200px; } }
1686
1687 @media screen and (max-width: 600px) {
1688   .header-search {
1689     display: block; } }
1690
1691 .logo {
1692   display: inline-block; }
1693   .logo:hover {
1694     color: #FFF;
1695     text-decoration: none; }
1696
1697 .logo-text {
1698   display: inline-block;
1699   font-size: 1.8em;
1700   color: #fff;
1701   font-weight: 400;
1702   padding: 14px 24px 14px 0;
1703   vertical-align: top;
1704   line-height: 1; }
1705
1706 .logo-image {
1707   margin: 6px 12px 6px 0;
1708   vertical-align: top;
1709   height: 43px; }
1710
1711 .breadcrumbs span.sep {
1712   color: #aaa;
1713   padding: 0 6px; }
1714
1715 .faded a, .faded button, .faded span, .faded span > div {
1716   color: #666;
1717   fill: #666; }
1718
1719 .faded .text-button {
1720   opacity: 0.5;
1721   transition: all ease-in-out 120ms; }
1722   .faded .text-button:hover {
1723     opacity: 1;
1724     text-decoration: none; }
1725
1726 .faded span.faded-text {
1727   display: inline-block;
1728   padding: 12px; }
1729
1730 .faded-small {
1731   color: #000;
1732   fill: #000;
1733   font-size: 0.9em;
1734   background-color: rgba(21, 101, 192, 0.15); }
1735
1736 .toolbar-container {
1737   background-color: #FFF; }
1738
1739 .breadcrumbs .text-button, .action-buttons .text-button {
1740   display: inline-block;
1741   padding: 12px; }
1742   .breadcrumbs .text-button:last-child, .action-buttons .text-button:last-child {
1743     padding-right: 0; }
1744   .breadcrumbs .text-button:first-child, .action-buttons .text-button:first-child {
1745     padding-left: 0; }
1746
1747 .action-buttons .dropdown-container:last-child a {
1748   padding-right: 0;
1749   padding-left: 12px; }
1750
1751 .action-buttons {
1752   text-align: right; }
1753   .action-buttons.text-left {
1754     text-align: left; }
1755     .action-buttons.text-left .text-button {
1756       padding-right: 16px;
1757       padding-left: 0; }
1758   .action-buttons.text-center {
1759     text-align: center; }
1760
1761 @media screen and (max-width: 800px) {
1762   .breadcrumbs .text-button, .action-buttons .text-button {
1763     padding: 6px 6px; }
1764   .action-buttons .dropdown-container:last-child a {
1765     padding-left: 6px; }
1766   .breadcrumbs .text-button {
1767     font-size: 0; }
1768   .breadcrumbs .text-button svg {
1769     font-size: 15px; }
1770   .breadcrumbs a i {
1771     font-size: 15px;
1772     padding-right: 0; }
1773   .breadcrumbs span.sep {
1774     padding: 0 3px; }
1775   .toolbar .col-xs-1:first-child {
1776     padding-right: 0; } }
1777
1778 .nav-tabs {
1779   text-align: center; }
1780   .nav-tabs a, .nav-tabs .tab-item {
1781     padding: 16px;
1782     display: inline-block;
1783     color: #666;
1784     fill: #666;
1785     cursor: pointer; }
1786     .nav-tabs a.selected, .nav-tabs .tab-item.selected {
1787       border-bottom: 2px solid #0288D1; }
1788
1789 .faded-small .nav-tabs a {
1790   padding: 12px 16px; }
1791
1792 .page-list h4 {
1793   margin: 24px 0 6px 0;
1794   font-size: 1.666em; }
1795
1796 .page-list a.chapter {
1797   color: #ef7c3c; }
1798
1799 .page-list .inset-list {
1800   display: none;
1801   overflow: hidden; }
1802
1803 .page-list h5 {
1804   display: block;
1805   margin: 12px 0 0 0;
1806   border-left: 5px solid #0288D1;
1807   padding: 6px 0 6px 16px;
1808   font-size: 1.1em;
1809   font-weight: normal; }
1810   .page-list h5.draft {
1811     border-left-color: #9A60DA; }
1812
1813 .page-list .entity-list-item {
1814   margin-bottom: 16px; }
1815
1816 .page-list hr {
1817   margin-top: 0; }
1818
1819 .page-list .page, .page-list .chapter, .page-list .book {
1820   padding-left: 24px; }
1821
1822 .page-list .page {
1823   border-left: 5px solid #0288D1; }
1824
1825 .page-list .page.draft {
1826   border-left: 5px solid #9A60DA; }
1827   .page-list .page.draft .text-page {
1828     color: #9A60DA;
1829     fill: #9A60DA; }
1830
1831 .page-list .chapter {
1832   border-left: 5px solid #ef7c3c; }
1833
1834 .page-list .book {
1835   border-left: 5px solid #009688; }
1836
1837 .page-list .meta {
1838   margin-top: -16px;
1839   font-size: 0.95em; }
1840
1841 .page-list .meta span {
1842   margin-right: 12px; }
1843
1844 @media screen and (max-width: 600px) {
1845   .page-list h4 {
1846     font-size: 1.333em; } }
1847
1848 .sidebar-page-nav {
1849   list-style: none;
1850   margin: 12px 0 16px 2px;
1851   border-left: 2px dotted #BBB; }
1852   .sidebar-page-nav li {
1853     padding-left: 12px;
1854     margin-bottom: 4px;
1855     font-size: 0.95em; }
1856   .sidebar-page-nav .h1 {
1857     margin-left: -2px; }
1858   .sidebar-page-nav .h2 {
1859     margin-left: -2px; }
1860   .sidebar-page-nav .h3 {
1861     margin-left: 12px; }
1862   .sidebar-page-nav .h4 {
1863     margin-left: 24px; }
1864   .sidebar-page-nav .h5 {
1865     margin-left: 36px; }
1866   .sidebar-page-nav .h6 {
1867     margin-left: 48px; }
1868   .sidebar-page-nav .current-heading {
1869     font-weight: bold; }
1870
1871 .book-tree {
1872   transition: ease-in-out 240ms;
1873   transition-property: right, border; }
1874
1875 .book-tree h4 {
1876   padding: 16px 12px 0 12px; }
1877   .book-tree h4 i {
1878     padding-right: 12px; }
1879
1880 .book-tree .sidebar-page-list {
1881   list-style: none;
1882   margin: 6px 0 0;
1883   padding-left: 0;
1884   border-left: 5px solid #009688; }
1885   .book-tree .sidebar-page-list li a {
1886     display: block;
1887     border-bottom: none;
1888     padding: 6px 0 6px 12px; }
1889     .book-tree .sidebar-page-list li a:hover {
1890       text-decoration: none; }
1891   .book-tree .sidebar-page-list li a i {
1892     padding-right: 8px; }
1893   .book-tree .sidebar-page-list li, .book-tree .sidebar-page-list a {
1894     display: block; }
1895   .book-tree .sidebar-page-list a.bold {
1896     color: #EEE !important;
1897     fill: #EEE !important; }
1898   .book-tree .sidebar-page-list ul {
1899     list-style: none;
1900     margin: 0; }
1901   .book-tree .sidebar-page-list .book {
1902     color: #009688 !important;
1903     fill: #009688 !important; }
1904     .book-tree .sidebar-page-list .book.selected {
1905       background-color: rgba(0, 150, 136, 0.29); }
1906   .book-tree .sidebar-page-list .chapter {
1907     color: #ef7c3c !important;
1908     fill: #ef7c3c !important; }
1909     .book-tree .sidebar-page-list .chapter.selected {
1910       background-color: rgba(239, 124, 60, 0.12); }
1911   .book-tree .sidebar-page-list .page {
1912     color: #0288D1 !important;
1913     fill: #0288D1 !important;
1914     border-bottom: none; }
1915     .book-tree .sidebar-page-list .page.selected {
1916       background-color: rgba(2, 136, 209, 0.1); }
1917   .book-tree .sidebar-page-list [chapter-toggle] {
1918     padding-left: 12px; }
1919   .book-tree .sidebar-page-list .list-item-chapter {
1920     border-left: 5px solid #ef7c3c;
1921     margin: 10px 10px;
1922     display: block; }
1923   .book-tree .sidebar-page-list .list-item-page {
1924     border-bottom: none;
1925     border-left: 5px solid #0288D1;
1926     margin: 10px 10px; }
1927   .book-tree .sidebar-page-list .list-item-page.draft {
1928     border-left: 5px solid #9A60DA; }
1929   .book-tree .sidebar-page-list .page.draft .page, .book-tree .sidebar-page-list .list-item-page.draft a.page {
1930     color: #9A60DA !important;
1931     fill: #9A60DA !important; }
1932   .book-tree .sidebar-page-list .sub-menu {
1933     display: none;
1934     padding-left: 0; }
1935   .book-tree .sidebar-page-list .sub-menu.open {
1936     display: block; }
1937
1938 .sortable-page-list, .sortable-page-list ul {
1939   list-style: none;
1940   background-color: #FFF; }
1941
1942 .sort-box {
1943   margin-bottom: 16px;
1944   padding: 0 24px 0 24px;
1945   border-left: 4px solid #009688; }
1946
1947 .sortable-page-list {
1948   margin-left: 0; }
1949   .sortable-page-list > ul {
1950     margin-left: 0; }
1951   .sortable-page-list ul {
1952     margin-bottom: 0;
1953     margin-top: 0;
1954     box-shadow: 0 0 1px 0 rgba(0, 0, 0, 0.1); }
1955   .sortable-page-list li {
1956     border: 1px solid #DDD;
1957     padding: 6px 12px;
1958     margin-top: -1px;
1959     min-height: 38px; }
1960     .sortable-page-list li.text-chapter {
1961       border-left: 2px solid #ef7c3c; }
1962     .sortable-page-list li.text-page {
1963       border-left: 2px solid #0288D1; }
1964   .sortable-page-list li:first-child {
1965     margin-top: 6px; }
1966
1967 .sortable-page-list li.placeholder {
1968   position: relative; }
1969
1970 .sortable-page-list li.placeholder:before {
1971   position: absolute; }
1972
1973 .activity-list-item {
1974   padding: 12px 0;
1975   color: #888;
1976   fill: #888;
1977   border-bottom: 1px solid #EEE;
1978   font-size: 0.9em; }
1979   .activity-list-item .left {
1980     float: left; }
1981   .activity-list-item .left + .right {
1982     margin-left: 42px; }
1983   .activity-list-item:last-of-type {
1984     border-bottom: 0; }
1985
1986 ul.pagination {
1987   display: inline-block;
1988   list-style: none;
1989   margin: 16px 0;
1990   padding-left: 1px; }
1991   ul.pagination li {
1992     float: left; }
1993   ul.pagination li:first-child a, ul.pagination li:first-child span {
1994     border-radius: 3px 0 0 3px; }
1995   ul.pagination li:last-child a, ul.pagination li:last-child span {
1996     border-radius: 0 3px 3px 0; }
1997   ul.pagination a, ul.pagination span {
1998     display: block;
1999     padding: 3px 12px;
2000     border: 1px solid #CCC;
2001     margin-left: -1px;
2002     color: #888;
2003     fill: #888;
2004     -webkit-user-select: none;
2005        -moz-user-select: none;
2006         -ms-user-select: none;
2007             user-select: none; }
2008     ul.pagination a.disabled, ul.pagination span.disabled {
2009       cursor: not-allowed; }
2010   ul.pagination li.active span {
2011     background-color: rgba(2, 136, 209, 0.8);
2012     color: #EEE;
2013     fill: #EEE;
2014     border-color: rgba(2, 136, 209, 0.8); }
2015   ul.pagination a {
2016     color: #0288D1;
2017     fill: #0288D1; }
2018
2019 .compact ul.pagination {
2020   margin: 0; }
2021
2022 .entity-list > div {
2023   padding: 16px 0; }
2024
2025 .entity-list h4 {
2026   margin: 0; }
2027
2028 .entity-list hr {
2029   margin: 0; }
2030
2031 .entity-list .text-small.text-muted {
2032   color: #AAA;
2033   font-size: 0.75em;
2034   margin-top: 6px; }
2035
2036 .entity-list .text-muted p.text-muted {
2037   margin-top: 0; }
2038
2039 .entity-list .page.draft .text-page {
2040   color: #9A60DA;
2041   fill: #9A60DA; }
2042
2043 .card .entity-list-item, .card .activity-list-item {
2044   padding-left: 16px;
2045   padding-right: 16px; }
2046
2047 .entity-list.compact {
2048   font-size: 0.6em; }
2049   .entity-list.compact h4, .entity-list.compact a {
2050     line-height: 1.2; }
2051   .entity-list.compact .entity-item-snippet {
2052     display: none; }
2053   .entity-list.compact .entity-list-item p {
2054     font-size: 12px;
2055     padding-top: 6px; }
2056   .entity-list.compact p {
2057     margin: 0; }
2058   .entity-list.compact > p.empty-text {
2059     display: block;
2060     font-size: 15px; }
2061   .entity-list.compact hr {
2062     margin: 0; }
2063
2064 .dropdown-container {
2065   display: inline-block;
2066   vertical-align: top;
2067   position: relative; }
2068
2069 .dropdown-container ul {
2070   display: none;
2071   position: absolute;
2072   z-index: 999;
2073   top: 0;
2074   list-style: none;
2075   right: 0;
2076   margin: 16px 0;
2077   background-color: #FFFFFF;
2078   box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.1);
2079   border-radius: 1px;
2080   border: 1px solid #EEE;
2081   min-width: 180px;
2082   padding: 6px 0;
2083   color: #555;
2084   fill: #555;
2085   text-align: left !important; }
2086   .dropdown-container ul.wide {
2087     min-width: 220px; }
2088   .dropdown-container ul .text-muted {
2089     color: #999;
2090     fill: #999; }
2091   .dropdown-container ul li.padded {
2092     padding: 6px 16px;
2093     line-height: 1.2; }
2094   .dropdown-container ul a {
2095     display: block;
2096     padding: 6px 16px;
2097     color: #555;
2098     fill: #555; }
2099     .dropdown-container ul a:hover {
2100       text-decoration: none;
2101       background-color: #EEE; }
2102     .dropdown-container ul a svg {
2103       margin-right: 12px;
2104       display: inline-block;
2105       width: 16px; }
2106   .dropdown-container ul li.border-bottom {
2107     border-bottom: 1px solid #DDD; }
2108
2109 .featured-image-container {
2110   position: relative;
2111   overflow: hidden;
2112   background: #F2F2F2; }
2113   .featured-image-container a {
2114     display: block; }
2115   .featured-image-container img {
2116     display: block;
2117     width: 100%;
2118     max-width: 100%;
2119     height: auto;
2120     transition: all .5s ease-in-out; }
2121   .featured-image-container img:hover {
2122     -webkit-transform: scale(1.15);
2123             transform: scale(1.15);
2124     opacity: .5; }
2125
2126 .book-grid-item .grid-card-content {
2127   border-top: 0;
2128   border-bottom-width: 2px; }
2129   .book-grid-item .grid-card-content h2 {
2130     width: 100%;
2131     font-size: 1.5em;
2132     margin: 0 0 10px; }
2133   .book-grid-item .grid-card-content h2 a {
2134     display: block;
2135     width: 100%;
2136     line-height: 1.2;
2137     color: #009688;
2138     fill: #009688;
2139     text-decoration: none; }
2140   .book-grid-item .grid-card-content p {
2141     font-size: .85em;
2142     margin: 0;
2143     line-height: 1.6em; }
2144
2145 .book-grid-item .grid-card-footer p.small {
2146   font-size: .8em;
2147   margin: 0; }
2148
2149 .page-editor {
2150   display: flex;
2151   flex-direction: column;
2152   align-items: stretch;
2153   overflow: hidden; }
2154   .page-editor .faded-small {
2155     height: auto; }
2156   .page-editor .edit-area {
2157     flex: 1;
2158     flex-direction: column; }
2159
2160 .draft-notification {
2161   pointer-events: none;
2162   -webkit-transform: scale(0);
2163           transform: scale(0);
2164   transition: -webkit-transform ease-in-out 120ms;
2165   transition: transform ease-in-out 120ms;
2166   transition: transform ease-in-out 120ms, -webkit-transform ease-in-out 120ms;
2167   -webkit-transform-origin: 50% 50%;
2168           transform-origin: 50% 50%; }
2169   .draft-notification.visible {
2170     -webkit-transform: scale(1);
2171             transform: scale(1); }
2172
2173 .page-style.editor {
2174   padding: 0 !important; }
2175
2176 .page-content {
2177   max-width: 840px;
2178   margin: 0 auto;
2179   margin-top: 48px;
2180   overflow-wrap: break-word; }
2181   .page-content .align-left {
2182     text-align: left; }
2183   .page-content img.align-left, .page-content table.align-left {
2184     float: left !important;
2185     margin: 6px 12px 6px 0; }
2186   .page-content .align-right {
2187     float: right !important; }
2188   .page-content img.align-right, .page-content table.align-right {
2189     text-align: right;
2190     margin: 6px 0 6px 12px; }
2191   .page-content .align-center {
2192     text-align: center; }
2193   .page-content img {
2194     max-width: 100%;
2195     height: auto; }
2196   .page-content h1, .page-content h2, .page-content h3, .page-content h4, .page-content h5, .page-content h6, .page-content pre {
2197     clear: left; }
2198   .page-content hr {
2199     clear: both;
2200     margin: 16px 0; }
2201   .page-content table {
2202     -webkit-hyphens: auto;
2203         -ms-hyphens: auto;
2204             hyphens: auto;
2205     table-layout: fixed;
2206     max-width: 100%;
2207     height: auto !important; }
2208   .page-content ins,
2209   .page-content del {
2210     text-decoration: none; }
2211   .page-content ins {
2212     background: #dbffdb; }
2213   .page-content del {
2214     background: #FFECEC; }
2215
2216 .pointer-container {
2217   position: relative;
2218   display: none;
2219   left: 0;
2220   z-index: 10; }
2221
2222 .pointer {
2223   border: 1px solid #CCC;
2224   display: inline-block;
2225   padding: 12px 12px;
2226   border-radius: 4px;
2227   box-shadow: 0 0 8px 1px rgba(212, 209, 209, 0.35);
2228   position: absolute;
2229   top: -60px;
2230   background-color: #FFF;
2231   width: 272px;
2232   z-index: 55; }
2233   .pointer:before {
2234     position: absolute;
2235     left: 50%;
2236     bottom: -9px;
2237     width: 16px;
2238     height: 16px;
2239     margin-left: -8px;
2240     content: '';
2241     display: block;
2242     background-color: #FFF;
2243     -webkit-transform: rotate(45deg);
2244             transform: rotate(45deg);
2245     -webkit-transform-origin: 50% 50%;
2246             transform-origin: 50% 50%;
2247     border-bottom: 1px solid #CCC;
2248     border-right: 1px solid #CCC;
2249     z-index: 56; }
2250   .pointer input {
2251     background-color: #FFF;
2252     border: 1px solid #DDD;
2253     color: #666;
2254     width: 172px;
2255     z-index: 40; }
2256   .pointer input, .pointer button {
2257     position: relative;
2258     border-radius: 0;
2259     height: 28px;
2260     font-size: 12px;
2261     vertical-align: top; }
2262   .pointer > i {
2263     color: #888;
2264     font-size: 18px;
2265     padding-top: 4px; }
2266   .pointer span.icon {
2267     cursor: pointer;
2268     -webkit-user-select: none;
2269        -moz-user-select: none;
2270         -ms-user-select: none;
2271             user-select: none; }
2272   .pointer .button {
2273     line-height: 1;
2274     margin: 0 0 0 -4px;
2275     box-shadow: none; }
2276
2277 .floating-toolbox {
2278   background-color: #FFF;
2279   border: 1px solid #DDD;
2280   right: 64px;
2281   width: 48px;
2282   overflow: hidden;
2283   align-items: stretch;
2284   flex-direction: row;
2285   display: flex;
2286   transition: width ease-in-out 180ms;
2287   margin-top: -1px;
2288   min-height: 0; }
2289   .floating-toolbox.open {
2290     width: 480px; }
2291   .floating-toolbox [toolbox-toggle] svg {
2292     transition: -webkit-transform ease-in-out 180ms;
2293     transition: transform ease-in-out 180ms;
2294     transition: transform ease-in-out 180ms, -webkit-transform ease-in-out 180ms; }
2295   .floating-toolbox [toolbox-toggle] {
2296     transition: background-color ease-in-out 180ms; }
2297   .floating-toolbox.open [toolbox-toggle] {
2298     background-color: rgba(255, 0, 0, 0.29); }
2299   .floating-toolbox.open [toolbox-toggle] svg {
2300     -webkit-transform: rotate(180deg);
2301             transform: rotate(180deg); }
2302   .floating-toolbox > div {
2303     flex: 1;
2304     position: relative; }
2305   .floating-toolbox .tabs {
2306     display: block;
2307     border-right: 1px solid #DDD;
2308     width: 48px;
2309     flex: 0 1 auto; }
2310   .floating-toolbox .tabs svg {
2311     fill: rgba(0, 0, 0, 0.5);
2312     padding: 0;
2313     margin: 0; }
2314   .floating-toolbox .tabs > span {
2315     display: block;
2316     cursor: pointer;
2317     padding: 12px 16px;
2318     font-size: 13.5px;
2319     line-height: 1.6;
2320     border-bottom: 1px solid rgba(255, 255, 255, 0.3); }
2321   .floating-toolbox.open .tabs > span.active {
2322     fill: #444;
2323     background-color: rgba(0, 0, 0, 0.1); }
2324   .floating-toolbox div[toolbox-tab-content] {
2325     padding-bottom: 45px;
2326     display: flex;
2327     flex: 1;
2328     flex-direction: column;
2329     min-height: 0px;
2330     overflow-y: scroll; }
2331   .floating-toolbox div[toolbox-tab-content] .padded {
2332     flex: 1;
2333     padding-top: 0; }
2334   .floating-toolbox div[toolbox-tab-content] .padded.files {
2335     overflow-x: hidden; }
2336   .floating-toolbox h4 {
2337     font-size: 24px;
2338     margin: 16px 0 0 0;
2339     padding: 0 24px 12px 24px; }
2340   .floating-toolbox .tags input {
2341     max-width: 100%;
2342     width: 100%;
2343     min-width: 50px; }
2344   .floating-toolbox .tags td, .floating-toolbox .tag-table > div > div > div {
2345     padding-right: 12px;
2346     padding-top: 12px;
2347     position: relative; }
2348   .floating-toolbox .handle {
2349     -webkit-user-select: none;
2350        -moz-user-select: none;
2351         -ms-user-select: none;
2352             user-select: none;
2353     cursor: move;
2354     fill: #999; }
2355   .floating-toolbox form {
2356     display: flex;
2357     flex: 1;
2358     flex-direction: column;
2359     overflow-y: scroll; }
2360   .floating-toolbox table td, .floating-toolbox table th {
2361     overflow: visible; }
2362
2363 [toolbox-tab-content] {
2364   display: none; }
2365
2366 .tag-display {
2367   position: relative; }
2368   .tag-display table {
2369     width: 100%;
2370     margin: 0;
2371     padding: 0; }
2372   .tag-display tr:first-child td {
2373     padding-top: 0; }
2374   .tag-display .heading th {
2375     padding: 6px 12px;
2376     color: rgba(100, 100, 100, 0.7);
2377     border: 0;
2378     font-weight: 400; }
2379   .tag-display td {
2380     border: 0;
2381     border-bottom: 1px solid #EEE;
2382     padding: 6px 12px;
2383     color: #444; }
2384   .tag-display tr td:first-child {
2385     padding-left: 0; }
2386   .tag-display .tag-value {
2387     color: #888; }
2388   .tag-display tr:last-child td {
2389     border-bottom: none; }
2390   .tag-display .tag {
2391     padding: 12px; }
2392
2393 .suggestion-box {
2394   position: absolute;
2395   background-color: #FFF;
2396   border: 1px solid #BBB;
2397   box-shadow: 0 0 4px 1px #CCC;
2398   list-style: none;
2399   z-index: 100;
2400   padding: 0;
2401   margin: 0;
2402   border-radius: 3px; }
2403   .suggestion-box li {
2404     display: block;
2405     padding: 6px 12px;
2406     border-bottom: 1px solid #DDD; }
2407     .suggestion-box li:last-child {
2408       border-bottom: 0; }
2409     .suggestion-box li.active {
2410       background-color: #EEE; }
2411
2412 .comment-editor .CodeMirror, .comment-editor .CodeMirror-scroll {
2413   min-height: 175px; }
2414
2415 body {
2416   font-family: 'DejaVu Sans', -apple-system, BlinkMacSystemFont, "Segoe UI", "Oxygen", "Ubuntu", "Roboto", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif; }
2417
2418 table {
2419   border-spacing: 0;
2420   border-collapse: collapse; }
2421
2422 pre {
2423   padding-left: 12px; }
2424
2425 pre:after {
2426   display: none; }
2427
2428 pre code {
2429   white-space: pre-wrap; }