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