[ Index ]

WordPress 5.4.1

[ Index ]     [ Classes ]     [ Functions ]     [ Variables ]     [ Constants ]     [ Statistics ]    

title

Body

[close]

/wp-admin/css/ -> themes-rtl.css (source)

   1  /*! This file is auto-generated */
   2  /*------------------------------------------------------------------------------
   3    16.0 - Themes
   4  ------------------------------------------------------------------------------*/
   5  
   6  
   7  /*------------------------------------------------------------------------------
   8    16.1 - Manage Themes
   9  ------------------------------------------------------------------------------*/
  10  
  11  body.js .theme-browser.search-loading {
  12      display: none;
  13  }
  14  
  15  .theme-browser .themes {
  16      clear: both;
  17  }
  18  
  19  .themes-php:not(.network-admin) .wrap h1 {
  20      margin-bottom: 15px;
  21  }
  22  
  23  .themes-php .wrap h1 .button {
  24      margin-right: 20px;
  25  }
  26  
  27  /* Search form */
  28  .themes-php .search-form {
  29      display: inline;
  30  }
  31  
  32  .themes-php .wp-filter-search {
  33      position: relative;
  34      top: -2px;
  35      right: 20px;
  36      margin: 0;
  37      width: 280px;
  38  }
  39  
  40  /* Position admin messages */
  41  .theme .notice,
  42  .theme .notice.is-dismissible {
  43      right: 0;
  44      margin: 0;
  45      position: absolute;
  46      left: 0;
  47      top: 0;
  48  }
  49  
  50  /**
  51   * Main theme element
  52   * (has flexible margins)
  53   */
  54  .theme-browser .theme {
  55      cursor: pointer;
  56      float: right;
  57      margin: 0 0 4% 4%;
  58      position: relative;
  59      width: 30.6%;
  60      border: 1px solid #ddd;
  61      box-shadow: 0 1px 1px -1px rgba(0, 0, 0, 0.1);
  62      box-sizing: border-box;
  63  }
  64  
  65  .ie8 .theme-browser .theme {
  66      width: 30%;
  67      margin: 0 0 4% 3%;
  68  }
  69  
  70  .theme-browser .theme:nth-child(3n) {
  71      margin-left: 0;
  72  }
  73  
  74  .theme-browser .theme:hover,
  75  .theme-browser .theme:focus {
  76      cursor: pointer;
  77  }
  78  
  79  .theme-browser .theme .theme-name {
  80      font-size: 15px;
  81      font-weight: 600;
  82      height: 18px;
  83      margin: 0;
  84      padding: 15px;
  85      box-shadow: inset 0 1px 0 rgba(0, 0, 0, 0.1);
  86      overflow: hidden;
  87      white-space: nowrap;
  88      text-overflow: ellipsis;
  89      background: #fff;
  90      background: rgba(255, 255, 255, 0.65);
  91  }
  92  
  93  /* Activate and Customize buttons, shown on hover and focus */
  94  .theme-browser .theme .theme-actions {
  95      -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  96      opacity: 0;
  97      transition: opacity 0.1s ease-in-out;
  98      height: auto;
  99      background: rgba(244, 244, 244, 0.7);
 100      border-right: 1px solid rgba(0, 0, 0, 0.05);
 101  }
 102  
 103  .theme-browser .theme:hover .theme-actions,
 104  .theme-browser .theme.focus .theme-actions,
 105  .theme-browser .theme:focus .theme-actions {
 106      -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
 107      opacity: 1;
 108  }
 109  
 110  .theme-browser .theme .theme-actions .button-primary {
 111      margin-left: 3px;
 112  }
 113  
 114  .theme-browser .theme .theme-actions .button {
 115      float: none;
 116      margin-right: 3px;
 117  }
 118  
 119  /**
 120   * Theme Screenshot
 121   *
 122   * Has a fixed aspect ratio of 1.5 to 1 regardless of screenshot size
 123   * It is also responsive.
 124   */
 125  .theme-browser .theme .theme-screenshot {
 126      display: block;
 127      overflow: hidden;
 128      position: relative;
 129      -webkit-backface-visibility: hidden; /* Prevents flicker of the screenshot on hover. */
 130      transition: opacity 0.2s ease-in-out;
 131  }
 132  
 133  .theme-browser .theme .theme-screenshot:after {
 134      content: "";
 135      display: block;
 136      padding-top: 66.66666%; /* using a 3/2 aspect ratio */
 137  }
 138  
 139  .theme-browser .theme .theme-screenshot img {
 140      height: auto;
 141      position: absolute;
 142      right: 0;
 143      top: 0;
 144      width: 100%;
 145      transition: opacity 0.2s ease-in-out;
 146  }
 147  
 148  .theme-browser .theme:hover .theme-screenshot,
 149  .theme-browser .theme:focus .theme-screenshot {
 150      background: #fff;
 151  }
 152  
 153  .theme-browser.rendered .theme:hover .theme-screenshot img,
 154  .theme-browser.rendered .theme:focus .theme-screenshot img {
 155      opacity: 0.4;
 156  }
 157  
 158  .theme-browser .theme .more-details {
 159      -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
 160      opacity: 0;
 161      position: absolute;
 162      top: 35%;
 163      left: 20%;
 164      right: 20%;
 165      background: #23282d;
 166      background: rgba(0, 0, 0, 0.7);
 167      color: #fff;
 168      font-size: 15px;
 169      text-shadow: 0 1px 0 rgba(0, 0, 0, 0.6);
 170      -webkit-font-smoothing: antialiased;
 171      font-weight: 600;
 172      padding: 15px 12px;
 173      text-align: center;
 174      border-radius: 3px;
 175      transition: opacity 0.1s ease-in-out;
 176  }
 177  
 178  .theme-browser .theme:focus {
 179      border-color: #5b9dd9;
 180      box-shadow: 0 0 2px rgba(30, 140, 190, 0.8);
 181  }
 182  
 183  .theme-browser .theme:focus .more-details {
 184      opacity: 1;
 185  }
 186  
 187  /* Current theme needs to have its action always on view */
 188  .theme-browser .theme.active:focus .theme-actions {
 189      display: block;
 190  }
 191  
 192  .theme-browser.rendered .theme:hover .more-details,
 193  .theme-browser.rendered .theme:focus .more-details {
 194      -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
 195      opacity: 1;
 196  }
 197  
 198  /**
 199   * The currently active theme
 200   */
 201  .theme-browser .theme.active .theme-name {
 202      background: #23282d;
 203      color: #fff;
 204      padding-left: 110px;
 205      font-weight: 300;
 206      box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.5);
 207  }
 208  
 209  .theme-browser .customize-control .theme.active .theme-name {
 210      padding-left: 15px;
 211  }
 212  
 213  .theme-browser .theme.active .theme-name span {
 214      font-weight: 600;
 215  }
 216  
 217  .theme-browser .theme.active .theme-actions {
 218      background: rgba(49, 49, 49, 0.7);
 219      border-right: none;
 220      opacity: 1;
 221  }
 222  
 223  .theme-id-container {
 224      position: relative;
 225  }
 226  
 227  .theme-browser .theme.active .theme-actions,
 228  .theme-browser .theme .theme-actions {
 229      position: absolute;
 230      top: 50%;
 231      transform: translateY(-50%);
 232      left: 0;
 233      padding: 9px 15px;
 234      box-shadow: inset 0 1px 0 rgba(0, 0, 0, 0.1);
 235  }
 236  
 237  .theme-browser .theme.active .theme-actions .button-primary {
 238      margin-left: 0;
 239  }
 240  
 241  .theme-browser .theme .theme-author {
 242      background: #23282d;
 243      color: #eee;
 244      display: none;
 245      font-size: 14px;
 246      margin: 0 10px;
 247      padding: 5px 10px;
 248      position: absolute;
 249      bottom: 56px;
 250  }
 251  
 252  .theme-browser .theme.display-author .theme-author {
 253      display: block;
 254  }
 255  
 256  .theme-browser .theme.display-author .theme-author a {
 257      color: inherit;
 258      text-decoration: none;
 259  }
 260  
 261  /**
 262   * Add new theme
 263   */
 264  .theme-browser .theme.add-new-theme {
 265      border: none;
 266      box-shadow: none;
 267  }
 268  
 269  .theme-browser .theme.add-new-theme a {
 270      text-decoration: none;
 271      display: block;
 272      position: relative;
 273      z-index: 1;
 274  }
 275  
 276  .theme-browser .theme.add-new-theme a:after {
 277      display: block;
 278      content: "";
 279      background: transparent;
 280      background: rgba(0, 0, 0, 0);
 281      position: absolute;
 282      top: 0;
 283      right: 0;
 284      left: 0;
 285      bottom: 0;
 286      padding: 0;
 287      text-shadow: none;
 288      border: 5px dashed #d5d2ca;
 289      border: 5px dashed rgba(0, 0, 0, 0.1);
 290      box-sizing: border-box;
 291  }
 292  
 293  .theme-browser .theme.add-new-theme span:after {
 294      background: #e5e5e5;
 295      background: rgba(153, 153, 153, 0.1);
 296      border-radius: 50%;
 297      display: inline-block;
 298      content: "\f132";
 299      -webkit-font-smoothing: antialiased;
 300      font: normal 74px/115px dashicons;
 301      width: 100px;
 302      height: 100px;
 303      vertical-align: middle;
 304      text-align: center;
 305      color: rgb(153, 153, 153);
 306      position: absolute;
 307      top: 30%;
 308      right: 50%;
 309      margin-right: -50px;
 310      text-indent: -4px;
 311      padding: 0;
 312      text-shadow: none;
 313      z-index: 4;
 314  }
 315  
 316  .rtl .theme-browser .theme.add-new-theme span:after {
 317      text-indent: 4px;
 318  }
 319  
 320  .theme-browser .theme.add-new-theme a:hover .theme-screenshot,
 321  .theme-browser .theme.add-new-theme a:focus .theme-screenshot {
 322      background: none;
 323  }
 324  
 325  .theme-browser .theme.add-new-theme a:hover span:after,
 326  .theme-browser .theme.add-new-theme a:focus span:after {
 327      background: #fff;
 328      color: #0073aa;
 329  }
 330  
 331  .theme-browser .theme.add-new-theme a:hover:after,
 332  .theme-browser .theme.add-new-theme a:focus:after {
 333      border-color: transparent;
 334      color: #fff;
 335      background: #0073aa;
 336      content: "";
 337  }
 338  
 339  .theme-browser .theme.add-new-theme .theme-name {
 340      background: none;
 341      text-align: center;
 342      box-shadow: none;
 343      font-weight: 400;
 344      position: relative;
 345      top: 0;
 346      margin-top: -18px;
 347      padding-top: 0;
 348      padding-bottom: 48px;
 349  }
 350  
 351  .theme-browser .theme.add-new-theme a:hover .theme-name,
 352  .theme-browser .theme.add-new-theme a:focus .theme-name {
 353      color: #fff;
 354      z-index: 2;
 355  }
 356  
 357  /**
 358   * Theme Overlay
 359   * Shown when clicking a theme
 360   */
 361  .theme-overlay .theme-backdrop {
 362      position: absolute;
 363      right: -20px;
 364      left: 0;
 365      top: 0;
 366      bottom: 0;
 367      background: #f1f1f1;
 368      background: rgba(238, 238, 238, 0.9);
 369      z-index: 10000; /* Over WP Pointers. */
 370  }
 371  
 372  .theme-overlay .theme-header {
 373      position: absolute;
 374      top: 0;
 375      right: 0;
 376      left: 0;
 377      height: 48px;
 378      border-bottom: 1px solid #ddd;
 379  }
 380  
 381  .theme-overlay .theme-header button {
 382      padding: 0;
 383  }
 384  
 385  .theme-overlay .theme-header .close {
 386      cursor: pointer;
 387      height: 48px;
 388      width: 50px;
 389      text-align: center;
 390      float: left;
 391      border: 0;
 392      border-right: 1px solid #ddd;
 393      background-color: transparent;
 394      transition: color .1s ease-in-out, background .1s ease-in-out;
 395  }
 396  
 397  .theme-overlay .theme-header .close:before {
 398      font: normal 22px/50px dashicons !important;
 399      color: #72777c;
 400      display: inline-block;
 401      content: "\f335";
 402      font-weight: 300;
 403  }
 404  
 405  /* Left and right navigation */
 406  .theme-overlay .theme-header .right,
 407  .theme-overlay .theme-header .left {
 408      cursor: pointer;
 409      color: #72777c;
 410      background-color: transparent;
 411      height: 48px;
 412      width: 54px;
 413      float: right;
 414      text-align: center;
 415      border: 0;
 416      border-left: 1px solid #ddd;
 417      transition: color .1s ease-in-out, background .1s ease-in-out;
 418  }
 419  
 420  .theme-overlay .theme-header .close:focus,
 421  .theme-overlay .theme-header .close:hover,
 422  .theme-overlay .theme-header .right:focus,
 423  .theme-overlay .theme-header .right:hover,
 424  .theme-overlay .theme-header .left:focus,
 425  .theme-overlay .theme-header .left:hover {
 426      background: #ddd;
 427      border-color: #ccc;
 428      color: #000;
 429  }
 430  
 431  .theme-overlay .theme-header .close:focus:before,
 432  .theme-overlay .theme-header .close:hover:before {
 433      color: #000;
 434  }
 435  
 436  .theme-overlay .theme-header .close:focus,
 437  .theme-overlay .theme-header .right:focus,
 438  .theme-overlay .theme-header .left:focus {
 439      box-shadow: none;
 440      outline: none;
 441  }
 442  
 443  .theme-overlay .theme-header .left.disabled,
 444  .theme-overlay .theme-header .right.disabled,
 445  .theme-overlay .theme-header .left.disabled:hover,
 446  .theme-overlay .theme-header .right.disabled:hover {
 447      color: #ccc;
 448      background: inherit;
 449      cursor: inherit;
 450  }
 451  
 452  .theme-overlay .theme-header .right:before,
 453  .theme-overlay .theme-header .left:before {
 454      font: normal 20px/50px dashicons !important;
 455      display: inline;
 456      font-weight: 300;
 457  }
 458  
 459  .theme-overlay .theme-header .left:before {
 460      content: "\f345";
 461  }
 462  
 463  .theme-overlay .theme-header .right:before {
 464      content: "\f341";
 465  }
 466  
 467  .theme-overlay .theme-wrap {
 468      clear: both;
 469      position: fixed;
 470      top: 9%;
 471      right: 190px;
 472      left: 30px;
 473      bottom: 3%;
 474      background: #fff;
 475      box-shadow: 0 1px 20px 5px rgba(0, 0, 0, 0.1);
 476      z-index: 10000; /* Over WP Pointers. */
 477      box-sizing: border-box;
 478      -webkit-overflow-scrolling: touch;
 479  }
 480  
 481  body.folded .theme-browser ~ .theme-overlay .theme-wrap {
 482      right: 70px;
 483  }
 484  
 485  .theme-overlay .theme-about {
 486      position: absolute;
 487      top: 49px;
 488      bottom: 57px;
 489      right: 0;
 490      left: 0;
 491      overflow: auto;
 492      padding: 2% 4%;
 493  }
 494  
 495  .theme-overlay .theme-actions {
 496      position: absolute;
 497      text-align: center;
 498      bottom: 0;
 499      right: 0;
 500      left: 0;
 501      padding: 10px 25px 5px;
 502      background: #f3f3f3;
 503      z-index: 30;
 504      box-sizing: border-box;
 505      border-top: 1px solid #eee;
 506  }
 507  
 508  .ie8 .theme-overlay .theme-actions {
 509      border: 1px solid #eee;
 510  }
 511  
 512  .theme-overlay .theme-actions a {
 513      margin-left: 5px;
 514      margin-bottom: 5px;
 515  }
 516  
 517  /* Hide-if-customize for items we can't add classes to */
 518  .customize-support .theme-overlay .theme-actions a[href="themes.php?page=custom-header"],
 519  .customize-support .theme-overlay .theme-actions a[href="themes.php?page=custom-background"] {
 520      display: none;
 521  }
 522  
 523  .broken-themes a.delete-theme,
 524  .theme-overlay .theme-actions .delete-theme {
 525      color: #a00;
 526      text-decoration: none;
 527      border-color: transparent;
 528      box-shadow: none;
 529      background: transparent;
 530  }
 531  
 532  .theme-overlay .theme-actions .delete-theme {
 533      position: absolute;
 534      left: 10px;
 535      bottom: 5px;
 536  }
 537  
 538  .broken-themes a.delete-theme:hover,
 539  .broken-themes a.delete-theme:focus,
 540  .theme-overlay .theme-actions .delete-theme:hover,
 541  .theme-overlay .theme-actions .delete-theme:focus {
 542      background: #d54e21;
 543      color: #fff;
 544      border-color: #d54e21;
 545  }
 546  
 547  .theme-overlay .theme-actions .active-theme,
 548  .theme-overlay.active .theme-actions .inactive-theme {
 549      display: none;
 550  }
 551  
 552  .theme-overlay .theme-actions .inactive-theme,
 553  .theme-overlay.active .theme-actions .active-theme {
 554      display: block;
 555  }
 556  
 557  /**
 558   * Theme Screenshots gallery
 559   */
 560  .theme-overlay .theme-screenshots {
 561      float: right;
 562      margin: 0 0 0 30px;
 563      width: 55%;
 564      max-width: 1200px; /* Recommended theme screenshot width, set here to avoid stretching */
 565      text-align: center;
 566  }
 567  
 568  /* First screenshot, shown big */
 569  .theme-overlay .screenshot {
 570      border: 1px solid #fff;
 571      box-sizing: border-box;
 572      overflow: hidden;
 573      position: relative;
 574      box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.2);
 575  }
 576  
 577  .theme-overlay .screenshot:after {
 578      content: "";
 579      display: block;
 580      padding-top: 75%; /* using a 4/3 aspect ratio */
 581  }
 582  
 583  .theme-overlay .screenshot img {
 584      height: auto;
 585      position: absolute;
 586      right: 0;
 587      top: 0;
 588      width: 100%;
 589  }
 590  /* Handles old 300px screenshots */
 591  .theme-overlay.small-screenshot .theme-screenshots {
 592      position: absolute;
 593      width: 302px;
 594  }
 595  .theme-overlay.small-screenshot .theme-info {
 596      margin-right: 350px;
 597      width: auto;
 598  }
 599  
 600  /* Other screenshots, shown small and square */
 601  .theme-overlay .screenshot.thumb {
 602      background: #ccc;
 603      border: 1px solid #eee;
 604      float: none;
 605      display: inline-block;
 606      margin: 10px 5px 0;
 607      width: 140px;
 608      height: 80px;
 609      cursor: pointer;
 610  }
 611  
 612  .theme-overlay .screenshot.thumb:after {
 613      content: "";
 614      display: block;
 615      padding-top: 100%; /* using a 1/1 aspect ratio */
 616  }
 617  
 618  .theme-overlay .screenshot.thumb img {
 619      cursor: pointer;
 620      height: auto;
 621      position: absolute;
 622      right: 0;
 623      top: 0;
 624      width: 100%;
 625      height: auto;
 626  }
 627  
 628  .theme-overlay .screenshot.selected {
 629      background: transparent;
 630      border: 2px solid #00a0d2;
 631  }
 632  
 633  .theme-overlay .screenshot.selected img {
 634      opacity: 0.8;
 635  }
 636  
 637  /* No screenshot placeholder */
 638  .theme-browser .theme .theme-screenshot.blank,
 639  .theme-overlay .screenshot.blank {
 640      background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAYAAADED76LAAAALElEQVQYGWO8d+/efwYkoKioiMRjYGBC4WHhUK6A8T8QIJt8//59ZC493AAAQssKpBK4F5AAAAAASUVORK5CYII=);
 641  }
 642  
 643  /**
 644   * Theme heading information
 645   */
 646  .theme-overlay .theme-info {
 647      width: 40%;
 648      float: right;
 649  }
 650  
 651  .theme-overlay .current-label {
 652      background: #32373c;
 653      color: #fff;
 654      font-size: 11px;
 655      display: inline-block;
 656      padding: 2px 8px;
 657      border-radius: 2px;
 658      margin: 0 0 -10px;
 659      -webkit-user-select: none;
 660      -moz-user-select: none;
 661      -ms-user-select: none;
 662      user-select: none;
 663  }
 664  
 665  .theme-overlay .theme-name {
 666      color: #23282d;
 667      font-size: 32px;
 668      font-weight: 100;
 669      margin: 10px 0 0;
 670      line-height: 1.3;
 671      word-wrap: break-word;
 672      overflow-wrap: break-word;
 673  }
 674  
 675  .theme-overlay .theme-version {
 676      color: #72777c;
 677      font-size: 13px;
 678      font-weight: 400;
 679      float: none;
 680      display: inline-block;
 681      margin-right: 10px;
 682  }
 683  
 684  .theme-overlay .theme-author {
 685      margin: 15px 0 25px;
 686      color: #72777c;
 687      font-size: 16px;
 688      font-weight: 400;
 689      line-height: inherit;
 690  }
 691  
 692  .theme-overlay .theme-author a {
 693      text-decoration: none;
 694  }
 695  
 696  .theme-overlay .theme-description {
 697      color: #555;
 698      font-size: 15px;
 699      font-weight: 400;
 700      line-height: 1.5;
 701      margin: 30px 0 0 0;
 702  }
 703  
 704  .theme-overlay .theme-tags {
 705      border-top: 3px solid #eee;
 706      color: #82878c;
 707      font-size: 13px;
 708      font-weight: 400;
 709      margin: 30px 0 0 0;
 710      padding-top: 20px;
 711  }
 712  
 713  .theme-overlay .theme-tags span {
 714      color: #444;
 715      font-weight: 600;
 716      margin-left: 5px;
 717  }
 718  
 719  .theme-overlay .parent-theme {
 720      background: #f7fcfe;
 721      border: 1px solid #eee;
 722      border-right: 4px solid #00a0d2;
 723      font-size: 14px;
 724      font-weight: 400;
 725      margin-top: 30px;
 726      padding: 10px 20px 10px 10px;
 727  }
 728  
 729  .theme-overlay .parent-theme strong {
 730      font-weight: 600;
 731  }
 732  
 733  /**
 734   * Single Theme Mode
 735   * Displays detailed view inline when a user has no switch capabilities
 736   */
 737  .single-theme .theme-overlay .theme-backdrop,
 738  .single-theme .theme-overlay .theme-header,
 739  .single-theme .theme {
 740      display: none;
 741  }
 742  
 743  .single-theme .theme-overlay .theme-wrap {
 744      clear: both;
 745      min-height: 330px;
 746      position: relative;
 747      right: auto;
 748      left: auto;
 749      top: auto;
 750      bottom: auto;
 751      z-index: 10;
 752  }
 753  
 754  .single-theme .theme-overlay .theme-about {
 755      padding: 30px 30px 70px;
 756      position: static;
 757  }
 758  
 759  .single-theme .theme-overlay .theme-actions {
 760      position: absolute;
 761  }
 762  
 763  /**
 764   * Basic Responsive structure...
 765   *
 766   * Shuffles theme columns around based on screen width
 767   */
 768  
 769  @media only screen and (min-width: 2000px) {
 770      #wpwrap .theme-browser .theme {
 771          width: 17.6%;
 772          margin: 0 0 3% 3%;
 773      }
 774  
 775      #wpwrap .theme-browser .theme:nth-child(3n),
 776      #wpwrap .theme-browser .theme:nth-child(4n) {
 777          margin-left: 3%;
 778      }
 779  
 780      #wpwrap .theme-browser .theme:nth-child(5n) {
 781          margin-left: 0;
 782      }
 783  }
 784  
 785  @media only screen and (min-width: 1680px) {
 786      .theme-overlay .theme-wrap {
 787          width: 1450px;
 788          margin: 0 auto;
 789      }
 790  }
 791  
 792  /* Maximum screenshot width reaches 440px */
 793  @media only screen and (min-width: 1640px) {
 794      .theme-browser .theme {
 795          width: 22.7%;
 796          margin: 0 0 3% 3%;
 797      }
 798      .theme-browser .theme .theme-screenshot:after {
 799          padding-top: 75%; /* using a 4/3 aspect ratio */
 800      }
 801  
 802      .theme-browser .theme:nth-child(3n) {
 803          margin-left: 3%;
 804      }
 805  
 806      .theme-browser .theme:nth-child(4n) {
 807          margin-left: 0;
 808      }
 809  }
 810  /* Maximum screenshot width reaches 440px */
 811  @media only screen and (max-width: 1120px) {
 812      .theme-browser .theme {
 813          width: 47.5%;
 814          margin-left: 0;
 815      }
 816  
 817      .theme-browser .theme:nth-child(even) {
 818          margin-left: 0;
 819      }
 820  
 821      .theme-browser .theme:nth-child(odd) {
 822          margin-left: 5%;
 823      }
 824  }
 825  
 826  /* Admin menu is folded */
 827  @media only screen and (max-width: 960px) {
 828      .theme-overlay .theme-wrap {
 829          right: 65px;
 830      }
 831  }
 832  
 833  @media only screen and (max-width: 780px) {
 834      body.folded .theme-overlay .theme-wrap,
 835      .theme-overlay .theme-wrap {
 836          top: 0; /* The adminmenu isn't fixed on mobile, so this can use the full viewport height */
 837          left: 0;
 838          bottom: 0;
 839          right: 0;
 840          padding: 70px 20px 20px;
 841          border: none;
 842          z-index: 100000; /* should overlap #wpadminbar. */
 843          position: fixed;
 844      }
 845  
 846      .theme-browser .theme.active .theme-name span {
 847          /* Hide the "Active: " label on smaller screens. */
 848          display: none;
 849      }
 850  
 851      .theme-overlay .theme-screenshots {
 852          width: 40%;
 853      }
 854  
 855      .theme-overlay .theme-info {
 856          width: 50%;
 857      }
 858      .single-theme .theme-wrap {
 859          padding: 10px;
 860      }
 861  
 862      .theme-browser .theme .theme-actions {
 863          padding: 5px 10px 4px 10px;
 864      }
 865  
 866      .theme-overlay.small-screenshot .theme-screenshots {
 867          position: static;
 868          float: none;
 869          max-width: 302px;
 870      }
 871  
 872      .theme-overlay.small-screenshot .theme-info {
 873          margin-right: 0;
 874          width: auto;
 875      }
 876  
 877      .theme:not(.active):hover .theme-actions,
 878      .theme:not(.active):focus .theme-actions,
 879      .theme:hover .more-details,
 880      .theme:focus .more-details {
 881          display: none;
 882      }
 883  
 884      .theme-browser.rendered .theme:hover .theme-screenshot img,
 885      .theme-browser.rendered .theme:focus .theme-screenshot img {
 886          opacity: 1.0;
 887      }
 888  }
 889  
 890  @media only screen and (max-width: 480px) {
 891      .theme-browser .theme {
 892          width: 100%;
 893          margin-left: 0;
 894      }
 895  
 896      .theme-browser .theme:nth-child(2n),
 897      .theme-browser .theme:nth-child(3n) {
 898          margin-left: 0;
 899      }
 900  }
 901  
 902  @media only screen and (max-width: 650px) {
 903      .theme-overlay .theme-description {
 904          margin-right: 0;
 905      }
 906  
 907      .theme-overlay .theme-actions .delete-theme {
 908          position: relative;
 909          left: auto;
 910          bottom: auto;
 911      }
 912  
 913      .theme-overlay .theme-actions .inactive-theme {
 914          display: inline;
 915      }
 916  
 917      .theme-overlay .theme-screenshots {
 918          width: 100%;
 919          float: none;
 920      }
 921  
 922      .theme-overlay .theme-info {
 923          width: 100%;
 924      }
 925  
 926      .theme-overlay .theme-author {
 927          margin: 5px 0 15px 0;
 928      }
 929  
 930      .theme-overlay .current-label {
 931          margin-top: 10px;
 932          font-size: 13px;
 933      }
 934  
 935      .themes-php .wp-filter-search {
 936          float: none;
 937          clear: both;
 938          right: 0;
 939          left: 0;
 940          margin: -5px 0 20px 0;
 941          width: 100%;
 942          max-width: 280px;
 943      }
 944  
 945      .theme-browser .theme.add-new-theme span:after {
 946          font: normal 60px/90px dashicons;
 947          width: 80px;
 948          height: 80px;
 949          top: 30%;
 950          right: 50%;
 951          text-indent: 0;
 952          margin-right: -40px;
 953      }
 954  
 955      .single-theme .theme-wrap {
 956          margin: 0 -10px 0 -12px;
 957          padding: 10px;
 958      }
 959      .single-theme .theme-overlay .theme-about {
 960          padding: 10px;
 961          overflow: visible;
 962      }
 963      .single-theme .current-label {
 964          display: none;
 965      }
 966      .single-theme .theme-overlay .theme-actions {
 967          position: static;
 968      }
 969  }
 970  
 971  .broken-themes {
 972      clear: both;
 973  }
 974  
 975  .broken-themes table {
 976      text-align: right;
 977      width: 50%;
 978      border-spacing: 3px;
 979      padding: 3px;
 980  }
 981  
 982  
 983  /*------------------------------------------------------------------------------
 984    16.2 - Install Themes
 985  ------------------------------------------------------------------------------*/
 986  
 987  /* Already installed theme */
 988  .theme-browser .theme .theme-installed {
 989      background: #0073aa;
 990  }
 991  .theme-browser .theme .notice-success p:before {
 992      color: #79ba49;
 993      content: "\f147";
 994      display: inline-block;
 995      font: normal 20px/1 'dashicons';
 996      -webkit-font-smoothing: antialiased;
 997      -moz-osx-font-smoothing: grayscale;
 998      vertical-align: top;
 999  }
