[Summary view] [Print] [Text view]

   1  /* Include margin and padding in the width calculation of input and textarea. */
   2  input,
   3  select,
   4  textarea,
   5  button {
   6      box-sizing: border-box;
   7      font-family: inherit;
   8      font-size: inherit;
   9      font-weight: inherit;
  10  }
  11  
  12  textarea,
  13  input {
  14      font-size: 14px;
  15  }
  16  
  17  textarea {
  18      overflow: auto;
  19      padding: 2px 6px;
  20      /* inherits font size 14px */
  21      line-height: 1.42857143; /* 20px */
  22      resize: vertical;
  23  }
  24  
  25  input,
  26  select {
  27      margin: 0 1px;
  28  }
  29  
  30  textarea.code {
  31      padding: 4px 6px 1px;
  32  }
  33  
  34  input[type="text"],
  35  input[type="password"],
  36  input[type="color"],
  37  input[type="date"],
  38  input[type="datetime"],
  39  input[type="datetime-local"],
  40  input[type="email"],
  41  input[type="month"],
  42  input[type="number"],
  43  input[type="search"],
  44  input[type="tel"],
  45  input[type="time"],
  46  input[type="url"],
  47  input[type="week"],
  48  select,
  49  textarea {
  50      box-shadow: 0 0 0 transparent;
  51      border-radius: 4px;
  52      border: 1px solid #8c8f94;
  53      background-color: #fff;
  54      color: #2c3338;
  55  }
  56  
  57  input[type="text"],
  58  input[type="password"],
  59  input[type="date"],
  60  input[type="datetime"],
  61  input[type="datetime-local"],
  62  input[type="email"],
  63  input[type="month"],
  64  input[type="number"],
  65  input[type="search"],
  66  input[type="tel"],
  67  input[type="time"],
  68  input[type="url"],
  69  input[type="week"] {
  70      padding: 0 8px;
  71      /* inherits font size 14px */
  72      line-height: 2; /* 28px */
  73      /* Only necessary for IE11 */
  74      min-height: 30px;
  75  }
  76  
  77  ::-webkit-datetime-edit {
  78      /* inherits font size 14px */
  79      line-height: 1.85714286; /* 26px */
  80  }
  81  
  82  input[type="text"]:focus,
  83  input[type="password"]:focus,
  84  input[type="color"]:focus,
  85  input[type="date"]:focus,
  86  input[type="datetime"]:focus,
  87  input[type="datetime-local"]:focus,
  88  input[type="email"]:focus,
  89  input[type="month"]:focus,
  90  input[type="number"]:focus,
  91  input[type="search"]:focus,
  92  input[type="tel"]:focus,
  93  input[type="time"]:focus,
  94  input[type="url"]:focus,
  95  input[type="week"]:focus,
  96  input[type="checkbox"]:focus,
  97  input[type="radio"]:focus,
  98  select:focus,
  99  textarea:focus {
 100      border-color: #2271b1;
 101      box-shadow: 0 0 0 1px #2271b1;
 102      /* Only visible in Windows High Contrast mode */
 103      outline: 2px solid transparent;
 104  }
 105  
 106  /* rtl:ignore */
 107  input[type="email"],
 108  input[type="url"] {
 109      direction: ltr;
 110  }
 111  
 112  input[type="checkbox"],
 113  input[type="radio"] {
 114      border: 1px solid #8c8f94;
 115      border-radius: 4px;
 116      background: #fff;
 117      color: #50575e;
 118      clear: none;
 119      cursor: pointer;
 120      display: inline-block;
 121      line-height: 0;
 122      height: 1rem;
 123      margin: -0.25rem 0.25rem 0 0;
 124      outline: 0;
 125      padding: 0 !important;
 126      text-align: center;
 127      vertical-align: middle;
 128      width: 1rem;
 129      min-width: 1rem;
 130      -webkit-appearance: none;
 131      box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.1);
 132      transition: .05s border-color ease-in-out;
 133  }
 134  
 135  input[type="radio"]:checked + label:before {
 136      color: #8c8f94;
 137  }
 138  
 139  .wp-core-ui input[type="reset"]:hover,
 140  .wp-core-ui input[type="reset"]:active {
 141      color: #135e96;
 142  }
 143  
 144  td > input[type="checkbox"],
 145  .wp-admin p input[type="checkbox"],
 146  .wp-admin p input[type="radio"] {
 147      margin-top: 0;
 148  }
 149  
 150  .wp-admin p label input[type="checkbox"] {
 151      margin-top: -4px;
 152  }
 153  
 154  .wp-admin p label input[type="radio"] {
 155      margin-top: -2px;
 156  }
 157  
 158  input[type="radio"] {
 159      border-radius: 50%;
 160      margin-right: 0.25rem;
 161      /* 10px not sure if still necessary, comes from the MP6 redesign in r26072 */
 162      line-height: 0.71428571;
 163  }
 164  
 165  input[type="checkbox"]:checked::before,
 166  input[type="radio"]:checked::before {
 167      float: left;
 168      display: inline-block;
 169      vertical-align: middle;
 170      width: 1rem;
 171      speak: never;
 172      -webkit-font-smoothing: antialiased;
 173      -moz-osx-font-smoothing: grayscale;
 174  }
 175  
 176  input[type="checkbox"]:checked::before {
 177      /* Use the "Yes" SVG Dashicon */
 178      content: url("data:image/svg+xml;utf8,%3Csvg%20xmlns%3D%27http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%27%20viewBox%3D%270%200%2020%2020%27%3E%3Cpath%20d%3D%27M14.83%204.89l1.34.94-5.81%208.38H9.02L5.78%209.67l1.34-1.25%202.57%202.4z%27%20fill%3D%27%233582c4%27%2F%3E%3C%2Fsvg%3E");
 179      margin: -0.1875rem 0 0 -0.25rem;
 180      height: 1.3125rem;
 181      width: 1.3125rem;
 182  }
 183  
 184  input[type="radio"]:checked::before {
 185      content: "";
 186      border-radius: 50%;
 187      width: 0.5rem; /* 8px */
 188      height: 0.5rem; /* 8px */
 189      margin: 0.1875rem; /* 3px */
 190      background-color: #3582c4;
 191      /* 16px not sure if still necessary, comes from the MP6 redesign in r26072 */
 192      line-height: 1.14285714;
 193  }
 194  
 195  @-moz-document url-prefix() {
 196      input[type="checkbox"],
 197      input[type="radio"],
 198      .form-table input.tog {
 199          margin-bottom: -1px;
 200      }
 201  }
 202  
 203  /* Search */
 204  input[type="search"] {
 205      -webkit-appearance: textfield;
 206  }
 207  
 208  input[type="search"]::-webkit-search-decoration {
 209      display: none;
 210  }
 211  
 212  .wp-admin input[type="file"] {
 213      padding: 3px 0;
 214      cursor: pointer;
 215  }
 216  
 217  input.readonly,
 218  input[readonly],
 219  textarea.readonly,
 220  textarea[readonly] {
 221      background-color: #f0f0f1;
 222  }
 223  
 224  ::-webkit-input-placeholder {
 225      color: #646970;
 226  }
 227  
 228  ::-moz-placeholder {
 229      color: #646970;
 230  }
 231  
 232  .form-invalid .form-required,
 233  .form-invalid .form-required:focus,
 234  .form-invalid.form-required input,
 235  .form-invalid.form-required input:focus,
 236  .form-invalid.form-required select,
 237  .form-invalid.form-required select:focus {
 238      border-color: #d63638 !important;
 239      box-shadow: 0 0 2px rgba(214, 54, 56, 0.8);
 240  }
 241  
 242  .form-table .form-required.form-invalid td:after {
 243      content: "\f534";
 244      font: normal 20px/1 dashicons;
 245      color: #d63638;
 246      margin-left: -25px;
 247      vertical-align: middle;
 248  }
 249  
 250  /* Adjust error indicator for password layout */
 251  .form-table .form-required.user-pass1-wrap.form-invalid td:after {
 252      content: "";
 253  }
 254  
 255  .form-table .form-required.user-pass1-wrap.form-invalid .password-input-wrapper:after {
 256      content: "\f534";
 257      font: normal 20px/1 dashicons;
 258      color: #d63638;
 259      margin: 0 6px 0 -29px;
 260      vertical-align: middle;
 261  }
 262  
 263  .form-input-tip {
 264      color: #646970;
 265  }
 266  
 267  input:disabled,
 268  input.disabled,
 269  select:disabled,
 270  select.disabled,
 271  textarea:disabled,
 272  textarea.disabled {
 273      background: rgba(255, 255, 255, 0.5);
 274      border-color: rgba(220, 220, 222, 0.75);
 275      box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.04);
 276      color: rgba(44, 51, 56, 0.5);
 277  }
 278  
 279  input[type="file"]:disabled,
 280  input[type="file"].disabled,
 281  input[type="file"][aria-disabled="true"],
 282  input[type="range"]:disabled,
 283  input[type="range"].disabled,
 284  input[type="range"][aria-disabled="true"] {
 285      background: none;
 286      box-shadow: none;
 287      cursor: default;
 288  }
 289  
 290  input[type="checkbox"]:disabled,
 291  input[type="checkbox"].disabled,
 292  input[type="checkbox"][aria-disabled="true"],
 293  input[type="radio"]:disabled,
 294  input[type="radio"].disabled,
 295  input[type="radio"][aria-disabled="true"],
 296  input[type="checkbox"]:disabled:checked:before,
 297  input[type="checkbox"].disabled:checked:before,
 298  input[type="radio"]:disabled:checked:before,
 299  input[type="radio"].disabled:checked:before {
 300      opacity: 0.7;
 301      cursor: default;
 302  }
 303  
 304  /*------------------------------------------------------------------------------
 305    2.0 - Forms
 306  ------------------------------------------------------------------------------*/
 307  
 308  /* Select styles are based on the default button in buttons.css */
 309  .wp-core-ui select {
 310      font-size: 14px;
 311      line-height: 2; /* 28px */
 312      color: #2c3338;
 313      border-color: #8c8f94;
 314      box-shadow: none;
 315      border-radius: 3px;
 316      padding: 0 24px 0 8px;
 317      min-height: 30px;
 318      max-width: 25rem;
 319      -webkit-appearance: none;
 320      /* The SVG is arrow-down-alt2 from Dashicons. */
 321      background: #fff url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20width%3D%2220%22%20height%3D%2220%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M5%206l5%205%205-5%202%201-7%207-7-7%202-1z%22%20fill%3D%22%23555%22%2F%3E%3C%2Fsvg%3E') no-repeat right 5px top 55%;
 322      background-size: 16px 16px;
 323      cursor: pointer;
 324      vertical-align: middle;
 325  }
 326  
 327  .wp-core-ui select:hover {
 328      color: #2271b1;
 329  }
 330  
 331  .wp-core-ui select:focus {
 332      border-color: #2271b1;
 333      color: #0a4b78;
 334      box-shadow: 0 0 0 1px #2271b1;
 335  }
 336  
 337  .wp-core-ui select:active {
 338      border-color: #8c8f94;
 339      box-shadow: none;
 340  }
 341  
 342  .wp-core-ui select.disabled,
 343  .wp-core-ui select:disabled {
 344      color: #a7aaad;
 345      border-color: #dcdcde;
 346      background-color: #f6f7f7;
 347      /* The SVG is arrow-down-alt2 from Dashicons. */
 348      background-image: url('data:image/svg+xml;charset=US-ASCII,%3Csvg%20width%3D%2220%22%20height%3D%2220%22%20xmlns%3D%22http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg%22%3E%3Cpath%20d%3D%22M5%206l5%205%205-5%202%201-7%207-7-7%202-1z%22%20fill%3D%22%23a0a5aa%22%2F%3E%3C%2Fsvg%3E');
 349      box-shadow: none;
 350      text-shadow: 0 1px 0 #fff;
 351      cursor: default;
 352      transform: none;
 353  }
 354  
 355  .wp-core-ui select[aria-disabled="true"] {
 356      cursor: default;
 357  }
 358  
 359  /* Reset Firefox inner outline that appears on :focus. */
 360  /* This ruleset overrides the color change on :focus thus needs to be after select:focus. */
 361  .wp-core-ui select:-moz-focusring {
 362      color: transparent;
 363      text-shadow: 0 0 0 #0a4b78;
 364  }
 365  
 366  /* Remove background focus style from IE11 while keeping focus style available on option elements. */
 367  .wp-core-ui select::-ms-value {
 368      background: transparent;
 369      color: #50575e;
 370  }
 371  
 372  .wp-core-ui select:hover::-ms-value {
 373      color: #2271b1;
 374  }
 375  
 376  .wp-core-ui select:focus::-ms-value {
 377      color: #0a4b78;
 378  }
 379  
 380  .wp-core-ui select.disabled::-ms-value,
 381  .wp-core-ui select:disabled::-ms-value {
 382      color: #a7aaad;
 383  }
 384  
 385  /* Hide the native down arrow for select element on IE. */
 386  .wp-core-ui select::-ms-expand {
 387      display: none;
 388  }
 389  
 390  .wp-admin .button-cancel {
 391      display: inline-block;
 392      min-height: 28px;
 393      padding: 0 5px;
 394      line-height: 2;
 395  }
 396  
 397  .meta-box-sortables select {
 398      max-width: 100%;
 399  }
 400  
 401  .meta-box-sortables input {
 402      vertical-align: middle;
 403  }
 404  
 405  .misc-pub-post-status select {
 406      margin-top: 0;
 407  }
 408  
 409  .wp-core-ui select[multiple] {
 410      height: auto;
 411      padding-right: 8px;
 412      background: #fff;
 413  }
 414  
 415  .submit {
 416      padding: 1.5em 0;
 417      margin: 5px 0;
 418      border-bottom-left-radius: 3px;
 419      border-bottom-right-radius: 3px;
 420      border: none;
 421  }
 422  
 423  form p.submit a.cancel:hover {
 424      text-decoration: none;
 425  }
 426  
 427  p.submit {
 428      text-align: left;
 429      max-width: 100%;
 430      margin-top: 20px;
 431      padding-top: 10px;
 432  }
 433  
 434  .textright p.submit {
 435      border: none;
 436      text-align: right;
 437  }
 438  
 439  table.form-table + p.submit,
 440  table.form-table + input + p.submit,
 441  table.form-table + input + input + p.submit {
 442      border-top: none;
 443      padding-top: 0;
 444  }
 445  
 446  #minor-publishing-actions input,
 447  #major-publishing-actions input,
 448  #minor-publishing-actions .preview {
 449      text-align: center;
 450  }
 451  
 452  textarea.all-options,
 453  input.all-options {
 454      width: 250px;
 455  }
 456  
 457  input.large-text,
 458  textarea.large-text {
 459      width: 99%;
 460  }
 461  
 462  .regular-text {
 463      width: 25em;
 464  }
 465  
 466  input.small-text {
 467      width: 50px;
 468      padding: 0 6px;
 469  }
 470  
 471  label input.small-text {
 472      margin-top: -4px;
 473  }
 474  
 475  input[type="number"].small-text {
 476      width: 65px;
 477      padding-right: 0;
 478  }
 479  
 480  input.tiny-text {
 481      width: 35px;
 482  }
 483  
 484  input[type="number"].tiny-text {
 485      width: 45px;
 486      padding-right: 0;
 487  }
 488  
 489  #doaction,
 490  #doaction2,
 491  #post-query-submit {
 492      margin: 0 8px 0 0;
 493  }
 494  
 495  /* @since 5.7.0 secondary bulk action controls require JS. */
 496  .no-js label[for="bulk-action-selector-bottom"],
 497  .no-js select#bulk-action-selector-bottom,
 498  .no-js input#doaction2,
 499  .no-js label[for="new_role2"],
 500  .no-js select#new_role2,
 501  .no-js input#changeit2 {
 502      display: none;
 503  }
 504  
 505  .tablenav .actions select {
 506      float: left;
 507      margin-right: 6px;
 508      max-width: 12.5rem;
 509  }
 510  
 511  #timezone_string option {
 512      margin-left: 1em;
 513  }
 514  
 515  .wp-hide-pw > .dashicons,
 516  .wp-cancel-pw > .dashicons {
 517      position: relative;
 518      top: 3px;
 519      width: 1.25rem;
 520      height: 1.25rem;
 521      top: 0.25rem;
 522      font-size: 20px;
 523  }
 524  
 525  .wp-cancel-pw .dashicons-no {
 526      display: none;
 527  }
 528  
 529  label,
 530  #your-profile label + a {
 531      vertical-align: middle;
 532  }
 533  
 534  fieldset label,
 535  #your-profile label + a {
 536      vertical-align: middle;
 537  }
 538  
 539  .options-media-php [for*="_size_"] {
 540      min-width: 10em;
 541      vertical-align: baseline;
 542  }
 543  
 544  .options-media-php .small-text[name*="_size_"] {
 545      margin: 0 0 1em;
 546  }
 547  
 548  .wp-generate-pw {
 549      margin-top: 1em;
 550      position: relative;
 551  }
 552  
 553  .wp-pwd button {
 554      height: min-content;
 555  }
 556  
 557  .wp-pwd button.pwd-toggle .dashicons {
 558      position: relative;
 559      top: 0.25rem;
 560  }
 561  
 562  .wp-pwd {
 563      margin-top: 1em;
 564      position: relative;
 565  }
 566  
 567  .mailserver-pass-wrap .wp-pwd {
 568      display: inline-block;
 569      margin-top: 0;
 570  }
 571  
 572  /* rtl:ignore */
 573  #mailserver_pass {
 574      padding-right: 2.5rem;
 575  }
 576  
 577  /* rtl:ignore */
 578  .mailserver-pass-wrap .button.wp-hide-pw {
 579      background: transparent;
 580      border: 1px solid transparent;
 581      box-shadow: none;
 582      font-size: 14px;
 583      line-height: 2;
 584      width: 2.5rem;
 585      min-width: 40px;
 586      margin: 0;
 587      padding: 0 9px;
 588      position: absolute;
 589      right: 0;
 590      top: 0;
 591  }
 592  
 593  .mailserver-pass-wrap .button.wp-hide-pw:hover {
 594      background: transparent;
 595      border-color: transparent;
 596  }
 597  
 598  .mailserver-pass-wrap .button.wp-hide-pw:focus {
 599      background: transparent;
 600      border-color: #3582c4;
 601      border-radius: 4px;
 602      box-shadow: 0 0 0 1px #3582c4;
 603      /* Only visible in Windows High Contrast mode */
 604      outline: 2px solid transparent;
 605  }
 606  
 607  .mailserver-pass-wrap .button.wp-hide-pw:active {
 608      background: transparent;
 609      box-shadow: none;
 610      transform: none;
 611  }
 612  
 613  #misc-publishing-actions label {
 614      vertical-align: baseline;
 615  }
 616  
 617  #pass-strength-result {
 618      background-color: #f0f0f1;
 619      border: 1px solid #dcdcde;
 620      color: #1d2327;
 621      margin: -1px 1px 5px;
 622      padding: 3px 5px;
 623      text-align: center;
 624      width: 25em;
 625      box-sizing: border-box;
 626      opacity: 0;
 627  }
 628  
 629  #pass-strength-result.short {
 630      background-color: #ffabaf;
 631      border-color: #e65054;
 632      opacity: 1;
 633  }
 634  
 635  #pass-strength-result.bad {
 636      background-color: #facfd2;
 637      border-color: #f86368;
 638      opacity: 1;
 639  }
 640  
 641  #pass-strength-result.good {
 642      background-color: #f5e6ab;
 643      border-color: #f0c33c;
 644      opacity: 1;
 645  }
 646  
 647  #pass-strength-result.strong {
 648      background-color: #b8e6bf;
 649      border-color: #68de7c;
 650      opacity: 1;
 651  }
 652  
 653  .password-input-wrapper {
 654      display: inline-block;
 655  }
 656  
 657  .password-input-wrapper input {
 658      font-family: Consolas, Monaco, monospace;
 659  }
 660  
 661  #pass1.short, #pass1-text.short {
 662      border-color: #e65054;
 663  }
 664  
 665  #pass1.bad, #pass1-text.bad {
 666      border-color: #f86368;
 667  }
 668  
 669  #pass1.good, #pass1-text.good {
 670      border-color: #f0c33c;
 671  }
 672  
 673  #pass1.strong, #pass1-text.strong {
 674      border-color: #68de7c;
 675  }
 676  
 677  #pass1:focus,
 678  #pass1-text:focus {
 679      box-shadow: 0 0 0 2px #2271b1;
 680      /* Only visible in Windows High Contrast mode */
 681      outline: 2px solid transparent;
 682  }
 683  
 684  .pw-weak {
 685      display: none;
 686  }
 687  
 688  .indicator-hint {
 689      padding-top: 8px;
 690  }
 691  
 692  .wp-pwd [type="text"],
 693  .wp-pwd [type="password"] {
 694      margin-bottom: 0;
 695      /* Same height as the buttons */
 696      min-height: 30px;
 697  }
 698  
 699  /* Hide the Edge "reveal password" native button */
 700  .wp-pwd input::-ms-reveal {
 701      display: none;
 702  }
 703  
 704  #pass1-text,
 705  .show-password #pass1 {
 706      display: none;
 707  }
 708  
 709  #pass1-text::-ms-clear {
 710      display: none;
 711  }
 712  
 713  .show-password #pass1-text {
 714      display: inline-block;
 715  }
 716  
 717  p.search-box {
 718      display: flex;
 719      flex-wrap: wrap;
 720      align-items: center;
 721      column-gap: 0.5rem;
 722      position: relative;
 723      float: right;
 724      margin: 11px 0;
 725  }
 726  
 727  .network-admin.themes-php p.search-box {
 728      clear: left;
 729  }
 730  
 731  .search-box input[name="s"],
 732  .tablenav .search-plugins input[name="s"],
 733  .tagsdiv .newtag {
 734      float: left;
 735      margin: 0 4px 0 0;
 736  }
 737  
 738  .js.plugins-php .search-box .wp-filter-search {
 739      margin: 0;
 740      width: 280px;
 741  }
 742  
 743  input[type="text"].ui-autocomplete-loading,
 744  input[type="email"].ui-autocomplete-loading {
 745      background-image: url(../images/loading.gif);
 746      background-repeat: no-repeat;
 747      background-position: right 5px center;
 748      visibility: visible;
 749  }
 750  
 751  input.ui-autocomplete-input.open {
 752      border-bottom-color: transparent;
 753  }
 754  
 755  ul#add-to-blog-users {
 756      margin: 0 0 0 14px;
 757  }
 758  
 759  .ui-autocomplete {
 760      padding: 0;
 761      margin: 0;
 762      list-style: none;
 763      position: absolute;
 764      z-index: 10000;
 765      border: 1px solid #4f94d4;
 766      box-shadow: 0 1px 2px rgba(79, 148, 212, 0.8);
 767      background-color: #fff;
 768  }
 769  
 770  .ui-autocomplete li {
 771      margin-bottom: 0;
 772      padding: 4px 10px;
 773      white-space: nowrap;
 774      text-align: left;
 775      cursor: pointer;
 776  }
 777  
 778  /* Colors for the wplink toolbar autocomplete. */
 779  .ui-autocomplete .ui-state-focus {
 780      background-color: #dcdcde;
 781  }
 782  
 783  /* Colors for the tags autocomplete. */
 784  .wp-tags-autocomplete .ui-state-focus,
 785  .wp-tags-autocomplete [aria-selected="true"] {
 786      background-color: #2271b1;
 787      color: #fff;
 788      /* Only visible in Windows High Contrast mode */
 789      outline: 2px solid transparent;
 790  }
 791  
 792  /*------------------------------------------------------------------------------
 793    15.0 - Comments Screen
 794  ------------------------------------------------------------------------------*/
 795  
 796  .form-table {
 797      border-collapse: collapse;
 798      margin-top: 0.5em;
 799      width: 100%;
 800      clear: both;
 801  }
 802  
 803  .form-table,
 804  .form-table td,
 805  .form-table th,
 806  .form-table td p {
 807      font-size: 14px;
 808  }
 809  
 810  .form-table td {
 811      margin-bottom: 9px;
 812      padding: 15px 10px;
 813      line-height: 1.3;
 814      vertical-align: middle;
 815  }
 816  
 817  .form-table th,
 818  .form-wrap label {
 819      color: #1d2327;
 820      font-weight: 400;
 821      text-shadow: none;
 822      vertical-align: baseline;
 823  }
 824  
 825  .form-table th {
 826      vertical-align: top;
 827      text-align: left;
 828      padding: 20px 10px 20px 0;
 829      width: 200px;
 830      line-height: 1.3;
 831      font-weight: 600;
 832  }
 833  
 834  .form-table th.th-full, /* Not used by core. Back-compat for pre-4.8 */
 835  .form-table .td-full {
 836      width: auto;
 837      padding: 20px 10px 20px 0;
 838      font-weight: 400;
 839  }
 840  
 841  .form-table td p {
 842      margin-top: 4px;
 843      margin-bottom: 0;
 844  }
 845  
 846  .form-table .date-time-doc {
 847      margin-top: 1em;
 848  }
 849  
 850  .form-table p.timezone-info {
 851      margin: 1em 0;
 852      display: flex;
 853      flex-direction: column;
 854  }
 855  
 856  #local-time {
 857      margin-top: 0.5em;
 858  }
 859  
 860  .form-table td fieldset label {
 861      margin: 0.35em 0 0.5em !important;
 862      display: inline-block;
 863  }
 864  
 865  .form-table td fieldset p label {
 866      margin-top: 0 !important;
 867  }
 868  
 869  .form-table td fieldset label,
 870  .form-table td fieldset p,
 871  .form-table td fieldset li {
 872      line-height: 1.4;
 873  }
 874  
 875  .form-table input.tog,
 876  .form-table input[type="radio"] {
 877      margin-top: -4px;
 878      margin-right: 4px;
 879      float: none;
 880  }
 881  
 882  .form-table .pre {
 883      padding: 8px;
 884      margin: 0;
 885  }
 886  
 887  table.form-table td .updated {
 888      font-size: 13px;
 889  }
 890  
 891  table.form-table td .updated p {
 892      font-size: 13px;
 893      margin: 0.3em 0;
 894  }
 895  
 896  /*------------------------------------------------------------------------------
 897    18.0 - Users
 898  ------------------------------------------------------------------------------*/
 899  
 900  #profile-page .form-table textarea {
 901      width: 500px;
 902      margin-bottom: 6px;
 903  }
 904  
 905  #profile-page .form-table #rich_editing {
 906      margin-right: 5px
 907  }
 908  
 909  #your-profile legend {
 910      font-size: 22px;
 911  }
 912  
 913  #display_name {
 914      width: 15em;
 915  }
 916  
 917  #adduser .form-field input,
 918  #createuser .form-field input {
 919      width: 25em;
 920  }
 921  
 922  .color-option {
 923      display: inline-block;
 924      width: 24%;
 925      padding: 5px 15px 15px;
 926      box-sizing: border-box;
 927      margin-bottom: 3px;
 928  }
 929  
 930  .color-option:hover,
 931  .color-option.selected {
 932      background: #dcdcde;
 933  }
 934  
 935  .color-palette {
 936      display: table;
 937      width: 100%;
 938      border-spacing: 0;
 939      border-collapse: collapse;
 940  }
 941  .color-palette .color-palette-shade,
 942  .color-palette td {
 943      display: table-cell;
 944      height: 20px;
 945      padding: 0;
 946      border: none;
 947  }
 948  
 949  .color-option {
 950      cursor: pointer;
 951  }
 952  
 953  .create-application-password .form-field {
 954      max-width: 25em;
 955  }
 956  
 957  .create-application-password label {
 958      font-weight: 600;
 959  }
 960  
 961  .create-application-password p.submit {
 962      margin-bottom: 0;
 963      padding-bottom: 0;
 964      display: block;
 965  }
 966  
 967  #application-passwords-section .notice {
 968      margin-top: 20px;
 969      margin-bottom: 0;
 970      word-wrap: break-word;
 971  }
 972  
 973  .application-password-display input.code {
 974      margin-bottom: 6px;
 975      width: 19em;
 976  }
 977  
 978  .auth-app-card.card {
 979      max-width: 768px;
 980  }
 981  
 982  .authorize-application-php .form-wrap p {
 983      display: block;
 984  }
 985  
 986  /*------------------------------------------------------------------------------
 987    19.0 - Tools
 988  ------------------------------------------------------------------------------*/
 989  
 990  .tool-box .title {
 991      margin: 8px 0;
 992      font-size: 18px;
 993      font-weight: 400;
 994      line-height: 24px;
 995  }
 996  
 997  .label-responsive {
 998      vertical-align: middle;
 999  }
