wp-includes/css/editor.css

   1 /*------------------------------------------------------------------------------
   2  TinyMCE and Quicklinks toolbars
   3 ------------------------------------------------------------------------------*/
   4
   5 /* TinyMCE widgets/containers */
   6
   7 .mce-container,
   8 .mce-container *,
   9 .mce-widget,
  10 .mce-widget * {
  11         color: inherit;
  12         font-family: inherit;
  13 }
  14
  15 /* TinyMCE windows */
  16 #mce-modal-block.mce-in {
  17         opacity: 0.7;
  18         filter: alpha(opacity=70);
  19 }
  20
  21 .mce-window {
  22         -webkit-border-radius: 0;
  23         border-radius: 0;
  24         -webkit-box-shadow: 0 3px 6px rgba( 0, 0, 0, 0.3 );
  25         box-shadow: 0 3px 6px rgba( 0, 0, 0, 0.3 );
  26         -webkit-font-smoothing: subpixel-antialiased;
  27 }
  28
  29 .mce-window .mce-container-body.mce-abs-layout {
  30         overflow: visible;
  31 }
  32
  33 .mce-window .mce-window-head {
  34         background: #fcfcfc;
  35         border-bottom: 1px solid #dfdfdf;
  36         padding: 0;
  37         min-height: 36px;
  38 }
  39
  40 .mce-window .mce-window-head .mce-title {
  41         color: #444;
  42         font-size: 18px;
  43         font-weight: 600;
  44         line-height: 36px;
  45         margin: 0;
  46         padding: 0 36px 0 16px;
  47 }
  48
  49 .mce-window .mce-window-head .mce-close {
  50         color: transparent;
  51         top: 0;
  52         right: 0;
  53         width: 36px;
  54         height: 36px;
  55         line-height: 36px;
  56         text-align: center;
  57 }
  58
  59 .mce-window .mce-window-head .mce-close:before {
  60         font: normal 20px/36px 'dashicons';
  61         text-align: center;
  62         color: #666;
  63         width: 36px;
  64         height: 36px;
  65         display: block;
  66 }
  67
  68 .mce-window .mce-window-head .mce-close:hover:before {
  69         color: #2ea2cc;
  70 }
  71
  72 .mce-window .mce-window-head .mce-dragh {
  73         width: -webkit-calc( 100% - 36px );
  74         width: calc( 100% - 36px );
  75 }
  76
  77 .mce-wp-help .mce-window-head {
  78         border-bottom: none;
  79 }
  80
  81 .mce-textbox,
  82 .mce-checkbox i.mce-i-checkbox,
  83 #wp-link .query-results {
  84         border: 1px solid #ddd;
  85         -webkit-border-radius: 0;
  86         border-radius: 0;
  87         -webkit-box-shadow: inset 0 1px 2px rgba(0,0,0,0.07);
  88         box-shadow: inset 0 1px 2px rgba(0,0,0,0.07);
  89         -webkit-transition: .05s all ease-in-out;
  90         transition: .05s all ease-in-out;
  91 }
  92
  93 .mce-textbox:focus,
  94 .mce-textbox.mce-focus,
  95 .mce-checkbox:focus i.mce-i-checkbox,
  96 #wp-link .query-results:focus {
  97         border-color: #5b9dd9;
  98         -webkit-box-shadow: 0 0 2px rgba(30,140,190,0.8);
  99         box-shadow: 0 0 2px rgba(30,140,190,0.8);
 100 }
 101
 102 /* TinyMCE menus */
 103 .mce-menu,
 104 .mce-floatpanel.mce-popover {
 105         border-color: rgba(0,0,0,0.15);
 106         -webkit-border-radius: 0;
 107         border-radius: 0;
 108         -webkit-box-shadow: 0 3px 5px rgba( 0, 0, 0, 0.2 );
 109         box-shadow: 0 3px 5px rgba( 0, 0, 0, 0.2 );
 110 }
 111
 112 .mce-floatpanel.mce-popover.mce-bottom {
 113         margin-top: 2px;
 114 }
 115
 116 .mce-floatpanel .mce-arrow {
 117         display: none;
 118 }
 119
 120 .mce-menu .mce-container-body {
 121         min-width: 160px;
 122 }
 123
 124 .mce-menu-item {
 125         border: none;
 126         margin-bottom: 2px;
 127 }
 128
 129 .mce-menu-has-icons i.mce-ico {
 130         line-height: 20px;
 131 }
 132
 133 /* TinyMCE panel */
 134 div.mce-panel {
 135         border: 0;
 136         background: #fff;
 137         -webkit-filter: none;
 138         filter: none;
 139 }
 140
 141 .mce-panel.mce-menu {
 142         border: 1px solid #ddd;
 143 }
 144
 145 div.mce-tab {
 146         line-height: 13px;
 147 }
 148
 149 /* TinyMCE toolbars */
 150 div.mce-toolbar-grp {
 151         border-bottom: 1px solid #dedede;
 152         background: #f5f5f5;
 153         padding: 0;
 154         position: relative;
 155 }
 156
 157 div.mce-toolbar-grp > div {
 158         padding: 3px;
 159 }
 160
 161 .has-dfw div.mce-toolbar-grp .mce-toolbar.mce-first {
 162         padding-right: 32px;
 163 }
 164
 165 .mce-toolbar .mce-btn-group {
 166         margin: 0;
 167 }
 168
 169 div.mce-statusbar {
 170         border-top: 1px solid #e5e5e5;
 171 }
 172
 173 div.mce-path {
 174         padding: 2px 10px;
 175         margin: 0;
 176 }
 177
 178 .mce-path,
 179 .mce-path-item,
 180 .mce-path .mce-divider {
 181         font-size: 12px;
 182         line-height: 18px;
 183 }
 184
 185 .mce-toolbar .mce-btn,
 186 .qt-fullscreen {
 187         border-color: transparent;
 188         background: transparent;
 189         -webkit-box-shadow: none;
 190         box-shadow: none;
 191         text-shadow: none;
 192         cursor: pointer;
 193 }
 194
 195 #wp-fullscreen-buttons .mce-btn,
 196 .mce-toolbar .mce-btn-group .mce-btn,
 197 .qt-fullscreen {
 198         border: 1px solid transparent;
 199         margin: 2px;
 200         background-image: none;
 201         -webkit-border-radius: 2px;
 202         border-radius: 2px;
 203         -webkit-filter: none;
 204         filter: none;
 205 }
 206
 207 #wp-fullscreen-buttons .mce-btn:hover,
 208 .mce-toolbar .mce-btn-group .mce-btn:hover,
 209 #wp-fullscreen-buttons .mce-btn:focus,
 210 .mce-toolbar .mce-btn-group .mce-btn:focus,
 211 .qt-fullscreen:hover,
 212 .qt-fullscreen:focus {
 213         background: #fafafa;
 214         border-color: #999;
 215         color: #222;
 216         -webkit-box-shadow: inset 0 1px 0 #fff, 0 1px 0 rgba( 0, 0, 0, 0.08 );
 217         box-shadow: inset 0 1px 0 #fff, 0 1px 0 rgba( 0, 0, 0, 0.08 );
 218 }
 219
 220 .mce-toolbar .mce-btn-group .mce-btn.mce-active,
 221 #wp-fullscreen-buttons .mce-btn.mce-active,
 222 .mce-toolbar .mce-btn-group .mce-btn:active,
 223 #wp-fullscreen-buttons .mce-btn:active {
 224         background: #ebebeb;
 225         border-color: #999;
 226         -webkit-box-shadow: inset 0 2px 5px -3px rgba( 0, 0, 0, 0.3 );
 227         box-shadow: inset 0 2px 5px -3px rgba( 0, 0, 0, 0.3 );
 228 }
 229
 230 .mce-toolbar .mce-btn-group .mce-btn.mce-active:hover {
 231         border-color: #555;
 232 }
 233
 234 .mce-toolbar .mce-btn-group .mce-btn.mce-active:hover i.mce-ico {
 235         color: #555;
 236 }
 237
 238 .mce-toolbar .mce-btn-group .mce-btn.mce-disabled:hover,
 239 #wp-fullscreen-buttons .mce-btn.mce-disabled:hover,
 240 .mce-toolbar .mce-btn-group .mce-btn.mce-disabled:focus,
 241 #wp-fullscreen-buttons .mce-btn.mce-disabled:focus {
 242         color: #aaa;
 243         background: none;
 244         border-color: #ddd;
 245         text-shadow: 0 1px 0 #fff;
 246         -webkit-box-shadow: none;
 247         box-shadow: none;
 248 }
 249
 250 .mce-toolbar .mce-btn-group .mce-first,
 251 .mce-toolbar .mce-btn-group .mce-last {
 252         border-color: transparent;
 253 }
 254
 255 .mce-toolbar .mce-btn button,
 256 .qt-fullscreen {
 257         padding: 2px 3px;
 258         line-height: normal;
 259 }
 260
 261 .mce-toolbar .mce-btn i {
 262         text-shadow: none;
 263 }
 264
 265 .mce-toolbar .mce-btn-group > div {
 266         white-space: normal;
 267 }
 268
 269 .mce-toolbar .mce-colorbutton .mce-open {
 270         border-right: 0;
 271 }
 272
 273 .mce-toolbar .mce-colorbutton .mce-preview {
 274         margin: 0;
 275         padding: 0;
 276         top: auto;
 277         bottom: 2px;
 278         left: 3px;
 279         height: 3px;
 280         width: 20px;
 281 }
 282
 283 /* mce listbox */
 284 .mce-toolbar .mce-btn-group .mce-btn.mce-listbox {
 285     -webkit-border-radius: 0;
 286     border-radius: 0;
 287     direction: ltr;
 288     background: #fff;
 289     border: 1px solid #ddd;
 290     -webkit-box-shadow: inset 0 1px 1px -1px rgba(0, 0, 0, .2);
 291     box-shadow: inset 0 1px 1px -1px rgba(0, 0, 0, .2);
 292 }
 293
 294 .mce-toolbar .mce-btn-group .mce-btn.mce-listbox:hover {
 295     background-image: none;
 296     border-color: #bbb;
 297 }
 298
 299 .mce-toolbar .mce-btn-group .mce-btn.mce-listbox span {
 300         font-size: 13px;
 301 }
 302
 303 .mce-panel .mce-btn i.mce-caret {
 304         border-top: 6px solid #777;
 305         margin-left: 2px;
 306         margin-right: 2px;
 307 }
 308
 309 .mce-listbox i.mce-caret {
 310         right: 6px;
 311 }
 312
 313 .mce-panel .mce-btn button.mce-open i.mce-caret,
 314 .mce-panel .mce-btn.mce-listbox i.mce-caret {
 315         margin-left: 0;
 316         margin-right: 0;
 317 }
 318
 319 .mce-panel .mce-btn:hover i.mce-caret {
 320         border-top-color: #333;
 321 }
 322
 323 .mce-panel .mce-active i.mce-caret {
 324         border-top: 0;
 325         border-bottom: 6px solid #333;
 326         margin-top: 7px;
 327 }
 328
 329 .mce-listbox.mce-active i.mce-caret {
 330         margin-top: -3px;
 331 }
 332
 333 .mce-toolbar .mce-splitbtn:hover .mce-open {
 334         border-right-color: transparent;
 335 }
 336
 337 .mce-toolbar .mce-splitbtn .mce-open.mce-active{
 338         -webkit-box-shadow: none;
 339         box-shadow: none;
 340 }
 341
 342 .mce-menu .mce-menu-item-normal.mce-active {
 343         background-color: #e5e5e5;
 344         -webkit-filter: none;
 345         filter: none;
 346 }
 347
 348 .mce-menu .mce-menu-item:hover,
 349 .mce-menu .mce-menu-item.mce-selected,
 350 .mce-menu .mce-menu-item:focus {
 351         color: #000;
 352         background-color: #bbb;
 353         background-image: none;
 354         -webkit-filter: none;
 355         filter: none;
 356 }
 357
 358 .mce-menu .mce-menu-item:hover .mce-ico,
 359 .mce-menu .mce-menu-item.mce-selected .mce-ico,
 360 .mce-menu .mce-menu-item:focus .mce-ico,
 361 .mce-menu .mce-menu-item:hover .mce-text,
 362 .mce-menu .mce-menu-item.mce-active:hover .mce-text,
 363 .mce-menu .mce-menu-item.mce-selected .mce-text {
 364         color: #000;
 365 }
 366
 367 /* Menubar */
 368 .mce-menubar {
 369         border-color: #e5e5e5;
 370         background: #fff;
 371         border-width: 0px 0px 1px;
 372 }
 373
 374 .mce-menubar .mce-btn:focus {
 375         outline: 0;
 376 }
 377
 378 div.mce-menu .mce-menu-item-sep,
 379 .mce-menu-item-sep:hover {
 380         margin: 5px 0 4px;
 381 }
 382
 383 .mce-menubtn span {
 384         margin-right: 0;
 385         padding-left: 3px;
 386 }
 387
 388 .mce-menu-has-icons i.mce-ico:before {
 389         margin-left: -2px;
 390 }
 391
 392 /* Buttons in modals */
 393 .mce-primary button,
 394 .mce-primary button i {
 395         text-align: center;
 396         color: #fff;
 397         text-shadow: none;
 398         padding: 0;
 399         line-height: 26px;
 400 }
 401
 402 .mce-window .mce-btn {
 403         color: #555;
 404         background: #f7f7f7;
 405         text-decoration: none;
 406         font-size: 13px;
 407         line-height: 26px;
 408         height: 28px;
 409         margin: 0;
 410         padding: 0;
 411         cursor: pointer;
 412         border: 1px solid #ccc;
 413         -webkit-appearance: none;
 414         -webkit-border-radius: 3px;
 415         border-radius: 3px;
 416         white-space: nowrap;
 417         -webkit-box-shadow: inset 0 1px 0 #fff, 0 1px 0 rgba( 0, 0, 0, 0.08 );
 418         box-shadow: inset 0 1px 0 #fff, 0 1px 0 rgba( 0, 0, 0, 0.08 );
 419         background-image: none;
 420 }
 421
 422 /* Remove the dotted border on :focus and the extra padding in Firefox */
 423 .mce-window .mce-btn::-moz-focus-inner {
 424         border-width: 1px 0;
 425         border-style: solid none;
 426         border-color: transparent;
 427         padding: 0;
 428 }
 429
 430 .mce-window .mce-btn:hover,
 431 .mce-window .mce-btn:focus {
 432         background: #fafafa;
 433         border-color: #999;
 434         color: #222;
 435 }
 436
 437 .mce-window .mce-btn:focus {
 438         -webkit-box-shadow:
 439                 0 0 0 1px #5b9dd9,
 440                 0 0 2px 1px rgba( 30, 140, 190, 0.8 );
 441         box-shadow:
 442                 0 0 0 1px #5b9dd9,
 443                 0 0 2px 1px rgba( 30, 140, 190, 0.8 );
 444 }
 445
 446 .mce-window .mce-btn:active {
 447         background: #eee;
 448         border-color: #999;
 449         color: #333;
 450         -webkit-box-shadow: inset 0 2px 5px -3px rgba( 0, 0, 0, 0.5 );
 451         box-shadow: inset 0 2px 5px -3px rgba( 0, 0, 0, 0.5 );
 452 }
 453
 454 .mce-window .mce-btn.mce-disabled {
 455         color: #aaa;
 456         border-color: #ddd;
 457         background: #f7f7f7;
 458         -webkit-box-shadow: none;
 459         box-shadow: none;
 460         text-shadow: 0 1px 0 #fff;
 461         cursor: default;
 462 }
 463
 464 .mce-window .mce-btn.mce-primary {
 465         background: #2ea2cc;
 466         border-color: #0074a2;
 467         -webkit-box-shadow: inset 0 1px 0 rgba( 120, 200, 230, 0.5), 0 1px 0 rgba( 0, 0, 0, 0.15 );
 468         box-shadow: inset 0 1px 0 rgba( 120, 200, 230, 0.5 ), 0 1px 0 rgba( 0, 0, 0, 0.15 );
 469         color: #fff;
 470         text-decoration: none;
 471 }
 472
 473 .mce-window .mce-btn.mce-primary:hover,
 474 .mce-window .mce-btn.mce-primary:focus {
 475         background: #1e8cbe;
 476         border-color: #0074a2;
 477         -webkit-box-shadow: inset 0 1px 0 rgba( 120, 200, 230, 0.6 );
 478         box-shadow: inset 0 1px 0 rgba( 120, 200, 230, 0.6 );
 479         color: #fff;
 480 }
 481
 482 .mce-window .mce-btn.mce-primary:focus {
 483         border-color: #0e3950;
 484         -webkit-box-shadow:
 485                 inset 0 1px 0 rgba( 120, 200, 230, 0.6 ),
 486                 0 0 0 1px #5b9dd9,
 487                 0 0 2px 1px rgba( 30, 140, 190, 0.8 );
 488         box-shadow:
 489                 inset 0 1px 0 rgba( 120, 200, 230, 0.6 ),
 490                 0 0 0 1px #5b9dd9,
 491                 0 0 2px 1px rgba( 30, 140, 190, 0.8 );
 492 }
 493
 494 .mce-window .mce-btn.mce-primary:active {
 495         background: #1b7aa6;
 496         border-color: #005684;
 497         color: rgba( 255, 255, 255, 0.95 );
 498         -webkit-box-shadow: inset 0 1px 0 rgba( 0, 0, 0, 0.1 );
 499         box-shadow: inset 0 1px 0 rgba( 0, 0, 0, 0.1 );
 500         vertical-align: top;
 501 }
 502
 503 .mce-window .mce-btn.mce-primary.mce-disabled {
 504         color: #94cde7;
 505         background: #298cba;
 506         border-color: #1b607f;
 507         -webkit-box-shadow: none;
 508         box-shadow: none;
 509         text-shadow: 0 -1px 0 rgba( 0, 0, 0, 0.1 );
 510         cursor: default;
 511 }
 512
 513 .mce-menubtn.mce-fixed-width button span {
 514         max-width: 80px;
 515         padding-right: 16px;
 516 }
 517
 518 /* Charmap modal */
 519 .mce-charmap {
 520         margin: 3px;
 521 }
 522
 523 .mce-charmap td {
 524         padding: 0;
 525         border-color: #dfdfdf;
 526         cursor: pointer;
 527 }
 528
 529 .mce-charmap td:hover {
 530         background: #f3f3f3;
 531 }
 532
 533 .mce-charmap td div {
 534         width: 18px;
 535         height: 22px;
 536         line-height: 22px;
 537 }
 538
 539 /* TinyMCE tooltips */
 540 .mce-tooltip {
 541         margin-top: 2px;
 542 }
 543
 544 .mce-tooltip-inner {
 545         -webkit-box-shadow: 0 3px 5px rgba( 0, 0, 0, 0.2 );
 546         box-shadow: 0 3px 5px rgba( 0, 0, 0, 0.2 );
 547         color: #fff;
 548         font-size: 12px;
 549 }
 550
 551 /* TinyMCE icons */
 552 .mce-ico {
 553         font-family: 'tinymce', Arial;
 554 }
 555
 556 .mce-btn-small .mce-ico {
 557     font-family: 'tinymce-small', Arial;
 558 }
 559
 560 .mce-toolbar .mce-ico {
 561         color: #777;
 562         line-height: 20px;
 563         width: 20px;
 564         height: 20px;
 565         text-align: center;
 566         text-shadow: none;
 567         margin: 0;
 568         padding: 0;
 569 }
 570
 571 .qt-fullscreen {
 572         color: #777;
 573         line-height: 20px;
 574         width: 28px;
 575         height: 26px;
 576         text-align: center;
 577         text-shadow: none;
 578 }
 579
 580 .mce-toolbar .mce-btn .mce-open {
 581         line-height: 20px;
 582 }
 583
 584 .mce-toolbar .mce-btn:hover .mce-open,
 585 .mce-toolbar .mce-btn:focus .mce-open,
 586 .mce-toolbar .mce-btn.mce-active .mce-open {
 587         border-left-color: #999;
 588 }
 589
 590 i.mce-i-bold,
 591 i.mce-i-italic,
 592 i.mce-i-bullist,
 593 i.mce-i-numlist,
 594 i.mce-i-blockquote,
 595 i.mce-i-alignleft,
 596 i.mce-i-aligncenter,
 597 i.mce-i-alignright,
 598 i.mce-i-link,
 599 i.mce-i-unlink,
 600 i.mce-i-wp_more,
 601 i.mce-i-strikethrough,
 602 i.mce-i-spellchecker,
 603 i.mce-i-fullscreen,
 604 i.mce-i-wp_fullscreen,
 605 i.mce-i-wp_adv,
 606 i.mce-i-underline,
 607 i.mce-i-alignjustify,
 608 i.mce-i-forecolor,
 609 i.mce-i-backcolor,
 610 i.mce-i-pastetext,
 611 i.mce-i-pasteword,
 612 i.mce-i-removeformat,
 613 i.mce-i-charmap,
 614 i.mce-i-outdent,
 615 i.mce-i-indent,
 616 i.mce-i-undo,
 617 i.mce-i-redo,
 618 i.mce-i-help,
 619 i.mce-i-wp_help,
 620 i.mce-i-wp-media-library,
 621 i.mce-i-ltr,
 622 i.mce-i-wp_page,
 623 i.mce-i-hr,
 624 .mce-close {
 625         font: normal 20px/1 'dashicons';
 626         padding: 0;
 627         vertical-align: top;
 628         speak: none;
 629         -webkit-font-smoothing: antialiased;
 630         -moz-osx-font-smoothing: grayscale;
 631         margin-left: -2px;
 632         padding-right: 2px;
 633 }
 634
 635 .qt-fullscreen {
 636         font: normal 20px/1 'dashicons';
 637         vertical-align: top;
 638         speak: none;
 639         -webkit-font-smoothing: antialiased;
 640         -moz-osx-font-smoothing: grayscale;
 641 }
 642
 643 i.mce-i-bold:before {
 644         content: '\f200';
 645 }
 646
 647 i.mce-i-italic:before {
 648         content: '\f201';
 649 }
 650
 651 i.mce-i-bullist:before {
 652         content: '\f203';
 653 }
 654
 655 i.mce-i-numlist:before {
 656         content: '\f204';
 657 }
 658
 659 i.mce-i-blockquote:before {
 660         content: '\f205';
 661 }
 662
 663 i.mce-i-alignleft:before {
 664         content: '\f206';
 665 }
 666
 667 i.mce-i-aligncenter:before {
 668         content: '\f207';
 669 }
 670
 671 i.mce-i-alignright:before {
 672         content: '\f208';
 673 }
 674
 675 i.mce-i-link:before {
 676         content: '\f103';
 677 }
 678
 679 i.mce-i-unlink:before {
 680         content: '\f225';
 681 }
 682
 683 i.mce-i-wp_more:before {
 684         content: '\f209';
 685 }
 686
 687 i.mce-i-strikethrough:before {
 688         content: '\f224';
 689 }
 690
 691 i.mce-i-spellchecker:before {
 692         content: '\f210';
 693 }
 694
 695 i.mce-i-fullscreen:before,
 696 i.mce-i-wp_fullscreen:before,
 697 .qt-fullscreen:before {
 698         content: '\f211';
 699 }
 700
 701 i.mce-i-wp_adv:before {
 702         content: '\f212';
 703 }
 704
 705 i.mce-i-underline:before {
 706         content: '\f213';
 707 }
 708
 709 i.mce-i-alignjustify:before {
 710         content: '\f214';
 711 }
 712
 713 i.mce-i-forecolor:before,
 714 i.mce-i-backcolor:before {
 715         content: '\f215';
 716 }
 717
 718 i.mce-i-pastetext:before {
 719         content: '\f217';
 720 }
 721
 722 i.mce-i-removeformat:before {
 723         content: '\f218';
 724 }
 725
 726 i.mce-i-charmap:before {
 727         content: '\f220';
 728 }
 729
 730 i.mce-i-outdent:before {
 731         content: '\f221';
 732 }
 733
 734 i.mce-i-indent:before {
 735         content: '\f222';
 736 }
 737
 738 i.mce-i-undo:before {
 739         content: '\f171';
 740 }
 741
 742 i.mce-i-redo:before {
 743         content: '\f172';
 744 }
 745
 746 i.mce-i-help:before,
 747 i.mce-i-wp_help:before {
 748         content: '\f223';
 749 }
 750
 751 i.mce-i-wp-media-library:before {
 752         content: '\f104';
 753 }
 754
 755 i.mce-i-ltr:before {
 756         content: '\f320';
 757 }
 758
 759 i.mce-i-wp_page:before {
 760         content: '\f105';
 761 }
 762
 763 i.mce-i-hr:before {
 764         content: '\f460';
 765 }
 766
 767 .mce-close:before {
 768         content: '\f158';
 769 }
 770
 771 .mce-i-wp_code:before {
 772         content: '\f475';
 773 }
 774
 775 /* Editors */
 776 .wp-editor-wrap {
 777         position: relative;
 778 }
 779
 780 .wp-editor-tools {
 781         position: relative;
 782         z-index: 1;
 783 }
 784
 785 .wp-editor-tools:after {
 786         clear: both;
 787         content: '';
 788         display: table;
 789 }
 790
 791 .wp-editor-container {
 792         clear: both;
 793 }
 794
 795 .wp-editor-area {
 796         font-family: Consolas, Monaco, monospace;
 797         font-size: 13px;
 798         padding: 10px;
 799         margin: 1px 0 0;
 800         line-height: 150%;
 801         border: 0 none;
 802         outline: none;
 803         display: block;
 804         resize: vertical;
 805         -webkit-box-sizing: border-box;
 806         -moz-box-sizing: border-box;
 807         box-sizing: border-box;
 808 }
 809
 810 .wp-editor-container textarea.wp-editor-area {
 811         width: 100%;
 812         margin: 0;
 813         -webkit-box-shadow: none;
 814         box-shadow: none;
 815 }
 816
 817 .wp-editor-tabs {
 818         float: right;
 819 }
 820
 821 .wp-switch-editor {
 822         background: #ebebeb;
 823         border: 1px solid #dedede;
 824         color: #777;
 825         cursor: pointer;
 826         float: right;
 827         font: 13px/19px "Open Sans", sans-serif;
 828         height: 19px;
 829         margin: 5px 0 0 5px;
 830         padding: 3px 8px 4px;
 831         position: relative;
 832         top: 1px;
 833 }
 834
 835 .wp-switch-editor:active {
 836         background-color: #f1f1f1;
 837 }
 838
 839 .wp-switch-editor:hover {
 840         text-decoration: none !important;
 841         background: #fff;
 842 }
 843
 844 .js .tmce-active .wp-editor-area {
 845         color: white;
 846 }
 847
 848 .tmce-active .quicktags-toolbar {
 849          display: none;
 850 }
 851
 852 .tmce-active .switch-tmce,
 853 .html-active .switch-html {
 854         background: #f5f5f5;
 855         color: #555;
 856         height: 20px;
 857         border-bottom: none;
 858 }
 859
 860 .wp-media-buttons {
 861         float: left;
 862 }
 863
 864 .wp-media-buttons .button {
 865         margin-right: 5px;
 866         margin-bottom: 4px;
 867         padding-left: 7px;
 868         padding-right: 7px;
 869 }
 870
 871 .wp-media-buttons .button:active {
 872         position: relative;
 873         top: 1px;
 874         margin-top: -1px;
 875         margin-bottom: 1px;
 876 }
 877
 878 .wp-media-buttons .insert-media {
 879         padding-left: 5px;
 880 }
 881
 882 .wp-media-buttons a {
 883         text-decoration: none;
 884         color: #464646;
 885         font-size: 12px;
 886 }
 887
 888 .wp-media-buttons img {
 889         padding: 0 4px;
 890         vertical-align: middle;
 891 }
 892
 893 .wp-media-buttons span.wp-media-buttons-icon {
 894         display: inline-block;
 895         width: 18px;
 896         height: 18px;
 897         vertical-align: text-top;
 898         margin: 0 2px;
 899 }
 900
 901 .wp-media-buttons .add_media span.wp-media-buttons-icon {
 902         background: none;
 903 }
 904
 905 .wp-media-buttons .add_media span.wp-media-buttons-icon:before {
 906         font: normal 18px/1 'dashicons';
 907         speak: none;
 908         -webkit-font-smoothing: antialiased;
 909         -moz-osx-font-smoothing: grayscale;
 910 }
 911
 912 .wp-media-buttons .add_media span.wp-media-buttons-icon:before {
 913         content: '\f104';
 914 }
 915
 916 /* Quicktags */
 917 .quicktags-toolbar {
 918         padding: 3px;
 919         position: relative;
 920         border-bottom: 1px solid #dedede;
 921         background: #f5f5f5;
 922 }
 923
 924 .has-dfw .quicktags-toolbar {
 925         padding-right: 35px;
 926 }
 927
 928 .wp-core-ui .quicktags-toolbar input.button.button-small {
 929         margin: 2px;
 930 }
 931
 932 .quicktags-toolbar input[value="link"] {
 933         text-decoration: underline;
 934 }
 935
 936 .quicktags-toolbar input[value="del"] {
 937         text-decoration: line-through;
 938 }
 939
 940 .quicktags-toolbar input[value="i"] {
 941         font-style: italic;
 942 }
 943
 944 .quicktags-toolbar input[value="b"] {
 945         font-weight: bold;
 946 }
 947
 948 .mce-toolbar .mce-btn-group .mce-btn.mce-wp-fullscreen,
 949 .qt-fullscreen {
 950         position: absolute;
 951         top: 0;
 952         right: 0;
 953         margin: 5px 5px 0 0;
 954 }
 955
 956 @media screen and ( max-width: 782px ) {
 957         .mce-toolbar .mce-btn button,
 958         .qt-fullscreen {
 959                 padding: 6px 7px;
 960         }
 961
 962         #wp-fullscreen-buttons .mce-btn,
 963         .mce-toolbar .mce-btn-group .mce-btn {
 964                 margin: 1px;
 965         }
 966
 967         .qt-fullscreen {
 968                 width: 36px;
 969                 height: 34px;
 970         }
 971
 972         .mce-toolbar .mce-btn-group .mce-btn.mce-wp-fullscreen {
 973                 margin: 4px 4px 0 0;
 974         }
 975
 976         .mce-toolbar .mce-colorbutton .mce-preview {
 977                 left: 8px;
 978                 bottom: 6px;
 979         }
 980
 981         .mce-window .mce-btn {
 982                 padding: 2px 0;
 983         }
 984
 985         .has-dfw div.mce-toolbar-grp .mce-toolbar.mce-first,
 986         .has-dfw .quicktags-toolbar {
 987                 padding-right: 40px;
 988         }
 989 }
 990
 991 @media screen and ( min-width: 782px ) {
 992         .wp-core-ui .quicktags-toolbar input.button.button-small {
 993                 /* .button-small is normaly 11px, but a bit too small for these buttons. */
 994                 font-size: 12px;
 995                 height: 26px;
 996                 line-height: 24px;
 997         }
 998 }
 999