1000  
1001  .theme-install.updated-message:before {
1002      content: "";
1003  }
1004  
1005  .theme-install-php .wp-filter {
1006      padding-right: 20px;
1007  }
1008  
1009  .theme-install-php a.upload,
1010  .theme-install-php a.browse-themes {
1011      cursor: pointer;
1012  }
1013  
1014  .upload-view-toggle .browse,
1015  .plugin-install-tab-upload .upload-view-toggle .upload {
1016      display: none;
1017  }
1018  
1019  .plugin-install-tab-upload .upload-view-toggle .browse {
1020      display: inline;
1021  }
1022  
1023  .upload-theme,
1024  .upload-plugin {
1025      box-sizing: border-box;
1026      display: none;
1027      margin: 0;
1028      padding: 50px 0;
1029      width: 100%;
1030      overflow: hidden;
1031      position: relative;
1032      top: 10px;
1033  }
1034  
1035  .upload-plugin-wrap {
1036      display: none;
1037  }
1038  
1039  .show-upload-view .upload-theme,
1040  .show-upload-view .upload-plugin,
1041  .show-upload-view .upload-plugin-wrap,
1042  .plugin-install-tab-upload .upload-plugin {
1043      display: block;
1044  }
1045  
1046  .upload-theme .wp-upload-form,
1047  .upload-plugin .wp-upload-form {
1048      background: #fafafa;
1049      border: 1px solid #ccd0d4;
1050      padding: 30px;
1051      margin: 30px auto;
1052      max-width: 380px;
1053      display: flex;
1054  }
1055  
1056  .upload-theme .wp-upload-form > input[type="file"],
1057  .upload-plugin .wp-upload-form > input[type="file"] {
1058      padding: 5px 0 0 1em;
1059  }
1060  
1061  .upload-theme .install-help,
1062  .upload-plugin .install-help {
1063      color: #555d66; /* #f1f1f1 background */
1064      font-size: 18px;
1065      font-style: normal;
1066      margin: 0;
1067      padding: 0;
1068      text-align: center;
1069  }
1070  
1071  p.no-themes,
1072  p.no-themes-local {
1073      clear: both;
1074      color: #666;
1075      font-size: 18px;
1076      font-style: normal;
1077      margin: 0;
1078      padding: 100px 0;
1079      text-align: center;
1080      display: none;
1081  }
1082  
1083  .no-results p.no-themes {
1084      display: block;
1085  }
1086  
1087  .theme-install-php .add-new-theme {
1088      display: none !important;
1089  }
1090  
1091  @media only screen and (max-width: 1120px) {
1092      .upload-theme .wp-upload-form {
1093          margin: 20px 0;
1094          max-width: 100%;
1095      }
1096      .upload-theme .install-help {
1097          font-size: 15px;
1098          padding: 20px 0 0;
1099          text-align: right;
1100      }
1101  }
1102  
1103  .theme-details .theme-rating {
1104      line-height: 1.9;
1105  }
1106  
1107  .theme-details .star-rating {
1108      display: inline;
1109  }
1110  
1111  .theme-details .num-ratings,
1112  .theme-details .no-rating {
1113      font-size: 11px;
1114      color: #72777c;
1115  }
1116  
1117  .theme-details .no-rating {
1118      display: block;
1119      line-height: 1.9;
1120  }
1121  
1122  /*------------------------------------------------------------------------------
1123    16.3 - Custom Header Screen
1124  ------------------------------------------------------------------------------*/
1125  
1126  .appearance_page_custom-header #headimg {
1127      border: 1px solid #ddd;
1128      overflow: hidden;
1129      width: 100%;
1130  }
1131  
1132  .appearance_page_custom-header #upload-form p label {
1133      font-size: 12px;
1134  }
1135  
1136  .appearance_page_custom-header .available-headers .default-header {
1137      float: right;
1138      margin: 0 0 20px 20px;
1139  }
1140  
1141  .appearance_page_custom-header .random-header {
1142      clear: both;
1143      margin: 0 0 20px 20px;
1144      vertical-align: middle;
1145  }
1146  
1147  .appearance_page_custom-header .available-headers label input,
1148  .appearance_page_custom-header .random-header label input {
1149      margin-left: 10px;
1150  }
1151  
1152  .appearance_page_custom-header .available-headers label img {
1153      vertical-align: middle;
1154  }
1155  
1156  
1157  /*------------------------------------------------------------------------------
1158    16.4 - Custom Background Screen
1159  ------------------------------------------------------------------------------*/
1160  
1161  div#custom-background-image {
1162      min-height: 100px;
1163      border: 1px solid #ddd;
1164  }
1165  
1166  div#custom-background-image img {
1167      max-width: 400px;
1168      max-height: 300px;
1169  }
1170  
1171  .background-position-control input[type="radio"]:checked ~ .button {
1172      background: #eee;
1173      border-color: #999;
1174      box-shadow: inset 0 2px 5px -3px rgba(0, 0, 0, 0.5);
1175      z-index: 1;
1176  }
1177  
1178  .background-position-control input[type="radio"]:focus ~ .button {
1179      border-color: #5b9dd9;
1180      box-shadow: inset 0 2px 5px -3px rgba(0, 0, 0, 0.5), 0 0 3px rgba(0, 115, 170, 0.8);
1181      color: #23282d;
1182  }
1183  
1184  .background-position-control .background-position-center-icon,
1185  .background-position-control .background-position-center-icon:before {
1186      display: inline-block;
1187      line-height: 1;
1188      text-align: center;
1189      transition: background-color .1s ease-in;
1190  }
1191  
1192  .background-position-control .background-position-center-icon {
1193      height: 20px;
1194      margin-top: 13px;
1195      vertical-align: top;
1196      width: 20px;
1197  }
1198  
1199  .background-position-control .background-position-center-icon:before {
1200      background-color: #555;
1201      border-radius: 50%;
1202      content: "";
1203      height: 12px;
1204      width: 12px;
1205  }
1206  
1207  .background-position-control .button:hover .background-position-center-icon:before,
1208  .background-position-control input[type="radio"]:focus ~ .button .background-position-center-icon:before {
1209      background-color: #23282d;
1210  }
1211  
1212  .background-position-control .button-group {
1213      display: block;
1214  }
1215  
1216  .background-position-control .button-group .button {
1217      border-radius: 0;
1218      box-shadow: none;
1219      /* Following properties are overridden by buttons responsive styles (see: wp-includes/css/buttons.css). */
1220      height: 40px !important;
1221      line-height: 2.9 !important;
1222      margin: 0 0 0 -1px !important;
1223      padding: 0 10px 1px !important;
1224      position: relative;
1225  }
1226  
1227  .background-position-control .button-group .button:active,
1228  .background-position-control .button-group .button:hover,
1229  .background-position-control .button-group .button:focus {
1230      z-index: 1;
1231  }
1232  
1233  .background-position-control .button-group:last-child .button {
1234      box-shadow: 0 1px 0 #ccc;
1235  }
1236  
1237  .background-position-control .button-group > label {
1238      margin: 0 !important;
1239  }
1240  
1241  .background-position-control .button-group:first-child > label:first-child .button {
1242      border-radius: 0 3px 0 0;
1243  }
1244  
1245  .background-position-control .button-group:first-child > label:first-child .dashicons {
1246      transform: rotate( -45deg );
1247  }
1248  
1249  .background-position-control .button-group:first-child > label:last-child .button {
1250      border-radius: 3px 0 0 0;
1251  }
1252  
1253  .background-position-control .button-group:first-child > label:last-child .dashicons {
1254      transform: rotate( 45deg );
1255  }
1256  
1257  .background-position-control .button-group:last-child > label:first-child .button {
1258      border-radius: 0 0 3px 0;
1259  }
1260  
1261  .background-position-control .button-group:last-child > label:first-child .dashicons {
1262      transform: rotate( 45deg );
1263  }
1264  
1265  .background-position-control .button-group:last-child > label:last-child .button {
1266      border-radius: 0 0 0 3px;
1267  }
1268  
1269  .background-position-control .button-group:last-child > label:last-child .dashicons {
1270      transform: rotate( -45deg );
1271  }
1272  
1273  .background-position-control .button-group .dashicons {
1274      margin-top: 9px;
1275  }
1276  
1277  .background-position-control .button-group + .button-group {
1278      margin-top: -1px;
1279  }
1280  
1281  /*------------------------------------------------------------------------------
1282    23.0 - Full Overlay w/ Sidebar
1283  ------------------------------------------------------------------------------*/
1284  
1285  body.full-overlay-active {
1286      overflow: hidden;
1287      /* Hide all the content, the Customizer overlay is then made visible to be the only available content. */
1288      visibility: hidden;
1289  }
1290  
1291  .wp-full-overlay {
1292      background: transparent;
1293      z-index: 500000;
1294      position: fixed;
1295      overflow: visible;
1296      top: 0;
1297      bottom: 0;
1298      right: 0;
1299      left: 0;
1300      height: 100%;
1301      min-width: 0;
1302  }
1303  
1304  .wp-full-overlay-sidebar {
1305      box-sizing: border-box;
1306      position: fixed;
1307      min-width: 300px;
1308      max-width: 600px;
1309      width: 18%;
1310      height: 100%;
1311      top: 0;
1312      bottom: 0;
1313      right: 0;
1314      padding: 0;
1315      margin: 0;
1316      z-index: 10;
1317      background: #eee;
1318      border-left: none;
1319  }
1320  
1321  .wp-full-overlay.collapsed .wp-full-overlay-sidebar {
1322      overflow: visible;
1323  }
1324  
1325  .wp-full-overlay.collapsed,
1326  .wp-full-overlay.expanded .wp-full-overlay-sidebar {
1327      margin-right: 0 !important;
1328  }
1329  
1330  .wp-full-overlay.expanded {
1331      margin-right: 300px;
1332  }
1333  
1334  .wp-full-overlay.collapsed .wp-full-overlay-sidebar {
1335      margin-right: -300px;
1336  }
1337  
1338  @media screen and (min-width: 1667px) {
1339      .wp-full-overlay.expanded {
1340          margin-right: 18%;
1341      }
1342  
1343      .wp-full-overlay.collapsed .wp-full-overlay-sidebar {
1344          margin-right: -18%;
1345      }
1346  }
1347  
1348  @media screen and (min-width: 3333px) {
1349      .wp-full-overlay.expanded {
1350          margin-right: 600px;
1351      }
1352  
1353      .wp-full-overlay.collapsed .wp-full-overlay-sidebar {
1354          margin-right: -600px;
1355      }
1356  }
1357  
1358  .wp-full-overlay-sidebar:after {
1359      content: "";
1360      display: block;
1361      position: absolute;
1362      top: 0;
1363      bottom: 0;
1364      left: 0;
1365      width: 3px;
1366      z-index: 1000;
1367  }
1368  
1369  .wp-full-overlay-main {
1370      position: absolute;
1371      right: 0;
1372      left: 0;
1373      top: 0;
1374      bottom: 0;
1375      height: 100%;
1376  }
1377  
1378  .wp-full-overlay-sidebar .wp-full-overlay-header {
1379      position: absolute;
1380      right: 0;
1381      left: 0;
1382      height: 45px;
1383      padding: 0 15px;
1384      line-height: 3.2;
1385      z-index: 10;
1386      margin: 0;
1387      border-top: none;
1388      box-shadow: none;
1389  }
1390  
1391  .wp-full-overlay-sidebar .wp-full-overlay-header a.back {
1392      margin-top: 9px;
1393  }
1394  
1395  .wp-full-overlay-sidebar .wp-full-overlay-footer {
1396      bottom: 0;
1397      border-bottom: none;
1398      border-top: none;
1399      box-shadow: none;
1400  }
1401  
1402  .wp-full-overlay-sidebar .wp-full-overlay-sidebar-content {
1403      position: absolute;
1404      top: 45px;
1405      bottom: 45px;
1406      right: 0;
1407      left: 0;
1408      overflow: auto;
1409  }
1410  
1411  /* Close & Navigation Links */
1412  .theme-install-overlay .wp-full-overlay-sidebar .wp-full-overlay-header {
1413      padding: 0;
1414  }
1415  
1416  .theme-install-overlay .close-full-overlay,
1417  .theme-install-overlay .previous-theme,
1418  .theme-install-overlay .next-theme {
1419      display: block;
1420      position: relative;
1421      float: right;
1422      width: 45px;
1423      height: 45px;
1424      background: #eee;
1425      border-left: 1px solid #ddd;
1426      color: #444;
1427      cursor: pointer;
1428      text-decoration: none;
1429      transition: color .1s ease-in-out, background .1s ease-in-out;
1430  }
1431  
1432  .theme-install-overlay .close-full-overlay:hover,
1433  .theme-install-overlay .close-full-overlay:focus,
1434  .theme-install-overlay .previous-theme:hover,
1435  .theme-install-overlay .previous-theme:focus,
1436  .theme-install-overlay .next-theme:hover,
1437  .theme-install-overlay .next-theme:focus {
1438      background: #ddd;
1439      border-color: #ccc;
1440      color: #000;
1441      outline: none;
1442      box-shadow: none;
1443  }
1444  
1445  .theme-install-overlay .close-full-overlay:before {
1446      font: normal 22px/1 dashicons;
1447      content: "\f335";
1448      position: relative;
1449      top: 7px;
1450      right: 13px;
1451  }
1452  
1453  .theme-install-overlay .previous-theme:before {
1454      font: normal 20px/1 dashicons;
1455      content: "\f345";
1456      position: relative;
1457      top: 6px;
1458      right: 14px;
1459  }
1460  
1461  .theme-install-overlay .next-theme:before {
1462      font: normal 20px/1 dashicons;
1463      content: "\f341";
1464      position: relative;
1465      top: 6px;
1466      right: 13px;
1467  }
1468  
1469  .theme-install-overlay .previous-theme.disabled,
1470  .theme-install-overlay .next-theme.disabled,
1471  .theme-install-overlay .previous-theme.disabled:hover,
1472  .theme-install-overlay .previous-theme.disabled:focus,
1473  .theme-install-overlay .next-theme.disabled:hover,
1474  .theme-install-overlay .next-theme.disabled:focus {
1475      color: #b4b9be;
1476      background: #eee;
1477      cursor: default;
1478      pointer-events: none;
1479  }
1480  
1481  .theme-install-overlay .close-full-overlay,
1482  .theme-install-overlay .previous-theme,
1483  .theme-install-overlay .next-theme {
1484      border-right: 0;
1485      border-top: 0;
1486      border-bottom: 0;
1487  }
1488  
1489  .theme-install-overlay .close-full-overlay:before,
1490  .theme-install-overlay .previous-theme:before,
1491  .theme-install-overlay .next-theme:before {
1492      top: 2px;
1493      right: 0;
1494  }
1495  
1496  /* Collapse Button */
1497  .wp-core-ui .wp-full-overlay .collapse-sidebar {
1498      position: fixed;
1499      bottom: 0;
1500      right: 0;
1501      padding: 9px 10px 9px 0;
1502      height: 45px;
1503      color: #656a6f;
1504      outline: 0;
1505      line-height: 1;
1506      background-color: transparent !important;
1507      border: none !important;
1508      box-shadow: none !important;
1509      border-radius: 0 !important;
1510  }
1511  
1512  .wp-core-ui .wp-full-overlay .collapse-sidebar:hover,
1513  .wp-core-ui .wp-full-overlay .collapse-sidebar:focus {
1514      color: #0073aa;
1515  }
1516  
1517  .wp-full-overlay .collapse-sidebar-arrow,
1518  .wp-full-overlay .collapse-sidebar-label {
1519      display: inline-block;
1520      vertical-align: middle;
1521      line-height: 1.6;
1522  }
1523  
1524  .wp-full-overlay .collapse-sidebar-arrow {
1525      width: 20px;
1526      height: 20px;
1527      margin: 0 2px; /* avoid the focus box-shadow to be cut-off */
1528      border-radius: 50%;
1529      overflow: hidden;
1530  }
1531  
1532  .wp-full-overlay .collapse-sidebar:hover .collapse-sidebar-arrow,
1533  .wp-full-overlay .collapse-sidebar:focus .collapse-sidebar-arrow {
1534      box-shadow:
1535          0 0 0 1px #5b9dd9,
1536          0 0 2px 1px rgba(30, 140, 190, 0.8);
1537  }
1538  
1539  .wp-full-overlay .collapse-sidebar-label {
1540      margin-right: 3px;
1541  }
1542  
1543  .wp-full-overlay.collapsed .collapse-sidebar-label {
1544      display: none;
1545  }
1546  
1547  .wp-full-overlay .collapse-sidebar-arrow:before {
1548      display: block;
1549      content: "\f148";
1550      background: #eee;
1551      font: normal 20px/1 dashicons;
1552      speak: none;
1553      padding: 0;
1554      -webkit-font-smoothing: antialiased;
1555      -moz-osx-font-smoothing: grayscale;
1556  }
1557  
1558  .wp-core-ui .wp-full-overlay.collapsed .collapse-sidebar {
1559      padding: 9px 10px;
1560  }
1561  
1562  /* rtl:ignore */
1563  .wp-full-overlay.collapsed .collapse-sidebar-arrow:before,
1564  .rtl .wp-full-overlay .collapse-sidebar-arrow:before {
1565      transform: rotate(180.001deg); /* Firefox: promoting to its own layer to trigger anti-aliasing */
1566  }
1567  
1568  .rtl .wp-full-overlay.collapsed .collapse-sidebar-arrow:before {
1569      transform: none;
1570  }
1571  
1572  /* Animations */
1573  .wp-full-overlay,
1574  .wp-full-overlay-sidebar,
1575  .wp-full-overlay .collapse-sidebar,
1576  .wp-full-overlay-main {
1577      transition-property: right, left, top, bottom, width, margin;
1578      transition-duration: 0.2s;
1579  }
1580  
1581  /* Device/preview size toggles */
1582  
1583  .wp-full-overlay {
1584      background: #191e23;
1585  }
1586  
1587  .wp-full-overlay-main {
1588      background-color: #f1f1f1;
1589  }
1590  
1591  .expanded .wp-full-overlay-footer {
1592      position: fixed;
1593      bottom: 0;
1594      right: 0;
1595      min-width: 299px;
1596      max-width: 599px;
1597      width: 18%;
1598      width: calc( 18% - 1px );
1599      height: 45px;
1600      border-top: 1px solid #ddd;
1601      background: #eee;
1602  }
1603  
1604  .wp-full-overlay-footer .devices-wrapper {
1605      float: left;
1606  }
1607  
1608  .wp-full-overlay-footer .devices {
1609      position: relative;
1610      background: #eee;
1611      box-shadow: 20px 0 10px -5px #eee;
1612  }
1613  
1614  .wp-full-overlay-footer .devices button {
1615      cursor: pointer;
1616      background: transparent;
1617      border: none;
1618      height: 45px;
1619      padding: 0 3px;
1620      margin: 0 -4px 0 0;
1621      box-shadow: none;
1622      border-top: 1px solid transparent;
1623      border-bottom: 4px solid transparent;
1624      transition:
1625          .15s color ease-in-out,
1626          .15s background-color ease-in-out,
1627          .15s border-color ease-in-out;
1628  }
1629  
1630  .wp-full-overlay-footer .devices button:focus {
1631      box-shadow: none;
1632      outline: none;
1633  }
1634  
1635  .wp-full-overlay-footer .devices button:before {
1636      display: inline-block;
1637      -webkit-font-smoothing: antialiased;
1638      font: normal 20px/30px "dashicons";
1639      vertical-align: top;
1640      margin: 3px 0;
1641      padding: 4px 8px;
1642      color: #656a6f;
1643  }
1644  
1645  .wp-full-overlay-footer .devices button.active {
1646      border-bottom-color: #191e23;
1647  }
1648  
1649  .wp-full-overlay-footer .devices button:hover,
1650  .wp-full-overlay-footer .devices button:focus {
1651      background-color: #fff;
1652  }
1653  
1654  .wp-full-overlay-footer .devices button:focus,
1655  .wp-full-overlay-footer .devices button.active:hover {
1656      border-bottom-color: #0073aa;
1657  }
1658  
1659  .wp-full-overlay-footer .devices button.active:before {
1660      color: #191e23;
1661  }
1662  
1663  .wp-full-overlay-footer .devices button:hover:before,
1664  .wp-full-overlay-footer .devices button:focus:before {
1665      color: #0073aa;
1666  }
1667  
1668  .wp-full-overlay-footer .devices .preview-desktop:before {
1669      content: "\f472";
1670  }
1671  
1672  .wp-full-overlay-footer .devices .preview-tablet:before {
1673      content: "\f471";
1674  }
1675  
1676  .wp-full-overlay-footer .devices .preview-mobile:before {
1677      content: "\f470";
1678  }
1679  
1680  @media screen and (max-width: 1024px) {
1681      .wp-full-overlay-footer .devices {
1682          display: none;
1683      }
1684  }
1685  
1686  .collapsed .wp-full-overlay-footer .devices button:before {
1687      display: none;
1688  }
1689  
1690  .preview-mobile .wp-full-overlay-main {
1691      margin: auto -160px auto 0;
1692      width: 320px;
1693      height: 480px;
1694      max-height: 100%;
1695      max-width: 100%;
1696      right: 50%;
1697  }
1698  
1699  .preview-tablet .wp-full-overlay-main {
1700      margin: auto -360px auto 0;
1701      width: 720px; /* Size is loosely based on a typical "tablet" device size. Intentionally ambiguous - this does not represent any particular device precisely. */
1702      height: 1080px;
1703      max-height: 100%;
1704      max-width: 100%;
1705      right: 50%;
1706  }
1707  
1708  
1709  /*------------------------------------------------------------------------------
1710    24.0 - Customize Loader
1711  ------------------------------------------------------------------------------*/
1712  
1713  .no-customize-support .hide-if-no-customize,
1714  .customize-support .hide-if-customize,
1715  .no-customize-support.wp-core-ui .hide-if-no-customize,
1716  .no-customize-support .wp-core-ui .hide-if-no-customize,
1717  .customize-support.wp-core-ui .hide-if-customize,
1718  .customize-support .wp-core-ui .hide-if-customize {
1719      display: none;
1720  }
1721  
1722  #customize-container,
1723  #customize-controls .notice.notification-overlay {
1724      background: #eee;
1725      z-index: 500000;
1726      position: fixed;
1727      overflow: visible;
1728      top: 0;
1729      bottom: 0;
1730      right: 0;
1731      left: 0;
1732      height: 100%;
1733  }
1734  #customize-container {
1735      display: none;
1736  }
1737  
1738  /* Make the Customizer and Theme installer overlays the only available content. */
1739  #customize-container,
1740  .theme-install-overlay {
1741      visibility: visible;
1742  }
1743  
1744  .customize-loading #customize-container iframe {
1745      opacity: 0;
1746  }
1747  
1748  #customize-container iframe,
1749  .theme-install-overlay iframe {
1750      height: 100%;
1751      width: 100%;
1752      z-index: 20;
1753      transition: opacity 0.3s;
1754  }
1755  
1756  #customize-controls {
1757      margin-top: 0;
1758  }
1759  
1760  .theme-install-overlay {
1761      display: none;
1762  }
1763  
1764  .theme-install-overlay.single-theme {
1765      display: block;
1766  }
1767  
1768  .install-theme-info {
1769      display: none;
1770      padding: 10px 20px 60px;
1771  }
1772  
1773  .single-theme .install-theme-info {
1774      padding-top: 15px;
1775  }
1776  
1777  .theme-install-overlay .install-theme-info {
1778      display: block;
1779  }
1780  
1781  .install-theme-info .theme-install {
1782      float: left;
1783      margin-top: 18px;
1784  }
1785  
1786  .install-theme-info .theme-name {
1787      font-size: 16px;
1788      line-height: 1.5;
1789      margin-bottom: 0;
1790      margin-top: 0;
1791  }
1792  
1793  .install-theme-info .theme-screenshot {
1794      margin: 15px 0;
1795      width: 258px;
1796      border: 1px solid #ccc;
1797  }
1798  
1799  .install-theme-info .theme-details {
1800      overflow: hidden;
1801  }
1802  
1803  .theme-details .theme-version {
1804      margin: 15px 0;
1805  }
1806  
1807  .theme-details .theme-description {
1808      float: right;
1809      color: #72777c;
1810      line-height: 1.6;
1811      max-width: 100%;
1812  }
1813  
1814  .theme-install-overlay .wp-full-overlay-header .button {
1815      float: left;
1816      margin: 8px 0 0 10px;
1817      /* For when .theme-install is a span rather than a.button-primary (already installed theme) */
1818      line-height: 2;
1819  }
1820  
1821  .theme-install-overlay .wp-full-overlay-sidebar {
1822      background: #eee;
1823      border-left: 1px solid #ddd;
1824  }
1825  
1826  .theme-install-overlay .wp-full-overlay-sidebar-content {
1827      background: #fff;
1828      border-top: 1px solid #ddd;
1829      border-bottom: 1px solid #ddd;
1830  }
1831  
1832  .theme-install-overlay .wp-full-overlay-main {
1833      position: absolute;
1834      z-index: 0;
1835      background-color: #f1f1f1;
1836  }
1837  
1838  .customize-loading #customize-container {
1839      background-color: #f1f1f1;
1840  }
1841  
1842  #customize-preview.wp-full-overlay-main:before,
1843  .customize-loading #customize-container:before,
1844  #customize-controls .notice.notification-overlay.notification-loading:before,
1845  .theme-install-overlay .wp-full-overlay-main:before {
1846      content: "";
1847      display: block;
1848      width: 20px;
1849      height: 20px;
1850      position: absolute;
1851      right: 50%;
1852      top: 50%;
1853      z-index: -1;
1854      margin: -10px -10px 0 0;
1855      transform: translateZ(0);
1856      background: transparent url(../images/spinner.gif) no-repeat center center;
1857      background-size: 20px 20px;
1858  }
1859  
1860  #customize-preview.wp-full-overlay-main.iframe-ready:before,
1861  .theme-install-overlay.iframe-ready .wp-full-overlay-main:before {
1862      background-image: none;
1863  }
1864  
1865  /* =Media Queries
1866  -------------------------------------------------------------- */
1867  
1868  /**
1869   * HiDPI Displays
1870   */
1871  @media print,
1872    (-webkit-min-device-pixel-ratio: 1.25),
1873    (min-resolution: 120dpi) {
1874      .wp-full-overlay .collapse-sidebar-arrow {
1875          background-image: url(../images/arrows-2x.png);
1876          background-size: 15px 123px;
1877      }
1878  
1879      #customize-preview.wp-full-overlay-main:before,
1880      .customize-loading #customize-container:before,
1881      #customize-controls .notice.notification-overlay.notification-loading:before,
1882      .theme-install-overlay .wp-full-overlay-main:before {
1883          background-image: url(../images/spinner-2x.gif);
1884      }
1885  }
1886  
1887  @media screen and (max-width: 782px) {
1888      .available-theme .action-links .delete-theme {
1889          float: none;
1890          margin: 0;
1891          padding: 0;
1892          clear: both;
1893      }
1894  
1895      .available-theme .action-links .delete-theme a {
1896          padding: 0;
1897      }
1898  
1899      .broken-themes table {
1900          width: 100%;
1901      }
1902  
1903      .theme-install-overlay .wp-full-overlay-header .theme-install {
1904          margin-top: 6px;
1905          line-height: normal;
1906      }
1907  
1908      .theme-browser .theme .theme-actions .button {
1909          margin-bottom: 0;
1910      }
1911  
1912      .theme-browser .theme.active .theme-actions,
1913      .theme-browser .theme .theme-actions {
1914          padding-top: 4px;
1915          padding-bottom: 4px;
1916      }
1917  }
1918  
1919  @media aural {
1920      .theme .notice:before,
1921      .theme-info .updating-message:before,
1922      .theme-info .updated-message:before,
1923      .theme-install.updating-message:before {
1924          speak: none;
1925      }
1926  }


Generated: Tue May 19 15:51:04 2020 Cross-referenced by PHPXref 0.7.1