wp/wp-admin/css/customize-controls.css
changeset 5 5e2f62d02dcd
parent 0 d970ebf37754
child 7 cf61fcea0001
equal deleted inserted replaced
4:346c88efed21 5:5e2f62d02dcd
     1 body {
     1 body {
     2 	overflow: hidden;
     2 	overflow: hidden;
       
     3 	-webkit-text-size-adjust: 100%;
     3 }
     4 }
     4 
     5 
     5 #customize-controls a {
     6 #customize-controls a {
     6 	text-decoration: none;
     7 	text-decoration: none;
     7 }
     8 }
     8 
     9 
     9 #customize-info .accordion-section-content {
    10 #customize-controls h3 {
    10 	background: transparent;
    11 	font-size: 14px;
       
    12 }
       
    13 
       
    14 #customize-controls img {
       
    15 	max-width: 100%;
       
    16 }
       
    17 
       
    18 #customize-controls .submit {
       
    19 	text-align: center;
       
    20 }
       
    21 
       
    22 #customize-controls .description {
       
    23 	color: #666666;
       
    24 }
       
    25 
       
    26 #customize-header-actions .button-primary {
       
    27 	float: right;
       
    28 	margin-top: 9px;
       
    29 }
       
    30 
       
    31 #customize-header-actions .spinner {
       
    32 	margin-top: 13px;
       
    33 	margin-right: 4px;
       
    34 }
       
    35 
       
    36 .saving #customize-header-actions .spinner {
       
    37 	visibility: visible;
       
    38 }
       
    39 
       
    40 #customize-header-actions {
       
    41 	border-bottom: 1px solid #ddd;
       
    42 }
       
    43 
       
    44 #customize-header-actions .secondary-actions {
       
    45 	display: none;
       
    46 }
       
    47 
       
    48 #customize-controls .wp-full-overlay-sidebar-content {
       
    49 	overflow-y: auto;
       
    50 	overflow-x: hidden;
       
    51 }
       
    52 
       
    53 #customize-info {
       
    54 	border: none;
       
    55 	border-top: 1px solid #ddd;
       
    56 }
       
    57 
       
    58 #customize-info .accordion-section-title {
       
    59 	background-color: #fff;
       
    60 	color: #666666;
       
    61 	border-left: none;
       
    62 	border-right: none;
       
    63 	border-bottom: 1px solid #eeeeee;
       
    64 }
       
    65 
       
    66 #customize-info.open .accordion-section-title:after,
       
    67 #customize-info .accordion-section-title:hover:after,
       
    68 #customize-info .accordion-section-title:focus:after {
       
    69 	color: #555555;
    11 }
    70 }
    12 
    71 
    13 #customize-info .preview-notice {
    72 #customize-info .preview-notice {
    14 	font-size: 13px;
    73 	font-size: 13px;
    15 	line-height: 24px;
    74 	line-height: 24px;
    16 	color: #999;
       
    17 }
    75 }
    18 
    76 
    19 #customize-info .theme-name {
    77 #customize-info .theme-name {
    20 	font-size: 20px;
    78 	font-size: 20px;
    21 	font-weight: 200;
    79 	font-weight: 200;
    22 	line-height: 24px;
    80 	line-height: 24px;
    23 	color: #333;
    81 	display: block;
    24 	display: block;
       
    25 	text-shadow: 0 1px 0 #fff;
       
    26 }
    82 }
    27 
    83 
    28 #customize-info .theme-screenshot {
    84 #customize-info .theme-screenshot {
    29 	width: 258px;
    85 	width: 258px;
    30 	border: 1px solid #ccc;
       
    31 }
    86 }
    32 
    87 
    33 #customize-info .theme-description {
    88 #customize-info .theme-description {
    34 	margin-top: 1em;
    89 	margin-top: 1em;
    35 	color: #777;
    90 	color: #666666;
    36 	line-height: 20px;
    91 	line-height: 20px;
    37 }
    92 }
    38 
    93 
    39 #customize-controls .submit {
    94 #customize-theme-controls .control-section {
    40 	text-align: center;
    95 	border: none;
       
    96 }
       
    97 
       
    98 #customize-theme-controls .accordion-section-title {
       
    99 	color: #555555;
       
   100 	background-color: #fff;
       
   101 	border-bottom: 1px solid #eeeeee;
       
   102 }
       
   103 
       
   104 #customize-theme-controls .accordion-section-content {
       
   105 	color: #555555;
       
   106 	background: #fff;
       
   107 }
       
   108 
       
   109 #customize-info.open .accordion-section-title,
       
   110 #customize-info .accordion-section-title:hover,
       
   111 #customize-info .accordion-section-title:focus,
       
   112 #customize-theme-controls .control-section:hover > .accordion-section-title,
       
   113 #customize-theme-controls .control-section .accordion-section-title:hover,
       
   114 #customize-theme-controls .control-section.open .accordion-section-title,
       
   115 #customize-theme-controls .control-section .accordion-section-title:focus {
       
   116 	color: #23282d;
       
   117 	background: #f5f5f5;
       
   118 }
       
   119 
       
   120 .js .control-section:hover .accordion-section-title,
       
   121 .js .control-section .accordion-section-title:hover,
       
   122 .js .control-section.open .accordion-section-title,
       
   123 .js .control-section .accordion-section-title:focus {
       
   124 	background: #f5f5f5;
       
   125 }
       
   126 
       
   127 #customize-theme-controls .control-section:hover > .accordion-section-title:after,
       
   128 #customize-theme-controls .control-section .accordion-section-title:hover:after,
       
   129 #customize-theme-controls .control-section.open .accordion-section-title:after,
       
   130 #customize-theme-controls .control-section .accordion-section-title:focus:after {
       
   131 	color: #555;
       
   132 }
       
   133 
       
   134 #customize-info.open,
       
   135 #customize-theme-controls .control-section.open {
       
   136 	border-bottom: 1px solid #eeeeee;
       
   137 }
       
   138 
       
   139 #customize-theme-controls .control-section.open .accordion-section-title {
       
   140 	border-bottom-color: #eeeeee !important;
       
   141 }
       
   142 
       
   143 #customize-theme-controls .control-section:last-of-type.open,
       
   144 #customize-theme-controls .control-section:last-of-type > .accordion-section-title {
       
   145 	border-bottom-color: #ddd;
    41 }
   146 }
    42 
   147 
    43 #customize-theme-controls > ul,
   148 #customize-theme-controls > ul,
    44 #customize-theme-controls .accordion-section-content {
   149 #customize-theme-controls .accordion-section-content {
    45 	margin: 0;
   150 	margin: 0;
    46 }
   151 }
    47 
   152 
    48 #customize-header-actions .button-primary {
   153 .control-section.control-panel > .accordion-section-title {
    49 	float: right;
   154 	padding-right: 54px;
    50 	margin-top: 10px;
   155 }
    51 }
   156 
    52 
   157 .control-section.control-panel > .accordion-section-title:after {
    53 #customize-header-actions .spinner {
   158 	content: "\f345";
    54 	margin-top: 16px;
   159 	background: #f5f5f5;
    55 	margin-right: 4px;
   160 	color: #555;
    56 }
   161 	width: 38px;
    57 
   162 	height: 100%;
    58 .saving #customize-header-actions .spinner {
   163 	margin: -11px -10px -11px 0; /* compensate for positioning */
    59 	display: block;
   164 	line-height: 45px;
       
   165 	padding-left: 5px;
       
   166 	border-left: 1px solid #eee;
       
   167 	z-index: 0;
       
   168 }
       
   169 
       
   170 #customize-theme-controls .control-section.control-panel > h3.accordion-section-title:focus:after,
       
   171 #customize-theme-controls .control-section.control-panel > h3.accordion-section-title:hover:after {
       
   172 	background: #ddd;
       
   173 	color: #000;
       
   174 	border: 1px solid #d9d9d9;
       
   175 	border-right: none;
       
   176 	margin-top: -12px;
       
   177 	line-height: 44px;
       
   178 	z-index: 1;
       
   179 }
       
   180 
       
   181 .accordion-sub-container.control-panel-content {
       
   182 	display: none;
       
   183 	position: absolute;
       
   184 	left: 300px;
       
   185 	top: 0;
       
   186 	width: 300px;
       
   187 	border-top: 1px solid #ddd;
       
   188 	-webkit-transition: left ease-in-out .18s;
       
   189 	transition: left ease-in-out .18s;
       
   190 }
       
   191 
       
   192 .accordion-sub-container.control-panel-content.animating {
       
   193 	display: block;
       
   194 }
       
   195 
       
   196 .current-panel .accordion-sub-container.control-panel-content {
       
   197 	width: 100%;
       
   198 }
       
   199 
       
   200 .customize-overlay-close,
       
   201 .customize-controls-close {
       
   202 	display: block;
       
   203 	position: absolute;
       
   204 	top: 0;
       
   205 	left: 0;
       
   206 	width: 45px;
       
   207 	height: 45px;
       
   208 	padding: 0 2px 0 0;
       
   209 	background: #eee;
       
   210 	border: none;
       
   211 	border-right: 1px solid #ddd;
       
   212 	color: #444;
       
   213 	text-align: left;
       
   214 	cursor: pointer;
       
   215 	-webkit-transition: color .1s ease-in-out, background .1s ease-in-out;
       
   216 	transition: color .1s ease-in-out, background .1s ease-in-out;
       
   217 	-webkit-box-sizing: content-box;
       
   218 	-moz-box-sizing: content-box;
       
   219 	box-sizing: content-box;
       
   220 }
       
   221 
       
   222 .customize-overlay-close {
       
   223 	left: auto;
       
   224 	right: 0;
       
   225 	border-right: 0;
       
   226 	border-left: 1px solid #ddd;
       
   227 }
       
   228 
       
   229 .control-panel-back {
       
   230 	display: block;
       
   231 	position: fixed;
       
   232 	top: 0;
       
   233 	z-index: 99;
       
   234 	left: -48px;
       
   235 	width: 45px;
       
   236 	height: 45px;
       
   237 	padding-right: 2px;
       
   238 	background: #eee;
       
   239 	border-right: 1px solid #ddd;
       
   240 	cursor: pointer;
       
   241 	-webkit-transition: left .18s ease-in-out, color .1s ease-in-out, background .1s ease-in-out;
       
   242 	transition: left .18s ease-in-out, color .1s ease-in-out, background .1s ease-in-out;
       
   243 }
       
   244 
       
   245 .ios .control-panel-back {
       
   246 	-webkit-transition: left 0s;
       
   247 	transition: left 0s;
       
   248 }
       
   249 
       
   250 .collapsed .control-panel-back {
       
   251 	display: none;
       
   252 }
       
   253 
       
   254 .customize-overlay-close:focus,
       
   255 .customize-overlay-close:hover,
       
   256 .customize-controls-close:focus,
       
   257 .customize-controls-close:hover,
       
   258 .control-panel-back:focus,
       
   259 .control-panel-back:hover,
       
   260 .customize-controls-preview-toggle:focus,
       
   261 .customize-controls-preview-toggle:hover {
       
   262 	background: #ddd;
       
   263 	border-color: #ccc;
       
   264 	color: #000;
       
   265 	outline: none;
       
   266 	-webkit-box-shadow: none;
       
   267 	box-shadow: none;
       
   268 }
       
   269 
       
   270 .customize-overlay-close:before,
       
   271 .customize-controls-close:before {
       
   272 	font: normal 22px/45px dashicons;
       
   273 	content: "\f335";
       
   274 	position: relative;
       
   275 	top: 1px;
       
   276 	left: 13px;
       
   277 }
       
   278 
       
   279 .control-panel-back:before {
       
   280 	font: normal 20px/45px dashicons;
       
   281 	content: "\f341";
       
   282 	position: relative;
       
   283 	top: 1px;
       
   284 	left: 13px;
       
   285 }
       
   286 
       
   287 .in-sub-panel .control-panel-back {
       
   288 	left: 0;
       
   289 }
       
   290 
       
   291 .current-panel > .accordion-section-title {
       
   292 	height: 22px;
       
   293 }
       
   294 
       
   295 .wp-full-overlay-sidebar .wp-full-overlay-header {
       
   296 	-webkit-transition: padding ease-in-out .18s;
       
   297 	transition: padding ease-in-out .18s;
       
   298 }
       
   299 
       
   300 .in-sub-panel .wp-full-overlay-sidebar .wp-full-overlay-header {
       
   301 	padding-left: 62px;
       
   302 }
       
   303 
       
   304 #customize-info,
       
   305 #customize-theme-controls > ul > .accordion-section {
       
   306 	position: relative;
       
   307 	left: 0;
       
   308 	-webkit-transition: left ease-in-out .18s;
       
   309 	transition: left ease-in-out .18s;
       
   310 }
       
   311 
       
   312 .ios #customize-info,
       
   313 .ios #customize-theme-controls > ul > .accordion-section {
       
   314 	-webkit-transition: left 0s;
       
   315 	transition: left 0s;
       
   316 }
       
   317 
       
   318 .in-sub-panel #customize-info,
       
   319 .in-sub-panel #customize-theme-controls > ul > .accordion-section {
       
   320 	left: -300px;
       
   321 	width: 300px;
       
   322 }
       
   323 
       
   324 .in-sub-panel #customize-theme-controls .accordion-section.current-panel {
       
   325 	width: 100%;
       
   326 }
       
   327 
       
   328 #customize-theme-controls .control-section.current-panel {
       
   329 	padding: 0;
       
   330 }
       
   331 
       
   332 #customize-theme-controls .control-section > h3.accordion-section-title {
       
   333 	position: relative;
       
   334 	left: 0;
       
   335 }
       
   336 
       
   337 #customize-theme-controls .control-section.current-panel > h3.accordion-section-title {
       
   338 	left: -354px;
       
   339 	-webkit-transition: left ease-in-out .18s;
       
   340 	transition: left ease-in-out .18s;
       
   341 }
       
   342 
       
   343 .ios #customize-theme-controls .control-section.current-panel > h3.accordion-section-title {
       
   344 	-webkit-transition: left 0s;
       
   345 	transition: left 0s;
       
   346 }
       
   347 
       
   348 .control-section.control-panel .accordion-section-title .panel-title {
       
   349 	font-size: 20px;
       
   350 	font-weight: 200;
       
   351 	line-height: 24px;
       
   352 	display: block;
       
   353 	border: none;
       
   354 }
       
   355 
       
   356 .control-section.control-panel .preview-notice {
       
   357 	font-size: 13px;
       
   358 	line-height: 24px;
       
   359 }
       
   360 
       
   361 p.customize-section-description {
       
   362 	font-style: normal;
    60 }
   363 }
    61 
   364 
    62 .customize-control {
   365 .customize-control {
    63 	width: 100%;
   366 	width: 100%;
    64 	float: left;
   367 	float: left;
    65 	clear: both;
   368 	clear: both;
    66 	margin-bottom: 8px;
   369 	margin-bottom: 8px;
    67 }
   370 }
    68 
   371 
    69 .customize-control-title {
       
    70 	display: block;
       
    71 	line-height: 24px;
       
    72 	font-weight: bold;
       
    73 }
       
    74 
       
    75 .customize-control select,
   372 .customize-control select,
       
   373 .customize-control input[type="radio"],
       
   374 .customize-control input[type="checkbox"] {
       
   375 	line-height: 28px;
       
   376 }
       
   377 
    76 .customize-control input[type="text"],
   378 .customize-control input[type="text"],
    77 .customize-control input[type="radio"],
   379 .customize-control input[type="password"],
    78 .customize-control input[type="checkbox"],
   380 .customize-control input[type="email"],
    79 .customize-control-color .color-picker,
   381 .customize-control input[type="number"],
    80 .customize-control-checkbox label,
   382 .customize-control input[type="search"],
    81 .customize-control-upload div {
   383 .customize-control input[type="tel"],
    82 	line-height: 28px;
   384 .customize-control input[type="url"] {
    83 }
       
    84 
       
    85 .customize-control input[type="text"] {
       
    86 	width: 98%;
   385 	width: 98%;
    87 	line-height: 18px;
   386 	line-height: 18px;
    88 	margin: 0;
   387 	margin: 0;
       
   388 }
       
   389 
       
   390 .customize-control-hidden {
       
   391 	margin: 0;
       
   392 }
       
   393 
       
   394 .customize-control-textarea textarea {
       
   395 	width: 100%;
       
   396 	resize: vertical;
    89 }
   397 }
    90 
   398 
    91 .customize-control select {
   399 .customize-control select {
    92 	min-width: 50%;
   400 	min-width: 50%;
    93 	max-width: 100%;
   401 	max-width: 100%;
    94 	height: 28px;
   402 	height: 28px;
    95 	line-height: 28px;
   403 	line-height: 28px;
    96 }
   404 }
    97 
   405 
       
   406 .customize-control select[multiple] {
       
   407 	height: auto;
       
   408 }
       
   409 
       
   410 .customize-control-title {
       
   411 	display: block;
       
   412 	font-size: 14px;
       
   413 	line-height: 24px;
       
   414 	font-weight: 600;
       
   415 	margin-bottom: 5px;
       
   416 }
       
   417 
       
   418 .customize-control-description {
       
   419 	display: block;
       
   420 	font-style: italic;
       
   421 	line-height: 18px;
       
   422 	margin-bottom: 5px;
       
   423 }
       
   424 
       
   425 .customize-control-color .color-picker,
       
   426 .customize-control-checkbox label,
       
   427 .customize-control-upload div {
       
   428 	line-height: 28px;
       
   429 }
       
   430 
    98 .customize-control-checkbox input {
   431 .customize-control-checkbox input {
    99 	margin-right: 5px;
   432 	margin-right: 5px;
   100 }
   433 }
   101 
   434 
   102 .customize-control-radio {
   435 .customize-control-radio {
   106 .customize-control-radio .customize-control-title {
   439 .customize-control-radio .customize-control-title {
   107 	margin-bottom: 0;
   440 	margin-bottom: 0;
   108 	line-height: 22px;
   441 	line-height: 22px;
   109 }
   442 }
   110 
   443 
       
   444 .customize-control-radio .customize-control-title + .customize-control-description {
       
   445 	margin-top: 7px;
       
   446 }
       
   447 
   111 .customize-control-radio label {
   448 .customize-control-radio label {
   112 	line-height: 20px;
   449 	line-height: 32px;
   113 }
   450 }
   114 
   451 
   115 .customize-control-radio input {
   452 .customize-control-radio input {
   116 	margin-right: 5px;
   453 	margin-right: 5px;
   117 }
   454 }
   118 
   455 
       
   456 .customize-control .attachment-thumb.type-icon {
       
   457 	float: left;
       
   458 	margin: 10px;
       
   459 	width: auto;
       
   460 }
       
   461 
       
   462 .customize-control .attachment-title {
       
   463 	font-weight: bold;
       
   464 	margin: 0;
       
   465 	padding: 5px 10px;
       
   466 }
       
   467 
       
   468 .customize-control .attachment-meta {
       
   469 	white-space: nowrap;
       
   470 	overflow: hidden;
       
   471 	text-overflow: ellipsis;
       
   472 	margin: 0;
       
   473 	padding: 0 10px;
       
   474 }
       
   475 
       
   476 .customize-control .attachment-meta-title {
       
   477 	padding-top: 7px;
       
   478 }
       
   479 
       
   480 .customize-control .thumbnail-image {
       
   481 	line-height: 0;
       
   482 }
       
   483 
       
   484 .customize-control .thumbnail-image img {
       
   485 	cursor: pointer;
       
   486 }
       
   487 
       
   488 #customize-controls .thumbnail-audio .thumbnail {
       
   489 	max-width: 64px;
       
   490 	max-height: 64px;
       
   491 	margin: 10px;
       
   492 	float: left;
       
   493 }
       
   494 
   119 #customize-preview iframe {
   495 #customize-preview iframe {
   120 	width: 100%;
   496 	width: 100%;
   121 	height: 100%;
   497 	height: 100%;
   122 }
   498 }
   123 
   499 
   124 #customize-theme-controls .accordion-section-title:hover:after,
   500 .wp-full-overlay-sidebar {
   125 #customize-theme-controls .accordion-section-title:focus:after {
   501 	background: #eeeeee;
   126 	border-color: #eee transparent;
   502 	border-right: 1px solid #ddd;
   127 }
   503 }
   128 
   504 
   129 #customize-theme-controls .control-section:hover .accordion-section-title,
   505 .collapse-sidebar {
   130 #customize-theme-controls .control-section .accordion-section-title:hover,
   506 	background-color: transparent !important;
   131 #customize-theme-controls .control-section.open .accordion-section-title,
   507 	border: none !important;
   132 #customize-theme-controls .control-section .accordion-section-title:focus {
   508 	-webkit-box-shadow: none !important;
   133 	color: #fff;
   509 	box-shadow: none !important;
   134 	text-shadow: 0 -1px 0 #333;
   510 	-webkit-border-radius: 0 !important;
   135 	background: #808080;
   511 	border-radius: 0 !important;
   136 	background-image: -webkit-gradient(linear, left bottom, left top, from(#6d6d6d), to(#808080));
   512 }
   137 	background-image: -webkit-linear-gradient(bottom, #6d6d6d, #808080);
   513 
   138 	background-image:    -moz-linear-gradient(bottom, #6d6d6d, #808080);
   514 
   139 	background-image:      -o-linear-gradient(bottom, #6d6d6d, #808080);
   515 .collapse-sidebar:active,
   140 	background-image: linear-gradient(to top, #6d6d6d, #808080);
   516 .collapse-sidebar:active .collapse-sidebar-label,
   141 	border-left: 1px solid #808080;
   517 .collapse-sidebar:active .collapse-sidebar-arrow:before {
   142 	border-right: 1px solid #808080;
   518 	text-shadow: none;
   143 }
   519 }
   144 
   520 
   145 #customize-theme-controls .control-section.accordion-section:hover,
   521 .collapsed .collapse-sidebar-arrow:before {
   146 #customize-theme-controls .control-section.accordion-section.open {
   522 	color: #82878c;
   147 	border-top-color: #808080;
   523 }
   148 }
   524 
   149 
   525 /* Style for custom settings */
   150 #customize-theme-controls .control-section.open .accordion-section-title {
       
   151 	border-bottom: 1px solid #6d6d6d;
       
   152 }
       
   153 
       
   154 /*
       
   155  * Style for custom settings
       
   156  */
       
   157 
   526 
   158 /*
   527 /*
   159  * Dropdowns
   528  * Dropdowns
   160  */
   529  */
   161 .accordion-section .dropdown {
   530 .accordion-section .dropdown {
   162 	float: left;
   531 	float: left;
   163 	display: block;
   532 	display: block;
   164 	position: relative;
   533 	position: relative;
   165 	cursor: pointer;
   534 	cursor: pointer;
   166 
       
   167 	-webkit-border-radius: 3px;
       
   168 	border-radius: 3px;
       
   169 }
   535 }
   170 
   536 
   171 .accordion-section .dropdown-content {
   537 .accordion-section .dropdown-content {
   172 	overflow: hidden;
   538 	overflow: hidden;
   173 	float: left;
   539 	float: left;
   174 	min-width: 30px;
   540 	min-width: 30px;
   175 	height: 16px;
   541 	height: 16px;
   176 	line-height: 16px;
   542 	line-height: 16px;
   177 	margin-right: 16px;
   543 	margin-right: 16px;
   178 	padding: 4px 5px;
   544 	padding: 4px 5px;
   179 	background-color: #eee;
   545 	border: 2px solid #eeeeee;
   180 	border: 1px solid #ccc;
       
   181 	-webkit-border-radius: 3px 0 0 3px;
       
   182 	border-radius: 3px 0 0 3px;
       
   183 
       
   184 	-webkit-user-select: none;
   546 	-webkit-user-select: none;
   185 	-moz-user-select: none;
   547 	-moz-user-select: none;
       
   548 	-ms-user-select: none;
   186 	user-select: none;
   549 	user-select: none;
   187 }
   550 }
   188 
   551 
   189 .customize-control .dropdown-arrow {
   552 .customize-control .dropdown-arrow {
   190 	position: absolute;
   553 	position: absolute;
   191 	top: 0;
   554 	top: 0;
   192 	bottom: 0;
   555 	bottom: 0;
   193 	right: 0;
   556 	right: 0;
   194 	width: 15px;
   557 	width: 20px;
   195 
   558 	background: #eeeeee;
   196 	border-color: #ccc;
       
   197 	border-style: solid;
       
   198 	border-width: 1px 1px 1px 0;
       
   199 	-webkit-border-radius: 0 3px 3px 0;
       
   200 	border-radius: 0 3px 3px 0;
       
   201 }
   559 }
   202 
   560 
   203 .customize-control .dropdown-arrow:after {
   561 .customize-control .dropdown-arrow:after {
   204 	content: '';
   562 	content: "\f140";
   205 	width: 0;
   563 	font: normal 20px/1 'dashicons';
   206 	height: 0;
   564 	speak: none;
   207 	border-color: #ccc transparent;
   565 	display: block;
   208 	border-style: solid;
   566 	padding: 0;
   209 	border-width: 4px 4px 0 4px;
   567 	text-indent: 0;
   210 	position: absolute;
   568 	text-align: center;
   211 	top: 50%;
   569 	position: relative;
   212 	margin-top: -1px;
   570 	-webkit-font-smoothing: antialiased;
   213 	right: 4px;
   571 	-moz-osx-font-smoothing: grayscale;
   214 	z-index: 1;
   572 	text-decoration: none !important;
   215 }
   573 	color: #32373c;
   216 
       
   217 .accordion-section .dropdown:hover .dropdown-content,
       
   218 .customize-control .dropdown:hover .dropdown-arrow {
       
   219 	border-color: #aaa;
       
   220 }
       
   221 
       
   222 .accordion-section .dropdown:hover .dropdown-arrow:after {
       
   223 	border-color: #aaa transparent;
       
   224 }
   574 }
   225 
   575 
   226 .customize-control .dropdown-status {
   576 .customize-control .dropdown-status {
       
   577 	color: #32373c;
       
   578 	background: #eeeeee;
   227 	display: none;
   579 	display: none;
   228 	max-width: 112px;
   580 	max-width: 112px;
   229 	color: #777;
   581 }
   230 }
   582 
   231 
   583 /* Color Picker */
   232 /*
       
   233  * Color Picker
       
   234  */
       
   235 .customize-control-color .color-picker-hex {
   584 .customize-control-color .color-picker-hex {
   236 	display: none;
   585 	display: none;
   237 }
   586 }
   238 
   587 
   239 .customize-control-color.open .color-picker-hex {
   588 .customize-control-color.open .color-picker-hex {
   244 	margin-right: 5px;
   593 	margin-right: 5px;
   245 	margin-bottom: 5px;
   594 	margin-bottom: 5px;
   246 }
   595 }
   247 
   596 
   248 .customize-control-color .dropdown .dropdown-content {
   597 .customize-control-color .dropdown .dropdown-content {
   249 	background-color: #fff;
   598 	background-color: #555555;
   250 	border: 1px solid rgba( 0, 0, 0, 0.15 );
   599 	border: 1px solid rgba(0, 0, 0, 0.15);
   251 }
   600 }
   252 
   601 
   253 .customize-control-color .dropdown:hover .dropdown-content {
   602 .customize-control-color .dropdown:hover .dropdown-content {
   254 	border-color: rgba( 0, 0, 0, 0.25 );
   603 	border-color: rgba(0, 0, 0, 0.25);
   255 }
       
   256 
       
   257 .accordion-section input[type="text"].color-picker-hex {
       
   258 	width: 65px;
       
   259 	font-family: monospace;
       
   260 	text-align: center;
       
   261 	line-height: 16px;
       
   262 }
       
   263 
       
   264 /* The centered cursor overlaps the placeholder in webkit. Hide it when selected. */
       
   265 .accordion-section input[type="text"].color-picker-hex:focus::-webkit-input-placeholder {
       
   266 	color: transparent;
       
   267 }
       
   268 .accordion-section input[type="text"].color-picker-hex:-moz-placeholder {
       
   269 	color: #999;
       
   270 }
       
   271 
       
   272 /*
       
   273  * Image Picker
       
   274  */
       
   275 .customize-control-image .library,
       
   276 .customize-control-image .actions {
       
   277 	display: none;
       
   278 	float: left;
       
   279 	width: 100%;
       
   280 }
       
   281 
       
   282 .customize-control-image.open .library,
       
   283 .customize-control-image.open .actions {
       
   284 	display: block;
       
   285 }
       
   286 
       
   287 .accordion-section .customize-control-image .dropdown-content {
       
   288 	height: auto;
       
   289 	min-height: 24px;
       
   290 	min-width: 40px;
       
   291 	padding: 0;
       
   292 }
       
   293 
       
   294 .accordion-section .customize-control-image .dropdown-status {
       
   295 	padding: 4px 5px;
       
   296 }
       
   297 
       
   298 .accordion-section .customize-control-image .preview-thumbnail img {
       
   299 	display: block;
       
   300 	width: 100%;
       
   301 	max-width: 122px;
       
   302 	max-height: 98px;
       
   303 	margin: 0 auto;
       
   304 }
       
   305 
       
   306 .accordion-section .customize-control-image .actions {
       
   307 	text-align: right;
       
   308 }
       
   309 
       
   310 .accordion-section .customize-control-image .library ul {
       
   311 	border-bottom: 1px solid #dfdfdf;
       
   312 	float: left;
       
   313 	width: 100%;
       
   314 	margin: 10px 0 0;
       
   315 }
       
   316 
       
   317 .accordion-section .customize-control-image .library li {
       
   318 	color: #999;
       
   319 	float: left;
       
   320 	padding: 3px 5px;
       
   321 	margin: 0;
       
   322 	border-style: solid;
       
   323 	border-color: transparent;
       
   324 	border-width: 1px 1px 0 1px;
       
   325 }
       
   326 
       
   327 .accordion-section .customize-control-image .library li.library-selected {
       
   328 	margin-bottom: -1px;
       
   329 	padding-bottom: 4px;
       
   330 
       
   331 	color: #777;
       
   332 	background: #fdfdfd;
       
   333 	border-color: #dfdfdf;
       
   334 	-webkit-border-radius: 3px 3px 0 0;
       
   335 	border-radius: 3px 3px 0 0 ;
       
   336 }
       
   337 
       
   338 .accordion-section .customize-control-image .library-content {
       
   339 	display: none;
       
   340 	width: 100%;
       
   341 	float: left;
       
   342 	padding: 10px 0;
       
   343 }
       
   344 
       
   345 .accordion-section .customize-control-image .library-content.library-selected {
       
   346 	display: block;
       
   347 }
       
   348 
       
   349 .accordion-section .customize-control-image .library .thumbnail {
       
   350 	display: block;
       
   351 	width: 100%;
       
   352 }
       
   353 
       
   354 .accordion-section .customize-control-image .library .thumbnail:hover img {
       
   355 	border-color: #21759b;
       
   356 }
       
   357 
       
   358 .accordion-section .customize-control-image .library .thumbnail img {
       
   359 	display: block;
       
   360 	max-width: 90%;
       
   361 	max-height: 80px;
       
   362 
       
   363 	margin: 5px auto;
       
   364 	padding: 4px;
       
   365 	background: #fff;
       
   366 	border: 1px solid #dfdfdf;
       
   367 }
       
   368 
       
   369 .accordion-section .customize-control-upload .upload-fallback,
       
   370 .accordion-section .customize-control-image .upload-fallback {
       
   371 	display: none;
       
   372 }
       
   373 
       
   374 .accordion-section .customize-control-upload .upload-dropzone,
       
   375 .accordion-section .customize-control-image .upload-dropzone {
       
   376 	display: none;
       
   377 	padding: 15px 10px;
       
   378 	border: 3px dashed #dfdfdf;
       
   379 	margin: 5px auto;
       
   380 	text-align: center;
       
   381 	color: #777;
       
   382 	position: relative;
       
   383 	cursor: default;
       
   384 }
       
   385 
       
   386 .accordion-section .customize-control-upload .upload-dropzone.supports-drag-drop,
       
   387 .accordion-section .customize-control-image .upload-dropzone.supports-drag-drop {
       
   388 	display: block;
       
   389 	-webkit-transition: border-color 0.1s;
       
   390 	-moz-transition:    border-color 0.1s;
       
   391 	-ms-transition:     border-color 0.1s;
       
   392 	-o-transition:      border-color 0.1s;
       
   393 	transition:         border-color 0.1s;
       
   394 }
       
   395 
       
   396 .accordion-section .customize-control-upload .library ul li,
       
   397 .accordion-section .customize-control-image .library ul li {
       
   398 	cursor: pointer;
       
   399 }
       
   400 
       
   401 .accordion-section .customize-control-upload .upload-dropzone.supports-drag-drop.drag-over,
       
   402 .accordion-section .customize-control-image .upload-dropzone.supports-drag-drop.drag-over {
       
   403 	border-color: #83b4d8;
       
   404 }
   604 }
   405 
   605 
   406 /**
   606 /**
   407  * iOS can't scroll iframes,
   607  * iOS can't scroll iframes,
   408  * instead it expands the iframe size to match the size of the content
   608  * instead it expands the iframe size to match the size of the content
   417 
   617 
   418 .ios #customize-controls .wp-full-overlay-sidebar-content {
   618 .ios #customize-controls .wp-full-overlay-sidebar-content {
   419 	-webkit-overflow-scrolling: touch;
   619 	-webkit-overflow-scrolling: touch;
   420 }
   620 }
   421 
   621 
       
   622 /** Media controls **/
       
   623 
       
   624 .customize-control-media .current,
       
   625 .customize-control-upload .current,
       
   626 .customize-control-image .current,
       
   627 .customize-control-background .current,
       
   628 .customize-control-header .current {
       
   629 	margin-bottom: 8px;
       
   630 }
       
   631 
       
   632 .customize-control-header .uploaded {
       
   633 	margin-bottom: 18px;
       
   634 }
       
   635 
       
   636 .customize-control-header .uploaded button:not(.random),
       
   637 .customize-control-header .default button:not(.random) {
       
   638 	width: 100%;
       
   639 	padding: 0;
       
   640 	margin: 0;
       
   641 	background: none;
       
   642 	border: none;
       
   643 	color: inherit;
       
   644 	cursor: pointer;
       
   645 }
       
   646 
       
   647 .customize-control-header button img {
       
   648 	display: block;
       
   649 }
       
   650 
       
   651 .customize-control-media .remove-button,
       
   652 .customize-control-media .default-button,
       
   653 .customize-control-media .upload-button,
       
   654 .customize-control-upload .remove-button,
       
   655 .customize-control-upload .default-button,
       
   656 .customize-control-upload .upload-button,
       
   657 .customize-control-image .remove-button,
       
   658 .customize-control-image .default-button,
       
   659 .customize-control-image .upload-button,
       
   660 .customize-control-background .remove-button,
       
   661 .customize-control-background .default-button,
       
   662 .customize-control-background .upload-button,
       
   663 .customize-control-header button.new,
       
   664 .customize-control-header button.remove {
       
   665 	white-space: normal;
       
   666 	width: 48%;
       
   667 	height: auto;
       
   668 }
       
   669 
       
   670 .customize-control-media .current .container,
       
   671 .customize-control-upload .current .container,
       
   672 .customize-control-image .current .container,
       
   673 .customize-control-background .current .container,
       
   674 .customize-control-header .current .container {
       
   675 	overflow: hidden;
       
   676 	-webkit-border-radius: 2px;
       
   677 	border: 1px solid #eee;
       
   678 	-webkit-border-radius: 2px;
       
   679 	border-radius: 2px;
       
   680 }
       
   681 
       
   682 .customize-control-media .current .container,
       
   683 .customize-control-upload .current .container,
       
   684 .customize-control-background .current .container,
       
   685 .customize-control-image .current .container {
       
   686 	min-height: 40px;
       
   687 }
       
   688 
       
   689 .customize-control-media .placeholder,
       
   690 .customize-control-upload .placeholder,
       
   691 .customize-control-image .placeholder,
       
   692 .customize-control-background .placeholder,
       
   693 .customize-control-header .placeholder {
       
   694 	width: 100%;
       
   695 	position: relative;
       
   696 	text-align: center;
       
   697 	cursor: default;
       
   698 }
       
   699 
       
   700 .customize-control-media .inner,
       
   701 .customize-control-upload .inner,
       
   702 .customize-control-image .inner,
       
   703 .customize-control-background .inner,
       
   704 .customize-control-header .inner {
       
   705 	display: none;
       
   706 	position: absolute;
       
   707 	width: 100%;
       
   708 	color: #555;
       
   709 	white-space: nowrap;
       
   710 	text-overflow: ellipsis;
       
   711 	overflow: hidden;
       
   712 }
       
   713 
       
   714 .customize-control-media .inner,
       
   715 .customize-control-upload .inner,
       
   716 .customize-control-background .inner,
       
   717 .customize-control-image .inner {
       
   718 	display: block;
       
   719 	min-height: 40px;
       
   720 }
       
   721 
       
   722 .customize-control-media .inner,
       
   723 .customize-control-upload .inner,
       
   724 .customize-control-image .inner,
       
   725 .customize-control-background .inner,
       
   726 .customize-control-header .inner,
       
   727 .customize-control-header .inner .dashicons {
       
   728 	line-height: 20px;
       
   729 	top: 10px;
       
   730 }
       
   731 
       
   732 .customize-control-header .list .inner,
       
   733 .customize-control-header .list .inner .dashicons {
       
   734 	top: 9px;
       
   735 }
       
   736 
       
   737 .customize-control-header .header-view {
       
   738 	position: relative;
       
   739 	width: 100%;
       
   740 	margin-bottom: 5px;
       
   741 }
       
   742 
       
   743 .customize-control-header .header-view:last-child {
       
   744 	margin-bottom: 0px;
       
   745 }
       
   746 
       
   747 /* Convoluted, but 'outline' support isn't good enough yet */
       
   748 .customize-control-header .header-view:after {
       
   749 	border: 0;
       
   750 }
       
   751 .customize-control-header .header-view.selected:after {
       
   752 	content: '';
       
   753 	position: absolute;
       
   754 	height: auto;
       
   755 	top: 0; left: 0; bottom: 0; right: 0;
       
   756 	border: 4px solid #00a0d2;
       
   757 	-webkit-border-radius: 2px;
       
   758 	border-radius: 2px;
       
   759 }
       
   760 .customize-control-header .header-view.button.selected {
       
   761 	border: 0;
       
   762 }
       
   763 
       
   764 /* Header control: overlay "close" button */
       
   765 
       
   766 .customize-control-header .uploaded .header-view .close {
       
   767 	font-size: 2em;
       
   768 	color: grey;
       
   769 	position: absolute;
       
   770 	visibility: hidden;
       
   771 	top: 10px;
       
   772 	right: 10px;
       
   773 	z-index: 1;
       
   774 	width: 20px;
       
   775 	height: 20px;
       
   776 	cursor: pointer;
       
   777 }
       
   778 
       
   779 .customize-control-header .uploaded .header-view .close:hover {
       
   780  color: black;
       
   781  text-shadow:
       
   782     -1px -1px 0 #fff,
       
   783     1px -1px 0 #fff,
       
   784     -1px 1px 0 #fff,
       
   785     1px 1px 0 #fff;
       
   786 }
       
   787 
       
   788 .customize-control-header .header-view:hover .close {
       
   789 	visibility: visible;
       
   790 }
       
   791 
       
   792 /* Header control: randomiz(s)er */
       
   793 
       
   794 .customize-control-header .random.placeholder {
       
   795 	cursor: pointer;
       
   796 	-webkit-border-radius: 2px;
       
   797 	border-radius: 2px;
       
   798 	height: 40px;
       
   799 }
       
   800 
       
   801 .customize-control-header button.random {
       
   802 	width: 100%;
       
   803 	height: auto;
       
   804 	min-height: 40px;
       
   805 	white-space: normal;
       
   806 }
       
   807 
       
   808 .customize-control-header button.random .dice {
       
   809 	margin-top: 4px;
       
   810 }
       
   811 
       
   812 .customize-control-header .placeholder:hover .dice,
       
   813 .customize-control-header .header-view:hover > button.random .dice {
       
   814 	-webkit-animation: dice-color-change 3s infinite;
       
   815 	animation: dice-color-change 3s infinite;
       
   816 }
       
   817 
       
   818 @-webkit-keyframes dice-color-change {
       
   819 	0% { color: #d4b146; }
       
   820 	50% { color: #ef54b0; }
       
   821 	75% { color: #7190d3; }
       
   822 	100% { color: #d4b146; }
       
   823 }
       
   824 
       
   825 @keyframes dice-color-change {
       
   826 	0% { color: #d4b146; }
       
   827 	50% { color: #ef54b0; }
       
   828 	75% { color: #7190d3; }
       
   829 	100% { color: #d4b146; }
       
   830 }
       
   831 
       
   832 .customize-control-media .actions,
       
   833 .customize-control-upload .actions,
       
   834 .customize-control-image .actions,
       
   835 .customize-control-background .actions,
       
   836 .customize-control-header .actions {
       
   837 	margin-bottom: 32px;
       
   838 }
       
   839 
       
   840 .customize-control-header .choice {
       
   841 	position: relative;
       
   842 	display: block;
       
   843 	margin-bottom: 9px;
       
   844 }
       
   845 
       
   846 .customize-control-header .uploaded div:last-child > .choice {
       
   847 	margin-bottom: 0;
       
   848 }
       
   849 
       
   850 .customize-control-media img,
       
   851 .customize-control-upload img,
       
   852 .customize-control-image img,
       
   853 .customize-control-background img,
       
   854 .customize-control-header img {
       
   855 	width: 100%;
       
   856 	-webkit-border-radius: 2px;
       
   857 	border-radius: 2px;
       
   858 }
       
   859 
       
   860 .customize-control-media .remove-button,
       
   861 .customize-control-media .default-button,
       
   862 .customize-control-upload .remove-button,
       
   863 .customize-control-upload .default-button,
       
   864 .customize-control-image .remove-button,
       
   865 .customize-control-image .default-button,
       
   866 .customize-control-background .remove-button,
       
   867 .customize-control-background .default-button,
       
   868 .customize-control-header .remove {
       
   869 	float: left;
       
   870 	margin-right: 3px;
       
   871 }
       
   872 
       
   873 .customize-control-media .upload-button,
       
   874 .customize-control-upload .upload-button,
       
   875 .customize-control-image .upload-button,
       
   876 .customize-control-background .upload-button,
       
   877 .customize-control-header .new {
       
   878 	float: right;
       
   879 }
       
   880 
   422 /**
   881 /**
   423  * Handle cheaters.
   882  * Themes
   424  */
   883  */
       
   884 @-webkit-keyframes customize-reload {
       
   885 	0%   { opacity: 0; }
       
   886 	100% { opacity: 1; }
       
   887 }
       
   888 
       
   889 @keyframes customize-reload {
       
   890 	0%   { opacity: 0; }
       
   891 	100% { opacity: 1; }
       
   892 }
       
   893 
       
   894 /* #customize-container is reused from customize-loader.js, hence the naming. */
       
   895 .wp-customizer .customize-loading #customize-container {
       
   896 	display: block;
       
   897 	-webkit-animation: customize-reload .75s; /* Can't use `transition` because `display` changes here. */
       
   898 	animation: customize-reload .75s;
       
   899 }
       
   900 
       
   901 .control-section-themes .accordion-section-title {
       
   902 	cursor: default;
       
   903 }
       
   904 
       
   905 #customize-theme-controls .control-section-themes .accordion-section-title:hover,
       
   906 #customize-theme-controls .control-section-themes .accordion-section-title:focus {
       
   907 	color: #555555;
       
   908 	background-color: #fff;
       
   909 }
       
   910 
       
   911 .control-section-themes .accordion-section-title {
       
   912 	margin: 15px 0;
       
   913 }
       
   914 
       
   915 .customize-themes-panel .accordion-section-title {
       
   916 	margin: 15px -8px;
       
   917 }
       
   918 
       
   919 .control-section-themes .accordion-section-title {
       
   920 	padding-right: 100px; /* Space for the button */
       
   921 }
       
   922 
       
   923 .control-section-themes .accordion-section-title span {
       
   924 	font-size: small;
       
   925 	display: block;
       
   926 	font-weight: 400;
       
   927 }
       
   928 
       
   929 .control-section-themes .accordion-section-title .change-theme,
       
   930 .control-section-themes .accordion-section-title .customize-theme {
       
   931 	position: absolute;
       
   932 	right: 10px;
       
   933 	top: 50%;
       
   934 	margin-top: -14px;
       
   935 	font-weight: normal;
       
   936 }
       
   937 
       
   938 .customize-themes-panel {
       
   939 	display: none;
       
   940 	padding: 0 8px;
       
   941 	background: #f1f1f1;
       
   942 	box-sizing: border-box;
       
   943 	-webkit-box-sizing: border-box;
       
   944 	-moz-box-sizing: border-box;
       
   945 	box-sizing: border-box;
       
   946 }
       
   947 
       
   948 
       
   949 .customize-themes-panel > h2 {
       
   950 	padding: 15px 8px 0 8px;
       
   951 }
       
   952 
       
   953 .control-section.open .customize-themes-panel {
       
   954 	display: block;
       
   955 }
       
   956 
       
   957 #customize-theme-controls .customize-themes-panel .accordion-section-content {
       
   958 	background: transparent;
       
   959 	display: block;
       
   960 }
       
   961 
       
   962 .customize-control.customize-control-theme {
       
   963 	margin-bottom: 8px;
       
   964 }
       
   965 
       
   966 .wp-customizer .theme-browser .themes {
       
   967 	padding-bottom: 8px;
       
   968 }
       
   969 
       
   970 .wp-customizer .theme-browser .theme {
       
   971 	margin: 0;
       
   972 	width: 100%;
       
   973 }
       
   974 
       
   975 .wp-customizer .theme-browser .theme .theme-actions {
       
   976 	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
       
   977 	opacity: 1;
       
   978 }
       
   979 
       
   980 #customize-controls h3.theme-name {
       
   981 	font-size: 15px;
       
   982 }
       
   983 
       
   984 #customize-controls .theme-overlay .theme-name {
       
   985 	font-size: 32px;
       
   986 }
       
   987 
       
   988 .wp-customizer #themes-filter {
       
   989 	font-size: 16px;
       
   990 	font-weight: 300;
       
   991 	line-height: 1.5;
       
   992 	width: 100%;
       
   993 }
       
   994 
       
   995 #accordion-section-themes .accordion-section-title:after {
       
   996 	display: none;
       
   997 }
       
   998 
       
   999 #customize-theme-controls .control-section-themes.current-panel > h3.accordion-section-title {
       
  1000 	left: 0;
       
  1001 }
       
  1002 
       
  1003 .customize-themes-panel.control-panel-content {
       
  1004 	position: absolute;
       
  1005 	left: -100%;
       
  1006 	top: 0;
       
  1007 	width: 100%;
       
  1008 	border-top: 1px solid #ddd;
       
  1009 }
       
  1010 
       
  1011 .in-themes-panel #customize-info,
       
  1012 .in-themes-panel #customize-theme-controls > ul > .accordion-section {
       
  1013 	left: 100%;
       
  1014 }
       
  1015 
       
  1016 /* Details View */
       
  1017 .wp-customizer .theme-overlay {
       
  1018 	display: none;
       
  1019 }
       
  1020 
       
  1021 .wp-customizer.modal-open .theme-overlay {
       
  1022 	position: fixed;
       
  1023 	left: 0;
       
  1024 	top: 0;
       
  1025 	right: 0;
       
  1026 	bottom: 0;
       
  1027 	z-index: 109;
       
  1028 }
       
  1029 
       
  1030 .wp-customizer .theme-overlay .theme-backdrop {
       
  1031 	background: rgba( 238, 238, 238, 0.75 );
       
  1032 	position: fixed;
       
  1033 	z-index: 110;
       
  1034 }
       
  1035 
       
  1036 .wp-customizer .theme-overlay .theme-wrap {
       
  1037 	left: 90px;
       
  1038 	right: 90px;
       
  1039 	top: 45px;
       
  1040 	bottom: 45px;
       
  1041 	z-index: 120;
       
  1042 	max-width: 1740px; /* To ensure that theme screenshots are not displayed larger than 880px wide. */
       
  1043 }
       
  1044 
       
  1045 .wp-customizer .theme-overlay .theme-actions {
       
  1046 	text-align: right; /* Because there's only one action, match the pattern of media modals and right-align the action. */
       
  1047 }
       
  1048 
       
  1049 .modal-open .in-themes-panel #customize-controls .wp-full-overlay-sidebar-content {
       
  1050 	overflow: visible; /* Prevent the top-level Customizer controls from becoming visible when elements on the right of the details modal are focused. */
       
  1051 }
       
  1052 
       
  1053 .ie8 .wp-customizer .theme-overlay .theme-header,
       
  1054 .ie8 .wp-customizer .theme-overlay .theme-about,
       
  1055 .ie8 .wp-customizer .theme-overlay .theme-actions {
       
  1056 	position: static;
       
  1057 }
       
  1058 
       
  1059 /* Small Screens */
       
  1060 @media (max-width:850px), (max-height:472px) {
       
  1061 	.wp-customizer .theme-overlay .theme-wrap {
       
  1062 		left: 0;
       
  1063 		right: 0;
       
  1064 		top: 0;
       
  1065 		bottom: 0;
       
  1066 	}
       
  1067 }
       
  1068 
       
  1069 /* Handle cheaters. */
   425 body.cheatin {
  1070 body.cheatin {
       
  1071 	font-size: medium;
       
  1072 	height: auto;
       
  1073 	background: #fff;
       
  1074 	margin: 50px auto 2em;
       
  1075 	padding: 1em 2em;
       
  1076 	max-width: 700px;
   426 	min-width: 0;
  1077 	min-width: 0;
   427 	background: #f9f9f9;
  1078 	-webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.13);
   428 	padding: 50px;
  1079 	box-shadow: 0 1px 3px rgba(0,0,0,0.13);
   429 }
  1080 }
   430 
  1081 
   431 body.cheatin p {
  1082 body.cheatin p {
   432 	max-width: 700px;
       
   433 	margin: 0 auto;
       
   434 	padding: 2em;
       
   435 	font-size: 14px;
  1083 	font-size: 14px;
   436 	background: #fff;
  1084 	line-height: 1.5;
   437 	border: 1px solid #dfdfdf;
  1085 	margin: 25px 0 20px;
   438 	-webkit-border-radius: 3px;
  1086 }
   439 	border-radius:         3px;
  1087 
   440 }
  1088 /* Responsive */
       
  1089 .customize-controls-preview-toggle {
       
  1090 	display: none;
       
  1091 }
       
  1092 
       
  1093 @media only screen and (max-width: 780px) {
       
  1094 	.wp-customizer .theme:not(.active):hover .theme-actions,
       
  1095 	.wp-customizer .theme:not(.active):focus .theme-actions {
       
  1096 		display: block;
       
  1097 	}
       
  1098 
       
  1099 	.wp-customizer .theme-browser .theme.active .theme-name span {
       
  1100 		display: inline;
       
  1101 	}
       
  1102 }
       
  1103 
       
  1104 @media screen and ( max-width: 640px ) {
       
  1105 	#customize-controls {
       
  1106 		width: 100%;
       
  1107 	}
       
  1108 
       
  1109 	.wp-full-overlay.expanded {
       
  1110 		margin-left: 0;
       
  1111 	}
       
  1112 
       
  1113 	.wp-full-overlay-sidebar .wp-full-overlay-sidebar-content {
       
  1114 		bottom: 0;
       
  1115 	}
       
  1116 
       
  1117 	.customize-controls-preview-toggle {
       
  1118 		display: block;
       
  1119 		position: absolute;
       
  1120 		top: 0;
       
  1121 		left: 48px;
       
  1122 		line-height: 45px;
       
  1123 		font-size: 14px;
       
  1124 		padding: 0 12px 0 12px;
       
  1125 		margin: 0;
       
  1126 		height: 45px;
       
  1127 		background: #eee;
       
  1128 		border-right: 1px solid #ddd;
       
  1129 		color: #444;
       
  1130 		cursor: pointer;
       
  1131 		-webkit-transition: color .1s ease-in-out, background .1s ease-in-out;
       
  1132 		transition: color .1s ease-in-out, background .1s ease-in-out;
       
  1133 	}
       
  1134 
       
  1135 	#customize-footer-actions,
       
  1136 	#customize-preview,
       
  1137 	.customize-controls-preview-toggle .controls,
       
  1138 	.preview-only .wp-full-overlay-sidebar-content,
       
  1139 	.preview-only .customize-controls-preview-toggle .preview {
       
  1140 		display: none;
       
  1141 	}
       
  1142 
       
  1143 	.customize-controls-preview-toggle .preview:before,
       
  1144 	.customize-controls-preview-toggle .controls:before {
       
  1145 		font: normal 20px/1 dashicons;
       
  1146 		content: "\f177";
       
  1147 		position: relative;
       
  1148 		top: 4px;
       
  1149 		margin-right: 6px;
       
  1150 	}
       
  1151 
       
  1152 	.customize-controls-preview-toggle .controls:before {
       
  1153 		content: "\f100";
       
  1154 	}
       
  1155 
       
  1156 	.preview-only #customize-controls {
       
  1157 		height: 45px;
       
  1158 	}
       
  1159 
       
  1160 	.preview-only #customize-preview,
       
  1161 	.preview-only .customize-controls-preview-toggle .controls {
       
  1162 		display: block;
       
  1163 	}
       
  1164 
       
  1165 	#customize-preview {
       
  1166 		top: 45px;
       
  1167 		bottom: 0;
       
  1168 		height: auto;
       
  1169 	}
       
  1170 
       
  1171 	.wp-core-ui.wp-customizer .button {
       
  1172 		padding: 6px 14px;
       
  1173 		line-height: normal;
       
  1174 		font-size: 14px;
       
  1175 		vertical-align: middle;
       
  1176 		height: auto;
       
  1177 		margin-bottom: 4px;
       
  1178 	}
       
  1179 
       
  1180 	.adding-widget #customize-header-actions .primary-actions {
       
  1181 		display: none;
       
  1182 	}
       
  1183 
       
  1184 	.adding-widget #customize-header-actions .secondary-actions {
       
  1185 		display: block;
       
  1186 	}
       
  1187 
       
  1188 	#customize-header-actions .button-primary {
       
  1189 		margin-top: 6px;
       
  1190 	}
       
  1191 }