[ Index ]

PHP Cross Reference of WordPress Trunk (Updated Daily)

Search

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


Generated : Tue May 26 08:20:01 2020 Cross-referenced by PHPXref