1000 #wp_editbtns,
1001 #wp_gallerybtns {
1002         padding: 2px;
1003         position: absolute;
1004         display: none;
1005         z-index: 100020;
1006 }
1007
1008 #wp_editimgbtn,
1009 #wp_delimgbtn,
1010 #wp_editgallery,
1011 #wp_delgallery {
1012         border-color: #999;
1013         background-color: #eee;
1014         margin: 2px;
1015         padding: 2px;
1016         border-width: 1px;
1017         border-style: solid;
1018         -webkit-border-radius: 3px;
1019         border-radius: 3px;
1020 }
1021
1022 #wp_editimgbtn:hover,
1023 #wp_delimgbtn:hover,
1024 #wp_editgallery:hover,
1025 #wp_delgallery:hover {
1026         border-color: #555;
1027         background-color: #ccc;
1028 }
1029
1030 /*------------------------------------------------------------------------------
1031  wp-link
1032 ------------------------------------------------------------------------------*/
1033
1034 #wp-link-wrap {
1035         display: none;
1036         background-color: #fff;
1037         -webkit-box-shadow: 0 3px 6px rgba( 0, 0, 0, 0.3 );
1038         box-shadow: 0 3px 6px rgba( 0, 0, 0, 0.3 );
1039         width: 500px;
1040         height: 250px;
1041         overflow: hidden;
1042         margin-left: -250px;
1043         margin-top: -125px;
1044         position: fixed;
1045         top: 50%;
1046         left: 50%;
1047         z-index: 100105;
1048         -webkit-transition: height 0.2s, margin-top 0.2s;
1049         transition: height 0.2s, margin-top 0.2s;
1050 }
1051
1052 #wp-link-backdrop {
1053         display: none;
1054         position: fixed;
1055         top: 0;
1056         left: 0;
1057         right: 0;
1058         bottom: 0;
1059         min-height: 360px;
1060         background: #000;
1061         opacity: 0.7;
1062         filter: alpha(opacity=70);
1063         z-index: 100100;
1064 }
1065
1066 #wp-link {
1067         position: relative;
1068         height: 100%;
1069 }
1070
1071 #wp-link-wrap.search-panel-visible {
1072         height: 500px;
1073         margin-top: -250px;
1074 }
1075
1076 #link-modal-title {
1077         background: #fcfcfc;
1078         border-bottom: 1px solid #dfdfdf;
1079         height: 36px;
1080         font-size: 18px;
1081         font-weight: 600;
1082         line-height: 36px;
1083         padding: 0 36px 0 16px;
1084         top: 0;
1085         right: 0;
1086         left: 0;
1087 }
1088
1089 #wp-link-close {
1090         color: #666;
1091         padding: 0;
1092         position: absolute;
1093         top: 0;
1094         right: 0;
1095         width: 36px;
1096         height: 36px;
1097         text-align: center;
1098         background: none;
1099         border: none;
1100         cursor: pointer;
1101 }
1102
1103 #wp-link-close:before {
1104         font: normal 20px/36px 'dashicons';
1105         vertical-align: top;
1106         speak: none;
1107         -webkit-font-smoothing: antialiased;
1108         -moz-osx-font-smoothing: grayscale;
1109         width: 36px;
1110         height: 36px;
1111         content: '\f158';
1112 }
1113
1114 #wp-link-close:hover,
1115 #wp-link-close:focus {
1116         color: #2ea2cc;
1117 }
1118
1119 #wp-link-close:focus {
1120         outline: none;
1121         -webkit-box-shadow:
1122                 0 0 0 1px #5b9dd9,
1123                 0 0 2px 1px rgba(30, 140, 190, .8);
1124         box-shadow:
1125                 0 0 0 1px #5b9dd9,
1126                 0 0 2px 1px rgba(30, 140, 190, .8);
1127 }
1128
1129 #link-selector {
1130         padding: 0 16px 50px;
1131 }
1132
1133 #wp-link-wrap.search-panel-visible #link-selector {
1134         padding: 0 16px;
1135         position: absolute;
1136         top: 36px;
1137         left: 0;
1138         right: 0;
1139         bottom: 44px;
1140 }
1141
1142 #wp-link ol,
1143 #wp-link ul {
1144         list-style: none;
1145         margin: 0;
1146         padding: 0;
1147 }
1148
1149 #wp-link-search-toggle:after {
1150         display: inline-block;
1151         font: normal 20px/1 'dashicons';
1152         vertical-align: top;
1153         speak: none;
1154         -webkit-font-smoothing: antialiased;
1155         -moz-osx-font-smoothing: grayscale;
1156         content: '\f140';
1157 }
1158
1159 .search-panel-visible #wp-link-search-toggle:after {
1160         content: '\f142';
1161 }
1162
1163 #wp-link input[type="text"] {
1164         -webkit-box-sizing: border-box;
1165         -moz-box-sizing: border-box;
1166         box-sizing: border-box;
1167 }
1168
1169 #wp-link #link-options {
1170         padding: 8px 0 12px;
1171 }
1172
1173 #wp-link p.howto {
1174         margin: 3px 0;
1175 }
1176
1177 #wp-link p.howto a {
1178         text-decoration: none;
1179         color: inherit;
1180 }
1181
1182 #wp-link-search-toggle {
1183         cursor: pointer;
1184 }
1185
1186 #wp-link label input[type="text"] {
1187         margin-top: 5px;
1188         width: 70%;
1189 }
1190
1191 #wp-link #link-options label span,
1192 #wp-link #search-panel label span.search-label {
1193         display: inline-block;
1194         width: 80px;
1195         text-align: right;
1196         padding-right: 5px;
1197         max-width: 24%;
1198 }
1199
1200 #wp-link .link-search-field {
1201         float: left;
1202         width: 250px;
1203         max-width: 70%;
1204 }
1205
1206 #wp-link .link-search-wrapper {
1207         margin: 5px 0 9px;
1208         display: block;
1209         overflow: hidden;
1210 }
1211
1212 #wp-link .link-search-wrapper span {
1213         float: left;
1214         margin-top: 4px;
1215 }
1216
1217 #wp-link .link-search-wrapper .spinner {
1218         display: none;
1219         vertical-align: text-bottom;
1220 }
1221
1222 #wp-link .link-target {
1223         padding: 3px 0 0;
1224         white-space: nowrap;
1225         overflow: hidden;
1226         text-overflow: ellipsis;
1227 }
1228
1229 #wp-link .link-target label {
1230         max-width: 70%;
1231 }
1232
1233 #wp-link .query-results {
1234         border: 1px #dfdfdf solid;
1235         margin: 0;
1236         background: #fff;
1237         overflow: auto;
1238         position: absolute;
1239         left: 16px;
1240         right: 16px;
1241         bottom: 16px;
1242         top: 205px;
1243 }
1244
1245 #wp-link li {
1246         clear: both;
1247         margin-bottom: 0;
1248         border-bottom: 1px solid #f1f1f1;
1249         color: #333;
1250         padding: 4px 6px 4px 10px;
1251         cursor: pointer;
1252         position: relative;
1253 }
1254
1255 #wp-link .query-notice {
1256         padding: 0;
1257         border-bottom: 1px solid #dfdfdf;
1258         background-color: #f7fcfe;
1259         color: #000;
1260 }
1261
1262 #wp-link .query-notice .query-notice-default,
1263 #wp-link .query-notice .query-notice-hint {
1264         display: block;
1265         padding: 6px;
1266         border-left: 4px solid #2ea2cc;
1267 }
1268
1269 #wp-link .unselectable.no-matches-found {
1270         padding: 0;
1271         border-bottom: 1px solid #dfdfdf;
1272         background-color: #fef7f1;
1273 }
1274
1275 #wp-link .no-matches-found .item-title {
1276         display: block;
1277         padding: 6px;
1278         border-left: 4px solid #d54e21;
1279 }
1280
1281 #wp-link .query-results em {
1282         font-style: normal;
1283 }
1284
1285 #wp-link li:hover {
1286         background: #eaf2fa;
1287         color: #151515;
1288 }
1289
1290 #wp-link li.unselectable {
1291         border-bottom: 1px solid #dfdfdf;
1292 }
1293
1294 #wp-link li.unselectable:hover {
1295         background: #fff;
1296         cursor: auto;
1297         color: #333;
1298 }
1299
1300 #wp-link li.selected {
1301         background: #ddd;
1302         color: #333;
1303 }
1304
1305 #wp-link li.selected .item-title {
1306         font-weight: bold;
1307 }
1308
1309 #wp-link li:last-child {
1310         border: none;
1311 }
1312
1313 #wp-link .item-title {
1314         display: inline-block;
1315         width: 80%;
1316         width: -webkit-calc(100% - 68px);
1317         width: calc(100% - 68px);
1318 }
1319
1320 #wp-link .item-info {
1321         text-transform: uppercase;
1322         color: #666;
1323         font-size: 11px;
1324         position: absolute;
1325         right: 5px;
1326         top: 5px;
1327 }
1328
1329 #wp-link #search-results,
1330 #wp-link #search-panel {
1331         display: none;
1332 }
1333
1334 #wp-link-wrap.search-panel-visible #search-panel {
1335         display: block;
1336 }
1337
1338 #wp-link .river-waiting {
1339         display: none;
1340         padding: 10px 0;
1341 }
1342
1343 #wp-link .river-waiting .spinner {
1344         margin: 0 auto;
1345         display: block;
1346         float: none;
1347 }
1348
1349 #wp-link .submitbox {
1350         padding: 8px 16px;
1351         background: #fcfcfc;
1352         border-top: 1px solid #dfdfdf;
1353         position: absolute;
1354         bottom: 0;
1355         left: 0;
1356         right: 0;
1357 }
1358
1359 #wp-link-cancel {
1360         line-height: 25px;
1361         float: left;
1362 }
1363
1364 #wp-link-update {
1365         line-height: 23px;
1366         float: right;
1367 }
1368
1369 #wp-link-submit {
1370         float: right;
1371         margin-bottom: 0;
1372 }
1373
1374 @media screen and ( max-width: 782px ) {
1375         #wp-link-wrap {
1376                 height: 280px;
1377                 margin-top: -140px;
1378         }
1379
1380         #wp-link-wrap.search-panel-visible .query-results {
1381                 top: 235px;
1382         }
1383
1384         #link-selector {
1385                 padding: 0 16px 60px;
1386         }
1387
1388         #wp-link-wrap.search-panel-visible #link-selector {
1389                 bottom: 52px;
1390         }
1391
1392         #wp-link-cancel {
1393                 line-height: 32px;
1394         }
1395 }
1396
1397 @media screen and ( max-width: 520px ) {
1398         #wp-link-wrap {
1399                 width: auto;
1400                 margin-left: 0;
1401                 left: 10px;
1402                 right: 10px;
1403                 max-width: 500px;
1404         }
1405 }
1406
1407 @media screen and ( max-height: 520px ) {
1408         #wp-link-wrap {
1409                 -webkit-transition: none;
1410                 transition: none;
1411         }
1412
1413         #wp-link-wrap.search-panel-visible {
1414                 height: auto;
1415                 margin-top: 0;
1416                 top: 10px;
1417                 bottom: 10px;
1418         }
1419
1420         .search-panel-visible #link-selector {
1421                 overflow: auto;
1422         }
1423
1424         .search-panel-visible #search-panel .query-results {
1425                 position: static;
1426         }
1427 }
1428
1429 @media screen and ( max-height: 290px ) {
1430         #wp-link-wrap {
1431                 height: auto;
1432                 margin-top: 0;
1433                 top: 10px;
1434                 bottom: 10px;
1435         }
1436
1437         #link-selector {
1438                 overflow: auto;
1439                 height: -webkit-calc(100% - 92px);
1440                 height: calc(100% - 92px);
1441                 padding-bottom: 2px;
1442         }
1443
1444         #search-panel .query-results {
1445                 position: static;
1446         }
1447 }
1448
1449 /* Old TinyMCE 3.x modal */
1450 /*
1451 .clearlooks2 .mceTop {
1452         border-bottom: 1px solid #ccc;
1453 }
1454
1455 .clearlooks2 .mceTop span {
1456         font: 13px/24px "Open Sans", sans-serif;
1457         color: #e5e5e5;
1458 }
1459
1460 .clearlooks2 .mceTop .mceLeft {
1461         background: #444444;
1462         border-color: transparent;
1463 }
1464
1465 .clearlooks2 .mceTop .mceRight {
1466         background: #444444;
1467         border-color: transparent;
1468 }
1469
1470 .clearlooks2 .mceMiddle {
1471         clip: rect(24px auto auto auto);
1472 }
1473
1474 .clearlooks2 .mceMiddle .mceLeft {
1475         background: #f1f1f1;
1476         border-color: transparent;
1477 }
1478
1479 .clearlooks2 .mceMiddle .mceRight {
1480         background: #f1f1f1;
1481         border-color: transparent;
1482 }
1483
1484 .clearlooks2 .mceBottom {
1485         background: #f1f1f1;
1486         border-color: transparent;
1487 }
1488
1489 .clearlooks2 .mceBottom .mceLeft {
1490         background: #f1f1f1;
1491         border-color: transparent;
1492 }
1493
1494 .clearlooks2 .mceBottom .mceCenter {
1495         background: #f1f1f1;
1496         border-color: transparent;
1497 }
1498
1499 .clearlooks2 .mceBottom .mceRight {
1500         background: #f1f1f1;
1501         border-color: transparent;
1502 }
1503
1504 .clearlooks2 .mceClose,
1505 .clearlooks2 .mceFocus .mceClose,
1506 .clearlooks2 .mceFocus .mceClose:hover {
1507         background-image: none;
1508 }
1509 .clearlooks2 .mceClose:before {
1510         content: '\f158';
1511         font: normal 20px/1 'dashicons';
1512         speak: none;
1513         -webkit-font-smoothing: antialiased;
1514         -moz-osx-font-smoothing: grayscale;
1515         color: #999;
1516         padding-left: 12px;
1517 }
1518
1519 /* from colors.css
1520 .clearlooks2 {
1521         box-shadow: 0 5px 15px rgba(0,0,0,0.7);
1522 }
1523
1524 .clearlooks2 .mceMiddle span,
1525 .clearlooks2 .mceMiddle .mceLeft,
1526 .clearlooks2 .mceMiddle .mceRight,
1527 .clearlooks2 .mceBottom,
1528 .clearlooks2 .mceBottom .mceLeft,
1529 .clearlooks2 .mceBottom .mceCenter,
1530 .clearlooks2 .mceBottom .mceRight {
1531         background-color: #fcfcfc;
1532 }
1533
1534 .clearlooks2 .mceTop span,
1535 .clearlooks2 .mceFocus .mceTop span {
1536         color: #222;
1537 }
1538
1539 .clearlooks2 .mceClose:before {
1540         color: #999;
1541 }
1542
1543 .clearlooks2 .mceClose:hover:before {
1544         color: #2ea2cc;
1545 }
1546 */
1547 /* Distraction Free Writing mode
1548  * =Overlay Styles
1549 -------------------------------------------------------------- */
1550 .fullscreen-overlay {
1551         z-index: 100005;
1552         display: none;
1553         position: fixed;
1554         top: 0;
1555         bottom: 0;
1556         left: 0;
1557         right: 0;
1558         -webkit-filter: inherit;
1559         filter: inherit;
1560 }
1561
1562 .wp-fullscreen-active .fullscreen-overlay,
1563 .wp-fullscreen-active #wp-fullscreen-body {
1564         display: block;
1565 }
1566
1567 .fullscreen-fader {
1568         z-index: 200000;
1569 }
1570
1571 .wp-fullscreen-active .fullscreen-fader,
1572 .wp-core-ui.wp-fullscreen-active .postbox-container {
1573         display: none;
1574 }
1575
1576 /* =Overlay Body
1577 -------------------------------------------------------------- */
1578
1579 #wp-fullscreen-body,
1580 .mce-fullscreen {
1581         z-index: 100010;
1582 }
1583
1584 #wp-fullscreen-body {
1585         display: none;
1586 }
1587
1588 .wp-fullscreen-wrap {
1589         margin: 0;
1590         padding: 0;
1591         position: absolute;
1592         left: 0;
1593         right: 0;
1594         bottom: 30px;
1595         top: 60px;
1596         z-index: 100015;
1597 }
1598
1599 .wp-fullscreen-wrap .wp-editor-container,
1600 .wp-fullscreen-title,
1601 #wp-fullscreen-central-toolbar {
1602         -webkit-box-sizing: border-box;
1603         -moz-box-sizing: border-box;
1604         box-sizing: border-box;
1605         max-width: 100%;
1606 }
1607
1608 .wp-fullscreen-active .wp-editor-tools,
1609 .wp-fullscreen-active .quicktags-toolbar,
1610 .wp-fullscreen-active .mce-toolbar-grp,
1611 .wp-fullscreen-active .mce-statusbar {
1612         display: none;
1613 }
1614
1615 #wp-fullscreen-statusbar {
1616         position: fixed;
1617         left: 0;
1618         right: 0;
1619         bottom: 0;
1620         height: 30px;
1621         z-index: 100020;
1622         background: #fff;
1623         -webkit-transition: height 0.2s;
1624         transition: height 0.2s;
1625 }
1626
1627 #wp-fullscreen-status {
1628         margin: 0 auto;
1629         padding: 0;
1630 }
1631
1632 .wp-fullscreen-active .wp-fullscreen-title,
1633 .wp-fullscreen-active .wp-fullscreen-title:focus,
1634 .wp-fullscreen-active .wp-editor-container {
1635         -webkit-border-radius: 0;
1636         border-radius: 0;
1637         border: 1px dashed transparent;
1638         background: transparent;
1639         -webkit-box-shadow: none;
1640         box-shadow: none;
1641         -webkit-transition: border-color 0.4s;
1642         transition: border-color 0.4s;
1643 }
1644
1645 .wp-fullscreen-active .wp-editor-container {
1646         margin: 0 auto 40px;
1647 }
1648
1649 .wp-fullscreen-active .wp-fullscreen-title {
1650         font-size: 1.7em;
1651         line-height: 100%;
1652         outline: medium none;
1653         padding: 3px 7px;
1654         margin: 10px auto 30px;
1655         display: block;
1656 }
1657
1658 #wp-fullscreen-tagline {
1659         color: #888;
1660         font-size: 18px;
1661         float: right;
1662         padding: 4px 0 0;
1663 }
1664
1665 /* =Top bar
1666 -------------------------------------------------------------- */
1667 #fullscreen-topbar {
1668         background: #f5f5f5;
1669         border-bottom: 1px solid #dedede;
1670         height: 45px;
1671         position: fixed;
1672         left: 0;
1673         right: 0;
1674         top: 0;
1675         width: 100%;
1676         z-index: 100020;
1677         -webkit-transition: opacity 0.4s;
1678         transition: opacity 0.4s;
1679 }
1680
1681 #wp-fullscreen-toolbar {
1682         padding: 6px 10px 0;
1683         clear: both;
1684         max-width: 1100px;
1685         margin: 0 auto;
1686 }
1687
1688 #wp-fullscreen-mode-bar,
1689 #wp-fullscreen-button-bar,
1690 #wp-fullscreen-close {
1691         float: left;
1692 }
1693
1694 #wp-fullscreen-count,
1695 #wp-fullscreen-tagline {
1696         display: inline-block;
1697 }
1698
1699 #wp-fullscreen-button-bar {
1700         margin-top: 2px;
1701 }
1702
1703 #wp-fullscreen-save {
1704         float: right;
1705         padding: 2px 0 0;
1706         min-width: 95px;
1707 }
1708
1709 #wp-fullscreen-count,
1710 #wp-fullscreen-close {
1711         padding: 5px 0 0;
1712 }
1713
1714 #wp-fullscreen-central-toolbar {
1715         margin: auto;
1716         padding: 0;
1717         min-width: 620px;
1718 }
1719
1720 #wp-fullscreen-buttons > div {
1721         float: left;
1722 }
1723
1724 #wp-fullscreen-mode-bar {
1725         padding: 3px 14px 0 0;
1726 }
1727
1728 #wp-fullscreen-buttons .hidden {
1729         display: none;
1730 }
1731
1732 #wp-fullscreen-buttons .disabled {
1733         opacity: 0.5;
1734 }
1735
1736 #wp-fullscreen-buttons .mce-btn button {
1737     margin: 0;
1738     outline: 0 none;
1739     border: 0 none;
1740     white-space: nowrap;
1741     width: auto;
1742     background: none;
1743         color: #333333;
1744     cursor: pointer;
1745     font-size: 18px;
1746     line-height: 20px;
1747     overflow: visible;
1748     text-align: center;
1749     -webkit-box-sizing: border-box;
1750     -moz-box-sizing: border-box;
1751     box-sizing: border-box;
1752 }
1753
1754 .wp-html-mode #wp-fullscreen-buttons div {
1755         display: none;
1756 }
1757
1758 .wp-html-mode #wp-fullscreen-buttons div.wp-fullscreen-both {
1759         display: block;
1760 }
1761
1762 #wp-fullscreen-save img {
1763         vertical-align: middle;
1764 }
1765
1766 #wp-fullscreen-save span {
1767         display: none;
1768         margin: 5px 6px 0;
1769         float: left;
1770 }
1771
1772 /* =Thickbox Adjustments
1773 -------------------------------------------------------------- */
1774 .wp-fullscreen-active #TB_overlay {
1775         z-index: 100050;
1776 }
1777
1778 .wp-fullscreen-active #TB_window {
1779         z-index: 100051;
1780 }
1781
1782 /* Colors */
1783 .fullscreen-overlay {
1784         background: #fff;
1785 }
1786
1787 /* =CSS 3 transitions
1788 -------------------------------------------------------------- */
1789
1790 .wp-fullscreen-active #fullscreen-topbar {
1791         -webkit-transition-duration: 0.8s;
1792         transition-duration: 0.8s;
1793         opacity: 0;
1794         filter: alpha(opacity=0);
1795 }
1796
1797 .wp-fullscreen-active #wp-fullscreen-statusbar {
1798         height: 0;
1799 }
1800
1801 .wp-fullscreen-active.wp-dfw-show-ui #fullscreen-topbar {
1802         -webkit-transition-duration: 0.4s;
1803         transition-duration: 0.4s;
1804         opacity: 1;
1805         filter: alpha(opacity=100);
1806 }
1807
1808 .wp-fullscreen-active.wp-dfw-show-ui #wp-fullscreen-statusbar {
1809         height: 29px;
1810         background: #f8f8f8;
1811         border-top: 1px solid #eee;
1812 }
1813
1814 .wp-fullscreen-active .wp-fullscreen-title,
1815 .wp-fullscreen-active .wp-editor-container {
1816         -webkit-transition-duration: 0.8s;
1817         transition-duration: 0.8s;
1818         border-color: transparent;
1819 }
1820
1821 .wp-fullscreen-active.wp-dfw-show-ui .wp-fullscreen-title,
1822 .wp-fullscreen-active.wp-dfw-show-ui .wp-editor-container {
1823         -webkit-transition-duration: 0.4s;
1824         transition-duration: 0.4s;
1825         border-color: #ccc;
1826 }
1827
1828 .fade-1000,
1829 .fade-600,
1830 .fade-400,
1831 .fade-300 {
1832         opacity: 0;
1833         -webkit-transition-property: opacity;
1834         transition-property: opacity;
1835 }
1836
1837 .fade-1000 {
1838         -webkit-transition-duration: 1s;
1839         transition-duration: 1s;
1840 }
1841
1842 .fade-600 {
1843         -webkit-transition-duration: 0.6s;
1844         transition-duration: 0.6s;
1845 }
1846
1847 .fade-400 {
1848         -webkit-transition-duration: 0.4s;
1849         transition-duration: 0.4s;
1850 }
1851
1852 .fade-300 {
1853         -webkit-transition-duration: 0.3s;
1854         transition-duration: 0.3s;
1855 }
1856
1857 .fade-trigger {
1858         opacity: 1;
1859 }
1860
1861 /* DFW on touch screen devices */
1862 .wp-dfw-touch #fullscreen-topbar {
1863         position: absolute;
1864         opacity: 1;
1865 }
1866
1867 .wp-dfw-touch .wp-fullscreen-wrap .wp-editor-container,
1868 .wp-dfw-touch .wp-fullscreen-title {
1869         max-width: 700px;
1870 }
1871
1872 .wp-fullscreen-active.wp-dfw-touch  .wp-fullscreen-title,
1873 .wp-fullscreen-active.wp-dfw-touch .wp-editor-container {
1874         border-color: #ccc;
1875 }
1876
1877 .wp-dfw-touch #wp-fullscreen-statusbar {
1878         height: 30px;
1879 }
1880
1881 @media screen and ( max-width: 782px ) {
1882         #wp-fullscreen-close,
1883         #wp-fullscreen-central-toolbar,
1884         #wp-fullscreen-mode-bar,
1885         #wp-fullscreen-button-bar,
1886         #wp-fullscreen-save {
1887                 display: inline-block;
1888         }
1889
1890         #fullscreen-topbar {
1891                 height: 85px;
1892         }
1893
1894         #wp-fullscreen-central-toolbar {
1895                 width: auto !important;
1896                 min-width: 0;
1897         }
1898
1899         #wp-fullscreen-close {
1900                 line-height: 30px;
1901                 vertical-align: top;
1902                 padding: 0 12px;
1903         }
1904
1905         #wp-fullscreen-button-bar {
1906                 position: absolute;
1907                 top: 45px;
1908                 left: 0;
1909         }
1910
1911         .wp-fullscreen-wrap {
1912                 top: 95px;
1913         }
1914
1915         #wp-fullscreen-save {
1916                 position: absolute;
1917                 right: 10px;
1918         }
1919 }
1920
1921 @media screen and ( max-width: 480px ) {
1922         #wp_fs_help {
1923                 display: none;
1924         }
1925
1926         .wp-fullscreen-wrap .wp-editor-container,
1927         .wp-fullscreen-title {
1928                 width: 480px !important;
1929         }
1930
1931         body.wp-fullscreen-active {
1932                 width: 480px;
1933                 overflow: auto;
1934         }
1935
1936         #fullscreen-topbar,
1937         .wp-fullscreen-wrap {
1938                 width: 480px;
1939         }
1940
1941         #fullscreen-topbar {
1942                 position: absolute;
1943         }
1944
1945         #wp-fullscreen-status {
1946                 width: auto !important;
1947                 max-width: 100%;
1948                 padding: 0 10px;
1949         }
1950 }
1951
1952 /* =Localization
1953 -------------------------------------------------------------- */
1954 .rtl .wp-switch-editor,
1955 .rtl .quicktags-toolbar input {
1956         font-family: Tahoma, sans-serif;
1957 }
1958
1959 /* @noflip */
1960 .mce-rtl .mce-flow-layout .mce-flow-layout-item > div {
1961         direction: rtl;
1962 }
1963
1964 /* @noflip */
1965 .mce-rtl .mce-listbox i.mce-caret {
1966         left: 6px;
1967 }
1968
1969 html:lang(he-il) .rtl .wp-switch-editor,
1970 html:lang(he-il) .rtl .quicktags-toolbar input  {
1971         font-family: Arial, sans-serif;
1972 }
1973
1974 /* HiDPI */
1975 @media print,
1976   (-o-min-device-pixel-ratio: 5/4),
1977   (-webkit-min-device-pixel-ratio: 1.25),
1978   (min-resolution: 120dpi) {
1979         .wp-media-buttons .add_media span.wp-media-buttons-icon,
1980         #wp-fullscreen-buttons #wp_fs_image span.mce_image {
1981                 background: none;
1982         }
1983 }
1984
1985 /* TODO: DFW responsive */