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