wp-admin/css/common-rtl.css

   1 /* 2 column liquid layout */
   2 #wpwrap {
   3         height: auto;
   4         min-height: 100%;
   5         width: 100%;
   6         position: relative;
   7         -webkit-font-smoothing: subpixel-antialiased;
   8 }
   9
  10 #wpcontent {
  11         height: 100%;
  12         padding-right: 20px;
  13 }
  14
  15 #wpcontent,
  16 #wpfooter {
  17         margin-right: 160px;
  18 }
  19
  20 .folded #wpcontent,
  21 .folded #wpfooter {
  22         margin-right: 36px;
  23 }
  24
  25 #wpbody-content {
  26         padding-bottom: 65px;
  27         float: right;
  28         width: 100%;
  29         overflow: visible !important;
  30 }
  31
  32 /* inner 2 column liquid layout */
  33
  34 .inner-sidebar {
  35         float: left;
  36         clear: left;
  37         display: none;
  38         width: 281px;
  39         position: relative;
  40 }
  41
  42 .columns-2 .inner-sidebar {
  43         margin-left: auto;
  44         width: 286px;
  45         display: block;
  46 }
  47
  48 .inner-sidebar #side-sortables,
  49 .columns-2 .inner-sidebar #side-sortables {
  50         min-height: 300px;
  51         width: 280px;
  52         padding: 0;
  53 }
  54
  55 .has-right-sidebar .inner-sidebar {
  56         display: block;
  57 }
  58
  59 .has-right-sidebar #post-body {
  60         float: right;
  61         clear: right;
  62         width: 100%;
  63         margin-left: -2000px;
  64 }
  65
  66 .has-right-sidebar #post-body-content {
  67         margin-left: 300px;
  68         float: none;
  69         width: auto;
  70 }
  71
  72 /* 2 columns main area */
  73
  74 #col-container,
  75 #col-left,
  76 #col-right {
  77         overflow: hidden;
  78         padding: 0;
  79         margin: 0;
  80 }
  81
  82 #col-left {
  83         width: 35%;
  84 }
  85
  86 #col-right {
  87         float: left;
  88         clear: left;
  89         width: 65%;
  90 }
  91
  92 .col-wrap {
  93         padding: 0 7px;
  94 }
  95
  96 /* utility classes */
  97 .alignleft {
  98         float: right;
  99 }
 100
 101 .alignright {
 102         float: left;
 103 }
 104
 105 .textleft {
 106         text-align: right;
 107 }
 108
 109 .textright {
 110         text-align: left;
 111 }
 112
 113 .clear {
 114         clear: both;
 115 }
 116
 117 /* Hide visually but not from screen readers */
 118 .screen-reader-text,
 119 .screen-reader-text span,
 120 .ui-helper-hidden-accessible {
 121         position: absolute;
 122         margin: -1px;
 123         padding: 0;
 124         height: 1px;
 125         width: 1px;
 126         overflow: hidden;
 127         clip: rect(0 0 0 0);
 128         border: 0;
 129         word-wrap: normal !important; /* many screen reader and browser combinations announce broken words as they would appear visually */
 130 }
 131
 132 .screen-reader-shortcut {
 133         position: absolute;
 134         top: -1000em;
 135 }
 136
 137 .screen-reader-shortcut:focus {
 138         right: 6px;
 139         top: -25px;
 140         height: auto;
 141         width: auto;
 142         display: block;
 143         font-size: 14px;
 144         font-weight: 600;
 145         padding: 15px 23px 14px;
 146         background: #f1f1f1;
 147         color: #21759b;
 148         z-index: 100000;
 149         line-height: normal;
 150         -webkit-box-shadow: 0 0 2px 2px rgba(0,0,0,.6);
 151         box-shadow: 0 0 2px 2px rgba(0,0,0,.6);
 152         text-decoration: none;
 153         outline: none;
 154 }
 155
 156 .hidden,
 157 .js .closed .inside,
 158 .js .hide-if-js,
 159 .no-js .hide-if-no-js,
 160 .js.wp-core-ui .hide-if-js,
 161 .js .wp-core-ui .hide-if-js,
 162 .no-js.wp-core-ui .hide-if-no-js,
 163 .no-js .wp-core-ui .hide-if-no-js {
 164         display: none;
 165 }
 166
 167 /* @todo: Take a second look. Large chunks of shared color, from the colors.css merge */
 168 .widget-top,
 169 .menu-item-handle,
 170 .widget-inside,
 171 #menu-settings-column .accordion-container,
 172 #menu-management .menu-edit,
 173 .manage-menus,
 174 table.widefat,
 175 .stuffbox,
 176 p.popular-tags,
 177 .widgets-holder-wrap,
 178 .wp-editor-container,
 179 .popular-tags,
 180 .feature-filter,
 181 .imgedit-group,
 182 .comment-ays {
 183         border: 1px solid #e5e5e5;
 184         -webkit-box-shadow: 0 1px 1px rgba(0,0,0,0.04);
 185         box-shadow: 0 1px 1px rgba(0,0,0,0.04);
 186 }
 187
 188 table.widefat,
 189 .wp-editor-container,
 190 .stuffbox,
 191 p.popular-tags,
 192 .widgets-holder-wrap,
 193 .popular-tags,
 194 .feature-filter,
 195 .imgedit-group,
 196 .comment-ays {
 197         background: #fff;
 198 }
 199
 200 /* general */
 201 html,
 202 body {
 203         height: 100%;
 204         margin: 0;
 205         padding: 0;
 206 }
 207
 208 html {
 209         background: #f1f1f1;
 210 }
 211
 212 body {
 213         color: #444;
 214         font-family: "Open Sans", sans-serif;
 215         font-size: 13px;
 216         line-height: 1.4em;
 217         min-width: 600px;
 218 }
 219
 220 body.iframe {
 221         min-width: 0;
 222         padding-top: 1px;
 223 }
 224
 225 body.modal-open {
 226         overflow: hidden;
 227 }
 228
 229 body.mobile.modal-open #wpwrap {
 230         overflow: hidden;
 231         position: fixed;
 232         height: 100%;
 233 }
 234
 235 iframe,
 236 img {
 237         border: 0;
 238 }
 239
 240 td {
 241         font-family: inherit;
 242         font-size: inherit;
 243         font-weight: inherit;
 244         line-height: inherit;
 245 }
 246
 247 a {
 248         color: #0073aa;
 249         -webkit-transition-property: border, background, color;
 250         transition-property: border, background, color;
 251         -webkit-transition-duration: .05s;
 252         transition-duration: .05s;
 253         -webkit-transition-timing-function: ease-in-out;
 254         transition-timing-function: ease-in-out;
 255 }
 256
 257 a,
 258 div {
 259         outline: 0;
 260 }
 261
 262 a:hover,
 263 a:active {
 264         color: #00a0d2;
 265 }
 266
 267 a:focus,
 268 a:focus .media-icon img {
 269         color: #124964;
 270     -webkit-box-shadow:
 271         0 0 0 1px #5b9dd9,
 272                 0 0 2px 1px rgba(30, 140, 190, .8);
 273     box-shadow:
 274         0 0 0 1px #5b9dd9,
 275                 0 0 2px 1px rgba(30, 140, 190, .8);
 276 }
 277
 278 .ie8 a:focus {
 279         outline: #5b9dd9 solid 1px;
 280 }
 281
 282 #adminmenu a:focus,
 283 .screen-reader-text:focus {
 284         -webkit-box-shadow: none;
 285         box-shadow: none;
 286         outline: none;
 287 }
 288
 289 blockquote,
 290 q {
 291         quotes: none;
 292 }
 293
 294 blockquote:before,
 295 blockquote:after,
 296 q:before,
 297 q:after {
 298         content: '';
 299         content: none;
 300 }
 301
 302 p {
 303         font-size: 13px;
 304         line-height: 1.5;
 305         margin: 1em 0;
 306 }
 307
 308 blockquote {
 309         margin: 1em;
 310 }
 311
 312 li,
 313 dd {
 314         margin-bottom: 6px;
 315 }
 316
 317 h1,
 318 h2,
 319 h3,
 320 h4,
 321 h5,
 322 h6 {
 323         display: block;
 324         font-weight: 600;
 325 }
 326
 327 h1 {
 328         font-size: 2em;
 329         margin: .67em 0;
 330 }
 331
 332 .wrap > h1,
 333 h2 {
 334         color: #23282d;
 335         font-size: 1.5em;
 336         margin: .83em 0;
 337         font-weight: 400;
 338 }
 339
 340 h3 {
 341         color: #23282d;
 342         font-size: 1.3em;
 343         margin: 1em 0;
 344 }
 345
 346 h4 {
 347         font-size: 1em;
 348         margin: 1.33em 0;
 349 }
 350
 351 h5 {
 352         font-size: 0.83em;
 353         margin: 1.67em 0;
 354 }
 355
 356 h6 {
 357         font-size: 0.67em;
 358         margin: 2.33em 0;
 359 }
 360
 361 ul,
 362 ol {
 363         padding: 0;
 364 }
 365
 366 ul {
 367         list-style: none;
 368 }
 369
 370 ol {
 371         list-style-type: decimal;
 372         margin-right: 2em;
 373 }
 374
 375 ul.ul-disc {
 376         list-style: disc outside;
 377 }
 378
 379 ul.ul-square {
 380         list-style: square outside;
 381 }
 382
 383 ol.ol-decimal {
 384         list-style: decimal outside;
 385 }
 386
 387 ul.ul-disc,
 388 ul.ul-square,
 389 ol.ol-decimal {
 390         margin-right: 1.8em;
 391 }
 392
 393 ul.ul-disc > li,
 394 ul.ul-square > li,
 395 ol.ol-decimal > li {
 396         margin: 0 0 0.5em;
 397 }
 398
 399 /* rtl:ignore */
 400 .ltr {
 401         direction: ltr;
 402 }
 403
 404 /* rtl:ignore */
 405 .code,
 406 code {
 407         font-family: Consolas, Monaco, monospace;
 408         direction: ltr;
 409         unicode-bidi: embed;
 410 }
 411
 412 kbd,
 413 code {
 414         padding: 3px 5px 2px 5px;
 415         margin: 0 1px;
 416         background: #eaeaea;
 417         background: rgba(0,0,0,0.07);
 418         font-size: 13px;
 419 }
 420
 421 .subsubsub {
 422         list-style: none;
 423         margin: 8px 0 0;
 424         padding: 0;
 425         font-size: 13px;
 426         float: right;
 427         color: #666;
 428 }
 429
 430 .subsubsub a {
 431         line-height: 2;
 432         padding: .2em;
 433         text-decoration: none;
 434 }
 435
 436 .subsubsub a .count,
 437 .subsubsub a.current .count {
 438         color: #999;
 439         font-weight: normal;
 440 }
 441
 442 .subsubsub a.current {
 443         font-weight: 600;
 444         border: none;
 445 }
 446
 447 .subsubsub li {
 448         display: inline-block;
 449         margin: 0;
 450         padding: 0;
 451         white-space: nowrap;
 452 }
 453
 454 /* .widefat - main style for tables */
 455 .widefat {
 456         border-spacing: 0;
 457         width: 100%;
 458         clear: both;
 459         margin: 0;
 460 }
 461
 462 .widefat * {
 463         word-wrap: break-word;
 464 }
 465
 466 .widefat a {
 467         text-decoration: none;
 468 }
 469
 470 .widefat td,
 471 .widefat th {
 472         padding: 8px 10px;
 473 }
 474
 475 .widefat thead th,
 476 .widefat thead td {
 477         border-bottom: 1px solid #e1e1e1;
 478 }
 479
 480 .widefat tfoot th,
 481 .widefat tfoot td {
 482         border-top: 1px solid #e1e1e1;
 483         border-bottom: none;
 484 }
 485
 486 .widefat .no-items td {
 487         border-bottom-width: 0;
 488 }
 489
 490 .widefat td {
 491         vertical-align: top;
 492 }
 493
 494 .widefat td,
 495 .widefat td p,
 496 .widefat td ol,
 497 .widefat td ul {
 498         font-size: 13px;
 499         line-height: 1.5em;
 500 }
 501
 502 .widefat th,
 503 .widefat thead td,
 504 .widefat tfoot td {
 505         text-align: right;
 506         line-height: 1.3em;
 507         font-size: 14px;
 508 }
 509
 510 .widefat th input,
 511 .widefat thead td input,
 512 .widefat tfoot td input {
 513         margin: 0 8px 0 0;
 514         padding: 0;
 515         vertical-align: text-top;
 516 }
 517
 518 .widefat .check-column {
 519         width: 2.2em;
 520         padding: 6px 0 25px;
 521         vertical-align: top;
 522 }
 523
 524 .widefat th input[type=checkbox],
 525 .widefat thead td input[type=checkbox],
 526 .widefat tfoot td input[type=checkbox] {
 527         margin-top: -1px;
 528 }
 529
 530 .widefat tbody th.check-column {
 531         padding: 9px 0 22px;
 532 }
 533
 534 .widefat thead td.check-column,
 535 .widefat tbody th.check-column,
 536 .widefat tfoot td.check-column {
 537         padding: 11px 3px 0 0;
 538 }
 539
 540 .widefat thead td.check-column,
 541 .widefat tfoot td.check-column {
 542         padding-top: 10px;
 543 }
 544
 545 .update-php div.updated,
 546 .update-php div.error {
 547         margin-right: 0;
 548 }
 549
 550 .no-js .widefat thead .check-column input,
 551 .no-js .widefat tfoot .check-column input {
 552         display: none;
 553 }
 554
 555 .widefat .num,
 556 .column-comments,
 557 .column-links,
 558 .column-posts {
 559         text-align: center;
 560 }
 561
 562 .widefat th#comments {
 563         vertical-align: middle;
 564 }
 565
 566 .wrap {
 567         margin: 10px 2px 0 20px;
 568 }
 569
 570 .wrap h1,
 571 .wrap h2,
 572 .subtitle {
 573         font-weight: normal;
 574         margin: 0;
 575 }
 576
 577 .wrap h1,
 578 .wrap h2 {
 579         font-size: 23px;
 580         font-weight: 400;
 581         padding: 9px 0 4px 15px;
 582         line-height: 29px;
 583 }
 584
 585 .subtitle {
 586         color: #777;
 587         font-size: 14px;
 588         padding-right: 25px;
 589 }
 590
 591 .wrap .add-new-h2, /* deprecated */
 592 .wrap .add-new-h2:active, /* deprecated */
 593 .wrap .page-title-action,
 594 .wrap .page-title-action:active {
 595         margin-right: 4px;
 596         padding: 4px 8px;
 597         position: relative;
 598         top: -3px;
 599         text-decoration: none;
 600         border: none;
 601         -webkit-border-radius: 2px;
 602         border-radius: 2px;
 603         background: #e0e0e0;
 604         text-shadow: none;
 605         font-weight: 600;
 606         font-size: 13px;
 607 }
 608
 609 .wrap .add-new-h2:hover, /* deprecated */
 610 .wrap .page-title-action:hover {
 611         background: #00a0d2;
 612         color: #fff;
 613 }
 614
 615 .wrap h1.long-header {
 616         padding-left: 0;
 617 }
 618
 619 .wp-dialog {
 620         background-color: #fff;
 621 }
 622
 623 .widgets-chooser ul,
 624 #widgets-left .widget-in-question .widget-top,
 625 #available-widgets .widget-top:hover,
 626 div#widgets-right .widget-top:hover,
 627 #widgets-left .widget-top:hover {
 628         border-color: #999;
 629         -webkit-box-shadow: 0 1px 2px rgba(0,0,0,0.1);
 630         box-shadow: 0 1px 2px rgba(0,0,0,0.1);
 631 }
 632
 633 .sorthelper {
 634         background-color: #ccf3fa;
 635 }
 636
 637 .ac_match,
 638 .subsubsub a.current {
 639         color: #000;
 640 }
 641
 642 .striped > tbody > :nth-child(odd),
 643 ul.striped > :nth-child(odd),
 644 .alternate {
 645         background-color: #f9f9f9;
 646 }
 647
 648 .bar {
 649         background-color: #e8e8e8;
 650         border-left-color: #99d;
 651 }
 652
 653 .media-upload-form label.form-help,
 654 td.help {
 655         color: #9a9a9a;
 656 }
 657
 658 /* Helper classes for plugins to leverage the active WordPress color scheme */
 659
 660 .highlight {
 661         background-color: #e4f2fd;
 662         color: #000;
 663 }
 664
 665 .wp-ui-primary {
 666         color: #fff;
 667         background-color: #32373c;
 668 }
 669 .wp-ui-text-primary {
 670         color: #32373c;
 671 }
 672
 673 .wp-ui-highlight {
 674         color: white;
 675         background-color: #1e8cbe;
 676 }
 677 .wp-ui-text-highlight {
 678         color: #1e8cbe;
 679 }
 680
 681 .wp-ui-notification {
 682         color: #fff;
 683         background-color: #d54e21;
 684 }
 685 .wp-ui-text-notification {
 686         color: #d54e21;
 687 }
 688
 689 .wp-ui-text-icon {
 690         color: #999;
 691 }
 692
 693 /* For emoji replacement images */
 694 img.emoji {
 695         display: inline !important;
 696         border: none !important;
 697         height: 1em !important;
 698         width: 1em !important;
 699         margin: 0 .07em !important;
 700         vertical-align: -0.1em !important;
 701         background: none !important;
 702         padding: 0 !important;
 703         -webkit-box-shadow: none !important;
 704         box-shadow: none !important;
 705 }
 706
 707 /*------------------------------------------------------------------------------
 708   1.0 - Text Styles
 709 ------------------------------------------------------------------------------*/
 710
 711 .widget .widget-top,
 712 .postbox .hndle,
 713 .stuffbox .hndle,
 714 .control-section .accordion-section-title,
 715 .sidebar-name,
 716 #nav-menu-header,
 717 #nav-menu-footer,
 718 .menu-item-handle,
 719 .checkbox,
 720 .side-info,
 721 #your-profile #rich_editing,
 722 .widefat thead th,
 723 .widefat thead td,
 724 .widefat tfoot th,
 725 .widefat tfoot td {
 726         line-height: 1.4em;
 727 }
 728
 729 .widget .widget-top,
 730 .menu-item-handle {
 731         background: #fafafa;
 732         color: #23282d;
 733 }
 734
 735 .postbox .hndle,
 736 .stuffbox .hndle {
 737         border-bottom: 1px solid #eee;
 738 }
 739
 740 .quicktags,
 741 .search {
 742         background-color: #ccc;
 743         color: #000;
 744         font-size: 12px;
 745 }
 746
 747 .icon32 {
 748         display: none;
 749 }
 750
 751 /* @todo can we combine these into a class or use an existing dashicon one? */
 752 .welcome-panel .welcome-panel-close:before,
 753 .tagchecklist span a:before,
 754 #bulk-titles div a:before,
 755 .notice-dismiss:before {
 756         background: none;
 757         color: #b4b9be;
 758         content: '\f153';
 759         display: block;
 760         font: normal 16px/20px 'dashicons';
 761         speak: none;
 762         height: 20px;
 763         text-align: center;
 764         width: 20px;
 765         -webkit-font-smoothing: antialiased;
 766         -moz-osx-font-smoothing: grayscale;
 767 }
 768
 769 .welcome-panel .welcome-panel-close:before {
 770         margin: 0;
 771 }
 772
 773 .tagchecklist span a:before,
 774 #bulk-titles div a:before {
 775         margin: 1px 0;
 776 }
 777
 778 .welcome-panel .welcome-panel-close:hover:before,
 779 .welcome-panel .welcome-panel-close:focus:before,
 780 .tagchecklist span a:hover:before,
 781 #bulk-titles div a:hover:before {
 782         color: #c00;
 783 }
 784
 785 .key-labels label {
 786         line-height: 24px;
 787 }
 788
 789 strong, b {
 790         font-weight: 600;
 791 }
 792
 793 .pre {
 794         /* https://developer.mozilla.org/en-US/docs/CSS/white-space */
 795         white-space: pre-wrap; /* css-3 */
 796         word-wrap: break-word; /* IE 5.5 - 7 */
 797 }
 798
 799 .howto {
 800         color: #666;
 801         font-style: italic;
 802         display: block;
 803 }
 804
 805 p.install-help {
 806         margin: 8px 0;
 807         font-style: italic;
 808 }
 809
 810 .no-break {
 811         white-space: nowrap;
 812 }
 813
 814 hr {
 815         border: 0;
 816         border-top: 1px solid #ddd;
 817         border-bottom: 1px solid #fafafa;
 818 }
 819
 820 .row-actions span.delete a,
 821 .row-actions span.trash a,
 822 .row-actions span.spam a,
 823 .plugins a.delete,
 824 #all-plugins-table .plugins a.delete,
 825 #search-plugins-table .plugins a.delete,
 826 .submitbox .submitdelete,
 827 #media-items a.delete,
 828 #media-items a.delete-permanently,
 829 #nav-menu-footer .menu-delete {
 830         color: #a00;
 831 }
 832
 833 abbr.required,
 834 .file-error,
 835 .widget-control-remove:hover,
 836 .row-actions .delete a:hover,
 837 .row-actions .trash a:hover,
 838 .row-actions .spam a:hover,
 839 .plugins a.delete:hover,
 840 #all-plugins-table .plugins a.delete:hover,
 841 #search-plugins-table .plugins a.delete:hover,
 842 .submitbox .submitdelete:hover,
 843 #media-items a.delete:hover,
 844 #media-items a.delete-permanently:hover,
 845 #nav-menu-footer .menu-delete:hover {
 846         color: #f00;
 847         text-decoration: none;
 848         border: none;
 849 }
 850
 851 /*------------------------------------------------------------------------------
 852   3.0 - Actions
 853 ------------------------------------------------------------------------------*/
 854
 855 #major-publishing-actions {
 856         padding: 10px;
 857         clear: both;
 858         border-top: 1px solid #ddd;
 859         background: #f5f5f5;
 860 }
 861
 862 #delete-action {
 863         line-height: 28px;
 864         vertical-align: middle;
 865         text-align: right;
 866         float: right;
 867 }
 868
 869 #publishing-action {
 870         text-align: left;
 871         float: left;
 872         line-height: 23px;
 873 }
 874
 875 #publishing-action .spinner {
 876         float: right;
 877 }
 878
 879 #misc-publishing-actions {
 880         padding: 6px 0 0;
 881 }
 882
 883 .misc-pub-section {
 884         padding: 6px 10px 8px;
 885 }
 886
 887 #minor-publishing-actions {
 888         padding: 10px 10px 0 10px;
 889         text-align: left;
 890 }
 891
 892 #save-post {
 893         float: right;
 894 }
 895
 896 .preview {
 897         float: left;
 898 }
 899
 900 #sticky-span {
 901         margin-right: 18px;
 902 }
 903
 904 .side-info {
 905         margin: 0;
 906         padding: 4px;
 907         font-size: 11px;
 908 }
 909
 910 .side-info h5 {
 911         padding-bottom: 7px;
 912         font-size: 14px;
 913         margin: 12px 2px 5px;
 914         border-bottom: 1px solid #dadada;
 915 }
 916
 917 .side-info ul {
 918         margin: 0;
 919         padding-right: 18px;
 920         list-style: square;
 921         color: #666;
 922 }
 923
 924 .approve,
 925 .unapproved .unapprove {
 926         display: none;
 927 }
 928
 929 .unapproved .approve,
 930 .spam .approve,
 931 .trash .approve {
 932         display: inline;
 933 }
 934
 935 td.action-links,
 936 th.action-links {
 937         text-align: left;
 938 }
 939
 940 /* Filter bar */
 941 .wp-filter {
 942         display: inline-block;
 943         position: relative;
 944         -webkit-box-sizing: border-box;
 945         -moz-box-sizing: border-box;
 946         box-sizing: border-box;
 947         margin: 12px 0 25px;
 948         padding: 0 10px;
 949         width: 100%;
 950         -webkit-box-shadow: 0 1px 1px rgba(0,0,0,0.04);
 951         box-shadow: 0 1px 1px rgba(0,0,0,0.04);
 952         border: 1px solid #e5e5e5;
 953         background: #fff;
 954         color: #555;
 955         font-size: 13px;
 956 }
 957
 958 .wp-filter a {
 959         text-decoration: none;
 960 }
 961
 962 .filter-count {
 963         display: inline-block;
 964         vertical-align: middle;
 965         min-width: 4em;
 966 }
 967
 968 .title-count,
 969 .filter-count .count {
 970         display: inline-block;
 971         position: relative;
 972         top: -1px;
 973         padding: 4px 10px;
 974         -webkit-border-radius: 30px;
 975         border-radius: 30px;
 976         background: #777;
 977         color: #fff;
 978         font-size: 14px;
 979         font-weight: 600;
 980 }
 981
 982 /* not a part of filter bar, but derived from it, so here for now */
 983 .title-count {
 984         display: inline;
 985         top: -3px;
 986         margin-right: 5px;
 987         margin-left: 20px;
 988 }
 989
 990 .filter-items {
 991         float: right;
 992 }
 993
 994 .filter-links {
 995         display: inline-block;
 996         margin: 0;
 997 }
 998
 999 .filter-links li {
1000         display: inline-block;
1001         margin: 0;
1002 }
1003
1004 .filter-links li > a {
1005         display: inline-block;
1006         margin: 0 10px;
1007         padding: 15px 0;
1008         border-bottom: 4px solid #fff;
1009         color: #666;
1010         cursor: pointer;
1011 }
1012
1013 .filter-links .current {
1014         -webkit-box-shadow: none;
1015         box-shadow: none;
1016         border-bottom: 4px solid #666;
1017         color: #23282d;
1018 }
1019
1020 .filter-links li > a:hover,
1021 .filter-links li > a:focus,
1022 .show-filters .filter-links a.current:hover,
1023 .show-filters .filter-links a.current:focus {
1024         color: #00a0d2;
1025 }
1026
1027 .wp-filter .search-form {
1028         float: left;
1029         margin: 10px 0;
1030 }
1031
1032 .wp-filter .search-form input[type="search"] {
1033         margin: 0;
1034         padding: 3px 5px;
1035         width: 280px;
1036         max-width: 100%;
1037         font-size: 16px;
1038         font-weight: 300;
1039         line-height: 1.5;
1040 }
1041
1042 .wp-filter .search-form select {
1043         margin: 0;
1044         height: 32px;
1045         vertical-align: top;
1046 }
1047
1048 .wp-filter .search-form.search-plugins {
1049         display: inline-block;
1050 }
1051
1052 .wp-filter .drawer-toggle {
1053         display: inline-block;
1054         margin: 0 10px;
1055         padding: 4px 6px;
1056         color: #666;
1057         cursor: pointer;
1058 }
1059
1060 .wp-filter .drawer-toggle:before {
1061         display: inline-block;
1062         vertical-align: top;
1063         content: "\f111";
1064         margin: 0 0 0 5px;
1065         width: 16px;
1066         height: 16px;
1067         color: #777;
1068         -webkit-transition: color .1s ease-in 0;
1069         transition: color .1s ease-in 0;
1070         font-family: "dashicons";
1071         font-size: 16px;
1072         line-height: 1;
1073         text-align: center;
1074         text-decoration: inherit;
1075         font-weight: normal;
1076         font-style: normal;
1077         -webkit-font-smoothing: antialiased;
1078 }
1079
1080 .wp-filter .drawer-toggle:hover,
1081 .wp-filter .drawer-toggle:hover:before {
1082         color: #00a0d2;
1083 }
1084
1085 .wp-filter .drawer-toggle.current:before {
1086         color: #fff;
1087 }
1088
1089 .filter-drawer {
1090         display: none;
1091         margin: 0 -20px;
1092         padding: 20px;
1093         border-top: 1px solid #eee;
1094         background: #fafafa;
1095 }
1096
1097 .show-filters .filter-drawer {
1098         display: block;
1099         overflow: hidden;
1100         width: 100%;
1101 }
1102
1103 .show-filters .wp-filter .drawer-toggle:hover,
1104 .show-filters .wp-filter .drawer-toggle:focus {
1105         background: rgb(46, 162, 204);
1106 }
1107
1108 .show-filters .filter-links a.current {
1109         border-bottom: none;
1110 }
1111
1112 .show-filters .wp-filter .drawer-toggle {
1113         -webkit-border-radius: 2px;
1114         border-radius: 2px;
1115         border: none;
1116         background: #777;
1117         color: #fff;
1118 }
1119
1120 .show-filters .wp-filter .drawer-toggle:before {
1121         color: #fff;
1122 }
1123
1124 .filter-group {
1125         -webkit-box-sizing: border-box;
1126         -moz-box-sizing: border-box;
1127         box-sizing: border-box;
1128         float: right;
1129         margin: 0 0 0 1%;
1130         padding: 10px;
1131         width: 24%;
1132         background: #fff;
1133         border: 1px solid #e5e5e5;
1134         -webkit-box-shadow: 0 1px 1px rgba(0,0,0,0.04);
1135         box-shadow: 0 1px 1px rgba(0,0,0,0.04);
1136 }
1137
1138 .filter-group h4 {
1139         position: relative;
1140         margin: 0;
1141 }
1142
1143 .filter-drawer ol {
1144         margin: 20px 0 0;
1145         list-style-type: none;
1146         font-size: 12px;
1147 }
1148
1149 .filter-drawer li {
1150         display: inline-block;
1151         vertical-align: top;
1152         margin: 5px 0;
1153         padding-left: 25px;
1154         width: 160px;
1155         list-style-type: none;
1156 }
1157
1158 .filter-drawer .buttons {
1159         margin-bottom: 20px;
1160 }
1161
1162 .filter-drawer .buttons .button span {
1163         display: inline-block;
1164         opacity: 0.8;
1165         font-size: 12px;
1166         text-indent: 10px;
1167 }
1168
1169 .wp-filter .button.clear-filters {
1170         display: none;
1171         margin-right: 10px;
1172 }
1173
1174 .filtered-by {
1175         display: none;
1176         margin: 0;
1177 }
1178
1179 .filtered-by > span {
1180         font-weight: 600;
1181 }
1182
1183 .filtered-by a {
1184         margin-right: 10px;
1185 }
1186
1187 .filtered-by .tags {
1188         display: inline;
1189 }
1190
1191 .filtered-by .tag {
1192         margin: 0 5px;
1193         padding: 4px 8px;
1194         border: 1px solid #e5e5e5;
1195         -webkit-box-shadow: 0 1px 1px rgba(0,0,0,0.04);
1196         box-shadow: 0 1px 1px rgba(0,0,0,0.04);
1197         background: #fff;
1198         font-size: 11px;
1199 }
1200
1201 .filters-applied .filter-group,
1202 .filters-applied .filter-drawer .buttons,
1203 .filters-applied .filter-drawer br {
1204         display: none !important;
1205 }
1206
1207 .filters-applied .filtered-by {
1208         display: block;
1209 }
1210
1211 .filters-applied .filter-drawer {
1212         padding: 20px;
1213 }
1214
1215 .show-filters .content-filterable,
1216 .show-filters.filters-applied.loading-content .content-filterable,
1217 .loading-content .content-filterable,
1218 .error .content-filterable {
1219         display: none;
1220 }
1221
1222 .show-filters.filters-applied .content-filterable {
1223         display: block;
1224 }
1225
1226 .loading-content .spinner {
1227         display: block;
1228         margin: 40px auto 0;
1229         float: none;
1230 }
1231
1232 @media only screen and (max-width: 1120px) {
1233         .filter-drawer {
1234                 border-bottom: 1px solid #eee;
1235         }
1236
1237         .filter-group {
1238                 margin-bottom: 0;
1239                 margin-top: 5px;
1240                 width: 100%;
1241         }
1242
1243         .filter-group li {
1244                 margin: 10px 0;
1245         }
1246 }
1247
1248 @media only screen and (max-width: 1000px) {
1249         .filter-items {
1250                 float: none;
1251         }
1252
1253         .wp-filter .media-toolbar-primary,
1254         .wp-filter .media-toolbar-secondary,
1255         .wp-filter .search-form {
1256                 float: none; /* Remove float from media-views.css */
1257                 position: relative;
1258                 max-width: 100%;
1259         }
1260 }
1261
1262 @media only screen and (max-width: 782px) {
1263         .filter-group li {
1264                 padding: 0;
1265                 width: 50%;
1266         }
1267 }
1268
1269 @media only screen and (max-width: 320px) {
1270         .filter-count {
1271                 display: none;
1272         }
1273
1274         .wp-filter .drawer-toggle {
1275                 margin: 10px 0;
1276         }
1277
1278         .filter-group li,
1279         .wp-filter .search-form input[type="search"] {
1280                 width: 100%;
1281         }
1282 }
1283
1284 /*------------------------------------------------------------------------------
1285   4.0 - Notifications
1286 ------------------------------------------------------------------------------*/
1287
1288 .notice,
1289 div.updated,
1290 div.error {
1291         background: #fff;
1292         border-right: 4px solid #fff;
1293         -webkit-box-shadow: 0 1px 1px 0 rgba( 0, 0, 0, 0.1 );
1294         box-shadow: 0 1px 1px 0 rgba( 0, 0, 0, 0.1 );
1295         margin: 5px 15px 2px;
1296         padding: 1px 12px;
1297 }
1298
1299 .notice p,
1300 div.updated p,
1301 div.error p,
1302 .form-table td .notice p {
1303         margin: 0.5em 0;
1304         padding: 2px;
1305 }
1306
1307 .wp-core-ui .notice.is-dismissible {
1308         padding-left: 38px;
1309         position: relative;
1310 }
1311
1312 .notice-dismiss {
1313         position: absolute;
1314         top: 0;
1315         left: 1px;
1316         border: none;
1317         margin: 0;
1318         padding: 9px;
1319         background: none;
1320         color: #b4b9be;
1321         cursor: pointer;
1322 }
1323
1324 .notice-dismiss:hover:before,
1325 .notice-dismiss:active:before,
1326 .notice-dismiss:focus:before {
1327         color: #c00;
1328 }
1329
1330 .notice-dismiss:focus {
1331         outline: none;
1332         -webkit-box-shadow: 0 0 0 1px #5b9dd9, 0 0 2px 1px rgba(30, 140, 190, .8);
1333         box-shadow: 0 0 0 1px #5b9dd9, 0 0 2px 1px rgba(30, 140, 190, .8);
1334 }
1335
1336 .ie8 .notice-dismiss:focus {
1337         outline: 1px solid #5b9dd9;
1338 }
1339
1340 .notice-success,
1341 div.updated {
1342         border-color: #7ad03a;
1343 }
1344
1345 .notice-warning {
1346         border-color: #ffba00;
1347 }
1348
1349 .notice-error,
1350 div.error {
1351         border-color: #dd3d36;
1352 }
1353
1354 .notice-info {
1355         border-color: #00a0d2;
1356 }
1357
1358 .wrap .notice,
1359 .wrap div.updated,
1360 .wrap div.error,
1361 .media-upload-form .notice,
1362 .media-upload-form div.error {
1363         margin: 5px 0 15px;
1364 }
1365
1366 #update-nag,
1367 .update-nag {
1368         display: inline-block;
1369         line-height: 19px;
1370         padding: 11px 15px;
1371         font-size: 14px;
1372         text-align: right;
1373         margin: 25px 2px 0 20px;
1374         background-color: #fff;
1375         border-right: 4px solid #ffba00;
1376         -webkit-box-shadow: 0 1px 1px 0 rgba(0,0,0,0.1);
1377         box-shadow: 0 1px 1px 0 rgba(0,0,0,0.1);
1378 }
1379
1380 .update-message {
1381         color: #000;
1382 }
1383
1384 ul#dismissed-updates {
1385         display: none;
1386 }
1387
1388 form.upgrade {
1389         margin-top: 8px;
1390 }
1391
1392 form.upgrade .hint {
1393         font-style: italic;
1394         font-size: 85%;
1395         margin: -0.5em 0 2em 0;
1396 }
1397
1398 .update-php .spinner {
1399         float: none;
1400         margin: -4px 0;
1401 }
1402
1403 #ajax-loading,
1404 .ajax-loading,
1405 .ajax-feedback,
1406 .imgedit-wait-spin,
1407 .list-ajax-loading { /* deprecated */
1408         visibility: hidden;
1409 }
1410
1411 #ajax-response.alignleft {
1412         margin-right: 2em;
1413 }
1414
1415 /* @todo: this does not need its own section anymore */
1416 /*------------------------------------------------------------------------------
1417   6.0 - Admin Header
1418 ------------------------------------------------------------------------------*/
1419 #adminmenu a,
1420 #taglist a,
1421 #catlist a {
1422         text-decoration: none;
1423 }
1424
1425 /*------------------------------------------------------------------------------
1426   6.1 - Screen Options Tabs
1427 ------------------------------------------------------------------------------*/
1428
1429 #screen-options-wrap,
1430 #contextual-help-wrap {
1431         margin: 0;
1432         padding: 8px 20px 12px;
1433         position: relative;
1434 }
1435
1436 #contextual-help-wrap {
1437         overflow: auto;
1438         margin-right: 0 !important;
1439 }
1440
1441 #screen-meta .screen-reader-text {
1442         visibility: hidden;
1443 }
1444
1445 #screen-meta-links {
1446         margin: 0 0 0 20px;
1447 }
1448
1449 /* screen options and help tabs revert */
1450 #screen-meta {
1451         display: none;
1452         margin: 0 0px -1px 20px;
1453         position: relative;
1454         background-color: #fff;
1455         border: 1px solid #ddd;
1456         border-top: none;
1457         -webkit-box-shadow: 0 1px 0 rgba(0,0,0,.025);
1458         box-shadow: 0 1px 0 rgba(0,0,0,.025);
1459 }
1460
1461 #screen-options-link-wrap,
1462 #contextual-help-link-wrap {
1463         float: left;
1464         height: 28px;
1465         margin: 0 6px 0 0;
1466         border: 1px solid #ddd;
1467         border-top: none;
1468         background: #fff;
1469         -webkit-box-shadow: 0 1px 1px -1px rgba(0,0,0,0.1);
1470         box-shadow: 0 1px 1px -1px rgba(0,0,0,0.1);
1471 }
1472
1473 #screen-meta-links .screen-meta-toggle {
1474         position: relative;
1475         top: 0;
1476 }
1477
1478 #screen-meta-links .show-settings {
1479         border: 0;
1480         background: none;
1481         -webkit-border-radius: 0;
1482         border-radius: 0;
1483         color: #777;
1484         line-height: 1.7;
1485         padding: 3px 16px 3px 6px;
1486 }
1487
1488 #screen-meta-links .show-settings:hover,
1489 #screen-meta-links .show-settings:active,
1490 #screen-meta-links .show-settings:focus {
1491         color: #32373c;
1492 }
1493
1494 #screen-meta-links .show-settings:after {
1495         left: 0;
1496         content: '\f140';
1497         font: normal 20px/1 'dashicons';
1498         speak: none;
1499         display: inline-block;
1500         padding: 0 0 0 5px;
1501         bottom: 2px;
1502         position: relative;
1503         vertical-align: bottom;
1504         -webkit-font-smoothing: antialiased;
1505         -moz-osx-font-smoothing: grayscale;
1506         text-decoration: none !important;
1507         color: #b4b9be;
1508 }
1509
1510 #screen-meta-links .screen-meta-active:after {
1511         content: '\f142';
1512 }
1513
1514 /* end screen options and help tabs */
1515
1516 .toggle-arrow {
1517         background-repeat: no-repeat;
1518         background-position: top left;
1519         background-color: transparent;
1520         height: 22px;
1521         line-height: 22px;
1522         display: block;
1523 }
1524
1525 .toggle-arrow-active {
1526         background-position: bottom left;
1527 }
1528
1529 #screen-options-wrap h5,
1530 #contextual-help-wrap h5 {
1531         margin: 8px 0;
1532         font-size: 13px;
1533 }
1534
1535 .metabox-prefs label {
1536         display: inline-block;
1537         padding-left: 15px;
1538         line-height: 30px;
1539 }
1540
1541 .metabox-prefs label input[type=checkbox] {
1542         margin-top: -4px;
1543         margin-left: 6px;
1544 }
1545
1546 .metabox-prefs label input {
1547         margin: 0 2px 0 5px;
1548 }
1549
1550 .metabox-prefs .columns-prefs label input {
1551         margin: 0 2px;
1552 }
1553
1554 .metabox-prefs label a {
1555         display: none;
1556 }
1557
1558 .metabox-prefs .screen-options {
1559         padding-top: 10px;
1560 }
1561
1562 .metabox-prefs .screen-options input,
1563 .metabox-prefs .screen-options label {
1564         margin-top: 0;
1565         margin-bottom: 0;
1566         vertical-align: middle;
1567 }
1568
1569 .metabox-prefs .screen-options .screen-per-page {
1570         margin-left: 15px;
1571 }
1572
1573 .metabox-prefs .screen-options label {
1574         line-height: 28px;
1575         padding-left: 0;
1576 }
1577
1578 /*------------------------------------------------------------------------------
1579   6.2 - Help Menu
1580 ------------------------------------------------------------------------------*/
1581
1582 #contextual-help-wrap {
1583         padding: 0;
1584 }
1585
1586 #contextual-help-columns {
1587         position: relative;
1588 }
1589
1590 #contextual-help-back {
1591         position: absolute;
1592         top: 0;
1593         bottom: 0;
1594         right: 150px;
1595         left: 170px;
1596         border: 1px solid #e1e1e1;
1597         border-top: none;
1598         border-bottom: none;
1599         background: #f6fbfd;
1600 }
1601
1602 #contextual-help-wrap.no-sidebar #contextual-help-back {
1603         left: 0;
1604         border-left-width: 0;
1605         -webkit-border-bottom-left-radius: 2px;
1606         border-bottom-left-radius: 2px;
1607 }
1608
1609 .contextual-help-tabs {
1610         float: right;
1611         width: 150px;
1612         margin: 0;
1613 }
1614
1615 .contextual-help-tabs ul {
1616         margin: 1em 0;
1617 }
1618
1619 .contextual-help-tabs li {
1620         margin-bottom: 0;
1621         list-style-type: none;
1622         border-style: solid;
1623         border-width: 0 2px 0 0;
1624         border-color: transparent;
1625 }
1626
1627 .contextual-help-tabs a {
1628         display: block;
1629         padding: 5px 12px 5px 5px;
1630         line-height: 18px;
1631         text-decoration: none;
1632         border: 1px solid transparent;
1633         border-left: none;
1634         border-right: none;
1635 }
1636
1637 .contextual-help-tabs a:hover {
1638         color: #32373c;
1639 }
1640
1641 .contextual-help-tabs .active {
1642         padding: 0;
1643         margin: 0 0 0 -1px;
1644         border-right: 2px solid #00a0d2;
1645         background: #f6fbfd;
1646         -webkit-box-shadow: 0 2px 0 rgba(0,0,0,0.02), 0 1px 0 rgba(0,0,0,0.02);
1647         box-shadow: 0 2px 0 rgba(0,0,0,0.02), 0 1px 0 rgba(0,0,0,0.02);
1648 }
1649
1650 .contextual-help-tabs .active a {
1651         border-color: #e1e1e1;
1652         color: #32373c;
1653 }
1654
1655 .contextual-help-tabs-wrap {
1656         padding: 0 20px;
1657         overflow: auto;
1658 }
1659
1660 .help-tab-content {
1661         display: none;
1662         margin: 0 0 12px 22px;
1663         line-height: 1.6em;
1664 }
1665
1666 .help-tab-content.active {
1667         display: block;
1668 }
1669
1670 .help-tab-content ul li {
1671         list-style-type: disc;
1672         margin-right: 18px;
1673 }
1674
1675 .contextual-help-sidebar {
1676         width: 150px;
1677         float: left;
1678         padding: 0 12px 0 8px;
1679         overflow: auto;
1680 }
1681
1682 /*------------------------------------------------------------------------------
1683   8.0 - Layout Blocks
1684 ------------------------------------------------------------------------------*/
1685
1686 html.wp-toolbar {
1687         padding-top: 32px;
1688         -webkit-box-sizing: border-box;
1689         -moz-box-sizing: border-box;
1690         box-sizing: border-box;
1691 }
1692
1693 .widefat th,
1694 .widefat td {
1695         color: #555;
1696 }
1697
1698 .widefat th,
1699 .widefat thead td,
1700 .widefat tfoot td {
1701         font-weight: normal;
1702 }
1703
1704 .widefat thead tr th,
1705 .widefat thead tr td,
1706 .widefat tfoot tr th,
1707 .widefat tfoot tr td {
1708         color: #32373c;
1709 }
1710
1711 .widefat td p {
1712         margin: 2px 0 0.8em;
1713 }
1714
1715 .widefat p,
1716 .widefat ol,
1717 .widefat ul {
1718         color: #32373c;
1719 }
1720
1721 .widefat .column-comment p {
1722         margin: 0.6em 0;
1723 }
1724
1725 /* Screens with postboxes */
1726 .postbox-container {
1727         float: right;
1728 }
1729
1730 .postbox-container .meta-box-sortables {
1731         -webkit-box-sizing: border-box;
1732         -moz-box-sizing: border-box;
1733         box-sizing: border-box;
1734 }
1735
1736 #wpbody-content .metabox-holder {
1737         padding-top: 10px;
1738 }
1739
1740 .metabox-holder .postbox-container .empty-container {
1741         border: 3px dashed #b4b9be;
1742         height: 250px;
1743 }
1744
1745 .metabox-holder.columns-1 .postbox-container .empty-container,
1746 .columns-2 #postbox-container-3 .empty-container,
1747 .columns-2 #postbox-container-4 .empty-container,
1748 .columns-3 #postbox-container-4 .empty-container {
1749         border: 0 none;
1750         height: 0;
1751         min-height: 0;
1752 }
1753
1754 #post-body-content {
1755         width: 100%;
1756         min-width: 463px;
1757         float: right;
1758 }
1759
1760 #post-body.columns-2 #postbox-container-1 {
1761         float: left;
1762         margin-left: -300px;
1763         width: 280px;
1764 }
1765
1766 #post-body.columns-2 #side-sortables {
1767         min-height: 250px;
1768 }
1769
1770 /* one column on the dash */
1771 @media only screen and (max-width: 799px) {
1772         #wpbody-content .metabox-holder .postbox-container .empty-container {
1773                 border: 0 none;
1774                 height: 0;
1775                 min-height: 0;
1776         }
1777 }
1778
1779 .js .widget .widget-top,
1780 .js .postbox .hndle {
1781         cursor: move;
1782 }
1783
1784 .hndle a {
1785         font-size: 11px;
1786         font-weight: normal;
1787 }
1788
1789 .postbox .handlediv {
1790         float: left;
1791         width: 27px;
1792         height: 30px;
1793 }
1794
1795 .js .postbox .handlediv {
1796         cursor: pointer;
1797 }
1798
1799 .sortable-placeholder {
1800         border: 1px dashed #b4b9be;
1801         margin-bottom: 20px;
1802 }
1803
1804 .postbox,
1805 .stuffbox {
1806         margin-bottom: 20px;
1807         padding: 0;
1808         line-height: 1;
1809 }
1810
1811 /* user-select is not a part of the CSS standard - may change behavior in the future */
1812 .postbox .hndle,
1813 .stuffbox .hndle {
1814         -webkit-user-select: none;
1815         -moz-user-select: none;
1816         -ms-user-select: none;
1817         user-select: none;
1818 }
1819
1820 .postbox .inside,
1821 .stuffbox .inside {
1822         padding: 0 12px 12px;
1823         line-height: 1.4em;
1824         font-size: 13px;
1825 }
1826
1827 .postbox .inside {
1828         margin: 11px 0;
1829         position: relative;
1830 }
1831
1832 .postbox .inside > p:last-child,
1833 .rss-widget ul li:last-child {
1834         margin-bottom: 1px !important;
1835 }
1836
1837 .postbox.closed h3 {
1838         border: none;
1839         -webkit-box-shadow: none;
1840         box-shadow: none;
1841 }
1842
1843 .postbox table.form-table {
1844         margin-bottom: 0;
1845 }
1846
1847 .postbox table.widefat {
1848         -webkit-box-shadow: none;
1849         box-shadow: none;
1850 }
1851
1852 .temp-border {
1853         border: 1px dotted #ccc;
1854 }
1855
1856 .columns-prefs label {
1857         padding: 0 5px;
1858 }
1859
1860 /* @todo: what is this doing here */
1861 #dashboard_right_now .versions .b,
1862 #post-status-display,
1863 #post-visibility-display,
1864 #adminmenu .wp-submenu li.current,
1865 #adminmenu .wp-submenu li.current a,
1866 #adminmenu .wp-submenu li.current a:hover,
1867 .media-item .percent,
1868 .plugins .name,
1869 #pass-strength-result.strong,
1870 #pass-strength-result.short,
1871 #ed_reply_toolbar #ed_reply_strong,
1872 .item-controls .item-order a,
1873 .feature-filter .feature-name {
1874         font-weight: 600;
1875 }
1876
1877 /*------------------------------------------------------------------------------
1878   21.0 - Admin Footer
1879 ------------------------------------------------------------------------------*/
1880
1881 #wpfooter {
1882         position: absolute;
1883         bottom: 0;
1884         right: 0;
1885         left: 0;
1886         padding: 10px 20px;
1887         color: #777;
1888 }
1889
1890 #wpfooter p {
1891         font-size: 13px;
1892         margin: 0;
1893         line-height: 20px;
1894 }
1895
1896 #footer-thankyou {
1897         font-style: italic;
1898 }
1899
1900 #wpfooter a {
1901         text-decoration: none;
1902 }
1903
1904 #wpfooter a:hover {
1905         text-decoration: underline;
1906 }
1907
1908 /*------------------------------------------------------------------------------
1909   25.0 - Tabbed Admin Screen Interface (Experimental)
1910 ------------------------------------------------------------------------------*/
1911
1912 .nav-tab {
1913         border: 1px solid #ccc;
1914         border-bottom: none;
1915         background: #e4e4e4;
1916         color: #555;
1917         font-size: 12px;
1918         line-height: 16px;
1919         display: inline-block;
1920         padding: 4px 14px 6px;
1921         text-decoration: none;
1922         margin: -4px 0 -1px 4px;
1923 }
1924
1925 .nav-tab:hover {
1926         background-color: #fff;
1927         color: #464646;
1928 }
1929
1930 .nav-tab-active {
1931         color: #464646;
1932 }
1933
1934 .nav-tab-active,
1935 .nav-tab-active:hover {
1936         border-bottom: 1px solid #f1f1f1;
1937         background: #f1f1f1;
1938         color: #000;
1939 }
1940
1941 h1.nav-tab-wrapper,
1942 h2.nav-tab-wrapper,
1943 h3.nav-tab-wrapper {
1944         border-bottom: 1px solid #ccc;
1945         padding-bottom: 0;
1946         padding-right: 10px;
1947 }
1948
1949 h1 .nav-tab,
1950 h2 .nav-tab {
1951         padding: 6px 10px;
1952         font-weight: bold;
1953         font-size: 15px;
1954         line-height: 24px;
1955 }
1956
1957
1958 /*------------------------------------------------------------------------------
1959   26.0 - Misc
1960 ------------------------------------------------------------------------------*/
1961
1962 .spinner {
1963         background: url(../images/spinner.gif) no-repeat;
1964         -webkit-background-size: 20px 20px;
1965         background-size: 20px 20px;
1966         display: inline-block;
1967         visibility: hidden;
1968         float: left;
1969         vertical-align: middle;
1970         opacity: 0.7;
1971         filter: alpha(opacity=70);
1972         width: 20px;
1973         height: 20px;
1974         margin: 4px 10px 0;
1975 }
1976
1977 .spinner.is-active {
1978         visibility: visible;
1979 }
1980
1981 #template div {
1982         margin-left: 190px;
1983 }
1984
1985 .metabox-holder h3 {
1986         font-size: 14px;
1987         padding: 8px 12px;
1988         margin: 0;
1989         line-height: 1.4;
1990 }
1991
1992 #templateside ul li a {
1993         text-decoration: none;
1994 }
1995
1996 .plugin-install #description,
1997 .plugin-install-network #description {
1998         width: 60%;
1999 }
2000
2001 table .vers,
2002 table .column-visible,
2003 table .column-rating {
2004         text-align: right;
2005 }
2006
2007 .attention,
2008 .error-message {
2009         color: red;
2010         font-weight: 600;
2011 }
2012
2013 /* Scrollbar fix for bulk upgrade iframe */
2014 body.iframe {
2015         height: 98%;
2016 }
2017
2018 /* Upgrader styles, Specific to Language Packs */
2019 .lp-show-latest p {
2020         display: none;
2021 }
2022 .lp-show-latest p:last-child,
2023 .lp-show-latest .lp-error p {
2024         display: block;
2025 }
2026
2027 /* - Only used once or twice in all of WP - deprecate for global style
2028 ------------------------------------------------------------------------------*/
2029 .media-icon {
2030         width: 62px; /* icon + border */
2031         text-align: center;
2032 }
2033
2034 .media-icon img {
2035         border: 1px solid #e7e7e7;
2036         border: 1px solid rgba(0, 0, 0, 0.07);
2037 }
2038
2039 #howto {
2040         font-size: 11px;
2041         margin: 0 5px;
2042         display: block;
2043 }
2044
2045 .importers td {
2046         padding-left: 14px;
2047 }
2048
2049 .importers {
2050         font-size: 16px;
2051         width: auto;
2052 }
2053
2054 #post-body #post-body-content #namediv h3 {
2055         margin-top: 0;
2056 }
2057
2058 .edit-comment-author {
2059         font-size: 14px;
2060         line-height: 1.4;
2061         font-weight: 600;
2062         color: #222;
2063         margin: 2px 9px 0 0;
2064 }
2065
2066 #namediv h3 label {
2067         vertical-align: baseline;
2068 }
2069
2070 #namediv table {
2071         width: 100%;
2072 }
2073
2074 #namediv td.first {
2075         width: 10px;
2076         white-space: nowrap;
2077 }
2078
2079 #namediv input {
2080         width: 98%;
2081 }
2082
2083 #namediv p {
2084         margin: 10px 0;
2085 }
2086
2087 #submitdiv h3 {
2088         margin-bottom: 0 !important;
2089 }
2090
2091 /* - Used - but could/should be deprecated with a CSS reset
2092 ------------------------------------------------------------------------------*/
2093 .zerosize {
2094         height: 0;
2095         width: 0;
2096         margin: 0;
2097         border: 0;
2098         padding: 0;
2099         overflow: hidden;
2100         position: absolute;
2101 }
2102
2103 br.clear {
2104         height: 2px;
2105         line-height: 2px;
2106 }
2107
2108 .checkbox {
2109         border: none;
2110         margin: 0;
2111         padding: 0;
2112 }
2113
2114 fieldset {
2115         border: 0;
2116         padding: 0;
2117         margin: 0;
2118 }
2119
2120 .post-categories {
2121         display: inline;
2122         margin: 0;
2123         padding: 0;
2124 }
2125
2126 .post-categories li {
2127         display: inline;
2128 }
2129
2130 /* Star Ratings - Back-compat for pre-3.8 */
2131 div.star-holder {
2132         position: relative;
2133         height: 17px;
2134         width: 100px;
2135         background: url(../images/stars.png?ver=20121108) repeat-x bottom left;
2136 }
2137
2138 div.star-holder .star-rating {
2139         background: url(../images/stars.png?ver=20121108) repeat-x top left;
2140         height: 17px;
2141         float: right;
2142 }
2143
2144 /* Star Ratings */
2145 .star-rating {
2146         white-space: nowrap;
2147 }
2148 .star-rating .star {
2149         display: inline-block;
2150         width: 20px;
2151         height: 20px;
2152         -webkit-font-smoothing: antialiased;
2153         font-size: 20px;
2154         line-height: 1;
2155         font-family: 'dashicons';
2156         text-decoration: inherit;
2157         font-weight: normal;
2158         font-style: normal;
2159         vertical-align: top;
2160         -webkit-transition: color .1s ease-in 0;
2161         transition: color .1s ease-in 0;
2162         text-align: center;
2163         color: #ffb900;
2164 }
2165
2166 .star-rating .star-full:before {
2167         content:'\f155';
2168 }
2169
2170 .star-rating .star-half:before {
2171         content:'\f459';
2172 }
2173
2174 .rtl .star-rating .star-half {
2175         -webkit-transform: rotateY(180deg);
2176         -ms-transform: rotateY(180deg);
2177         transform: rotateY(180deg);
2178 }
2179
2180 .star-rating .star-empty:before {
2181         content:'\f154';
2182 }
2183
2184 div.action-links {
2185         font-weight: normal;
2186         margin: 6px 0 0;
2187 }
2188
2189 /* Plugin install thickbox */
2190 #plugin-information {
2191         background: #fff;
2192         position: fixed;
2193         top: 0;
2194         left: 0;
2195         bottom: 0;
2196         right: 0;
2197         height: 100%;
2198         padding: 0;
2199 }
2200
2201 #plugin-information-scrollable {
2202         overflow: auto;
2203         -webkit-overflow-scrolling: touch;
2204         height: 100%;
2205 }
2206
2207 #plugin-information-title {
2208         padding: 0 20px;
2209         background: #f5f5f5;
2210         font-size: 22px;
2211         font-weight: 600;
2212         line-height: 56px;
2213         position: relative;
2214         top: 0;
2215         left: 0;
2216         right: 0;
2217         height: 56px;
2218         overflow: hidden;
2219         text-overflow: ellipsis;
2220         white-space: nowrap;
2221 }
2222
2223 #plugin-information-title.with-banner {
2224         margin-left: 0;
2225         height: 250px;
2226         bottom: 250px;
2227         -webkit-background-size: cover;
2228         background-size: cover;
2229 }
2230
2231 #plugin-information-title h2 {
2232         font-size: 1em;
2233         font-weight: bold;
2234         padding: 0;
2235         margin: 0;
2236         max-width: 680px;
2237         overflow: hidden;
2238         text-overflow: ellipsis;
2239         white-space: nowrap;
2240 }
2241
2242 #plugin-information-title.with-banner h2 {
2243         font-family: "Helvetica Neue", sans-serif;
2244         display: inline-block;
2245         font-size: 30px;
2246         line-height: 50px;
2247         padding: 0 15px;
2248         margin: 174px 10px 0 0;
2249         color: #fff;
2250         background: rgba( 30, 30, 30, 0.9 );
2251         text-shadow: 0 1px 3px rgba( 0, 0, 0, 0.4 );
2252         -webkit-box-shadow: 0 0 30px rgba( 255, 255, 255, 0.1 );
2253         box-shadow: 0 0 30px rgba( 255, 255, 255, 0.1 );
2254         -webkit-border-radius: 8px;
2255         border-radius: 8px;
2256 }
2257
2258 #plugin-information-title div.vignette {
2259         display: none;
2260 }
2261
2262 #plugin-information-title.with-banner div.vignette {
2263         display: block;
2264         float: left;
2265         top: 0;
2266         height: 250px;
2267         width: 772px;
2268         margin: 0 -20px;
2269         background: transparent;
2270         -webkit-box-shadow: inset 0 0 50px 4px rgba( 0, 0, 0, 0.2 ), inset 0 -1px 0 rgba( 0, 0, 0, 0.1 );
2271         box-shadow: inset 0 0 50px 4px rgba( 0, 0, 0, 0.2 ), inset 0 -1px 0 rgba( 0, 0, 0, 0.1 );
2272 }
2273
2274 #plugin-information-tabs {
2275         padding: 0 16px;
2276         position: relative;
2277         left: 0;
2278         right: 0;
2279         height: 36px;
2280         z-index: 1;
2281         border-bottom: 1px solid #ddd;
2282         background: #f3f3f3;
2283 }
2284
2285 #plugin-information-tabs a {
2286         position: relative;
2287         float: right;
2288         padding: 9px 10px;
2289         margin: 0;
2290         height: 18px;
2291         line-height: 18px;
2292         font-size: 14px;
2293         text-decoration: none;
2294         -webkit-transition: none;
2295         transition: none;
2296 }
2297
2298 #plugin-information-tabs a.current {
2299         margin: 0 -1px 0;
2300         background: #fff;
2301         border: 1px solid #ddd;
2302         border-bottom-color: #fff;
2303         padding-top: 8px;
2304         color: #32373c;
2305 }
2306
2307 #plugin-information-tabs.with-banner a.current {
2308         border-top: none;
2309         padding-top: 9px;
2310 }
2311
2312 #plugin-information-tabs a:active,
2313 #plugin-information-tabs a:focus {
2314         outline: none;
2315 }
2316
2317 #plugin-information-content {
2318         overflow: hidden; /* equal height column trick */
2319         background: #fff;
2320         position: relative;
2321         top: 0;
2322         left: 0;
2323         right: 0;
2324         min-height: 100%;
2325         /* Height of title + tabs + install now */
2326         min-height: -webkit-calc( 100% - 152px );
2327         min-height: calc( 100% - 152px );
2328 }
2329
2330 #plugin-information-content.with-banner {
2331         /* Height of banner + tabs + install now */
2332         min-height: -webkit-calc( 100% - 346px );
2333         min-height: calc( 100% - 346px );
2334 }
2335
2336 #section-holder {
2337         position: relative;
2338         top: 0;
2339         left: 250px;
2340         bottom: 0;
2341         right: 0;
2342         margin-left: 250px; /* FYI box */
2343         padding: 10px 26px;
2344         margin-bottom: -99930px; /* a bit less than the padding below to accommodate footer */
2345         padding-bottom: 99999px; /* equal height column trick */
2346 }
2347
2348 #section-holder .updated {
2349         margin: 16px 0;
2350 }
2351
2352 #plugin-information .fyi {
2353         display: block;
2354         float: left;
2355         position: relative;
2356         top: 0;
2357         left: 0;
2358         padding: 16px;
2359         margin-bottom: -99930px; /* slightly less than the padding below to accommodate footer */
2360         padding-bottom: 99999px; /* equal height column trick */
2361         width: 217px;
2362         border-right: 1px solid #ddd;
2363         background: #f3f3f3;
2364         color: #666;
2365 }
2366
2367 #plugin-information .fyi strong {
2368         color: #464646;
2369 }
2370
2371 #plugin-information .fyi h3 {
2372         font-weight: bold;
2373         text-transform: uppercase;
2374         font-size: 12px;
2375         color: #666;
2376         margin: 24px 0 8px;
2377 }
2378
2379 #plugin-information .fyi h2 {
2380         font-size: 0.9em;
2381         margin-bottom: 0;
2382         margin-left: 0;
2383 }
2384
2385 #plugin-information .fyi ul {
2386         padding: 0;
2387         margin: 0;
2388         list-style: none;
2389 }
2390
2391 #plugin-information .fyi li {
2392         margin: 0 0 10px;
2393 }
2394
2395 #plugin-information .counter-container {
2396         margin: 3px 0;
2397 }
2398
2399 #plugin-information .counter-label {
2400         float: right;
2401         margin-left: 5px;
2402         min-width: 55px;
2403 }
2404
2405 #plugin-information .counter-back {
2406         height: 17px;
2407         width: 92px;
2408         background-color: #ececec;
2409         float: right;
2410 }
2411
2412 #plugin-information .counter-bar {
2413         height: 17px;
2414         background-color: #ffc733; /* slightly lighter than stars due to larger expanse */
2415         float: right;
2416 }
2417
2418 #plugin-information .counter-count {
2419         margin-right: 5px;
2420 }
2421
2422 #plugin-information .fyi ul.contributors {
2423         margin-top: 10px;
2424 }
2425
2426 #plugin-information .fyi ul.contributors li {
2427         display: inline-block;
2428         margin-left: 8px;
2429         vertical-align: middle;
2430 }
2431
2432 #plugin-information .fyi ul.contributors li {
2433         display: inline-block;
2434         margin-left: 8px;
2435         vertical-align: middle;
2436 }
2437
2438 #plugin-information .fyi ul.contributors li img {
2439         vertical-align: middle;
2440         margin-left: 4px;
2441 }
2442
2443 #plugin-information-footer {
2444         padding: 15px 16px;
2445         position: absolute;
2446         left: 0;
2447         bottom: 0;
2448         right: 0;
2449         height: 28px;
2450         border-top: 1px solid #ddd;
2451         background: #f3f3f3;
2452 }
2453
2454 /* rtl:ignore */
2455 #plugin-information .section {
2456         direction: ltr;
2457 }
2458
2459 /* rtl:ignore */
2460 #plugin-information .section ul,
2461 #plugin-information .section ol {
2462         list-style-type: disc;
2463         margin-left: 24px;
2464 }
2465
2466 #plugin-information .section,
2467 #plugin-information .section p {
2468         font-size: 14px;
2469         line-height: 1.7;
2470 }
2471
2472 #plugin-information #section-screenshots ol {
2473         list-style: none;
2474         margin: 0;
2475 }
2476
2477 #plugin-information #section-screenshots li img {
2478         vertical-align: text-top;
2479         margin-top: 16px;
2480         max-width: 100%;
2481         width: auto;
2482         height: auto;
2483         -webkit-box-shadow: 0 1px 2px rgba( 0, 0, 0, 0.3 );
2484         box-shadow: 0 1px 2px rgba( 0, 0, 0, 0.3 );
2485 }
2486
2487 /* rtl:ignore */
2488 #plugin-information #section-screenshots li p {
2489         font-style: italic;
2490         padding-left: 20px;
2491 }
2492
2493 #plugin-information pre {
2494         padding: 7px;
2495         overflow: auto;
2496         border: 1px solid #ccc;
2497 }
2498
2499 /* rtl:ignore */
2500 #plugin-information .review {
2501         overflow: hidden; /* clearfix */
2502         width: 100%;
2503         margin-bottom: 20px;
2504         border-bottom: 1px solid #e6e6e6;
2505 }
2506
2507 #plugin-information .review-title-section {
2508         overflow: hidden; /* clearfix */
2509 }
2510
2511 /* rtl:ignore */
2512 #plugin-information .review-title-section h4 {
2513         display: inline-block;
2514         float: left;
2515         margin: 0 6px 0 0;
2516 }
2517
2518 #plugin-information .reviewer-info p {
2519         clear: both;
2520         margin: 0;
2521         padding-top: 2px;
2522 }
2523
2524 /* rtl:ignore */
2525 #plugin-information .reviewer-info .avatar {
2526         float: left;
2527         margin: 4px 6px 0 0;
2528 }
2529
2530 /* rtl:ignore */
2531 #plugin-information .reviewer-info .star-rating {
2532         float: left;
2533 }
2534
2535 /* rtl:ignore */
2536 #plugin-information .review-meta {
2537         float: left;
2538         margin-left: 0.75em;
2539 }
2540
2541 /* rtl:ignore */
2542 #plugin-information .review-body {
2543         float: left;
2544         width: 100%;
2545 }
2546
2547 .plugin-version-author-uri {
2548         font-size: 13px;
2549 }
2550
2551 @media screen and ( max-width: 771px ) {
2552         #plugin-information-title.with-banner {
2553                 height: 100px;
2554                 bottom: 100px;
2555         }
2556
2557         #plugin-information-title.with-banner h2 {
2558                 margin-top: 30px;
2559                 font-size: 20px;
2560                 line-height: 40px;
2561                 max-width: 85%;
2562         }
2563
2564         #plugin-information-title.with-banner div.vignette {
2565                 height: 100px;
2566                 bottom: 100px;
2567                 width: 800%;
2568         }
2569
2570         #plugin-information-tabs {
2571                 overflow: hidden; /* clearfix */
2572                 padding: 0;
2573                 height: auto; /* let tabs wrap */
2574         }
2575
2576         #plugin-information-tabs a.current {
2577                 margin-bottom: 0;
2578                 border-bottom: none;
2579         }
2580
2581         #plugin-information .fyi {
2582                 float: none;
2583                 border: 1px solid #ddd;
2584                 position: static;
2585                 width: auto;
2586                 margin: 26px 26px 0;
2587                 padding-bottom: 0; /* reset from the two column height fix */
2588         }
2589
2590         #section-holder {
2591                 position: static;
2592                 margin: 0;
2593                 padding-bottom: 70px; /* reset from the two column height fix, plus accomodate footer */
2594         }
2595
2596         #plugin-information .fyi h3,
2597         #plugin-information .fyi small {
2598                 display: none;
2599         }
2600
2601         #plugin-information-footer {
2602                 padding: 12px 16px 0;
2603                 height: 46px;
2604         }
2605 }
2606
2607 /* Thickbox for Plugin Install screen */
2608 body.plugin-install-php #TB_window,
2609 body.import-php #TB_window,
2610 body.plugins-php #TB_window,
2611 body.update-core-php #TB_window,
2612 body.index-php #TB_window {
2613         background: #fcfcfc url( ../images/spinner.gif ) no-repeat center;
2614 }
2615
2616 @media print,
2617         (-webkit-min-device-pixel-ratio: 1.25),
2618         (min-resolution: 120dpi) {
2619
2620         body.plugin-install-php #TB_window,
2621         body.import-php #TB_window,
2622         body.plugins-php #TB_window,
2623         body.update-core-php #TB_window,
2624         body.index-php #TB_window {
2625                 background: #fcfcfc url( ../images/spinner-2x.gif ) no-repeat center;
2626                 -webkit-background-size: 20px 20px;
2627                 background-size: 20px 20px;
2628         }
2629 }
2630
2631 body.plugin-install-php #TB_title,
2632 body.import-php #TB_title,
2633 body.plugins-php #TB_title,
2634 body.update-core-php #TB_title,
2635 body.index-php #TB_title {
2636         float: right;
2637         height: 1px;
2638 }
2639
2640 body.plugin-install-php #TB_ajaxWindowTitle,
2641 body.import-php #TB_ajaxWindowTitle,
2642 body.plugins-php #TB_ajaxWindowTitle,
2643 body.update-core-php #TB_ajaxWindowTitle,
2644 body.index-php #TB_ajaxWindowTitle {
2645         display: none;
2646 }
2647
2648 body.plugin-install-php .tb-close-icon,
2649 body.import-php .tb-close-icon,
2650 body.plugins-php .tb-close-icon,
2651 body.update-core-php .tb-close-icon,
2652 body.index-php .tb-close-icon {
2653         right: auto;
2654         left: -30px;
2655         color: #eee;
2656         -webkit-transition: color .1s ease-in-out, background .1s ease-in-out;
2657         transition: color .1s ease-in-out, background .1s ease-in-out;
2658 }
2659
2660 body.plugin-install-php #TB_closeWindowButton:focus,
2661 body.plugin-install-php #TB_closeWindowButton:focus .tb-close-icon,
2662 body.plugin-install-php .tb-close-icon:focus,
2663 body.plugin-install-php .tb-close-icon:hover,
2664 body.import-php #TB_closeWindowButton:focus,
2665 body.import-php #TB_closeWindowButton:focus .tb-close-icon,
2666 body.import-php .tb-close-icon:focus,
2667 body.import-php .tb-close-icon:hover,
2668 body.plugins-php #TB_closeWindowButton:focus,
2669 body.plugins-php #TB_closeWindowButton:focus .tb-close-icon,
2670 body.plugins-php .tb-close-icon:focus,
2671 body.plugins-php .tb-close-icon:hover,
2672 body.update-core-php #TB_closeWindowButton:focus,
2673 body.update-core-php #TB_closeWindowButton:focus .tb-close-icon,
2674 body.update-core-php .tb-close-icon:focus,
2675 body.update-core-php .tb-close-icon:hover,
2676 body.index-php #TB_closeWindowButton:focus,
2677 body.index-php #TB_closeWindowButton:focus .tb-close-icon,
2678 body.index-php .tb-close-icon:focus,
2679 body.index-php .tb-close-icon:hover {
2680         color: #00a0d2;
2681         outline: none;
2682         -webkit-box-shadow: none;
2683         box-shadow: none;
2684 }
2685
2686 body.plugin-install-php .tb-close-icon:before,
2687 body.import-php .tb-close-icon:before,
2688 body.plugins-php .tb-close-icon:before,
2689 body.update-core-php .tb-close-icon:before,
2690 body.index-php .tb-close-icon:before {
2691         content: "\f335";
2692         font-size: 32px;
2693 }
2694
2695 /* move plugin install close icon to top on narrow screens */
2696 @media screen and ( max-width: 830px ) {
2697         body.plugin-install-php .tb-close-icon,
2698         body.import-php .tb-close-icon,
2699         body.plugins-php .tb-close-icon,
2700         body.update-core-php .tb-close-icon,
2701         body.index-php .tb-close-icon {
2702                 left: 0;
2703                 top: -30px;
2704         }
2705 }
2706
2707 /* @todo: move this. */
2708 img {
2709         border: none;
2710 }
2711
2712 /* Header */
2713 /* @todo: are these also specific to Press This? */
2714 #wphead {
2715         border-bottom: 1px solid #dfdfdf;
2716 }
2717
2718 #wphead h1 a {
2719         color: #464646;
2720 }
2721
2722 /* @todo: these seem misplaced */
2723 .js .meta-box-sortables .postbox:hover .handlediv {
2724         margin-left: 0 !important;
2725 }
2726
2727 /* Metabox collapse arrow indicators */
2728 .js .sidebar-name .sidebar-name-arrow:before,
2729 .js .meta-box-sortables .postbox .handlediv:before {
2730         left: 12px;
2731         font: normal 20px/1 'dashicons';
2732         speak: none;
2733         display: inline-block;
2734         padding: 8px 10px;
2735         top: 0;
2736         position: relative;
2737         -webkit-font-smoothing: antialiased;
2738         -moz-osx-font-smoothing: grayscale;
2739         text-decoration: none !important;
2740 }
2741
2742 .js #widgets-left .sidebar-name .sidebar-name-arrow {
2743         display: none;
2744 }
2745
2746 .js #widgets-left .widgets-holder-wrap.closed .sidebar-name .sidebar-name-arrow,
2747 .js #widgets-left .sidebar-name:hover .sidebar-name-arrow {
2748         display: block;
2749 }
2750
2751 /* Show the arrow only on hover */
2752 .js .sidebar-name .sidebar-name-arrow:before,
2753 .js .meta-box-sortables .postbox .handlediv:before {
2754         content: '\f142';
2755 }
2756
2757 .js .widgets-holder-wrap.closed .sidebar-name-arrow:before,
2758 .js .meta-box-sortables .postbox.closed .handlediv:before {
2759         content: '\f140';
2760 }
2761
2762 .error a {
2763         text-decoration: underline;
2764 }
2765
2766 .updated a {
2767         text-decoration: none;
2768         padding-bottom: 2px;
2769 }
2770
2771 /* @todo: appears to be Press This only and overridden */
2772 #photo-add-url-div input[type="text"] {
2773         width: 300px;
2774 }
2775
2776 /* Theme/Plugin Editor */
2777 .alignleft h3 {
2778         margin: 0;
2779 }
2780
2781 #template textarea {
2782         font-family: Consolas, Monaco, monospace;
2783         font-size: 13px;
2784         width: 97%;
2785         background: #f9f9f9;
2786         outline: none;
2787 }
2788
2789 /* rtl:ignore */
2790 #template textarea,
2791 #docs-list {
2792         direction: ltr;
2793 }
2794
2795 #template p {
2796         width: 97%;
2797 }
2798
2799 #templateside {
2800         float: left;
2801         width: 190px;
2802         word-wrap: break-word;
2803 }
2804
2805 #templateside h3,
2806 #postcustomstuff p.submit {
2807         margin: 0;
2808 }
2809
2810 #templateside h4 {
2811         margin: 1em 0 0;
2812 }
2813
2814 #templateside ol,
2815 #templateside ul {
2816         margin: .5em 0;
2817         padding: 0;
2818 }
2819
2820 #templateside li {
2821         margin: 4px 0;
2822 }
2823
2824 #templateside li a,
2825 .theme-editor-php .highlight {
2826         display: block;
2827         padding: 3px 12px 3px 3px;
2828         text-decoration: none;
2829 }
2830
2831 .theme-editor-php .highlight {
2832         margin: -3px -12px -3px 3px;
2833 }
2834
2835 #templateside .highlight {
2836         border: none;
2837         font-weight: bold;
2838 }
2839
2840 .nonessential {
2841         color: #666;
2842         font-size: 11px;
2843         font-style: italic;
2844         padding-right: 12px;
2845 }
2846
2847 #documentation {
2848         margin-top: 10px;
2849 }
2850
2851 #documentation label {
2852         line-height: 22px;
2853         vertical-align: baseline;
2854         font-weight: 600;
2855 }
2856
2857 .fileedit-sub {
2858         padding: 10px 0 8px;
2859         line-height: 180%;
2860 }
2861
2862 /* @todo: can we use a common class for these? */
2863 .nav-menus-php .item-edit:before,
2864 .widget-top a.widget-action:after,
2865 .control-section .accordion-section-title:after,
2866 .accordion-section-title:after {
2867         left: 0;
2868         content: '\f140';
2869         border: none;
2870         background: none;
2871         font: normal 20px/1 'dashicons';
2872         speak: none;
2873         display: block;
2874         padding: 0;
2875         text-indent: 0;
2876         text-align: center;
2877         position: relative;
2878         -webkit-font-smoothing: antialiased;
2879         -moz-osx-font-smoothing: grayscale;
2880         text-decoration: none !important;
2881 }
2882
2883 .widget-action,
2884 .handlediv,
2885 .item-edit,
2886 .sidebar-name-arrow,
2887 .accordion-section-title:after {
2888         color: #a0a5aa;
2889 }
2890
2891 .widget-action:hover,
2892 .handlediv:hover,
2893 .item-edit:hover,
2894 .sidebar-name:hover .sidebar-name-arrow,
2895 .accordion-section-title:hover:after {
2896         color: #777;
2897 }
2898
2899 .widget-top a.widget-action:after {
2900         padding: 12px 12px 11px;
2901 }
2902
2903 .widget-top a.widget-action:focus:after {
2904         -webkit-box-shadow: 0 0 0 1px #5b9dd9,0 0 2px 1px rgba(30,140,190,.8);
2905         box-shadow: 0 0 0 1px #5b9dd9,0 0 2px 1px rgba(30,140,190,.8);
2906 }
2907
2908 .nav-menus-php .item-edit:before {
2909         line-height: 2.1;
2910 }
2911
2912 .control-section .accordion-section-title:after,
2913 .accordion-section-title:after {
2914         float: left;
2915         left: 20px;
2916         top: -2px;
2917 }
2918
2919 .control-section.open .accordion-section-title:after,
2920 #customize-info.open .accordion-section-title:after,
2921 .nav-menus-php .menu-item-edit-active .item-edit:before,
2922 .widget.open .widget-top a.widget-action:after {
2923         content: '\f142';
2924 }
2925
2926 /*!
2927  * jQuery UI Draggable/Sortable 1.11.4
2928  * http://jqueryui.com
2929  *
2930  * Copyright jQuery Foundation and other contributors
2931  * Released under the MIT license.
2932  * http://jquery.org/license
2933  */
2934 .ui-draggable-handle,
2935 .ui-sortable-handle {
2936         -ms-touch-action: none;
2937         touch-action: none;
2938 }
2939
2940 /* Accordion */
2941 .accordion-section {
2942         border-bottom: 1px solid #dfdfdf;
2943         margin: 0;
2944 }
2945
2946 .accordion-section.open .accordion-section-content,
2947 .no-js .accordion-section .accordion-section-content {
2948         display: block;
2949 }
2950
2951 .accordion-section.open:hover {
2952         border-bottom-color: #dfdfdf;
2953 }
2954
2955 .accordion-section-content {
2956         display: none;
2957         padding: 10px 20px 15px;
2958         overflow: hidden;
2959         background: #fff;
2960 }
2961
2962 .accordion-section-title {
2963         margin: 0;
2964         padding: 12px 15px 15px;
2965         position: relative;
2966         border-right: 1px solid #dfdfdf;
2967         border-left: 1px solid #dfdfdf;
2968         -webkit-user-select: none;
2969         -moz-user-select: none;
2970         -ms-user-select: none;
2971         user-select: none;
2972 }
2973
2974 .js .accordion-section-title {
2975         cursor: pointer;
2976 }
2977
2978 .js .accordion-section-title:after {
2979         position: absolute;
2980         top: 12px;
2981         left: 10px;
2982         z-index: 1;
2983 }
2984
2985 .accordion-section-title:focus {
2986         outline: none;
2987 }
2988
2989 .accordion-section-title:hover:after,
2990 .accordion-section-title:focus:after {
2991         border-color: #a0a5aa transparent;
2992 }
2993
2994 .cannot-expand .accordion-section-title {
2995         cursor: auto;
2996 }
2997
2998 .cannot-expand .accordion-section-title:after {
2999         display: none;
3000 }
3001
3002 .control-section .accordion-section-title {
3003         border-right: none;
3004         border-left: none;
3005         padding: 10px 14px 11px 10px;
3006         line-height: 21px;
3007         background: #fff;
3008 }
3009
3010 .control-section .accordion-section-title:after {
3011         top: 11px;
3012 }
3013
3014 .js .control-section:hover .accordion-section-title,
3015 .js .control-section .accordion-section-title:hover,
3016 .js .control-section.open .accordion-section-title,
3017 .js .control-section .accordion-section-title:focus {
3018         color: #23282d;
3019         background: #f5f5f5;
3020 }
3021
3022 .control-section.open .accordion-section-title {
3023         /* When expanded */
3024         border-bottom: 1px solid #dfdfdf;
3025 }
3026
3027 /* Edit Site */
3028 .network-admin .edit-site-actions {
3029         margin-top: 0;
3030 }
3031
3032 /* My Sites */
3033 .my-sites {
3034         display: block;
3035         overflow: auto;
3036         zoom: 1;
3037 }
3038
3039 .my-sites li {
3040         display: block;
3041         padding: 8px 3%;
3042         min-height: 130px;
3043         margin: 0;
3044 }
3045
3046 @media only screen and (max-width: 599px) {
3047         .my-sites li {
3048                 min-height: 0;
3049         }
3050 }
3051
3052 @media only screen and (min-width: 600px) {
3053         .my-sites.striped li {
3054                 background-color: #fff;
3055                 position: relative;
3056         }
3057         .my-sites.striped li:after {
3058                 content: "";
3059                 width: 1px;
3060                 height: 100%;
3061                 position: absolute;
3062                 top: 0;
3063                 left: 0;
3064                 background: #ccc;
3065         }
3066
3067 }
3068 @media only screen and (min-width: 600px) and (max-width: 699px) {
3069         .my-sites li{
3070                 float: right;
3071                 width: 44%;
3072         }
3073         .my-sites.striped li {
3074                 background-color: #fff;
3075         }
3076         .my-sites.striped li:nth-of-type(2n+1) {
3077                 clear: right;
3078         }
3079         .my-sites.striped li:nth-of-type(2n+2):after {
3080                 content: none;
3081         }
3082         .my-sites li:nth-of-type(4n+1),
3083         .my-sites li:nth-of-type(4n+2) {
3084                 background-color: #f9f9f9;
3085         }
3086
3087 }
3088
3089 @media only screen and (min-width: 700px) and (max-width: 1199px) {
3090         .my-sites li {
3091                 float: right;
3092                 width: 27.333333%;
3093                 background-color: #fff;
3094         }
3095         .my-sites.striped li:nth-of-type(3n+3):after {
3096                 content: none;
3097         }
3098         .my-sites li:nth-of-type(6n+1),
3099         .my-sites li:nth-of-type(6n+2),
3100         .my-sites li:nth-of-type(6n+3) {
3101                 background-color: #f9f9f9;
3102         }
3103 }
3104
3105 @media only screen and (min-width: 1200px) and (max-width: 1399px) {
3106         .my-sites li {
3107                 float: right;
3108                 width: 21%;
3109                 padding: 8px 2%;
3110                 background-color: #fff;
3111         }
3112         .my-sites.striped li:nth-of-type(4n+1) {
3113                 clear: right;
3114         }
3115         .my-sites.striped li:nth-of-type(4n+4):after {
3116                 content: none;
3117         }
3118         .my-sites li:nth-of-type(8n+1),
3119         .my-sites li:nth-of-type(8n+2),
3120         .my-sites li:nth-of-type(8n+3),
3121         .my-sites li:nth-of-type(8n+4) {
3122                 background-color: #f9f9f9;
3123         }
3124 }
3125
3126 @media only screen and (min-width: 1400px) and (max-width: 1599px) {
3127         .my-sites li {
3128                 float: right;
3129                 width: 16%;
3130                 padding: 8px 2%;
3131                 background-color: #fff;
3132         }
3133         .my-sites.striped li:nth-of-type(5n+1) {
3134                 clear: right;
3135         }
3136         .my-sites.striped li:nth-of-type(5n+5):after {
3137                 content: none;
3138         }
3139         .my-sites li:nth-of-type(10n+1),
3140         .my-sites li:nth-of-type(10n+2),
3141         .my-sites li:nth-of-type(10n+3),
3142         .my-sites li:nth-of-type(10n+4),
3143         .my-sites li:nth-of-type(10n+5) {
3144                 background-color: #f9f9f9;
3145         }
3146 }
3147
3148 @media only screen and (min-width: 1600px) {
3149         .my-sites li {
3150                 float: right;
3151                 width: 12.666666%;
3152                 padding: 8px 2%;
3153                 background-color: #fff;
3154         }
3155         .my-sites.striped li:nth-of-type(6n+1) {
3156                 clear: right;
3157         }
3158         .my-sites.striped li:nth-of-type(6n+6):after {
3159                 content: none;
3160         }
3161         .my-sites li:nth-of-type(12n+1),
3162         .my-sites li:nth-of-type(12n+2),
3163         .my-sites li:nth-of-type(12n+3),
3164         .my-sites li:nth-of-type(12n+4),
3165         .my-sites li:nth-of-type(12n+5),
3166         .my-sites li:nth-of-type(12n+6) {
3167                 background-color: #f9f9f9;
3168         }
3169 }
3170
3171 .my-sites li a {
3172         text-decoration: none;
3173 }
3174
3175 /* =Media Queries
3176 -------------------------------------------------------------- */
3177
3178 /* @todo: de-duplication */
3179 @media only screen and (min-width: 769px) {
3180         /* categories */
3181         #col-left {
3182                 width: 35%;
3183         }
3184
3185         #col-right {
3186                 width: 65%;
3187         }
3188 }
3189
3190 @media only screen and (max-width: 860px) {
3191
3192         /* categories */
3193         #col-left {
3194                 width: 35%;
3195         }
3196
3197         #col-right {
3198                 width: 65%;
3199         }
3200 }
3201
3202 @media only screen and (min-width: 980px) {
3203
3204         /* categories */
3205         #col-left {
3206                 width: 35%;
3207         }
3208
3209         #col-right {
3210                 width: 65%;
3211         }
3212 }
3213
3214 @media only screen and (max-width: 768px) {
3215         /* categories */
3216         #col-left {
3217                 width: 100%;
3218         }
3219
3220         #col-right {
3221                 width: 100%;
3222         }
3223 }
3224
3225 /**
3226  * HiDPI Displays
3227  */
3228 @media print,
3229   (-webkit-min-device-pixel-ratio: 1.25),
3230   (min-resolution: 120dpi) {
3231         /* Back-compat for pre-3.8 */
3232         div.star-holder,
3233         div.star-holder .star-rating {
3234                 background: url(../images/stars-2x.png?ver=20121108) repeat-x bottom left;
3235                 -webkit-background-size: 21px 37px;
3236                 background-size: 21px 37px;
3237         }
3238
3239         .spinner {
3240                 background-image: url(../images/spinner-2x.gif);
3241         }
3242
3243         /* @todo: evaluate - most of these were likely replaced by dashicons */
3244         .curtime #timestamp,
3245         #screen-meta-links a.show-settings,
3246         .widget-top a.widget-action,
3247         .widget-top a.widget-action:hover,
3248         .sidebar-name-arrow,
3249         .sidebar-name:hover .sidebar-name-arrow,
3250         .meta-box-sortables .postbox:hover .handlediv,
3251         .tagchecklist span a,
3252         #bulk-titles div a,
3253         .tagchecklist span a:hover,
3254         #bulk-titles div a:hover {
3255                 background: none !important;
3256         }
3257
3258 }
3259
3260 @-ms-viewport {
3261         width: device-width;
3262 }
3263
3264 @media screen and ( max-width: 782px ) {
3265         html.wp-toolbar {
3266                 padding-top: 46px;
3267         }
3268
3269         body {
3270                 min-width: 240px;
3271                 overflow-x: hidden;
3272         }
3273
3274         body * {
3275                 -webkit-tap-highlight-color: rgba(0, 0, 0, 0) !important;
3276         }
3277
3278         #wpcontent {
3279                 position: relative;
3280                 margin-right: 0;
3281                 padding-right: 10px;
3282         }
3283
3284         #wpbody-content {
3285                 padding-bottom: 100px;
3286         }
3287
3288         .wrap {
3289                 margin-left: 12px;
3290                 margin-right: 0;
3291         }
3292
3293         .col-wrap {
3294                 padding: 0;
3295         }
3296
3297         /* Hidden Elements */
3298         #screen-meta,
3299         #screen-meta-links,
3300         #collapse-menu,
3301         .post-format-select {
3302                 display: none !important;
3303         }
3304
3305         .wrap .add-new-h2, /* deprecated */
3306         .wrap .add-new-h2:active, /* deprecated */
3307         .wrap .page-title-action,
3308         .wrap .page-title-action:active {
3309                 padding: 10px 15px;
3310                 font-size: 14px;
3311                 white-space: nowrap;
3312         }
3313
3314         .wp-color-result {
3315                 height: auto;
3316                 padding-right: 45px;
3317         }
3318
3319         .wp-color-result:after {
3320                 font-size: 14px;
3321                 height: auto;
3322                 padding: 6px 14px;
3323         }
3324
3325         /* Feedback Messages */
3326         .notice,
3327         .wrap div.updated,
3328         .wrap div.error,
3329         .media-upload-form div.error {
3330                 margin: 20px 0 10px 0;
3331                 padding: 5px 10px;
3332                 font-size: 14px;
3333                 line-height: 175%;
3334         }
3335
3336         .wp-core-ui .notice.is-dismissible {
3337                 padding-left: 46px;
3338         }
3339
3340         .notice-dismiss {
3341                 padding: 13px;
3342         }
3343
3344         .wrap .icon32 + h2 {
3345                 margin-top: -2px;
3346         }
3347
3348         .wp-responsive-open #wpbody {
3349                 left: -190px;
3350         }
3351
3352         code {
3353                 word-wrap: break-word;
3354         }
3355
3356         /* General Metabox */
3357         .postbox {
3358                 font-size: 14px;
3359         }
3360
3361         .metabox-holder h3 {
3362                 padding: 12px;
3363         }
3364
3365         .postbox .handlediv {
3366                 margin-top: 3px;
3367         }
3368
3369         /* Subsubsub Nav */
3370         .subsubsub {
3371                 font-size: 16px;
3372                 text-align: center;
3373                 margin-bottom: 15px;
3374         }
3375
3376         /* Theme/Plugin File Editor */
3377         #templateside {
3378                 float: none;
3379                 width: auto;
3380         }
3381
3382         #templateside li {
3383                 margin: 0;
3384         }
3385
3386         #templateside li a {
3387                 display: block;
3388                 padding: 5px;
3389         }
3390
3391         #templateside .highlight {
3392                 padding: 5px;
3393                 margin-right: -5px;
3394                 margin-top: -5px;
3395         }
3396
3397         #template div {
3398                 float: none;
3399                 margin: 0;
3400                 width: auto;
3401         }
3402
3403         #template textarea {
3404                 width: 100%;
3405         }
3406
3407         .fileedit-sub .alignright {
3408                 margin-top: 15px;
3409         }
3410
3411         #wpfooter {
3412                 display: none;
3413         }
3414
3415         #comments-form .checkforspam {
3416                 display: none;
3417         }
3418
3419         .edit-comment-author {
3420                 margin: 2px 0 0;
3421         }
3422 }
3423
3424 /* Smartphone */
3425 @media screen and (max-width: 600px) {
3426         /* Disable horizontal scroll when responsive menu is open
3427            since we push the main content off to the right. */
3428         #wpwrap.wp-responsive-open {
3429                 overflow-x: hidden;
3430         }
3431
3432         html.wp-toolbar {
3433                 padding-top: 0;
3434         }
3435
3436         #wpbody {
3437                 padding-top: 46px;
3438         }
3439
3440         /* Keep full-width boxes on Edit Post page from causing horizontal scroll */
3441         div#post-body.metabox-holder.columns-1 {
3442                 overflow-x: hidden;
3443         }
3444 }
3445
3446 @media screen and (max-width: 320px) {
3447         /* Prevent default center alignment and larger font for the Right Now widget when
3448            the network dashboard is viewed on a small mobile device. */
3449         #network_dashboard_right_now .subsubsub {
3450                 font-size: 14px;
3451                 text-align: right;
3452         }
3453 }