wp/wp-admin/css/themes.css
changeset 18 be944660c56a
parent 16 a86126ab1dd4
child 19 3d72ae0968f4
equal deleted inserted replaced
17:34716fd837a4 18:be944660c56a
    54 	cursor: pointer;
    54 	cursor: pointer;
    55 	float: left;
    55 	float: left;
    56 	margin: 0 4% 4% 0;
    56 	margin: 0 4% 4% 0;
    57 	position: relative;
    57 	position: relative;
    58 	width: 30.6%;
    58 	width: 30.6%;
    59 	border: 1px solid #ddd;
    59 	border: 1px solid #dcdcde;
    60 	box-shadow: 0 1px 1px -1px rgba(0, 0, 0, 0.1);
    60 	box-shadow: 0 1px 1px -1px rgba(0, 0, 0, 0.1);
    61 	box-sizing: border-box;
    61 	box-sizing: border-box;
    62 }
    62 }
    63 
    63 
    64 .theme-browser .theme:nth-child(3n) {
    64 .theme-browser .theme:nth-child(3n) {
    65 	margin-right: 0;
    65 	margin-right: 0;
    66 }
    66 }
    67 
    67 
    68 .theme-browser .theme:hover,
    68 .theme-browser .theme:hover,
    69 .theme-browser .theme:focus {
    69 .theme-browser .theme.focus {
    70 	cursor: pointer;
    70 	cursor: pointer;
    71 }
    71 }
    72 
    72 
    73 .theme-browser .theme .theme-name {
    73 .theme-browser .theme .theme-name {
    74 	font-size: 15px;
    74 	font-size: 15px;
    88 .theme-browser .theme .theme-actions {
    88 .theme-browser .theme .theme-actions {
    89 	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    89 	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    90 	opacity: 0;
    90 	opacity: 0;
    91 	transition: opacity 0.1s ease-in-out;
    91 	transition: opacity 0.1s ease-in-out;
    92 	height: auto;
    92 	height: auto;
    93 	background: rgba(244, 244, 244, 0.7);
    93 	background: rgba(246, 247, 247, 0.7);
    94 	border-left: 1px solid rgba(0, 0, 0, 0.05);
    94 	border-left: 1px solid rgba(0, 0, 0, 0.05);
    95 }
    95 }
    96 
    96 
    97 .theme-browser .theme:hover .theme-actions,
    97 .theme-browser .theme:hover .theme-actions,
    98 .theme-browser .theme.focus .theme-actions,
    98 .theme-browser .theme.focus .theme-actions {
    99 .theme-browser .theme:focus .theme-actions {
       
   100 	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
    99 	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
   101 	opacity: 1;
   100 	opacity: 1;
   102 }
   101 }
   103 
   102 
   104 .theme-browser .theme .theme-actions .button-primary {
   103 .theme-browser .theme .theme-actions .button-primary {
   138 	width: 100%;
   137 	width: 100%;
   139 	transition: opacity 0.2s ease-in-out;
   138 	transition: opacity 0.2s ease-in-out;
   140 }
   139 }
   141 
   140 
   142 .theme-browser .theme:hover .theme-screenshot,
   141 .theme-browser .theme:hover .theme-screenshot,
   143 .theme-browser .theme:focus .theme-screenshot {
   142 .theme-browser .theme.focus .theme-screenshot {
   144 	background: #fff;
   143 	background: #fff;
   145 }
   144 }
   146 
   145 
   147 .theme-browser.rendered .theme:hover .theme-screenshot img,
   146 .theme-browser.rendered .theme:hover .theme-screenshot img,
   148 .theme-browser.rendered .theme:focus .theme-screenshot img {
   147 .theme-browser.rendered .theme.focus .theme-screenshot img {
   149 	opacity: 0.4;
   148 	opacity: 0.4;
   150 }
   149 }
   151 
   150 
   152 .theme-browser .theme .more-details {
   151 .theme-browser .theme .more-details {
   153 	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
   152 	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
   154 	opacity: 0;
   153 	opacity: 0;
   155 	position: absolute;
   154 	position: absolute;
   156 	top: 35%;
   155 	top: 35%;
   157 	right: 20%;
   156 	right: 20%;
   158 	left: 20%;
   157 	left: 20%;
   159 	background: #23282d;
   158 	width: 60%;
       
   159 	background: #1d2327;
   160 	background: rgba(0, 0, 0, 0.7);
   160 	background: rgba(0, 0, 0, 0.7);
   161 	color: #fff;
   161 	color: #fff;
   162 	font-size: 15px;
   162 	font-size: 15px;
   163 	text-shadow: 0 1px 0 rgba(0, 0, 0, 0.6);
   163 	text-shadow: 0 1px 0 rgba(0, 0, 0, 0.6);
   164 	-webkit-font-smoothing: antialiased;
   164 	-webkit-font-smoothing: antialiased;
   165 	font-weight: 600;
   165 	font-weight: 600;
   166 	padding: 15px 12px;
   166 	padding: 15px 12px;
   167 	text-align: center;
   167 	text-align: center;
   168 	border-radius: 3px;
   168 	border-radius: 3px;
       
   169 	border: none;
   169 	transition: opacity 0.1s ease-in-out;
   170 	transition: opacity 0.1s ease-in-out;
   170 }
   171 }
   171 
   172 
   172 .theme-browser .theme:focus {
   173 .theme-browser .theme .more-details:focus {
   173 	border-color: #5b9dd9;
   174 	box-shadow: 0 0 0 1px #fff, 0 0 0 3px #2271b1;
   174 	box-shadow: 0 0 2px rgba(30, 140, 190, 0.8);
   175 }
   175 }
   176 
   176 
   177 .theme-browser .theme.focus {
   177 .theme-browser .theme:focus .more-details {
   178 	border-color: #4f94d4;
       
   179 	box-shadow: 0 0 2px rgba(79, 148, 212, 0.8);
       
   180 }
       
   181 
       
   182 .theme-browser .theme.focus .more-details {
   178 	opacity: 1;
   183 	opacity: 1;
   179 }
   184 }
   180 
   185 
   181 /* Current theme needs to have its action always on view */
   186 /* Current theme needs to have its action always on view */
   182 .theme-browser .theme.active:focus .theme-actions {
   187 .theme-browser .theme.active.focus .theme-actions {
   183 	display: block;
   188 	display: block;
   184 }
   189 }
   185 
   190 
   186 .theme-browser.rendered .theme:hover .more-details,
   191 .theme-browser.rendered .theme:hover .more-details,
   187 .theme-browser.rendered .theme:focus .more-details {
   192 .theme-browser.rendered .theme.focus .more-details {
   188 	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
   193 	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
   189 	opacity: 1;
   194 	opacity: 1;
   190 }
   195 }
   191 
   196 
   192 /**
   197 /**
   193  * The currently active theme
   198  * The currently active theme
   194  */
   199  */
   195 .theme-browser .theme.active .theme-name {
   200 .theme-browser .theme.active .theme-name {
   196 	background: #23282d;
   201 	background: #1d2327;
   197 	color: #fff;
   202 	color: #fff;
   198 	padding-right: 110px;
   203 	padding-right: 110px;
   199 	font-weight: 300;
   204 	font-weight: 300;
   200 	box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.5);
   205 	box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.5);
   201 }
   206 }
   207 .theme-browser .theme.active .theme-name span {
   212 .theme-browser .theme.active .theme-name span {
   208 	font-weight: 600;
   213 	font-weight: 600;
   209 }
   214 }
   210 
   215 
   211 .theme-browser .theme.active .theme-actions {
   216 .theme-browser .theme.active .theme-actions {
   212 	background: rgba(49, 49, 49, 0.7);
   217 	background: rgba(44, 51, 56, 0.7);
   213 	border-left: none;
   218 	border-left: none;
   214 	opacity: 1;
   219 	opacity: 1;
   215 }
   220 }
   216 
   221 
   217 .theme-id-container {
   222 .theme-id-container {
   231 .theme-browser .theme.active .theme-actions .button-primary {
   236 .theme-browser .theme.active .theme-actions .button-primary {
   232 	margin-right: 0;
   237 	margin-right: 0;
   233 }
   238 }
   234 
   239 
   235 .theme-browser .theme .theme-author {
   240 .theme-browser .theme .theme-author {
   236 	background: #23282d;
   241 	background: #1d2327;
   237 	color: #eee;
   242 	color: #f0f0f1;
   238 	display: none;
   243 	display: none;
   239 	font-size: 14px;
   244 	font-size: 14px;
   240 	margin: 0 10px;
   245 	margin: 0 10px;
   241 	padding: 5px 10px;
   246 	padding: 5px 10px;
   242 	position: absolute;
   247 	position: absolute;
   276 	left: 0;
   281 	left: 0;
   277 	right: 0;
   282 	right: 0;
   278 	bottom: 0;
   283 	bottom: 0;
   279 	padding: 0;
   284 	padding: 0;
   280 	text-shadow: none;
   285 	text-shadow: none;
   281 	border: 5px dashed #d5d2ca;
   286 	border: 5px dashed #dcdcde;
   282 	border: 5px dashed rgba(0, 0, 0, 0.1);
   287 	border: 5px dashed rgba(0, 0, 0, 0.1);
   283 	box-sizing: border-box;
   288 	box-sizing: border-box;
   284 }
   289 }
   285 
   290 
   286 .theme-browser .theme.add-new-theme span:after {
   291 .theme-browser .theme.add-new-theme span:after {
   287 	background: #e5e5e5;
   292 	background: #dcdcde;
   288 	background: rgba(153, 153, 153, 0.1);
   293 	background: rgba(140, 143, 148, 0.1);
   289 	border-radius: 50%;
   294 	border-radius: 50%;
   290 	display: inline-block;
   295 	display: inline-block;
   291 	content: "\f132";
   296 	content: "\f132";
   292 	-webkit-font-smoothing: antialiased;
   297 	-webkit-font-smoothing: antialiased;
   293 	font: normal 74px/115px dashicons;
   298 	font: normal 74px/115px dashicons;
   294 	width: 100px;
   299 	width: 100px;
   295 	height: 100px;
   300 	height: 100px;
   296 	vertical-align: middle;
   301 	vertical-align: middle;
   297 	text-align: center;
   302 	text-align: center;
   298 	color: rgb(153, 153, 153);
   303 	color: #8c8f94;
   299 	position: absolute;
   304 	position: absolute;
   300 	top: 30%;
   305 	top: 30%;
   301 	left: 50%;
   306 	left: 50%;
   302 	margin-left: -50px;
   307 	margin-left: -50px;
   303 	text-indent: -4px;
   308 	text-indent: -4px;
   316 }
   321 }
   317 
   322 
   318 .theme-browser .theme.add-new-theme a:hover span:after,
   323 .theme-browser .theme.add-new-theme a:hover span:after,
   319 .theme-browser .theme.add-new-theme a:focus span:after {
   324 .theme-browser .theme.add-new-theme a:focus span:after {
   320 	background: #fff;
   325 	background: #fff;
   321 	color: #0073aa;
   326 	color: #2271b1;
   322 }
   327 }
   323 
   328 
   324 .theme-browser .theme.add-new-theme a:hover:after,
   329 .theme-browser .theme.add-new-theme a:hover:after,
   325 .theme-browser .theme.add-new-theme a:focus:after {
   330 .theme-browser .theme.add-new-theme a:focus:after {
   326 	border-color: transparent;
   331 	border-color: transparent;
   327 	color: #fff;
   332 	color: #fff;
   328 	background: #0073aa;
   333 	background: #2271b1;
   329 	content: "";
   334 	content: "";
   330 }
   335 }
   331 
   336 
   332 .theme-browser .theme.add-new-theme .theme-name {
   337 .theme-browser .theme.add-new-theme .theme-name {
   333 	background: none;
   338 	background: none;
   355 	position: absolute;
   360 	position: absolute;
   356 	left: -20px;
   361 	left: -20px;
   357 	right: 0;
   362 	right: 0;
   358 	top: 0;
   363 	top: 0;
   359 	bottom: 0;
   364 	bottom: 0;
   360 	background: #f1f1f1;
   365 	background: #f0f0f1;
   361 	background: rgba(238, 238, 238, 0.9);
   366 	background: rgba(240, 240, 241, 0.9);
   362 	z-index: 10000; /* Over WP Pointers. */
   367 	z-index: 10000; /* Over WP Pointers. */
   363 }
   368 }
   364 
   369 
   365 .theme-overlay .theme-header {
   370 .theme-overlay .theme-header {
   366 	position: absolute;
   371 	position: absolute;
   367 	top: 0;
   372 	top: 0;
   368 	left: 0;
   373 	left: 0;
   369 	right: 0;
   374 	right: 0;
   370 	height: 48px;
   375 	height: 48px;
   371 	border-bottom: 1px solid #ddd;
   376 	border-bottom: 1px solid #dcdcde;
   372 }
   377 }
   373 
   378 
   374 .theme-overlay .theme-header button {
   379 .theme-overlay .theme-header button {
   375 	padding: 0;
   380 	padding: 0;
   376 }
   381 }
   380 	height: 48px;
   385 	height: 48px;
   381 	width: 50px;
   386 	width: 50px;
   382 	text-align: center;
   387 	text-align: center;
   383 	float: right;
   388 	float: right;
   384 	border: 0;
   389 	border: 0;
   385 	border-left: 1px solid #ddd;
   390 	border-left: 1px solid #dcdcde;
   386 	background-color: transparent;
   391 	background-color: transparent;
   387 	transition: color .1s ease-in-out, background .1s ease-in-out;
   392 	transition: color .1s ease-in-out, background .1s ease-in-out;
   388 }
   393 }
   389 
   394 
   390 .theme-overlay .theme-header .close:before {
   395 .theme-overlay .theme-header .close:before {
   391 	font: normal 22px/50px dashicons !important;
   396 	font: normal 22px/50px dashicons !important;
   392 	color: #72777c;
   397 	color: #787c82;
   393 	display: inline-block;
   398 	display: inline-block;
   394 	content: "\f335";
   399 	content: "\f335";
   395 	font-weight: 300;
   400 	font-weight: 300;
   396 }
   401 }
   397 
   402 
   398 /* Left and right navigation */
   403 /* Left and right navigation */
   399 .theme-overlay .theme-header .right,
   404 .theme-overlay .theme-header .right,
   400 .theme-overlay .theme-header .left {
   405 .theme-overlay .theme-header .left {
   401 	cursor: pointer;
   406 	cursor: pointer;
   402 	color: #72777c;
   407 	color: #787c82;
   403 	background-color: transparent;
   408 	background-color: transparent;
   404 	height: 48px;
   409 	height: 48px;
   405 	width: 54px;
   410 	width: 54px;
   406 	float: left;
   411 	float: left;
   407 	text-align: center;
   412 	text-align: center;
   408 	border: 0;
   413 	border: 0;
   409 	border-right: 1px solid #ddd;
   414 	border-right: 1px solid #dcdcde;
   410 	transition: color .1s ease-in-out, background .1s ease-in-out;
   415 	transition: color .1s ease-in-out, background .1s ease-in-out;
   411 }
   416 }
   412 
   417 
   413 .theme-overlay .theme-header .close:focus,
   418 .theme-overlay .theme-header .close:focus,
   414 .theme-overlay .theme-header .close:hover,
   419 .theme-overlay .theme-header .close:hover,
   415 .theme-overlay .theme-header .right:focus,
   420 .theme-overlay .theme-header .right:focus,
   416 .theme-overlay .theme-header .right:hover,
   421 .theme-overlay .theme-header .right:hover,
   417 .theme-overlay .theme-header .left:focus,
   422 .theme-overlay .theme-header .left:focus,
   418 .theme-overlay .theme-header .left:hover {
   423 .theme-overlay .theme-header .left:hover {
   419 	background: #ddd;
   424 	background: #dcdcde;
   420 	border-color: #ccc;
   425 	border-color: #c3c4c7;
   421 	color: #000;
   426 	color: #000;
   422 }
   427 }
   423 
   428 
   424 .theme-overlay .theme-header .close:focus:before,
   429 .theme-overlay .theme-header .close:focus:before,
   425 .theme-overlay .theme-header .close:hover:before {
   430 .theme-overlay .theme-header .close:hover:before {
   435 
   440 
   436 .theme-overlay .theme-header .left.disabled,
   441 .theme-overlay .theme-header .left.disabled,
   437 .theme-overlay .theme-header .right.disabled,
   442 .theme-overlay .theme-header .right.disabled,
   438 .theme-overlay .theme-header .left.disabled:hover,
   443 .theme-overlay .theme-header .left.disabled:hover,
   439 .theme-overlay .theme-header .right.disabled:hover {
   444 .theme-overlay .theme-header .right.disabled:hover {
   440 	color: #ccc;
   445 	color: #c3c4c7;
   441 	background: inherit;
   446 	background: inherit;
   442 	cursor: inherit;
   447 	cursor: inherit;
   443 }
   448 }
   444 
   449 
   445 .theme-overlay .theme-header .right:before,
   450 .theme-overlay .theme-header .right:before,
   490 	text-align: center;
   495 	text-align: center;
   491 	bottom: 0;
   496 	bottom: 0;
   492 	left: 0;
   497 	left: 0;
   493 	right: 0;
   498 	right: 0;
   494 	padding: 10px 25px 5px;
   499 	padding: 10px 25px 5px;
   495 	background: #f3f3f3;
   500 	background: #f6f7f7;
   496 	z-index: 30;
   501 	z-index: 30;
   497 	box-sizing: border-box;
   502 	box-sizing: border-box;
   498 	border-top: 1px solid #eee;
   503 	border-top: 1px solid #f0f0f1;
   499 }
   504 }
   500 
   505 
   501 .theme-overlay .theme-actions a {
   506 .theme-overlay .theme-actions a {
   502 	margin-right: 5px;
   507 	margin-right: 5px;
   503 	margin-bottom: 5px;
   508 	margin-bottom: 5px;
   509 	display: none;
   514 	display: none;
   510 }
   515 }
   511 
   516 
   512 .broken-themes a.delete-theme,
   517 .broken-themes a.delete-theme,
   513 .theme-overlay .theme-actions .delete-theme {
   518 .theme-overlay .theme-actions .delete-theme {
   514 	color: #a00;
   519 	color: #d63638;
   515 	text-decoration: none;
   520 	text-decoration: none;
   516 	border-color: transparent;
   521 	border-color: transparent;
   517 	box-shadow: none;
   522 	box-shadow: none;
   518 	background: transparent;
   523 	background: transparent;
   519 }
   524 }
   526 
   531 
   527 .broken-themes a.delete-theme:hover,
   532 .broken-themes a.delete-theme:hover,
   528 .broken-themes a.delete-theme:focus,
   533 .broken-themes a.delete-theme:focus,
   529 .theme-overlay .theme-actions .delete-theme:hover,
   534 .theme-overlay .theme-actions .delete-theme:hover,
   530 .theme-overlay .theme-actions .delete-theme:focus {
   535 .theme-overlay .theme-actions .delete-theme:focus {
   531 	background: #d54e21;
   536 	background: #d63638;
   532 	color: #fff;
   537 	color: #fff;
   533 	border-color: #d54e21;
   538 	border-color: #d63638;
   534 }
   539 }
   535 
   540 
   536 .theme-overlay .theme-actions .active-theme,
   541 .theme-overlay .theme-actions .active-theme,
   537 .theme-overlay.active .theme-actions .inactive-theme {
   542 .theme-overlay.active .theme-actions .inactive-theme {
   538 	display: none;
   543 	display: none;
   586 	width: auto;
   591 	width: auto;
   587 }
   592 }
   588 
   593 
   589 /* Other screenshots, shown small and square */
   594 /* Other screenshots, shown small and square */
   590 .theme-overlay .screenshot.thumb {
   595 .theme-overlay .screenshot.thumb {
   591 	background: #ccc;
   596 	background: #c3c4c7;
   592 	border: 1px solid #eee;
   597 	border: 1px solid #f0f0f1;
   593 	float: none;
   598 	float: none;
   594 	display: inline-block;
   599 	display: inline-block;
   595 	margin: 10px 5px 0;
   600 	margin: 10px 5px 0;
   596 	width: 140px;
   601 	width: 140px;
   597 	height: 80px;
   602 	height: 80px;
   614 	height: auto;
   619 	height: auto;
   615 }
   620 }
   616 
   621 
   617 .theme-overlay .screenshot.selected {
   622 .theme-overlay .screenshot.selected {
   618 	background: transparent;
   623 	background: transparent;
   619 	border: 2px solid #00a0d2;
   624 	border: 2px solid #72aee6;
   620 }
   625 }
   621 
   626 
   622 .theme-overlay .screenshot.selected img {
   627 .theme-overlay .screenshot.selected img {
   623 	opacity: 0.8;
   628 	opacity: 0.8;
   624 }
   629 }
   636 	width: 40%;
   641 	width: 40%;
   637 	float: left;
   642 	float: left;
   638 }
   643 }
   639 
   644 
   640 .theme-overlay .current-label {
   645 .theme-overlay .current-label {
   641 	background: #32373c;
   646 	background: #2c3338;
   642 	color: #fff;
   647 	color: #fff;
   643 	font-size: 11px;
   648 	font-size: 11px;
   644 	display: inline-block;
   649 	display: inline-block;
   645 	padding: 2px 8px;
   650 	padding: 2px 8px;
   646 	border-radius: 2px;
   651 	border-radius: 2px;
   647 	margin: 0 0 -10px;
   652 	margin: 0 0 -10px;
   648 	-webkit-user-select: none;
   653 	-webkit-user-select: none;
   649 	-moz-user-select: none;
       
   650 	-ms-user-select: none;
       
   651 	user-select: none;
   654 	user-select: none;
   652 }
   655 }
   653 
   656 
   654 .theme-overlay .theme-name {
   657 .theme-overlay .theme-name {
   655 	color: #23282d;
   658 	color: #1d2327;
   656 	font-size: 32px;
   659 	font-size: 32px;
   657 	font-weight: 100;
   660 	font-weight: 100;
   658 	margin: 10px 0 0;
   661 	margin: 10px 0 0;
   659 	line-height: 1.3;
   662 	line-height: 1.3;
   660 	word-wrap: break-word;
   663 	word-wrap: break-word;
   661 	overflow-wrap: break-word;
   664 	overflow-wrap: break-word;
   662 }
   665 }
   663 
   666 
   664 .theme-overlay .theme-version {
   667 .theme-overlay .theme-version {
   665 	color: #72777c;
   668 	color: #646970;
   666 	font-size: 13px;
   669 	font-size: 13px;
   667 	font-weight: 400;
   670 	font-weight: 400;
   668 	float: none;
   671 	float: none;
   669 	display: inline-block;
   672 	display: inline-block;
   670 	margin-left: 10px;
   673 	margin-left: 10px;
   671 }
   674 }
   672 
   675 
   673 .theme-overlay .theme-author {
   676 .theme-overlay .theme-author {
   674 	margin: 15px 0 25px;
   677 	margin: 15px 0 25px;
   675 	color: #72777c;
   678 	color: #646970;
   676 	font-size: 16px;
   679 	font-size: 16px;
   677 	font-weight: 400;
   680 	font-weight: 400;
   678 	line-height: inherit;
   681 	line-height: inherit;
   679 }
   682 }
   680 
   683 
   694 .theme-overlay .theme-autoupdate .toggle-auto-update .label {
   697 .theme-overlay .theme-autoupdate .toggle-auto-update .label {
   695 	text-decoration: underline;
   698 	text-decoration: underline;
   696 }
   699 }
   697 
   700 
   698 .theme-overlay .theme-description {
   701 .theme-overlay .theme-description {
   699 	color: #555;
   702 	color: #50575e;
   700 	font-size: 15px;
   703 	font-size: 15px;
   701 	font-weight: 400;
   704 	font-weight: 400;
   702 	line-height: 1.5;
   705 	line-height: 1.5;
   703 	margin: 30px 0 0 0;
   706 	margin: 30px 0 0 0;
   704 }
   707 }
   705 
   708 
   706 .theme-overlay .theme-tags {
   709 .theme-overlay .theme-tags {
   707 	border-top: 3px solid #eee;
   710 	border-top: 3px solid #f0f0f1;
   708 	color: #82878c;
   711 	color: #646970;
   709 	font-size: 13px;
   712 	font-size: 13px;
   710 	font-weight: 400;
   713 	font-weight: 400;
   711 	margin: 30px 0 0 0;
   714 	margin: 30px 0 0 0;
   712 	padding-top: 20px;
   715 	padding-top: 20px;
   713 }
   716 }
   714 
   717 
   715 .theme-overlay .theme-tags span {
   718 .theme-overlay .theme-tags span {
   716 	color: #444;
   719 	color: #3c434a;
   717 	font-weight: 600;
   720 	font-weight: 600;
   718 	margin-right: 5px;
   721 	margin-right: 5px;
   719 }
   722 }
   720 
   723 
   721 .theme-overlay .parent-theme {
   724 .theme-overlay .parent-theme {
   722 	background: #f7fcfe;
   725 	background: #fff;
   723 	border: 1px solid #eee;
   726 	border: 1px solid #f0f0f1;
   724 	border-left: 4px solid #00a0d2;
   727 	border-left: 4px solid #72aee6;
   725 	font-size: 14px;
   728 	font-size: 14px;
   726 	font-weight: 400;
   729 	font-weight: 400;
   727 	margin-top: 30px;
   730 	margin-top: 30px;
   728 	padding: 10px 10px 10px 20px;
   731 	padding: 10px 10px 10px 20px;
   729 }
   732 }
   877 	}
   880 	}
   878 
   881 
   879 	.theme:not(.active):hover .theme-actions,
   882 	.theme:not(.active):hover .theme-actions,
   880 	.theme:not(.active):focus .theme-actions,
   883 	.theme:not(.active):focus .theme-actions,
   881 	.theme:hover .more-details,
   884 	.theme:hover .more-details,
   882 	.theme:focus .more-details {
   885 	.theme.focus .more-details {
   883 		display: none;
   886 		display: none;
   884 	}
   887 	}
   885 
   888 
   886 	.theme-browser.rendered .theme:hover .theme-screenshot img,
   889 	.theme-browser.rendered .theme:hover .theme-screenshot img,
   887 	.theme-browser.rendered .theme:focus .theme-screenshot img {
   890 	.theme-browser.rendered .theme.focus .theme-screenshot img {
   888 		opacity: 1.0;
   891 		opacity: 1.0;
   889 	}
   892 	}
   890 }
   893 }
   891 
   894 
   892 @media only screen and (max-width: 480px) {
   895 @media only screen and (max-width: 480px) {
   999 	max-width: 40rem;
  1002 	max-width: 40rem;
  1000 }
  1003 }
  1001 
  1004 
  1002 /* Already installed theme */
  1005 /* Already installed theme */
  1003 .theme-browser .theme .theme-installed {
  1006 .theme-browser .theme .theme-installed {
  1004 	background: #0073aa;
  1007 	background: #2271b1;
  1005 }
  1008 }
  1006 
  1009 
  1007 .theme-browser .theme .notice-success p:before {
  1010 .theme-browser .theme .notice-success p:before {
  1008 	color: #79ba49;
  1011 	color: #68de7c;
  1009 	content: "\f147";
  1012 	content: "\f147";
  1010 	display: inline-block;
  1013 	display: inline-block;
  1011 	font: normal 20px/1 'dashicons';
  1014 	font: normal 20px/1 'dashicons';
  1012 	-webkit-font-smoothing: antialiased;
  1015 	-webkit-font-smoothing: antialiased;
  1013 	-moz-osx-font-smoothing: grayscale;
  1016 	-moz-osx-font-smoothing: grayscale;
  1056 	display: block;
  1059 	display: block;
  1057 }
  1060 }
  1058 
  1061 
  1059 .upload-theme .wp-upload-form,
  1062 .upload-theme .wp-upload-form,
  1060 .upload-plugin .wp-upload-form {
  1063 .upload-plugin .wp-upload-form {
  1061 	background: #fafafa;
  1064 	background: #f6f7f7;
  1062 	border: 1px solid #ccd0d4;
  1065 	border: 1px solid #c3c4c7;
  1063 	padding: 30px;
  1066 	padding: 30px;
  1064 	margin: 30px auto;
  1067 	margin: 30px auto;
  1065 	display: inline-flex;
  1068 	display: inline-flex;
  1066 	justify-content: space-between;
  1069 	justify-content: space-between;
  1067 	align-items: center;
  1070 	align-items: center;
  1072 	margin-right: 10px;
  1075 	margin-right: 10px;
  1073 }
  1076 }
  1074 
  1077 
  1075 .upload-theme .install-help,
  1078 .upload-theme .install-help,
  1076 .upload-plugin .install-help {
  1079 .upload-plugin .install-help {
  1077 	color: #555d66; /* #f1f1f1 background */
  1080 	color: #50575e; /* #f1f1f1 background */
  1078 	font-size: 18px;
  1081 	font-size: 18px;
  1079 	font-style: normal;
  1082 	font-style: normal;
  1080 	margin: 0;
  1083 	margin: 0;
  1081 	padding: 0;
  1084 	padding: 0;
  1082 	text-align: center;
  1085 	text-align: center;
  1083 }
  1086 }
  1084 
  1087 
  1085 p.no-themes,
  1088 p.no-themes,
  1086 p.no-themes-local {
  1089 p.no-themes-local {
  1087 	clear: both;
  1090 	clear: both;
  1088 	color: #666;
  1091 	color: #646970;
  1089 	font-size: 18px;
  1092 	font-size: 18px;
  1090 	font-style: normal;
  1093 	font-style: normal;
  1091 	margin: 0;
  1094 	margin: 0;
  1092 	padding: 100px 0;
  1095 	padding: 100px 0;
  1093 	text-align: center;
  1096 	text-align: center;
  1122 }
  1125 }
  1123 
  1126 
  1124 .theme-details .num-ratings,
  1127 .theme-details .num-ratings,
  1125 .theme-details .no-rating {
  1128 .theme-details .no-rating {
  1126 	font-size: 11px;
  1129 	font-size: 11px;
  1127 	color: #72777c;
  1130 	color: #646970;
  1128 }
  1131 }
  1129 
  1132 
  1130 .theme-details .no-rating {
  1133 .theme-details .no-rating {
  1131 	display: block;
  1134 	display: block;
  1132 	line-height: 1.9;
  1135 	line-height: 1.9;
  1133 }
  1136 }
  1134 
  1137 
  1135 .update-from-upload-comparison {
  1138 .update-from-upload-comparison {
  1136 	border-top: 1px solid #ddd;
  1139 	border-top: 1px solid #dcdcde;
  1137 	border-bottom: 1px solid #ddd;
  1140 	border-bottom: 1px solid #dcdcde;
  1138 	text-align: left;
  1141 	text-align: left;
  1139 	margin: 1rem 0 1.4rem;
  1142 	margin: 1rem 0 1.4rem;
  1140 	border-collapse: collapse;
  1143 	border-collapse: collapse;
  1141 	width: 100%;
  1144 	width: 100%;
  1142 }
  1145 }
  1160 .update-from-upload-comparison th {
  1163 .update-from-upload-comparison th {
  1161 	padding: 0.4rem 1.4rem;
  1164 	padding: 0.4rem 1.4rem;
  1162 }
  1165 }
  1163 
  1166 
  1164 .update-from-upload-comparison td.warning {
  1167 .update-from-upload-comparison td.warning {
  1165 	color: #a00;
  1168 	color: #d63638;
  1166 }
  1169 }
  1167 
  1170 
  1168 .update-from-upload-actions {
  1171 .update-from-upload-actions {
  1169 	margin-top: 1.4rem;
  1172 	margin-top: 1.4rem;
  1170 }
  1173 }
  1172 /*------------------------------------------------------------------------------
  1175 /*------------------------------------------------------------------------------
  1173   16.3 - Custom Header Screen
  1176   16.3 - Custom Header Screen
  1174 ------------------------------------------------------------------------------*/
  1177 ------------------------------------------------------------------------------*/
  1175 
  1178 
  1176 .appearance_page_custom-header #headimg {
  1179 .appearance_page_custom-header #headimg {
  1177 	border: 1px solid #ddd;
  1180 	border: 1px solid #dcdcde;
  1178 	overflow: hidden;
  1181 	overflow: hidden;
  1179 	width: 100%;
  1182 	width: 100%;
  1180 }
  1183 }
  1181 
  1184 
  1182 .appearance_page_custom-header #upload-form p label {
  1185 .appearance_page_custom-header #upload-form p label {
  1208   16.4 - Custom Background Screen
  1211   16.4 - Custom Background Screen
  1209 ------------------------------------------------------------------------------*/
  1212 ------------------------------------------------------------------------------*/
  1210 
  1213 
  1211 div#custom-background-image {
  1214 div#custom-background-image {
  1212 	min-height: 100px;
  1215 	min-height: 100px;
  1213 	border: 1px solid #ddd;
  1216 	border: 1px solid #dcdcde;
  1214 }
  1217 }
  1215 
  1218 
  1216 div#custom-background-image img {
  1219 div#custom-background-image img {
  1217 	max-width: 400px;
  1220 	max-width: 400px;
  1218 	max-height: 300px;
  1221 	max-height: 300px;
  1219 }
  1222 }
  1220 
  1223 
  1221 .background-position-control input[type="radio"]:checked ~ .button {
  1224 .background-position-control input[type="radio"]:checked ~ .button {
  1222 	background: #eee;
  1225 	background: #f0f0f1;
  1223 	border-color: #999;
  1226 	border-color: #8c8f94;
  1224 	box-shadow: inset 0 2px 5px -3px rgba(0, 0, 0, 0.5);
  1227 	box-shadow: inset 0 2px 5px -3px rgba(0, 0, 0, 0.5);
  1225 	z-index: 1;
  1228 	z-index: 1;
  1226 }
  1229 }
  1227 
  1230 
  1228 .background-position-control input[type="radio"]:focus ~ .button {
  1231 .background-position-control input[type="radio"]:focus ~ .button {
  1229 	border-color: #5b9dd9;
  1232 	border-color: #4f94d4;
  1230 	box-shadow: inset 0 2px 5px -3px rgba(0, 0, 0, 0.5), 0 0 3px rgba(0, 115, 170, 0.8);
  1233 	box-shadow: inset 0 2px 5px -3px rgba(0, 0, 0, 0.5), 0 0 3px rgba(34, 113, 177, 0.8);
  1231 	color: #23282d;
  1234 	color: #1d2327;
  1232 }
  1235 }
  1233 
  1236 
  1234 .background-position-control .background-position-center-icon,
  1237 .background-position-control .background-position-center-icon,
  1235 .background-position-control .background-position-center-icon:before {
  1238 .background-position-control .background-position-center-icon:before {
  1236 	display: inline-block;
  1239 	display: inline-block;
  1245 	vertical-align: top;
  1248 	vertical-align: top;
  1246 	width: 20px;
  1249 	width: 20px;
  1247 }
  1250 }
  1248 
  1251 
  1249 .background-position-control .background-position-center-icon:before {
  1252 .background-position-control .background-position-center-icon:before {
  1250 	background-color: #555;
  1253 	background-color: #50575e;
  1251 	border-radius: 50%;
  1254 	border-radius: 50%;
  1252 	content: "";
  1255 	content: "";
  1253 	height: 12px;
  1256 	height: 12px;
  1254 	width: 12px;
  1257 	width: 12px;
  1255 }
  1258 }
  1256 
  1259 
  1257 .background-position-control .button:hover .background-position-center-icon:before,
  1260 .background-position-control .button:hover .background-position-center-icon:before,
  1258 .background-position-control input[type="radio"]:focus ~ .button .background-position-center-icon:before {
  1261 .background-position-control input[type="radio"]:focus ~ .button .background-position-center-icon:before {
  1259 	background-color: #23282d;
  1262 	background-color: #1d2327;
  1260 }
  1263 }
  1261 
  1264 
  1262 .background-position-control .button-group {
  1265 .background-position-control .button-group {
  1263 	display: block;
  1266 	display: block;
  1264 }
  1267 }
  1279 .background-position-control .button-group .button:focus {
  1282 .background-position-control .button-group .button:focus {
  1280 	z-index: 1;
  1283 	z-index: 1;
  1281 }
  1284 }
  1282 
  1285 
  1283 .background-position-control .button-group:last-child .button {
  1286 .background-position-control .button-group:last-child .button {
  1284 	box-shadow: 0 1px 0 #ccc;
  1287 	box-shadow: 0 1px 0 #c3c4c7;
  1285 }
  1288 }
  1286 
  1289 
  1287 .background-position-control .button-group > label {
  1290 .background-position-control .button-group > label {
  1288 	margin: 0 !important;
  1291 	margin: 0 !important;
  1289 }
  1292 }
  1362 	bottom: 0;
  1365 	bottom: 0;
  1363 	left: 0;
  1366 	left: 0;
  1364 	padding: 0;
  1367 	padding: 0;
  1365 	margin: 0;
  1368 	margin: 0;
  1366 	z-index: 10;
  1369 	z-index: 10;
  1367 	background: #eee;
  1370 	background: #f0f0f1;
  1368 	border-right: none;
  1371 	border-right: none;
  1369 }
  1372 }
  1370 
  1373 
  1371 .wp-full-overlay.collapsed .wp-full-overlay-sidebar {
  1374 .wp-full-overlay.collapsed .wp-full-overlay-sidebar {
  1372 	overflow: visible;
  1375 	overflow: visible;
  1469 	display: block;
  1472 	display: block;
  1470 	position: relative;
  1473 	position: relative;
  1471 	float: left;
  1474 	float: left;
  1472 	width: 45px;
  1475 	width: 45px;
  1473 	height: 45px;
  1476 	height: 45px;
  1474 	background: #eee;
  1477 	background: #f0f0f1;
  1475 	border-right: 1px solid #ddd;
  1478 	border-right: 1px solid #dcdcde;
  1476 	color: #444;
  1479 	color: #3c434a;
  1477 	cursor: pointer;
  1480 	cursor: pointer;
  1478 	text-decoration: none;
  1481 	text-decoration: none;
  1479 	transition: color .1s ease-in-out, background .1s ease-in-out;
  1482 	transition: color .1s ease-in-out, background .1s ease-in-out;
  1480 }
  1483 }
  1481 
  1484 
  1483 .theme-install-overlay .close-full-overlay:focus,
  1486 .theme-install-overlay .close-full-overlay:focus,
  1484 .theme-install-overlay .previous-theme:hover,
  1487 .theme-install-overlay .previous-theme:hover,
  1485 .theme-install-overlay .previous-theme:focus,
  1488 .theme-install-overlay .previous-theme:focus,
  1486 .theme-install-overlay .next-theme:hover,
  1489 .theme-install-overlay .next-theme:hover,
  1487 .theme-install-overlay .next-theme:focus {
  1490 .theme-install-overlay .next-theme:focus {
  1488 	background: #ddd;
  1491 	background: #dcdcde;
  1489 	border-color: #ccc;
  1492 	border-color: #c3c4c7;
  1490 	color: #000;
  1493 	color: #000;
  1491 	outline: none;
  1494 	outline: none;
  1492 	box-shadow: none;
  1495 	box-shadow: none;
  1493 }
  1496 }
  1494 
  1497 
  1520 .theme-install-overlay .next-theme.disabled,
  1523 .theme-install-overlay .next-theme.disabled,
  1521 .theme-install-overlay .previous-theme.disabled:hover,
  1524 .theme-install-overlay .previous-theme.disabled:hover,
  1522 .theme-install-overlay .previous-theme.disabled:focus,
  1525 .theme-install-overlay .previous-theme.disabled:focus,
  1523 .theme-install-overlay .next-theme.disabled:hover,
  1526 .theme-install-overlay .next-theme.disabled:hover,
  1524 .theme-install-overlay .next-theme.disabled:focus {
  1527 .theme-install-overlay .next-theme.disabled:focus {
  1525 	color: #b4b9be;
  1528 	color: #c3c4c7;
  1526 	background: #eee;
  1529 	background: #f0f0f1;
  1527 	cursor: default;
  1530 	cursor: default;
  1528 	pointer-events: none;
  1531 	pointer-events: none;
  1529 }
  1532 }
  1530 
  1533 
  1531 .theme-install-overlay .close-full-overlay,
  1534 .theme-install-overlay .close-full-overlay,
  1548 	position: fixed;
  1551 	position: fixed;
  1549 	bottom: 0;
  1552 	bottom: 0;
  1550 	left: 0;
  1553 	left: 0;
  1551 	padding: 9px 0 9px 10px;
  1554 	padding: 9px 0 9px 10px;
  1552 	height: 45px;
  1555 	height: 45px;
  1553 	color: #656a6f;
  1556 	color: #646970;
  1554 	outline: 0;
  1557 	outline: 0;
  1555 	line-height: 1;
  1558 	line-height: 1;
  1556 	background-color: transparent !important;
  1559 	background-color: transparent !important;
  1557 	border: none !important;
  1560 	border: none !important;
  1558 	box-shadow: none !important;
  1561 	box-shadow: none !important;
  1559 	border-radius: 0 !important;
  1562 	border-radius: 0 !important;
  1560 }
  1563 }
  1561 
  1564 
  1562 .wp-core-ui .wp-full-overlay .collapse-sidebar:hover,
  1565 .wp-core-ui .wp-full-overlay .collapse-sidebar:hover,
  1563 .wp-core-ui .wp-full-overlay .collapse-sidebar:focus {
  1566 .wp-core-ui .wp-full-overlay .collapse-sidebar:focus {
  1564 	color: #0073aa;
  1567 	color: #2271b1;
  1565 }
  1568 }
  1566 
  1569 
  1567 .wp-full-overlay .collapse-sidebar-arrow,
  1570 .wp-full-overlay .collapse-sidebar-arrow,
  1568 .wp-full-overlay .collapse-sidebar-label {
  1571 .wp-full-overlay .collapse-sidebar-label {
  1569 	display: inline-block;
  1572 	display: inline-block;
  1580 }
  1583 }
  1581 
  1584 
  1582 .wp-full-overlay .collapse-sidebar:hover .collapse-sidebar-arrow,
  1585 .wp-full-overlay .collapse-sidebar:hover .collapse-sidebar-arrow,
  1583 .wp-full-overlay .collapse-sidebar:focus .collapse-sidebar-arrow {
  1586 .wp-full-overlay .collapse-sidebar:focus .collapse-sidebar-arrow {
  1584 	box-shadow:
  1587 	box-shadow:
  1585 		0 0 0 1px #5b9dd9,
  1588 		0 0 0 1px #4f94d4,
  1586 		0 0 2px 1px rgba(30, 140, 190, 0.8);
  1589 		0 0 2px 1px rgba(79, 148, 212, 0.8);
  1587 }
  1590 }
  1588 
  1591 
  1589 .wp-full-overlay .collapse-sidebar-label {
  1592 .wp-full-overlay .collapse-sidebar-label {
  1590 	margin-left: 3px;
  1593 	margin-left: 3px;
  1591 }
  1594 }
  1595 }
  1598 }
  1596 
  1599 
  1597 .wp-full-overlay .collapse-sidebar-arrow:before {
  1600 .wp-full-overlay .collapse-sidebar-arrow:before {
  1598 	display: block;
  1601 	display: block;
  1599 	content: "\f148";
  1602 	content: "\f148";
  1600 	background: #eee;
  1603 	background: #f0f0f1;
  1601 	font: normal 20px/1 dashicons;
  1604 	font: normal 20px/1 dashicons;
  1602 	speak: none;
  1605 	speak: never;
  1603 	padding: 0;
  1606 	padding: 0;
  1604 	-webkit-font-smoothing: antialiased;
  1607 	-webkit-font-smoothing: antialiased;
  1605 	-moz-osx-font-smoothing: grayscale;
  1608 	-moz-osx-font-smoothing: grayscale;
  1606 }
  1609 }
  1607 
  1610 
  1629 }
  1632 }
  1630 
  1633 
  1631 /* Device/preview size toggles */
  1634 /* Device/preview size toggles */
  1632 
  1635 
  1633 .wp-full-overlay {
  1636 .wp-full-overlay {
  1634 	background: #191e23;
  1637 	background: #1d2327;
  1635 }
  1638 }
  1636 
  1639 
  1637 .wp-full-overlay-main {
  1640 .wp-full-overlay-main {
  1638 	background-color: #f1f1f1;
  1641 	background-color: #f0f0f1;
  1639 }
  1642 }
  1640 
  1643 
  1641 .expanded .wp-full-overlay-footer {
  1644 .expanded .wp-full-overlay-footer {
  1642 	position: fixed;
  1645 	position: fixed;
  1643 	bottom: 0;
  1646 	bottom: 0;
  1645 	min-width: 299px;
  1648 	min-width: 299px;
  1646 	max-width: 599px;
  1649 	max-width: 599px;
  1647 	width: 18%;
  1650 	width: 18%;
  1648 	width: calc( 18% - 1px );
  1651 	width: calc( 18% - 1px );
  1649 	height: 45px;
  1652 	height: 45px;
  1650 	border-top: 1px solid #ddd;
  1653 	border-top: 1px solid #dcdcde;
  1651 	background: #eee;
  1654 	background: #f0f0f1;
  1652 }
  1655 }
  1653 
  1656 
  1654 .wp-full-overlay-footer .devices-wrapper {
  1657 .wp-full-overlay-footer .devices-wrapper {
  1655 	float: right;
  1658 	float: right;
  1656 }
  1659 }
  1657 
  1660 
  1658 .wp-full-overlay-footer .devices {
  1661 .wp-full-overlay-footer .devices {
  1659 	position: relative;
  1662 	position: relative;
  1660 	background: #eee;
  1663 	background: #f0f0f1;
  1661 	box-shadow: -20px 0 10px -5px #eee;
  1664 	box-shadow: -20px 0 10px -5px #f0f0f1;
  1662 }
  1665 }
  1663 
  1666 
  1664 .wp-full-overlay-footer .devices button {
  1667 .wp-full-overlay-footer .devices button {
  1665 	cursor: pointer;
  1668 	cursor: pointer;
  1666 	background: transparent;
  1669 	background: transparent;
  1687 	-webkit-font-smoothing: antialiased;
  1690 	-webkit-font-smoothing: antialiased;
  1688 	font: normal 20px/30px "dashicons";
  1691 	font: normal 20px/30px "dashicons";
  1689 	vertical-align: top;
  1692 	vertical-align: top;
  1690 	margin: 3px 0;
  1693 	margin: 3px 0;
  1691 	padding: 4px 8px;
  1694 	padding: 4px 8px;
  1692 	color: #656a6f;
  1695 	color: #646970;
  1693 }
  1696 }
  1694 
  1697 
  1695 .wp-full-overlay-footer .devices button.active {
  1698 .wp-full-overlay-footer .devices button.active {
  1696 	border-bottom-color: #191e23;
  1699 	border-bottom-color: #1d2327;
  1697 }
  1700 }
  1698 
  1701 
  1699 .wp-full-overlay-footer .devices button:hover,
  1702 .wp-full-overlay-footer .devices button:hover,
  1700 .wp-full-overlay-footer .devices button:focus {
  1703 .wp-full-overlay-footer .devices button:focus {
  1701 	background-color: #fff;
  1704 	background-color: #fff;
  1702 }
  1705 }
  1703 
  1706 
  1704 .wp-full-overlay-footer .devices button:focus,
  1707 .wp-full-overlay-footer .devices button:focus,
  1705 .wp-full-overlay-footer .devices button.active:hover {
  1708 .wp-full-overlay-footer .devices button.active:hover {
  1706 	border-bottom-color: #0073aa;
  1709 	border-bottom-color: #2271b1;
  1707 }
  1710 }
  1708 
  1711 
  1709 .wp-full-overlay-footer .devices button.active:before {
  1712 .wp-full-overlay-footer .devices button.active:before {
  1710 	color: #191e23;
  1713 	color: #1d2327;
  1711 }
  1714 }
  1712 
  1715 
  1713 .wp-full-overlay-footer .devices button:hover:before,
  1716 .wp-full-overlay-footer .devices button:hover:before,
  1714 .wp-full-overlay-footer .devices button:focus:before {
  1717 .wp-full-overlay-footer .devices button:focus:before {
  1715 	color: #0073aa;
  1718 	color: #2271b1;
  1716 }
  1719 }
  1717 
  1720 
  1718 .wp-full-overlay-footer .devices .preview-desktop:before {
  1721 .wp-full-overlay-footer .devices .preview-desktop:before {
  1719 	content: "\f472";
  1722 	content: "\f472";
  1720 }
  1723 }
  1769 	display: none;
  1772 	display: none;
  1770 }
  1773 }
  1771 
  1774 
  1772 #customize-container,
  1775 #customize-container,
  1773 #customize-controls .notice.notification-overlay {
  1776 #customize-controls .notice.notification-overlay {
  1774 	background: #eee;
  1777 	background: #f0f0f1;
  1775 	z-index: 500000;
  1778 	z-index: 500000;
  1776 	position: fixed;
  1779 	position: fixed;
  1777 	overflow: visible;
  1780 	overflow: visible;
  1778 	top: 0;
  1781 	top: 0;
  1779 	bottom: 0;
  1782 	bottom: 0;
  1841 }
  1844 }
  1842 
  1845 
  1843 .install-theme-info .theme-screenshot {
  1846 .install-theme-info .theme-screenshot {
  1844 	margin: 15px 0;
  1847 	margin: 15px 0;
  1845 	width: 258px;
  1848 	width: 258px;
  1846 	border: 1px solid #ccc;
  1849 	border: 1px solid #c3c4c7;
  1847 }
  1850 }
  1848 
  1851 
  1849 .install-theme-info .theme-details {
  1852 .install-theme-info .theme-details {
  1850 	overflow: hidden;
  1853 	overflow: hidden;
  1851 }
  1854 }
  1854 	margin: 15px 0;
  1857 	margin: 15px 0;
  1855 }
  1858 }
  1856 
  1859 
  1857 .theme-details .theme-description {
  1860 .theme-details .theme-description {
  1858 	float: left;
  1861 	float: left;
  1859 	color: #72777c;
  1862 	color: #646970;
  1860 	line-height: 1.6;
  1863 	line-height: 1.6;
  1861 	max-width: 100%;
  1864 	max-width: 100%;
  1862 }
  1865 }
  1863 
  1866 
  1864 .theme-install-overlay .wp-full-overlay-header .button {
  1867 .theme-install-overlay .wp-full-overlay-header .button {
  1865 	float: right;
  1868 	float: right;
  1866 	margin: 8px 10px 0 0;
  1869 	margin: 8px 10px 0 0;
  1867 }
  1870 }
  1868 
  1871 
  1869 .theme-install-overlay .wp-full-overlay-sidebar {
  1872 .theme-install-overlay .wp-full-overlay-sidebar {
  1870 	background: #eee;
  1873 	background: #f0f0f1;
  1871 	border-right: 1px solid #ddd;
  1874 	border-right: 1px solid #dcdcde;
  1872 }
  1875 }
  1873 
  1876 
  1874 .theme-install-overlay .wp-full-overlay-sidebar-content {
  1877 .theme-install-overlay .wp-full-overlay-sidebar-content {
  1875 	background: #fff;
  1878 	background: #fff;
  1876 	border-top: 1px solid #ddd;
  1879 	border-top: 1px solid #dcdcde;
  1877 	border-bottom: 1px solid #ddd;
  1880 	border-bottom: 1px solid #dcdcde;
  1878 }
  1881 }
  1879 
  1882 
  1880 .theme-install-overlay .wp-full-overlay-main {
  1883 .theme-install-overlay .wp-full-overlay-main {
  1881 	position: absolute;
  1884 	position: absolute;
  1882 	z-index: 0;
  1885 	z-index: 0;
  1883 	background-color: #f1f1f1;
  1886 	background-color: #f0f0f1;
  1884 }
  1887 }
  1885 
  1888 
  1886 .customize-loading #customize-container {
  1889 .customize-loading #customize-container {
  1887 	background-color: #f1f1f1;
  1890 	background-color: #f0f0f1;
  1888 }
  1891 }
  1889 
  1892 
  1890 #customize-preview.wp-full-overlay-main:before,
  1893 #customize-preview.wp-full-overlay-main:before,
  1891 .customize-loading #customize-container:before,
  1894 .customize-loading #customize-container:before,
  1892 #customize-controls .notice.notification-overlay.notification-loading:before,
  1895 #customize-controls .notice.notification-overlay.notification-loading:before,
  1973 @media aural {
  1976 @media aural {
  1974 	.theme .notice:before,
  1977 	.theme .notice:before,
  1975 	.theme-info .updating-message:before,
  1978 	.theme-info .updating-message:before,
  1976 	.theme-info .updated-message:before,
  1979 	.theme-info .updated-message:before,
  1977 	.theme-install.updating-message:before {
  1980 	.theme-install.updating-message:before {
  1978 		speak: none;
  1981 		speak: never;
  1979 	}
  1982 	}
  1980 }
  1983 }