1000  
1001  #export-filters p {
1002      margin: 0 0 1em;
1003  }
1004  
1005  #export-filters p.submit {
1006      margin: 7px 0 5px;
1007  }
1008  
1009  /* Card styles */
1010  
1011  .card {
1012      position: relative;
1013      margin-top: 20px;
1014      padding: 0.7em 2em 1em;
1015      min-width: 255px;
1016      max-width: 520px;
1017      border: 1px solid #c3c4c7;
1018      box-shadow: 0 1px 1px rgba(0, 0, 0, 0.04);
1019      background: #fff;
1020      box-sizing: border-box;
1021  }
1022  
1023  /* Press this styles */
1024  
1025  .pressthis h4 {
1026      margin: 2em 0 1em;
1027  }
1028  
1029  .pressthis textarea {
1030      width: 100%;
1031      font-size: 1em;
1032  }
1033  
1034  #pressthis-code-wrap {
1035      overflow: auto;
1036  }
1037  
1038  .pressthis-bookmarklet-wrapper {
1039      margin: 20px 0 8px;
1040      vertical-align: top;
1041      position: relative;
1042      z-index: 1;
1043  }
1044  
1045  .pressthis-bookmarklet,
1046  .pressthis-bookmarklet:hover,
1047  .pressthis-bookmarklet:focus,
1048  .pressthis-bookmarklet:active {
1049      display: inline-block;
1050      position: relative;
1051      cursor: move;
1052      color: #2c3338;
1053      background: #dcdcde;
1054      border-radius: 5px;
1055      border: 1px solid #c3c4c7;
1056      font-style: normal;
1057      line-height: 16px;
1058      font-size: 14px;
1059      text-decoration: none;
1060  }
1061  
1062  .pressthis-bookmarklet:active {
1063      outline: none;
1064  }
1065  
1066  .pressthis-bookmarklet:after {
1067      content: "";
1068      width: 70%;
1069      height: 55%;
1070      z-index: -1;
1071      position: absolute;
1072      right: 10px;
1073      bottom: 9px;
1074      background: transparent;
1075      transform: skew(20deg) rotate(6deg);
1076      box-shadow: 0 10px 8px rgba(0, 0, 0, 0.6);
1077  }
1078  
1079  .pressthis-bookmarklet:hover:after {
1080      transform: skew(20deg) rotate(9deg);
1081      box-shadow: 0 10px 8px rgba(0, 0, 0, 0.7);
1082  }
1083  
1084  .pressthis-bookmarklet span {
1085      display: inline-block;
1086      margin: 0;
1087      padding: 0 12px 8px 9px;
1088  }
1089  
1090  .pressthis-bookmarklet span:before {
1091      color: #787c82;
1092      font: normal 20px/1 dashicons;
1093      content: "\f157";
1094      position: relative;
1095      display: inline-block;
1096      top: 4px;
1097      margin-right: 4px;
1098  }
1099  
1100  .pressthis-js-toggle {
1101      margin-left: 10px;
1102      padding: 0;
1103      height: auto;
1104      vertical-align: top;
1105  }
1106  
1107  /* to override the button class being applied */
1108  .pressthis-js-toggle.button.button {
1109      margin-left: 10px;
1110      padding: 0;
1111      height: auto;
1112      vertical-align: top;
1113  }
1114  
1115  .pressthis-js-toggle .dashicons {
1116      margin: 5px 8px 6px 7px;
1117      color: #50575e;
1118  }
1119  
1120  /*------------------------------------------------------------------------------
1121    20.0 - Settings
1122  ------------------------------------------------------------------------------*/
1123  
1124  .timezone-info code {
1125      white-space: nowrap;
1126  }
1127  
1128  .defaultavatarpicker .avatar {
1129      margin: 2px 0;
1130      vertical-align: middle;
1131  }
1132  
1133  .options-general-php .date-time-text {
1134      display: inline-block;
1135      min-width: 10em;
1136  }
1137  
1138  .options-general-php input.small-text {
1139      width: 56px;
1140      margin: -2px 0;
1141  }
1142  
1143  .options-general-php .spinner {
1144      float: none;
1145      margin: -3px 3px 0;
1146  }
1147  
1148  .settings-php .language-install-spinner,
1149  .options-general-php .language-install-spinner,
1150  .user-edit-php .language-install-spinner,
1151  .profile-php .language-install-spinner {
1152      display: inline-block;
1153      float: none;
1154      margin: -3px 5px 0;
1155      vertical-align: middle;
1156  }
1157  
1158  .form-table.permalink-structure .available-structure-tags {
1159      margin-top: 8px;
1160  }
1161  
1162  .form-table.permalink-structure .available-structure-tags ul {
1163      display: flex;
1164      flex-wrap: wrap;
1165      margin: 8px 0 0;
1166  }
1167  
1168  .form-table.permalink-structure .available-structure-tags li {
1169      margin: 6px 5px 0 0;
1170  }
1171  
1172  .form-table.permalink-structure .available-structure-tags li:last-child {
1173      margin-right: 0;
1174  }
1175  
1176  .form-table.permalink-structure .structure-selection .row {
1177      margin-bottom: 16px;
1178  }
1179  
1180  .form-table.permalink-structure .structure-selection .row > div {
1181      max-width: calc(100% - 24px);
1182      display: inline-flex;
1183      flex-direction: column;
1184  }
1185  
1186  .form-table.permalink-structure .structure-selection .row label {
1187      font-weight: 600;
1188  }
1189  
1190  .form-table.permalink-structure .structure-selection .row p {
1191      margin-top: 0;
1192  }
1193  
1194  /*------------------------------------------------------------------------------
1195    21.0 - Network Admin
1196  ------------------------------------------------------------------------------*/
1197  
1198  .setup-php textarea {
1199      max-width: 100%;
1200  }
1201  
1202  .form-field #site-address {
1203      max-width: 25em;
1204  }
1205  
1206  .form-field #domain {
1207      max-width: 22em;
1208  }
1209  
1210  .form-field #site-title,
1211  .form-field #admin-email,
1212  .form-field #path,
1213  .form-field #blog_registered,
1214  .form-field #blog_last_updated {
1215      max-width: 25em;
1216  }
1217  
1218  .form-field #path {
1219      margin-bottom: 5px;
1220  }
1221  
1222  #search-users,
1223  #search-sites {
1224      max-width: 60%;
1225  }
1226  
1227  .configuration-rules-label {
1228      font-weight: 600;
1229      margin-bottom: 4px;
1230  }
1231  
1232  /*------------------------------------------------------------------------------
1233     Credentials check dialog for Install and Updates
1234  ------------------------------------------------------------------------------*/
1235  
1236  .request-filesystem-credentials-dialog {
1237      display: none;
1238      /* The customizer uses visibility: hidden on the body for full-overlays. */
1239      visibility: visible;
1240  }
1241  
1242  .request-filesystem-credentials-dialog .notification-dialog {
1243      top: 10%;
1244      max-height: 85%;
1245  }
1246  
1247  .request-filesystem-credentials-dialog-content {
1248      margin: 25px;
1249  }
1250  
1251  #request-filesystem-credentials-title {
1252      font-size: 1.3em;
1253      margin: 1em 0;
1254  }
1255  
1256  .request-filesystem-credentials-form legend {
1257      font-size: 1em;
1258      padding: 1.33em 0;
1259      font-weight: 600;
1260  }
1261  
1262  .request-filesystem-credentials-form input[type="text"],
1263  .request-filesystem-credentials-form input[type="password"] {
1264      display: block;
1265  }
1266  
1267  .request-filesystem-credentials-dialog input[type="text"],
1268  .request-filesystem-credentials-dialog input[type="password"] {
1269      width: 100%;
1270  }
1271  
1272  .request-filesystem-credentials-form .field-title {
1273      font-weight: 600;
1274  }
1275  
1276  .request-filesystem-credentials-dialog label[for="hostname"],
1277  .request-filesystem-credentials-dialog label[for="public_key"],
1278  .request-filesystem-credentials-dialog label[for="private_key"] {
1279      display: block;
1280      margin-bottom: 1em;
1281  }
1282  
1283  .request-filesystem-credentials-dialog .ftp-username,
1284  .request-filesystem-credentials-dialog .ftp-password {
1285      float: left;
1286      width: 48%;
1287  }
1288  
1289  .request-filesystem-credentials-dialog .ftp-password {
1290      margin-left: 4%;
1291  }
1292  
1293  .request-filesystem-credentials-dialog .request-filesystem-credentials-action-buttons {
1294      text-align: right;
1295  }
1296  
1297  .request-filesystem-credentials-dialog label[for="ftp"] {
1298      margin-right: 10px;
1299  }
1300  
1301  .request-filesystem-credentials-dialog #auth-keys-desc {
1302      margin-bottom: 0;
1303  }
1304  
1305  #request-filesystem-credentials-dialog .button:not(:last-child) {
1306      margin-right: 10px;
1307  }
1308  
1309  #request-filesystem-credentials-form .cancel-button {
1310      display: none;
1311  }
1312  
1313  #request-filesystem-credentials-dialog .cancel-button {
1314      display: inline;
1315  }
1316  
1317  .request-filesystem-credentials-dialog .ftp-username,
1318  .request-filesystem-credentials-dialog .ftp-password {
1319      float: none;
1320      width: auto;
1321  }
1322  
1323  .request-filesystem-credentials-dialog .ftp-username {
1324      margin-bottom: 1em;
1325  }
1326  
1327  .request-filesystem-credentials-dialog .ftp-password {
1328      margin: 0;
1329  }
1330  
1331  .request-filesystem-credentials-dialog .ftp-password em {
1332      color: #8c8f94;
1333  }
1334  
1335  .request-filesystem-credentials-dialog label {
1336      display: block;
1337      line-height: 1.5;
1338      margin-bottom: 1em;
1339  }
1340  
1341  .request-filesystem-credentials-form legend {
1342      padding-bottom: 0;
1343  }
1344  
1345  .request-filesystem-credentials-form #ssh-keys legend {
1346      font-size: 1.3em;
1347  }
1348  
1349  .request-filesystem-credentials-form .notice {
1350      margin: 0 0 20px;
1351      clear: both;
1352  }
1353  
1354  /*------------------------------------------------------------------------------
1355     Privacy Policy settings screen
1356  ------------------------------------------------------------------------------*/
1357  .tools-privacy-policy-page form {
1358      margin-bottom: 1.3em;
1359  }
1360  
1361  .tools-privacy-policy-page input.button {
1362      margin: 0 1px 0 6px;
1363  }
1364  
1365  .tools-privacy-policy-page select {
1366      margin: 0 1px 0.5em 6px;
1367  }
1368  
1369  .tools-privacy-edit {
1370      margin: 1.5em 0;
1371  }
1372  
1373  .tools-privacy-policy-page span {
1374      line-height: 2;
1375  }
1376  
1377  .privacy_requests .column-email {
1378      width: 40%;
1379  }
1380  
1381  .privacy_requests .column-type {
1382      text-align: center;
1383  }
1384  
1385  .privacy_requests thead td:first-child,
1386  .privacy_requests tfoot td:first-child {
1387      border-left: 4px solid #fff;
1388  }
1389  
1390  .privacy_requests tbody th {
1391      border-left: 4px solid #fff;
1392      background: #fff;
1393      box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.1);
1394  }
1395  
1396  .privacy_requests .row-actions {
1397      color: #787c82;
1398  }
1399  
1400  .privacy_requests .row-actions.processing {
1401      position: static;
1402  }
1403  
1404  .privacy_requests tbody .has-request-results th {
1405      box-shadow: none;
1406  }
1407  
1408  .privacy_requests tbody .request-results th .notice {
1409      margin: 0 0 5px;
1410  }
1411  
1412  .privacy_requests tbody td {
1413      background: #fff;
1414      box-shadow: inset 0 -1px 0 rgba(0, 0, 0, 0.1);
1415  }
1416  
1417  .privacy_requests tbody .has-request-results td {
1418      box-shadow: none;
1419  }
1420  
1421  .privacy_requests .next_steps .button {
1422      word-wrap: break-word;
1423      white-space: normal;
1424  }
1425  
1426  .privacy_requests .status-request-confirmed th,
1427  .privacy_requests .status-request-confirmed td {
1428      background-color: #fff;
1429      border-left-color: #72aee6;
1430  }
1431  
1432  .privacy_requests .status-request-failed th,
1433  .privacy_requests .status-request-failed td {
1434      background-color: #f6f7f7;
1435      border-left-color: #d63638;
1436  }
1437  
1438  .privacy_requests .export_personal_data_failed a {
1439      vertical-align: baseline;
1440  }
1441  
1442  .status-label {
1443      font-weight: 600;
1444  }
1445  
1446  .status-label.status-request-pending {
1447      font-weight: 400;
1448      font-style: italic;
1449      color: #646970;
1450  }
1451  
1452  .status-label.status-request-failed {
1453      color: #d63638;
1454      font-weight: 600;
1455  }
1456  
1457  .wp-privacy-request-form {
1458      clear: both;
1459  }
1460  
1461  .wp-privacy-request-form-field {
1462      margin: 1.5em 0;
1463  }
1464  
1465  .wp-privacy-request-form input {
1466      margin: 0;
1467  }
1468  
1469  .email-personal-data::before {
1470      display: inline-block;
1471      font: normal 20px/1 dashicons;
1472      margin: 3px 5px 0 -2px;
1473      speak: never;
1474      -webkit-font-smoothing: antialiased;
1475      -moz-osx-font-smoothing: grayscale;
1476      vertical-align: top;
1477  }
1478  
1479  .email-personal-data--sending::before {
1480      color: #d63638;
1481      content: "\f463";
1482      animation: rotation 2s infinite linear;
1483  }
1484  
1485  .email-personal-data--sent::before {
1486      color: #68de7c;
1487      content: "\f147";
1488  }
1489  
1490  
1491  /* =Media Queries
1492  -------------------------------------------------------------- */
1493  
1494  @media screen and (max-width: 782px) {
1495      /* Input Elements */
1496      textarea {
1497          -webkit-appearance: none;
1498      }
1499  
1500      input[type="text"],
1501      input[type="password"],
1502      input[type="date"],
1503      input[type="datetime"],
1504      input[type="datetime-local"],
1505      input[type="email"],
1506      input[type="month"],
1507      input[type="number"],
1508      input[type="search"],
1509      input[type="tel"],
1510      input[type="time"],
1511      input[type="url"],
1512      input[type="week"] {
1513          -webkit-appearance: none;
1514          padding: 3px 10px;
1515          /* Only necessary for IE11 */
1516          min-height: 40px;
1517      }
1518  
1519      ::-webkit-datetime-edit {
1520          line-height: 1.875; /* 30px */
1521      }
1522  
1523      input[type="checkbox"],
1524      .widefat th input[type="checkbox"],
1525      .widefat thead td input[type="checkbox"],
1526      .widefat tfoot td input[type="checkbox"] {
1527          -webkit-appearance: none;
1528      }
1529  
1530      .widefat th input[type="checkbox"],
1531      .widefat thead td input[type="checkbox"],
1532      .widefat tfoot td input[type="checkbox"] {
1533          margin-bottom: 8px;
1534      }
1535  
1536      input[type="checkbox"]:checked:before,
1537      .widefat th input[type="checkbox"]:before,
1538      .widefat thead td input[type="checkbox"]:before,
1539      .widefat tfoot td input[type="checkbox"]:before {
1540          width: 1.875rem;
1541          height: 1.875rem;
1542          margin: -0.1875rem -0.3125rem;
1543      }
1544  
1545      input[type="radio"],
1546      input[type="checkbox"] {
1547          height: 1.5625rem;
1548          width: 1.5625rem;
1549      }
1550  
1551      .wp-admin p input[type="checkbox"],
1552      .wp-admin p input[type="radio"] {
1553          margin-top: -0.1875rem;
1554      }
1555  
1556      input[type="radio"]:checked:before {
1557          vertical-align: middle;
1558          width: 0.5625rem;
1559          height: 0.5625rem;
1560          margin: 0.4375rem;
1561          line-height: 0.76190476;
1562      }
1563  
1564      .wp-core-ui select,
1565      .wp-admin .form-table select {
1566          min-height: 40px;
1567          font-size: 16px;
1568          line-height: 1.625; /* 26px */
1569          padding: 5px 24px 5px 8px;
1570      }
1571  
1572      .wp-admin .button-cancel {
1573          margin-bottom: 0;
1574          padding: 2px 0;
1575          font-size: 14px;
1576          vertical-align: middle;
1577      }
1578  
1579      #adduser .form-field input,
1580      #createuser .form-field input {
1581          width: 100%;
1582      }
1583  
1584      .form-table {
1585          box-sizing: border-box;
1586      }
1587  
1588      .form-table th,
1589      .form-table td,
1590      .label-responsive {
1591          display: block;
1592          width: auto;
1593          vertical-align: middle;
1594      }
1595  
1596      .label-responsive {
1597          margin: 0.5em 0;
1598      }
1599  
1600      .export-filters li {
1601          margin-bottom: 0;
1602      }
1603  
1604      .form-table .color-palette .color-palette-shade,
1605      .form-table .color-palette td {
1606          display: table-cell;
1607          width: 15px;
1608          height: 30px;
1609          padding: 0;
1610      }
1611  
1612      .form-table .color-palette {
1613          margin-right: 10px;
1614      }
1615  
1616      textarea,
1617      input {
1618          font-size: 16px;
1619      }
1620  
1621      .form-table td input[type="text"],
1622      .form-table td input[type="email"],
1623      .form-table td input[type="password"],
1624      .form-table td select,
1625      .form-table td textarea,
1626      .form-table span.description,
1627      #profile-page .form-table textarea {
1628          width: 100%;
1629          display: block;
1630          max-width: none;
1631          box-sizing: border-box;
1632      }
1633  
1634      .form-table .form-required.form-invalid td:after {
1635          float: right;
1636          margin: -30px 3px 0 0;
1637      }
1638  
1639      input[type="text"].small-text,
1640      input[type="search"].small-text,
1641      input[type="password"].small-text,
1642      input[type="number"].small-text,
1643      input[type="number"].small-text,
1644      .form-table input[type="text"].small-text {
1645          width: auto;
1646          max-width: 4.375em; /* 70px, enough for 4 digits to fit comfortably */
1647          display: inline;
1648          padding: 3px 6px;
1649          margin: 0 3px;
1650      }
1651  
1652      .form-table .regular-text ~ input[type="text"].small-text {
1653          margin-top: 5px;
1654      }
1655  
1656      #pass-strength-result {
1657          width: 100%;
1658          box-sizing: border-box;
1659          padding: 8px;
1660      }
1661  
1662      .password-input-wrapper {
1663          display: block;
1664      }
1665  
1666      p.search-box {
1667          float: none;
1668          width: 100%;
1669          margin-bottom: 20px;
1670          display: flex;
1671      }
1672  
1673      p.search-box input[name="s"] {
1674          float: none;
1675          width: 100%;
1676          margin-bottom: 10px;
1677          vertical-align: middle;
1678      }
1679  
1680      p.search-box input[type="submit"] {
1681          margin-bottom: 10px;
1682      }
1683  
1684      .form-table span.description {
1685          display: inline;
1686          padding: 4px 0 0;
1687          line-height: 1.4;
1688          font-size: 14px;
1689      }
1690  
1691      .form-table th {
1692          padding: 10px 0 0;
1693          border-bottom: 0;
1694      }
1695  
1696      .form-table td {
1697          margin-bottom: 0;
1698          padding: 4px 0 6px;
1699      }
1700  
1701      .form-table.permalink-structure td code {
1702          display: inline-block;
1703      }
1704  
1705      .form-table.permalink-structure .structure-selection {
1706          margin-top: 8px;
1707      }
1708  
1709      .form-table.permalink-structure .structure-selection .row > div {
1710          max-width: calc(100% - 36px);
1711          width: 100%;
1712      }
1713  
1714      .form-table.permalink-structure td input[type="text"] {
1715          margin-top: 4px;
1716      }
1717  
1718      .form-table input.regular-text {
1719          width: 100%;
1720      }
1721  
1722      .form-table label {
1723          font-size: 14px;
1724      }
1725  
1726      .form-table td > label:first-child {
1727          display: inline-block;
1728          margin-top: 0.35em;
1729      }
1730  
1731      .background-position-control .button-group > label {
1732          font-size: 0;
1733      }
1734  
1735      .form-table fieldset label {
1736          display: block;
1737      }
1738  
1739      .form-field #domain {
1740          max-width: none;
1741      }
1742  
1743      /* New Password */
1744      .wp-pwd {
1745          position: relative;
1746      }
1747  
1748      /* Needs higher specificity than normal input type text and password. */
1749      #profile-page .form-table #pass1 {
1750          padding-right: 90px;
1751      }
1752  
1753      .wp-pwd button.button {
1754          background: transparent;
1755          border: 1px solid transparent;
1756          box-shadow: none;
1757          line-height: 2;
1758          margin: 0;
1759          padding: 5px 9px;
1760          position: absolute;
1761          right: 0;
1762          top: 0;
1763          width: 2.375rem;
1764          height: 2.375rem;
1765          min-width: 40px;
1766          min-height: 40px;
1767      }
1768  
1769      .wp-pwd button.wp-hide-pw {
1770          right: 2.5rem;
1771      }
1772  
1773      body.user-new-php .wp-pwd button.wp-hide-pw {
1774          right: 0;
1775      }
1776  
1777      .wp-pwd button.button:hover,
1778      .wp-pwd button.button:focus {
1779          background: transparent;
1780      }
1781  
1782      .wp-pwd button.button:active {
1783          background: transparent;
1784          box-shadow: none;
1785          transform: none;
1786      }
1787  
1788      .wp-pwd .button .text {
1789          display: none;
1790      }
1791  
1792      .wp-pwd [type="text"],
1793      .wp-pwd [type="password"] {
1794          line-height: 2;
1795          padding-right: 5rem;
1796      }
1797  
1798      body.user-new-php .wp-pwd [type="text"],
1799      body.user-new-php .wp-pwd [type="password"] {
1800          padding-right: 2.5rem;
1801      }
1802  
1803      .wp-cancel-pw .dashicons-no {
1804          display: inline-block;
1805      }
1806  
1807      .mailserver-pass-wrap .wp-pwd {
1808          display: block;
1809      }
1810  
1811      /* rtl:ignore */
1812      #mailserver_pass {
1813          padding-left: 10px;
1814      }
1815  
1816      .options-general-php input[type="text"].small-text {
1817          max-width: 6.25em;
1818          margin: 0;
1819      }
1820  
1821      /* Privacy Policy settings screen */
1822      .tools-privacy-policy-page form.wp-create-privacy-page {
1823          margin-bottom: 1em;
1824      }
1825  
1826      .tools-privacy-policy-page input#set-page,
1827      .tools-privacy-policy-page select {
1828          margin: 10px 0 0;
1829      }
1830  
1831      .tools-privacy-policy-page .wp-create-privacy-page span {
1832          display: block;
1833          margin-bottom: 1em;
1834      }
1835  
1836      .tools-privacy-policy-page .wp-create-privacy-page .button {
1837          margin-left: 0;
1838      }
1839  
1840      .wp-list-table.privacy_requests tr:not(.inline-edit-row):not(.no-items) td.column-primary:not(.check-column) {
1841          display: table-cell;
1842      }
1843  
1844      .wp-list-table.privacy_requests.widefat th input,
1845      .wp-list-table.privacy_requests.widefat thead td input {
1846          margin-left: 5px;
1847      }
1848  
1849      .wp-privacy-request-form-field input[type="text"] {
1850          width: 100%;
1851          margin-bottom: 10px;
1852          vertical-align: middle;
1853      }
1854  
1855      .regular-text {
1856          max-width: 100%;
1857      }
1858  }
1859  
1860  @media only screen and (max-width: 768px) {
1861      .form-field input[type="text"],
1862      .form-field input[type="email"],
1863      .form-field input[type="password"],
1864      .form-field select,
1865      .form-field textarea {
1866          width: 99%;
1867      }
1868  
1869      .form-wrap .form-field {
1870          padding: 0;
1871      }
1872  }
1873  
1874  @media only screen and (max-height: 480px), screen and (max-width: 450px) {
1875      /* Request Credentials / File Editor Warning */
1876      .request-filesystem-credentials-dialog .notification-dialog,
1877      .file-editor-warning .notification-dialog {
1878          width: 100%;
1879          height: 100%;
1880          max-height: 100%;
1881          position: fixed;
1882          top: 0;
1883          margin: 0;
1884          left: 0;
1885      }
1886  }
1887  
1888  /* Smartphone */
1889  @media screen and (max-width: 600px) {
1890      /* Color Picker Options */
1891      .color-option {
1892          width: 49%;
1893      }
1894  }
1895  
1896  @media only screen and (max-width: 320px) {
1897      .options-general-php .date-time-text.date-time-custom-text {
1898          min-width: 0;
1899          margin-right: 0.5em;
1900      }
1901  }
1902  
1903  @keyframes rotation {
1904      0% {
1905          transform: rotate(0deg);
1906      }
1907      100% {
1908          transform: rotate(359deg);
1909      }
1910  }