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   margin-left: 1px;
2880   overflow-y: auto;
2881   overflow-x: hidden;
2882   border-left: 1px solid #DDD; }
2883   .image-manager-sidebar .inner {
2884     padding: 16px; }
2885   .image-manager-sidebar img {
2886     max-width: 100%;
2887     max-height: 180px;
2888     display: block;
2889     margin: 0 auto 16px auto;
2890     box-shadow: 0 1px 21px 1px rgba(76, 76, 76, 0.3); }
2891   .image-manager-sidebar .image-manager-viewer {
2892     height: 196px;
2893     display: flex;
2894     align-items: center;
2895     justify-content: center; }
2896     .image-manager-sidebar .image-manager-viewer a {
2897       display: inline-block; }
2898   .image-manager-sidebar .dropzone-container {
2899     border-bottom: 1px solid #DDD; }
2900
2901 .image-manager-list {
2902   overflow-y: scroll;
2903   flex: 1; }
2904
2905 .image-manager-content {
2906   display: flex;
2907   flex-direction: column;
2908   flex: 1; }
2909   .image-manager-content .container {
2910     width: 100%; }
2911   .image-manager-content .full-tab {
2912     text-align: center; }
2913
2914 /*
2915  * The MIT License
2916  * Copyright (c) 2012 Matias Meno <[email protected]>
2917  */
2918 .dz-message {
2919   font-size: 1em;
2920   line-height: 2.35;
2921   font-style: italic;
2922   color: #888;
2923   text-align: center;
2924   cursor: pointer;
2925   padding: 24px 16px;
2926   transition: all ease-in-out 120ms; }
2927
2928 .dz-drag-hover .dz-message {
2929   background-color: #107ed2;
2930   color: #EEE; }
2931
2932 @-webkit-keyframes passing-through {
2933   0% {
2934     opacity: 0;
2935     -webkit-transform: translateY(40px);
2936             transform: translateY(40px); }
2937   30%, 70% {
2938     opacity: 1;
2939     -webkit-transform: translateY(0px);
2940             transform: translateY(0px); }
2941   100% {
2942     opacity: 0;
2943     -webkit-transform: translateY(-40px);
2944             transform: translateY(-40px); } }
2945
2946 @keyframes passing-through {
2947   0% {
2948     opacity: 0;
2949     -webkit-transform: translateY(40px);
2950             transform: translateY(40px); }
2951   30%, 70% {
2952     opacity: 1;
2953     -webkit-transform: translateY(0px);
2954             transform: translateY(0px); }
2955   100% {
2956     opacity: 0;
2957     -webkit-transform: translateY(-40px);
2958             transform: translateY(-40px); } }
2959
2960 @-webkit-keyframes slide-in {
2961   0% {
2962     opacity: 0;
2963     -webkit-transform: translateY(40px);
2964             transform: translateY(40px); }
2965   30% {
2966     opacity: 1;
2967     -webkit-transform: translateY(0px);
2968             transform: translateY(0px); } }
2969
2970 @keyframes slide-in {
2971   0% {
2972     opacity: 0;
2973     -webkit-transform: translateY(40px);
2974             transform: translateY(40px); }
2975   30% {
2976     opacity: 1;
2977     -webkit-transform: translateY(0px);
2978             transform: translateY(0px); } }
2979
2980 @-webkit-keyframes pulse {
2981   0% {
2982     -webkit-transform: scale(1);
2983             transform: scale(1); }
2984   10% {
2985     -webkit-transform: scale(1.1);
2986             transform: scale(1.1); }
2987   20% {
2988     -webkit-transform: scale(1);
2989             transform: scale(1); } }
2990
2991 @keyframes pulse {
2992   0% {
2993     -webkit-transform: scale(1);
2994             transform: scale(1); }
2995   10% {
2996     -webkit-transform: scale(1.1);
2997             transform: scale(1.1); }
2998   20% {
2999     -webkit-transform: scale(1);
3000             transform: scale(1); } }
3001
3002 .dropzone, .dropzone * {
3003   box-sizing: border-box; }
3004
3005 .dz-preview {
3006   position: relative;
3007   display: inline-block;
3008   vertical-align: top;
3009   margin: 12px;
3010   min-height: 80px; }
3011
3012 .dz-preview:hover {
3013   z-index: 1000; }
3014
3015 .dz-preview:hover .dz-details {
3016   opacity: 1; }
3017
3018 .dz-preview.dz-file-preview .dz-image {
3019   border-radius: 4px;
3020   background: #e9e9e9; }
3021
3022 .dz-preview.dz-file-preview .dz-details {
3023   opacity: 1; }
3024
3025 .dz-preview.dz-image-preview {
3026   background: white; }
3027
3028 .dz-preview.dz-image-preview .dz-details {
3029   transition: opacity 0.2s linear; }
3030
3031 .dz-preview .dz-remove {
3032   font-size: 13px;
3033   text-align: center;
3034   display: block;
3035   cursor: pointer;
3036   border: none;
3037   margin-top: 3px; }
3038
3039 .dz-preview .dz-remove:hover {
3040   text-decoration: underline; }
3041
3042 .dz-preview:hover .dz-details {
3043   opacity: 1; }
3044
3045 .dz-preview .dz-details {
3046   z-index: 20;
3047   position: absolute;
3048   top: 0;
3049   left: 0;
3050   opacity: 0;
3051   font-size: 10px;
3052   min-width: 100%;
3053   max-width: 100%;
3054   padding: 6px 3px;
3055   text-align: center;
3056   color: rgba(0, 0, 0, 0.9);
3057   line-height: 150%; }
3058
3059 .dz-preview .dz-details .dz-size {
3060   margin-bottom: 0.5em;
3061   font-size: 12px; }
3062
3063 .dz-preview .dz-details .dz-filename {
3064   white-space: nowrap; }
3065
3066 .dz-preview .dz-details .dz-filename:hover span {
3067   border: 1px solid rgba(200, 200, 200, 0.8);
3068   background-color: rgba(255, 255, 255, 0.8); }
3069
3070 .dz-preview .dz-details .dz-filename:not(:hover) {
3071   overflow: hidden;
3072   text-overflow: ellipsis; }
3073
3074 .dz-preview .dz-details .dz-filename:not(:hover) span {
3075   border: 1px solid transparent; }
3076
3077 .dz-preview .dz-details .dz-filename span {
3078   background-color: rgba(255, 255, 255, 0.4);
3079   padding: 0 0.4em;
3080   border-radius: 3px; }
3081
3082 .dz-preview:hover .dz-image img {
3083   -webkit-filter: blur(8px);
3084           filter: blur(8px); }
3085
3086 .dz-preview .dz-image {
3087   border-radius: 4px;
3088   overflow: hidden;
3089   width: 80px;
3090   height: 80px;
3091   position: relative;
3092   display: block;
3093   z-index: 10; }
3094
3095 .dz-preview .dz-image img {
3096   display: block; }
3097
3098 .dz-preview.dz-success .dz-success-mark {
3099   -webkit-animation: passing-through 3s cubic-bezier(0.77, 0, 0.175, 1);
3100           animation: passing-through 3s cubic-bezier(0.77, 0, 0.175, 1); }
3101
3102 .dz-preview.dz-error .dz-error-mark {
3103   opacity: 1;
3104   -webkit-animation: slide-in 3s cubic-bezier(0.77, 0, 0.175, 1);
3105           animation: slide-in 3s cubic-bezier(0.77, 0, 0.175, 1); }
3106
3107 .dz-preview .dz-success-mark, .dz-preview .dz-error-mark {
3108   pointer-events: none;
3109   opacity: 0;
3110   z-index: 1001;
3111   position: absolute;
3112   display: block;
3113   top: 50%;
3114   left: 50%;
3115   margin-left: -27px;
3116   margin-top: -35px; }
3117
3118 .dz-preview .dz-success-mark svg, .dz-preview .dz-error-mark svg {
3119   display: block;
3120   width: 54px;
3121   height: 54px; }
3122
3123 .dz-preview.dz-processing .dz-progress {
3124   opacity: 1;
3125   transition: all 0.2s linear; }
3126
3127 .dz-preview.dz-complete .dz-progress {
3128   opacity: 0;
3129   transition: opacity 0.4s ease-in; }
3130
3131 .dz-preview:not(.dz-processing) .dz-progress {
3132   -webkit-animation: pulse 6s ease infinite;
3133           animation: pulse 6s ease infinite; }
3134
3135 .dz-preview .dz-progress {
3136   opacity: 1;
3137   z-index: 1000;
3138   pointer-events: none;
3139   position: absolute;
3140   height: 16px;
3141   left: 50%;
3142   top: 50%;
3143   margin-top: -8px;
3144   width: 80px;
3145   margin-left: -40px;
3146   background: rgba(255, 255, 255, 0.9);
3147   -webkit-transform: scale(1);
3148           transform: scale(1);
3149   border-radius: 8px;
3150   overflow: hidden; }
3151
3152 .dz-preview .dz-progress .dz-upload {
3153   background: #333;
3154   background: linear-gradient(to bottom, #666, #444);
3155   position: absolute;
3156   top: 0;
3157   left: 0;
3158   bottom: 0;
3159   width: 0;
3160   transition: width 300ms ease-in-out; }
3161
3162 .dz-preview.dz-error .dz-error-message {
3163   display: block; }
3164
3165 .dz-preview.dz-error .dz-image:hover ~ .dz-error-message, .dz-preview.dz-error .dz-details:hover ~ .dz-error-message {
3166   opacity: 1;
3167   pointer-events: auto; }
3168
3169 .dz-preview .dz-error-message {
3170   pointer-events: none;
3171   z-index: 1000;
3172   position: absolute;
3173   display: block;
3174   display: none;
3175   opacity: 0;
3176   transition: opacity 0.3s ease;
3177   border-radius: 4px;
3178   font-size: 12px;
3179   line-height: 1.2;
3180   top: 88px;
3181   left: -26px;
3182   width: 148px;
3183   background: #E84F4F;
3184   padding: 6px;
3185   color: white; }
3186
3187 .dz-preview .dz-error-message:after {
3188   content: '';
3189   position: absolute;
3190   top: -6px;
3191   left: 64px;
3192   width: 0;
3193   height: 0;
3194   border-left: 6px solid transparent;
3195   border-right: 6px solid transparent;
3196   border-bottom: 6px solid #E84F4F; }
3197
3198 .tab-container .nav-tabs {
3199   text-align: left;
3200   border-bottom: 1px solid #DDD;
3201   margin-bottom: 16px; }
3202   .tab-container .nav-tabs .tab-item {
3203     padding: 12px;
3204     color: #666; }
3205     .tab-container .nav-tabs .tab-item.selected {
3206       border-bottom-width: 3px; }
3207
3208 .image-picker .none {
3209   display: none; }
3210
3211 #code-editor .CodeMirror {
3212   height: 400px; }
3213
3214 #code-editor .lang-options {
3215   max-width: 400px;
3216   margin-bottom: 12px; }
3217   #code-editor .lang-options a {
3218     margin-right: 6px;
3219     text-decoration: underline; }
3220
3221 @media screen and (max-width: 800px) {
3222   #code-editor .lang-options {
3223     max-width: 100%; }
3224   #code-editor .CodeMirror {
3225     height: 200px; } }
3226
3227 .comment-box {
3228   clear: left;
3229   border: 1px solid #DDD;
3230   margin-bottom: 12px;
3231   border-radius: 3px; }
3232   .comment-box .content {
3233     padding: 12px;
3234     font-size: 0.666em; }
3235     .comment-box .content p, .comment-box .content ul, .comment-box .content ol {
3236       font-size: 15px;
3237       margin: .5em 0; }
3238   .comment-box .reply-row {
3239     padding: 6px 12px; }
3240
3241 .comment-box .header {
3242   padding: 6px 12px;
3243   background-color: #f8f8f8;
3244   border-bottom: 1px solid #DDD; }
3245   .comment-box .header .meta img, .comment-box .header .meta a, .comment-box .header .meta span {
3246     display: inline-block;
3247     vertical-align: top; }
3248   .comment-box .header .meta a, .comment-box .header .meta span {
3249     padding: 3px 0 3px 0;
3250     line-height: 1.6; }
3251   .comment-box .header .meta a {
3252     color: #666; }
3253   .comment-box .header .meta span {
3254     color: #888;
3255     padding-left: 3px; }
3256   .comment-box .header .text-muted {
3257     color: #999; }
3258
3259 #tag-manager .drag-card {
3260   max-width: 500px; }
3261
3262 /**
3263  * Includes the main navigation header and the faded toolbar.
3264  */
3265 header {
3266   display: block;
3267   z-index: 2;
3268   top: 0;
3269   background-color: #0288D1;
3270   color: #fff;
3271   fill: #fff;
3272   border-bottom: 1px solid #DDD; }
3273   header .padded {
3274     padding: 16px; }
3275   header .links {
3276     display: inline-block;
3277     vertical-align: top;
3278     margin-left: 16px; }
3279   header .links a {
3280     display: inline-block;
3281     padding: 16px;
3282     color: #FFF;
3283     fill: #FFF; }
3284   header .dropdown-container {
3285     padding-left: 16px;
3286     padding-right: 0; }
3287   @media screen and (max-width: 992px) {
3288     header .links a {
3289       padding-left: 12px;
3290       padding-right: 12px; }
3291     header .dropdown-container {
3292       padding-left: 12px; } }
3293   header .avatar, header .user-name {
3294     display: inline-block; }
3295   header .avatar {
3296     width: 30px;
3297     height: 30px; }
3298   header .user-name {
3299     vertical-align: top;
3300     padding-top: 16px;
3301     position: relative;
3302     top: -3px;
3303     display: inline-block;
3304     cursor: pointer; }
3305     header .user-name > * {
3306       vertical-align: top; }
3307     header .user-name > span {
3308       padding-left: 6px;
3309       display: inline-block;
3310       padding-top: 3px; }
3311     header .user-name > svg {
3312       padding-top: 4px;
3313       font-size: 18px; }
3314     @media screen and (max-width: 992px) {
3315       header .user-name {
3316         padding-left: 6px; }
3317         header .user-name .name {
3318           display: none; } }
3319   @media screen and (max-width: 768px) {
3320     header {
3321       text-align: center; }
3322       header .float.right {
3323         float: none; }
3324       header .links a {
3325         padding: 12px; }
3326       header .user-name {
3327         padding-top: 12px; } }
3328
3329 .header-search {
3330   display: inline-block; }
3331
3332 header .search-box {
3333   display: inline-block;
3334   margin-top: 10px; }
3335   header .search-box input {
3336     background-color: rgba(0, 0, 0, 0.2);
3337     border: 1px solid rgba(255, 255, 255, 0.3);
3338     color: #EEE;
3339     z-index: 2; }
3340   header .search-box button {
3341     fill: #EEE;
3342     z-index: 1; }
3343     header .search-box button svg {
3344       margin-right: 0; }
3345   header .search-box ::-webkit-input-placeholder {
3346     /* Chrome/Opera/Safari */
3347     color: #DDD; }
3348   header .search-box ::-moz-placeholder {
3349     /* Firefox 19+ */
3350     color: #DDD; }
3351   header .search-box :-ms-input-placeholder {
3352     /* IE 10+ */
3353     color: #DDD; }
3354   header .search-box :-moz-placeholder {
3355     /* Firefox 18- */
3356     color: #DDD; }
3357   @media screen and (max-width: 1200px) {
3358     header .search-box {
3359       max-width: 250px; } }
3360   @media screen and (max-width: 1000px) {
3361     header .search-box {
3362       max-width: 200px; } }
3363
3364 @media screen and (max-width: 600px) {
3365   .header-search {
3366     display: block; } }
3367
3368 .logo {
3369   display: inline-block; }
3370   .logo:hover {
3371     color: #FFF;
3372     text-decoration: none; }
3373
3374 .logo-text {
3375   display: inline-block;
3376   font-size: 1.8em;
3377   color: #fff;
3378   font-weight: 400;
3379   padding: 14px 24px 14px 0;
3380   vertical-align: top;
3381   line-height: 1; }
3382
3383 .logo-image {
3384   margin: 6px 12px 6px 0;
3385   vertical-align: top;
3386   height: 43px; }
3387
3388 .breadcrumbs span.sep {
3389   color: #aaa;
3390   padding: 0 6px; }
3391
3392 .faded a, .faded button, .faded span, .faded span > div {
3393   color: #666;
3394   fill: #666; }
3395
3396 .faded .text-button {
3397   opacity: 0.5;
3398   transition: all ease-in-out 120ms; }
3399   .faded .text-button:hover {
3400     opacity: 1;
3401     text-decoration: none; }
3402
3403 .faded span.faded-text {
3404   display: inline-block;
3405   padding: 12px; }
3406
3407 .faded-small {
3408   color: #000;
3409   fill: #000;
3410   font-size: 0.9em;
3411   background-color: rgba(21, 101, 192, 0.15); }
3412
3413 .toolbar-container {
3414   background-color: #FFF; }
3415
3416 .breadcrumbs .text-button, .action-buttons .text-button {
3417   display: inline-block;
3418   padding: 12px; }
3419   .breadcrumbs .text-button:last-child, .action-buttons .text-button:last-child {
3420     padding-right: 0; }
3421   .breadcrumbs .text-button:first-child, .action-buttons .text-button:first-child {
3422     padding-left: 0; }
3423
3424 .action-buttons .dropdown-container:last-child a {
3425   padding-right: 0;
3426   padding-left: 12px; }
3427
3428 .action-buttons {
3429   text-align: right; }
3430   .action-buttons.text-left {
3431     text-align: left; }
3432     .action-buttons.text-left .text-button {
3433       padding-right: 16px;
3434       padding-left: 0; }
3435   .action-buttons.text-center {
3436     text-align: center; }
3437
3438 @media screen and (max-width: 800px) {
3439   .breadcrumbs .text-button, .action-buttons .text-button {
3440     padding: 6px 6px; }
3441   .action-buttons .dropdown-container:last-child a {
3442     padding-left: 6px; }
3443   .breadcrumbs .text-button {
3444     font-size: 0; }
3445   .breadcrumbs .text-button svg {
3446     font-size: 15px; }
3447   .breadcrumbs a i {
3448     font-size: 15px;
3449     padding-right: 0; }
3450   .breadcrumbs span.sep {
3451     padding: 0 3px; }
3452   .toolbar .col-xs-1:first-child {
3453     padding-right: 0; } }
3454
3455 .nav-tabs {
3456   text-align: center; }
3457   .nav-tabs a, .nav-tabs .tab-item {
3458     padding: 16px;
3459     display: inline-block;
3460     color: #666;
3461     fill: #666;
3462     cursor: pointer; }
3463     .nav-tabs a.selected, .nav-tabs .tab-item.selected {
3464       border-bottom: 2px solid #0288D1; }
3465
3466 .faded-small .nav-tabs a {
3467   padding: 12px 16px; }
3468
3469 .page-list h4 {
3470   margin: 24px 0 6px 0;
3471   font-size: 1.666em; }
3472
3473 .page-list a.chapter {
3474   color: #ef7c3c; }
3475
3476 .page-list .inset-list {
3477   display: none;
3478   overflow: hidden; }
3479
3480 .page-list h5 {
3481   display: block;
3482   margin: 12px 0 0 0;
3483   border-left: 5px solid #0288D1;
3484   padding: 6px 0 6px 16px;
3485   font-size: 1.1em;
3486   font-weight: normal; }
3487   .page-list h5.draft {
3488     border-left-color: #9A60DA; }
3489
3490 .page-list .entity-list-item {
3491   margin-bottom: 16px; }
3492
3493 .page-list hr {
3494   margin-top: 0; }
3495
3496 .page-list .page, .page-list .chapter, .page-list .book {
3497   padding-left: 24px; }
3498
3499 .page-list .page {
3500   border-left: 5px solid #0288D1; }
3501
3502 .page-list .page.draft {
3503   border-left: 5px solid #9A60DA; }
3504   .page-list .page.draft .text-page {
3505     color: #9A60DA;
3506     fill: #9A60DA; }
3507
3508 .page-list .chapter {
3509   border-left: 5px solid #ef7c3c; }
3510
3511 .page-list .book {
3512   border-left: 5px solid #009688; }
3513
3514 .page-list .meta {
3515   margin-top: -16px;
3516   font-size: 0.95em; }
3517
3518 .page-list .meta span {
3519   margin-right: 12px; }
3520
3521 @media screen and (max-width: 600px) {
3522   .page-list h4 {
3523     font-size: 1.333em; } }
3524
3525 .sidebar-page-nav {
3526   list-style: none;
3527   margin: 12px 0 16px 2px;
3528   border-left: 2px dotted #BBB; }
3529   .sidebar-page-nav li {
3530     padding-left: 12px;
3531     margin-bottom: 4px;
3532     font-size: 0.95em; }
3533   .sidebar-page-nav .h1 {
3534     margin-left: -2px; }
3535   .sidebar-page-nav .h2 {
3536     margin-left: -2px; }
3537   .sidebar-page-nav .h3 {
3538     margin-left: 12px; }
3539   .sidebar-page-nav .h4 {
3540     margin-left: 24px; }
3541   .sidebar-page-nav .h5 {
3542     margin-left: 36px; }
3543   .sidebar-page-nav .h6 {
3544     margin-left: 48px; }
3545   .sidebar-page-nav .current-heading {
3546     font-weight: bold; }
3547
3548 .book-tree {
3549   transition: ease-in-out 240ms;
3550   transition-property: right, border; }
3551
3552 .book-tree h4 {
3553   padding: 16px 12px 0 12px; }
3554   .book-tree h4 i {
3555     padding-right: 12px; }
3556
3557 .book-tree .sidebar-page-list {
3558   list-style: none;
3559   margin: 6px 0 0;
3560   padding-left: 0;
3561   border-left: 5px solid #009688; }
3562   .book-tree .sidebar-page-list li a {
3563     display: block;
3564     border-bottom: none;
3565     padding: 6px 0 6px 12px; }
3566     .book-tree .sidebar-page-list li a:hover {
3567       text-decoration: none; }
3568   .book-tree .sidebar-page-list li a i {
3569     padding-right: 8px; }
3570   .book-tree .sidebar-page-list li, .book-tree .sidebar-page-list a {
3571     display: block; }
3572   .book-tree .sidebar-page-list a.bold {
3573     color: #EEE !important;
3574     fill: #EEE !important; }
3575   .book-tree .sidebar-page-list ul {
3576     list-style: none;
3577     margin: 0; }
3578   .book-tree .sidebar-page-list .book {
3579     color: #009688 !important;
3580     fill: #009688 !important; }
3581     .book-tree .sidebar-page-list .book.selected {
3582       background-color: rgba(0, 150, 136, 0.29); }
3583   .book-tree .sidebar-page-list .chapter {
3584     color: #ef7c3c !important;
3585     fill: #ef7c3c !important; }
3586     .book-tree .sidebar-page-list .chapter.selected {
3587       background-color: rgba(239, 124, 60, 0.12); }
3588   .book-tree .sidebar-page-list .page {
3589     color: #0288D1 !important;
3590     fill: #0288D1 !important;
3591     border-bottom: none; }
3592     .book-tree .sidebar-page-list .page.selected {
3593       background-color: rgba(2, 136, 209, 0.1); }
3594   .book-tree .sidebar-page-list [chapter-toggle] {
3595     padding-left: 12px; }
3596   .book-tree .sidebar-page-list .list-item-chapter {
3597     border-left: 5px solid #ef7c3c;
3598     margin: 10px 10px;
3599     display: block; }
3600   .book-tree .sidebar-page-list .list-item-page {
3601     border-bottom: none;
3602     border-left: 5px solid #0288D1;
3603     margin: 10px 10px; }
3604   .book-tree .sidebar-page-list .list-item-page.draft {
3605     border-left: 5px solid #9A60DA; }
3606   .book-tree .sidebar-page-list .page.draft .page, .book-tree .sidebar-page-list .list-item-page.draft a.page {
3607     color: #9A60DA !important;
3608     fill: #9A60DA !important; }
3609   .book-tree .sidebar-page-list .sub-menu {
3610     display: none;
3611     padding-left: 0; }
3612   .book-tree .sidebar-page-list [chapter-toggle].open + .sub-menu {
3613     display: block; }
3614
3615 .sortable-page-list, .sortable-page-list ul {
3616   list-style: none;
3617   background-color: #FFF; }
3618
3619 .sort-box {
3620   margin-bottom: 16px;
3621   padding: 0 24px 0 24px;
3622   border-left: 4px solid #009688; }
3623
3624 .sortable-page-list {
3625   margin-left: 0; }
3626   .sortable-page-list > ul {
3627     margin-left: 0; }
3628   .sortable-page-list ul {
3629     margin-bottom: 0;
3630     margin-top: 0;
3631     box-shadow: 0 0 1px 0 rgba(0, 0, 0, 0.1); }
3632   .sortable-page-list li {
3633     border: 1px solid #DDD;
3634     padding: 6px 12px;
3635     margin-top: -1px;
3636     min-height: 38px; }
3637     .sortable-page-list li.text-chapter {
3638       border-left: 2px solid #ef7c3c; }
3639     .sortable-page-list li.text-page {
3640       border-left: 2px solid #0288D1; }
3641   .sortable-page-list li:first-child {
3642     margin-top: 6px; }
3643
3644 .sortable-page-list li.placeholder {
3645   position: relative; }
3646
3647 .sortable-page-list li.placeholder:before {
3648   position: absolute; }
3649
3650 .activity-list-item {
3651   padding: 12px 0;
3652   color: #888;
3653   fill: #888;
3654   border-bottom: 1px solid #EEE;
3655   font-size: 0.9em; }
3656   .activity-list-item .left {
3657     float: left; }
3658   .activity-list-item .left + .right {
3659     margin-left: 42px; }
3660   .activity-list-item:last-of-type {
3661     border-bottom: 0; }
3662
3663 ul.pagination {
3664   display: inline-block;
3665   list-style: none;
3666   margin: 16px 0;
3667   padding-left: 1px; }
3668   ul.pagination li {
3669     float: left; }
3670   ul.pagination li:first-child a, ul.pagination li:first-child span {
3671     border-radius: 3px 0 0 3px; }
3672   ul.pagination li:last-child a, ul.pagination li:last-child span {
3673     border-radius: 0 3px 3px 0; }
3674   ul.pagination a, ul.pagination span {
3675     display: block;
3676     padding: 3px 12px;
3677     border: 1px solid #CCC;
3678     margin-left: -1px;
3679     -webkit-user-select: none;
3680        -moz-user-select: none;
3681         -ms-user-select: none;
3682             user-select: none; }
3683     ul.pagination a.disabled, ul.pagination span.disabled {
3684       cursor: not-allowed; }
3685   ul.pagination li.active span {
3686     color: #FFF; }
3687
3688 .compact ul.pagination {
3689   margin: 0; }
3690
3691 .entity-list > div {
3692   padding: 16px 0; }
3693
3694 .entity-list h4 {
3695   margin: 0; }
3696
3697 .entity-list hr {
3698   margin: 0; }
3699
3700 .entity-list .text-small.text-muted {
3701   color: #AAA;
3702   font-size: 0.75em;
3703   margin-top: 6px; }
3704
3705 .entity-list .text-muted p.text-muted {
3706   margin-top: 0; }
3707
3708 .entity-list .page.draft .text-page {
3709   color: #9A60DA;
3710   fill: #9A60DA; }
3711
3712 .card .entity-list-item, .card .activity-list-item {
3713   padding-left: 16px;
3714   padding-right: 16px; }
3715
3716 .entity-list.compact {
3717   font-size: 0.6em; }
3718   .entity-list.compact h4, .entity-list.compact a {
3719     line-height: 1.2; }
3720   .entity-list.compact .entity-item-snippet {
3721     display: none; }
3722   .entity-list.compact .entity-list-item p {
3723     font-size: 12px;
3724     padding-top: 6px; }
3725   .entity-list.compact p {
3726     margin: 0; }
3727   .entity-list.compact > p.empty-text {
3728     display: block;
3729     font-size: 15px; }
3730   .entity-list.compact hr {
3731     margin: 0; }
3732
3733 .dropdown-container {
3734   display: inline-block;
3735   vertical-align: top;
3736   position: relative; }
3737
3738 .dropdown-container ul {
3739   display: none;
3740   position: absolute;
3741   z-index: 999;
3742   top: 0;
3743   list-style: none;
3744   right: 0;
3745   margin: 16px 0;
3746   background-color: #FFFFFF;
3747   box-shadow: 0 0 2px 0 rgba(0, 0, 0, 0.1);
3748   border-radius: 1px;
3749   border: 1px solid #EEE;
3750   min-width: 180px;
3751   padding: 6px 0;
3752   color: #555;
3753   fill: #555;
3754   text-align: left !important; }
3755   .dropdown-container ul.wide {
3756     min-width: 220px; }
3757   .dropdown-container ul .text-muted {
3758     color: #999;
3759     fill: #999; }
3760   .dropdown-container ul li.padded {
3761     padding: 6px 16px;
3762     line-height: 1.2; }
3763   .dropdown-container ul a, .dropdown-container ul button {
3764     display: block;
3765     padding: 6px 16px;
3766     color: #555;
3767     fill: #555;
3768     white-space: nowrap; }
3769     .dropdown-container ul a:hover, .dropdown-container ul button:hover {
3770       text-decoration: none;
3771       background-color: #EEE; }
3772     .dropdown-container ul a svg, .dropdown-container ul button svg {
3773       margin-right: 12px;
3774       display: inline-block;
3775       width: 16px; }
3776   .dropdown-container ul button {
3777     width: 100%;
3778     text-align: left; }
3779   .dropdown-container ul li.border-bottom {
3780     border-bottom: 1px solid #DDD; }
3781
3782 .featured-image-container {
3783   position: relative;
3784   overflow: hidden;
3785   background: #F2F2F2; }
3786   .featured-image-container a {
3787     display: block; }
3788   .featured-image-container img {
3789     display: block;
3790     width: 100%;
3791     max-width: 100%;
3792     height: auto;
3793     transition: all .5s ease-in-out; }
3794   .featured-image-container img:hover {
3795     -webkit-transform: scale(1.15);
3796             transform: scale(1.15);
3797     opacity: .5; }
3798
3799 .page-editor {
3800   display: flex;
3801   flex-direction: column;
3802   align-items: stretch;
3803   overflow: hidden; }
3804   .page-editor .faded-small {
3805     height: auto; }
3806   .page-editor .edit-area {
3807     flex: 1;
3808     flex-direction: column; }
3809   .page-editor .mce-tinymce {
3810     box-shadow: none; }
3811   .page-editor .mce-top-part::before {
3812     box-shadow: none; }
3813
3814 .draft-notification {
3815   pointer-events: none;
3816   -webkit-transform: scale(0);
3817           transform: scale(0);
3818   transition: -webkit-transform ease-in-out 120ms;
3819   transition: transform ease-in-out 120ms;
3820   transition: transform ease-in-out 120ms, -webkit-transform ease-in-out 120ms;
3821   -webkit-transform-origin: 50% 50%;
3822           transform-origin: 50% 50%; }
3823   .draft-notification.visible {
3824     -webkit-transform: scale(1);
3825             transform: scale(1); }
3826
3827 .page-style.editor {
3828   padding: 0 !important; }
3829
3830 .page-content {
3831   width: 100%;
3832   max-width: 840px;
3833   margin: 0 auto;
3834   margin-top: 48px;
3835   overflow-wrap: break-word; }
3836   .page-content.flex {
3837     margin-top: 16px; }
3838   .page-content .align-left {
3839     text-align: left; }
3840   .page-content img.align-left, .page-content table.align-left {
3841     float: left !important;
3842     margin: 6px 12px 6px 0; }
3843   .page-content .align-right {
3844     float: right !important; }
3845   .page-content img.align-right, .page-content table.align-right {
3846     text-align: right;
3847     margin: 6px 0 6px 12px; }
3848   .page-content .align-center {
3849     text-align: center; }
3850   .page-content img {
3851     max-width: 100%;
3852     height: auto; }
3853   .page-content h1, .page-content h2, .page-content h3, .page-content h4, .page-content h5, .page-content h6, .page-content pre {
3854     clear: left; }
3855   .page-content hr {
3856     clear: both;
3857     margin: 16px 0; }
3858   .page-content table {
3859     -webkit-hyphens: auto;
3860         -ms-hyphens: auto;
3861             hyphens: auto;
3862     table-layout: fixed;
3863     max-width: 100%;
3864     height: auto !important; }
3865   .page-content ins,
3866   .page-content del {
3867     text-decoration: none; }
3868   .page-content ins {
3869     background: #dbffdb; }
3870   .page-content del {
3871     background: #FFECEC; }
3872   .page-content.page-revision pre code {
3873     white-space: pre-wrap; }
3874
3875 .pointer-container {
3876   position: relative;
3877   display: none;
3878   left: 0;
3879   z-index: 10; }
3880
3881 .pointer {
3882   border: 1px solid #CCC;
3883   display: inline-block;
3884   padding: 12px 12px;
3885   border-radius: 4px;
3886   box-shadow: 0 0 8px 1px rgba(212, 209, 209, 0.35);
3887   position: absolute;
3888   top: -60px;
3889   background-color: #FFF;
3890   width: 275px;
3891   z-index: 55; }
3892   .pointer.is-page-editable {
3893     width: 328px; }
3894   .pointer:before {
3895     position: absolute;
3896     left: 50%;
3897     bottom: -9px;
3898     width: 16px;
3899     height: 16px;
3900     margin-left: -8px;
3901     content: '';
3902     display: block;
3903     background-color: #FFF;
3904     -webkit-transform: rotate(45deg);
3905             transform: rotate(45deg);
3906     -webkit-transform-origin: 50% 50%;
3907             transform-origin: 50% 50%;
3908     border-bottom: 1px solid #CCC;
3909     border-right: 1px solid #CCC;
3910     z-index: 56; }
3911   .pointer input {
3912     background-color: #FFF;
3913     border: 1px solid #DDD;
3914     color: #666;
3915     width: 172px;
3916     z-index: 40; }
3917   .pointer input, .pointer button, .pointer a {
3918     position: relative;
3919     border-radius: 0;
3920     height: 28px;
3921     font-size: 12px;
3922     vertical-align: top;
3923     padding: 5px 16px; }
3924   .pointer > i {
3925     color: #888;
3926     font-size: 18px;
3927     padding-top: 4px; }
3928   .pointer span.icon {
3929     cursor: pointer;
3930     -webkit-user-select: none;
3931        -moz-user-select: none;
3932         -ms-user-select: none;
3933             user-select: none; }
3934   .pointer .input-group .button {
3935     line-height: 1;
3936     margin: 0 0 0 -4px;
3937     box-shadow: none; }
3938   .pointer a.button {
3939     margin: 0 0 0 0; }
3940     .pointer a.button:hover {
3941       fill: #fff; }
3942   .pointer .svg-icon {
3943     width: 1.2em;
3944     height: 1.2em; }
3945
3946 .floating-toolbox {
3947   background-color: #FFF;
3948   border: 1px solid #DDD;
3949   right: 64px;
3950   width: 48px;
3951   overflow: hidden;
3952   align-items: stretch;
3953   flex-direction: row;
3954   display: flex;
3955   transition: width ease-in-out 180ms;
3956   margin-top: -1px;
3957   min-height: 0; }
3958   .floating-toolbox.open {
3959     width: 480px; }
3960   .floating-toolbox [toolbox-toggle] svg {
3961     transition: -webkit-transform ease-in-out 180ms;
3962     transition: transform ease-in-out 180ms;
3963     transition: transform ease-in-out 180ms, -webkit-transform ease-in-out 180ms; }
3964   .floating-toolbox [toolbox-toggle] {
3965     transition: background-color ease-in-out 180ms; }
3966   .floating-toolbox.open [toolbox-toggle] {
3967     background-color: rgba(255, 0, 0, 0.29); }
3968   .floating-toolbox.open [toolbox-toggle] svg {
3969     -webkit-transform: rotate(180deg);
3970             transform: rotate(180deg); }
3971   .floating-toolbox > div {
3972     flex: 1;
3973     position: relative; }
3974   .floating-toolbox .tabs {
3975     display: block;
3976     border-right: 1px solid #DDD;
3977     width: 48px;
3978     flex: 0 1 auto; }
3979   .floating-toolbox .tabs svg {
3980     fill: rgba(0, 0, 0, 0.5);
3981     padding: 0;
3982     margin: 0; }
3983   .floating-toolbox .tabs > span {
3984     display: block;
3985     cursor: pointer;
3986     padding: 12px 16px;
3987     font-size: 13.5px;
3988     line-height: 1.6;
3989     border-bottom: 1px solid rgba(255, 255, 255, 0.3); }
3990   .floating-toolbox.open .tabs > span.active {
3991     fill: #444;
3992     background-color: rgba(0, 0, 0, 0.1); }
3993   .floating-toolbox div[toolbox-tab-content] {
3994     padding-bottom: 45px;
3995     display: flex;
3996     flex: 1;
3997     flex-direction: column;
3998     min-height: 0px;
3999     overflow-y: scroll; }
4000   .floating-toolbox div[toolbox-tab-content] .padded {
4001     flex: 1;
4002     padding-top: 0; }
4003   .floating-toolbox div[toolbox-tab-content] .padded.files {
4004     overflow-x: hidden; }
4005   .floating-toolbox h4 {
4006     font-size: 24px;
4007     margin: 16px 0 0 0;
4008     padding: 0 24px 12px 24px; }
4009   .floating-toolbox .tags input {
4010     max-width: 100%;
4011     width: 100%;
4012     min-width: 50px; }
4013   .floating-toolbox .tags td, .floating-toolbox .tag-table > div > div > div {
4014     padding-right: 12px;
4015     padding-top: 12px;
4016     position: relative; }
4017   .floating-toolbox .handle {
4018     -webkit-user-select: none;
4019        -moz-user-select: none;
4020         -ms-user-select: none;
4021             user-select: none;
4022     cursor: move;
4023     fill: #999; }
4024   .floating-toolbox form {
4025     display: flex;
4026     flex: 1;
4027     flex-direction: column;
4028     overflow-y: scroll; }
4029   .floating-toolbox table td, .floating-toolbox table th {
4030     overflow: visible; }
4031
4032 [toolbox-tab-content] {
4033   display: none; }
4034
4035 .tag-display {
4036   position: relative; }
4037   .tag-display table {
4038     width: 100%;
4039     margin: 0;
4040     padding: 0; }
4041   .tag-display tr:first-child td {
4042     padding-top: 0; }
4043   .tag-display .heading th {
4044     padding: 6px 12px;
4045     color: rgba(100, 100, 100, 0.7);
4046     border: 0;
4047     font-weight: 400; }
4048   .tag-display td {
4049     border: 0;
4050     border-bottom: 1px solid #EEE;
4051     padding: 6px 12px;
4052     color: #444; }
4053   .tag-display tr td:first-child {
4054     padding-left: 0; }
4055   .tag-display .tag-value {
4056     color: #888; }
4057   .tag-display tr:last-child td {
4058     border-bottom: none; }
4059   .tag-display .tag {
4060     padding: 12px; }
4061
4062 .suggestion-box {
4063   position: absolute;
4064   background-color: #FFF;
4065   border: 1px solid #BBB;
4066   box-shadow: 0 0 4px 1px #CCC;
4067   list-style: none;
4068   z-index: 100;
4069   padding: 0;
4070   margin: 0;
4071   border-radius: 3px; }
4072   .suggestion-box li {
4073     display: block;
4074     padding: 6px 12px;
4075     border-bottom: 1px solid #DDD; }
4076     .suggestion-box li:last-child {
4077       border-bottom: 0; }
4078     .suggestion-box li.active {
4079       background-color: #EEE; }
4080
4081 .comments-container {
4082   width: 100%;
4083   border-top: 1px solid #DDD;
4084   margin-top: 32px;
4085   margin-bottom: 16px; }
4086   .comments-container h5 {
4087     color: #888;
4088     font-weight: normal;
4089     margin-top: 0.5em; }
4090
4091 .comment-editor .CodeMirror, .comment-editor .CodeMirror-scroll {
4092   min-height: 175px; }
4093
4094 /* FIXME - Ugly hack to modify the media plugin for TinyMCE */
4095 .mce-floatpanel[aria-label="Insert/edit media"] .mce-open {
4096   display: none; }
4097
4098 [v-cloak] {
4099   display: none;
4100   opacity: 0;
4101   -webkit-animation-name: none !important;
4102           animation-name: none !important; }
4103
4104 .dragged {
4105   position: absolute;
4106   opacity: 0.5;
4107   z-index: 2000; }
4108
4109 body.dragging, body.dragging * {
4110   cursor: move !important; }
4111
4112 .avatar {
4113   border-radius: 100%;
4114   background-color: #EEE;
4115   width: 30px;
4116   height: 30px; }
4117   .avatar.med {
4118     width: 40px;
4119     height: 40px; }
4120   .avatar.large {
4121     width: 80px;
4122     height: 80px; }
4123   .avatar.huge {
4124     width: 120px;
4125     height: 120px; }
4126   .avatar.square {
4127     border-radius: 3px; }
4128
4129 .loading-container {
4130   position: relative;
4131   display: block;
4132   margin: 32px auto; }
4133   .loading-container > div {
4134     width: 10px;
4135     height: 10px;
4136     border-radius: 10px;
4137     display: inline-block;
4138     vertical-align: top;
4139     -webkit-transform: translate3d(-10px, 0, 0);
4140             transform: translate3d(-10px, 0, 0);
4141     margin-top: 6px;
4142     -webkit-animation-name: loadingBob;
4143             animation-name: loadingBob;
4144     -webkit-animation-duration: 1.4s;
4145             animation-duration: 1.4s;
4146     -webkit-animation-iteration-count: infinite;
4147             animation-iteration-count: infinite;
4148     -webkit-animation-timing-function: cubic-bezier(0.62, 0.28, 0.23, 0.99);
4149             animation-timing-function: cubic-bezier(0.62, 0.28, 0.23, 0.99);
4150     margin-right: 4px;
4151     background-color: #0288D1;
4152     -webkit-animation-delay: 0.3s;
4153             animation-delay: 0.3s; }
4154   .loading-container > div:first-child {
4155     left: -16px;
4156     background-color: #009688;
4157     -webkit-animation-delay: 0s;
4158             animation-delay: 0s; }
4159   .loading-container > div:last-of-type {
4160     left: 16px;
4161     background-color: #ef7c3c;
4162     -webkit-animation-delay: 0.6s;
4163             animation-delay: 0.6s; }
4164   .loading-container > span {
4165     margin-left: 12px;
4166     font-style: italic;
4167     color: #888;
4168     vertical-align: top; }
4169
4170 .search-results > h3 a {
4171   font-size: 0.66em;
4172   color: #0288D1;
4173   padding-left: 16px; }
4174   .search-results > h3 a i {
4175     padding-right: 12px; }
4176
4177 [back-to-top] {
4178   background-color: #0288D1;
4179   position: fixed;
4180   bottom: 16px;
4181   right: 24px;
4182   padding: 5px 7px;
4183   cursor: pointer;
4184   color: #FFF;
4185   fill: #FFF;
4186   width: 40px;
4187   height: 40px;
4188   border-radius: 40px;
4189   transition: all ease-in-out 180ms;
4190   opacity: 0;
4191   z-index: 999;
4192   overflow: hidden; }
4193   [back-to-top] svg {
4194     width: 26.66667px;
4195     height: 26.66667px;
4196     margin-right: 4px; }
4197   [back-to-top]:hover {
4198     width: 136px;
4199     opacity: 1 !important; }
4200   [back-to-top] .inner {
4201     width: 136px; }
4202   [back-to-top] span {
4203     position: relative;
4204     vertical-align: top;
4205     line-height: 2; }
4206
4207 .contained-search-box {
4208   display: flex; }
4209   .contained-search-box input, .contained-search-box button {
4210     border-radius: 0;
4211     border: 1px solid #DDD;
4212     margin-left: -1px; }
4213   .contained-search-box input {
4214     flex: 5;
4215     padding: 6px 12px; }
4216     .contained-search-box input:focus, .contained-search-box input:active {
4217       outline: 0; }
4218   .contained-search-box button {
4219     width: 60px; }
4220   .contained-search-box button i {
4221     padding: 0; }
4222   .contained-search-box button.cancel.active {
4223     background-color: #E84F4F;
4224     color: #EEE; }
4225
4226 .entity-selector {
4227   border: 1px solid #DDD;
4228   border-radius: 3px;
4229   overflow: hidden;
4230   font-size: 0.8em; }
4231   .entity-selector input[type="text"] {
4232     width: 100%;
4233     display: block;
4234     border-radius: 0;
4235     border: 0;
4236     border-bottom: 1px solid #DDD;
4237     font-size: 16px;
4238     padding: 12px 16px; }
4239   .entity-selector .entity-list {
4240     overflow-y: scroll;
4241     height: 400px;
4242     background-color: #EEEEEE; }
4243   .entity-selector .loading {
4244     height: 400px;
4245     padding-top: 24px; }
4246   .entity-selector .entity-list > p {
4247     text-align: center;
4248     padding-top: 24px;
4249     font-size: 1.333em; }
4250   .entity-selector .entity-list > div {
4251     padding-left: 16px;
4252     padding-right: 16px;
4253     background-color: #FFF;
4254     transition: all ease-in-out 120ms;
4255     cursor: pointer; }
4256   .entity-selector.compact {
4257     font-size: 10px; }
4258     .entity-selector.compact .entity-item-snippet {
4259       display: none; }
4260
4261 .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 {
4262   color: #EEE; }
4263
4264 .scroll-box {
4265   max-height: 250px;
4266   overflow-y: scroll;
4267   border: 1px solid #DDD;
4268   border-radius: 3px; }
4269   .scroll-box .scroll-box-item {
4270     padding: 6px 16px;
4271     border-bottom: 1px solid #DDD; }
4272     .scroll-box .scroll-box-item:last-child {
4273       border-bottom: 0; }
4274
4275 .center-box {
4276   margin: 48px auto 0 auto;
4277   width: 420px;
4278   max-width: 100%;
4279   display: inline-block;
4280   text-align: left;
4281   vertical-align: top; }
4282   .center-box input {
4283     width: 100%; }
4284
4285 .fullscreen {
4286   border: 0;
4287   position: fixed;
4288   top: 0;
4289   left: 0;
4290   right: 0;
4291   bottom: 0;
4292   width: 100%;
4293   height: 100%;
4294   z-index: 150; }