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