[Summary view] [Print] [Text view]

   1  /*! This file is auto-generated */
   2  /* 2 column liquid layout */
   3  #wpwrap {
   4      height: auto;
   5      min-height: 100%;
   6      width: 100%;
   7      position: relative;
   8      -webkit-font-smoothing: subpixel-antialiased;
   9  }
  10  
  11  #wpcontent {
  12      height: 100%;
  13      padding-right: 20px;
  14  }
  15  
  16  #wpcontent,
  17  #wpfooter {
  18      margin-right: 160px;
  19  }
  20  
  21  .folded #wpcontent,
  22  .folded #wpfooter {
  23      margin-right: 36px;
  24  }
  25  
  26  #wpbody-content {
  27      padding-bottom: 65px;
  28      float: right;
  29      width: 100%;
  30      overflow: visible;
  31  }
  32  
  33  /* inner 2 column liquid layout */
  34  
  35  .inner-sidebar {
  36      float: left;
  37      clear: left;
  38      display: none;
  39      width: 281px;
  40      position: relative;
  41  }
  42  
  43  .columns-2 .inner-sidebar {
  44      margin-left: auto;
  45      width: 286px;
  46      display: block;
  47  }
  48  
  49  .inner-sidebar #side-sortables,
  50  .columns-2 .inner-sidebar #side-sortables {
  51      min-height: 300px;
  52      width: 280px;
  53      padding: 0;
  54  }
  55  
  56  .has-right-sidebar .inner-sidebar {
  57      display: block;
  58  }
  59  
  60  .has-right-sidebar #post-body {
  61      float: right;
  62      clear: right;
  63      width: 100%;
  64      margin-left: -2000px;
  65  }
  66  
  67  .has-right-sidebar #post-body-content {
  68      margin-left: 300px;
  69      float: none;
  70      width: auto;
  71  }
  72  
  73  /* 2 columns main area */
  74  
  75  #col-left {
  76      float: right;
  77      width: 35%;
  78  }
  79  
  80  #col-right {
  81      float: left;
  82      width: 65%;
  83  }
  84  
  85  #col-left .col-wrap {
  86      padding: 0 0 0 6px;
  87  }
  88  
  89  #col-right .col-wrap {
  90      padding: 0 6px 0 0;
  91  }
  92  
  93  /* utility classes */
  94  .alignleft {
  95      float: right;
  96  }
  97  
  98  .alignright {
  99      float: left;
 100  }
 101  
 102  .textleft {
 103      text-align: right;
 104  }
 105  
 106  .textright {
 107      text-align: left;
 108  }
 109  
 110  .clear {
 111      clear: both;
 112  }
 113  
 114  /* modern clearfix */
 115  .wp-clearfix:after {
 116      content: "";
 117      display: table;
 118      clear: both;
 119  }
 120  
 121  /* Hide visually but not from screen readers */
 122  .screen-reader-text,
 123  .screen-reader-text span,
 124  .ui-helper-hidden-accessible {
 125      border: 0;
 126      clip-path: inset(50%);
 127      height: 1px;
 128      margin: -1px;
 129      overflow: hidden;
 130      padding: 0;
 131      position: absolute;
 132      width: 1px;
 133      word-wrap: normal !important; /* many screen reader and browser combinations announce broken words as they would appear visually */
 134  }
 135  
 136  .button .screen-reader-text {
 137      height: auto; /* Fixes a Safari+VoiceOver bug, see ticket #42006 */
 138  }
 139  
 140  .screen-reader-text + .dashicons-external {
 141      margin-top: -1px;
 142      margin-right: 2px;
 143  }
 144  
 145  .screen-reader-shortcut {
 146      position: absolute;
 147      top: -1000em;
 148      right: 6px;
 149      height: auto;
 150      width: auto;
 151      display: block;
 152      font-size: 14px;
 153      font-weight: 600;
 154      padding: 15px 23px 14px;
 155      /* Background and color set to prevent false positives in automated accessibility tests. */
 156      background: #f0f0f1;
 157      color: #2271b1;
 158      z-index: 100000;
 159      line-height: normal;
 160  }
 161  
 162  .screen-reader-shortcut:focus {
 163      top: -25px;
 164      /* Overrides a:focus in the admin. See ticket #56789. */
 165      color: #2271b1;
 166      box-shadow: 0 0 2px 2px rgba(0, 0, 0, 0.6);
 167      text-decoration: none;
 168      /* Only visible in Windows High Contrast mode */
 169      outline: 2px solid transparent;
 170      outline-offset: -2px;
 171  }
 172  
 173  .hidden,
 174  .js .closed .inside,
 175  .js .hide-if-js,
 176  .no-js .hide-if-no-js,
 177  .js.wp-core-ui .hide-if-js,
 178  .js .wp-core-ui .hide-if-js,
 179  .no-js.wp-core-ui .hide-if-no-js,
 180  .no-js .wp-core-ui .hide-if-no-js {
 181      display: none;
 182  }
 183  
 184  /* @todo: Take a second look. Large chunks of shared color, from the colors.css merge */
 185  .widget-top,
 186  .menu-item-handle,
 187  .widget-inside,
 188  #menu-settings-column .accordion-container,
 189  #menu-management .menu-edit,
 190  .manage-menus,
 191  table.widefat,
 192  .stuffbox,
 193  p.popular-tags,
 194  .widgets-holder-wrap,
 195  .wp-editor-container,
 196  .popular-tags,
 197  .feature-filter,
 198  .comment-ays {
 199      border: 1px solid #c3c4c7;
 200      box-shadow: 0 1px 1px rgba(0, 0, 0, 0.04);
 201  }
 202  
 203  table.widefat,
 204  .wp-editor-container,
 205  .stuffbox,
 206  p.popular-tags,
 207  .widgets-holder-wrap,
 208  .popular-tags,
 209  .feature-filter,
 210  .comment-ays {
 211      background: #fff;
 212  }
 213  
 214  /* general */
 215  html,
 216  body {
 217      height: 100%;
 218      margin: 0;
 219      padding: 0;
 220  }
 221  
 222  body {
 223      background: #f0f0f1;
 224      color: #3c434a;
 225      font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
 226      font-size: 13px;
 227      line-height: 1.4em;
 228      min-width: 600px;
 229  }
 230  
 231  body.iframe {
 232      min-width: 0;
 233      padding-top: 1px;
 234  }
 235  
 236  body.modal-open {
 237      overflow: hidden;
 238  }
 239  
 240  body.mobile.modal-open #wpwrap {
 241      overflow: hidden;
 242      position: fixed;
 243      height: 100%;
 244  }
 245  
 246  iframe,
 247  img {
 248      border: 0;
 249  }
 250  
 251  td {
 252      font-family: inherit;
 253      font-size: inherit;
 254      font-weight: inherit;
 255      line-height: inherit;
 256  }
 257  
 258  /* Any change to the default link style must be applied to button-link too. */
 259  a {
 260      color: #2271b1;
 261      transition-property: border, background, color;
 262      transition-duration: .05s;
 263      transition-timing-function: ease-in-out;
 264  }
 265  
 266  a,
 267  div {
 268      outline: 0;
 269  }
 270  
 271  a:hover,
 272  a:active {
 273      color: #135e96;
 274  }
 275  
 276  a:focus,
 277  a:focus .media-icon img,
 278  a:focus .plugin-icon,
 279  .wp-person a:focus .gravatar {
 280      color: #043959;
 281      box-shadow: 0 0 0 2px #2271b1;
 282      /* Only visible in Windows High Contrast mode */
 283      outline: 2px solid transparent;
 284  }
 285  
 286  #adminmenu a:focus {
 287      box-shadow: none;
 288      /* Only visible in Windows High Contrast mode */
 289      outline: 1px solid transparent;
 290      outline-offset: -1px;
 291  }
 292  
 293  .screen-reader-text:focus {
 294      box-shadow: none;
 295      outline: none;
 296  }
 297  
 298  blockquote,
 299  q {
 300      quotes: none;
 301  }
 302  
 303  blockquote:before,
 304  blockquote:after,
 305  q:before,
 306  q:after {
 307      content: "";
 308      content: none;
 309  }
 310  
 311  p,
 312  .wp-die-message {
 313      font-size: 13px;
 314      line-height: 1.5;
 315      margin: 1em 0;
 316  }
 317  
 318  blockquote {
 319      margin: 1em;
 320  }
 321  
 322  li,
 323  dd {
 324      margin-bottom: 6px;
 325  }
 326  
 327  h1,
 328  h2,
 329  h3,
 330  h4,
 331  h5,
 332  h6 {
 333      display: block;
 334      font-weight: 600;
 335  }
 336  
 337  h1 {
 338      color: #1d2327;
 339      font-size: 2em;
 340      margin: .67em 0;
 341  }
 342  
 343  h2,
 344  h3 {
 345      color: #1d2327;
 346      font-size: 1.3em;
 347      margin: 1em 0;
 348  }
 349  
 350  .update-core-php h2 {
 351      margin-top: 4em;
 352  }
 353  
 354  .update-php h2,
 355  .update-messages h2,
 356  h4 {
 357      font-size: 1em;
 358      margin: 1.33em 0;
 359  }
 360  
 361  h5 {
 362      font-size: 0.83em;
 363      margin: 1.67em 0;
 364  }
 365  
 366  h6 {
 367      font-size: 0.67em;
 368      margin: 2.33em 0;
 369  }
 370  
 371  ul,
 372  ol {
 373      padding: 0;
 374  }
 375  
 376  ul {
 377      list-style: none;
 378  }
 379  
 380  ol {
 381      list-style-type: decimal;
 382      margin-right: 2em;
 383  }
 384  
 385  ul.ul-disc {
 386      list-style: disc outside;
 387  }
 388  
 389  ul.ul-square {
 390      list-style: square outside;
 391  }
 392  
 393  ol.ol-decimal {
 394      list-style: decimal outside;
 395  }
 396  
 397  ul.ul-disc,
 398  ul.ul-square,
 399  ol.ol-decimal {
 400      margin-right: 1.8em;
 401  }
 402  
 403  ul.ul-disc > li,
 404  ul.ul-square > li,
 405  ol.ol-decimal > li {
 406      margin: 0 0 0.5em;
 407  }
 408  
 409  /* rtl:ignore */
 410  .ltr {
 411      direction: ltr;
 412  }
 413  
 414  /* rtl:ignore */
 415  .code,
 416  code {
 417      font-family: Consolas, Monaco, monospace;
 418      direction: ltr;
 419      unicode-bidi: embed;
 420  }
 421  
 422  kbd,
 423  code {
 424      padding: 3px 5px 2px;
 425      margin: 0 1px;
 426      background: #f0f0f1;
 427      background: rgba(0, 0, 0, 0.07);
 428      font-size: 13px;
 429  }
 430  
 431  .subsubsub {
 432      list-style: none;
 433      margin: 8px 0 0;
 434      padding: 0;
 435      font-size: 13px;
 436      float: right;
 437      color: #646970;
 438  }
 439  
 440  .subsubsub a {
 441      line-height: 2;
 442      padding: .2em;
 443      text-decoration: none;
 444  }
 445  
 446  .subsubsub a .count,
 447  .subsubsub a.current .count {
 448      color: #50575e; /* #f1f1f1 background */
 449      font-weight: 400;
 450  }
 451  
 452  .subsubsub a.current {
 453      font-weight: 600;
 454      border: none;
 455  }
 456  
 457  .subsubsub li {
 458      display: inline-block;
 459      margin: 0;
 460      padding: 0;
 461      white-space: nowrap;
 462  }
 463  
 464  /* .widefat - main style for tables */
 465  .widefat {
 466      border-spacing: 0;
 467      width: 100%;
 468      clear: both;
 469      margin: 0;
 470  }
 471  
 472  .widefat * {
 473      word-wrap: break-word;
 474  }
 475  
 476  .widefat a,
 477  .widefat button.button-link {
 478      text-decoration: none;
 479  }
 480  
 481  .widefat td,
 482  .widefat th {
 483      padding: 8px 10px;
 484  }
 485  
 486  .widefat thead th,
 487  .widefat thead td {
 488      border-bottom: 1px solid #c3c4c7;
 489  }
 490  
 491  .widefat tfoot th,
 492  .widefat tfoot td {
 493      border-top: 1px solid #c3c4c7;
 494      border-bottom: none;
 495  }
 496  
 497  .widefat .no-items td {
 498      border-bottom-width: 0;
 499  }
 500  
 501  .widefat td {
 502      vertical-align: top;
 503  }
 504  
 505  .widefat td,
 506  .widefat td p,
 507  .widefat td ol,
 508  .widefat td ul {
 509      font-size: 13px;
 510      line-height: 1.5em;
 511  }
 512  
 513  .widefat th,
 514  .widefat thead td,
 515  .widefat tfoot td {
 516      text-align: right;
 517      line-height: 1.3em;
 518      font-size: 14px;
 519  }
 520  
 521  .widefat th input,
 522  .updates-table td input,
 523  .widefat thead td input,
 524  .widefat tfoot td input {
 525      margin: 0 8px 0 0;
 526      padding: 0;
 527      vertical-align: text-top;
 528  }
 529  
 530  .widefat .check-column {
 531      width: 2.2em;
 532      padding: 6px 0 25px;
 533      vertical-align: top;
 534  }
 535  
 536  .widefat tbody th.check-column {
 537      padding: 9px 0 22px;
 538  }
 539  
 540  .widefat thead td.check-column,
 541  .widefat tbody th.check-column,
 542  .updates-table tbody td.check-column,
 543  .widefat tfoot td.check-column {
 544      padding: 11px 3px 0 0;
 545  }
 546  
 547  .widefat thead td.check-column,
 548  .widefat tfoot td.check-column {
 549      padding-top: 4px;
 550      vertical-align: middle;
 551  }
 552  
 553  .update-php div.updated,
 554  .update-php div.error {
 555      margin-right: 0;
 556  }
 557  
 558  .js-update-details-toggle .dashicons {
 559      text-decoration: none;
 560  }
 561  
 562  .js-update-details-toggle[aria-expanded="true"] .dashicons::before {
 563      content: "\f142" / '';
 564  }
 565  
 566  .no-js .widefat thead .check-column input,
 567  .no-js .widefat tfoot .check-column input {
 568      display: none;
 569  }
 570  
 571  .widefat .num,
 572  .column-comments,
 573  .column-links,
 574  .column-posts {
 575      text-align: center;
 576  }
 577  
 578  .widefat th#comments {
 579      vertical-align: middle;
 580  }
 581  
 582  .wrap {
 583      margin: 10px 2px 0 20px;
 584  }
 585  
 586  .wrap > h2:first-child, /* Back-compat for pre-4.4 */
 587  .wrap [class$="icon32"] + h2, /* Back-compat for pre-4.4 */
 588  .postbox .inside h2, /* Back-compat for pre-4.4 */
 589  .wrap h1 {
 590      font-size: 23px;
 591      font-weight: 400;
 592      margin: 0;
 593      padding: 9px 0 4px;
 594      line-height: 1.3;
 595  }
 596  
 597  .wrap h1.wp-heading-inline {
 598      display: inline-block;
 599      margin-left: 5px;
 600  }
 601  
 602  .wp-header-end {
 603      visibility: hidden;
 604      margin: -2px 0 0;
 605  }
 606  
 607  .subtitle {
 608      margin: 0;
 609      padding-right: 25px;
 610      color: #50575e;
 611      font-size: 14px;
 612      font-weight: 400;
 613      line-height: 1;
 614  }
 615  
 616  .subtitle strong {
 617      word-break: break-all;
 618  }
 619  
 620  .wrap .add-new-h2, /* deprecated */
 621  .wrap .add-new-h2:active, /* deprecated */
 622  .wrap .page-title-action,
 623  .wrap .page-title-action:active {
 624      display: inline-block;
 625      position: relative;
 626      box-sizing: border-box;
 627      cursor: pointer;
 628      white-space: nowrap;
 629      text-decoration: none;
 630      text-shadow: none;
 631      top: -3px;
 632      margin-right: 4px;
 633      border: 1px solid #2271b1;
 634      border-radius: 3px;
 635      background: #f6f7f7;
 636      font-size: 13px;
 637      font-weight: 400;
 638      line-height: 2.15384615;
 639      color: #2271b1; /* use the standard color used for buttons */
 640      padding: 0 10px;
 641      min-height: 30px;
 642      -webkit-appearance: none;
 643  
 644  }
 645  
 646  .wrap .wp-heading-inline + .page-title-action {
 647      margin-right: 0;
 648  }
 649  
 650  .wrap .add-new-h2:hover, /* deprecated */
 651  .wrap .page-title-action:hover {
 652      background: #f0f0f1;
 653      border-color: #0a4b78;
 654      color: #0a4b78;
 655  }
 656  
 657  /* lower specificity: color needs to be overridden by :hover and :active */
 658  .page-title-action:focus {
 659      color: #0a4b78;
 660  }
 661  
 662  /* Dashicon for language options on General Settings and Profile screens */
 663  .form-table th label[for="locale"] .dashicons,
 664  .form-table th label[for="WPLANG"] .dashicons {
 665      margin-right: 5px;
 666  }
 667  
 668  .wrap .page-title-action:focus {
 669      border-color: #3582c4;
 670      box-shadow: 0 0 0 1px #3582c4;
 671      /* Only visible in Windows High Contrast mode */
 672      outline: 2px solid transparent;
 673  }
 674  
 675  .wrap h1.long-header {
 676      padding-left: 0;
 677  }
 678  
 679  .wp-dialog {
 680      background-color: #fff;
 681  }
 682  
 683  .widgets-chooser ul,
 684  #widgets-left .widget-in-question .widget-top,
 685  #available-widgets .widget-top:hover,
 686  div#widgets-right .widget-top:hover,
 687  #widgets-left .widget-top:hover {
 688      border-color: #8c8f94;
 689      box-shadow: 0 1px 2px rgba(0, 0, 0, 0.1);
 690  }
 691  
 692  .sorthelper {
 693      background-color: #c5d9ed;
 694  }
 695  
 696  .ac_match,
 697  .subsubsub a.current {
 698      color: #000;
 699  }
 700  
 701  .striped > tbody > :nth-child(odd),
 702  ul.striped > :nth-child(odd),
 703  .alternate {
 704      background-color: #f6f7f7;
 705  }
 706  
 707  .bar {
 708      background-color: #f0f0f1;
 709      border-left-color: #4f94d4;
 710  }
 711  
 712  /* Helper classes for plugins to leverage the active WordPress color scheme */
 713  
 714  .highlight {
 715      background-color: #f0f6fc;
 716      color: #3c434a;
 717  }
 718  
 719  .wp-ui-primary {
 720      color: #fff;
 721      background-color: #2c3338;
 722  }
 723  .wp-ui-text-primary {
 724      color: #2c3338;
 725  }
 726  
 727  .wp-ui-highlight {
 728      color: #fff;
 729      background-color: #2271b1;
 730  }
 731  .wp-ui-text-highlight {
 732      color: #2271b1;
 733  }
 734  
 735  .wp-ui-notification {
 736      color: #fff;
 737      background-color: #d63638;
 738  }
 739  .wp-ui-text-notification {
 740      color: #d63638;
 741  }
 742  
 743  .wp-ui-text-icon {
 744      color: #8c8f94; /* same as new icons */
 745  }
 746  
 747  /* For emoji replacement images */
 748  img.emoji {
 749      display: inline !important;
 750      border: none !important;
 751      height: 1em !important;
 752      width: 1em !important;
 753      margin: 0 .07em !important;
 754      vertical-align: -0.1em !important;
 755      background: none !important;
 756      padding: 0 !important;
 757      box-shadow: none !important;
 758  }
 759  
 760  /*------------------------------------------------------------------------------
 761    1.0 - Text Styles
 762  ------------------------------------------------------------------------------*/
 763  
 764  .widget .widget-top,
 765  .postbox .hndle,
 766  .stuffbox .hndle,
 767  .control-section .accordion-section-title,
 768  .sidebar-name,
 769  #nav-menu-header,
 770  #nav-menu-footer,
 771  .menu-item-handle,
 772  .checkbox,
 773  .side-info,
 774  #your-profile #rich_editing,
 775  .widefat thead th,
 776  .widefat thead td,
 777  .widefat tfoot th,
 778  .widefat tfoot td {
 779      line-height: 1.4em;
 780  }
 781  
 782  .widget .widget-top,
 783  .menu-item-handle {
 784      background: #f6f7f7;
 785      color: #1d2327;
 786  }
 787  
 788  .stuffbox .hndle {
 789      border-bottom: 1px solid #c3c4c7;
 790  }
 791  
 792  .quicktags {
 793      background-color: #c3c4c7;
 794      color: #000;
 795      font-size: 12px;
 796  }
 797  
 798  .icon32 {
 799      display: none;
 800  }
 801  
 802  /* @todo can we combine these into a class or use an existing dashicon one? */
 803  .welcome-panel .welcome-panel-close:before,
 804  .tagchecklist .ntdelbutton .remove-tag-icon:before,
 805  #bulk-titles .ntdelbutton:before,
 806  .notice-dismiss:before {
 807      background: none;
 808      color: #787c82;
 809      content: "\f153" / '';
 810      display: block;
 811      font: normal 16px/20px dashicons;
 812      height: 20px;
 813      text-align: center;
 814      width: 20px;
 815      -webkit-font-smoothing: antialiased;
 816      -moz-osx-font-smoothing: grayscale;
 817  }
 818  
 819  .welcome-panel .welcome-panel-close:before {
 820      margin: 0;
 821  }
 822  
 823  .tagchecklist .ntdelbutton .remove-tag-icon:before {
 824      margin-right: 2px;
 825      border-radius: 50%;
 826      color: #2271b1;
 827      /* vertically center the icon cross browsers */
 828      line-height: 1.28;
 829  }
 830  
 831  .tagchecklist .ntdelbutton:focus {
 832      outline: 0;
 833  }
 834  
 835  .tagchecklist .ntdelbutton:hover .remove-tag-icon:before,
 836  .tagchecklist .ntdelbutton:focus .remove-tag-icon:before,
 837  #bulk-titles .ntdelbutton:hover:before,
 838  #bulk-titles .ntdelbutton:focus:before {
 839      color: #d63638;
 840  }
 841  
 842  .tagchecklist .ntdelbutton:focus .remove-tag-icon:before {
 843      box-shadow: 0 0 0 2px #2271b1;
 844      /* Only visible in Windows High Contrast mode */
 845      outline: 2px solid transparent;
 846  }
 847  
 848  .key-labels label {
 849      line-height: 24px;
 850  }
 851  
 852  strong, b {
 853      font-weight: 600;
 854  }
 855  
 856  .pre {
 857      /* https://developer.mozilla.org/en-US/docs/CSS/white-space */
 858      white-space: pre-wrap; /* css-3 */
 859      word-wrap: break-word; /* IE 5.5 - 7 */
 860  }
 861  
 862  .howto {
 863      color: #646970;
 864      display: block;
 865  }
 866  
 867  p.install-help {
 868      margin: 8px 0;
 869      font-style: italic;
 870  }
 871  
 872  .no-break {
 873      white-space: nowrap;
 874  }
 875  
 876  hr {
 877      border: 0;
 878      border-top: 1px solid #dcdcde;
 879      border-bottom: 1px solid #f6f7f7;
 880  }
 881  
 882  .row-actions span.delete a,
 883  .row-actions span.trash a,
 884  .row-actions span.spam a,
 885  .plugins a.delete,
 886  #all-plugins-table .plugins a.delete,
 887  #search-plugins-table .plugins a.delete,
 888  .submitbox .submitdelete,
 889  #media-items a.delete,
 890  #media-items a.delete-permanently,
 891  #nav-menu-footer .menu-delete,
 892  #delete-link a.delete,
 893  a#remove-post-thumbnail,
 894  .privacy_requests .remove-personal-data .remove-personal-data-handle {
 895      color: #b32d2e;
 896  }
 897  
 898  abbr.required,
 899  span.required,
 900  .file-error,
 901  .row-actions .delete a:hover,
 902  .row-actions .trash a:hover,
 903  .row-actions .spam a:hover,
 904  .plugins a.delete:hover,
 905  #all-plugins-table .plugins a.delete:hover,
 906  #search-plugins-table .plugins a.delete:hover,
 907  .submitbox .submitdelete:hover,
 908  #media-items a.delete:hover,
 909  #media-items a.delete-permanently:hover,
 910  #nav-menu-footer .menu-delete:hover,
 911  #delete-link a.delete:hover,
 912  a#remove-post-thumbnail:hover,
 913  .privacy_requests .remove-personal-data .remove-personal-data-handle:hover {
 914      color: #b32d2e;
 915      border: none;
 916  }
 917  
 918  .application-password-display .success {
 919      color: #007017;
 920      margin-right: 0.5rem;
 921  }
 922  
 923  /*------------------------------------------------------------------------------
 924    3.0 - Actions
 925  ------------------------------------------------------------------------------*/
 926  
 927  #major-publishing-actions {
 928      padding: 10px;
 929      clear: both;
 930      border-top: 1px solid #dcdcde;
 931      background: #f6f7f7;
 932  }
 933  
 934  #delete-action {
 935      float: right;
 936      line-height: 2.30769231; /* 30px */
 937  }
 938  
 939  #delete-link {
 940      line-height: 2.30769231; /* 30px */
 941      vertical-align: middle;
 942      text-align: right;
 943      margin-right: 8px;
 944  }
 945  
 946  #delete-link a {
 947      text-decoration: none;
 948  }
 949  
 950  #publishing-action {
 951      text-align: left;
 952      float: left;
 953      line-height: 1.9;
 954  }
 955  
 956  #publishing-action .spinner {
 957      float: none;
 958      margin-top: 5px;
 959  }
 960  
 961  #misc-publishing-actions {
 962      padding: 6px 0 0;
 963  }
 964  
 965  .misc-pub-section {
 966      padding: 6px 10px 8px;
 967  }
 968  
 969  .word-wrap-break-word,
 970  .misc-pub-filename {
 971      word-wrap: break-word;
 972  }
 973  
 974  #minor-publishing-actions {
 975      padding: 10px 10px 0;
 976      text-align: left;
 977  }
 978  
 979  #save-post {
 980      float: right;
 981  }
 982  
 983  .preview {
 984      float: left;
 985  }
 986  
 987  #sticky-span {
 988      margin-right: 18px;
 989  }
 990  
 991  .approve,
 992  .unapproved .unapprove {
 993      display: none;
 994  }
 995  
 996  .unapproved .approve,
 997  .spam .approve,
 998  .trash .approve {
 999      display: inline;
1000  }
1001  
1002  td.action-links,
1003  th.action-links {
1004      text-align: left;
1005  }
1006  
1007  #misc-publishing-actions .notice {
1008      margin-right: 10px;
1009      margin-left: 10px;
1010  }
1011  
1012  /* Filter bar */
1013  .wp-filter {
1014      display: inline-block;
1015      position: relative;
1016      box-sizing: border-box;
1017      margin: 12px 0 25px;
1018      padding: 0 10px;
1019      width: 100%;
1020      box-shadow: 0 1px 1px rgba(0, 0, 0, 0.04);
1021      border: 1px solid #c3c4c7;
1022      background: #fff;
1023      color: #50575e;
1024      font-size: 13px;
1025  }
1026  
1027  .wp-filter a {
1028      text-decoration: none;
1029  }
1030  
1031  .filter-count {
1032      display: inline-block;
1033      vertical-align: middle;
1034      min-width: 4em;
1035  }
1036  
1037  .title-count,
1038  .filter-count .count {
1039      display: inline-block;
1040      position: relative;
1041      top: -1px;
1042      padding: 4px 10px;
1043      border-radius: 30px;
1044      background: #646970;
1045      color: #fff;
1046      font-size: 14px;
1047      font-weight: 600;
1048  }
1049  
1050  /* not a part of filter bar, but derived from it, so here for now */
1051  .title-count {
1052      display: inline;
1053      top: -3px;
1054      margin-right: 5px;
1055      margin-left: 20px;
1056  }
1057  
1058  .filter-items {
1059      float: right;
1060  }
1061  
1062  .filter-links {
1063      display: inline-block;
1064      margin: 0;
1065  }
1066  
1067  .filter-links li {
1068      display: inline-block;
1069      margin: 0;
1070  }
1071  
1072  .filter-links li > a {
1073      display: inline-block;
1074      margin: 0 10px;
1075      padding: 15px 0;
1076      border-bottom: 4px solid #fff;
1077      color: #646970;
1078      cursor: pointer;
1079  }
1080  
1081  .filter-links .current {
1082      box-shadow: none;
1083      border-bottom: 4px solid #646970;
1084      color: #1d2327;
1085  }
1086  
1087  .filter-links li > a:hover,
1088  .filter-links li > a:focus,
1089  .show-filters .filter-links a.current:hover,
1090  .show-filters .filter-links a.current:focus {
1091      color: #135e96;
1092  }
1093  
1094  .wp-filter .search-form {
1095      float: left;
1096      display: flex;
1097      align-items: center;
1098      column-gap: .5rem;
1099  }
1100  
1101  .wp-filter .search-form input[type="search"] {
1102      width: 280px;
1103      max-width: 100%;
1104  }
1105  
1106  .wp-filter .search-form select {
1107      margin: 0;
1108  }
1109  
1110  /* Use flexbox only on the plugins install page. The `filter-links` and search form children will become flex items. */
1111  .plugin-install-php .wp-filter {
1112      display: flex;
1113      flex-wrap: wrap;
1114      justify-content: space-between;
1115      align-items: center;
1116  }
1117  
1118  .wp-filter .search-form.search-plugins select,
1119  .wp-filter .search-form.search-plugins .wp-filter-search,
1120  .no-js .wp-filter .search-form.search-plugins .button {
1121      display: inline-block;
1122      vertical-align: top;
1123  }
1124  
1125  .wp-filter .button.drawer-toggle {
1126      margin: 10px 9px 0;
1127      padding: 0 6px 0 10px;
1128      border-color: transparent;
1129      background-color: transparent;
1130      color: #646970;
1131      vertical-align: baseline;
1132      box-shadow: none;
1133  }
1134  
1135  .wp-filter .drawer-toggle:before {
1136      content: "\f111" / '';
1137      margin: 0 0 0 5px;
1138      color: #646970;
1139      font: normal 16px/1 dashicons;
1140      vertical-align: text-bottom;
1141      -webkit-font-smoothing: antialiased;
1142      -moz-osx-font-smoothing: grayscale;
1143  }
1144  
1145  .wp-filter .button.drawer-toggle:hover,
1146  .wp-filter .drawer-toggle:hover:before,
1147  .wp-filter .button.drawer-toggle:focus,
1148  .wp-filter .drawer-toggle:focus:before {
1149      background-color: transparent;
1150      color: #135e96;
1151  }
1152  
1153  .wp-filter .button.drawer-toggle:hover,
1154  .wp-filter .button.drawer-toggle:focus:active {
1155      border-color: transparent;
1156  }
1157  
1158  .wp-filter .button.drawer-toggle:focus {
1159      border-color: #4f94d4;
1160  }
1161  
1162  .wp-filter .button.drawer-toggle:active {
1163      background: transparent;
1164      box-shadow: none;
1165      transform: none;
1166  }
1167  
1168  .wp-filter .drawer-toggle.current:before {
1169      color: #fff;
1170  }
1171  
1172  .filter-drawer,
1173  .wp-filter .favorites-form {
1174      display: none;
1175      margin: 0 -20px 0 -10px;
1176      padding: 20px;
1177      border-top: 1px solid #f0f0f1;
1178      background: #f6f7f7;
1179      overflow: hidden;
1180  }
1181  
1182  .wp-filter .favorites-form .favorites-username {
1183      display: flex;
1184      align-items: center;
1185      flex-wrap: wrap;
1186      gap: 0.5rem;
1187  }
1188  
1189  .wp-filter .favorites-form .favorites-username input {
1190      margin: 0;
1191  }
1192  
1193  .show-filters .filter-drawer,
1194  .show-favorites-form .favorites-form {
1195      display: block;
1196  }
1197  
1198  .show-filters .filter-links a.current {
1199      border-bottom: none;
1200  }
1201  
1202  .show-filters .wp-filter .button.drawer-toggle {
1203      border-radius: 2px;
1204      background: #646970;
1205      color: #fff;
1206  }
1207  
1208  .show-filters .wp-filter .drawer-toggle:hover,
1209  .show-filters .wp-filter .drawer-toggle:focus {
1210      background: #2271b1;
1211  }
1212  
1213  .show-filters .wp-filter .drawer-toggle:before {
1214      color: #fff;
1215  }
1216  
1217  .filter-group {
1218      box-sizing: border-box;
1219      position: relative;
1220      float: right;
1221      margin: 0 0 0 1%;
1222      padding: 20px 10px 10px;
1223      width: 24%;
1224      background: #fff;
1225      border: 1px solid #dcdcde;
1226      box-shadow: 0 1px 1px rgba(0, 0, 0, 0.04);
1227  }
1228  
1229  .filter-group legend {
1230      position: absolute;
1231      top: 10px;
1232      display: block;
1233      margin: 0;
1234      padding: 0;
1235      font-size: 1em;
1236      font-weight: 600;
1237  }
1238  
1239  .filter-drawer .filter-group-feature {
1240      margin: 28px 0 0;
1241      list-style-type: none;
1242      font-size: 12px;
1243  }
1244  
1245  .filter-drawer .filter-group-feature input,
1246  .filter-drawer .filter-group-feature label {
1247      line-height: 1.4;
1248  }
1249  
1250  .filter-drawer .filter-group-feature input {
1251      position: absolute;
1252      margin: 0;
1253  }
1254  
1255  .filter-group .filter-group-feature label {
1256      display: block;
1257      margin: 14px 23px 14px 0;
1258  }
1259  
1260  .filter-drawer .buttons {
1261      clear: both;
1262      margin-bottom: 20px;
1263  }
1264  
1265  .filter-drawer .filter-group + .buttons {
1266      margin-bottom: 0;
1267      padding-top: 20px;
1268  }
1269  
1270  .filter-drawer .buttons .button span {
1271      display: inline-block;
1272      opacity: 0.8;
1273      font-size: 12px;
1274      text-indent: 10px;
1275  }
1276  
1277  .wp-filter .button.clear-filters {
1278      display: none;
1279      margin-right: 10px;
1280  }
1281  
1282  .wp-filter .button-link.edit-filters {
1283      padding: 0 5px;
1284      line-height: 2.2;
1285  }
1286  
1287  .filtered-by {
1288      display: none;
1289      margin: 0;
1290  }
1291  
1292  .filtered-by > span {
1293      font-weight: 600;
1294  }
1295  
1296  .filtered-by a {
1297      margin-right: 10px;
1298  }
1299  
1300  .filtered-by .tags {
1301      display: flex;
1302      align-items: flex-start;
1303      flex-wrap: wrap;
1304      gap: 8px;
1305  }
1306  
1307  .filtered-by .tag {
1308      padding: 4px 8px;
1309      border: 1px solid #dcdcde;
1310      box-shadow: 0 1px 1px rgba(0, 0, 0, 0.04);
1311      background: #fff;
1312      font-size: 11px;
1313  }
1314  
1315  .filters-applied .filter-group,
1316  .filters-applied .filter-drawer .buttons,
1317  .filters-applied .filter-drawer br {
1318      display: none;
1319  }
1320  
1321  .filters-applied .filtered-by {
1322      display: flex;
1323      align-items: center;
1324      flex-wrap: wrap;
1325      gap: 10px;
1326  }
1327  
1328  .filters-applied .filter-drawer {
1329      padding: 20px;
1330  }
1331  
1332  .show-filters .favorites-form,
1333  .show-filters .content-filterable,
1334  .show-filters.filters-applied.loading-content .content-filterable,
1335  .loading-content .content-filterable,
1336  .error .content-filterable {
1337      display: none;
1338  }
1339  
1340  .show-filters.filters-applied .content-filterable {
1341      display: block;
1342  }
1343  
1344  .loading-content .spinner {
1345      display: block;
1346      margin: 40px auto 0;
1347      float: none;
1348  }
1349  
1350  @media only screen and (max-width: 1138px) {
1351      .wp-filter .search-form {
1352          margin: 11px 0;
1353      }
1354  }
1355  
1356  @media only screen and (max-width: 1120px) {
1357      .filter-drawer {
1358          border-bottom: 1px solid #f0f0f1;
1359      }
1360  
1361      .filter-group {
1362          margin-bottom: 0;
1363          margin-top: 5px;
1364          width: 100%;
1365      }
1366  
1367      .filter-group li {
1368          margin: 10px 0;
1369      }
1370  }
1371  
1372  @media only screen and (max-width: 1000px) {
1373      .filter-items {
1374          float: none;
1375      }
1376  
1377      .wp-filter .media-toolbar-primary,
1378      .wp-filter .media-toolbar-secondary,
1379      .wp-filter .search-form {
1380          float: none; /* Remove float from media-views.css */
1381          position: relative;
1382          max-width: 100%;
1383      }
1384      .wp-filter .search-form {
1385          margin: 11px 0;
1386          flex-wrap: wrap;
1387          row-gap: 10px;
1388      }
1389  }
1390  
1391  @media only screen and (max-width: 782px) {
1392      .filter-group li {
1393          padding: 0;
1394          width: 50%;
1395      }
1396  }
1397  
1398  @media only screen and (max-width: 320px) {
1399      .filter-count {
1400          display: none;
1401      }
1402  
1403      .wp-filter .drawer-toggle {
1404          margin: 10px 0;
1405      }
1406  
1407      .filter-group li,
1408      .wp-filter .search-form input[type="search"] {
1409          width: 100%;
1410      }
1411  }
1412  
1413  /*------------------------------------------------------------------------------
1414    4.0 - Notifications
1415  ------------------------------------------------------------------------------*/
1416  
1417  .notice,
1418  div.updated,
1419  div.error {
1420      background: #fff;
1421      border: 1px solid #c3c4c7;
1422      border-right-width: 4px;
1423      box-shadow: 0 1px 1px rgba(0, 0, 0, 0.04);
1424      margin: 5px 15px 2px;
1425      padding: 1px 12px;
1426  }
1427  
1428  div[class="update-message"] { /* back-compat for pre-4.6 */
1429      padding: 0.5em 0 0.5em 12px;
1430  }
1431  
1432  .notice p,
1433  .notice-title,
1434  div.updated p,
1435  div.error p,
1436  .form-table td .notice p {
1437      margin: 0.5em 0;
1438      padding: 2px;
1439  }
1440  
1441  .error a {
1442      text-decoration: underline;
1443  }
1444  
1445  .updated a {
1446      padding-bottom: 2px;
1447  }
1448  
1449  .notice-alt {
1450      box-shadow: none;
1451  }
1452  
1453  .notice-large {
1454      padding: 10px 20px;
1455  }
1456  
1457  .notice-title {
1458      display: inline-block;
1459      color: #1d2327;
1460      font-size: 18px;
1461  }
1462  
1463  .wp-core-ui .notice.is-dismissible {
1464      padding-left: 38px;
1465      position: relative;
1466  }
1467  
1468  .notice-dismiss {
1469      position: absolute;
1470      top: 0;
1471      left: 1px;
1472      border: none;
1473      margin: 0;
1474      padding: 9px;
1475      background: none;
1476      color: #787c82;
1477      cursor: pointer;
1478  }
1479  
1480  .notice-dismiss:hover:before,
1481  .notice-dismiss:active:before,
1482  .notice-dismiss:focus:before {
1483      color: #d63638;
1484  }
1485  
1486  .notice-dismiss:focus {
1487      box-shadow: 0 0 0 2px #2271b1;
1488      /* Only visible in Windows High Contrast mode */
1489      outline: 2px solid transparent;
1490  }
1491  
1492  .notice-success,
1493  div.updated {
1494      border-right-color: #00a32a;
1495  }
1496  
1497  .notice-success.notice-alt {
1498      background-color: #edfaef;
1499  }
1500  
1501  .notice-warning {
1502      border-right-color: #dba617;
1503  }
1504  
1505  .notice-warning.notice-alt {
1506      background-color: #fcf9e8;
1507  }
1508  
1509  .notice-error,
1510  div.error {
1511      border-right-color: #d63638;
1512  }
1513  
1514  .notice-error.notice-alt {
1515      background-color: #fcf0f1;
1516  }
1517  
1518  .notice-info {
1519      border-right-color: #72aee6;
1520  }
1521  
1522  .notice-info.notice-alt {
1523      background-color: #f0f6fc;
1524  }
1525  
1526  #plugin-information-footer .update-now:not(.button-disabled):before {
1527      color: #d63638;
1528      content: "\f463" / '';
1529      display: inline-block;
1530      font: normal 20px/1 dashicons;
1531      margin: -3px -2px 0 5px;
1532      -webkit-font-smoothing: antialiased;
1533      -moz-osx-font-smoothing: grayscale;
1534      vertical-align: middle;
1535  }
1536  
1537  #plugin-information-footer .notice {
1538      margin-top: -5px;
1539  }
1540  
1541  .update-message p:before,
1542  .updating-message p:before,
1543  .updated-message p:before,
1544  .import-php .updating-message:before,
1545  .button.updating-message:before,
1546  .button.updated-message:before,
1547  .button.installed:before,
1548  .button.installing:before,
1549  .button.activating-message:before,
1550  .button.activated-message:before {
1551      display: inline-block;
1552      font: normal 20px/1 'dashicons';
1553      -webkit-font-smoothing: antialiased;
1554      -moz-osx-font-smoothing: grayscale;
1555      vertical-align: top;
1556  }
1557  
1558  .wrap .notice,
1559  .wrap div.updated,
1560  .wrap div.error,
1561  .media-upload-form .notice,
1562  .media-upload-form div.error {
1563      margin: 5px 0 15px;
1564  }
1565  
1566  .wrap #templateside .notice {
1567      display: block;
1568      margin: 0;
1569      padding: 5px 8px;
1570      font-weight: 600;
1571      text-decoration: none;
1572  }
1573  
1574  .wrap #templateside span.notice {
1575      margin-right: -12px;
1576  }
1577  
1578  #templateside li.notice a {
1579      padding: 0;
1580  }
1581  
1582  /* Update icon. */
1583  .update-message p:before,
1584  .updating-message p:before,
1585  .import-php .updating-message:before,
1586  .button.updating-message:before,
1587  .button.installing:before,
1588  .button.activating-message:before {
1589      color: #d63638;
1590      content: "\f463" / '';
1591  }
1592  
1593  /* Spins the update icon. */
1594  .updating-message p:before,
1595  .import-php .updating-message:before,
1596  .button.updating-message:before,
1597  .button.installing:before,
1598  .button.activating-message:before,
1599  .plugins .column-auto-updates .dashicons-update.spin,
1600  .theme-overlay .theme-autoupdate .dashicons-update.spin {
1601      animation: rotation 2s infinite linear;
1602  }
1603  
1604  @media (prefers-reduced-motion: reduce) {
1605      .updating-message p:before,
1606      .import-php .updating-message:before,
1607      .button.updating-message:before,
1608      .button.installing:before,
1609      .button.activating-message:before,
1610      .plugins .column-auto-updates .dashicons-update.spin,
1611      .theme-overlay .theme-autoupdate .dashicons-update.spin {
1612          animation: none;
1613      }
1614  }
1615  
1616  .theme-overlay .theme-autoupdate .dashicons-update.spin {
1617      margin-left: 3px;
1618  }
1619  
1620  /* Updated icon (check mark). */
1621  .updated-message p:before,
1622  .installed p:before,
1623  .button.updated-message:before,
1624  .button.activated-message:before {
1625      color: #68de7c;
1626      content: "\f147" / '';
1627  }
1628  
1629  /* Error icon. */
1630  .update-message.notice-error p:before {
1631      color: #d63638;
1632      content: "\f534" / '';
1633  }
1634  
1635  .wrap .notice p:before,
1636  .import-php .updating-message:before {
1637      margin-left: 6px;
1638  }
1639  
1640  .import-php .updating-message:before {
1641      vertical-align: bottom;
1642  }
1643  
1644  #update-nag,
1645  .update-nag {
1646      display: inline-block;
1647      line-height: 1.4;
1648      padding: 11px 15px;
1649      font-size: 14px;
1650      margin: 25px 2px 0 20px;
1651  }
1652  
1653  ul#dismissed-updates {
1654      display: none;
1655  }
1656  
1657  #dismissed-updates li > p {
1658      margin-top: 0;
1659  }
1660  
1661  #dismiss,
1662  #undismiss {
1663      margin-right: 0.5em;
1664  }
1665  
1666  form.upgrade {
1667      margin-top: 8px;
1668  }
1669  
1670  form.upgrade .hint {
1671      font-style: italic;
1672      font-size: 85%;
1673      margin: -0.5em 0 2em;
1674  }
1675  
1676  .update-php .spinner {
1677      float: none;
1678      margin: -4px 0;
1679  }
1680  
1681  h2.wp-current-version {
1682      margin-bottom: .3em;
1683  }
1684  
1685  p.update-last-checked {
1686      margin-top: 0;
1687  }
1688  
1689  p.auto-update-status {
1690      margin-top: 2em;
1691      line-height: 1.8;
1692  }
1693  
1694  #ajax-loading,
1695  .ajax-loading,
1696  .ajax-feedback,
1697  .imgedit-wait-spin,
1698  .list-ajax-loading { /* deprecated */
1699      visibility: hidden;
1700  }
1701  
1702  #ajax-response.alignleft {
1703      margin-right: 2em;
1704  }
1705  
1706  .button.updating-message:before,
1707  .button.updated-message:before,
1708  .button.installed:before,
1709  .button.installing:before,
1710  .button.activated-message:before,
1711  .button.activating-message:before {
1712      margin: 3px -2px 0 5px;
1713  }
1714  
1715  #plugin-information-footer .button {
1716      padding: 0 14px;
1717      line-height: 2.71428571; /* 38px */
1718      font-size: 14px;
1719      vertical-align: middle;
1720      min-height: 40px;
1721      margin-bottom: 4px;
1722  }
1723  
1724  #plugin-information-footer .button.installed:before,
1725  #plugin-information-footer .button.installing:before,
1726  #plugin-information-footer .button.updating-message:before,
1727  #plugin-information-footer .button.updated-message:before,
1728  #plugin-information-footer .button.activated-message:before,
1729  #plugin-information-footer .button.activating-message:before {
1730      margin: 9px -2px 0 5px;
1731  }
1732  
1733  #plugin-information-footer .button.update-now.updating-message:before {
1734      margin: -3px -2px 0 5px;
1735  }
1736  
1737  .button-primary.updating-message:before,
1738  .button-primary.activating-message:before {
1739      color: #fff;
1740  }
1741  
1742  .button-primary.updated-message:before,
1743  .button-primary.activated-message:before {
1744      color: #9ec2e6;
1745  }
1746  
1747  .button.updated-message,
1748  .button.activated-message {
1749      transition-property: border, background, color;
1750      transition-duration: .05s;
1751      transition-timing-function: ease-in-out;
1752  }
1753  
1754  
1755  /* @todo: this does not need its own section anymore */
1756  /*------------------------------------------------------------------------------
1757    6.0 - Admin Header
1758  ------------------------------------------------------------------------------*/
1759  #adminmenu a,
1760  #taglist a,
1761  #catlist a {
1762      text-decoration: none;
1763  }
1764  
1765  /*------------------------------------------------------------------------------
1766    6.1 - Screen Options Tabs
1767  ------------------------------------------------------------------------------*/
1768  
1769  #screen-options-wrap,
1770  #contextual-help-wrap {
1771      margin: 0;
1772      padding: 8px 20px 12px;
1773      position: relative;
1774  }
1775  
1776  #contextual-help-wrap {
1777      overflow: auto;
1778      margin-right: 0;
1779  }
1780  
1781  #screen-meta-links {
1782      float: left;
1783      margin: 0 0 0 20px;
1784  }
1785  
1786  /* screen options and help tabs revert */
1787  #screen-meta {
1788      display: none;
1789      margin: 0 0 -1px 20px;
1790      position: relative;
1791      background-color: #fff;
1792      border: 1px solid #c3c4c7;
1793      border-top: none;
1794      box-shadow: 0 0 0 transparent;
1795  }
1796  
1797  #screen-options-link-wrap,
1798  #contextual-help-link-wrap {
1799      float: right;
1800      margin: 0 6px 0 0;
1801  }
1802  
1803  #screen-meta-links .screen-meta-toggle {
1804      position: relative;
1805      top: 0;
1806  }
1807  
1808  #screen-meta-links .show-settings {
1809      border: 1px solid #c3c4c7;
1810      border-top: none;
1811      height: auto;
1812      margin-bottom: 0;
1813      padding: 3px 16px 3px 6px;
1814      background: #fff;
1815      border-radius: 0 0 4px 4px;
1816      color: #646970;
1817      line-height: 1.7;
1818      box-shadow: 0 0 0 transparent;
1819      transition: box-shadow 0.1s linear;
1820  }
1821  
1822  #screen-meta-links .show-settings:hover,
1823  #screen-meta-links .show-settings:active,
1824  #screen-meta-links .show-settings:focus {
1825      color: #2c3338;
1826  }
1827  
1828  #screen-meta-links .show-settings:focus {
1829      border-color: #2271b1;
1830      box-shadow: 0 0 0 1px #2271b1;
1831      /* Only visible in Windows High Contrast mode */
1832      outline: 2px solid transparent;
1833  }
1834  
1835  #screen-meta-links .show-settings:active {
1836      transform: none;
1837  }
1838  
1839  #screen-meta-links .show-settings:after {
1840      left: 0;
1841      content: "\f140" / '';
1842      font: normal 20px/1 dashicons;
1843      display: inline-block;
1844      padding: 0 0 0 5px;
1845      bottom: 2px;
1846      position: relative;
1847      vertical-align: bottom;
1848      -webkit-font-smoothing: antialiased;
1849      -moz-osx-font-smoothing: grayscale;
1850      text-decoration: none;
1851  }
1852  
1853  #screen-meta-links .screen-meta-active:after {
1854      content: "\f142" / '';
1855  }
1856  
1857  /* end screen options and help tabs */
1858  
1859  .toggle-arrow {
1860      background-repeat: no-repeat;
1861      background-position: top right;
1862      background-color: transparent;
1863      height: 22px;
1864      line-height: 22px;
1865      display: block;
1866  }
1867  
1868  .toggle-arrow-active {
1869      background-position: bottom right;
1870  }
1871  
1872  #screen-options-wrap h5, /* Back-compat for old plugins */
1873  #screen-options-wrap legend,
1874  #contextual-help-wrap h5 {
1875      margin: 0;
1876      padding: 8px 0;
1877      font-size: 13px;
1878      font-weight: 600;
1879  }
1880  
1881  .metabox-prefs label {
1882      display: inline-block;
1883      padding-left: 15px;
1884      line-height: 2.35;
1885  }
1886  
1887  #number-of-columns {
1888      display: inline-block;
1889      vertical-align: middle;
1890      line-height: 30px;
1891  }
1892  
1893  .metabox-prefs input[type=checkbox] {
1894      margin-top: 0;
1895      margin-left: 6px;
1896  }
1897  
1898  .metabox-prefs label input,
1899  .metabox-prefs label input[type=checkbox] {
1900      margin: -4px 0 0 5px;
1901  }
1902  
1903  .metabox-prefs .columns-prefs label input {
1904      margin: -1px 0 0 2px;
1905  }
1906  
1907  .metabox-prefs label a {
1908      display: none;
1909  }
1910  
1911  .metabox-prefs .screen-options input,
1912  .metabox-prefs .screen-options label {
1913      margin-top: 0;
1914      margin-bottom: 0;
1915      vertical-align: middle;
1916  }
1917  
1918  .metabox-prefs .screen-options .screen-per-page {
1919      margin-left: 15px;
1920      padding-left: 0;
1921  }
1922  
1923  .metabox-prefs .screen-options label {
1924      line-height: 2.2;
1925      padding-left: 0;
1926  }
1927  
1928  .screen-options + .screen-options {
1929      margin-top: 10px;
1930  }
1931  
1932  .metabox-prefs .submit {
1933      margin-top: 1em;
1934      padding: 0;
1935  }
1936  
1937  /*------------------------------------------------------------------------------
1938    6.2 - Help Menu
1939  ------------------------------------------------------------------------------*/
1940  
1941  #contextual-help-wrap {
1942      padding: 0;
1943  }
1944  
1945  #contextual-help-columns {
1946      position: relative;
1947  }
1948  
1949  #contextual-help-back {
1950      position: absolute;
1951      top: 0;
1952      bottom: 0;
1953      right: 150px;
1954      left: 170px;
1955      border: 1px solid #c3c4c7;
1956      border-top: none;
1957      border-bottom: none;
1958      background: #f0f6fc;
1959  }
1960  
1961  #contextual-help-wrap.no-sidebar #contextual-help-back {
1962      left: 0;
1963      border-left-width: 0;
1964      border-bottom-left-radius: 2px;
1965  }
1966  
1967  .contextual-help-tabs {
1968      float: right;
1969      width: 150px;
1970      margin: 0;
1971  }
1972  
1973  .contextual-help-tabs ul {
1974      margin: 1em 0;
1975  }
1976  
1977  .contextual-help-tabs li {
1978      margin-bottom: 0;
1979      list-style-type: none;
1980      border-style: solid;
1981      border-width: 0 2px 0 0;
1982      border-color: transparent;
1983  }
1984  
1985  .contextual-help-tabs a {
1986      display: block;
1987      padding: 5px 12px 5px 5px;
1988      line-height: 1.4;
1989      text-decoration: none;
1990      border: 1px solid transparent;
1991      border-left: none;
1992      border-right: none;
1993  }
1994  
1995  .contextual-help-tabs a:hover {
1996      color: #2c3338;
1997  }
1998  
1999  .contextual-help-tabs .active {
2000      padding: 0;
2001      margin: 0 0 0 -1px;
2002      border-right: 2px solid #72aee6;
2003      background: #f0f6fc;
2004      box-shadow: 0 2px 0 rgba(0, 0, 0, 0.02), 0 1px 0 rgba(0, 0, 0, 0.02);
2005  }
2006  
2007  .contextual-help-tabs .active a {
2008      border-color: #c3c4c7;
2009      color: #2c3338;
2010  }
2011  
2012  .contextual-help-tabs-wrap {
2013      padding: 0 20px;
2014      overflow: auto;
2015  }
2016  
2017  .help-tab-content {
2018      display: none;
2019      margin: 0 0 12px 22px;
2020      line-height: 1.6;
2021  }
2022  
2023  .help-tab-content.active {
2024      display: block;
2025  }
2026  
2027  .help-tab-content ul li {
2028      list-style-type: disc;
2029      margin-right: 18px;
2030  }
2031  
2032  .contextual-help-sidebar {
2033      width: 150px;
2034      float: left;
2035      padding: 0 12px 0 8px;
2036      overflow: auto;
2037  }
2038  
2039  /*------------------------------------------------------------------------------
2040    8.0 - Layout Blocks
2041  ------------------------------------------------------------------------------*/
2042  
2043  html.wp-toolbar {
2044      padding-top: var(--wp-admin--admin-bar--height);
2045      box-sizing: border-box;
2046      -ms-overflow-style: scrollbar; /* See ticket #48545 */
2047  }
2048  
2049  .widefat th,
2050  .widefat td {
2051      color: #50575e;
2052  }
2053  
2054  .widefat th,
2055  .widefat thead td,
2056  .widefat tfoot td {
2057      font-weight: 400;
2058  }
2059  
2060  .widefat thead tr th,
2061  .widefat thead tr td,
2062  .widefat tfoot tr th,
2063  .widefat tfoot tr td {
2064      color: #2c3338;
2065  }
2066  
2067  .widefat td p {
2068      margin: 2px 0 0.8em;
2069  }
2070  
2071  .widefat p,
2072  .widefat ol,
2073  .widefat ul {
2074      color: #2c3338;
2075  }
2076  
2077  .widefat .column-comment p {
2078      margin: 0.6em 0;
2079  }
2080  
2081  .widefat .column-comment ul {
2082      list-style: initial;
2083      margin-right: 2em;
2084  }
2085  
2086  /* Screens with postboxes */
2087  .postbox-container {
2088      float: right;
2089  }
2090  
2091  .postbox-container .meta-box-sortables {
2092      box-sizing: border-box;
2093  }
2094  
2095  #wpbody-content .metabox-holder {
2096      padding-top: 10px;
2097  }
2098  
2099  .metabox-holder .postbox-container .meta-box-sortables {
2100      /* The jQuery UI Sortables need some initial height to work properly. */
2101      min-height: 1px;
2102      position: relative;
2103  }
2104  
2105  #post-body-content {
2106      width: 100%;
2107      min-width: 463px;
2108      float: right;
2109  }
2110  
2111  #post-body.columns-2 #postbox-container-1 {
2112      float: left;
2113      margin-left: -300px;
2114      width: 280px;
2115  }
2116  
2117  #post-body.columns-2 #side-sortables {
2118      min-height: 250px;
2119  }
2120  
2121  /* one column on the dash */
2122  @media only screen and (max-width: 799px) {
2123      #wpbody-content .metabox-holder .postbox-container .empty-container {
2124          outline: none;
2125          height: 0;
2126          min-height: 0;
2127      }
2128  }
2129  
2130  .js .widget .widget-top,
2131  .js .postbox .hndle {
2132      cursor: move;
2133  }
2134  
2135  .js .widget .widget-top.is-non-sortable,
2136  .js .postbox .hndle.is-non-sortable {
2137      cursor: auto;
2138  }
2139  
2140  /* Configurable dashboard widgets "Configure" edit-box link. */
2141  .hndle a {
2142      font-size: 12px;
2143      font-weight: 400;
2144  }
2145  
2146  .postbox-header {
2147      display: flex;
2148      align-items: center;
2149      justify-content: space-between;
2150      border-bottom: 1px solid #c3c4c7;
2151  }
2152  
2153  .postbox-header .hndle {
2154      flex-grow: 1;
2155      /* Handle the alignment for the configurable dashboard widgets "Configure" edit-box link. */
2156      display: flex;
2157      justify-content: space-between;
2158      align-items: center;
2159  }
2160  
2161  .postbox-header .handle-actions {
2162      flex-shrink: 0;
2163  }
2164  
2165  /* Post box order and toggle buttons. */
2166  .postbox .handle-order-higher,
2167  .postbox .handle-order-lower,
2168  .postbox .handlediv {
2169      width: 1.62rem;
2170      height: 1.62rem;
2171      margin: 0;
2172      padding: 0;
2173      border: 0;
2174      background: none;
2175      cursor: pointer;
2176  }
2177  
2178  .postbox .handle-order-higher,
2179  .postbox .handle-order-lower {
2180      color: #787c82;
2181      width: 1.62rem;
2182  }
2183  
2184  /* Post box order buttons in the block editor meta boxes area. */
2185  .edit-post-meta-boxes-area .postbox .handle-order-higher,
2186  .edit-post-meta-boxes-area .postbox .handle-order-lower {
2187      width: 44px;
2188      height: 44px;
2189      color: #1d2327
2190  }
2191  
2192  .postbox .handle-order-higher[aria-disabled="true"],
2193  .postbox .handle-order-lower[aria-disabled="true"] {
2194      cursor: default;
2195      color: #a7aaad;
2196  }
2197  
2198  .sortable-placeholder {
2199      border: 1px dashed #c3c4c7;
2200      margin-bottom: 20px;
2201  }
2202  
2203  .postbox,
2204  .stuffbox {
2205      margin-bottom: 20px;
2206      padding: 0;
2207      line-height: 1;
2208  }
2209  
2210  .postbox.closed {
2211      border-bottom: 0;
2212  }
2213  
2214  /* user-select is not a part of the CSS standard - may change behavior in the future */
2215  .postbox .hndle,
2216  .stuffbox .hndle {
2217      -webkit-user-select: none;
2218      user-select: none;
2219  }
2220  
2221  .postbox .inside {
2222      padding: 0 12px 12px;
2223      line-height: 1.4;
2224      font-size: 13px;
2225  }
2226  
2227  .stuffbox .inside {
2228      padding: 0;
2229      line-height: 1.4;
2230      font-size: 13px;
2231      margin-top: 0;
2232  }
2233  
2234  .postbox .inside {
2235      margin: 11px 0;
2236      position: relative;
2237  }
2238  
2239  .postbox .inside > p:last-child,
2240  .rss-widget ul li:last-child {
2241      margin-bottom: 1px !important;
2242  }
2243  
2244  .postbox.closed h3 {
2245      border: none;
2246      box-shadow: none;
2247  }
2248  
2249  .postbox table.form-table {
2250      margin-bottom: 0;
2251  }
2252  
2253  .postbox table.widefat {
2254      box-shadow: none;
2255  }
2256  
2257  .temp-border {
2258      border: 1px dotted #c3c4c7;
2259  }
2260  
2261  .columns-prefs label {
2262      padding: 0 0 0 10px;
2263  }
2264  
2265  /* @todo: what is this doing here */
2266  #dashboard_right_now .versions .b,
2267  #post-status-display,
2268  #post-visibility-display,
2269  #adminmenu .wp-submenu li.current,
2270  #adminmenu .wp-submenu li.current a,
2271  #adminmenu .wp-submenu li.current a:hover,
2272  .media-item .percent,
2273  .plugins .name,
2274  #pass-strength-result.strong,
2275  #pass-strength-result.short,
2276  #ed_reply_toolbar #ed_reply_strong,
2277  .item-controls .item-order a,
2278  .feature-filter .feature-name,
2279  #comment-status-display {
2280      font-weight: 600;
2281  }
2282  
2283  /*------------------------------------------------------------------------------
2284    21.0 - Admin Footer
2285  ------------------------------------------------------------------------------*/
2286  
2287  #wpfooter {
2288      position: absolute;
2289      bottom: 0;
2290      right: 0;
2291      left: 0;
2292      padding: 10px 20px;
2293      color: #50575e;
2294  }
2295  
2296  #wpfooter p {
2297      font-size: 13px;
2298      margin: 0;
2299      line-height: 1.55;
2300  }
2301  
2302  #footer-thankyou {
2303      font-style: italic;
2304  }
2305  
2306  /*------------------------------------------------------------------------------
2307    25.0 - Tabbed Admin Screen Interface (Experimental)
2308  ------------------------------------------------------------------------------*/
2309  
2310  .nav-tab {
2311      float: right;
2312      border: 1px solid #c3c4c7;
2313      border-bottom: none;
2314      margin-right: 0.5em; /* half the font size so set the font size properly */
2315      padding: 5px 10px;
2316      font-size: 14px;
2317      line-height: 1.71428571;
2318      font-weight: 600;
2319      background: #dcdcde;
2320      color: #50575e;
2321      text-decoration: none;
2322      white-space: nowrap;
2323  }
2324  
2325  h3 .nav-tab, /* Back-compat for pre-4.4 */
2326  .nav-tab-small .nav-tab {
2327      padding: 5px 14px;
2328      font-size: 12px;
2329      line-height: 1.33;
2330  }
2331  
2332  .nav-tab:hover,
2333  .nav-tab:focus {
2334      background-color: #fff;
2335      color: #3c434a;
2336  }
2337  
2338  .nav-tab-active,
2339  .nav-tab:focus:active {
2340      box-shadow: none;
2341  }
2342  
2343  .nav-tab-active {
2344      margin-bottom: -1px;
2345      color: #3c434a;
2346  }
2347  
2348  .nav-tab-active,
2349  .nav-tab-active:hover,
2350  .nav-tab-active:focus,
2351  .nav-tab-active:focus:active {
2352      border-bottom: 1px solid #f0f0f1;
2353      background: #f0f0f1;
2354      color: #000;
2355  }
2356  
2357  h1.nav-tab-wrapper, /* Back-compat for pre-4.4 */
2358  .wrap h2.nav-tab-wrapper, /* higher specificity to override .wrap > h2:first-child */
2359  .nav-tab-wrapper {
2360      border-bottom: 1px solid #c3c4c7;
2361      margin: 0;
2362      padding-top: 9px;
2363      padding-bottom: 0;
2364      line-height: inherit;
2365  }
2366  
2367  /* Back-compat for plugins. Deprecated. Use .wp-clearfix instead. */
2368  .nav-tab-wrapper:not(.wp-clearfix):after {
2369      content: "";
2370      display: table;
2371      clear: both;
2372  }
2373  
2374  /*------------------------------------------------------------------------------
2375    26.0 - Misc
2376  ------------------------------------------------------------------------------*/
2377  
2378  .spinner {
2379      background: url(../images/spinner.gif) no-repeat;
2380      background-size: 20px 20px;
2381      display: inline-block;
2382      visibility: hidden;
2383      float: left;
2384      vertical-align: middle;
2385      opacity: 0.7;
2386      filter: alpha(opacity=70);
2387      width: 20px;
2388      height: 20px;
2389      margin: 4px 10px 0;
2390  }
2391  
2392  .spinner.is-active,
2393  .loading-content .spinner {
2394      visibility: visible;
2395  }
2396  
2397  #template > div {
2398      margin-left: 16em;
2399  }
2400  #template .notice {
2401      margin-top: 1em;
2402      margin-left: 3%;
2403  }
2404  #template .notice p {
2405      width: auto;
2406  }
2407  #template .submit .spinner {
2408      float: none;
2409  }
2410  
2411  .metabox-holder .stuffbox > h3, /* Back-compat for pre-4.4 */
2412  .metabox-holder .postbox > h3, /* Back-compat for pre-4.4 */
2413  .metabox-holder h3.hndle, /* Back-compat for pre-4.4 */
2414  .metabox-holder h2.hndle {
2415      font-size: 14px;
2416      padding: 8px 12px;
2417      margin: 0;
2418      line-height: 1.4;
2419  }
2420  
2421  /* Back-compat for nav-menus screen */
2422  .nav-menus-php .metabox-holder h3 {
2423      padding: 0;
2424  }
2425  
2426  .accordion-container h3.accordion-section-title {
2427      padding: 0 !important;
2428  }
2429  
2430  .accordion-section-title button.accordion-trigger,
2431  .nav-menus-php .metabox-holder .accordion-section-title button.accordion-trigger {
2432      background: inherit;
2433      color: #1d2327;
2434      display: block;
2435      position: relative;
2436      text-align: right;
2437      width: 100%;
2438      outline: none;
2439      border: 0;
2440      padding: 10px 14px 11px 10px;
2441      line-height: 1.5;
2442      cursor: pointer;
2443  }
2444  
2445  .accordion-section-title button.accordion-trigger:focus,
2446  .nav-menus-php .metabox-holder .accordion-section-title button.accordion-trigger:focus {
2447      box-shadow: 0 0 0 2px #2271b1;
2448      outline: 2px solid transparent;
2449  }
2450  
2451  .accordion-section-title span.dashicons.dashicons-arrow-down,
2452  .nav-menus-php .metabox-holder .accordion-section-title span.dashicons.dashicons-arrow-down {
2453      position: absolute;
2454      left: 10px;
2455      right: auto;
2456      color: #787c82;
2457      border-radius: 50px;
2458      top: 50%;
2459      transform: translateY(-50%);
2460  }
2461  
2462  .accordion-section-title:hover span.dashicons.dashicons-arrow-down,
2463  .nav-menus-php .metabox-holder .accordion-section-title:hover span.dashicons.dashicons-arrow-down {
2464      color: #1d2327;
2465  }
2466  
2467  .accordion-section-title span.dashicons.dashicons-arrow-down::before,
2468  .nav-menus-php .metabox-holder .accordion-section-title span.dashicons.dashicons-arrow-down::before {
2469      position: relative;
2470      right: -1px;
2471  }
2472  
2473  .accordion-section.open .accordion-section-title span.dashicons.dashicons-arrow-down,
2474  .nav-menus-php .metabox-holder .accordion-section.open .accordion-section-title span.dashicons.dashicons-arrow-down {
2475      transform: rotate(-180deg) translate(0, 50%);
2476  }
2477  
2478  #templateside ul li a {
2479      text-decoration: none;
2480  }
2481  
2482  .plugin-install #description,
2483  .plugin-install-network #description {
2484      width: 60%;
2485  }
2486  
2487  table .vers,
2488  table .column-visible,
2489  table .column-rating {
2490      text-align: right;
2491  }
2492  
2493  .attention,
2494  .error-message {
2495      color: #d63638;
2496      font-weight: 600;
2497  }
2498  
2499  /* Scrollbar fix for bulk upgrade iframe */
2500  body.iframe {
2501      height: 98%;
2502  }
2503  
2504  /* Upgrader styles, Specific to Language Packs */
2505  .lp-show-latest p {
2506      display: none;
2507  }
2508  .lp-show-latest p:last-child,
2509  .lp-show-latest .lp-error p {
2510      display: block;
2511  }
2512  
2513  /* - Only used once or twice in all of WP - deprecate for global style
2514  ------------------------------------------------------------------------------*/
2515  .media-icon {
2516      width: 62px; /* icon + border */
2517      text-align: center;
2518  }
2519  
2520  .media-icon img {
2521      border: 1px solid #dcdcde;
2522      border: 1px solid rgba(0, 0, 0, 0.07);
2523  }
2524  
2525  #howto {
2526      font-size: 11px;
2527      margin: 0 5px;
2528      display: block;
2529  }
2530  
2531  .importers {
2532      font-size: 16px;
2533      width: auto;
2534  }
2535  
2536  .importers td {
2537      padding-left: 14px;
2538      line-height: 1.4;
2539  }
2540  
2541  .importers .import-system {
2542      max-width: 250px;
2543  }
2544  
2545  .importers td.desc {
2546      max-width: 500px;
2547  }
2548  
2549  .importer-title,
2550  .importer-desc,
2551  .importer-action {
2552      display: block;
2553  }
2554  
2555  .importer-title {
2556      color: #000;
2557      font-size: 14px;
2558      font-weight: 400;
2559      margin-bottom: .2em;
2560  }
2561  
2562  .importer-action {
2563      line-height: 1.55; /* Same as with .updating-message */
2564      color: #50575e;
2565      margin-bottom: 1em;
2566  }
2567  
2568  #post-body #post-body-content #namediv h3, /* Back-compat for pre-4.4 */
2569  #post-body #post-body-content #namediv h2 {
2570      margin-top: 0;
2571  }
2572  
2573  .edit-comment-author {
2574      color: #1d2327;
2575      border-bottom: 1px solid #f0f0f1;
2576  }
2577  
2578  #namediv h3 label, /* Back-compat for pre-4.4 */
2579  #namediv h2 label {
2580      vertical-align: baseline;
2581  }
2582  
2583  #namediv table {
2584      width: 100%;
2585  }
2586  
2587  #namediv td.first {
2588      width: 10px;
2589      white-space: nowrap;
2590  }
2591  
2592  #namediv input {
2593      width: 100%;
2594  }
2595  
2596  #namediv p {
2597      margin: 10px 0;
2598  }
2599  
2600  /* - Used - but could/should be deprecated with a CSS reset
2601  ------------------------------------------------------------------------------*/
2602  .zerosize {
2603      height: 0;
2604      width: 0;
2605      margin: 0;
2606      border: 0;
2607      padding: 0;
2608      overflow: hidden;
2609      position: absolute;
2610  }
2611  
2612  br.clear {
2613      height: 2px;
2614      line-height: 0.15;
2615  }
2616  
2617  .checkbox {
2618      border: none;
2619      margin: 0;
2620      padding: 0;
2621  }
2622  
2623  fieldset {
2624      border: 0;
2625      padding: 0;
2626      margin: 0;
2627  }
2628  
2629  .post-categories {
2630      display: inline;
2631      margin: 0;
2632      padding: 0;
2633  }
2634  
2635  .post-categories li {
2636      display: inline;
2637  }
2638  
2639  /* Star Ratings - Back-compat for pre-3.8 */
2640  div.star-holder {
2641      position: relative;
2642      height: 17px;
2643      width: 100px;
2644      background: url(../images/stars.png?ver=20121108) repeat-x bottom right;
2645  }
2646  
2647  div.star-holder .star-rating {
2648      background: url(../images/stars.png?ver=20121108) repeat-x top right;
2649      height: 17px;
2650      float: right;
2651  }
2652  
2653  /* Star Ratings */
2654  .star-rating {
2655      white-space: nowrap;
2656  }
2657  .star-rating .star {
2658      display: inline-block;
2659      width: 20px;
2660      height: 20px;
2661      -webkit-font-smoothing: antialiased;
2662      font-size: 20px;
2663      line-height: 1;
2664      font-family: dashicons;
2665      text-decoration: inherit;
2666      font-weight: 400;
2667      font-style: normal;
2668      vertical-align: top;
2669      transition: color .1s ease-in;
2670      text-align: center;
2671      color: #dba617;
2672  }
2673  
2674  .star-rating .star-full:before {
2675      content: "\f155" / '';
2676  }
2677  
2678  .star-rating .star-half:before {
2679      content: "\f459" / '';
2680  }
2681  
2682  .rtl .star-rating .star-half {
2683      transform: rotateY(-180deg);
2684  }
2685  
2686  .star-rating .star-empty:before {
2687      content: "\f154" / '';
2688  }
2689  
2690  div.action-links {
2691      font-weight: 400;
2692      margin: 6px 0 0;
2693  }
2694  
2695  /* Plugin install thickbox */
2696  #plugin-information {
2697      background: #fff;
2698      position: fixed;
2699      top: 0;
2700      left: 0;
2701      bottom: 0;
2702      right: 0;
2703      height: 100%;
2704      padding: 0;
2705  }
2706  
2707  #plugin-information-scrollable {
2708      overflow: auto;
2709      -webkit-overflow-scrolling: touch;
2710      height: 100%;
2711  }
2712  
2713  #plugin-information-title {
2714      padding: 0 26px;
2715      background: #f6f7f7;
2716      font-size: 22px;
2717      font-weight: 600;
2718      line-height: 2.4;
2719      position: relative;
2720      height: 56px;
2721  }
2722  
2723  #plugin-information-title.with-banner {
2724      margin-left: 0;
2725      height: 250px;
2726      background-size: cover;
2727  }
2728  
2729  #plugin-information-title h2 {
2730      font-size: 1em;
2731      font-weight: 600;
2732      padding: 0;
2733      margin: 0;
2734      overflow: hidden;
2735      text-overflow: ellipsis;
2736      white-space: nowrap;
2737  }
2738  
2739  #plugin-information-title.with-banner h2 {
2740      position: relative;
2741      font-family: "Helvetica Neue", sans-serif;
2742      display: inline-block;
2743      font-size: 30px;
2744      line-height: 1.68;
2745      box-sizing: border-box;
2746      max-width: 100%;
2747      padding: 0 15px;
2748      margin-top: 174px;
2749      color: #fff;
2750      background: rgba(29, 35, 39, 0.9);
2751      text-shadow: 0 1px 3px rgba(0, 0, 0, 0.4);
2752      box-shadow: 0 0 30px rgba(255, 255, 255, 0.1);
2753      border-radius: 8px;
2754  }
2755  
2756  #plugin-information-title div.vignette {
2757      display: none;
2758  }
2759  
2760  #plugin-information-title.with-banner div.vignette {
2761      position: absolute;
2762      display: block;
2763      top: 0;
2764      right: 0;
2765      height: 250px;
2766      width: 100%;
2767      background: transparent;
2768      box-shadow: inset 0 0 50px 4px rgba(0, 0, 0, 0.2), inset 0 -1px 0 rgba(0, 0, 0, 0.1);
2769  }
2770  
2771  #plugin-information-tabs {
2772      padding: 0 16px;
2773      position: relative;
2774      left: 0;
2775      right: 0;
2776      min-height: 36px;
2777      font-size: 0;
2778      z-index: 1;
2779      border-bottom: 1px solid #dcdcde;
2780      background: #f6f7f7;
2781  }
2782  
2783  #plugin-information-tabs a {
2784      position: relative;
2785      display: inline-block;
2786      padding: 9px 10px;
2787      margin: 0;
2788      height: 18px;
2789      line-height: 1.3;
2790      font-size: 14px;
2791      text-decoration: none;
2792      transition: none;
2793  }
2794  
2795  #plugin-information-tabs a.current {
2796      margin: 0 -1px -1px;
2797      background: #fff;
2798      border: 1px solid #dcdcde;
2799      border-bottom-color: #fff;
2800      padding-top: 8px;
2801      color: #2c3338;
2802  }
2803  
2804  #plugin-information-tabs.with-banner a.current {
2805      border-top: none;
2806      padding-top: 9px;
2807  }
2808  
2809  #plugin-information-tabs a:active,
2810  #plugin-information-tabs a:focus {
2811      outline: none;
2812  }
2813  
2814  #plugin-information-content {
2815      overflow: hidden; /* equal height column trick */
2816      background: #fff;
2817      position: relative;
2818      top: 0;
2819      left: 0;
2820      right: 0;
2821      min-height: 100%;
2822      /* Height of title + tabs + install now */
2823      min-height: calc( 100% - 152px );
2824  }
2825  
2826  #plugin-information-content.with-banner {
2827      /* Height of banner + tabs + install now */
2828      min-height: calc( 100% - 346px );
2829  }
2830  
2831  #section-holder {
2832      position: relative;
2833      top: 0;
2834      left: 250px;
2835      bottom: 0;
2836      right: 0;
2837      margin-top: 10px;
2838      margin-left: 250px; /* FYI box */
2839      padding: 10px 26px 99999px; /* equal height column trick */
2840      margin-bottom: -99932px; /* 67px less than the padding below to accommodate footer height */
2841  }
2842  
2843  #section-holder .notice {
2844      margin: 5px 0 15px;
2845  }
2846  
2847  #section-holder .updated {
2848      margin: 16px 0;
2849  }
2850  
2851  #plugin-information .fyi {
2852      float: left;
2853      position: relative;
2854      top: 0;
2855      left: 0;
2856      padding: 16px 16px 99999px; /* equal height column trick */
2857      margin-bottom: -99932px; /* 67px less than the padding below to accommodate footer height */
2858      width: 217px;
2859      border-right: 1px solid #dcdcde;
2860      background: #f6f7f7;
2861      color: #646970;
2862  }
2863  
2864  #plugin-information .fyi strong {
2865      color: #3c434a;
2866  }
2867  
2868  #plugin-information .fyi h3 {
2869      font-weight: 600;
2870      text-transform: uppercase;
2871      font-size: 12px;
2872      color: #646970;
2873      margin: 24px 0 8px;
2874  }
2875  
2876  #plugin-information .fyi h2 {
2877      font-size: 0.9em;
2878      margin-bottom: 0;
2879      margin-left: 0;
2880  }
2881  
2882  #plugin-information .fyi ul {
2883      padding: 0;
2884      margin: 0;
2885      list-style: none;
2886  }
2887  
2888  #plugin-information .fyi li {
2889      margin: 0 0 10px;
2890  }
2891  
2892  #plugin-information .fyi-description {
2893      margin-top: 0;
2894  }
2895  
2896  #plugin-information .counter-container {
2897      margin: 3px 0;
2898  }
2899  
2900  #plugin-information .counter-label {
2901      float: right;
2902      margin-left: 5px;
2903      min-width: 55px;
2904  }
2905  
2906  #plugin-information .counter-back {
2907      height: 17px;
2908      width: 92px;
2909      background-color: #dcdcde;
2910      float: right;
2911  }
2912  
2913  #plugin-information .counter-bar {
2914      height: 17px;
2915      background-color: #f0c33c; /* slightly lighter than stars due to larger expanse */
2916      float: right;
2917  }
2918  
2919  #plugin-information .counter-count {
2920      margin-right: 5px;
2921  }
2922  
2923  #plugin-information .fyi ul.contributors {
2924      margin-top: 10px;
2925  }
2926  
2927  #plugin-information .fyi ul.contributors li {
2928      display: inline-block;
2929      margin-left: 8px;
2930      vertical-align: middle;
2931  }
2932  
2933  #plugin-information .fyi ul.contributors li {
2934      display: inline-block;
2935      margin-left: 8px;
2936      vertical-align: middle;
2937  }
2938  
2939  #plugin-information .fyi ul.contributors li img {
2940      vertical-align: middle;
2941      margin-left: 4px;
2942  }
2943  
2944  #plugin-information-footer {
2945      padding: 13px 16px;
2946      position: absolute;
2947      left: 0;
2948      bottom: 0;
2949      right: 0;
2950      height: 40px; /* actual height: 40+13+13+1=67 */
2951      border-top: 1px solid #dcdcde;
2952      background: #f6f7f7;
2953  }
2954  
2955  /* rtl:ignore */
2956  #plugin-information .section {
2957      direction: ltr;
2958  }
2959  
2960  /* rtl:ignore */
2961  #plugin-information .section ul,
2962  #plugin-information .section ol {
2963      list-style-type: disc;
2964      margin-left: 24px;
2965  }
2966  
2967  #plugin-information .section,
2968  #plugin-information .section p {
2969      font-size: 14px;
2970      line-height: 1.7;
2971  }
2972  
2973  #plugin-information #section-screenshots ol {
2974      list-style: none;
2975      margin: 0;
2976  }
2977  
2978  #plugin-information #section-screenshots li img {
2979      vertical-align: text-top;
2980      margin-top: 16px;
2981      max-width: 100%;
2982      width: auto;
2983      height: auto;
2984      box-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
2985  }
2986  
2987  /* rtl:ignore */
2988  #plugin-information #section-screenshots li p {
2989      font-style: italic;
2990      padding-left: 20px;
2991  }
2992  
2993  #plugin-information pre {
2994      padding: 7px;
2995      overflow: auto;
2996      border: 1px solid #c3c4c7;
2997  }
2998  
2999  #plugin-information blockquote {
3000      border-right: 2px solid #dcdcde;
3001      color: #646970;
3002      font-style: italic;
3003      margin: 1em 0;
3004      padding: 0 1em 0 0;
3005  }
3006  
3007  /* rtl:ignore */
3008  #plugin-information .review {
3009      overflow: hidden; /* clearfix */
3010      width: 100%;
3011      margin-bottom: 20px;
3012      border-bottom: 1px solid #dcdcde;
3013  }
3014  
3015  #plugin-information .review-title-section {
3016      overflow: hidden; /* clearfix */
3017  }
3018  
3019  /* rtl:ignore */
3020  #plugin-information .review-title-section h4 {
3021      display: inline-block;
3022      float: left;
3023      margin: 0 6px 0 0;
3024  }
3025  
3026  #plugin-information .reviewer-info p {
3027      clear: both;
3028      margin: 0;
3029      padding-top: 2px;
3030  }
3031  
3032  /* rtl:ignore */
3033  #plugin-information .reviewer-info .avatar {
3034      float: left;
3035      margin: 4px 6px 0 0;
3036  }
3037  
3038  /* rtl:ignore */
3039  #plugin-information .reviewer-info .star-rating {
3040      float: left;
3041  }
3042  
3043  /* rtl:ignore */
3044  #plugin-information .review-meta {
3045      float: left;
3046      margin-left: 0.75em;
3047  }
3048  
3049  /* rtl:ignore */
3050  #plugin-information .review-body {
3051      float: left;
3052      width: 100%;
3053  }
3054  
3055  .plugin-version-author-uri {
3056      font-size: 13px;
3057  }
3058  
3059  /* For non-js plugin installation screen ticket #36430. */
3060  .update-php .button.button-primary {
3061      margin-left: 1em;
3062  }
3063  
3064  @media screen and (max-width: 771px) {
3065      #plugin-information-title.with-banner {
3066          height: 100px;
3067      }
3068  
3069      #plugin-information-title.with-banner h2 {
3070          margin-top: 30px;
3071          font-size: 20px;
3072          line-height: 2;
3073          max-width: 85%;
3074      }
3075  
3076      #plugin-information-title.with-banner div.vignette {
3077          height: 100px;
3078      }
3079  
3080      #plugin-information-tabs {
3081          overflow: hidden; /* clearfix */
3082          padding: 0;
3083          height: auto; /* let tabs wrap */
3084      }
3085  
3086      #plugin-information-tabs a.current {
3087          margin-bottom: 0;
3088          border-bottom: none;
3089      }
3090  
3091      #plugin-information .fyi {
3092          float: none;
3093          border: 1px solid #dcdcde;
3094          position: static;
3095          width: auto;
3096          margin: 26px 26px 0;
3097          padding-bottom: 0; /* reset from the two column height fix */
3098      }
3099  
3100      #section-holder {
3101          position: static;
3102          margin: 0;
3103          padding-bottom: 70px; /* reset from the two column height fix, plus accommodate footer */
3104      }
3105  
3106      #plugin-information .fyi h3,
3107      #plugin-information .fyi small {
3108          display: none;
3109      }
3110  
3111      #plugin-information-footer {
3112          padding: 12px 16px 0;
3113          height: 46px;
3114      }
3115  }
3116  
3117  /* Thickbox for the Plugin details modal. */
3118  #TB_window.plugin-details-modal {
3119      background: #fff;
3120  }
3121  
3122  #TB_window.plugin-details-modal.thickbox-loading:before {
3123      content: "";
3124      display: block;
3125      width: 20px;
3126      height: 20px;
3127      position: absolute;
3128      right: 50%;
3129      top: 50%;
3130      z-index: -1;
3131      margin: -10px -10px 0 0;
3132      background: #fff url(../images/spinner.gif) no-repeat center;
3133      background-size: 20px 20px;
3134      transform: translateZ(0);
3135  }
3136  
3137  @media print,
3138      (min-resolution: 120dpi) {
3139  
3140      #TB_window.plugin-details-modal.thickbox-loading:before {
3141          background-image: url(../images/spinner-2x.gif);
3142      }
3143  }
3144  
3145  .plugin-details-modal #TB_title {
3146      float: right;
3147      height: 1px;
3148  }
3149  
3150  .plugin-details-modal #TB_ajaxWindowTitle {
3151      display: none;
3152  }
3153  
3154  .plugin-details-modal #TB_closeWindowButton {
3155      right: auto;
3156      left: -30px;
3157      color: #f0f0f1;
3158  }
3159  
3160  .plugin-details-modal #TB_closeWindowButton:hover,
3161  .plugin-details-modal #TB_closeWindowButton:focus {
3162      outline: none;
3163      box-shadow: none;
3164  }
3165  
3166  .plugin-details-modal #TB_closeWindowButton:hover::after,
3167  .plugin-details-modal #TB_closeWindowButton:focus::after {
3168      outline: 2px solid;
3169      outline-offset: -4px;
3170      border-radius: 4px;
3171  }
3172  
3173  .plugin-details-modal .tb-close-icon {
3174      display: none;
3175  }
3176  
3177  .plugin-details-modal #TB_closeWindowButton:after {
3178      content: "\f335" / '';
3179      font: normal 32px/29px 'dashicons';
3180      -webkit-font-smoothing: antialiased;
3181      -moz-osx-font-smoothing: grayscale;
3182  }
3183  
3184  /* move plugin install close icon to top on narrow screens */
3185  @media screen and (max-width: 830px) {
3186      .plugin-details-modal #TB_closeWindowButton {
3187          left: 0;
3188          top: -30px;
3189      }
3190  }
3191  
3192  /* @todo: move this. */
3193  img {
3194      border: none;
3195  }
3196  
3197  /* Metabox collapse arrow indicators */
3198  .sidebar-name .toggle-indicator::before,
3199  .meta-box-sortables .postbox .toggle-indicator::before,
3200  .meta-box-sortables .postbox .order-higher-indicator::before,
3201  .meta-box-sortables .postbox .order-lower-indicator::before,
3202  .bulk-action-notice .toggle-indicator::before,
3203  .privacy-text-box .toggle-indicator::before {
3204      content: "\f142" / '';
3205      display: inline-block;
3206      font: normal 20px/1 dashicons;
3207      -webkit-font-smoothing: antialiased;
3208      -moz-osx-font-smoothing: grayscale;
3209      text-decoration: none;
3210  }
3211  
3212  .js .widgets-holder-wrap.closed .toggle-indicator::before,
3213  .meta-box-sortables .postbox.closed .handlediv .toggle-indicator::before,
3214  .bulk-action-notice .bulk-action-errors-collapsed .toggle-indicator::before,
3215  .privacy-text-box.closed .toggle-indicator::before {
3216      content: "\f140" / '';
3217  }
3218  
3219  .postbox .handle-order-higher .order-higher-indicator::before {
3220      content: "\f343" / '';
3221      color: inherit;
3222  }
3223  
3224  .postbox .handle-order-lower .order-lower-indicator::before {
3225      content: "\f347" / '';
3226      color: inherit;
3227  }
3228  
3229  .postbox .handle-order-higher .order-higher-indicator::before,
3230  .postbox .handle-order-lower .order-lower-indicator::before {
3231      position: relative;
3232      top: 0.11rem;
3233      width: 20px;
3234      height: 20px;
3235  }
3236  
3237  .postbox .handlediv .toggle-indicator::before {
3238      width: 20px;
3239      border-radius: 50%;
3240  }
3241  
3242  .postbox .handlediv .toggle-indicator::before {
3243      position: relative;
3244      top: 0.05rem;
3245      text-indent: -1px; /* account for the dashicon glyph uneven horizontal alignment */
3246  }
3247  
3248  .rtl .postbox .handlediv .toggle-indicator::before {
3249      text-indent: 1px; /* account for the dashicon glyph uneven horizontal alignment */
3250  }
3251  
3252  .bulk-action-notice .toggle-indicator::before {
3253      line-height: 16px;
3254      vertical-align: top;
3255      color: #787c82;
3256  }
3257  
3258  .postbox .handle-order-higher:focus,
3259  .postbox .handle-order-lower:focus,
3260  .postbox .handlediv:focus {
3261      box-shadow: inset 0 0 0 2px #2271b1;
3262      border-radius: 50%;
3263      /* Only visible in Windows High Contrast mode */
3264      outline: 2px solid transparent;
3265  }
3266  
3267  .postbox .handle-order-higher:focus .order-higher-indicator::before,
3268  .postbox .handle-order-lower:focus .order-lower-indicator::before,
3269  .postbox .handlediv:focus .toggle-indicator::before {
3270      box-shadow: none;
3271      /* Only visible in Windows High Contrast mode */
3272      outline: 1px solid transparent;
3273  }
3274  
3275  /* @todo: appears to be Press This only and overridden */
3276  #photo-add-url-div input[type="text"] {
3277      width: 300px;
3278  }
3279  
3280  /* Theme/Plugin file editor */
3281  .alignleft h2 {
3282      margin: 0;
3283  }
3284  
3285  #template textarea {
3286      font-family: Consolas, Monaco, monospace;
3287      font-size: 13px;
3288      background: #f6f7f7;
3289      tab-size: 4;
3290  }
3291  
3292  #template textarea,
3293  #template .CodeMirror {
3294      width: 100%;
3295      min-height: 60vh;
3296      height: calc( 100vh - 295px );
3297      border: 1px solid #dcdcde;
3298      box-sizing: border-box;
3299  }
3300  
3301  #templateside > h2 {
3302      padding-top: 6px;
3303      padding-bottom: 7px;
3304      margin: 0;
3305  }
3306  
3307  #templateside ol,
3308  #templateside ul {
3309      margin: 0;
3310      padding: 0;
3311  }
3312  #templateside > ul {
3313      box-sizing: border-box;
3314      margin-top: 0;
3315      overflow: auto;
3316      padding: 0;
3317      min-height: 60vh;
3318      height: calc(100vh - 295px);
3319      background-color: #f6f7f7;
3320      border: 1px solid #dcdcde;
3321      border-right: none;
3322  }
3323  #templateside ul ul {
3324      padding-right: 12px;
3325  }
3326  #templateside > ul > li > ul[role=group] {
3327      padding-right: 0;
3328  }
3329  
3330  /*
3331   * Styles for Theme and Plugin file editors.
3332   */
3333  
3334  /* Hide collapsed items. */
3335  [role="treeitem"][aria-expanded="false"] > ul {
3336      display: none;
3337  }
3338  
3339  /* Use arrow dashicons for folder states, but hide from screen readers. */
3340  [role="treeitem"] span[aria-hidden] {
3341      display: inline;
3342      font-family: dashicons;
3343      font-size: 20px;
3344      position: absolute;
3345      pointer-events: none;
3346  }
3347  [role="treeitem"][aria-expanded="false"] > .folder-label .icon:after {
3348      content: "\f139" / '';
3349  }
3350  [role="treeitem"][aria-expanded="true"] > .folder-label .icon:after {
3351      content: "\f140" / '';
3352  }
3353  [role="treeitem"] .folder-label {
3354      display: block;
3355      padding: 3px 12px 3px 3px;
3356      cursor: pointer;
3357  }
3358  
3359  /* Remove outline, and create our own focus and hover styles */
3360  [role="treeitem"] {
3361      outline: 0;
3362  }
3363  
3364  [role="treeitem"] a:focus,
3365  [role="treeitem"] .folder-label.focus {
3366      color: #043959;
3367      /* Reset default focus style. */
3368      box-shadow: none;
3369      /* Use an inset outline instead, so it's visible also over the current file item. */
3370      outline: 2px solid #2271b1;
3371      outline-offset: -2px;
3372  }
3373  
3374  [role="treeitem"].hover,
3375  [role="treeitem"] .folder-label.hover {
3376      background-color: #f0f0f1;
3377  }
3378  
3379  .tree-folder {
3380      margin: 0;
3381      position: relative;
3382  }
3383  [role="treeitem"] li {
3384      position: relative;
3385  }
3386  
3387  /* Styles for folder indicators/depth */
3388  .tree-folder .tree-folder::after {
3389      content: "";
3390      display: block;
3391      position: absolute;
3392      right: 2px;
3393      border-right: 1px solid #c3c4c7;
3394      top: -13px;
3395      bottom: 10px;
3396  }
3397  .tree-folder > li::before {
3398      content: "";
3399      position: absolute;
3400      display: block;
3401      border-right: 1px solid #c3c4c7;
3402      right: 2px;
3403      top: -5px;
3404      height: 18px;
3405      width: 7px;
3406      border-bottom: 1px solid #c3c4c7;
3407  }
3408  .tree-folder > li::after {
3409      content: "";
3410      position: absolute;
3411      display: block;
3412      border-right: 1px solid #c3c4c7;
3413      right: 2px;
3414      bottom: -7px;
3415      top: 0;
3416  }
3417  
3418  /* current-file needs to adjustment for .notice styles */
3419  #templateside .current-file {
3420      margin: -4px 0 -2px;
3421  }
3422  .tree-folder > .current-file::before {
3423      right: 4px;
3424      height: 15px;
3425      width: 0;
3426      border-right: none;
3427      top: 3px;
3428  }
3429  .tree-folder > .current-file::after {
3430      bottom: -4px;
3431      height: 7px;
3432      right: 2px;
3433      top: auto;
3434  }
3435  
3436  /* Lines shouldn't continue on last item */
3437  .tree-folder > li:last-child::after,
3438  .tree-folder li:last-child > .tree-folder::after {
3439      display: none;
3440  }
3441  
3442  #theme-plugin-editor-selector,
3443  #theme-plugin-editor-label,
3444  #documentation label {
3445      font-weight: 600;
3446  }
3447  
3448  #theme-plugin-editor-label {
3449      display: inline-block;
3450      margin-bottom: 1em;
3451  }
3452  
3453  /* rtl:ignore */
3454  #template textarea,
3455  #docs-list {
3456      direction: ltr;
3457  }
3458  
3459  .fileedit-sub #theme,
3460  .fileedit-sub #plugin {
3461      max-width: 40%;
3462  }
3463  .fileedit-sub .alignright {
3464      text-align: left;
3465  }
3466  
3467  #template p {
3468      width: 97%;
3469  }
3470  
3471  #file-editor-linting-error {
3472      margin-top: 1em;
3473      margin-bottom: 1em;
3474  }
3475  #file-editor-linting-error > .notice {
3476      margin: 0;
3477      display: inline-block;
3478  }
3479  #file-editor-linting-error > .notice > p {
3480      width: auto;
3481  }
3482  #template .submit {
3483      margin-top: 1em;
3484      padding: 0;
3485  }
3486  
3487  #template .submit input[type=submit][disabled] {
3488      cursor: not-allowed;
3489  }
3490  #templateside {
3491      float: left;
3492      width: 16em;
3493      word-wrap: break-word;
3494  }
3495  
3496  #postcustomstuff p.submit {
3497      margin: 0;
3498  }
3499  
3500  #templateside h4 {
3501      margin: 1em 0 0;
3502  }
3503  
3504  #templateside li {
3505      margin: 4px 0;
3506  }
3507  
3508  #templateside li:not(.howto) a,
3509  .theme-editor-php .highlight {
3510      display: block;
3511      padding: 3px 12px 3px 0;
3512      text-decoration: none;
3513  }
3514  
3515  #templateside li.current-file > a {
3516      padding-bottom: 0;
3517  }
3518  
3519  #templateside li:not(.howto) > a:first-of-type {
3520      padding-top: 0;
3521  }
3522  
3523  #templateside li.howto {
3524      padding: 6px 12px 12px;
3525  }
3526  
3527  .theme-editor-php .highlight {
3528      margin: -3px -12px -3px 3px;
3529  }
3530  
3531  #templateside .highlight {
3532      border: none;
3533      font-weight: 600;
3534  }
3535  
3536  .nonessential {
3537      color: #646970;
3538      font-size: 11px;
3539      font-style: italic;
3540      padding-right: 12px;
3541  }
3542  
3543  #documentation {
3544      margin-top: 10px;
3545  }
3546  
3547  #documentation label {
3548      line-height: 1.8;
3549      vertical-align: baseline;
3550  }
3551  
3552  .fileedit-sub {
3553      padding: 10px 0 8px;
3554      line-height: 180%;
3555  }
3556  
3557  #file-editor-warning .file-editor-warning-content {
3558      margin: 25px;
3559  }
3560  
3561  /* @todo: can we use a common class for these? */
3562  .nav-menus-php .item-edit:before,
3563  .wp-customizer .control-section .accordion-section-title:after,
3564  .wp-customizer .accordion-section-title:after,
3565  .widget-top .widget-action .toggle-indicator:before {
3566      content: "\f140" / '';
3567      font: normal 20px/1 dashicons;
3568      display: block;
3569      -webkit-font-smoothing: antialiased;
3570      -moz-osx-font-smoothing: grayscale;
3571      text-decoration: none;
3572  }
3573  
3574  .widget-top .widget-action .toggle-indicator:before {
3575      padding: 1px 0 1px 2px;
3576      border-radius: 50%;
3577  }
3578  
3579  .handlediv,
3580  .postbox .handlediv.button-link,
3581  .item-edit,
3582  .toggle-indicator {
3583      color: #787c82;
3584  }
3585  
3586  .widget-action {
3587      color: #50575e; /* #fafafa background in the Widgets screen */
3588  }
3589  
3590  .widget-top:hover .widget-action,
3591  .widget-action:focus,
3592  .handlediv:hover,
3593  .handlediv:focus,
3594  .postbox .handlediv.button-link:hover,
3595  .postbox .handlediv.button-link:focus,
3596  .item-edit:hover,
3597  .item-edit:focus,
3598  .sidebar-name:hover .toggle-indicator {
3599      color: #1d2327;
3600      /* Only visible in Windows High Contrast mode */
3601      outline: 2px solid transparent;
3602  }
3603  
3604  .widget-top .widget-action:focus .toggle-indicator:before {
3605      box-shadow: 0 0 0 2px #2271b1;
3606      /* Only visible in Windows High Contrast mode */
3607      outline: 2px solid transparent;
3608  }
3609  
3610  #customize-info.open .accordion-section-title:after,
3611  .nav-menus-php .menu-item-edit-active .item-edit:before,
3612  .widget.open .widget-top .widget-action .toggle-indicator:before,
3613  .widget.widget-in-question .widget-top .widget-action .toggle-indicator:before {
3614      content: "\f142" / '';
3615  }
3616  
3617  /*!
3618   * jQuery UI Draggable/Sortable 1.11.4
3619   * http://jqueryui.com
3620   *
3621   * Copyright jQuery Foundation and other contributors
3622   * Released under the MIT license.
3623   * http://jquery.org/license
3624   */
3625  .ui-draggable-handle,
3626  .ui-sortable-handle {
3627      touch-action: none;
3628  }
3629  
3630  /* Accordion */
3631  .accordion-section {
3632      border-bottom: 1px solid #dcdcde;
3633      margin: 0;
3634  }
3635  
3636  .accordion-section.open .accordion-section-content,
3637  .no-js .accordion-section .accordion-section-content {
3638      display: block;
3639  }
3640  
3641  .accordion-section.open:hover {
3642      border-bottom-color: #dcdcde;
3643  }
3644  
3645  .accordion-section-content {
3646      display: none;
3647      padding: 10px 20px 15px;
3648      overflow: hidden;
3649      background: #fff;
3650  }
3651  
3652  .accordion-section-title {
3653      margin: 0;
3654      position: relative;
3655      border-right: 1px solid #dcdcde;
3656      border-left: 1px solid #dcdcde;
3657      -webkit-user-select: none;
3658      user-select: none;
3659  }
3660  
3661  .js .accordion-section-title {
3662      cursor: pointer;
3663  }
3664  
3665  .js .accordion-section-title:after {
3666      position: absolute;
3667      top: 12px;
3668      left: 10px;
3669      z-index: 1;
3670  }
3671  
3672  .accordion-section-title:focus {
3673      /* Only visible in Windows High Contrast mode */
3674      outline: 1px solid transparent;
3675  }
3676  
3677  .accordion-section-title:hover:after,
3678  .accordion-section-title:focus:after {
3679      border-color: #a7aaad transparent;
3680      /* Only visible in Windows High Contrast mode */
3681      outline: 1px solid transparent;
3682  }
3683  
3684  .cannot-expand .accordion-section-title {
3685      cursor: auto;
3686  }
3687  
3688  .cannot-expand .accordion-section-title:after {
3689      display: none;
3690  }
3691  
3692  .control-section .accordion-section-title,
3693  .customize-pane-child .accordion-section-title {
3694      border-right: none;
3695      border-left: none;
3696      padding: 10px 14px 11px 10px;
3697      line-height: 1.55;
3698      background: #fff;
3699  }
3700  
3701  .control-section .accordion-section-title:after,
3702  .customize-pane-child .accordion-section-title:after {
3703      top: calc(50% - 10px); /* Arrow height is 20px, so use half of that to vertically center */
3704  }
3705  
3706  .js .control-section:hover .accordion-section-title,
3707  .js .control-section .accordion-section-title:hover,
3708  .js .control-section.open .accordion-section-title,
3709  .js .control-section .accordion-section-title:focus {
3710      color: #1d2327;
3711      background: #f6f7f7;
3712  }
3713  
3714  .control-section.open .accordion-section-title {
3715      /* When expanded */
3716      border-bottom: 1px solid #dcdcde;
3717  }
3718  
3719  /* Edit Site */
3720  .network-admin .edit-site-actions {
3721      margin-top: 0;
3722  }
3723  
3724  /* My Sites */
3725  .my-sites {
3726      display: block;
3727      overflow: auto;
3728      zoom: 1;
3729  }
3730  
3731  .my-sites li {
3732      display: block;
3733      padding: 8px 3%;
3734      min-height: 130px;
3735      margin: 0;
3736  }
3737  
3738  @media only screen and (max-width: 599px) {
3739      .my-sites li {
3740          min-height: 0;
3741      }
3742  }
3743  
3744  @media only screen and (min-width: 600px) {
3745      .my-sites.striped li {
3746          background-color: #fff;
3747          position: relative;
3748      }
3749      .my-sites.striped li:after {
3750          content: "";
3751          width: 1px;
3752          height: 100%;
3753          position: absolute;
3754          top: 0;
3755          left: 0;
3756          background: #c3c4c7;
3757      }
3758  
3759  }
3760  @media only screen and (min-width: 600px) and (max-width: 699px) {
3761      .my-sites li{
3762          float: right;
3763          width: 44%;
3764      }
3765      .my-sites.striped li {
3766          background-color: #fff;
3767      }
3768      .my-sites.striped li:nth-of-type(2n+1) {
3769          clear: right;
3770      }
3771      .my-sites.striped li:nth-of-type(2n+2):after {
3772          content: none;
3773      }
3774      .my-sites li:nth-of-type(4n+1),
3775      .my-sites li:nth-of-type(4n+2) {
3776          background-color: #f6f7f7;
3777      }
3778  
3779  }
3780  
3781  @media only screen and (min-width: 700px) and (max-width: 1199px) {
3782      .my-sites li {
3783          float: right;
3784          width: 27.333333%;
3785          background-color: #fff;
3786      }
3787      .my-sites.striped li:nth-of-type(3n+3):after {
3788          content: none;
3789      }
3790      .my-sites li:nth-of-type(6n+1),
3791      .my-sites li:nth-of-type(6n+2),
3792      .my-sites li:nth-of-type(6n+3) {
3793          background-color: #f6f7f7;
3794      }
3795  }
3796  
3797  @media only screen and (min-width: 1200px) and (max-width: 1399px) {
3798      .my-sites li {
3799          float: right;
3800          width: 21%;
3801          padding: 8px 2%;
3802          background-color: #fff;
3803      }
3804      .my-sites.striped li:nth-of-type(4n+1) {
3805          clear: right;
3806      }
3807      .my-sites.striped li:nth-of-type(4n+4):after {
3808          content: none;
3809      }
3810      .my-sites li:nth-of-type(8n+1),
3811      .my-sites li:nth-of-type(8n+2),
3812      .my-sites li:nth-of-type(8n+3),
3813      .my-sites li:nth-of-type(8n+4) {
3814          background-color: #f6f7f7;
3815      }
3816  }
3817  
3818  @media only screen and (min-width: 1400px) and (max-width: 1599px) {
3819      .my-sites li {
3820          float: right;
3821          width: 16%;
3822          padding: 8px 2%;
3823          background-color: #fff;
3824      }
3825      .my-sites.striped li:nth-of-type(5n+1) {
3826          clear: right;
3827      }
3828      .my-sites.striped li:nth-of-type(5n+5):after {
3829          content: none;
3830      }
3831      .my-sites li:nth-of-type(10n+1),
3832      .my-sites li:nth-of-type(10n+2),
3833      .my-sites li:nth-of-type(10n+3),
3834      .my-sites li:nth-of-type(10n+4),
3835      .my-sites li:nth-of-type(10n+5) {
3836          background-color: #f6f7f7;
3837      }
3838  }
3839  
3840  @media only screen and (min-width: 1600px) {
3841      .my-sites li {
3842          float: right;
3843          width: 12.666666%;
3844          padding: 8px 2%;
3845          background-color: #fff;
3846      }
3847      .my-sites.striped li:nth-of-type(6n+1) {
3848          clear: right;
3849      }
3850      .my-sites.striped li:nth-of-type(6n+6):after {
3851          content: none;
3852      }
3853      .my-sites li:nth-of-type(12n+1),
3854      .my-sites li:nth-of-type(12n+2),
3855      .my-sites li:nth-of-type(12n+3),
3856      .my-sites li:nth-of-type(12n+4),
3857      .my-sites li:nth-of-type(12n+5),
3858      .my-sites li:nth-of-type(12n+6) {
3859          background-color: #f6f7f7;
3860      }
3861  }
3862  
3863  .my-sites li a {
3864      text-decoration: none;
3865  }
3866  
3867  /* =Media Queries
3868  -------------------------------------------------------------- */
3869  
3870  /**
3871   * HiDPI Displays
3872   */
3873  @media print,
3874    (min-resolution: 120dpi) {
3875      /* Back-compat for pre-3.8 */
3876      div.star-holder,
3877      div.star-holder .star-rating {
3878          background: url(../images/stars-2x.png?ver=20121108) repeat-x bottom right;
3879          background-size: 21px 37px;
3880      }
3881  
3882      .spinner {
3883          background-image: url(../images/spinner-2x.gif);
3884      }
3885  
3886  }
3887  
3888  @media screen and (max-width: 782px) {
3889      html.wp-toolbar {
3890          padding-top: var(--wp-admin--admin-bar--height);
3891      }
3892  
3893      .screen-reader-shortcut:focus {
3894          top: -39px;
3895      }
3896  
3897      .block-editor-page .screen-reader-shortcut:focus {
3898          top: 7px;
3899      }
3900  
3901      .screen-reader-shortcut[href="#wp-toolbar"] {
3902          display: none;
3903      }
3904  
3905      body {
3906          min-width: 240px;
3907          overflow-x: hidden;
3908      }
3909  
3910      body * {
3911          -webkit-tap-highlight-color: rgba(0, 0, 0, 0) !important;
3912      }
3913  
3914      #wpcontent {
3915          position: relative;
3916          margin-right: 0;
3917          padding-right: 10px;
3918      }
3919  
3920      #wpbody-content {
3921          padding-bottom: 100px;
3922      }
3923  
3924      .wrap {
3925          clear: both;
3926          margin-left: 12px;
3927          margin-right: 0;
3928      }
3929  
3930      /* categories */
3931      #col-left,
3932      #col-right {
3933          float: none;
3934          width: auto;
3935      }
3936  
3937      #col-left .col-wrap,
3938      #col-right .col-wrap {
3939          padding: 0;
3940      }
3941  
3942      /* Hidden Elements */
3943      #collapse-menu,
3944      .post-format-select {
3945          display: none !important;
3946      }
3947  
3948      .wrap h1.wp-heading-inline {
3949          margin-bottom: 0.5em;
3950      }
3951  
3952      .wrap .add-new-h2, /* deprecated */
3953      .wrap .add-new-h2:active, /* deprecated */
3954      .wrap .page-title-action,
3955      .wrap .page-title-action:active {
3956          padding: 0 14px;
3957          font-size: 14px;
3958          white-space: nowrap;
3959          min-height: 40px;
3960          line-height: 2.71428571;
3961          vertical-align: middle;
3962      }
3963  
3964      /* Feedback Messages */
3965      .notice,
3966      .wrap div.updated,
3967      .wrap div.error,
3968      .media-upload-form div.error {
3969          margin: 20px 0 10px;
3970          padding: 5px 10px;
3971          font-size: 14px;
3972          line-height: 175%;
3973      }
3974  
3975      .wp-core-ui .notice.is-dismissible {
3976          padding-left: 46px;
3977      }
3978  
3979      .notice-dismiss {
3980          padding: 13px;
3981      }
3982  
3983      .wrap .icon32 + h2 {
3984          margin-top: -2px;
3985      }
3986  
3987      .wp-responsive-open #wpbody {
3988          left: -16em;
3989      }
3990  
3991      code {
3992          word-wrap: break-word;
3993          word-wrap: anywhere; /* Firefox. Allow breaking long words anywhere */
3994          word-break: break-word; /* Webkit: Treated similarly to word-wrap: break-word */
3995      }
3996  
3997      /* General Metabox */
3998      .postbox {
3999          font-size: 14px;
4000      }
4001  
4002      .metabox-holder h3.hndle, /* Back-compat for pre-4.4 */
4003      .metabox-holder .stuffbox > h3, /* Back-compat for pre-4.4 */
4004      .metabox-holder .postbox > h3, /* Back-compat for pre-4.4 */
4005      .metabox-holder h2 {
4006          padding: 12px;
4007      }
4008  
4009      .nav-menus-php .metabox-holder h3 {
4010          padding: 0;
4011      }
4012  
4013      .postbox .handlediv {
4014          margin-top: 3px;
4015      }
4016  
4017      /* Subsubsub Nav */
4018      .subsubsub {
4019          font-size: 16px;
4020          text-align: center;
4021          margin-bottom: 15px;
4022      }
4023  
4024      /* Theme/Plugin File Editor */
4025  
4026      #template textarea,
4027      #template .CodeMirror {
4028          box-sizing: border-box;
4029      }
4030  
4031      #templateside {
4032          float: none;
4033          width: auto;
4034      }
4035  
4036      #templateside > ul {
4037          border-right: 1px solid #dcdcde;
4038      }
4039  
4040      #templateside li {
4041          margin: 0;
4042      }
4043  
4044      #templateside li:not(.howto) a {
4045          display: block;
4046          padding: 5px;
4047      }
4048      #templateside li.howto {
4049          padding: 12px;
4050      }
4051  
4052      #templateside .highlight {
4053          padding: 5px;
4054          margin-right: -5px;
4055          margin-top: -5px;
4056      }
4057  
4058      #template > div,
4059      #template .notice {
4060          float: none;
4061          margin: 1em 0;
4062          width: auto;
4063      }
4064  
4065      #template .CodeMirror,
4066      #template textarea {
4067          width: 100%;
4068      }
4069  
4070      #templateside ul ul {
4071          padding-right: 1.5em;
4072      }
4073      [role="treeitem"] .folder-label {
4074          display: block;
4075          padding: 5px;
4076      }
4077      .tree-folder > li::before,
4078      .tree-folder > li::after,
4079      .tree-folder .tree-folder::after {
4080          right: -8px;
4081      }
4082      .tree-folder > li::before {
4083          top: 0;
4084          height: 13px;
4085      }
4086      .tree-folder > .current-file::before {
4087          right: -5px;
4088          top: 7px;
4089          width: 4px;
4090      }
4091      .tree-folder > .current-file::after {
4092          height: 9px;
4093          right: -8px;
4094      }
4095      .wrap #templateside span.notice {
4096          margin-right: -5px;
4097          width: 100%;
4098      }
4099  
4100      .fileedit-sub .alignright {
4101          float: right;
4102          margin-top: 15px;
4103          width: 100%;
4104          text-align: right;
4105      }
4106  
4107      .fileedit-sub .alignright label {
4108          display: block;
4109      }
4110  
4111      .fileedit-sub #theme,
4112      .fileedit-sub #plugin {
4113          margin-right: 0;
4114          max-width: 70%;
4115      }
4116  
4117      .fileedit-sub input[type="submit"] {
4118          margin-bottom: 0;
4119      }
4120  
4121      #documentation label[for="docs-list"] {
4122          display: block;
4123      }
4124  
4125      #documentation select[name="docs-list"] {
4126          margin-right: 0;
4127          max-width: 60%;
4128      }
4129  
4130      #documentation input[type="button"] {
4131          margin-bottom: 0;
4132      }
4133  
4134      #wpfooter {
4135          display: none;
4136      }
4137  
4138      #comments-form .checkforspam {
4139          display: none;
4140      }
4141  
4142      .edit-comment-author {
4143          margin: 2px 0 0;
4144      }
4145  
4146      .filter-drawer .filter-group-feature input,
4147      .filter-drawer .filter-group-feature label {
4148          line-height: 2.1;
4149      }
4150  
4151      .filter-drawer .filter-group-feature label {
4152          margin-right: 32px;
4153      }
4154  
4155      .wp-filter .button.drawer-toggle {
4156          font-size: 13px;
4157          line-height: 2;
4158          height: 28px;
4159      }
4160  
4161      /* Fix help tab columns for smaller screens */
4162      #screen-meta #contextual-help-wrap {
4163          overflow: visible;
4164      }
4165  
4166      #screen-meta #contextual-help-back,
4167      #screen-meta .contextual-help-sidebar {
4168          display: none;
4169      }
4170  
4171      #screen-meta .contextual-help-tabs {
4172          clear: both;
4173          width: 100%;
4174          float: none;
4175      }
4176  
4177      #screen-meta .contextual-help-tabs ul {
4178          margin: 0 0 1em;
4179          padding: 1em 0 0;
4180      }
4181  
4182      #screen-meta .contextual-help-tabs .active {
4183          margin: 0;
4184      }
4185  
4186      #screen-meta .contextual-help-tabs-wrap {
4187          clear: both;
4188          max-width: 100%;
4189          float: none;
4190      }
4191  
4192      #screen-meta,
4193      #screen-meta-links {
4194          margin-left: 10px;
4195      }
4196  
4197      #screen-meta-links {
4198          margin-bottom: 20px; /* Add margins beneath links for better spacing between boxes and elements */
4199      }
4200  
4201      .wp-filter .search-form input[type="search"] {
4202          font-size: 1rem;
4203      }
4204  
4205      .wp-filter .search-form.search-plugins {
4206          /* This element is a flex item. */
4207          min-width: 100%;
4208      }
4209  }
4210  
4211  /* Smartphone */
4212  @media screen and (max-width: 600px) {
4213      /* Disable horizontal scroll when responsive menu is open
4214         since we push the main content off to the right. */
4215      #wpwrap.wp-responsive-open {
4216          overflow-x: hidden;
4217      }
4218  
4219      html.wp-toolbar {
4220          padding-top: 0;
4221      }
4222  
4223      .screen-reader-shortcut:focus {
4224          top: 7px;
4225      }
4226  
4227      #wpbody {
4228          padding-top: 46px;
4229      }
4230  
4231      /* Keep full-width boxes on Edit Post page from causing horizontal scroll */
4232      div#post-body.metabox-holder.columns-1 {
4233          overflow-x: hidden;
4234      }
4235  
4236      h1.nav-tab-wrapper,
4237      .wrap h2.nav-tab-wrapper,
4238      .nav-tab-wrapper {
4239          border-bottom: 0;
4240      }
4241  
4242      h1 .nav-tab,
4243      h2 .nav-tab,
4244      h3 .nav-tab,
4245      nav .nav-tab {
4246          margin: 10px 0 0 10px;
4247          border-bottom: 1px solid #c3c4c7;
4248      }
4249  
4250      .nav-tab-active:hover,
4251      .nav-tab-active:focus,
4252      .nav-tab-active:focus:active {
4253          border-bottom: 1px solid #c3c4c7;
4254      }
4255  
4256      .wp-filter .search-form.search-plugins label {
4257          width: 100%;
4258      }
4259  }
4260  
4261  @media screen and (max-width: 480px) {
4262      .metabox-prefs-container {
4263          display: grid;
4264      }
4265  
4266      .metabox-prefs-container > * {
4267          display: inline-block;
4268          padding: 2px;
4269      }
4270  }
4271  
4272  @media screen and (max-width: 320px) {
4273      /* Prevent default center alignment and larger font for the Right Now widget when
4274         the network dashboard is viewed on a small mobile device. */
4275      #network_dashboard_right_now .subsubsub {
4276          font-size: 14px;
4277          text-align: right;
4278      }
4279  }