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