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

   1 @charset "UTF-8";
   2 /* http://meyerweb.com/eric/tools/css/reset/
   3    v2.0 | 20110126
   4    License: none (public domain)
   5 */
   6 html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
   7   margin: 0;
   8   padding: 0;
   9   border: 0;
  10   font-size: 100%;
  11   font: inherit;
  12   vertical-align: baseline; }
  13
  14 /* HTML5 display-role reset for older browsers */
  15 article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
  16   display: block; }
  17
  18 body {
  19   line-height: 1; }
  20
  21 ol, ul {
  22   list-style: none; }
  23
  24 blockquote, q {
  25   quotes: none; }
  26
  27 blockquote:before, blockquote:after {
  28   content: '';
  29   content: none; }
  30
  31 q:before, q:after {
  32   content: '';
  33   content: none; }
  34
  35 table {
  36   border-collapse: collapse;
  37   border-spacing: 0; }
  38
  39 * {
  40   box-sizing: border-box; }
  41
  42 html {
  43   background-color: #FFFFFF;
  44   height: 100%;
  45   overflow-y: scroll; }
  46   html.flexbox {
  47     overflow-y: hidden; }
  48   html.shaded {
  49     background-color: #F2F2F2; }
  50
  51 body {
  52   font-size: 15px;
  53   line-height: 1.6;
  54   color: #616161;
  55   -webkit-font-smoothing: antialiased; }
  56   body.shaded {
  57     background-color: #F2F2F2; }
  58
  59 button {
  60   font-size: 100%; }
  61
  62 /**
  63  * Fonts
  64  */
  65 body, button, input, select, label, textarea {
  66   font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "Oxygen", "Ubuntu", "Roboto", "Cantarell", "Fira Sans", "Droid Sans", "Helvetica Neue", sans-serif; }
  67
  68 .Codemirror, pre, #markdown-editor-input, .editor-toolbar, .code-base, code, span.code {
  69   font-family: "Lucida Console", "DejaVu Sans Mono", "Ubunto Mono", Monaco, monospace; }
  70
  71 /*
  72  * Header Styles
  73  */
  74 h1 {
  75   font-size: 3.425em;
  76   line-height: 1.22222222em;
  77   margin-top: 0.48888889em;
  78   margin-bottom: 0.48888889em; }
  79
  80 h2 {
  81   font-size: 2.8275em;
  82   line-height: 1.294117647em;
  83   margin-top: 0.8627451em;
  84   margin-bottom: 0.43137255em; }
  85
  86 h3 {
  87   font-size: 2.333em;
  88   line-height: 1.221428572em;
  89   margin-top: 0.78571429em;
  90   margin-bottom: 0.43137255em; }
  91
  92 h4 {
  93   font-size: 1.666em;
  94   line-height: 1.375em;
  95   margin-top: 0.78571429em;
  96   margin-bottom: 0.43137255em; }
  97
  98 h1, h2, h3, h4, h5, h6 {
  99   font-weight: 400;
 100   position: relative;
 101   display: block;
 102   color: #555; }
 103   h1 .subheader, h2 .subheader, h3 .subheader, h4 .subheader, h5 .subheader, h6 .subheader {
 104     font-size: 0.5em;
 105     line-height: 1em;
 106     color: #969696; }
 107
 108 h5 {
 109   font-size: 1.4em; }
 110
 111 h5, h6 {
 112   font-weight: 500;
 113   line-height: 1.2em;
 114   margin-top: 0.78571429em;
 115   margin-bottom: 0.66em; }
 116
 117 @media screen and (max-width: 600px) {
 118   h1 {
 119     font-size: 2.8275em; }
 120   h2 {
 121     font-size: 2.333em; }
 122   h3 {
 123     font-size: 1.666em; }
 124   h4 {
 125     font-size: 1.333em; }
 126   h5 {
 127     font-size: 1.161616em; } }
 128
 129 /*
 130  * Link styling
 131  */
 132 a, .link, .text-button {
 133   color: #0288D1;
 134   cursor: pointer;
 135   text-decoration: none;
 136   transition: color ease-in-out 80ms;
 137   line-height: 1.6; }
 138   a:hover, .link:hover, .text-button:hover {
 139     text-decoration: underline;
 140     color: #01466c; }
 141   a.icon, .link.icon, .icon.text-button {
 142     display: inline-block; }
 143   a svg, .link svg, .text-button svg {
 144     position: relative;
 145     display: inline-block; }
 146
 147 .blended-links a {
 148   color: inherit; }
 149   .blended-links a svg {
 150     fill: currentColor; }
 151
 152 /*
 153  * Other HTML Text Elements
 154  */
 155 p, ul, ol, pre, table, blockquote {
 156   margin-top: 0.3em;
 157   margin-bottom: 1.375em; }
 158
 159 hr {
 160   border: 0;
 161   height: 1px;
 162   background: #EAEAEA;
 163   margin-bottom: 24px; }
 164   hr.faded {
 165     background-image: linear-gradient(to right, #FFF, #e3e0e0 20%, #e3e0e0 80%, #FFF); }
 166   hr.margin-top, hr.even {
 167     margin-top: 24px; }
 168
 169 strong, b, .bold, .strong {
 170   font-weight: bold; }
 171   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 {
 172     font-weight: bolder; }
 173
 174 em, i, .italic {
 175   font-style: italic; }
 176
 177 small, p.small, span.small, .text-small {
 178   font-size: 0.8em;
 179   color: #777777; }
 180   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 {
 181     font-size: 1em; }
 182
 183 sup, .superscript {
 184   vertical-align: super;
 185   font-size: 0.8em; }
 186
 187 sub, .subscript {
 188   vertical-align: sub;
 189   font-size: 0.8em; }
 190
 191 pre {
 192   font-size: 12px;
 193   background-color: #f5f5f5;
 194   border: 1px solid #DDD;
 195   padding-left: 31px;
 196   position: relative;
 197   padding-top: 3px;
 198   padding-bottom: 3px; }
 199   pre:after {
 200     content: '';
 201     display: block;
 202     position: absolute;
 203     top: 0;
 204     width: 29px;
 205     left: 0;
 206     background-color: #f5f5f5;
 207     height: 100%;
 208     border-right: 1px solid #DDD; }
 209
 210 @media print {
 211   pre {
 212     padding-left: 12px; }
 213   pre:after {
 214     display: none; } }
 215
 216 blockquote {
 217   display: block;
 218   position: relative;
 219   border-left: 4px solid #0288D1;
 220   background-color: #F8F8F8;
 221   padding: 12px 16px 12px 32px; }
 222   blockquote:before {
 223     content: "\201C";
 224     font-size: 2em;
 225     font-weight: bold;
 226     position: absolute;
 227     top: 12px;
 228     left: 12px;
 229     color: #777777; }
 230
 231 .code-base, code, span.code {
 232   background-color: #F8F8F8;
 233   font-size: 0.80em;
 234   border: 1px solid #DDD;
 235   border-radius: 3px; }
 236
 237 code {
 238   display: inline;
 239   padding: 1px 3px;
 240   white-space: pre;
 241   line-height: 1.2em;
 242   margin-bottom: 1.2em; }
 243
 244 span.code {
 245   padding: 1px 6px; }
 246
 247 pre code {
 248   background-color: transparent;
 249   border: 0;
 250   font-size: 1em;
 251   display: block;
 252   line-height: 1.6; }
 253
 254 /*
 255  * Text colors
 256  */
 257 p.pos, p .pos, span.pos, .text-pos {
 258   color: #52A256;
 259   fill: #52A256; }
 260   p.pos:hover, p .pos:hover, span.pos:hover, .text-pos:hover {
 261     color: #52A256;
 262     fill: #52A256; }
 263
 264 p.neg, p .neg, span.neg, .text-neg {
 265   color: #E84F4F;
 266   fill: #E84F4F; }
 267   p.neg:hover, p .neg:hover, span.neg:hover, .text-neg:hover {
 268     color: #E84F4F;
 269     fill: #E84F4F; }
 270
 271 p.muted, p .muted, span.muted, .text-muted {
 272   color: #868686;
 273   fill: #868686; }
 274   p.muted.small, p.muted .small, p .muted.small, p .muted .small, span.muted.small, span.muted .small, .text-muted.small, .text-muted .small {
 275     color: #969696;
 276     fill: #969696; }
 277
 278 p.primary, p .primary, span.primary, .text-primary {
 279   color: #0288D1;
 280   fill: #0288D1; }
 281   p.primary:hover, p .primary:hover, span.primary:hover, .text-primary:hover {
 282     color: #0288D1;
 283     fill: #0288D1; }
 284
 285 p.secondary, p .secondary, span.secondary, .text-secondary {
 286   color: #e27b41;
 287   fill: #e27b41; }
 288   p.secondary:hover, p .secondary:hover, span.secondary:hover, .text-secondary:hover {
 289     color: #e27b41;
 290     fill: #e27b41; }
 291
 292 .text-bookshelf {
 293   color: #af5a5a;
 294   fill: #af5a5a; }
 295   .text-bookshelf:hover {
 296     color: #af5a5a;
 297     fill: #af5a5a; }
 298
 299 .text-book {
 300   color: #009688;
 301   fill: #009688; }
 302   .text-book:hover {
 303     color: #009688;
 304     fill: #009688; }
 305
 306 .text-page {
 307   color: #0288D1;
 308   fill: #0288D1; }
 309   .text-page:hover {
 310     color: #0288D1;
 311     fill: #0288D1; }
 312   .text-page.draft {
 313     color: #9A60DA;
 314     fill: #9A60DA; }
 315   .text-page.draft:hover {
 316     color: #9A60DA;
 317     fill: #9A60DA; }
 318
 319 .text-chapter {
 320   color: #ef7c3c;
 321   fill: #ef7c3c; }
 322   .text-chapter:hover {
 323     color: #ef7c3c;
 324     fill: #ef7c3c; }
 325
 326 .faded .text-book:hover {
 327   color: #009688 !important;
 328   fill: #009688 !important; }
 329
 330 .faded .text-chapter:hover {
 331   color: #ef7c3c !important;
 332   fill: #ef7c3c !important; }
 333
 334 .faded .text-page:hover {
 335   color: #0288D1 !important;
 336   fill: #0288D1 !important; }
 337
 338 span.highlight {
 339   font-weight: bold;
 340   padding: 2px 4px; }
 341
 342 /*
 343  * Lists
 344  */
 345 ul, ol {
 346   overflow: hidden; }
 347   ul p, ol p {
 348     margin: 0; }
 349
 350 ul {
 351   padding-left: 20.8px;
 352   padding-right: 20.8px;
 353   list-style: disc; }
 354   ul ul {
 355     list-style: circle;
 356     margin-top: 0;
 357     margin-bottom: 0; }
 358   ul label {
 359     margin: 0; }
 360
 361 ol {
 362   list-style: decimal;
 363   padding-left: 32px;
 364   padding-right: 32px; }
 365
 366 li.checkbox-item, li.task-list-item {
 367   list-style: none;
 368   margin-left: -20.8px; }
 369   li.checkbox-item input[type="checkbox"], li.task-list-item input[type="checkbox"] {
 370     margin-right: 6px; }
 371
 372 /*
 373  * Generic text styling classes
 374  */
 375 .underlined {
 376   text-decoration: underline; }
 377
 378 .text-center {
 379   text-align: center; }
 380
 381 .text-left {
 382   text-align: left; }
 383
 384 .text-right {
 385   text-align: right; }
 386
 387 .text-bigger {
 388   font-size: 1.1em; }
 389
 390 .text-large {
 391   font-size: 1.6666em; }
 392
 393 .no-color {
 394   color: inherit; }
 395
 396 .break-text {
 397   word-wrap: break-word;
 398   overflow-wrap: break-word; }
 399
 400 /**
 401  * Grouping
 402  */
 403 .header-group {
 404   margin: 16px 0; }
 405   .header-group h1, .header-group h2, .header-group h3, .header-group h4, .header-group h5, .header-group h6 {
 406     margin: 0; }
 407
 408 span.sep {
 409   color: #BBB;
 410   padding: 0 6px; }
 411
 412 .list > * {
 413   display: block; }
 414
 415 /**
 416   * Icons
 417   */
 418 i {
 419   padding-right: 6px; }
 420
 421 .svg-icon {
 422   width: 1em;
 423   height: 1em;
 424   display: inline-block;
 425   position: relative;
 426   bottom: -0.105em;
 427   margin-right: 6px; }
 428
 429 /** Flexbox styling rules **/
 430 body.flexbox {
 431   display: flex;
 432   flex-direction: column;
 433   align-items: stretch;
 434   height: 100%;
 435   min-height: 100%;
 436   max-height: 100%;
 437   overflow: hidden; }
 438   body.flexbox #content {
 439     flex: 1;
 440     display: flex;
 441     min-height: 0; }
 442
 443 .flex-fill {
 444   display: flex;
 445   align-items: stretch;
 446   min-height: 0;
 447   max-width: 100%;
 448   position: relative; }
 449   .flex-fill.rows {
 450     flex-direction: row; }
 451   .flex-fill.columns {
 452     flex-direction: column; }
 453
 454 .flex {
 455   min-height: 0;
 456   flex: 1; }
 457
 458 .flex.scroll {
 459   display: flex; }
 460   .flex.scroll.sidebar {
 461     margin-right: -14px; }
 462
 463 .flex.scroll .scroll-body {
 464   overflow-y: scroll;
 465   flex: 1; }
 466
 467 .flex-child > div {
 468   flex: 1; }
 469
 470 .flex.sidebar {
 471   flex: 1;
 472   background-color: #F2F2F2;
 473   max-width: 360px;
 474   min-height: 90vh; }
 475   .flex.sidebar section {
 476     margin: 16px; }
 477
 478 .flex.sidebar + .flex.content {
 479   flex: 3;
 480   background-color: #FFFFFF;
 481   padding: 0 24px;
 482   border-left: 1px solid #DDD;
 483   max-width: 100%; }
 484
 485 .flex.sidebar .sidebar-toggle {
 486   display: none; }
 487
 488 @media screen and (max-width: 1100px) {
 489   body.sidebar-layout {
 490     padding-left: 30px; }
 491   .flex.sidebar {
 492     position: fixed;
 493     top: 0;
 494     left: 0;
 495     bottom: 0;
 496     z-index: 100;
 497     padding-right: 30px;
 498     width: 360px;
 499     box-shadow: none;
 500     -webkit-transform: translate3d(-330px, 0, 0);
 501             transform: translate3d(-330px, 0, 0);
 502     transition: -webkit-transform ease-in-out 120ms;
 503     transition: transform ease-in-out 120ms;
 504     transition: transform ease-in-out 120ms, -webkit-transform ease-in-out 120ms;
 505     display: flex;
 506     flex-direction: column; }
 507   .flex.sidebar.open {
 508     box-shadow: 1px 2px 2px 1px rgba(0, 0, 0, 0.1);
 509     -webkit-transform: translate3d(0, 0, 0);
 510             transform: translate3d(0, 0, 0); }
 511     .flex.sidebar.open .sidebar-toggle i {
 512       -webkit-transform: rotate(180deg);
 513               transform: rotate(180deg); }
 514   .flex.sidebar .sidebar-toggle {
 515     display: block;
 516     position: absolute;
 517     opacity: 0.9;
 518     right: 0;
 519     top: 0;
 520     bottom: 0;
 521     width: 30px;
 522     fill: #666;
 523     font-size: 20px;
 524     vertical-align: middle;
 525     text-align: center;
 526     border: 1px solid #DDD;
 527     border-top: 1px solid #BBB;
 528     padding-top: 16px;
 529     cursor: pointer; }
 530     .flex.sidebar .sidebar-toggle svg {
 531       opacity: 0.5;
 532       transition: all ease-in-out 120ms;
 533       margin: 0; }
 534     .flex.sidebar .sidebar-toggle:hover i {
 535       opacity: 1; }
 536   .sidebar .scroll-body {
 537     flex: 1;
 538     overflow-y: scroll; }
 539   #sidebar .scroll-body.fixed {
 540     width: auto !important; } }
 541
 542 @media screen and (min-width: 1100px) {
 543   #sidebar .scroll-body.fixed {
 544     z-index: 5;
 545     position: fixed;
 546     top: 0;
 547     padding-right: 16px;
 548     width: 30%;
 549     left: 0;
 550     height: 100%;
 551     overflow-y: auto;
 552     -ms-overflow-style: none;
 553     border-left: 1px solid #DDD; }
 554     #sidebar .scroll-body.fixed::-webkit-scrollbar {
 555       width: 0 !important; } }
 556
 557 /** Rules for all columns */
 558 div[class^="col-"] img {
 559   max-width: 100%; }
 560
 561 .container {
 562   max-width: 1400px;
 563   margin-left: auto;
 564   margin-right: auto;
 565   padding-left: 16px;
 566   padding-right: 16px; }
 567   .container.fluid {
 568     max-width: 100%; }
 569   .container.medium {
 570     max-width: 992px; }
 571   .container.small {
 572     max-width: 840px; }
 573   .container.nopad {
 574     padding-left: 0;
 575     padding-right: 0; }
 576
 577 .row {
 578   margin-left: -16px;
 579   margin-right: -16px; }
 580
 581 .grid {
 582   display: grid;
 583   grid-column-gap: 24px;
 584   grid-row-gap: 24px; }
 585   .grid.third {
 586     grid-template-columns: 1fr 1fr 1fr; }
 587
 588 .grid-card {
 589   display: flex;
 590   flex-direction: column;
 591   border: 1px solid #ddd;
 592   min-width: 100px; }
 593   .grid-card h2 {
 594     width: 100%;
 595     font-size: 1.5em;
 596     margin: 0 0 10px; }
 597   .grid-card h2 a {
 598     display: block;
 599     width: 100%;
 600     line-height: 1.2;
 601     text-decoration: none; }
 602   .grid-card p {
 603     font-size: .85em;
 604     margin: 0;
 605     line-height: 1.6em; }
 606   .grid-card .grid-card-content {
 607     flex: 1;
 608     border-top: 0;
 609     border-bottom-width: 2px; }
 610   .grid-card .grid-card-content, .grid-card .grid-card-footer {
 611     padding: 24px; }
 612   .grid-card .grid-card-content + .grid-card-footer {
 613     padding-top: 0; }
 614
 615 .book-grid-item .grid-card-content h2 a {
 616   color: #009688;
 617   fill: #009688; }
 618
 619 .bookshelf-grid-item .grid-card-content h2 a {
 620   color: #af5a5a;
 621   fill: #af5a5a; }
 622
 623 .book-grid-item .grid-card-footer p.small {
 624   font-size: .8em;
 625   margin: 0; }
 626
 627 @media screen and (max-width: 800px) {
 628   .grid.third {
 629     grid-template-columns: 1fr 1fr; } }
 630
 631 @media screen and (max-width: 600px) {
 632   .grid.third {
 633     grid-template-columns: 1fr; } }
 634
 635 .float {
 636   float: left; }
 637   .float.right {
 638     float: right; }
 639
 640 .block {
 641   display: block;
 642   position: relative; }
 643
 644 .inline {
 645   display: inline; }
 646
 647 .block.inline {
 648   display: inline-block; }
 649
 650 .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 {
 651   position: relative;
 652   min-height: 1px;
 653   padding-left: 16px;
 654   padding-right: 16px; }
 655
 656 .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 {
 657   float: left; }
 658
 659 .col-xs-12 {
 660   width: 100%; }
 661
 662 .col-xs-11 {
 663   width: 91.66666667%; }
 664
 665 .col-xs-10 {
 666   width: 83.33333333%; }
 667
 668 .col-xs-9 {
 669   width: 75%; }
 670
 671 .col-xs-8 {
 672   width: 66.66666667%; }
 673
 674 .col-xs-7 {
 675   width: 58.33333333%; }
 676
 677 .col-xs-6 {
 678   width: 50%; }
 679
 680 .col-xs-5 {
 681   width: 41.66666667%; }
 682
 683 .col-xs-4 {
 684   width: 33.33333333%; }
 685
 686 .col-xs-3 {
 687   width: 25%; }
 688
 689 .col-xs-2 {
 690   width: 16.66666667%; }
 691
 692 .col-xs-1 {
 693   width: 8.33333333%; }
 694
 695 .col-xs-pull-12 {
 696   right: 100%; }
 697
 698 .col-xs-pull-11 {
 699   right: 91.66666667%; }
 700
 701 .col-xs-pull-10 {
 702   right: 83.33333333%; }
 703
 704 .col-xs-pull-9 {
 705   right: 75%; }
 706
 707 .col-xs-pull-8 {
 708   right: 66.66666667%; }
 709
 710 .col-xs-pull-7 {
 711   right: 58.33333333%; }
 712
 713 .col-xs-pull-6 {
 714   right: 50%; }
 715
 716 .col-xs-pull-5 {
 717   right: 41.66666667%; }
 718
 719 .col-xs-pull-4 {
 720   right: 33.33333333%; }
 721
 722 .col-xs-pull-3 {
 723   right: 25%; }
 724
 725 .col-xs-pull-2 {
 726   right: 16.66666667%; }
 727
 728 .col-xs-pull-1 {
 729   right: 8.33333333%; }
 730
 731 .col-xs-pull-0 {
 732   right: auto; }
 733
 734 .col-xs-push-12 {
 735   left: 100%; }
 736
 737 .col-xs-push-11 {
 738   left: 91.66666667%; }
 739
 740 .col-xs-push-10 {
 741   left: 83.33333333%; }
 742
 743 .col-xs-push-9 {
 744   left: 75%; }
 745
 746 .col-xs-push-8 {
 747   left: 66.66666667%; }
 748
 749 .col-xs-push-7 {
 750   left: 58.33333333%; }
 751
 752 .col-xs-push-6 {
 753   left: 50%; }
 754
 755 .col-xs-push-5 {
 756   left: 41.66666667%; }
 757
 758 .col-xs-push-4 {
 759   left: 33.33333333%; }
 760
 761 .col-xs-push-3 {
 762   left: 25%; }
 763
 764 .col-xs-push-2 {
 765   left: 16.66666667%; }
 766
 767 .col-xs-push-1 {
 768   left: 8.33333333%; }
 769
 770 .col-xs-push-0 {
 771   left: auto; }
 772
 773 .col-xs-offset-12 {
 774   margin-left: 100%; }
 775
 776 .col-xs-offset-11 {
 777   margin-left: 91.66666667%; }
 778
 779 .col-xs-offset-10 {
 780   margin-left: 83.33333333%; }
 781
 782 .col-xs-offset-9 {
 783   margin-left: 75%; }
 784
 785 .col-xs-offset-8 {
 786   margin-left: 66.66666667%; }
 787
 788 .col-xs-offset-7 {
 789   margin-left: 58.33333333%; }
 790
 791 .col-xs-offset-6 {
 792   margin-left: 50%; }
 793
 794 .col-xs-offset-5 {
 795   margin-left: 41.66666667%; }
 796
 797 .col-xs-offset-4 {
 798   margin-left: 33.33333333%; }
 799
 800 .col-xs-offset-3 {
 801   margin-left: 25%; }
 802
 803 .col-xs-offset-2 {
 804   margin-left: 16.66666667%; }
 805
 806 .col-xs-offset-1 {
 807   margin-left: 8.33333333%; }
 808
 809 .col-xs-offset-0 {
 810   margin-left: 0%; }
 811
 812 @media (min-width: 768px) {
 813   .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 {
 814     float: left; }
 815   .col-sm-12 {
 816     width: 100%; }
 817   .col-sm-11 {
 818     width: 91.66666667%; }
 819   .col-sm-10 {
 820     width: 83.33333333%; }
 821   .col-sm-9 {
 822     width: 75%; }
 823   .col-sm-8 {
 824     width: 66.66666667%; }
 825   .col-sm-7 {
 826     width: 58.33333333%; }
 827   .col-sm-6 {
 828     width: 50%; }
 829   .col-sm-5 {
 830     width: 41.66666667%; }
 831   .col-sm-4 {
 832     width: 33.33333333%; }
 833   .col-sm-3 {
 834     width: 25%; }
 835   .col-sm-2 {
 836     width: 16.66666667%; }
 837   .col-sm-1 {
 838     width: 8.33333333%; }
 839   .col-sm-pull-12 {
 840     right: 100%; }
 841   .col-sm-pull-11 {
 842     right: 91.66666667%; }
 843   .col-sm-pull-10 {
 844     right: 83.33333333%; }
 845   .col-sm-pull-9 {
 846     right: 75%; }
 847   .col-sm-pull-8 {
 848     right: 66.66666667%; }
 849   .col-sm-pull-7 {
 850     right: 58.33333333%; }
 851   .col-sm-pull-6 {
 852     right: 50%; }
 853   .col-sm-pull-5 {
 854     right: 41.66666667%; }
 855   .col-sm-pull-4 {
 856     right: 33.33333333%; }
 857   .col-sm-pull-3 {
 858     right: 25%; }
 859   .col-sm-pull-2 {
 860     right: 16.66666667%; }
 861   .col-sm-pull-1 {
 862     right: 8.33333333%; }
 863   .col-sm-pull-0 {
 864     right: auto; }
 865   .col-sm-push-12 {
 866     left: 100%; }
 867   .col-sm-push-11 {
 868     left: 91.66666667%; }
 869   .col-sm-push-10 {
 870     left: 83.33333333%; }
 871   .col-sm-push-9 {
 872     left: 75%; }
 873   .col-sm-push-8 {
 874     left: 66.66666667%; }
 875   .col-sm-push-7 {
 876     left: 58.33333333%; }
 877   .col-sm-push-6 {
 878     left: 50%; }
 879   .col-sm-push-5 {
 880     left: 41.66666667%; }
 881   .col-sm-push-4 {
 882     left: 33.33333333%; }
 883   .col-sm-push-3 {
 884     left: 25%; }
 885   .col-sm-push-2 {
 886     left: 16.66666667%; }
 887   .col-sm-push-1 {
 888     left: 8.33333333%; }
 889   .col-sm-push-0 {
 890     left: auto; }
 891   .col-sm-offset-12 {
 892     margin-left: 100%; }
 893   .col-sm-offset-11 {
 894     margin-left: 91.66666667%; }
 895   .col-sm-offset-10 {
 896     margin-left: 83.33333333%; }
 897   .col-sm-offset-9 {
 898     margin-left: 75%; }
 899   .col-sm-offset-8 {
 900     margin-left: 66.66666667%; }
 901   .col-sm-offset-7 {
 902     margin-left: 58.33333333%; }
 903   .col-sm-offset-6 {
 904     margin-left: 50%; }
 905   .col-sm-offset-5 {
 906     margin-left: 41.66666667%; }
 907   .col-sm-offset-4 {
 908     margin-left: 33.33333333%; }
 909   .col-sm-offset-3 {
 910     margin-left: 25%; }
 911   .col-sm-offset-2 {
 912     margin-left: 16.66666667%; }
 913   .col-sm-offset-1 {
 914     margin-left: 8.33333333%; }
 915   .col-sm-offset-0 {
 916     margin-left: 0%; } }
 917
 918 @media (min-width: 992px) {
 919   .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 {
 920     float: left; }
 921   .col-md-12 {
 922     width: 100%; }
 923   .col-md-11 {
 924     width: 91.66666667%; }
 925   .col-md-10 {
 926     width: 83.33333333%; }
 927   .col-md-9 {
 928     width: 75%; }
 929   .col-md-8 {
 930     width: 66.66666667%; }
 931   .col-md-7 {
 932     width: 58.33333333%; }
 933   .col-md-6 {
 934     width: 50%; }
 935   .col-md-5 {
 936     width: 41.66666667%; }
 937   .col-md-4 {
 938     width: 33.33333333%; }
 939   .col-md-3 {
 940     width: 25%; }
 941   .col-md-2 {
 942     width: 16.66666667%; }
 943   .col-md-1 {
 944     width: 8.33333333%; }
 945   .col-md-pull-12 {
 946     right: 100%; }
 947   .col-md-pull-11 {
 948     right: 91.66666667%; }
 949   .col-md-pull-10 {
 950     right: 83.33333333%; }
 951   .col-md-pull-9 {
 952     right: 75%; }
 953   .col-md-pull-8 {
 954     right: 66.66666667%; }
 955   .col-md-pull-7 {
 956     right: 58.33333333%; }
 957   .col-md-pull-6 {
 958     right: 50%; }
 959   .col-md-pull-5 {
 960     right: 41.66666667%; }
 961   .col-md-pull-4 {
 962     right: 33.33333333%; }
 963   .col-md-pull-3 {
 964     right: 25%; }
 965   .col-md-pull-2 {
 966     right: 16.66666667%; }
 967   .col-md-pull-1 {
 968     right: 8.33333333%; }
 969   .col-md-pull-0 {
 970     right: auto; }
 971   .col-md-push-12 {
 972     left: 100%; }
 973   .col-md-push-11 {
 974     left: 91.66666667%; }
 975   .col-md-push-10 {
 976     left: 83.33333333%; }
 977   .col-md-push-9 {
 978     left: 75%; }
 979   .col-md-push-8 {
 980     left: 66.66666667%; }
 981   .col-md-push-7 {
 982     left: 58.33333333%; }
 983   .col-md-push-6 {
 984     left: 50%; }
 985   .col-md-push-5 {
 986     left: 41.66666667%; }
 987   .col-md-push-4 {
 988     left: 33.33333333%; }
 989   .col-md-push-3 {
 990     left: 25%; }
 991   .col-md-push-2 {
 992     left: 16.66666667%; }
 993   .col-md-push-1 {
 994     left: 8.33333333%; }
 995   .col-md-push-0 {
 996     left: auto; }
 997   .col-md-offset-12 {
 998     margin-left: 100%; }
 999   .col-md-offset-11 {
1000     margin-left: 91.66666667%; }
1001   .col-md-offset-10 {
1002     margin-left: 83.33333333%; }
1003   .col-md-offset-9 {
1004     margin-left: 75%; }
1005   .col-md-offset-8 {
1006     margin-left: 66.66666667%; }
1007   .col-md-offset-7 {
1008     margin-left: 58.33333333%; }
1009   .col-md-offset-6 {
1010     margin-left: 50%; }
1011   .col-md-offset-5 {
1012     margin-left: 41.66666667%; }
1013   .col-md-offset-4 {
1014     margin-left: 33.33333333%; }
1015   .col-md-offset-3 {
1016     margin-left: 25%; }
1017   .col-md-offset-2 {
1018     margin-left: 16.66666667%; }
1019   .col-md-offset-1 {
1020     margin-left: 8.33333333%; }
1021   .col-md-offset-0 {
1022     margin-left: 0%; } }
1023
1024 @media (min-width: 1200px) {
1025   .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 {
1026     float: left; }
1027   .col-lg-12 {
1028     width: 100%; }
1029   .col-lg-11 {
1030     width: 91.66666667%; }
1031   .col-lg-10 {
1032     width: 83.33333333%; }
1033   .col-lg-9 {
1034     width: 75%; }
1035   .col-lg-8 {
1036     width: 66.66666667%; }
1037   .col-lg-7 {
1038     width: 58.33333333%; }
1039   .col-lg-6 {
1040     width: 50%; }
1041   .col-lg-5 {
1042     width: 41.66666667%; }
1043   .col-lg-4 {
1044     width: 33.33333333%; }
1045   .col-lg-3 {
1046     width: 25%; }
1047   .col-lg-2 {
1048     width: 16.66666667%; }
1049   .col-lg-1 {
1050     width: 8.33333333%; }
1051   .col-lg-pull-12 {
1052     right: 100%; }
1053   .col-lg-pull-11 {
1054     right: 91.66666667%; }
1055   .col-lg-pull-10 {
1056     right: 83.33333333%; }
1057   .col-lg-pull-9 {
1058     right: 75%; }
1059   .col-lg-pull-8 {
1060     right: 66.66666667%; }
1061   .col-lg-pull-7 {
1062     right: 58.33333333%; }
1063   .col-lg-pull-6 {
1064     right: 50%; }
1065   .col-lg-pull-5 {
1066     right: 41.66666667%; }
1067   .col-lg-pull-4 {
1068     right: 33.33333333%; }
1069   .col-lg-pull-3 {
1070     right: 25%; }
1071   .col-lg-pull-2 {
1072     right: 16.66666667%; }
1073   .col-lg-pull-1 {
1074     right: 8.33333333%; }
1075   .col-lg-pull-0 {
1076     right: auto; }
1077   .col-lg-push-12 {
1078     left: 100%; }
1079   .col-lg-push-11 {
1080     left: 91.66666667%; }
1081   .col-lg-push-10 {
1082     left: 83.33333333%; }
1083   .col-lg-push-9 {
1084     left: 75%; }
1085   .col-lg-push-8 {
1086     left: 66.66666667%; }
1087   .col-lg-push-7 {
1088     left: 58.33333333%; }
1089   .col-lg-push-6 {
1090     left: 50%; }
1091   .col-lg-push-5 {
1092     left: 41.66666667%; }
1093   .col-lg-push-4 {
1094     left: 33.33333333%; }
1095   .col-lg-push-3 {
1096     left: 25%; }
1097   .col-lg-push-2 {
1098     left: 16.66666667%; }
1099   .col-lg-push-1 {
1100     left: 8.33333333%; }
1101   .col-lg-push-0 {
1102     left: auto; }
1103   .col-lg-offset-12 {
1104     margin-left: 100%; }
1105   .col-lg-offset-11 {
1106     margin-left: 91.66666667%; }
1107   .col-lg-offset-10 {
1108     margin-left: 83.33333333%; }
1109   .col-lg-offset-9 {
1110     margin-left: 75%; }
1111   .col-lg-offset-8 {
1112     margin-left: 66.66666667%; }
1113   .col-lg-offset-7 {
1114     margin-left: 58.33333333%; }
1115   .col-lg-offset-6 {
1116     margin-left: 50%; }
1117   .col-lg-offset-5 {
1118     margin-left: 41.66666667%; }
1119   .col-lg-offset-4 {
1120     margin-left: 33.33333333%; }
1121   .col-lg-offset-3 {
1122     margin-left: 25%; }
1123   .col-lg-offset-2 {
1124     margin-left: 16.66666667%; }
1125   .col-lg-offset-1 {
1126     margin-left: 8.33333333%; }
1127   .col-lg-offset-0 {
1128     margin-left: 0%; } }
1129
1130 .clearfix:before,
1131 .clearfix:after,
1132 .container:before,
1133 .container:after,
1134 .container-fluid:before,
1135 .container-fluid:after,
1136 .row:before,
1137 .row:after {
1138   content: " ";
1139   display: table; }
1140
1141 .clearfix:after,
1142 .container:after,
1143 .container-fluid:after,
1144 .row:after {
1145   clear: both; }
1146
1147 .center-block {
1148   display: block;
1149   margin-left: auto;
1150   margin-right: auto; }
1151
1152 /*
1153 * This file container all block styling including background shading,
1154 * margins, paddings & borders.
1155 */
1156 /*
1157 * Background Shading
1158 */
1159 .shaded {
1160   background-color: #f1f1f1; }
1161   .shaded.pos {
1162     background-color: #d6ead7; }
1163   .shaded.neg {
1164     background-color: #f4a9a9; }
1165   .shaded.primary {
1166     background-color: #a1ddfe; }
1167   .shaded.secondary {
1168     background-color: #f6d7c6; }
1169
1170 /*
1171 * Bordering
1172 */
1173 .bordered {
1174   border: 1px solid #BBB; }
1175   .bordered.pos {
1176     border-color: #52A256; }
1177   .bordered.neg {
1178     border-color: #E84F4F; }
1179   .bordered.primary {
1180     border-color: #0288D1; }
1181   .bordered.secondary {
1182     border-color: #e27b41; }
1183   .bordered.thick {
1184     border-width: 2px; }
1185
1186 .rounded {
1187   border-radius: 3px; }
1188
1189 /*
1190 * Padding
1191 */
1192 .nopadding {
1193   padding: 0; }
1194
1195 .padded {
1196   padding: 24px; }
1197   .padded.large {
1198     padding: 32px; }
1199   .padded > h1:first-child, .padded > h2:first-child, .padded > h3:first-child, .padded > h4:first-child {
1200     margin-top: 0.1em; }
1201
1202 .padded-vertical, .padded-top {
1203   padding-top: 16px; }
1204   .padded-vertical.large, .padded-top.large {
1205     padding-top: 32px; }
1206
1207 .padded-vertical, .padded-bottom {
1208   padding-bottom: 16px; }
1209   .padded-vertical.large, .padded-bottom.large {
1210     padding-bottom: 32px; }
1211
1212 .padded-horizontal, .padded-left {
1213   padding-left: 16px; }
1214   .padded-horizontal.large, .padded-left.large {
1215     padding-left: 32px; }
1216
1217 .padded-horizontal, .padded-right {
1218   padding-right: 16px; }
1219   .padded-horizontal.large, .padded-right.large {
1220     padding-right: 32px; }
1221
1222 /*
1223 * Margins
1224 */
1225 .margins {
1226   margin: 24px; }
1227   .margins.large {
1228     margin: 32px; }
1229
1230 .margins-vertical, .margin-top {
1231   margin-top: 16px; }
1232   .margins-vertical.large, .margin-top.large {
1233     margin-top: 32px; }
1234
1235 .margins-vertical, .margin-bottom {
1236   margin-bottom: 16px; }
1237   .margins-vertical.large, .margin-bottom.large {
1238     margin-bottom: 32px; }
1239
1240 .margins-horizontal, .margin-left {
1241   margin-left: 16px; }
1242   .margins-horizontal.large, .margin-left.large {
1243     margin-left: 32px; }
1244
1245 .margins-horizontal, .margin-right {
1246   margin-right: 16px; }
1247   .margins-horizontal.large, .margin-right.large {
1248     margin-right: 32px; }
1249
1250 /**
1251  * Callouts
1252  */
1253 .callout {
1254   border-left: 3px solid #BBB;
1255   background-color: #EEE;
1256   padding: 12px 12px 12px 32px;
1257   display: block;
1258   position: relative; }
1259   .callout:before {
1260     background-image: url("data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMjQgMjQiIGZpbGw9IiMwMTUzODAiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+ICAgIDxwYXRoIGQ9Ik0wIDBoMjR2MjRIMHoiIGZpbGw9Im5vbmUiLz4gICAgPHBhdGggZD0iTTEyIDJDNi40OCAyIDIgNi40OCAyIDEyczQuNDggMTAgMTAgMTAgMTAtNC40OCAxMC0xMFMxNy41MiAyIDEyIDJ6bTEgMTVoLTJ2LTZoMnY2em0wLThoLTJWN2gydjJ6Ii8+PC9zdmc+");
1261     background-repeat: no-repeat;
1262     content: '';
1263     width: 1.2em;
1264     height: 1.2em;
1265     left: 7px;
1266     top: 50%;
1267     margin-top: -9px;
1268     display: inline-block;
1269     position: absolute;
1270     line-height: 1;
1271     opacity: 0.8; }
1272   .callout.success {
1273     border-left-color: #52A256;
1274     background-color: #e7f3e7;
1275     color: #376c39; }
1276   .callout.success:before {
1277     background-image: url("data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMjQgMjQiIGZpbGw9IiMzNzZjMzkiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+ICAgIDxwYXRoIGQ9Ik0wIDBoMjR2MjRIMHoiIGZpbGw9Im5vbmUiLz4gICAgPHBhdGggZD0iTTEyIDJDNi40OCAyIDIgNi40OCAyIDEyczQuNDggMTAgMTAgMTAgMTAtNC40OCAxMC0xMFMxNy41MiAyIDEyIDJ6bS0yIDE1bC01LTUgMS40MS0xLjQxTDEwIDE0LjE3bDcuNTktNy41OUwxOSA4bC05IDl6Ii8+PC9zdmc+"); }
1278   .callout.danger {
1279     border-left-color: #E84F4F;
1280     background-color: #fce8e8;
1281     color: #b91818; }
1282   .callout.danger:before {
1283     background-image: url("data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMjQgMjQiIGZpbGw9IiNiOTE4MTgiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+ICAgIDxwYXRoIGQ9Ik0xNS43MyAzSDguMjdMMyA4LjI3djcuNDZMOC4yNyAyMWg3LjQ2TDIxIDE1LjczVjguMjdMMTUuNzMgM3pNMTIgMTcuM2MtLjcyIDAtMS4zLS41OC0xLjMtMS4zIDAtLjcyLjU4LTEuMyAxLjMtMS4zLjcyIDAgMS4zLjU4IDEuMyAxLjMgMCAuNzItLjU4IDEuMy0xLjMgMS4zem0xLTQuM2gtMlY3aDJ2NnoiLz4gICAgPHBhdGggZD0iTTAgMGgyNHYyNEgweiIgZmlsbD0ibm9uZSIvPjwvc3ZnPg=="); }
1284   .callout.info {
1285     border-left-color: #0288D1;
1286     background-color: #d3efff;
1287     color: #015380; }
1288   .callout.warning {
1289     border-left-color: #e27b41;
1290     background-color: #faeae0;
1291     color: #b6531c; }
1292   .callout.warning:before {
1293     background-image: url("data:image/svg+xml;base64,PHN2ZyB2aWV3Qm94PSIwIDAgMjQgMjQiIGZpbGw9IiNiNjUzMWMiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+ICAgIDxwYXRoIGQ9Ik0wIDBoMjR2MjRIMHoiIGZpbGw9Im5vbmUiLz4gICAgPHBhdGggZD0iTTEgMjFoMjJMMTIgMiAxIDIxem0xMi0zaC0ydi0yaDJ2MnptMC00aC0ydi00aDJ2NHoiLz48L3N2Zz4="); }
1294
1295 .card {
1296   margin: 16px;
1297   background-color: #FFF;
1298   box-shadow: 0 0 1px 0 rgba(0, 0, 0, 0.2); }
1299   .card h3 {
1300     padding: 16px;
1301     border-bottom: 1px solid #E8E8E8;
1302     margin: 0;
1303     font-size: 14px;
1304     color: #888;
1305     fill: #888;
1306     font-weight: 400;
1307     text-transform: uppercase; }
1308   .card h3 a {
1309     line-height: 1; }
1310   .card .body, .card p.empty-text {
1311     padding: 16px; }
1312   .card a, .card p {
1313     word-wrap: break-word;
1314     word-break: break-word; }
1315
1316 .sidebar .card h3, .sidebar .card .body, .sidebar .card .empty-text {
1317   padding: 12px 16px; }
1318
1319 .card.drag-card {
1320   border: 1px solid #DDD;
1321   border-radius: 4px;
1322   display: flex;
1323   padding: 0;
1324   padding-left: 40px;
1325   margin: 12px 0;
1326   position: relative; }
1327   .card.drag-card .drag-card-action {
1328     cursor: pointer; }
1329   .card.drag-card .handle, .card.drag-card .drag-card-action {
1330     display: flex;
1331     padding: 0;
1332     align-items: center;
1333     text-align: center;
1334     justify-content: center;
1335     width: 28px;
1336     flex-grow: 0;
1337     padding-left: 6px;
1338     padding-right: 6px; }
1339     .card.drag-card .handle:hover, .card.drag-card .drag-card-action:hover {
1340       background-color: #EEE; }
1341     .card.drag-card .handle .svg-icon, .card.drag-card .drag-card-action .svg-icon {
1342       margin-right: 0px; }
1343   .card.drag-card > div .outline input {
1344     margin: 12px 0;
1345     width: 100%; }
1346   .card.drag-card > div.padded {
1347     padding: 12px 0 !important; }
1348   .card.drag-card .handle {
1349     background-color: #EEE;
1350     left: 0;
1351     position: absolute;
1352     top: 0;
1353     bottom: 0; }
1354   .card.drag-card > div {
1355     padding: 0 12px;
1356     max-width: 80%;
1357     flex: 1; }
1358
1359 .well {
1360   background-color: #F8F8F8;
1361   padding: 16px;
1362   border: 1px solid #DDD; }
1363
1364 .tag-item {
1365   display: inline-flex;
1366   margin-bottom: 6px;
1367   margin-right: 6px;
1368   border-radius: 4px;
1369   border: 1px solid #CCC;
1370   overflow: hidden;
1371   font-size: 0.85em; }
1372   .tag-item a, .tag-item a:hover, .tag-item a:active {
1373     padding: 4px 8px;
1374     color: #777;
1375     transition: background-color ease-in-out 80ms;
1376     text-decoration: none; }
1377   .tag-item a:hover {
1378     background-color: rgba(255, 255, 255, 0.7); }
1379   .tag-item svg {
1380     fill: #888; }
1381   .tag-item .tag-value {
1382     border-left: 1px solid #DDD;
1383     background-color: rgba(255, 255, 255, 0.5); }
1384
1385 .tag-list div:last-child .tag-item {
1386   margin-bottom: 0; }
1387
1388 .button-base, .button, input[type="button"], input[type="submit"] {
1389   text-decoration: none;
1390   font-size: 15px;
1391   line-height: 1.4em;
1392   padding: 7.8px 16px;
1393   margin: 6px 6px 6px 0;
1394   display: inline-block;
1395   border: none;
1396   font-weight: 400;
1397   outline: 0;
1398   border-radius: 2px;
1399   cursor: pointer;
1400   transition: all ease-in-out 120ms;
1401   box-shadow: 0;
1402   background-color: #0288D1;
1403   color: #EEE;
1404   fill: #EEE;
1405   text-transform: uppercase;
1406   border: 1px solid #0288D1;
1407   vertical-align: top; }
1408   .button-base:hover, .button:hover, input:hover[type="button"], input:hover[type="submit"] {
1409     background-color: #02a2f9;
1410     text-decoration: none;
1411     color: #EEE; }
1412   .button-base:active, .button:active, input:active[type="button"], input:active[type="submit"] {
1413     background-color: #026ea9; }
1414   .button-base:focus, .button:focus, input:focus[type="button"], input:focus[type="submit"] {
1415     background-color: #0295e5;
1416     box-shadow: 0 0 4px 1px #CCC;
1417     text-decoration: none;
1418     color: #EEE; }
1419
1420 .button.pos, input[type="button"].pos, input[type="submit"].pos {
1421   background-color: #52A256;
1422   color: #EEE;
1423   fill: #EEE;
1424   text-transform: uppercase;
1425   border: 1px solid #52A256;
1426   vertical-align: top; }
1427   .button.pos:hover, input[type="button"].pos:hover, input[type="submit"].pos:hover {
1428     background-color: #69b36d;
1429     text-decoration: none;
1430     color: #EEE; }
1431   .button.pos:active, input[type="button"].pos:active, input[type="submit"].pos:active {
1432     background-color: #448748; }
1433   .button.pos:focus, input[type="button"].pos:focus, input[type="submit"].pos:focus {
1434     background-color: #5cac60;
1435     box-shadow: 0 0 4px 1px #CCC;
1436     text-decoration: none;
1437     color: #EEE; }
1438
1439 .button.neg, input[type="button"].neg, input[type="submit"].neg {
1440   background-color: #E84F4F;
1441   color: #EEE;
1442   fill: #EEE;
1443   text-transform: uppercase;
1444   border: 1px solid #E84F4F;
1445   vertical-align: top; }
1446   .button.neg:hover, input[type="button"].neg:hover, input[type="submit"].neg:hover {
1447     background-color: #ed7373;
1448     text-decoration: none;
1449     color: #EEE; }
1450   .button.neg:active, input[type="button"].neg:active, input[type="submit"].neg:active {
1451     background-color: #e32b2b; }
1452   .button.neg:focus, input[type="button"].neg:focus, input[type="submit"].neg:focus {
1453     background-color: #ea6161;
1454     box-shadow: 0 0 4px 1px #CCC;
1455     text-decoration: none;
1456     color: #EEE; }
1457
1458 .button.secondary, input[type="button"].secondary, input[type="submit"].secondary {
1459   background-color: #e27b41;
1460   color: #EEE;
1461   fill: #EEE;
1462   text-transform: uppercase;
1463   border: 1px solid #e27b41;
1464   vertical-align: top; }
1465   .button.secondary:hover, input[type="button"].secondary:hover, input[type="submit"].secondary:hover {
1466     background-color: #e79464;
1467     text-decoration: none;
1468     color: #EEE; }
1469   .button.secondary:active, input[type="button"].secondary:active, input[type="submit"].secondary:active {
1470     background-color: #d96321; }
1471   .button.secondary:focus, input[type="button"].secondary:focus, input[type="submit"].secondary:focus {
1472     background-color: #e58753;
1473     box-shadow: 0 0 4px 1px #CCC;
1474     text-decoration: none;
1475     color: #EEE; }
1476
1477 .button.muted, input[type="button"].muted, input[type="submit"].muted {
1478   background-color: #AAA;
1479   color: #EEE;
1480   fill: #EEE;
1481   text-transform: uppercase;
1482   border: 1px solid #AAA;
1483   vertical-align: top; }
1484   .button.muted:hover, input[type="button"].muted:hover, input[type="submit"].muted:hover {
1485     background-color: #bebebe;
1486     text-decoration: none;
1487     color: #EEE; }
1488   .button.muted:active, input[type="button"].muted:active, input[type="submit"].muted:active {
1489     background-color: #969696; }
1490   .button.muted:focus, input[type="button"].muted:focus, input[type="submit"].muted:focus {
1491     background-color: #b4b4b4;
1492     box-shadow: 0 0 4px 1px #CCC;
1493     text-decoration: none;
1494     color: #EEE; }
1495
1496 .button.muted-light, input[type="button"].muted-light, input[type="submit"].muted-light {
1497   background-color: #e4e4e4;
1498   color: #666;
1499   fill: #666;
1500   text-transform: uppercase;
1501   border: 1px solid #e4e4e4;
1502   vertical-align: top; }
1503   .button.muted-light:hover, input[type="button"].muted-light:hover, input[type="submit"].muted-light:hover {
1504     background-color: #f8f8f8;
1505     text-decoration: none;
1506     color: #666; }
1507   .button.muted-light:active, input[type="button"].muted-light:active, input[type="submit"].muted-light:active {
1508     background-color: #d0d0d0; }
1509   .button.muted-light:focus, input[type="button"].muted-light:focus, input[type="submit"].muted-light:focus {
1510     background-color: #eeeeee;
1511     box-shadow: 0 0 4px 1px #CCC;
1512     text-decoration: none;
1513     color: #666; }
1514
1515 .button.outline {
1516   background-color: transparent;
1517   color: #888;
1518   fill: #888;
1519   border: 1px solid #DDD; }
1520   .button.outline:hover, .button.outline:focus, .button.outline:active {
1521     box-shadow: none;
1522     background-color: #EEE; }
1523   .button.outline.page {
1524     border-color: #0288D1;
1525     color: #0288D1;
1526     fill: #0288D1; }
1527     .button.outline.page:hover, .button.outline.page:focus, .button.outline.page:active {
1528       background-color: #0288D1;
1529       color: #FFF;
1530       fill: #FFF; }
1531   .button.outline.chapter {
1532     border-color: #ef7c3c;
1533     color: #ef7c3c;
1534     fill: #ef7c3c; }
1535     .button.outline.chapter:hover, .button.outline.chapter:focus, .button.outline.chapter:active {
1536       background-color: #ef7c3c;
1537       color: #FFF;
1538       fill: #FFF; }
1539   .button.outline.book {
1540     border-color: #009688;
1541     color: #009688;
1542     fill: #009688; }
1543     .button.outline.book:hover, .button.outline.book:focus, .button.outline.book:active {
1544       background-color: #009688;
1545       color: #FFF;
1546       fill: #FFF; }
1547
1548 .text-button {
1549   background-color: transparent;
1550   padding: 0;
1551   margin: 0;
1552   border: none;
1553   -webkit-user-select: none;
1554      -moz-user-select: none;
1555       -ms-user-select: none;
1556           user-select: none; }
1557   .text-button:focus, .text-button:active {
1558     outline: 0; }
1559   .text-button:hover {
1560     text-decoration: none; }
1561   .text-button.neg {
1562     color: #E84F4F; }
1563
1564 .button-group:after {
1565   display: block;
1566   content: '';
1567   font-size: 0;
1568   clear: both;
1569   position: relative; }
1570
1571 .button-group .button, .button-group button[type="button"] {
1572   margin: 6px 0 6px 0;
1573   float: left;
1574   border-radius: 0; }
1575   .button-group .button:first-child, .button-group button[type="button"]:first-child {
1576     border-radius: 2px 0 0 2px; }
1577   .button-group .button:last-child, .button-group button[type="button"]:last-child {
1578     border-radius: 0 2px 2px 0; }
1579
1580 .button.block {
1581   width: 100%;
1582   text-align: center;
1583   display: block; }
1584   .button.block.text-left {
1585     text-align: left; }
1586
1587 .button.icon .svg-icon {
1588   margin-right: 0; }
1589
1590 .button.svg {
1591   padding: 12px 16px;
1592   padding-bottom: 10px;
1593   padding-left: 56px; }
1594   .button.svg svg {
1595     display: inline-block;
1596     position: absolute;
1597     left: 16px;
1598     top: 10px;
1599     width: 24px;
1600     height: 24px; }
1601
1602 .button[disabled] {
1603   background-color: #BBB;
1604   cursor: default; }
1605   .button[disabled]:hover {
1606     background-color: #BBB;
1607     cursor: default;
1608     box-shadow: none; }
1609
1610 table {
1611   min-width: 100px;
1612   max-width: 100%; }
1613   table thead {
1614     background-color: #F8F8F8;
1615     font-weight: 500; }
1616   table td, table th {
1617     min-width: 10px;
1618     padding: 6px 8px;
1619     border: 1px solid #DDD;
1620     overflow: auto;
1621     line-height: 1.2; }
1622   table td p, table th p {
1623     margin: 0; }
1624
1625 table.table {
1626   width: 100%; }
1627   table.table tr {
1628     border-bottom: 1px solid #DDD; }
1629   table.table th, table.table td {
1630     text-align: left;
1631     border: none;
1632     padding: 6px 6px;
1633     vertical-align: middle;
1634     margin: 0; }
1635   table.table th {
1636     font-weight: bold; }
1637   table.table tr:hover {
1638     background-color: #EEE; }
1639   table.table .text-right {
1640     text-align: right; }
1641   table.table .text-center {
1642     text-align: center; }
1643   table.table td.actions {
1644     overflow: visible; }
1645
1646 table.no-style td {
1647   border: 0;
1648   padding: 0; }
1649
1650 table.list-table {
1651   margin: -6px; }
1652   table.list-table td {
1653     border: 0;
1654     vertical-align: middle;
1655     padding: 6px; }
1656
1657 .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 {
1658   background-color: #FFF;
1659   border-radius: 3px;
1660   border: 1px solid #D4D4D4;
1661   display: inline-block;
1662   font-size: 14px;
1663   padding: 9px;
1664   color: #666;
1665   width: 250px;
1666   max-width: 100%; }
1667   .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 {
1668     border: 1px solid #E84F4F; }
1669   .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 {
1670     border: 1px solid #52A256; }
1671   .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], .fake-input[disabled], 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] {
1672     background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAcAAAAHCAYAAADEUlfTAAAAMUlEQVQIW2NkwAGuXbv2nxGbHEhCS0uLEUMSJgHShCKJLIEiiS4Bl8QmAZbEJQGSBAC62BuJ+tt7zgAAAABJRU5ErkJggg==); }
1673   .input-base:focus, .fake-input:focus, input:focus[type="text"], input:focus[type="number"], input:focus[type="email"], input:focus[type="date"], input:focus[type="search"], input:focus[type="url"], input:focus[type="password"], select:focus, textarea:focus {
1674     outline: 0; }
1675
1676 .fake-input {
1677   overflow: auto; }
1678
1679 #html-editor {
1680   display: none; }
1681
1682 #markdown-editor {
1683   position: relative;
1684   z-index: 5; }
1685   #markdown-editor #markdown-editor-input {
1686     font-style: normal;
1687     font-weight: 400;
1688     padding: 6px 16px;
1689     color: #444;
1690     border-radius: 0;
1691     max-height: 100%;
1692     flex: 1;
1693     border: 0;
1694     width: 100%; }
1695     #markdown-editor #markdown-editor-input:focus {
1696       outline: 0; }
1697   #markdown-editor .markdown-display, #markdown-editor .markdown-editor-wrap {
1698     flex: 1;
1699     position: relative; }
1700   #markdown-editor .markdown-editor-wrap {
1701     display: flex;
1702     flex-direction: column;
1703     border: 1px solid #DDD;
1704     width: 50%;
1705     max-width: 50%; }
1706
1707 .markdown-display {
1708   padding: 0 16px 0;
1709   margin-left: -1px;
1710   overflow-y: scroll; }
1711   .markdown-display.page-content {
1712     margin: 0 auto;
1713     width: 100%;
1714     max-width: 100%; }
1715   .markdown-display [drawio-diagram]:hover {
1716     outline: 2px solid #0288D1; }
1717
1718 .editor-toolbar {
1719   width: 100%;
1720   padding: 6px 16px;
1721   font-size: 11px;
1722   line-height: 1.6;
1723   border-bottom: 1px solid #DDD;
1724   background-color: #EEE;
1725   flex: none; }
1726   .editor-toolbar:after {
1727     content: '';
1728     display: block;
1729     clear: both; }
1730
1731 label {
1732   display: block;
1733   line-height: 1.4em;
1734   font-size: 0.94em;
1735   font-weight: 400;
1736   color: #999;
1737   padding-bottom: 2px;
1738   margin-bottom: 0.2em; }
1739   label.inline {
1740     display: inline-block; }
1741
1742 label.radio, label.checkbox {
1743   font-weight: 400;
1744   -webkit-user-select: none;
1745      -moz-user-select: none;
1746       -ms-user-select: none;
1747           user-select: none; }
1748   label.radio input[type="radio"], label.radio input[type="checkbox"], label.checkbox input[type="radio"], label.checkbox input[type="checkbox"] {
1749     margin-right: 6px; }
1750
1751 label.inline.checkbox {
1752   margin-right: 16px; }
1753
1754 label + p.small {
1755   margin-bottom: 0.8em; }
1756
1757 table.form-table {
1758   max-width: 100%; }
1759   table.form-table td {
1760     overflow: hidden;
1761     padding: 1.5px 0; }
1762
1763 input[type=date] {
1764   width: 190px; }
1765
1766 .toggle-switch {
1767   display: inline-block;
1768   background-color: #BBB;
1769   width: 36px;
1770   height: 14px;
1771   border-radius: 7px;
1772   position: relative;
1773   transition: all ease-in-out 120ms;
1774   cursor: pointer;
1775   -webkit-user-select: none;
1776      -moz-user-select: none;
1777       -ms-user-select: none;
1778           user-select: none; }
1779   .toggle-switch:after {
1780     content: '';
1781     display: block;
1782     position: relative;
1783     left: 0;
1784     margin-top: -3px;
1785     width: 20px;
1786     height: 20px;
1787     border-radius: 50%;
1788     background-color: #fafafa;
1789     border: 1px solid #CCC;
1790     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);
1791     transition: all ease-in-out 120ms; }
1792   .toggle-switch.active {
1793     background-color: rgba(82, 162, 86, 0.4); }
1794     .toggle-switch.active:after {
1795       left: 16px;
1796       background-color: #52A256;
1797       border: #305e32; }
1798
1799 .toggle-switch-checkbox {
1800   display: none; }
1801
1802 input:checked + .toggle-switch {
1803   background-color: rgba(82, 162, 86, 0.4); }
1804   input:checked + .toggle-switch:after {
1805     left: 16px;
1806     background-color: #52A256;
1807     border: #305e32; }
1808
1809 .form-group {
1810   margin-bottom: 12px; }
1811   .form-group textarea {
1812     display: block;
1813     width: 100%;
1814     min-height: 64px; }
1815
1816 .simple-code-input {
1817   background-color: #F8F8F8;
1818   font-family: monospace;
1819   font-size: 12px;
1820   min-height: 100px; }
1821
1822 .form-group .text-pos, .form-group .text-neg {
1823   padding: 6px 0; }
1824
1825 .form-group[collapsible] {
1826   margin-left: -16px;
1827   margin-right: -16px;
1828   padding: 0 16px;
1829   border-top: 1px solid #DDD;
1830   border-bottom: 1px solid #DDD; }
1831   .form-group[collapsible] .collapse-title {
1832     margin-left: -16px;
1833     margin-right: -16px;
1834     padding: 12px 16px; }
1835   .form-group[collapsible] .collapse-title, .form-group[collapsible] .collapse-title label {
1836     cursor: pointer; }
1837   .form-group[collapsible] .collapse-title label {
1838     padding-bottom: 0;
1839     margin-bottom: 0;
1840     color: inherit; }
1841   .form-group[collapsible] .collapse-title label:before {
1842     display: inline-block;
1843     content: '\25B8';
1844     margin-right: 16px;
1845     transition: all ease-in-out 400ms;
1846     -webkit-transform: rotate(0);
1847             transform: rotate(0); }
1848   .form-group[collapsible] .collapse-content {
1849     display: none;
1850     padding-bottom: 16px; }
1851   .form-group[collapsible].open .collapse-title label:before {
1852     -webkit-transform: rotate(90deg);
1853             transform: rotate(90deg); }
1854   .form-group[collapsible] + .form-group[collapsible] {
1855     margin-top: -13px; }
1856
1857 .inline-input-style, .title-input input[type="text"], .description-input textarea {
1858   display: block;
1859   width: 100%;
1860   padding: 12px; }
1861
1862 .title-input input[type="text"] {
1863   margin-top: 0;
1864   font-size: 2em; }
1865
1866 .title-input.page-title {
1867   font-size: 0.8em; }
1868   .title-input.page-title .input {
1869     border: 0;
1870     margin-bottom: -1px; }
1871   .title-input.page-title input[type="text"] {
1872     max-width: 840px;
1873     margin: 0 auto;
1874     border: none; }
1875
1876 .page-title input {
1877   display: block;
1878   width: 100%;
1879   font-size: 1.4em; }
1880
1881 .description-input textarea {
1882   font-size: 15px;
1883   color: #666;
1884   width: 100%; }
1885
1886 div[editor-type="markdown"] .title-input.page-title input[type="text"] {
1887   max-width: 100%; }
1888
1889 .search-box {
1890   max-width: 100%;
1891   position: relative; }
1892   .search-box button {
1893     background-color: transparent;
1894     border: none;
1895     color: #0288D1;
1896     padding: 0;
1897     cursor: pointer;
1898     position: absolute;
1899     left: 8px;
1900     top: 9.5px; }
1901   .search-box input {
1902     display: block;
1903     padding-left: 24px;
1904     width: 300px;
1905     max-width: 100%; }
1906
1907 .outline > input {
1908   border: 0;
1909   border-bottom: 2px solid #DDD;
1910   border-radius: 0; }
1911   .outline > input:focus, .outline > input:active {
1912     border: 0;
1913     border-bottom: 2px solid #AAA;
1914     outline: 0; }
1915
1916 #login-form label[for="remember"] {
1917   margin: 0; }
1918
1919 #login-form label.toggle-switch {
1920   margin-left: 32px; }
1921
1922 .image-picker img {
1923   background-color: #BBB; }
1924
1925 .anim.fadeIn {
1926   opacity: 0;
1927   -webkit-animation-name: fadeIn;
1928           animation-name: fadeIn;
1929   -webkit-animation-duration: 180ms;
1930           animation-duration: 180ms;
1931   -webkit-animation-timing-function: ease-in-out;
1932           animation-timing-function: ease-in-out;
1933   -webkit-animation-fill-mode: forwards;
1934           animation-fill-mode: forwards; }
1935
1936 @-webkit-keyframes fadeIn {
1937   0% {
1938     opacity: 0; }
1939   100% {
1940     opacity: 1; } }
1941
1942 @keyframes fadeIn {
1943   0% {
1944     opacity: 0; }
1945   100% {
1946     opacity: 1; } }
1947
1948 .anim.searchResult {
1949   opacity: 0;
1950   -webkit-transform: translate3d(580px, 0, 0);
1951           transform: translate3d(580px, 0, 0);
1952   -webkit-animation-name: searchResult;
1953           animation-name: searchResult;
1954   -webkit-animation-duration: 220ms;
1955           animation-duration: 220ms;
1956   -webkit-animation-fill-mode: forwards;
1957           animation-fill-mode: forwards;
1958   -webkit-animation-timing-function: cubic-bezier(0.62, 0.28, 0.23, 0.99);
1959           animation-timing-function: cubic-bezier(0.62, 0.28, 0.23, 0.99); }
1960
1961 @-webkit-keyframes searchResult {
1962   0% {
1963     opacity: 0;
1964     -webkit-transform: translate3d(400px, 0, 0);
1965             transform: translate3d(400px, 0, 0); }
1966   100% {
1967     opacity: 1;
1968     -webkit-transform: translate3d(0, 0, 0);
1969             transform: translate3d(0, 0, 0); } }
1970
1971 @keyframes searchResult {
1972   0% {
1973     opacity: 0;
1974     -webkit-transform: translate3d(400px, 0, 0);
1975             transform: translate3d(400px, 0, 0); }
1976   100% {
1977     opacity: 1;
1978     -webkit-transform: translate3d(0, 0, 0);
1979             transform: translate3d(0, 0, 0); } }
1980
1981 .anim.menuIn {
1982   -webkit-transform-origin: 100% 0%;
1983           transform-origin: 100% 0%;
1984   -webkit-animation-name: menuIn;
1985           animation-name: menuIn;
1986   -webkit-animation-duration: 120ms;
1987           animation-duration: 120ms;
1988   -webkit-animation-delay: 0s;
1989           animation-delay: 0s;
1990   -webkit-animation-timing-function: cubic-bezier(0.62, 0.28, 0.23, 0.99);
1991           animation-timing-function: cubic-bezier(0.62, 0.28, 0.23, 0.99); }
1992
1993 @-webkit-keyframes menuIn {
1994   from {
1995     opacity: 0;
1996     -webkit-transform: scale3d(0, 0, 1);
1997             transform: scale3d(0, 0, 1); }
1998   to {
1999     opacity: 1;
2000     -webkit-transform: scale3d(1, 1, 1);
2001             transform: scale3d(1, 1, 1); } }
2002
2003 @keyframes menuIn {
2004   from {
2005     opacity: 0;
2006     -webkit-transform: scale3d(0, 0, 1);
2007             transform: scale3d(0, 0, 1); }
2008   to {
2009     opacity: 1;
2010     -webkit-transform: scale3d(1, 1, 1);
2011             transform: scale3d(1, 1, 1); } }
2012
2013 @-webkit-keyframes loadingBob {
2014   0% {
2015     -webkit-transform: translate3d(0, 0, 0);
2016             transform: translate3d(0, 0, 0); }
2017   30% {
2018     -webkit-transform: translate3d(0, 0, 0);
2019             transform: translate3d(0, 0, 0); }
2020   50% {
2021     -webkit-transform: translate3d(0, -10px, 0);
2022             transform: translate3d(0, -10px, 0); }
2023   70% {
2024     -webkit-transform: translate3d(0, 0, 0);
2025             transform: translate3d(0, 0, 0); }
2026   100% {
2027     -webkit-transform: translate3d(0, 0, 0);
2028             transform: translate3d(0, 0, 0); } }
2029
2030 @keyframes loadingBob {
2031   0% {
2032     -webkit-transform: translate3d(0, 0, 0);
2033             transform: translate3d(0, 0, 0); }
2034   30% {
2035     -webkit-transform: translate3d(0, 0, 0);
2036             transform: translate3d(0, 0, 0); }
2037   50% {
2038     -webkit-transform: translate3d(0, -10px, 0);
2039             transform: translate3d(0, -10px, 0); }
2040   70% {
2041     -webkit-transform: translate3d(0, 0, 0);
2042             transform: translate3d(0, 0, 0); }
2043   100% {
2044     -webkit-transform: translate3d(0, 0, 0);
2045             transform: translate3d(0, 0, 0); } }
2046
2047 @-webkit-keyframes pointer {
2048   0% {
2049     -webkit-transform: translate3d(0, 20px, 0) scale3d(0, 0, 0);
2050             transform: translate3d(0, 20px, 0) scale3d(0, 0, 0); }
2051   100% {
2052     -webkit-transform: translate3d(0, 0, 0) scale3d(1, 1, 1);
2053             transform: translate3d(0, 0, 0) scale3d(1, 1, 1); } }
2054
2055 @keyframes pointer {
2056   0% {
2057     -webkit-transform: translate3d(0, 20px, 0) scale3d(0, 0, 0);
2058             transform: translate3d(0, 20px, 0) scale3d(0, 0, 0); }
2059   100% {
2060     -webkit-transform: translate3d(0, 0, 0) scale3d(1, 1, 1);
2061             transform: translate3d(0, 0, 0) scale3d(1, 1, 1); } }
2062
2063 .anim.pointer {
2064   -webkit-transform-origin: 50% 100%;
2065           transform-origin: 50% 100%;
2066   -webkit-animation-name: pointer;
2067           animation-name: pointer;
2068   -webkit-animation-duration: 180ms;
2069           animation-duration: 180ms;
2070   -webkit-animation-delay: 0s;
2071           animation-delay: 0s;
2072   -webkit-animation-timing-function: cubic-bezier(0.62, 0.28, 0.23, 0.99);
2073           animation-timing-function: cubic-bezier(0.62, 0.28, 0.23, 0.99); }
2074
2075 .selectFade {
2076   transition: background-color ease-in-out 3000ms; }
2077
2078 .mce-tinymce.mce-container.mce-fullscreen {
2079   position: fixed;
2080   top: 0;
2081   height: 100%;
2082   width: 100%;
2083   max-width: 100%;
2084   z-index: 100; }
2085
2086 .mce-tinymce .mce-panel {
2087   background-color: #FFF; }
2088
2089 .mce-tinymce .mce-btn {
2090   background-color: #FFF; }
2091
2092 .mce-container-body.mce-flow-layout {
2093   text-align: center; }
2094
2095 .edit-area.flex > div > .mce-tinymce.mce-container.mce-panel {
2096   flex: 1 1 auto;
2097   display: flex !important;
2098   flex-direction: column;
2099   align-items: stretch;
2100   margin: 0 -1px; }
2101   .edit-area.flex > div > .mce-tinymce.mce-container.mce-panel > .mce-container-body {
2102     flex: 1 1 auto;
2103     display: flex !important;
2104     flex-direction: column;
2105     align-items: stretch; }
2106     .edit-area.flex > div > .mce-tinymce.mce-container.mce-panel > .mce-container-body > .mce-toolbar-grp {
2107       flex: 0 1 auto; }
2108     .edit-area.flex > div > .mce-tinymce.mce-container.mce-panel > .mce-container-body > .mce-edit-area {
2109       flex: 1 1 auto;
2110       display: flex !important;
2111       flex-direction: column;
2112       align-items: stretch; }
2113       .edit-area.flex > div > .mce-tinymce.mce-container.mce-panel > .mce-container-body > .mce-edit-area iframe {
2114         flex: 1; }
2115
2116 .page-content.mce-content-body p {
2117   line-height: 1.6; }
2118
2119 .mce-colorbtn-trans {
2120   overflow: hidden; }
2121
2122 .mce-content-body .CodeMirrorContainer > .CodeMirror {
2123   pointer-events: none; }
2124
2125 /* BASICS */
2126 .CodeMirror {
2127   /* Set height, width, borders, and global font properties here */
2128   height: 300px;
2129   color: black; }
2130
2131 /* PADDING */
2132 .CodeMirror-lines {
2133   padding: 4px 0;
2134   /* Vertical padding around content */ }
2135
2136 .CodeMirror pre {
2137   padding: 0 4px;
2138   /* Horizontal padding of content */ }
2139
2140 .CodeMirror-scrollbar-filler, .CodeMirror-gutter-filler {
2141   background-color: white;
2142   /* The little square between H and V scrollbars */ }
2143
2144 /* GUTTER */
2145 .CodeMirror-gutters {
2146   border-right: 1px solid #ddd;
2147   background-color: #f7f7f7;
2148   white-space: nowrap; }
2149
2150 .CodeMirror-linenumber {
2151   padding: 0 3px 0 5px;
2152   min-width: 20px;
2153   text-align: right;
2154   color: #999;
2155   white-space: nowrap; }
2156
2157 .CodeMirror-guttermarker {
2158   color: black; }
2159
2160 .CodeMirror-guttermarker-subtle {
2161   color: #999; }
2162
2163 /* CURSOR */
2164 .CodeMirror-cursor {
2165   border-left: 1px solid black;
2166   border-right: none;
2167   width: 0; }
2168
2169 /* Shown when moving in bi-directional text */
2170 .CodeMirror div.CodeMirror-secondarycursor {
2171   border-left: 1px solid silver; }
2172
2173 .cm-fat-cursor .CodeMirror-cursor {
2174   width: auto;
2175   border: 0 !important;
2176   background: #7e7; }
2177
2178 .cm-fat-cursor div.CodeMirror-cursors {
2179   z-index: 1; }
2180
2181 .cm-animate-fat-cursor {
2182   width: auto;
2183   border: 0;
2184   -webkit-animation: blink 1.06s steps(1) infinite;
2185   animation: blink 1.06s steps(1) infinite;
2186   background-color: #7e7; }
2187
2188 @-webkit-keyframes blink {
2189   0% { }
2190   50% {
2191     background-color: transparent; }
2192   100% { } }
2193
2194 @keyframes blink {
2195   0% { }
2196   50% {
2197     background-color: transparent; }
2198   100% { } }
2199
2200 /* Can style cursor different in overwrite (non-insert) mode */
2201 .cm-tab {
2202   display: inline-block;
2203   text-decoration: inherit; }
2204
2205 .CodeMirror-rulers {
2206   position: absolute;
2207   left: 0;
2208   right: 0;
2209   top: -50px;
2210   bottom: -20px;
2211   overflow: hidden; }
2212
2213 .CodeMirror-ruler {
2214   border-left: 1px solid #ccc;
2215   top: 0;
2216   bottom: 0;
2217   position: absolute; }
2218
2219 /* DEFAULT THEME */
2220 .cm-s-default .cm-header {
2221   color: blue; }
2222
2223 .cm-s-default .cm-quote {
2224   color: #090; }
2225
2226 .cm-negative {
2227   color: #d44; }
2228
2229 .cm-positive {
2230   color: #292; }
2231
2232 .cm-header, .cm-strong {
2233   font-weight: bold; }
2234
2235 .cm-em {
2236   font-style: italic; }
2237
2238 .cm-link {
2239   text-decoration: underline; }
2240
2241 .cm-strikethrough {
2242   text-decoration: line-through; }
2243
2244 .cm-s-default .cm-keyword {
2245   color: #708; }
2246
2247 .cm-s-default .cm-atom {
2248   color: #219; }
2249
2250 .cm-s-default .cm-number {
2251   color: #164; }
2252
2253 .cm-s-default .cm-def {
2254   color: #00f; }
2255
2256 .cm-s-default .cm-variable-2 {
2257   color: #05a; }
2258
2259 .cm-s-default .cm-variable-3 {
2260   color: #085; }
2261
2262 .cm-s-default .cm-comment {
2263   color: #a50; }
2264
2265 .cm-s-default .cm-string {
2266   color: #a11; }
2267
2268 .cm-s-default .cm-string-2 {
2269   color: #f50; }
2270
2271 .cm-s-default .cm-meta {
2272   color: #555; }
2273
2274 .cm-s-default .cm-qualifier {
2275   color: #555; }
2276
2277 .cm-s-default .cm-builtin {
2278   color: #30a; }
2279
2280 .cm-s-default .cm-bracket {
2281   color: #997; }
2282
2283 .cm-s-default .cm-tag {
2284   color: #170; }
2285
2286 .cm-s-default .cm-attribute {
2287   color: #00c; }
2288
2289 .cm-s-default .cm-hr {
2290   color: #999; }
2291
2292 .cm-s-default .cm-link {
2293   color: #00c; }
2294
2295 .cm-s-default .cm-error {
2296   color: #f00; }
2297
2298 .cm-invalidchar {
2299   color: #f00; }
2300
2301 .CodeMirror-composing {
2302   border-bottom: 2px solid; }
2303
2304 /* Default styles for common addons */
2305 div.CodeMirror span.CodeMirror-matchingbracket {
2306   color: #0f0; }
2307
2308 div.CodeMirror span.CodeMirror-nonmatchingbracket {
2309   color: #f22; }
2310
2311 .CodeMirror-matchingtag {
2312   background: rgba(255, 150, 0, 0.3); }
2313
2314 .CodeMirror-activeline-background {
2315   background: #e8f2ff; }
2316
2317 /* STOP */
2318 /* The rest of this file contains styles related to the mechanics of
2319    the editor. You probably shouldn't touch them. */
2320 .CodeMirror {
2321   position: relative;
2322   overflow: hidden;
2323   background: white; }
2324
2325 .CodeMirror-scroll {
2326   overflow: scroll !important;
2327   /* Things will break if this is overridden */
2328   /* 30px is the magic margin used to hide the element's real scrollbars */
2329   /* See overflow: hidden in .CodeMirror */
2330   margin-bottom: -30px;
2331   margin-right: -30px;
2332   padding-bottom: 30px;
2333   height: 100%;
2334   outline: none;
2335   /* Prevent dragging from highlighting the element */
2336   position: relative; }
2337
2338 .CodeMirror-sizer {
2339   position: relative;
2340   border-right: 30px solid transparent; }
2341
2342 /* The fake, visible scrollbars. Used to force redraw during scrolling
2343    before actual scrolling happens, thus preventing shaking and
2344    flickering artifacts. */
2345 .CodeMirror-vscrollbar, .CodeMirror-hscrollbar, .CodeMirror-scrollbar-filler, .CodeMirror-gutter-filler {
2346   position: absolute;
2347   z-index: 6;
2348   display: none; }
2349
2350 .CodeMirror-vscrollbar {
2351   right: 0;
2352   top: 0;
2353   overflow-x: hidden;
2354   overflow-y: scroll; }
2355
2356 .CodeMirror-hscrollbar {
2357   bottom: 0;
2358   left: 0;
2359   overflow-y: hidden;
2360   overflow-x: scroll; }
2361
2362 .CodeMirror-scrollbar-filler {
2363   right: 0;
2364   bottom: 0; }
2365
2366 .CodeMirror-gutter-filler {
2367   left: 0;
2368   bottom: 0; }
2369
2370 .CodeMirror-gutters {
2371   position: absolute;
2372   left: 0;
2373   top: 0;
2374   min-height: 100%;
2375   z-index: 3; }
2376
2377 .CodeMirror-gutter {
2378   white-space: normal;
2379   height: 100%;
2380   display: inline-block;
2381   vertical-align: top;
2382   margin-bottom: -30px; }
2383
2384 .CodeMirror-gutter-wrapper {
2385   position: absolute;
2386   z-index: 4;
2387   background: none !important;
2388   border: none !important; }
2389
2390 .CodeMirror-gutter-background {
2391   position: absolute;
2392   top: 0;
2393   bottom: 0;
2394   z-index: 4; }
2395
2396 .CodeMirror-gutter-elt {
2397   position: absolute;
2398   cursor: default;
2399   z-index: 4; }
2400
2401 .CodeMirror-gutter-wrapper ::-moz-selection {
2402   background-color: transparent; }
2403
2404 .CodeMirror-gutter-wrapper ::selection {
2405   background-color: transparent; }
2406
2407 .CodeMirror-gutter-wrapper ::-moz-selection {
2408   background-color: transparent; }
2409
2410 .CodeMirror-lines {
2411   cursor: text;
2412   min-height: 1px;
2413   /* prevents collapsing before first draw */ }
2414
2415 .CodeMirror pre {
2416   /* Reset some styles that the rest of the page might have set */
2417   border-radius: 0;
2418   border-width: 0;
2419   background: transparent;
2420   font-size: inherit;
2421   margin: 0;
2422   white-space: pre;
2423   word-wrap: normal;
2424   line-height: inherit;
2425   color: inherit;
2426   z-index: 2;
2427   position: relative;
2428   overflow: visible;
2429   -webkit-tap-highlight-color: transparent;
2430   -webkit-font-variant-ligatures: contextual;
2431   font-variant-ligatures: contextual; }
2432   .CodeMirror pre:after {
2433     content: none;
2434     display: none; }
2435
2436 .CodeMirror-wrap pre {
2437   word-wrap: break-word;
2438   white-space: pre-wrap;
2439   word-break: normal; }
2440
2441 .CodeMirror-linebackground {
2442   position: absolute;
2443   left: 0;
2444   right: 0;
2445   top: 0;
2446   bottom: 0;
2447   z-index: 0; }
2448
2449 .CodeMirror-linewidget {
2450   position: relative;
2451   z-index: 2;
2452   overflow: auto; }
2453
2454 .CodeMirror-rtl pre {
2455   direction: rtl; }
2456
2457 .CodeMirror-code {
2458   outline: none; }
2459
2460 /* Force content-box sizing for the elements where we expect it */
2461 .CodeMirror-scroll,
2462 .CodeMirror-sizer,
2463 .CodeMirror-gutter,
2464 .CodeMirror-gutters,
2465 .CodeMirror-linenumber {
2466   box-sizing: content-box; }
2467
2468 .CodeMirror-measure {
2469   position: absolute;
2470   width: 100%;
2471   height: 0;
2472   overflow: hidden;
2473   visibility: hidden; }
2474
2475 .CodeMirror-cursor {
2476   position: absolute;
2477   pointer-events: none; }
2478
2479 .CodeMirror-measure pre {
2480   position: static; }
2481
2482 div.CodeMirror-cursors {
2483   visibility: hidden;
2484   position: relative;
2485   z-index: 3; }
2486
2487 div.CodeMirror-dragcursors {
2488   visibility: visible; }
2489
2490 .CodeMirror-focused div.CodeMirror-cursors {
2491   visibility: visible; }
2492
2493 .CodeMirror-selected {
2494   background: #d9d9d9; }
2495
2496 .CodeMirror-focused .CodeMirror-selected {
2497   background: #d7d4f0; }
2498
2499 .CodeMirror-crosshair {
2500   cursor: crosshair; }
2501
2502 .CodeMirror-line::-moz-selection, .CodeMirror-line > span::-moz-selection, .CodeMirror-line > span > span::-moz-selection {
2503   background: #d7d4f0; }
2504
2505 .CodeMirror-line::selection, .CodeMirror-line > span::selection, .CodeMirror-line > span > span::selection {
2506   background: #d7d4f0; }
2507
2508 .CodeMirror-line::-moz-selection, .CodeMirror-line > span::-moz-selection, .CodeMirror-line > span > span::-moz-selection {
2509   background: #d7d4f0; }
2510
2511 .cm-searching {
2512   background: #ffa;
2513   background: rgba(255, 255, 0, 0.4); }
2514
2515 /* Used to force a border model for a node */
2516 .cm-force-border {
2517   padding-right: .1px; }
2518
2519 @media print {
2520   /* Hide the cursor when printing */
2521   .CodeMirror div.CodeMirror-cursors {
2522     visibility: hidden; } }
2523
2524 /* See issue #2901 */
2525 .cm-tab-wrap-hack:after {
2526   content: ''; }
2527
2528 /* Help users use markselection to safely style text background */
2529 span.CodeMirror-selectedtext {
2530   background: none; }
2531
2532 /*
2533
2534     Name:       Base16 Default Light
2535     Author:     Chris Kempson (http://chriskempson.com)
2536
2537     CodeMirror template by Jan T. Sott (https://github.com/idleberg/base16-codemirror)
2538     Original Base16 color scheme by Chris Kempson (https://github.com/chriskempson/base16)
2539
2540 */
2541 .cm-s-base16-light.CodeMirror {
2542   background: #f8f8f8;
2543   color: #444444; }
2544
2545 .cm-s-base16-light div.CodeMirror-selected {
2546   background: #e0e0e0; }
2547
2548 .cm-s-base16-light .CodeMirror-line::-moz-selection, .cm-s-base16-light .CodeMirror-line > span::-moz-selection, .cm-s-base16-light .CodeMirror-line > span > span::-moz-selection {
2549   background: #e0e0e0; }
2550
2551 .cm-s-base16-light .CodeMirror-line::selection, .cm-s-base16-light .CodeMirror-line > span::selection, .cm-s-base16-light .CodeMirror-line > span > span::selection {
2552   background: #e0e0e0; }
2553
2554 .cm-s-base16-light .CodeMirror-line::-moz-selection, .cm-s-base16-light .CodeMirror-line > span::-moz-selection, .cm-s-base16-light .CodeMirror-line > span > span::-moz-selection {
2555   background: #e0e0e0; }
2556
2557 .cm-s-base16-light .CodeMirror-gutters {
2558   background: #f5f5f5;
2559   border-right: 0px; }
2560
2561 .cm-s-base16-light .CodeMirror-guttermarker {
2562   color: #ac4142; }
2563
2564 .cm-s-base16-light .CodeMirror-guttermarker-subtle {
2565   color: #b0b0b0; }
2566
2567 .cm-s-base16-light .CodeMirror-linenumber {
2568   color: #b0b0b0; }
2569
2570 .cm-s-base16-light .CodeMirror-cursor {
2571   border-left: 1px solid #505050; }
2572
2573 .cm-s-base16-light span.cm-comment {
2574   color: #8f5536; }
2575
2576 .cm-s-base16-light span.cm-atom {
2577   color: #aa759f; }
2578
2579 .cm-s-base16-light span.cm-number {
2580   color: #aa759f; }
2581
2582 .cm-s-base16-light span.cm-property, .cm-s-base16-light span.cm-attribute {
2583   color: #678c30; }
2584
2585 .cm-s-base16-light span.cm-keyword {
2586   color: #ac4142; }
2587
2588 .cm-s-base16-light span.cm-string {
2589   color: #e09c3c; }
2590
2591 .cm-s-base16-light span.cm-builtin {
2592   color: #4c7f9e; }
2593
2594 .cm-s-base16-light span.cm-variable {
2595   color: #90a959; }
2596
2597 .cm-s-base16-light span.cm-variable-2 {
2598   color: #6a9fb5; }
2599
2600 .cm-s-base16-light span.cm-def {
2601   color: #d28445; }
2602
2603 .cm-s-base16-light span.cm-bracket {
2604   color: #202020; }
2605
2606 .cm-s-base16-light span.cm-tag {
2607   color: #ac4142; }
2608
2609 .cm-s-base16-light span.cm-link {
2610   color: #aa759f; }
2611
2612 .cm-s-base16-light span.cm-error {
2613   background: #ac4142;
2614   color: #505050; }
2615
2616 .cm-s-base16-light .CodeMirror-activeline-background {
2617   background: #DDDCDC; }
2618
2619 .cm-s-base16-light .CodeMirror-matchingbracket {
2620   text-decoration: underline;
2621   color: white !important; }
2622
2623 /**
2624  * Custom BookStack overrides
2625  */
2626 .CodeMirror, .CodeMirror pre {
2627   font-size: 12px; }
2628
2629 .CodeMirror {
2630   font-size: 12px;
2631   height: auto;
2632   margin-bottom: 24px;
2633   border: 1px solid #DDD; }
2634
2635 .cm-s-base16-light .CodeMirror-gutters {
2636   background: #f5f5f5;
2637   border-right: 1px solid #DDD; }
2638
2639 .code-fill .CodeMirror {
2640   position: absolute;
2641   top: 0;
2642   bottom: 0;
2643   left: 0;
2644   width: 100%;
2645   height: 100%; }
2646
2647 /**
2648  * Custom Copy Button
2649  */
2650 .CodeMirror-copy {
2651   position: absolute;
2652   top: -1px;
2653   right: -1px;
2654   background-color: #EEE;
2655   padding: 6px;
2656   line-height: 0;
2657   border: 1px solid #DDD;
2658   cursor: pointer;
2659   fill: #444;
2660   z-index: 5;
2661   transition: all ease-in 240ms;
2662   -webkit-user-select: none;
2663      -moz-user-select: none;
2664       -ms-user-select: none;
2665           user-select: none;
2666   opacity: 0;
2667   pointer-events: none; }
2668   .CodeMirror-copy svg {
2669     transition: -webkit-transform ease-in 240ms;
2670     transition: transform ease-in 240ms;
2671     transition: transform ease-in 240ms, -webkit-transform ease-in 240ms;
2672     -webkit-transform: translateY(0);
2673             transform: translateY(0); }
2674   .CodeMirror-copy.success {
2675     background-color: #70b774;
2676     fill: #FFF; }
2677     .CodeMirror-copy.success svg {
2678       -webkit-transform: translateY(-3px);
2679               transform: translateY(-3px); }
2680
2681 .CodeMirror:hover .CodeMirror-copy {
2682   -webkit-user-select: all;
2683      -moz-user-select: all;
2684       -ms-user-select: all;
2685           user-select: all;
2686   opacity: 1;
2687   pointer-events: all; }
2688
2689 [notification] {
2690   position: fixed;
2691   top: 0;
2692   right: 0;
2693   margin: 64px 32px;
2694   padding: 16px 24px;
2695   background-color: #EEE;
2696   border-radius: 3px;
2697   box-shadow: 0 1px 3px 1px rgba(76, 76, 76, 0.26), 0 1px 12px 0px rgba(76, 76, 76, 0.2);
2698   z-index: 999999;
2699   cursor: pointer;
2700   max-width: 360px;
2701   transition: -webkit-transform ease-in-out 280ms;
2702   transition: transform ease-in-out 280ms;
2703   transition: transform ease-in-out 280ms, -webkit-transform ease-in-out 280ms;
2704   -webkit-transform: translateX(580px);
2705           transform: translateX(580px);
2706   display: grid;
2707   grid-template-columns: 42px 1fr;
2708   color: #FFF; }
2709   [notification] span, [notification] svg {
2710     vertical-align: middle;
2711     justify-self: center;
2712     align-self: center; }
2713   [notification] svg {
2714     fill: #EEEEEE;
2715     width: 2.8rem;
2716     height: 2.8rem;
2717     padding-right: 12px; }
2718   [notification] span {
2719     vertical-align: middle;
2720     line-height: 1.3; }
2721   [notification].pos {
2722     background-color: #52A256; }
2723   [notification].neg {
2724     background-color: #E84F4F; }
2725   [notification].warning {
2726     background-color: #e27b41; }
2727   [notification].showing {
2728     -webkit-transform: translateX(0);
2729             transform: translateX(0); }
2730   [notification].showing:hover {
2731     -webkit-transform: translate3d(0, -2px, 0);
2732             transform: translate3d(0, -2px, 0); }
2733
2734 [chapter-toggle] {
2735   cursor: pointer;
2736   margin: 0;
2737   transition: all ease-in-out 180ms;
2738   -webkit-user-select: none;
2739      -moz-user-select: none;
2740       -ms-user-select: none;
2741           user-select: none; }
2742   [chapter-toggle] svg[data-icon="caret-right"] {
2743     transition: all ease-in-out 180ms;
2744     -webkit-transform: rotate(0deg);
2745             transform: rotate(0deg);
2746     -webkit-transform-origin: 25% 50%;
2747             transform-origin: 25% 50%; }
2748   [chapter-toggle].open svg[data-icon="caret-right"] {
2749     -webkit-transform: rotate(90deg);
2750             transform: rotate(90deg); }
2751
2752 [overlay] {
2753   background-color: rgba(0, 0, 0, 0.333);
2754   position: fixed;
2755   z-index: 95536;
2756   width: 100%;
2757   height: 100%;
2758   min-width: 100%;
2759   min-height: 100%;
2760   top: 0;
2761   left: 0;
2762   right: 0;
2763   bottom: 0;
2764   align-items: center;
2765   justify-content: center;
2766   display: none; }
2767
2768 .popup-body-wrap {
2769   display: flex; }
2770
2771 .popup-body {
2772   background-color: #FFF;
2773   max-height: 90%;
2774   width: 1200px;
2775   height: auto;
2776   margin: 2% 5%;
2777   border-radius: 4px;
2778   box-shadow: 0 0 15px 0 rgba(0, 0, 0, 0.3);
2779   overflow: hidden;
2780   z-index: 999;
2781   display: flex;
2782   flex-direction: column; }
2783   .popup-body.small {
2784     margin: 2% auto;
2785     width: 800px;
2786     max-width: 90%; }
2787   .popup-body:before {
2788     display: flex;
2789     align-self: flex-start; }
2790   .popup-body .popup-content {
2791     overflow-y: auto; }
2792
2793 .corner-button {
2794   position: absolute;
2795   top: 0;
2796   right: 0;
2797   margin: 0;
2798   height: 40px;
2799   border-radius: 0;
2800   box-shadow: none; }
2801
2802 .popup-header, .popup-footer {
2803   display: block !important;
2804   position: relative;
2805   height: 40px;
2806   flex: none !important; }
2807   .popup-header .popup-title, .popup-footer .popup-title {
2808     color: #FFF;
2809     padding: 8px 16px; }
2810
2811 body.flexbox-support #entity-selector-wrap .popup-body .form-group {
2812   height: 444px;
2813   min-height: 444px; }
2814
2815 #entity-selector-wrap .popup-body .form-group {
2816   margin: 0; }
2817
2818 .image-manager-body {
2819   min-height: 70vh; }
2820
2821 .dropzone-container {
2822   position: relative;
2823   background-color: #EEE;
2824   background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='4' height='4' viewBox='0 0 4 4'%3E%3Cpath fill='%23a9a9a9' fill-opacity='0.52' d='M1 3h1v1H1V3zm2-2h1v1H3V1z'%3E%3C/path%3E%3C/svg%3E"); }
2825
2826 .image-manager-list .image {
2827   display: block;
2828   position: relative;
2829   border-radius: 0;
2830   float: left;
2831   margin: 0;
2832   cursor: pointer;
2833   width: 16.66667%;
2834   height: auto;
2835   border: 1px solid #DDD;
2836   box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);
2837   transition: all cubic-bezier(0.4, 0, 1, 1) 160ms;
2838   overflow: hidden; }
2839   .image-manager-list .image.selected {
2840     border: 4px solid #FFF;
2841     overflow: hidden;
2842     border-radius: 8px;
2843     box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.2); }
2844   .image-manager-list .image img {
2845     width: 100%;
2846     max-width: 100%;
2847     display: block; }
2848   .image-manager-list .image .image-meta {
2849     position: absolute;
2850     width: 100%;
2851     bottom: 0;
2852     left: 0;
2853     color: #EEE;
2854     background-color: rgba(0, 0, 0, 0.4);
2855     font-size: 10px;
2856     padding: 3px 4px; }
2857     .image-manager-list .image .image-meta span {
2858       display: block; }
2859   @media screen and (max-width: 1100px) {
2860     .image-manager-list .image {
2861       width: 25%; } }
2862   @media screen and (max-width: 800px) {
2863     .image-manager-list .image .image-meta {
2864       display: none; } }
2865
2866 #image-manager .load-more {
2867   display: block;
2868   text-align: center;
2869   background-color: #EEE;
2870   padding: 12px 16px;
2871   color: #AAA;
2872   clear: both;
2873   font-size: 20px;
2874   cursor: pointer;
2875   font-style: italic; }
2876
2877 .image-manager-sidebar {
2878   width: 300px;
2879   overflow-y: auto;
2880   overflow-x: hidden;
2881   border-left: 1px solid #DDD; }
2882   .image-manager-sidebar .inner {
2883     padding: 16px; }
2884   .image-manager-sidebar img {
2885     max-width: 100%;
2886     max-height: 180px;
2887     display: block;
2888     margin: 0 auto 16px auto;
2889     box-shadow: 0 1px 21px 1px rgba(76, 76, 76, 0.3); }
2890   .image-manager-sidebar .image-manager-viewer {
2891     height: 196px;
2892     display: flex;
2893     align-items: center;
2894     justify-content: center; }
2895     .image-manager-sidebar .image-manager-viewer a {
2896       display: inline-block; }
2897   .image-manager-sidebar .dropzone-container {
2898     border-bottom: 1px solid #DDD; }
2899
2900 .image-manager-list {
2901   overflow-y: scroll;
2902   flex: 1; }
2903
2904 .image-manager-content {
2905   display: flex;
2906   flex-direction: column;
2907   flex: 1; }
2908   .image-manager-content .container {
2909     width: 100%; }
2910   .image-manager-content .full-tab {
2911     text-align: center; }
2912
2913 /*
2914  * The MIT License
2915  * Copyright (c) 2012 Matias Meno <[email protected]>
2916  */
2917 .dz-message {
2918   font-size: 1em;
2919   line-height: 2.35;
2920   font-style: italic;
2921   color: #888;
2922   text-align: center;
2923   cursor: pointer;
2924   padding: 24px 16px;
2925   transition: all ease-in-out 120ms; }
2926
2927 .dz-drag-hover .dz-message {
2928   background-color: #107ed2;
2929   color: #EEE; }
2930
2931 @-webkit-keyframes passing-through {
2932   0% {
2933     opacity: 0;
2934     -webkit-transform: translateY(40px);
2935             transform: translateY(40px); }
2936   30%, 70% {
2937     opacity: 1;
2938     -webkit-transform: translateY(0px);
2939             transform: translateY(0px); }
2940   100% {
2941     opacity: 0;
2942     -webkit-transform: translateY(-40px);
2943             transform: translateY(-40px); } }
2944
2945 @keyframes passing-through {
2946   0% {
2947     opacity: 0;
2948     -webkit-transform: translateY(40px);
2949             transform: translateY(40px); }
2950   30%, 70% {
2951     opacity: 1;
2952     -webkit-transform: translateY(0px);
2953             transform: translateY(0px); }
2954   100% {
2955     opacity: 0;
2956     -webkit-transform: translateY(-40px);
2957             transform: translateY(-40px); } }
2958
2959 @-webkit-keyframes slide-in {
2960   0% {
2961     opacity: 0;
2962     -webkit-transform: translateY(40px);
2963             transform: translateY(40px); }
2964   30% {
2965     opacity: 1;
2966     -webkit-transform: translateY(0px);
2967             transform: translateY(0px); } }
2968
2969 @keyframes slide-in {
2970   0% {
2971     opacity: 0;
2972     -webkit-transform: translateY(40px);
2973             transform: translateY(40px); }
2974   30% {
2975     opacity: 1;
2976     -webkit-transform: translateY(0px);
2977             transform: translateY(0px); } }
2978
2979 @-webkit-keyframes pulse {
2980   0% {
2981     -webkit-transform: scale(1);
2982             transform: scale(1); }
2983   10% {
2984     -webkit-transform: scale(1.1);
2985             transform: scale(1.1); }
2986   20% {
2987     -webkit-transform: scale(1);
2988             transform: scale(1); } }
2989
2990 @keyframes pulse {
2991   0% {
2992     -webkit-transform: scale(1);
2993             transform: scale(1); }
2994   10% {
2995     -webkit-transform: scale(1.1);
2996             transform: scale(1.1); }
2997   20% {
2998     -webkit-transform: scale(1);
2999             transform: scale(1); } }
3000
3001 .dropzone, .dropzone * {
3002   box-sizing: border-box; }
3003
3004 .dz-preview {
3005   position: relative;
3006   display: inline-block;
3007   vertical-align: top;
3008   margin: 12px;
3009   min-height: 80px; }
3010
3011 .dz-preview:hover {
3012   z-index: 1000; }
3013
3014 .dz-preview:hover .dz-details {
3015   opacity: 1; }
3016
3017 .dz-preview.dz-file-preview .dz-image {
3018   border-radius: 4px;
3019   background: #e9e9e9; }
3020
3021 .dz-preview.dz-file-preview .dz-details {
3022   opacity: 1; }
3023
3024 .dz-preview.dz-image-preview {
3025   background: white; }
3026
3027 .dz-preview.dz-image-preview .dz-details {
3028   transition: opacity 0.2s linear; }
3029
3030 .dz-preview .dz-remove {
3031   font-size: 13px;
3032   text-align: center;
3033   display: block;
3034   cursor: pointer;
3035   border: none;
3036   margin-top: 3px; }
3037
3038 .dz-preview .dz-remove:hover {
3039   text-decoration: underline; }
3040
3041 .dz-preview:hover .dz-details {
3042   opacity: 1; }
3043
3044 .dz-preview .dz-details {
3045   z-index: 20;
3046   position: absolute;
3047   top: 0;
3048   left: 0;
3049   opacity: 0;
3050   font-size: 10px;
3051   min-width: 100%;
3052   max-width: 100%;
3053   padding: 6px 3px;
3054   text-align: center;
3055   color: rgba(0, 0, 0, 0.9);
3056   line-height: 150%; }
3057
3058 .dz-preview .dz-details .dz-size {
3059   margin-bottom: 0.5em;
3060   font-size: 12px; }
3061
3062 .dz-preview .dz-details .dz-filename {
3063   white-space: nowrap; }
3064
3065 .dz-preview .dz-details .dz-filename:hover span {
3066   border: 1px solid rgba(200, 200, 200, 0.8);
3067   background-color: rgba(255, 255, 255, 0.8); }
3068
3069 .dz-preview .dz-details .dz-filename:not(:hover) {
3070   overflow: hidden;
3071   text-overflow: ellipsis; }
3072
3073 .dz-preview .dz-details .dz-filename:not(:hover) span {
3074   border: 1px solid transparent; }
3075
3076 .dz-preview .dz-details .dz-filename span {
3077   background-color: rgba(255, 255, 255, 0.4);
3078   padding: 0 0.4em;
3079   border-radius: 3px; }
3080
3081 .dz-preview:hover .dz-image img {
3082   -webkit-filter: blur(8px);
3083           filter: blur(8px); }
3084
3085 .dz-preview .dz-image {
3086   border-radius: 4px;
3087   overflow: hidden;
3088   width: 80px;
3089   height: 80px;
3090   position: relative;
3091   display: block;
3092   z-index: 10; }
3093
3094 .dz-preview .dz-image img {
3095   display: block; }
3096
3097 .dz-preview.dz-success .dz-success-mark {
3098   -webkit-animation: passing-through 3s cubic-bezier(0.77, 0, 0.175, 1);
3099           animation: passing-through 3s cubic-bezier(0.77, 0, 0.175, 1); }
3100
3101 .dz-preview.dz-error .dz-error-mark {
3102   opacity: 1;
3103   -webkit-animation: slide-in 3s cubic-bezier(0.77, 0, 0.175, 1);
3104           animation: slide-in 3s cubic-bezier(0.77, 0, 0.175, 1); }
3105
3106 .dz-preview .dz-success-mark, .dz-preview .dz-error-mark {
3107   pointer-events: none;
3108   opacity: 0;
3109   z-index: 1001;
3110   position: absolute;
3111   display: block;
3112   top: 50%;
3113   left: 50%;
3114   margin-left: -27px;
3115   margin-top: -35px; }
3116
3117 .dz-preview .dz-success-mark svg, .dz-preview .dz-error-mark svg {
3118   display: block;
3119   width: 54px;
3120   height: 54px; }
3121
3122 .dz-preview.dz-processing .dz-progress {
3123   opacity: 1;
3124   transition: all 0.2s linear; }
3125
3126 .dz-preview.dz-complete .dz-progress {
3127   opacity: 0;
3128   transition: opacity 0.4s ease-in; }
3129
3130 .dz-preview:not(.dz-processing) .dz-progress {
3131   -webkit-animation: pulse 6s ease infinite;
3132           animation: pulse 6s ease infinite; }
3133
3134 .dz-preview .dz-progress {
3135   opacity: 1;
3136   z-index: 1000;
3137   pointer-events: none;
3138   position: absolute;
3139   height: 16px;
3140   left: 50%;
3141   top: 50%;
3142   margin-top: -8px;
3143   width: 80px;
3144   margin-left: -40px;
3145   background: rgba(255, 255, 255, 0.9);
3146   -webkit-transform: scale(1);
3147           transform: scale(1);
3148   border-radius: 8px;
3149   overflow: hidden; }
3150
3151 .dz-preview .dz-progress .dz-upload {
3152   background: #333;
3153   background: linear-gradient(to bottom, #666, #444);
3154   position: absolute;
3155   top: 0;
3156   left: 0;
3157   bottom: 0;
3158   width: 0;
3159   transition: width 300ms ease-in-out; }
3160
3161 .dz-preview.dz-error .dz-error-message {
3162   display: block; }
3163
3164 .dz-preview.dz-error .dz-image:hover ~ .dz-error-message, .dz-preview.dz-error .dz-details:hover ~ .dz-error-message {
3165   opacity: 1;
3166   pointer-events: auto; }
3167
3168 .dz-preview .dz-error-message {
3169   pointer-events: none;
3170   z-index: 1000;
3171   position: absolute;
3172   display: block;
3173   display: none;
3174   opacity: 0;
3175   transition: opacity 0.3s ease;
3176   border-radius: 4px;
3177   font-size: 12px;
3178   line-height: 1.2;
3179   top: 88px;
3180   left: -12px;
3181   width: 160px;
3182   background: #E84F4F;
3183   padding: 6px;
3184   color: white; }
3185
3186 .dz-preview .dz-error-message:after {
3187   content: '';
3188   position: absolute;
3189   top: -6px;
3190   left: 44px;
3191   width: 0;
3192   height: 0;
3193   border-left: 6px solid transparent;
3194   border-right: 6px solid transparent;
3195   border-bottom: 6px solid #E84F4F; }
3196
3197 .tab-container .nav-tabs {
3198   text-align: left;
3199   border-bottom: 1px solid #DDD;
3200   margin-bottom: 16px; }
3201   .tab-container .nav-tabs .tab-item {
3202     padding: 12px;
3203     color: #666; }
3204     .tab-container .nav-tabs .tab-item.selected {
3205       border-bottom-width: 3px; }
3206
3207 .image-picker .none {
3208   display: none; }
3209
3210 #code-editor .CodeMirror {
3211   height: 400px; }
3212
3213 #code-editor .lang-options {
3214   max-width: 400px;
3215   margin-bottom: 12px; }
3216   #code-editor .lang-options a {
3217     margin-right: 6px;
3218     text-decoration: underline; }
3219
3220 @media screen and (max-width: 800px) {
3221   #code-editor .lang-options {
3222     max-width: 100%; }
3223   #code-editor .CodeMirror {
3224     height: 200px; } }
3225
3226 .comment-box {
3227   clear: left;
3228   border: 1px solid #DDD;
3229   margin-bottom: 12px;
3230   border-radius: 3px; }
3231   .comment-box .content {
3232     padding: 12px;
3233     font-size: 0.666em; }
3234     .comment-box .content p, .comment-box .content ul, .comment-box .content ol {
3235       font-size: 15px;
3236       margin: .5em 0; }
3237   .comment-box .reply-row {
3238     padding: 6px 12px; }
3239
3240 .comment-box .header {
3241   padding: 6px 12px;
3242   background-color: #f8f8f8;
3243   border-bottom: 1px solid #DDD; }
3244   .comment-box .header .meta img, .comment-box .header .meta a, .comment-box .header .meta span {
3245     display: inline-block;
3246     vertical-align: top; }
3247   .comment-box .header .meta a, .comment-box .header .meta span {
3248     padding: 3px 0 3px 0;
3249     line-height: 1.6; }
3250   .comment-box .header .meta a {
3251     color: #666; }
3252   .comment-box .header .meta span {
3253     color: #888;
3254     padding-left: 3px; }
3255   .comment-box .header .text-muted {
3256     color: #999; }
3257
3258 #tag-manager .drag-card {
3259   max-width: 500px; }
3260
3261 /**
3262  * Includes the main navigation header and the faded toolbar.
3263  */
3264 header {
3265   display: block;
3266   z-index: 2;
3267   top: 0;
3268   background-color: #0288D1;
3269   color: #fff;
3270   fill: #fff;
3271   border-bottom: 1px solid #DDD; }
3272   header .padded {
3273     padding: 16px; }
3274   header .links {
3275     display: inline-block;
3276     vertical-align: top;
3277     margin-left: 16px; }
3278   header .links a {
3279     display: inline-block;
3280     padding: 16px;
3281     color: #FFF;
3282     fill: #FFF; }
3283   header .dropdown-container {
3284     padding-left: 16px;
3285     padding-right: 0; }
3286   @media screen and (max-width: 992px) {
3287     header .links a {
3288       padding-left: 12px;
3289       padding-right: 12px; }
3290     header .dropdown-container {
3291       padding-left: 12px; } }
3292   header .avatar, header .user-name {
3293     display: inline-block; }
3294   header .avatar {
3295     width: 30px;
3296     height: 30px; }
3297   header .user-name {
3298     vertical-align: top;
3299     padding-top: 16px;
3300     position: relative;
3301     top: -3px;
3302     display: inline-block;
3303     cursor: pointer; }
3304     header .user-name > * {
3305       vertical-align: top; }
3306     header .user-name > span {
3307       padding-left: 6px;
3308       display: inline-block;
3309       padding-top: 3px; }
3310     header .user-name > svg {
3311       padding-top: 4px;
3312       font-size: 18px; }
3313     @media screen and (max-width: 992px) {
3314       header .user-name {
3315         padding-left: 6px; }
3316         header .user-name .name {
3317           display: none; } }
3318   @media screen and (max-width: 768px) {
3319     header {
3320       text-align: center; }
3321       header .float.right {
3322         float: none; }
3323       header .links a {
3324         padding: 12px; }
3325       header .user-name {
3326         padding-top: 12px; } }
3327
3328 .header-search {
3329   display: inline-block; }
3330
3331 header .search-box {
3332   display: inline-block;
3333   margin-top: 10px; }
3334   header .search-box input {
3335     background-color: rgba(0, 0, 0, 0.2);
3336     border: 1px solid rgba(255, 255, 255, 0.3);
3337     color: #EEE;
3338     z-index: 2; }
3339   header .search-box button {
3340     fill: #EEE;
3341     z-index: 1; }
3342     header .search-box button svg {
3343       margin-right: 0; }
3344   header .search-box ::-webkit-input-placeholder {
3345     /* Chrome/Opera/Safari */
3346     color: #DDD; }
3347   header .search-box ::-moz-placeholder {
3348     /* Firefox 19+ */
3349     color: #DDD; }
3350   header .search-box :-ms-input-placeholder {
3351     /* IE 10+ */
3352     color: #DDD; }
3353   header .search-box :-moz-placeholder {
3354     /* Firefox 18- */
3355     color: #DDD; }
3356   @media screen and (max-width: 1200px) {
3357     header .search-box {
3358       max-width: 250px; } }
3359   @media screen and (max-width: 1000px) {
3360     header .search-box {
3361       max-width: 200px; } }
3362
3363 @media screen and (max-width: 600px) {
3364   .header-search {
3365     display: block; } }
3366
3367 .logo {
3368   display: inline-block; }
3369   .logo:hover {
3370     color: #FFF;
3371     text-decoration: none; }
3372
3373 .logo-text {
3374   display: inline-block;
3375   font-size: 1.8em;
3376   color: #fff;
3377   font-weight: 400;
3378   padding: 14px 24px 14px 0;
3379   vertical-align: top;
3380   line-height: 1; }
3381
3382 .logo-image {
3383   margin: 6px 12px 6px 0;
3384   vertical-align: top;
3385   height: 43px; }
3386
3387 .breadcrumbs span.sep {
3388   color: #aaa;
3389   padding: 0 6px; }
3390
3391 .faded a, .faded button, .faded span, .faded span > div {
3392   color: #666;
3393   fill: #666; }
3394
3395 .faded .text-button {
3396   opacity: 0.5;
3397   transition: all ease-in-out 120ms; }
3398   .faded .text-button:hover {
3399     opacity: 1;
3400     text-decoration: none; }
3401
3402 .faded span.faded-text {
3403   display: inline-block;
3404   padding: 12px; }
3405
3406 .faded-small {
3407   color: #000;
3408   fill: #000;
3409   font-size: 0.9em;
3410   background-color: rgba(21, 101, 192, 0.15); }
3411
3412 .toolbar-container {
3413   background-color: #FFF; }
3414
3415 .breadcrumbs .text-button, .action-buttons .text-button {
3416   display: inline-block;
3417   padding: 12px; }
3418   .breadcrumbs .text-button:last-child, .action-buttons .text-button:last-child {
3419     padding-right: 0; }
3420   .breadcrumbs .text-button:first-child, .action-buttons .text-button:first-child {
3421     padding-left: 0; }
3422
3423 .action-buttons .dropdown-container:last-child a {
3424   padding-right: 0;
3425   padding-left: 12px; }
3426
3427 .action-buttons {
3428   text-align: right; }
3429   .action-buttons.text-left {
3430     text-align: left; }
3431     .action-buttons.text-left .text-button {
3432       padding-right: 16px;
3433       padding-left: 0; }
3434   .action-buttons.text-center {
3435     text-align: center; }
3436
3437 @media screen and (max-width: 800px) {
3438   .breadcrumbs .text-button, .action-buttons .text-button {
3439     padding: 6px 6px; }
3440   .action-buttons .dropdown-container:last-child a {
3441     padding-left: 6px; }
3442   .breadcrumbs .text-button {
3443     font-size: 0; }
3444   .breadcrumbs .text-button svg {
3445     font-size: 15px; }
3446   .breadcrumbs a i {
3447     font-size: 15px;
3448     padding-right: 0; }
3449   .breadcrumbs span.sep {
3450     padding: 0 3px; }
3451   .toolbar .col-xs-1:first-child {
3452     padding-right: 0; } }
3453
3454 .nav-tabs {
3455   text-align: center; }
3456   .nav-tabs a, .nav-tabs .tab-item {
3457     padding: 16px;
3458     display: inline-block;
3459     color: #666;
3460     fill: #666;
3461     cursor: pointer; }
3462     .nav-tabs a.selected, .nav-tabs .tab-item.selected {
3463       border-bottom: 2px solid #0288D1; }
3464
3465 .faded-small .nav-tabs a {
3466   padding: 12px 16px; }
3467
3468 .page-list h4 {
3469   margin: 24px 0 6px 0;
3470   font-size: 1.666em; }
3471
3472 .page-list a.chapter {
3473   color: #ef7c3c; }
3474
3475 .page-list .inset-list {
3476   display: none;
3477   overflow: hidden; }
3478
3479 .page-list h5 {
3480   display: block;
3481   margin: 12px 0 0 0;
3482   border-left: 5px solid #0288D1;
3483   padding: 6px 0 6px 16px;
3484   font-size: 1.1em;
3485   font-weight: normal; }
3486   .page-list h5.draft {
3487     border-left-color: #9A60DA; }
3488
3489 .page-list .entity-list-item {
3490   margin-bottom: 16px; }
3491
3492 .page-list hr {
3493   margin-top: 0; }
3494
3495 .page-list .page, .page-list .chapter, .page-list .book {
3496   padding-left: 24px; }
3497
3498 .page-list .page {
3499   border-left: 5px solid #0288D1; }
3500
3501 .page-list .page.draft {
3502   border-left: 5px solid #9A60DA; }
3503   .page-list .page.draft .text-page {
3504     color: #9A60DA;
3505     fill: #9A60DA; }
3506
3507 .page-list .chapter {
3508   border-left: 5px solid #ef7c3c; }
3509
3510 .page-list .book {
3511   border-left: 5px solid #009688; }
3512
3513 .page-list .meta {
3514   margin-top: -16px;
3515   font-size: 0.95em; }
3516
3517 .page-list .meta span {
3518   margin-right: 12px; }
3519
3520 @media screen and (max-width: 600px) {
3521   .page-list h4 {
3522     font-size: 1.333em; } }
3523
3524 .sidebar-page-nav {
3525   list-style: none;
3526   margin: 12px 0 16px 2px;
3527   border-left: 2px dotted #BBB; }
3528   .sidebar-page-nav li {
3529     padding-left: 12px;
3530     margin-bottom: 4px;
3531     font-size: 0.95em; }
3532   .sidebar-page-nav .h1 {
3533     margin-left: -2px; }
3534   .sidebar-page-nav .h2 {
3535     margin-left: -2px; }
3536   .sidebar-page-nav .h3 {
3537     margin-left: 12px; }
3538   .sidebar-page-nav .h4 {
3539     margin-left: 24px; }
3540   .sidebar-page-nav .h5 {
3541     margin-left: 36px; }
3542   .sidebar-page-nav .h6 {
3543     margin-left: 48px; }
3544   .sidebar-page-nav .current-heading {
3545     font-weight: bold; }
3546
3547 .book-tree {
3548   transition: ease-in-out 240ms;
3549   transition-property: right, border; }
3550
3551 .book-tree h4 {
3552   padding: 16px 12px 0 12px; }
3553   .book-tree h4 i {
3554     padding-right: 12px; }
3555
3556 .book-tree .sidebar-page-list {
3557   list-style: none;
3558   margin: 6px 0 0;
3559   padding-left: 0;
3560   border-left: 5px solid #009688; }
3561   .book-tree .sidebar-page-list li a {
3562     display: block;
3563     border-bottom: none;
3564     padding: 6px 0 6px 12px; }
3565     .book-tree .sidebar-page-list li a:hover {
3566       text-decoration: none; }
3567   .book-tree .sidebar-page-list li a i {
3568     padding-right: 8px; }
3569   .book-tree .sidebar-page-list li, .book-tree .sidebar-page-list a {
3570     display: block; }
3571   .book-tree .sidebar-page-list a.bold {
3572     color: #EEE !important;
3573     fill: #EEE !important; }
3574   .book-tree .sidebar-page-list ul {
3575     list-style: none;
3576     margin: 0; }
3577   .book-tree .sidebar-page-list .book {
3578     color: #009688 !important;
3579     fill: #009688 !important; }
3580     .book-tree .sidebar-page-list .book.selected {
3581       background-color: rgba(0, 150, 136, 0.29); }
3582   .book-tree .sidebar-page-list .chapter {
3583     color: #ef7c3c !important;
3584     fill: #ef7c3c !important; }
3585     .book-tree .sidebar-page-list .chapter.selected {
3586       background-color: rgba(239, 124, 60, 0.12); }
3587   .book-tree .sidebar-page-list .page {
3588     color: #0288D1 !important;
3589     fill: #0288D1 !important;
3590     border-bottom: none; }
3591     .book-tree .sidebar-page-list .page.selected {
3592       background-color: rgba(2, 136, 209, 0.1); }
3593   .book-tree .sidebar-page-list [chapter-toggle] {
3594     padding-left: 12px; }
3595   .book-tree .sidebar-page-list .list-item-chapter {
3596     border-left: 5px solid #ef7c3c;
3597     margin: 10px 10px;
3598     display: block; }
3599   .book-tree .sidebar-page-list .list-item-page {
3600     border-bottom: none;
3601     border-left: 5px solid #0288D1;
3602     margin: 10px 10px; }
3603   .book-tree .sidebar-page-list .list-item-page.draft {
3604     border-left: 5px solid #9A60DA; }
3605   .book-tree .sidebar-page-list .page.draft .page, .book-tree .sidebar-page-list .list-item-page.draft a.page {
3606     color: #9A60DA !important;
3607     fill: #9A60DA !important; }
3608   .book-tree .sidebar-page-list .sub-menu {
3609     display: none;
3610     padding-left: 0; }
3611   .book-tree .sidebar-page-list [chapter-toggle].open + .sub-menu {
3612     display: block; }
3613
3614 .sortable-page-list, .sortable-page-list ul {
3615   list-style: none;
3616   background-color: #FFF; }
3617
3618 .sort-box {
3619   margin-bottom: 16px;
3620   padding: 0 24px 0 24px;
3621   border-left: 4px solid #009688; }
3622
3623 .sortable-page-list {
3624   margin-left: 0; }
3625   .sortable-page-list > ul {
3626     margin-left: 0; }
3627   .sortable-page-list ul {
3628     margin-bottom: 0;
3629     margin-top: 0;
3630     box-shadow: 0 0 1px 0 rgba(0, 0, 0, 0.1); }
3631   .sortable-page-list li {
3632     border: 1px solid #DDD;
3633     padding: 6px 12px;
3634     margin-top: -1px;
3635     min-height: 38px; }
3636     .sortable-page-list li.text-chapter {
3637       border-left: 2px solid #ef7c3c; }
3638     .sortable-page-list li.text-page {
3639       border-left: 2px solid #0288D1; }
3640   .sortable-page-list li:first-child {
3641     margin-top: 6px; }
3642
3643 .sortable-page-list li.placeholder {
3644   position: relative; }
3645
3646 .sortable-page-list li.placeholder:before {
3647   position: absolute; }
3648
3649 .activity-list-item {
3650   padding: 12px 0;
3651   color: #888;
3652   fill: #888;
3653   border-bottom: 1px solid #EEE;
3654   font-size: 0.9em; }
3655   .activity-list-item .left {
3656     float: left; }
3657   .activity-list-item .left + .right {
3658     margin-left: 42px; }
3659   .activity-list-item:last-of-type {
3660     border-bottom: 0; }
3661
3662 ul.pagination {
3663   display: inline-block;
3664   list-style: none;
3665   margin: 16px 0;
3666   padding-left: 1px; }
3667   ul.pagination li {
3668     float: left; }
3669   ul.pagination li:first-child a, ul.pagination li:first-child span {
3670     border-radius: 3px 0 0 3px; }
3671   ul.pagination li:last-child a, ul.pagination li:last-child span {
3672     border-radius: 0 3px 3px 0; }
3673   ul.pagination a, ul.pagination span {
3674     display: block;
3675     padding: 3px 12px;
3676     border: 1px solid #CCC;
3677     margin-left: -1px;
3678     -webkit-user-select: none;
3679        -moz-user-select: none;
3680         -ms-user-select: none;
3681             user-select: none; }
3682     ul.pagination a.disabled, ul.pagination span.disabled {
3683       cursor: not-allowed; }
3684   ul.pagination li.active span {
3685     color: #FFF; }
3686
3687 .compact ul.pagination {
3688   margin: 0; }
3689
3690 .entity-list > div {
3691   padding: 16px 0; }
3692
3693 .entity-list h4 {
3694   margin: 0; }
3695
3696 .entity-list hr {
3697   margin: 0; }
3698
3699 .entity-list .text-small.text-muted {
3700   color: #AAA;
3701   font-size: 0.75em;
3702   margin-top: 6px; }
3703
3704 .entity-list .text-muted p.text-muted {
3705   margin-top: 0; }
3706
3707 .entity-list .page.draft .text-page {
3708   color: #9A60DA;
3709   fill: #9A60DA; }
3710
3711 .card .entity-list-item, .card .activity-list-item {
3712   padding-left: 16px;
3713   padding-right: 16px; }
3714
3715 .entity-list.compact {
3716   font-size: 0.6em; }
3717   .entity-list.compact h4, .entity-list.compact a {
3718     line-height: 1.2; }
3719   .entity-list.compact .entity-item-snippet {
3720     display: none; }
3721   .entity-list.compact .entity-list-item p {
3722     font-size: 12px;
3723     padding-top: 6px; }
3724   .entity-list.compact p {
3725     margin: 0; }
3726   .entity-list.compact > p.empty-text {
3727     display: block;
3728     font-size: 15px; }
3729   .entity-list.compact hr {
3730     margin: 0; }
3731
3732 .dropdown-container {
3733   display: inline-block;
3734   vertical-align: top;
3735   position: relative; }
3736
3737 .dropdown-container ul {
3738   display: none;
3739   position: absolute;
3740   z-index: 999;
3741   top: 0;
3742   list-style: none;
3743   right: 0;
3744   margin: 16px 0;
3745   background-color: #FFFFFF;
3746   box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.1);
3747   border-radius: 1px;
3748   border: 1px solid #EEE;
3749   min-width: 180px;
3750   padding: 6px 0;
3751   color: #555;
3752   fill: #555;
3753   text-align: left !important; }
3754   .dropdown-container ul.wide {
3755     min-width: 220px; }
3756   .dropdown-container ul .text-muted {
3757     color: #999;
3758     fill: #999; }
3759   .dropdown-container ul li.padded {
3760     padding: 6px 16px;
3761     line-height: 1.2; }
3762   .dropdown-container ul a, .dropdown-container ul button {
3763     display: block;
3764     padding: 6px 16px;
3765     color: #555;
3766     fill: #555;
3767     white-space: nowrap; }
3768     .dropdown-container ul a:hover, .dropdown-container ul button:hover {
3769       text-decoration: none;
3770       background-color: #EEE; }
3771     .dropdown-container ul a svg, .dropdown-container ul button svg {
3772       margin-right: 12px;
3773       display: inline-block;
3774       width: 16px; }
3775   .dropdown-container ul button {
3776     width: 100%;
3777     text-align: left; }
3778   .dropdown-container ul li.border-bottom {
3779     border-bottom: 1px solid #DDD; }
3780
3781 .featured-image-container {
3782   position: relative;
3783   overflow: hidden;
3784   background: #F2F2F2; }
3785   .featured-image-container a {
3786     display: block; }
3787   .featured-image-container img {
3788     display: block;
3789     width: 100%;
3790     max-width: 100%;
3791     height: auto;
3792     transition: all .5s ease-in-out; }
3793   .featured-image-container img:hover {
3794     -webkit-transform: scale(1.15);
3795             transform: scale(1.15);
3796     opacity: .5; }
3797
3798 .page-editor {
3799   display: flex;
3800   flex-direction: column;
3801   align-items: stretch;
3802   overflow: hidden; }
3803   .page-editor .faded-small {
3804     height: auto; }
3805   .page-editor .edit-area {
3806     flex: 1;
3807     flex-direction: column; }
3808   .page-editor .mce-tinymce {
3809     box-shadow: none; }
3810   .page-editor .mce-top-part::before {
3811     box-shadow: none; }
3812
3813 .draft-notification {
3814   pointer-events: none;
3815   -webkit-transform: scale(0);
3816           transform: scale(0);
3817   transition: -webkit-transform ease-in-out 120ms;
3818   transition: transform ease-in-out 120ms;
3819   transition: transform ease-in-out 120ms, -webkit-transform ease-in-out 120ms;
3820   -webkit-transform-origin: 50% 50%;
3821           transform-origin: 50% 50%; }
3822   .draft-notification.visible {
3823     -webkit-transform: scale(1);
3824             transform: scale(1); }
3825
3826 .page-style.editor {
3827   padding: 0 !important; }
3828
3829 .page-content {
3830   width: 100%;
3831   max-width: 840px;
3832   margin: 0 auto;
3833   margin-top: 48px;
3834   overflow-wrap: break-word; }
3835   .page-content.flex {
3836     margin-top: 16px; }
3837   .page-content .align-left {
3838     text-align: left; }
3839   .page-content img.align-left, .page-content table.align-left {
3840     float: left !important;
3841     margin: 6px 12px 6px 0; }
3842   .page-content .align-right {
3843     text-align: right !important; }
3844   .page-content img.align-right, .page-content table.align-right {
3845     float: right !important;
3846     margin: 6px 0 6px 12px; }
3847   .page-content .align-center {
3848     text-align: center; }
3849   .page-content img.align-center {
3850     display: block; }
3851   .page-content img.align-center, .page-content table.align-center {
3852     margin-left: auto;
3853     margin-right: auto; }
3854   .page-content img {
3855     max-width: 100%;
3856     height: auto; }
3857   .page-content h1, .page-content h2, .page-content h3, .page-content h4, .page-content h5, .page-content h6, .page-content pre {
3858     clear: left; }
3859   .page-content hr {
3860     clear: both;
3861     margin: 16px 0; }
3862   .page-content table {
3863     -webkit-hyphens: auto;
3864         -ms-hyphens: auto;
3865             hyphens: auto;
3866     table-layout: fixed;
3867     max-width: 100%;
3868     height: auto !important; }
3869   .page-content ins,
3870   .page-content del {
3871     text-decoration: none; }
3872   .page-content ins {
3873     background: #dbffdb; }
3874   .page-content del {
3875     background: #FFECEC; }
3876   .page-content.page-revision pre code {
3877     white-space: pre-wrap; }
3878
3879 .pointer-container {
3880   position: relative;
3881   display: none;
3882   left: 0;
3883   z-index: 10; }
3884
3885 .pointer {
3886   border: 1px solid #CCC;
3887   display: inline-block;
3888   padding: 12px 12px;
3889   border-radius: 4px;
3890   box-shadow: 0 0 8px 1px rgba(212, 209, 209, 0.35);
3891   position: absolute;
3892   top: -60px;
3893   background-color: #FFF;
3894   width: 275px;
3895   z-index: 55; }
3896   .pointer.is-page-editable {
3897     width: 328px; }
3898   .pointer:before {
3899     position: absolute;
3900     left: 50%;
3901     bottom: -9px;
3902     width: 16px;
3903     height: 16px;
3904     margin-left: -8px;
3905     content: '';
3906     display: block;
3907     background-color: #FFF;
3908     -webkit-transform: rotate(45deg);
3909             transform: rotate(45deg);
3910     -webkit-transform-origin: 50% 50%;
3911             transform-origin: 50% 50%;
3912     border-bottom: 1px solid #CCC;
3913     border-right: 1px solid #CCC;
3914     z-index: 56; }
3915   .pointer input {
3916     background-color: #FFF;
3917     border: 1px solid #DDD;
3918     color: #666;
3919     width: 172px;
3920     z-index: 40; }
3921   .pointer input, .pointer button, .pointer a {
3922     position: relative;
3923     border-radius: 0;
3924     height: 28px;
3925     font-size: 12px;
3926     vertical-align: top;
3927     padding: 5px 16px; }
3928   .pointer > i {
3929     color: #888;
3930     font-size: 18px;
3931     padding-top: 4px; }
3932   .pointer span.icon {
3933     cursor: pointer;
3934     -webkit-user-select: none;
3935        -moz-user-select: none;
3936         -ms-user-select: none;
3937             user-select: none; }
3938   .pointer .input-group .button {
3939     line-height: 1;
3940     margin: 0 0 0 -4px;
3941     box-shadow: none; }
3942   .pointer a.button {
3943     margin: 0 0 0 0; }
3944     .pointer a.button:hover {
3945       fill: #fff; }
3946   .pointer .svg-icon {
3947     width: 1.2em;
3948     height: 1.2em; }
3949
3950 .floating-toolbox {
3951   background-color: #FFF;
3952   border: 1px solid #DDD;
3953   right: 64px;
3954   width: 48px;
3955   overflow: hidden;
3956   align-items: stretch;
3957   flex-direction: row;
3958   display: flex;
3959   transition: width ease-in-out 180ms;
3960   margin-top: -1px;
3961   min-height: 0; }
3962   .floating-toolbox.open {
3963     width: 480px; }
3964   .floating-toolbox [toolbox-toggle] svg {
3965     transition: -webkit-transform ease-in-out 180ms;
3966     transition: transform ease-in-out 180ms;
3967     transition: transform ease-in-out 180ms, -webkit-transform ease-in-out 180ms; }
3968   .floating-toolbox [toolbox-toggle] {
3969     transition: background-color ease-in-out 180ms; }
3970   .floating-toolbox.open [toolbox-toggle] {
3971     background-color: rgba(255, 0, 0, 0.29); }
3972   .floating-toolbox.open [toolbox-toggle] svg {
3973     -webkit-transform: rotate(180deg);
3974             transform: rotate(180deg); }
3975   .floating-toolbox > div {
3976     flex: 1;
3977     position: relative; }
3978   .floating-toolbox .tabs {
3979     display: block;
3980     border-right: 1px solid #DDD;
3981     width: 48px;
3982     flex: 0 1 auto; }
3983   .floating-toolbox .tabs svg {
3984     fill: rgba(0, 0, 0, 0.5);
3985     padding: 0;
3986     margin: 0; }
3987   .floating-toolbox .tabs > span {
3988     display: block;
3989     cursor: pointer;
3990     padding: 12px 16px;
3991     font-size: 13.5px;
3992     line-height: 1.6;
3993     border-bottom: 1px solid rgba(255, 255, 255, 0.3); }
3994   .floating-toolbox.open .tabs > span.active {
3995     fill: #444;
3996     background-color: rgba(0, 0, 0, 0.1); }
3997   .floating-toolbox div[toolbox-tab-content] {
3998     padding-bottom: 45px;
3999     display: flex;
4000     flex: 1;
4001     flex-direction: column;
4002     min-height: 0px;
4003     overflow-y: scroll; }
4004   .floating-toolbox div[toolbox-tab-content] .padded {
4005     flex: 1;
4006     padding-top: 0; }
4007   .floating-toolbox div[toolbox-tab-content] .padded.files {
4008     overflow-x: hidden; }
4009   .floating-toolbox h4 {
4010     font-size: 24px;
4011     margin: 16px 0 0 0;
4012     padding: 0 24px 12px 24px; }
4013   .floating-toolbox .tags input {
4014     max-width: 100%;
4015     width: 100%;
4016     min-width: 50px; }
4017   .floating-toolbox .tags td, .floating-toolbox .tag-table > div > div > div {
4018     padding-right: 12px;
4019     padding-top: 12px;
4020     position: relative; }
4021   .floating-toolbox .handle {
4022     -webkit-user-select: none;
4023        -moz-user-select: none;
4024         -ms-user-select: none;
4025             user-select: none;
4026     cursor: move;
4027     fill: #999; }
4028   .floating-toolbox form {
4029     display: flex;
4030     flex: 1;
4031     flex-direction: column;
4032     overflow-y: scroll; }
4033   .floating-toolbox table td, .floating-toolbox table th {
4034     overflow: visible; }
4035
4036 [toolbox-tab-content] {
4037   display: none; }
4038
4039 .tag-display {
4040   position: relative; }
4041   .tag-display table {
4042     width: 100%;
4043     margin: 0;
4044     padding: 0; }
4045   .tag-display tr:first-child td {
4046     padding-top: 0; }
4047   .tag-display .heading th {
4048     padding: 6px 12px;
4049     color: rgba(100, 100, 100, 0.7);
4050     border: 0;
4051     font-weight: 400; }
4052   .tag-display td {
4053     border: 0;
4054     border-bottom: 1px solid #EEE;
4055     padding: 6px 12px;
4056     color: #444; }
4057   .tag-display tr td:first-child {
4058     padding-left: 0; }
4059   .tag-display .tag-value {
4060     color: #888; }
4061   .tag-display tr:last-child td {
4062     border-bottom: none; }
4063   .tag-display .tag {
4064     padding: 12px; }
4065
4066 .suggestion-box {
4067   position: absolute;
4068   background-color: #FFF;
4069   border: 1px solid #BBB;
4070   box-shadow: 0 0 4px 1px #CCC;
4071   list-style: none;
4072   z-index: 100;
4073   padding: 0;
4074   margin: 0;
4075   border-radius: 3px; }
4076   .suggestion-box li {
4077     display: block;
4078     padding: 6px 12px;
4079     border-bottom: 1px solid #DDD; }
4080     .suggestion-box li:last-child {
4081       border-bottom: 0; }
4082     .suggestion-box li.active {
4083       background-color: #EEE; }
4084
4085 .comments-container {
4086   width: 100%;
4087   border-top: 1px solid #DDD;
4088   margin-top: 32px;
4089   margin-bottom: 16px; }
4090   .comments-container h5 {
4091     color: #888;
4092     font-weight: normal;
4093     margin-top: 0.5em; }
4094
4095 .comment-editor .CodeMirror, .comment-editor .CodeMirror-scroll {
4096   min-height: 175px; }
4097
4098 /* FIXME - Ugly hack to modify the media plugin for TinyMCE */
4099 .mce-floatpanel[aria-label="Insert/edit media"] .mce-open {
4100   display: none; }
4101
4102 [v-cloak] {
4103   display: none;
4104   opacity: 0;
4105   -webkit-animation-name: none !important;
4106           animation-name: none !important; }
4107
4108 .dragged {
4109   position: absolute;
4110   opacity: 0.5;
4111   z-index: 2000; }
4112
4113 body.dragging, body.dragging * {
4114   cursor: move !important; }
4115
4116 .avatar {
4117   border-radius: 100%;
4118   background-color: #EEE;
4119   width: 30px;
4120   height: 30px; }
4121   .avatar.med {
4122     width: 40px;
4123     height: 40px; }
4124   .avatar.large {
4125     width: 80px;
4126     height: 80px; }
4127   .avatar.huge {
4128     width: 120px;
4129     height: 120px; }
4130   .avatar.square {
4131     border-radius: 3px; }
4132
4133 .loading-container {
4134   position: relative;
4135   display: block;
4136   margin: 32px auto; }
4137   .loading-container > div {
4138     width: 10px;
4139     height: 10px;
4140     border-radius: 10px;
4141     display: inline-block;
4142     vertical-align: top;
4143     -webkit-transform: translate3d(-10px, 0, 0);
4144             transform: translate3d(-10px, 0, 0);
4145     margin-top: 6px;
4146     -webkit-animation-name: loadingBob;
4147             animation-name: loadingBob;
4148     -webkit-animation-duration: 1.4s;
4149             animation-duration: 1.4s;
4150     -webkit-animation-iteration-count: infinite;
4151             animation-iteration-count: infinite;
4152     -webkit-animation-timing-function: cubic-bezier(0.62, 0.28, 0.23, 0.99);
4153             animation-timing-function: cubic-bezier(0.62, 0.28, 0.23, 0.99);
4154     margin-right: 4px;
4155     background-color: #0288D1;
4156     -webkit-animation-delay: 0.3s;
4157             animation-delay: 0.3s; }
4158   .loading-container > div:first-child {
4159     left: -16px;
4160     background-color: #009688;
4161     -webkit-animation-delay: 0s;
4162             animation-delay: 0s; }
4163   .loading-container > div:last-of-type {
4164     left: 16px;
4165     background-color: #ef7c3c;
4166     -webkit-animation-delay: 0.6s;
4167             animation-delay: 0.6s; }
4168   .loading-container > span {
4169     margin-left: 12px;
4170     font-style: italic;
4171     color: #888;
4172     vertical-align: top; }
4173
4174 .search-results > h3 a {
4175   font-size: 0.66em;
4176   color: #0288D1;
4177   padding-left: 16px; }
4178   .search-results > h3 a i {
4179     padding-right: 12px; }
4180
4181 [back-to-top] {
4182   background-color: #0288D1;
4183   position: fixed;
4184   bottom: 16px;
4185   right: 24px;
4186   padding: 5px 7px;
4187   cursor: pointer;
4188   color: #FFF;
4189   fill: #FFF;
4190   width: 40px;
4191   height: 40px;
4192   border-radius: 40px;
4193   transition: all ease-in-out 180ms;
4194   opacity: 0;
4195   z-index: 999;
4196   overflow: hidden; }
4197   [back-to-top] svg {
4198     width: 26.66667px;
4199     height: 26.66667px;
4200     margin-right: 4px; }
4201   [back-to-top]:hover {
4202     width: 136px;
4203     opacity: 1 !important; }
4204   [back-to-top] .inner {
4205     width: 136px; }
4206   [back-to-top] span {
4207     position: relative;
4208     vertical-align: top;
4209     line-height: 2; }
4210
4211 .contained-search-box {
4212   display: flex; }
4213   .contained-search-box input, .contained-search-box button {
4214     border-radius: 0;
4215     border: 1px solid #DDD;
4216     margin-left: -1px; }
4217   .contained-search-box input {
4218     flex: 5;
4219     padding: 6px 12px; }
4220     .contained-search-box input:focus, .contained-search-box input:active {
4221       outline: 0; }
4222   .contained-search-box button {
4223     width: 60px; }
4224   .contained-search-box button i {
4225     padding: 0; }
4226   .contained-search-box button.cancel.active {
4227     background-color: #E84F4F;
4228     color: #EEE; }
4229
4230 .entity-selector {
4231   border: 1px solid #DDD;
4232   border-radius: 3px;
4233   overflow: hidden;
4234   font-size: 0.8em; }
4235   .entity-selector input[type="text"] {
4236     width: 100%;
4237     display: block;
4238     border-radius: 0;
4239     border: 0;
4240     border-bottom: 1px solid #DDD;
4241     font-size: 16px;
4242     padding: 12px 16px; }
4243   .entity-selector .entity-list {
4244     overflow-y: scroll;
4245     height: 400px;
4246     background-color: #EEEEEE; }
4247   .entity-selector .loading {
4248     height: 400px;
4249     padding-top: 24px; }
4250   .entity-selector .entity-list > p {
4251     text-align: center;
4252     padding-top: 24px;
4253     font-size: 1.333em; }
4254   .entity-selector .entity-list > div {
4255     padding-left: 16px;
4256     padding-right: 16px;
4257     background-color: #FFF;
4258     transition: all ease-in-out 120ms;
4259     cursor: pointer; }
4260   .entity-selector.compact {
4261     font-size: 10px; }
4262     .entity-selector.compact .entity-item-snippet {
4263       display: none; }
4264
4265 .entity-list-item.selected h3, .entity-list-item.selected i, .entity-list-item.selected p, .entity-list-item.selected a, .entity-list-item.selected span {
4266   color: #EEE; }
4267
4268 .scroll-box {
4269   max-height: 250px;
4270   overflow-y: scroll;
4271   border: 1px solid #DDD;
4272   border-radius: 3px; }
4273   .scroll-box .scroll-box-item {
4274     padding: 6px 16px;
4275     border-bottom: 1px solid #DDD; }
4276     .scroll-box .scroll-box-item:last-child {
4277       border-bottom: 0; }
4278
4279 .center-box {
4280   margin: 48px auto 0 auto;
4281   width: 420px;
4282   max-width: 100%;
4283   display: inline-block;
4284   text-align: left;
4285   vertical-align: top; }
4286   .center-box input {
4287     width: 100%; }
4288
4289 .fullscreen {
4290   border: 0;
4291   position: fixed;
4292   top: 0;
4293   left: 0;
4294   right: 0;
4295   bottom: 0;
4296   width: 100%;
4297   height: 100%;
4298   z-index: 150; }