wp-admin/css/forms-rtl.css

   1 /* Include margin and padding in the width calculation of input and textarea. */
   2 input,
   3 textarea {
   4         -webkit-box-sizing: border-box;
   5         -moz-box-sizing: border-box;
   6         box-sizing: border-box;
   7 }
   8
   9 input[type="text"],
  10 input[type="password"],
  11 input[type="checkbox"],
  12 input[type="color"],
  13 input[type="date"],
  14 input[type="datetime"],
  15 input[type="datetime-local"],
  16 input[type="email"],
  17 input[type="month"],
  18 input[type="number"],
  19 input[type="password"],
  20 input[type="search"],
  21 input[type="radio"],
  22 input[type="tel"],
  23 input[type="text"],
  24 input[type="time"],
  25 input[type="url"],
  26 input[type="week"],
  27 select,
  28 textarea {
  29         border: 1px solid #ddd;
  30         -webkit-box-shadow: inset 0 1px 2px rgba( 0, 0, 0, 0.07 );
  31         box-shadow: inset 0 1px 2px rgba( 0, 0, 0, 0.07 );
  32         background-color: #fff;
  33         color: #333;
  34         outline: none;
  35         -webkit-transition: 0.05s border-color ease-in-out;
  36         transition: 0.05s border-color ease-in-out;
  37 }
  38
  39 input[type="text"]:focus,
  40 input[type="password"]:focus,
  41 input[type="color"]:focus,
  42 input[type="date"]:focus,
  43 input[type="datetime"]:focus,
  44 input[type="datetime-local"]:focus,
  45 input[type="email"]:focus,
  46 input[type="month"]:focus,
  47 input[type="number"]:focus,
  48 input[type="password"]:focus,
  49 input[type="search"]:focus,
  50 input[type="tel"]:focus,
  51 input[type="text"]:focus,
  52 input[type="time"]:focus,
  53 input[type="url"]:focus,
  54 input[type="week"]:focus,
  55 input[type="checkbox"]:focus,
  56 input[type="radio"]:focus,
  57 select:focus,
  58 textarea:focus {
  59         border-color: #5b9dd9;
  60         -webkit-box-shadow: 0 0 2px rgba( 30, 140, 190, 0.8 );
  61         box-shadow: 0 0 2px rgba( 30, 140, 190, 0.8 );
  62 }
  63
  64 /* @noflip */
  65 input[type="email"],
  66 input[type="url"] {
  67         direction: ltr;
  68 }
  69
  70 input[type="checkbox"],
  71 input[type="radio"] {
  72         border: 1px solid #bbb;
  73         background: #fff;
  74         color: #555;
  75         clear: none;
  76         cursor: pointer;
  77         display: inline-block;
  78         line-height: 0;
  79         height: 16px;
  80         margin: -4px 0 0 4px;
  81         outline: 0;
  82         padding: 0 !important;
  83         text-align: center;
  84         vertical-align: middle;
  85         width: 16px;
  86         min-width: 16px;
  87         -webkit-appearance: none;
  88         -webkit-box-shadow: inset 0 1px 2px rgba( 0, 0, 0, 0.1 );
  89         box-shadow: inset 0 1px 2px rgba( 0, 0, 0, 0.1 );
  90         -webkit-transition: .05s border-color ease-in-out;
  91         transition: .05s border-color ease-in-out;
  92 }
  93
  94 input[type="radio"]:checked + label:before {
  95         color: #888;
  96 }
  97
  98 .wp-core-ui input[type="reset"]:hover,
  99 .wp-core-ui input[type="reset"]:active {
 100         color: #2ea2cc;
 101 }
 102
 103 td > input[type="checkbox"],
 104 .wp-admin p input[type="checkbox"],
 105 .wp-admin p input[type="radio"] {
 106         margin-top: 0;
 107 }
 108
 109 .wp-admin p label input[type="checkbox"] {
 110         margin-top: -4px;
 111 }
 112
 113 .wp-admin p label input[type="radio"] {
 114         margin-top: -2px;
 115 }
 116
 117 input[type="radio"] {
 118         -webkit-border-radius: 50%;
 119         border-radius: 50%;
 120         margin-left: 4px;
 121         line-height: 10px;
 122 }
 123
 124 input[type="checkbox"]:checked:before,
 125 input[type="radio"]:checked:before {
 126         float: right;
 127         display: inline-block;
 128         vertical-align: middle;
 129         width: 16px;
 130         font: normal 21px/1 'dashicons';
 131         speak: none;
 132         -webkit-font-smoothing: antialiased;
 133         -moz-osx-font-smoothing: grayscale;
 134 }
 135
 136 input[type="checkbox"]:checked:before {
 137         content: '\f147';
 138         margin: -3px -4px 0 0;
 139         color: #1e8cbe;
 140 }
 141
 142 input[type="radio"]:checked:before {
 143         content: '\2022';
 144         text-indent: -9999px;
 145         -webkit-border-radius: 50px;
 146         border-radius: 50px;
 147         font-size: 24px;
 148         width: 6px;
 149         height: 6px;
 150         margin: 4px;
 151         line-height: 16px;
 152         background-color: #1e8cbe;
 153 }
 154
 155 @-moz-document url-prefix() {
 156         input[type="checkbox"],
 157         input[type="radio"],
 158         .form-table input.tog {
 159                 margin-bottom: -1px;
 160         }
 161 }
 162
 163 /* Search */
 164 input[type="search"] {
 165         -webkit-appearance: textfield;
 166 }
 167
 168 input[type="search"]::-webkit-search-decoration {
 169         display: none;
 170 }
 171
 172 .ie8 input[type="password"] {
 173         font-family: sans-serif;
 174 }
 175
 176 textarea,
 177 input,
 178 select,
 179 button {
 180         font-family: inherit;
 181         font-size: inherit;
 182         font-weight: inherit;
 183 }
 184
 185 textarea,
 186 input,
 187 select {
 188         font-size: 14px;
 189         padding: 3px 5px;
 190         -webkit-border-radius: 0;
 191         border-radius: 0; /* Reset mobile webkit's default element styling */
 192 }
 193
 194 textarea {
 195         overflow: auto;
 196         padding: 2px 6px;
 197         line-height: 1.4;
 198 }
 199
 200 .wp-admin input[type="file"] {
 201         padding: 3px 0;
 202 }
 203
 204 label {
 205         cursor: pointer;
 206 }
 207
 208 input,
 209 select {
 210         margin: 1px;
 211         padding: 3px 5px;
 212 }
 213
 214 input.code {
 215         padding-top: 6px;
 216 }
 217
 218 textarea.code {
 219         line-height: 1.4;
 220         padding: 4px 6px 1px 6px;
 221 }
 222
 223 input.readonly,
 224 input[readonly],
 225 textarea.readonly,
 226 textarea[readonly] {
 227         background-color: #eee;
 228 }
 229
 230 :-moz-placeholder,
 231 .wp-core-ui :-moz-placeholder {
 232    color: #a9a9a9;
 233 }
 234
 235 .form-invalid {
 236         background-color: #ffebe8 !important;
 237 }
 238
 239 .form-invalid input,
 240 .form-invalid select {
 241         border-color: #c00 !important;
 242 }
 243
 244 .form-input-tip {
 245         color: #666;
 246 }
 247
 248 input:disabled,
 249 input.disabled,
 250 select:disabled,
 251 select.disabled,
 252 textarea:disabled,
 253 textarea.disabled {
 254         background: rgba( 255, 255, 255, 0.5 );
 255         border-color: rgba( 222, 222, 222, 0.75 );
 256         -webkit-box-shadow: inset 0 1px 2px rgba( 0, 0, 0, 0.04 );
 257         box-shadow: inset 0 1px 2px rgba( 0, 0, 0, 0.04 );
 258         color: rgba( 51, 51, 51, 0.5 );
 259 }
 260
 261 input[type="file"]:disabled,
 262 input[type="file"].disabled,
 263 input[type="range"]:disabled,
 264 input[type="range"].disabled {
 265         background: none;
 266         -webkit-box-shadow: none;
 267         box-shadow: none;
 268 }
 269
 270 input[type="checkbox"]:disabled,
 271 input[type="checkbox"].disabled,
 272 input[type="radio"]:disabled,
 273 input[type="radio"].disabled,
 274 input[type="checkbox"]:disabled:checked:before,
 275 input[type="checkbox"].disabled:checked:before,
 276 input[type="radio"]:disabled:checked:before,
 277 input[type="radio"].disabled:checked:before {
 278         opacity: 0.7;
 279 }
 280
 281 /*------------------------------------------------------------------------------
 282   2.0 - Forms
 283 ------------------------------------------------------------------------------*/
 284
 285
 286 .wp-admin select {
 287         padding: 2px;
 288         line-height: 28px;
 289         height: 28px;
 290         vertical-align: middle;
 291 }
 292
 293 .wp-admin .button-cancel {
 294         padding: 0 5px;
 295         line-height: 2;
 296 }
 297
 298 .meta-box-sortables select {
 299         max-width: 100%;
 300 }
 301
 302 .wp-admin select[multiple] {
 303         height: auto;
 304 }
 305
 306 .submit {
 307         padding: 1.5em 0;
 308         margin: 5px 0;
 309         -webkit-border-bottom-right-radius: 3px;
 310         border-bottom-right-radius: 3px;
 311         -webkit-border-bottom-left-radius: 3px;
 312         border-bottom-left-radius: 3px;
 313         border: none;
 314 }
 315
 316 form p.submit a.cancel:hover {
 317         text-decoration: none;
 318 }
 319
 320 p.submit {
 321         text-align: right;
 322         max-width: 100%;
 323         margin-top: 20px;
 324         padding-top: 10px;
 325 }
 326
 327 .textright p.submit {
 328         border: none;
 329         text-align: left;
 330 }
 331
 332 table.form-table + p.submit,
 333 table.form-table + input + p.submit,
 334 table.form-table + input + input + p.submit {
 335         border-top: none;
 336         padding-top: 0;
 337 }
 338
 339 #minor-publishing-actions input,
 340 #major-publishing-actions input,
 341 #minor-publishing-actions .preview {
 342         text-align: center;
 343 }
 344
 345 textarea.all-options,
 346 input.all-options {
 347         width: 250px;
 348 }
 349
 350 input.large-text,
 351 textarea.large-text {
 352         width: 99%;
 353 }
 354
 355 input.regular-text,
 356 #adduser .form-field input {
 357         width: 25em;
 358 }
 359
 360 input.small-text {
 361         width: 50px;
 362         padding: 1px 6px;
 363 }
 364
 365 input[type="number"].small-text {
 366         width: 65px;
 367 }
 368
 369 #doaction,
 370 #doaction2,
 371 #post-query-submit {
 372         margin: 1px 0 0 8px;
 373 }
 374
 375 .tablenav #changeit,
 376 .tablenav #delete_all,
 377 .tablenav #clear-recent-list,
 378 .wp-filter #delete_all {
 379         margin-top: 1px;
 380 }
 381
 382 .tablenav .actions select {
 383         float: right;
 384         margin-left: 6px;
 385         max-width: 200px;
 386 }
 387
 388 .ie8 .tablenav .actions select {
 389         width: 155px;
 390 }
 391
 392 .ie8 .tablenav .actions select#cat {
 393         width: 200px;
 394 }
 395
 396 #timezone_string option {
 397         margin-right: 1em;
 398 }
 399
 400 #upload-form label {
 401         color: #777;
 402 }
 403
 404 label,
 405 #your-profile label + a {
 406         vertical-align: middle;
 407 }
 408
 409 fieldset label,
 410 #your-profile label + a {
 411         vertical-align: middle;
 412 }
 413
 414 .options-media-php label[for*="_size_"],
 415 #misc-publishing-actions label {
 416         vertical-align: baseline;
 417 }
 418
 419 #misc-publishing-actions label[for="post_status"]:before {
 420         content: '\f173';
 421         display: inline-block;
 422         font: normal 20px/1 'dashicons';
 423         speak: none;
 424         right: -1px;
 425         padding: 0 0 0 5px;
 426         position: relative;
 427         top: 0;
 428         text-decoration: none !important;
 429         vertical-align: top;
 430         -webkit-font-smoothing: antialiased;
 431         -moz-osx-font-smoothing: grayscale;
 432 }
 433
 434 #pass-strength-result {
 435         background-color: #eee;
 436         border: 1px solid #ddd;
 437         float: right;
 438         margin: 13px 1px 5px 5px;
 439         padding: 3px 5px;
 440         text-align: center;
 441         width: 200px;
 442         display: none;
 443 }
 444
 445 #pass-strength-result.short {
 446         background-color: #ffa0a0;
 447         border-color: #f04040;
 448 }
 449
 450 #pass-strength-result.bad {
 451         background-color: #ffb78c;
 452         border-color: #ff853c;
 453 }
 454
 455 #pass-strength-result.good {
 456         background-color: #ffec8b;
 457         border-color: #fc0;
 458 }
 459
 460 #pass-strength-result.strong {
 461         background-color: #c3ff88;
 462         border-color: #8dff1c;
 463 }
 464
 465 .indicator-hint {
 466         padding-top: 8px;
 467 }
 468
 469 p.search-box {
 470         float: left;
 471         margin: 0;
 472 }
 473
 474 .network-admin.themes-php p.search-box {
 475         clear: right;
 476 }
 477
 478 .search-box input[name="s"],
 479 .tablenav .search-plugins input[name="s"],
 480 .tagsdiv .newtag {
 481         float: right;
 482         height: 28px;
 483         margin: 0 0 0 4px;
 484 }
 485
 486 input[type="text"].ui-autocomplete-loading {
 487         background: transparent url(../images/loading.gif) no-repeat left center;
 488         visibility: visible;
 489 }
 490
 491 ul#add-to-blog-users {
 492         margin: 0 14px 0 0;
 493 }
 494
 495 .ui-autocomplete-input.open {
 496         -webkit-border-bottom-left-radius: 0;
 497         border-bottom-left-radius: 0;
 498         -webkit-border-bottom-right-radius: 0;
 499         border-bottom-right-radius: 0;
 500 }
 501
 502 .ui-autocomplete {
 503         padding: 0;
 504         margin: 0;
 505         list-style: none;
 506         position: absolute;
 507         z-index: 10000;
 508         -webkit-border-bottom-left-radius: 3px;
 509         border-bottom-left-radius: 3px;
 510         -webkit-border-bottom-right-radius: 3px;
 511         border-bottom-right-radius: 3px;
 512         border: 1px solid #aaa;
 513         background-color: #efefef;
 514 }
 515
 516 .ui-autocomplete li {
 517         margin-bottom: 0;
 518         white-space: nowrap;
 519         text-align: right;
 520 }
 521
 522 .ui-autocomplete li a {
 523         display: block;
 524         height: 100%;
 525         padding: 4px 10px;
 526         color: #444;
 527 }
 528
 529 .ui-autocomplete li a.ui-state-focus {
 530         background-color: #ddd;
 531         cursor: pointer;
 532 }
 533
 534 /*------------------------------------------------------------------------------
 535   15.0 - Comments Screen
 536 ------------------------------------------------------------------------------*/
 537
 538 .form-table {
 539         border-collapse: collapse;
 540         margin-top: 0.5em;
 541         width: 100%;
 542         clear: both;
 543 }
 544
 545 .form-table,
 546 .form-table td,
 547 .form-table th,
 548 .form-table td p,
 549 .form-wrap label {
 550         font-size: 14px;
 551 }
 552
 553 .form-table td {
 554         margin-bottom: 9px;
 555         padding: 15px 10px;
 556         line-height: 1.3;
 557         vertical-align: middle;
 558 }
 559
 560 .form-table th,
 561 .form-wrap label {
 562         color: #222;
 563         font-weight: normal;
 564         text-shadow: none;
 565         vertical-align: baseline;
 566 }
 567
 568 .form-table th {
 569         vertical-align: top;
 570         text-align: right;
 571         padding: 20px 0 20px 10px;
 572         width: 200px;
 573         line-height: 1.3;
 574         font-weight: 600;
 575 }
 576
 577 .form-table th.th-full {
 578         width: auto;
 579         font-weight: 400;
 580 }
 581
 582 .form-table td p {
 583         margin-top: 4px;
 584         margin-bottom: 0;
 585 }
 586
 587 .form-table td fieldset label {
 588         margin: 0.25em 0 0.5em !important;
 589         display: inline-block;
 590 }
 591
 592 .form-table td fieldset label,
 593 .form-table td fieldset p,
 594 .form-table td fieldset li {
 595         line-height: 1.4em;
 596 }
 597
 598 .form-table input.tog,
 599 .form-table input[type="radio"] {
 600         margin-top: -4px;
 601         margin-left: 4px;
 602         float: none;
 603 }
 604
 605 .form-table .pre {
 606         padding: 8px;
 607         margin: 0;
 608 }
 609
 610 table.form-table td .updated {
 611         font-size: 13px;
 612 }
 613
 614 table.form-table td .updated p {
 615         font-size: 13px;
 616         margin: 0.3em 0;
 617 }
 618
 619 /*------------------------------------------------------------------------------
 620   18.0 - Users
 621 ------------------------------------------------------------------------------*/
 622
 623 #profile-page .form-table textarea {
 624         width: 500px;
 625         margin-bottom: 6px;
 626 }
 627
 628 #profile-page .form-table #rich_editing {
 629         margin-left: 5px
 630 }
 631
 632 #your-profile legend {
 633         font-size: 22px;
 634 }
 635
 636 #display_name {
 637         width: 15em;
 638 }
 639
 640 #createuser .form-field input {
 641         width: 25em;
 642 }
 643
 644 .color-option {
 645         display: inline-block;
 646         width: 24%;
 647         padding: 5px 15px 15px;
 648         -webkit-box-sizing: border-box;
 649         -moz-box-sizing: border-box;
 650         box-sizing: border-box;
 651         margin-bottom: 3px;
 652 }
 653
 654 .color-option:hover,
 655 .color-option.selected {
 656         background: #ddd;
 657 }
 658
 659 .color-palette {
 660         width: 100%;
 661         border-spacing: 0;
 662         border-collapse: collapse;
 663 }
 664 .color-palette td {
 665         height: 20px;
 666         padding: 0;
 667         border: none;
 668 }
 669
 670 .color-option {
 671         cursor: pointer;
 672 }
 673
 674 /*------------------------------------------------------------------------------
 675   19.0 - Tools
 676 ------------------------------------------------------------------------------*/
 677
 678 .tool-box .title {
 679         margin: 8px 0;
 680         font-size: 18px;
 681         font-weight: normal;
 682         line-height: 24px;
 683 }
 684
 685 .pressthis {
 686         margin: 20px 0;
 687 }
 688
 689 .pressthis a,
 690 .pressthis a:hover,
 691 .pressthis a:focus,
 692 .pressthis a:active {
 693         display: inline-block;
 694         position: relative;
 695         cursor: move;
 696         color: #333;
 697         background: #e6e6e6;
 698         -webkit-border-radius: 5px;
 699         border-radius: 5px;
 700         border: 1px solid #b4b4b4;
 701         font-style: normal;
 702         line-height: 16px;
 703         font-size: 14px;
 704         text-decoration: none;
 705 }
 706
 707 .pressthis a:active {
 708         outline: none;
 709 }
 710
 711 .pressthis a:hover:after {
 712         -webkit-transform: skew(20deg) rotate(9deg);
 713         -ms-transform: skew(20deg) rotate(9deg);
 714         transform: skew(20deg) rotate(9deg);
 715         -webkit-box-shadow: 0 10px 8px rgba(0, 0, 0, 0.7);
 716         box-shadow: 0 10px 8px rgba(0, 0, 0, 0.7);
 717 }
 718
 719 .pressthis a span {
 720         display: inline-block;
 721         margin: 0px 0 0;
 722         padding: 0px 9px 8px 12px;
 723 }
 724
 725 .pressthis a span:before {
 726         color: #777;
 727         font: normal 20px/1 'dashicons';
 728         content:'\f157';
 729         position: relative;
 730         display: inline-block;
 731         top: 4px;
 732         margin-left: 4px;
 733 }
 734
 735 .pressthis a:after {
 736         content: '';
 737         width: 70%;
 738         height: 55%;
 739         z-index: -1;
 740         position: absolute;
 741         left: 10px;
 742         bottom: 9px;
 743         background: transparent;
 744         -webkit-transform: skew(20deg) rotate(6deg);
 745         -ms-transform: skew(20deg) rotate(6deg);
 746         transform: skew(20deg) rotate(6deg);
 747         -webkit-box-shadow: 0 10px 8px rgba(0, 0, 0, 0.6);
 748         box-shadow: 0 10px 8px rgba(0, 0, 0, 0.6);
 749 }
 750
 751 /*------------------------------------------------------------------------------
 752   20.0 - Settings
 753 ------------------------------------------------------------------------------*/
 754
 755 #utc-time, #local-time {
 756         padding-right: 25px;
 757         font-style: italic;
 758 }
 759
 760 .defaultavatarpicker .avatar {
 761         margin: 2px 0;
 762         vertical-align: middle;
 763 }
 764
 765 .options-general-php .spinner {
 766         float: none;
 767         margin: -3px 3px;
 768 }
 769
 770 .settings-php .language-install-spinner,
 771 .options-general-php .language-install-spinner {
 772         display: inline-block;
 773         float: none;
 774         margin: -3px 5px 0;
 775         vertical-align: middle;
 776 }
 777
 778 /*------------------------------------------------------------------------------
 779   21.0 - Network Admin
 780 ------------------------------------------------------------------------------*/
 781
 782 .form-field #site-address {
 783         max-width: 25em;
 784 }
 785
 786 .form-field #domain {
 787         max-width: 22em;
 788 }
 789
 790 .form-field #site-title,
 791 .form-field #admin-email,
 792 .form-field #path,
 793 .form-field #blog_registered,
 794 .form-field #blog_last_updated {
 795         max-width: 25em;
 796 }
 797
 798 .form-field #path {
 799         margin-bottom: 5px;
 800 }
 801
 802 /* =Media Queries
 803 -------------------------------------------------------------- */
 804
 805 @media screen and ( max-width: 782px ) {
 806         /* Input Elements */
 807         textarea {
 808                 -webkit-appearance: none;
 809         }
 810
 811         input[type="text"],
 812         input[type="email"],
 813         input[type="search"],
 814         input[type="password"],
 815         input[type="number"] {
 816                 -webkit-appearance: none;
 817                 padding: 6px 10px;
 818         }
 819
 820         input.code {
 821                 padding-bottom: 5px;
 822                 padding-top: 10px;
 823         }
 824
 825         input[type="checkbox"], .widefat th input[type="checkbox"] {
 826                 -webkit-appearance: none;
 827                 padding: 10px;
 828         }
 829
 830         .widefat th input[type="checkbox"] {
 831                 margin-bottom: 8px;
 832         }
 833
 834         input[type="checkbox"]:checked:before, .widefat th input[type="checkbox"]:before {
 835                 font: normal 30px/1 'Dashicons';
 836                 margin: -3px -5px;
 837         }
 838
 839         input[type="radio"],
 840         input[type="checkbox"] {
 841                 height: 25px;
 842                 width: 25px;
 843         }
 844
 845         .wp-admin p input[type="checkbox"],
 846         .wp-admin p input[type="radio"] {
 847                 margin-top: -3px;
 848         }
 849
 850         input[type="radio"]:checked:before {
 851                 vertical-align: middle;
 852                 width: 9px;
 853                 height: 9px;
 854                 margin: 7px;
 855                 line-height: 16px;
 856         }
 857
 858         .wp-upload-form input[type="submit"] {
 859                 margin-top: 10px;
 860         }
 861
 862         #wpbody select {
 863                 height: 36px;
 864                 font-size: 16px;
 865         }
 866
 867         .wp-admin .button-cancel {
 868                 padding: 0;
 869                 font-size: 14px;
 870         }
 871
 872         #createuser .form-field input {
 873                 width: 100%;
 874         }
 875
 876         .form-table {
 877                 -webkit-box-sizing: border-box;
 878                 -moz-box-sizing: border-box;
 879                 box-sizing: border-box;
 880         }
 881
 882         .form-table th,
 883         .form-table td {
 884                 display: block;
 885                 width: auto;
 886                 vertical-align: middle;
 887         }
 888
 889         .form-table .color-palette td {
 890                 display: table-cell;
 891                 width: 15px;
 892         }
 893
 894         .form-table table.color-palette {
 895                 margin-left: 10px;
 896         }
 897
 898         textarea,
 899         input {
 900                 font-size: 16px;
 901         }
 902
 903         .form-table td input[type="text"],
 904         .form-table td input[type="email"],
 905         .form-table td input[type="password"],
 906         .form-table td select,
 907         .form-table td textarea,
 908         .form-table span.description,
 909         #profile-page .form-table textarea {
 910                 width: 100%;
 911                 font-size: 16px;
 912                 line-height: 1.5;
 913                 padding: 7px 10px;
 914                 display: block;
 915                 max-width: none;
 916                 -webkit-box-sizing: border-box;
 917                 -moz-box-sizing: border-box;
 918                 box-sizing: border-box;
 919         }
 920
 921         #wpbody .form-table td select {
 922                 height: 40px;
 923         }
 924
 925         input[type="text"].small-text,
 926         input[type="search"].small-text,
 927         input[type="password"].small-text,
 928         input[type="number"].small-text,
 929         input[type="number"].small-text,
 930         .form-table input[type="text"].small-text {
 931                 width: auto;
 932                 max-width: 55px;
 933                 display: inline;
 934                 padding: 3px 6px;
 935                 margin: 0 3px;
 936         }
 937
 938         #pass-strength-result {
 939                 width: 100%;
 940                 -webkit-box-sizing: border-box;
 941                 -moz-box-sizing: border-box;
 942                 box-sizing: border-box;
 943                 padding: 8px;
 944         }
 945
 946         p.search-box {
 947                 float: none;
 948                 position: absolute;
 949                 bottom: 0;
 950                 width: 98%;
 951                 height: 90px;
 952                 margin-bottom: 20px;
 953         }
 954
 955         p.search-box input[name="s"] {
 956                 height: auto;
 957                 float: none;
 958                 width: 100%;
 959                 margin-bottom: 10px;
 960                 vertical-align: middle;
 961                 -webkit-appearance: none;
 962         }
 963
 964         p.search-box input[type="submit"] {
 965                 margin-bottom: 10px;
 966         }
 967
 968         .form-table span.description {
 969                 padding: 4px 0 0;
 970                 line-height: 1.4em;
 971         }
 972
 973         .form-table th {
 974                 padding-top: 10px;
 975                 padding-bottom: 0;
 976                 border-bottom: 0;
 977         }
 978
 979         .form-table td {
 980                 padding-top: 8px;
 981                 padding-right: 0;
 982         }
 983
 984         .form-table input.regular-text {
 985                 width: 100%;
 986         }
 987
 988         .form-table label {
 989                 font-size: 14px;
 990         }
 991
 992         .form-table fieldset label {
 993                 display: block;
 994         }
 995
 996         #utc-time {
 997                 margin-top: 10px;
 998         }
 999
1000         #utc-time,
1001         #local-time {
1002                 display: block;
1003                 float: none;
1004                 padding: 0;
1005                 line-height: 2;
1006         }
1007
1008         .form-field #domain {
1009                 max-width: none;
1010         }
1011 }
1012
1013 @media only screen and (max-width: 768px) {
1014         .form-field input[type="text"],
1015         .form-field input[type="email"],
1016         .form-field input[type="password"],
1017         .form-field select,
1018         .form-field textarea {
1019                 width: 99%;
1020         }
1021
1022         .form-wrap .form-field {
1023                 padding:0;
1024         }
1025
1026         /* users */
1027         #profile-page .form-table textarea {
1028                 max-width: 400px;
1029                 width: auto;
1030         }
1031 }
1032
1033 /* Smartphone */
1034 @media screen and (max-width: 600px) {
1035         /* Color Picker Options */
1036         .color-option {
1037                 width: 49%;
1038         }
1039 }
1040