e98e87ea5042c53237e6eec2989b6b39fabc85a5
[autoinstalls/wordpress.git] / wp-admin / css / common.css
1 /* 2 column liquid layout */
2 #wpwrap {
3         height: auto;
4         min-height: 100%;
5         width: 100%;
6         position: relative;
7         -webkit-font-smoothing: subpixel-antialiased;
8 }
9
10 #wpcontent {
11         height: 100%;
12         padding-left: 20px;
13 }
14
15 #wpcontent,
16 #wpfooter {
17         margin-left: 160px;
18 }
19
20 .folded #wpcontent,
21 .folded #wpfooter {
22         margin-left: 36px;
23 }
24
25 #wpbody-content {
26         padding-bottom: 65px;
27         float: left;
28         width: 100%;
29         overflow: visible !important;
30 }
31
32 /* inner 2 column liquid layout */
33
34 .inner-sidebar {
35         float: right;
36         clear: right;
37         display: none;
38         width: 281px;
39         position: relative;
40 }
41
42 .columns-2 .inner-sidebar {
43         margin-right: auto;
44         width: 286px;
45         display: block;
46 }
47
48 .inner-sidebar #side-sortables,
49 .columns-2 .inner-sidebar #side-sortables {
50         min-height: 300px;
51         width: 280px;
52         padding: 0;
53 }
54
55 .has-right-sidebar .inner-sidebar {
56         display: block;
57 }
58
59 .has-right-sidebar #post-body {
60         float: left;
61         clear: left;
62         width: 100%;
63         margin-right: -2000px;
64 }
65
66 .has-right-sidebar #post-body-content {
67         margin-right: 300px;
68         float: none;
69         width: auto;
70 }
71
72 /* 2 columns main area */
73
74 #col-container,
75 #col-left,
76 #col-right {
77         overflow: hidden;
78         padding: 0;
79         margin: 0;
80 }
81
82 #col-left {
83         width: 35%;
84 }
85
86 #col-right {
87         float: right;
88         clear: right;
89         width: 65%;
90 }
91
92 .col-wrap {
93         padding: 0 7px;
94 }
95
96 /* utility classes */
97 .alignleft {
98         float: left;
99 }
100
101 .alignright {
102         float: right;
103 }
104
105 .textleft {
106         text-align: left;
107 }
108
109 .textright {
110         text-align: right;
111 }
112
113 .clear {
114         clear: both;
115 }
116
117 /* modern clearfix */
118 .wp-clearfix:after {
119         content: "";
120         display: table;
121         clear: both;
122 }
123
124 /* Hide visually but not from screen readers */
125 .screen-reader-text,
126 .screen-reader-text span,
127 .ui-helper-hidden-accessible {
128         position: absolute;
129         margin: -1px;
130         padding: 0;
131         height: 1px;
132         width: 1px;
133         overflow: hidden;
134         clip: rect(0 0 0 0);
135         border: 0;
136         word-wrap: normal !important; /* many screen reader and browser combinations announce broken words as they would appear visually */
137 }
138
139 .screen-reader-shortcut {
140         position: absolute;
141         top: -1000em;
142 }
143
144 .screen-reader-shortcut:focus {
145         left: 6px;
146         top: -25px;
147         height: auto;
148         width: auto;
149         display: block;
150         font-size: 14px;
151         font-weight: 600;
152         padding: 15px 23px 14px;
153         background: #f1f1f1;
154         color: #0073aa;
155         z-index: 100000;
156         line-height: normal;
157         -webkit-box-shadow: 0 0 2px 2px rgba(0,0,0,.6);
158         box-shadow: 0 0 2px 2px rgba(0,0,0,.6);
159         text-decoration: none;
160         outline: none;
161 }
162
163 .hidden,
164 .js .closed .inside,
165 .js .hide-if-js,
166 .no-js .hide-if-no-js,
167 .js.wp-core-ui .hide-if-js,
168 .js .wp-core-ui .hide-if-js,
169 .no-js.wp-core-ui .hide-if-no-js,
170 .no-js .wp-core-ui .hide-if-no-js {
171         display: none;
172 }
173
174 /* @todo: Take a second look. Large chunks of shared color, from the colors.css merge */
175 .widget-top,
176 .menu-item-handle,
177 .widget-inside,
178 #menu-settings-column .accordion-container,
179 #menu-management .menu-edit,
180 .manage-menus,
181 table.widefat,
182 .stuffbox,
183 p.popular-tags,
184 .widgets-holder-wrap,
185 .wp-editor-container,
186 .popular-tags,
187 .feature-filter,
188 .imgedit-group,
189 .comment-ays {
190         border: 1px solid #e5e5e5;
191         -webkit-box-shadow: 0 1px 1px rgba(0,0,0,0.04);
192         box-shadow: 0 1px 1px rgba(0,0,0,0.04);
193 }
194
195 table.widefat,
196 .wp-editor-container,
197 .stuffbox,
198 p.popular-tags,
199 .widgets-holder-wrap,
200 .popular-tags,
201 .feature-filter,
202 .imgedit-group,
203 .comment-ays {
204         background: #fff;
205 }
206
207 /* general */
208 html,
209 body {
210         height: 100%;
211         margin: 0;
212         padding: 0;
213 }
214
215 html {
216         background: #f1f1f1;
217 }
218
219 body {
220         color: #444;
221         font-family: "Open Sans", sans-serif;
222         font-size: 13px;
223         line-height: 1.4em;
224         min-width: 600px;
225 }
226
227 body.iframe {
228         min-width: 0;
229         padding-top: 1px;
230 }
231
232 body.modal-open {
233         overflow: hidden;
234 }
235
236 body.mobile.modal-open #wpwrap {
237         overflow: hidden;
238         position: fixed;
239         height: 100%;
240 }
241
242 iframe,
243 img {
244         border: 0;
245 }
246
247 td {
248         font-family: inherit;
249         font-size: inherit;
250         font-weight: inherit;
251         line-height: inherit;
252 }
253
254 a {
255         color: #0073aa;
256         -webkit-transition-property: border, background, color;
257         transition-property: border, background, color;
258         -webkit-transition-duration: .05s;
259         transition-duration: .05s;
260         -webkit-transition-timing-function: ease-in-out;
261         transition-timing-function: ease-in-out;
262 }
263
264 a,
265 div {
266         outline: 0;
267 }
268
269 a:hover,
270 a:active {
271         color: #00a0d2;
272 }
273
274 a:focus,
275 a:focus .media-icon img,
276 .wp-person a:focus .gravatar {
277         color: #124964;
278         -webkit-box-shadow:
279                 0 0 0 1px #5b9dd9,
280                 0 0 2px 1px rgba(30, 140, 190, .8);
281         box-shadow:
282                 0 0 0 1px #5b9dd9,
283                 0 0 2px 1px rgba(30, 140, 190, .8);
284 }
285
286 .ie8 a:focus {
287         outline: #5b9dd9 solid 1px;
288 }
289
290 #adminmenu a:focus,
291 .screen-reader-text:focus {
292         -webkit-box-shadow: none;
293         box-shadow: none;
294         outline: none;
295 }
296
297 blockquote,
298 q {
299         quotes: none;
300 }
301
302 blockquote:before,
303 blockquote:after,
304 q:before,
305 q:after {
306         content: "";
307         content: none;
308 }
309
310 p {
311         font-size: 13px;
312         line-height: 1.5;
313         margin: 1em 0;
314 }
315
316 blockquote {
317         margin: 1em;
318 }
319
320 li,
321 dd {
322         margin-bottom: 6px;
323 }
324
325 h1,
326 h2,
327 h3,
328 h4,
329 h5,
330 h6 {
331         display: block;
332         font-weight: 600;
333 }
334
335 h1 {
336         color: #23282d;
337         font-size: 2em;
338         margin: .67em 0;
339 }
340
341 h2,
342 h3 {
343         color: #23282d;
344         font-size: 1.3em;
345         margin: 1em 0;
346 }
347
348 .update-core-php h2 {
349         margin-top: 2em;
350 }
351
352 .update-php h2,
353 .update-messages h2,
354 h4 {
355         font-size: 1em;
356         margin: 1.33em 0;
357 }
358
359 h5 {
360         font-size: 0.83em;
361         margin: 1.67em 0;
362 }
363
364 h6 {
365         font-size: 0.67em;
366         margin: 2.33em 0;
367 }
368
369 ul,
370 ol {
371         padding: 0;
372 }
373
374 ul {
375         list-style: none;
376 }
377
378 ol {
379         list-style-type: decimal;
380         margin-left: 2em;
381 }
382
383 ul.ul-disc {
384         list-style: disc outside;
385 }
386
387 ul.ul-square {
388         list-style: square outside;
389 }
390
391 ol.ol-decimal {
392         list-style: decimal outside;
393 }
394
395 ul.ul-disc,
396 ul.ul-square,
397 ol.ol-decimal {
398         margin-left: 1.8em;
399 }
400
401 ul.ul-disc > li,
402 ul.ul-square > li,
403 ol.ol-decimal > li {
404         margin: 0 0 0.5em;
405 }
406
407 /* rtl:ignore */
408 .ltr {
409         direction: ltr;
410 }
411
412 /* rtl:ignore */
413 .code,
414 code {
415         font-family: Consolas, Monaco, monospace;
416         direction: ltr;
417         unicode-bidi: embed;
418 }
419
420 kbd,
421 code {
422         padding: 3px 5px 2px 5px;
423         margin: 0 1px;
424         background: #eaeaea;
425         background: rgba(0,0,0,0.07);
426         font-size: 13px;
427 }
428
429 .subsubsub {
430         list-style: none;
431         margin: 8px 0 0;
432         padding: 0;
433         font-size: 13px;
434         float: left;
435         color: #666;
436 }
437
438 .subsubsub a {
439         line-height: 2;
440         padding: .2em;
441         text-decoration: none;
442 }
443
444 .subsubsub a .count,
445 .subsubsub a.current .count {
446         color: #555d66; /* #f1f1f1 background */
447         font-weight: normal;
448 }
449
450 .subsubsub a.current {
451         font-weight: 600;
452         border: none;
453 }
454
455 .subsubsub li {
456         display: inline-block;
457         margin: 0;
458         padding: 0;
459         white-space: nowrap;
460 }
461
462 /* .widefat - main style for tables */
463 .widefat {
464         border-spacing: 0;
465         width: 100%;
466         clear: both;
467         margin: 0;
468 }
469
470 .widefat * {
471         word-wrap: break-word;
472 }
473
474 .widefat a {
475         text-decoration: none;
476 }
477
478 .widefat td,
479 .widefat th {
480         padding: 8px 10px;
481 }
482
483 .widefat thead th,
484 .widefat thead td {
485         border-bottom: 1px solid #e1e1e1;
486 }
487
488 .widefat tfoot th,
489 .widefat tfoot td {
490         border-top: 1px solid #e1e1e1;
491         border-bottom: none;
492 }
493
494 .widefat .no-items td {
495         border-bottom-width: 0;
496 }
497
498 .widefat td {
499         vertical-align: top;
500 }
501
502 .widefat td,
503 .widefat td p,
504 .widefat td ol,
505 .widefat td ul {
506         font-size: 13px;
507         line-height: 1.5em;
508 }
509
510 .widefat th,
511 .widefat thead td,
512 .widefat tfoot td {
513         text-align: left;
514         line-height: 1.3em;
515         font-size: 14px;
516 }
517
518 .widefat th input,
519 .updates-table td input,
520 .widefat thead td input,
521 .widefat tfoot td input {
522         margin: 0 0 0 8px;
523         padding: 0;
524         vertical-align: text-top;
525 }
526
527 .widefat .check-column {
528         width: 2.2em;
529         padding: 6px 0 25px;
530         vertical-align: top;
531 }
532
533 .widefat tbody th.check-column {
534         padding: 9px 0 22px;
535 }
536
537 .widefat thead td.check-column,
538 .widefat tbody th.check-column,
539 .updates-table tbody td.check-column,
540 .widefat tfoot td.check-column {
541         padding: 11px 0 0 3px;
542 }
543
544 .widefat thead td.check-column,
545 .widefat tfoot td.check-column {
546         padding-top: 4px;
547         vertical-align: middle;
548 }
549
550 .update-php div.updated,
551 .update-php div.error {
552         margin-left: 0;
553 }
554
555 .no-js .widefat thead .check-column input,
556 .no-js .widefat tfoot .check-column input {
557         display: none;
558 }
559
560 .widefat .num,
561 .column-comments,
562 .column-links,
563 .column-posts {
564         text-align: center;
565 }
566
567 .widefat th#comments {
568         vertical-align: middle;
569 }
570
571 .wrap {
572         margin: 10px 20px 0 2px;
573 }
574
575 .wrap > h2:first-child, /* Back-compat for pre-4.4 */
576 .wrap [class$="icon32"] + h2, /* Back-compat for pre-4.4 */
577 .postbox .inside h2, /* Back-compat for pre-4.4 */
578 .wrap h1 {
579         font-size: 23px;
580         font-weight: 400;
581         margin: 0;
582         padding: 9px 15px 4px 0;
583         line-height: 29px;
584 }
585
586 .subtitle {
587         margin: 0;
588         padding-left: 25px;
589         color: #555d66;
590         font-size: 14px;
591         font-weight: normal;
592 }
593
594 .wrap .add-new-h2, /* deprecated */
595 .wrap .add-new-h2:active, /* deprecated */
596 .wrap .page-title-action,
597 .wrap .page-title-action:active {
598         margin-left: 4px;
599         padding: 4px 8px;
600         position: relative;
601         top: -3px;
602         text-decoration: none;
603         border: none;
604         border: 1px solid #ccc;
605         -webkit-border-radius: 2px;
606         border-radius: 2px;
607         background: #f7f7f7;
608         text-shadow: none;
609         font-weight: 600;
610         font-size: 13px;
611 }
612
613 .wrap .add-new-h2:hover, /* deprecated */
614 .wrap .page-title-action:hover {
615         border-color: #008EC2;
616         background: #00a0d2;
617         color: #fff;
618 }
619
620 .wrap .page-title-action:focus {
621         border-color: #5b9dd9;
622         -webkit-box-shadow: 0 0 2px rgba( 30, 140, 190, 0.8 );
623         box-shadow: 0 0 2px rgba( 30, 140, 190, 0.8 );
624 }
625
626 .wrap h1.long-header {
627         padding-right: 0;
628 }
629
630 .wp-dialog {
631         background-color: #fff;
632 }
633
634 .widgets-chooser ul,
635 #widgets-left .widget-in-question .widget-top,
636 #available-widgets .widget-top:hover,
637 div#widgets-right .widget-top:hover,
638 #widgets-left .widget-top:hover {
639         border-color: #999;
640         -webkit-box-shadow: 0 1px 2px rgba(0,0,0,0.1);
641         box-shadow: 0 1px 2px rgba(0,0,0,0.1);
642 }
643
644 .sorthelper {
645         background-color: #ccf3fa;
646 }
647
648 .ac_match,
649 .subsubsub a.current {
650         color: #000;
651 }
652
653 .striped > tbody > :nth-child(odd),
654 ul.striped > :nth-child(odd),
655 .alternate {
656         background-color: #f9f9f9;
657 }
658
659 .bar {
660         background-color: #e8e8e8;
661         border-right-color: #99d;
662 }
663
664 /* Helper classes for plugins to leverage the active WordPress color scheme */
665
666 .highlight {
667         background-color: #e4f2fd;
668         color: #000;
669 }
670
671 .wp-ui-primary {
672         color: #fff;
673         background-color: #32373c;
674 }
675 .wp-ui-text-primary {
676         color: #32373c;
677 }
678
679 .wp-ui-highlight {
680         color: white;
681         background-color: #1e8cbe;
682 }
683 .wp-ui-text-highlight {
684         color: #1e8cbe;
685 }
686
687 .wp-ui-notification {
688         color: #fff;
689         background-color: #d54e21;
690 }
691 .wp-ui-text-notification {
692         color: #d54e21;
693 }
694
695 .wp-ui-text-icon {
696         color: #82878c; /* same as new icons */
697 }
698
699 /* For emoji replacement images */
700 img.emoji {
701         display: inline !important;
702         border: none !important;
703         height: 1em !important;
704         width: 1em !important;
705         margin: 0 .07em !important;
706         vertical-align: -0.1em !important;
707         background: none !important;
708         padding: 0 !important;
709         -webkit-box-shadow: none !important;
710         box-shadow: none !important;
711 }
712
713 /*------------------------------------------------------------------------------
714   1.0 - Text Styles
715 ------------------------------------------------------------------------------*/
716
717 .widget .widget-top,
718 .postbox .hndle,
719 .stuffbox .hndle,
720 .control-section .accordion-section-title,
721 .sidebar-name,
722 #nav-menu-header,
723 #nav-menu-footer,
724 .menu-item-handle,
725 .checkbox,
726 .side-info,
727 #your-profile #rich_editing,
728 .widefat thead th,
729 .widefat thead td,
730 .widefat tfoot th,
731 .widefat tfoot td {
732         line-height: 1.4em;
733 }
734
735 .widget .widget-top,
736 .menu-item-handle {
737         background: #fafafa;
738         color: #23282d;
739 }
740
741 .postbox .hndle,
742 .stuffbox .hndle {
743         border-bottom: 1px solid #eee;
744 }
745
746 .quicktags,
747 .search {
748         background-color: #ccc;
749         color: #000;
750         font-size: 12px;
751 }
752
753 .icon32 {
754         display: none;
755 }
756
757 /* @todo can we combine these into a class or use an existing dashicon one? */
758 .welcome-panel .welcome-panel-close:before,
759 .tagchecklist span a:before,
760 #bulk-titles div a:before,
761 .notice-dismiss:before {
762         background: none;
763         color: #b4b9be;
764         content: "\f153";
765         display: block;
766         font: normal 16px/20px dashicons;
767         speak: none;
768         height: 20px;
769         text-align: center;
770         width: 20px;
771         -webkit-font-smoothing: antialiased;
772         -moz-osx-font-smoothing: grayscale;
773 }
774
775 .welcome-panel .welcome-panel-close:before {
776         margin: 0;
777 }
778
779 .tagchecklist span a:before,
780 #bulk-titles div a:before {
781         margin: 1px 0;
782 }
783
784 .welcome-panel .welcome-panel-close:hover:before,
785 .welcome-panel .welcome-panel-close:focus:before,
786 .tagchecklist span a:hover:before,
787 #bulk-titles div a:hover:before {
788         color: #c00;
789 }
790
791 .key-labels label {
792         line-height: 24px;
793 }
794
795 strong, b {
796         font-weight: 600;
797 }
798
799 .pre {
800         /* https://developer.mozilla.org/en-US/docs/CSS/white-space */
801         white-space: pre-wrap; /* css-3 */
802         word-wrap: break-word; /* IE 5.5 - 7 */
803 }
804
805 .howto {
806         color: #666;
807         font-style: italic;
808         display: block;
809 }
810
811 p.install-help {
812         margin: 8px 0;
813         font-style: italic;
814 }
815
816 .no-break {
817         white-space: nowrap;
818 }
819
820 hr {
821         border: 0;
822         border-top: 1px solid #ddd;
823         border-bottom: 1px solid #fafafa;
824 }
825
826 .row-actions span.delete a,
827 .row-actions span.trash a,
828 .row-actions span.spam a,
829 .plugins a.delete,
830 #all-plugins-table .plugins a.delete,
831 #search-plugins-table .plugins a.delete,
832 .submitbox .submitdelete,
833 #media-items a.delete,
834 #media-items a.delete-permanently,
835 #nav-menu-footer .menu-delete {
836         color: #a00;
837 }
838
839 abbr.required,
840 span.required,
841 .file-error,
842 .widget-control-remove:hover,
843 .row-actions .delete a:hover,
844 .row-actions .trash a:hover,
845 .row-actions .spam a:hover,
846 .plugins a.delete:hover,
847 #all-plugins-table .plugins a.delete:hover,
848 #search-plugins-table .plugins a.delete:hover,
849 .submitbox .submitdelete:hover,
850 #media-items a.delete:hover,
851 #media-items a.delete-permanently:hover,
852 #nav-menu-footer .menu-delete:hover {
853         color: #f00;
854         text-decoration: none;
855         border: none;
856 }
857
858 /*------------------------------------------------------------------------------
859   3.0 - Actions
860 ------------------------------------------------------------------------------*/
861
862 #major-publishing-actions {
863         padding: 10px;
864         clear: both;
865         border-top: 1px solid #ddd;
866         background: #f5f5f5;
867 }
868
869 #delete-action {
870         line-height: 28px;
871         vertical-align: middle;
872         text-align: left;
873         float: left;
874 }
875
876 #publishing-action {
877         text-align: right;
878         float: right;
879         line-height: 23px;
880 }
881
882 #publishing-action .spinner {
883         float: left;
884 }
885
886 #misc-publishing-actions {
887         padding: 6px 0 0;
888 }
889
890 .misc-pub-section {
891         padding: 6px 10px 8px;
892 }
893
894 .misc-pub-filename {
895         word-wrap: break-word;
896 }
897
898 #minor-publishing-actions {
899         padding: 10px 10px 0 10px;
900         text-align: right;
901 }
902
903 #save-post {
904         float: left;
905 }
906
907 .preview {
908         float: right;
909 }
910
911 #sticky-span {
912         margin-left: 18px;
913 }
914
915 .approve,
916 .unapproved .unapprove {
917         display: none;
918 }
919
920 .unapproved .approve,
921 .spam .approve,
922 .trash .approve {
923         display: inline;
924 }
925
926 td.action-links,
927 th.action-links {
928         text-align: right;
929 }
930
931 /* Filter bar */
932 .wp-filter {
933         display: inline-block;
934         position: relative;
935         -webkit-box-sizing: border-box;
936         -moz-box-sizing: border-box;
937         box-sizing: border-box;
938         margin: 12px 0 25px;
939         padding: 0 10px;
940         width: 100%;
941         -webkit-box-shadow: 0 1px 1px rgba(0,0,0,0.04);
942         box-shadow: 0 1px 1px rgba(0,0,0,0.04);
943         border: 1px solid #e5e5e5;
944         background: #fff;
945         color: #555;
946         font-size: 13px;
947 }
948
949 .wp-filter a {
950         text-decoration: none;
951 }
952
953 .filter-count {
954         display: inline-block;
955         vertical-align: middle;
956         min-width: 4em;
957 }
958
959 .title-count,
960 .filter-count .count {
961         display: inline-block;
962         position: relative;
963         top: -1px;
964         padding: 4px 10px;
965         -webkit-border-radius: 30px;
966         border-radius: 30px;
967         background: #72777c;
968         color: #fff;
969         font-size: 14px;
970         font-weight: 600;
971 }
972
973 /* not a part of filter bar, but derived from it, so here for now */
974 .title-count {
975         display: inline;
976         top: -3px;
977         margin-left: 5px;
978         margin-right: 20px;
979 }
980
981 .filter-items {
982         float: left;
983 }
984
985 .filter-links {
986         display: inline-block;
987         margin: 0;
988 }
989
990 .filter-links li {
991         display: inline-block;
992         margin: 0;
993 }
994
995 .filter-links li > a {
996         display: inline-block;
997         margin: 0 10px;
998         padding: 15px 0;
999         border-bottom: 4px solid #fff;
1000         color: #666;
1001         cursor: pointer;
1002 }
1003
1004 .filter-links .current {
1005         -webkit-box-shadow: none;
1006         box-shadow: none;
1007         border-bottom: 4px solid #666;
1008         color: #23282d;
1009 }
1010
1011 .filter-links li > a:hover,
1012 .filter-links li > a:focus,
1013 .show-filters .filter-links a.current:hover,
1014 .show-filters .filter-links a.current:focus {
1015         color: #00a0d2;
1016 }
1017
1018 .wp-filter .search-form {
1019         float: right;
1020         margin: 10px 0;
1021 }
1022
1023 .wp-filter .search-form input[type="search"] {
1024         margin: 0;
1025         padding: 3px 5px;
1026         width: 280px;
1027         max-width: 100%;
1028         font-size: 16px;
1029         font-weight: 300;
1030         line-height: 1.5;
1031 }
1032
1033 .wp-filter .search-form select {
1034         margin: 0;
1035         height: 32px;
1036         vertical-align: top;
1037 }
1038
1039 .wp-filter .search-form.search-plugins {
1040         display: inline-block;
1041 }
1042
1043 .wp-filter .drawer-toggle {
1044         display: inline-block;
1045         margin: 0 10px;
1046         padding: 4px 6px;
1047         color: #666;
1048         cursor: pointer;
1049 }
1050
1051 .wp-filter .drawer-toggle:before {
1052         display: inline-block;
1053         vertical-align: top;
1054         content: "\f111";
1055         margin: 0 5px 0 0;
1056         width: 16px;
1057         height: 16px;
1058         color: #72777c;
1059         -webkit-transition: color .1s ease-in 0;
1060         transition: color .1s ease-in 0;
1061         font-family: dashicons;
1062         font-size: 16px;
1063         line-height: 1;
1064         text-align: center;
1065         text-decoration: inherit;
1066         font-weight: normal;
1067         font-style: normal;
1068         -webkit-font-smoothing: antialiased;
1069 }
1070
1071 .wp-filter .drawer-toggle:hover,
1072 .wp-filter .drawer-toggle:hover:before {
1073         color: #00a0d2;
1074 }
1075
1076 .wp-filter .drawer-toggle.current:before {
1077         color: #fff;
1078 }
1079
1080 .wp-filter .favorites-form {
1081         display: none;
1082         margin: 0 -20px;
1083         padding: 20px;
1084         border-top: 1px solid #eee;
1085         background: #fafafa;
1086         overflow: hidden;
1087         width: 100%;
1088 }
1089
1090 .show-favorites-form .wp-filter .favorites-form {
1091         display: block;
1092 }
1093
1094 .filter-drawer {
1095         display: none;
1096         margin: 0 -20px;
1097         padding: 20px;
1098         border-top: 1px solid #eee;
1099         background: #fafafa;
1100 }
1101
1102 .show-filters .filter-drawer {
1103         display: block;
1104         overflow: hidden;
1105         width: 100%;
1106 }
1107
1108 .show-filters .wp-filter .drawer-toggle:hover,
1109 .show-filters .wp-filter .drawer-toggle:focus {
1110         background: rgb(46, 162, 204);
1111 }
1112
1113 .show-filters .filter-links a.current {
1114         border-bottom: none;
1115 }
1116
1117 .show-filters .wp-filter .drawer-toggle {
1118         -webkit-border-radius: 2px;
1119         border-radius: 2px;
1120         border: none;
1121         background: #72777c;
1122         color: #fff;
1123 }
1124
1125 .show-filters .wp-filter .drawer-toggle:before {
1126         color: #fff;
1127 }
1128
1129 .filter-group {
1130         -webkit-box-sizing: border-box;
1131         -moz-box-sizing: border-box;
1132         box-sizing: border-box;
1133         position: relative;
1134         float: left;
1135         margin: 0 1% 0 0;
1136         padding: 20px 10px 10px;
1137         width: 24%;
1138         background: #fff;
1139         border: 1px solid #e5e5e5;
1140         -webkit-box-shadow: 0 1px 1px rgba(0,0,0,0.04);
1141         box-shadow: 0 1px 1px rgba(0,0,0,0.04);
1142 }
1143
1144 .filter-group legend {
1145         position: absolute;
1146         top: 10px;
1147         display: block;
1148         margin: 0;
1149         padding: 0;
1150         font-size: 1em;
1151         font-weight: 600;
1152 }
1153
1154 .filter-drawer .filter-group-feature {
1155         margin: 28px 0 0;
1156         list-style-type: none;
1157         font-size: 12px;
1158 }
1159
1160 .filter-drawer .filter-group-feature input,
1161 .filter-drawer .filter-group-feature label {
1162         display: inline-block;
1163         margin: 7px 4px 7px 0;
1164         line-height: 16px;
1165 }
1166
1167 .filter-drawer .buttons {
1168         margin-bottom: 20px;
1169 }
1170
1171 .filter-drawer .buttons .button span {
1172         display: inline-block;
1173         opacity: 0.8;
1174         font-size: 12px;
1175         text-indent: 10px;
1176 }
1177
1178 .wp-filter .button.clear-filters {
1179         display: none;
1180         margin-left: 10px;
1181 }
1182
1183 .filtered-by {
1184         display: none;
1185         margin: 0;
1186 }
1187
1188 .filtered-by > span {
1189         font-weight: 600;
1190 }
1191
1192 .filtered-by a {
1193         margin-left: 10px;
1194 }
1195
1196 .filtered-by .tags {
1197         display: inline;
1198 }
1199
1200 .filtered-by .tag {
1201         margin: 0 5px;
1202         padding: 4px 8px;
1203         border: 1px solid #e5e5e5;
1204         -webkit-box-shadow: 0 1px 1px rgba(0,0,0,0.04);
1205         box-shadow: 0 1px 1px rgba(0,0,0,0.04);
1206         background: #fff;
1207         font-size: 11px;
1208 }
1209
1210 .filters-applied .filter-group,
1211 .filters-applied .filter-drawer .buttons,
1212 .filters-applied .filter-drawer br {
1213         display: none !important;
1214 }
1215
1216 .filters-applied .filtered-by {
1217         display: block;
1218 }
1219
1220 .filters-applied .filter-drawer {
1221         padding: 20px;
1222 }
1223
1224 .show-filters .content-filterable,
1225 .show-filters.filters-applied.loading-content .content-filterable,
1226 .loading-content .content-filterable,
1227 .error .content-filterable {
1228         display: none;
1229 }
1230
1231 .show-filters.filters-applied .content-filterable {
1232         display: block;
1233 }
1234
1235 .loading-content .spinner {
1236         display: block;
1237         margin: 40px auto 0;
1238         float: none;
1239 }
1240
1241 @media only screen and (max-width: 1120px) {
1242         .filter-drawer {
1243                 border-bottom: 1px solid #eee;
1244         }
1245
1246         .filter-group {
1247                 margin-bottom: 0;
1248                 margin-top: 5px;
1249                 width: 100%;
1250         }
1251
1252         .filter-group li {
1253                 margin: 10px 0;
1254         }
1255 }
1256
1257 @media only screen and (max-width: 1000px) {
1258         .filter-items {
1259                 float: none;
1260         }
1261
1262         .wp-filter .media-toolbar-primary,
1263         .wp-filter .media-toolbar-secondary,
1264         .wp-filter .search-form {
1265                 float: none; /* Remove float from media-views.css */
1266                 position: relative;
1267                 max-width: 100%;
1268         }
1269 }
1270
1271 @media only screen and (max-width: 782px) {
1272         .filter-group li {
1273                 padding: 0;
1274                 width: 50%;
1275         }
1276 }
1277
1278 @media only screen and (max-width: 320px) {
1279         .filter-count {
1280                 display: none;
1281         }
1282
1283         .wp-filter .drawer-toggle {
1284                 margin: 10px 0;
1285         }
1286
1287         .filter-group li,
1288         .wp-filter .search-form input[type="search"] {
1289                 width: 100%;
1290         }
1291 }
1292
1293 /*------------------------------------------------------------------------------
1294   4.0 - Notifications
1295 ------------------------------------------------------------------------------*/
1296
1297 .notice,
1298 div.updated,
1299 div.error {
1300         background: #fff;
1301         border-left: 4px solid #fff;
1302         -webkit-box-shadow: 0 1px 1px 0 rgba( 0, 0, 0, 0.1 );
1303         box-shadow: 0 1px 1px 0 rgba( 0, 0, 0, 0.1 );
1304         margin: 5px 15px 2px;
1305         padding: 1px 12px;
1306 }
1307
1308 .notice p,
1309 .notice-title,
1310 div.updated p,
1311 div.error p,
1312 .form-table td .notice p {
1313         margin: 0.5em 0;
1314         padding: 2px;
1315 }
1316
1317 .error a {
1318         text-decoration: underline;
1319 }
1320
1321 .updated a {
1322         padding-bottom: 2px;
1323 }
1324
1325 .notice-alt {
1326         -webkit-box-shadow: none;
1327         box-shadow: none;
1328 }
1329
1330 .notice-large {
1331         padding: 10px 20px;
1332 }
1333
1334 .notice-title {
1335         display: inline-block;
1336         color: #23282d;
1337         font-size: 18px;
1338 }
1339
1340 .wp-core-ui .notice.is-dismissible {
1341         padding-right: 38px;
1342         position: relative;
1343 }
1344
1345 .notice-dismiss {
1346         position: absolute;
1347         top: 0;
1348         right: 1px;
1349         border: none;
1350         margin: 0;
1351         padding: 9px;
1352         background: none;
1353         color: #b4b9be;
1354         cursor: pointer;
1355 }
1356
1357 .notice-dismiss:hover:before,
1358 .notice-dismiss:active:before,
1359 .notice-dismiss:focus:before {
1360         color: #c00;
1361 }
1362
1363 .notice-dismiss:focus {
1364         outline: none;
1365         -webkit-box-shadow: 0 0 0 1px #5b9dd9, 0 0 2px 1px rgba(30, 140, 190, .8);
1366         box-shadow: 0 0 0 1px #5b9dd9, 0 0 2px 1px rgba(30, 140, 190, .8);
1367 }
1368
1369 .ie8 .notice-dismiss:focus {
1370         outline: 1px solid #5b9dd9;
1371 }
1372
1373 .notice-success,
1374 div.updated {
1375         border-left-color: #46b450;
1376 }
1377
1378 .notice-success.notice-alt {
1379         background-color: #ecf7ed;
1380 }
1381
1382 .notice-warning {
1383         border-left-color: #ffb900;
1384 }
1385
1386 .notice-warning.notice-alt {
1387         background-color: #fff8e5;
1388 }
1389
1390 .notice-error,
1391 div.error {
1392         border-left-color: #dc3232;
1393 }
1394
1395 .notice-error.notice-alt {
1396         background-color: #fbeaea;
1397 }
1398
1399 .notice-info {
1400         border-left-color: #00a0d2;
1401 }
1402
1403 .notice-info.notice-alt {
1404         background-color: #e5f5fa;
1405 }
1406
1407 .wrap .notice,
1408 .wrap div.updated,
1409 .wrap div.error,
1410 .media-upload-form .notice,
1411 .media-upload-form div.error {
1412         margin: 5px 0 15px;
1413 }
1414
1415 #update-nag,
1416 .update-nag {
1417         display: inline-block;
1418         line-height: 19px;
1419         padding: 11px 15px;
1420         font-size: 14px;
1421         text-align: left;
1422         margin: 25px 20px 0 2px;
1423         background-color: #fff;
1424         border-left: 4px solid #ffba00;
1425         -webkit-box-shadow: 0 1px 1px 0 rgba(0,0,0,0.1);
1426         box-shadow: 0 1px 1px 0 rgba(0,0,0,0.1);
1427 }
1428
1429 .update-message {
1430         color: #000;
1431 }
1432
1433 ul#dismissed-updates {
1434         display: none;
1435 }
1436
1437 form.upgrade {
1438         margin-top: 8px;
1439 }
1440
1441 form.upgrade .hint {
1442         font-style: italic;
1443         font-size: 85%;
1444         margin: -0.5em 0 2em 0;
1445 }
1446
1447 .update-php .spinner {
1448         float: none;
1449         margin: -4px 0;
1450 }
1451
1452 #ajax-loading,
1453 .ajax-loading,
1454 .ajax-feedback,
1455 .imgedit-wait-spin,
1456 .list-ajax-loading { /* deprecated */
1457         visibility: hidden;
1458 }
1459
1460 #ajax-response.alignleft {
1461         margin-left: 2em;
1462 }
1463
1464 /* @todo: this does not need its own section anymore */
1465 /*------------------------------------------------------------------------------
1466   6.0 - Admin Header
1467 ------------------------------------------------------------------------------*/
1468 #adminmenu a,
1469 #taglist a,
1470 #catlist a {
1471         text-decoration: none;
1472 }
1473
1474 /*------------------------------------------------------------------------------
1475   6.1 - Screen Options Tabs
1476 ------------------------------------------------------------------------------*/
1477
1478 #screen-options-wrap,
1479 #contextual-help-wrap {
1480         margin: 0;
1481         padding: 8px 20px 12px;
1482         position: relative;
1483 }
1484
1485 #contextual-help-wrap {
1486         overflow: auto;
1487         margin-left: 0 !important;
1488 }
1489
1490 #screen-meta .screen-reader-text {
1491         visibility: hidden;
1492 }
1493
1494 #screen-meta-links {
1495         margin: 0 20px 0 0;
1496 }
1497
1498 /* screen options and help tabs revert */
1499 #screen-meta {
1500         display: none;
1501         margin: 0 20px -1px 0px;
1502         position: relative;
1503         background-color: #fff;
1504         border: 1px solid #ddd;
1505         border-top: none;
1506         -webkit-box-shadow: 0 1px 0 rgba(0,0,0,.025);
1507         box-shadow: 0 1px 0 rgba(0,0,0,.025);
1508 }
1509
1510 #screen-options-link-wrap,
1511 #contextual-help-link-wrap {
1512         float: right;
1513         height: 28px;
1514         margin: 0 0 0 6px;
1515         border: 1px solid #ddd;
1516         border-top: none;
1517         background: #fff;
1518         -webkit-box-shadow: 0 1px 1px -1px rgba(0,0,0,0.1);
1519         box-shadow: 0 1px 1px -1px rgba(0,0,0,0.1);
1520 }
1521
1522 #screen-meta-links .screen-meta-toggle {
1523         position: relative;
1524         top: 0;
1525 }
1526
1527 #screen-meta-links .show-settings {
1528         border: 0;
1529         background: none;
1530         -webkit-border-radius: 0;
1531         border-radius: 0;
1532         color: #72777c;
1533         line-height: 1.7;
1534         padding: 3px 6px 3px 16px;
1535 }
1536
1537 #screen-meta-links .show-settings:hover,
1538 #screen-meta-links .show-settings:active,
1539 #screen-meta-links .show-settings:focus {
1540         color: #32373c;
1541 }
1542
1543 #screen-meta-links .show-settings:active {
1544         -webkit-box-shadow: none;
1545         box-shadow: none;
1546         -webkit-transform: none;
1547         -ms-transform: none;
1548         transform: none;
1549 }
1550
1551 #screen-meta-links .show-settings:after {
1552         right: 0;
1553         content: "\f140";
1554         font: normal 20px/1 dashicons;
1555         speak: none;
1556         display: inline-block;
1557         padding: 0 5px 0 0;
1558         bottom: 2px;
1559         position: relative;
1560         vertical-align: bottom;
1561         -webkit-font-smoothing: antialiased;
1562         -moz-osx-font-smoothing: grayscale;
1563         text-decoration: none !important;
1564         color: #72777c;
1565 }
1566
1567 #screen-meta-links .screen-meta-active:after {
1568         content: "\f142";
1569 }
1570
1571 /* end screen options and help tabs */
1572
1573 .toggle-arrow {
1574         background-repeat: no-repeat;
1575         background-position: top left;
1576         background-color: transparent;
1577         height: 22px;
1578         line-height: 22px;
1579         display: block;
1580 }
1581
1582 .toggle-arrow-active {
1583         background-position: bottom left;
1584 }
1585
1586 #screen-options-wrap h5, /* Back-compat for old plugins */
1587 #screen-options-wrap legend,
1588 #contextual-help-wrap h5 {
1589         margin: 0;
1590         padding: 8px 0;
1591         font-size: 13px;
1592         font-weight: 600;
1593 }
1594
1595 .ie8 #screen-options-wrap legend {
1596         color: inherit;
1597 }
1598
1599 .metabox-prefs label {
1600         display: inline-block;
1601         padding-right: 15px;
1602         line-height: 30px;
1603 }
1604
1605 #number-of-columns {
1606         display: inline-block;
1607         vertical-align: middle;
1608         line-height: 30px;
1609 }
1610
1611 .metabox-prefs input[type=checkbox] {
1612         margin-top: 0;
1613         margin-right: 6px;
1614 }
1615
1616 .metabox-prefs label input,
1617 .metabox-prefs label input[type=checkbox] {
1618         margin: -4px 5px 0 0;
1619 }
1620
1621 .metabox-prefs .columns-prefs label input {
1622         margin: -1px 2px 0 0;
1623 }
1624
1625 .metabox-prefs label a {
1626         display: none;
1627 }
1628
1629 .metabox-prefs .screen-options input,
1630 .metabox-prefs .screen-options label {
1631         margin-top: 0;
1632         margin-bottom: 0;
1633         vertical-align: middle;
1634 }
1635
1636 .metabox-prefs .screen-options .screen-per-page {
1637         margin-right: 15px;
1638 }
1639
1640 .metabox-prefs .screen-options label {
1641         line-height: 28px;
1642         padding-right: 0;
1643 }
1644
1645 .screen-options + .screen-options {
1646         margin-top: 10px;
1647 }
1648
1649 .metabox-prefs .submit {
1650         margin-top: 1em;
1651         padding: 0;
1652 }
1653
1654 /*------------------------------------------------------------------------------
1655   6.2 - Help Menu
1656 ------------------------------------------------------------------------------*/
1657
1658 #contextual-help-wrap {
1659         padding: 0;
1660 }
1661
1662 #contextual-help-columns {
1663         position: relative;
1664 }
1665
1666 #contextual-help-back {
1667         position: absolute;
1668         top: 0;
1669         bottom: 0;
1670         left: 150px;
1671         right: 170px;
1672         border: 1px solid #e1e1e1;
1673         border-top: none;
1674         border-bottom: none;
1675         background: #f6fbfd;
1676 }
1677
1678 #contextual-help-wrap.no-sidebar #contextual-help-back {
1679         right: 0;
1680         border-right-width: 0;
1681         -webkit-border-bottom-right-radius: 2px;
1682         border-bottom-right-radius: 2px;
1683 }
1684
1685 .contextual-help-tabs {
1686         float: left;
1687         width: 150px;
1688         margin: 0;
1689 }
1690
1691 .contextual-help-tabs ul {
1692         margin: 1em 0;
1693 }
1694
1695 .contextual-help-tabs li {
1696         margin-bottom: 0;
1697         list-style-type: none;
1698         border-style: solid;
1699         border-width: 0 0 0 2px;
1700         border-color: transparent;
1701 }
1702
1703 .contextual-help-tabs a {
1704         display: block;
1705         padding: 5px 5px 5px 12px;
1706         line-height: 18px;
1707         text-decoration: none;
1708         border: 1px solid transparent;
1709         border-right: none;
1710         border-left: none;
1711 }
1712
1713 .contextual-help-tabs a:hover {
1714         color: #32373c;
1715 }
1716
1717 .contextual-help-tabs .active {
1718         padding: 0;
1719         margin: 0 -1px 0 0;
1720         border-left: 2px solid #00a0d2;
1721         background: #f6fbfd;
1722         -webkit-box-shadow: 0 2px 0 rgba(0,0,0,0.02), 0 1px 0 rgba(0,0,0,0.02);
1723         box-shadow: 0 2px 0 rgba(0,0,0,0.02), 0 1px 0 rgba(0,0,0,0.02);
1724 }
1725
1726 .contextual-help-tabs .active a {
1727         border-color: #e1e1e1;
1728         color: #32373c;
1729 }
1730
1731 .contextual-help-tabs-wrap {
1732         padding: 0 20px;
1733         overflow: auto;
1734 }
1735
1736 .help-tab-content {
1737         display: none;
1738         margin: 0 22px 12px 0;
1739         line-height: 1.6em;
1740 }
1741
1742 .help-tab-content.active {
1743         display: block;
1744 }
1745
1746 .help-tab-content ul li {
1747         list-style-type: disc;
1748         margin-left: 18px;
1749 }
1750
1751 .contextual-help-sidebar {
1752         width: 150px;
1753         float: right;
1754         padding: 0 8px 0 12px;
1755         overflow: auto;
1756 }
1757
1758 /*------------------------------------------------------------------------------
1759   8.0 - Layout Blocks
1760 ------------------------------------------------------------------------------*/
1761
1762 html.wp-toolbar {
1763         padding-top: 32px;
1764         -webkit-box-sizing: border-box;
1765         -moz-box-sizing: border-box;
1766         box-sizing: border-box;
1767 }
1768
1769 .widefat th,
1770 .widefat td {
1771         color: #555;
1772 }
1773
1774 .widefat th,
1775 .widefat thead td,
1776 .widefat tfoot td {
1777         font-weight: normal;
1778 }
1779
1780 .widefat thead tr th,
1781 .widefat thead tr td,
1782 .widefat tfoot tr th,
1783 .widefat tfoot tr td {
1784         color: #32373c;
1785 }
1786
1787 .widefat td p {
1788         margin: 2px 0 0.8em;
1789 }
1790
1791 .widefat p,
1792 .widefat ol,
1793 .widefat ul {
1794         color: #32373c;
1795 }
1796
1797 .widefat .column-comment p {
1798         margin: 0.6em 0;
1799 }
1800
1801 /* Screens with postboxes */
1802 .postbox-container {
1803         float: left;
1804 }
1805
1806 .postbox-container .meta-box-sortables {
1807         -webkit-box-sizing: border-box;
1808         -moz-box-sizing: border-box;
1809         box-sizing: border-box;
1810 }
1811
1812 #wpbody-content .metabox-holder {
1813         padding-top: 10px;
1814 }
1815
1816 .metabox-holder .postbox-container .empty-container {
1817         border: 3px dashed #b4b9be;
1818         height: 250px;
1819         position: relative;
1820 }
1821
1822 .metabox-holder .postbox-container .empty-container:after {
1823         content: attr(data-emptystring);
1824         margin: auto;
1825         position: absolute;
1826         top: 0;
1827         left: 0;
1828         bottom: 0;
1829         right: 0;
1830         height: 1em;
1831         width: 200px;
1832         text-align: center;
1833         color: #ccc;
1834         font-size:18px;
1835         display: none;
1836 }
1837
1838 .metabox-holder.columns-1 .postbox-container .empty-container,
1839 .columns-2 #postbox-container-3 .empty-container,
1840 .columns-2 #postbox-container-4 .empty-container,
1841 .columns-3 #postbox-container-4 .empty-container {
1842         border: 0 none;
1843         height: 0;
1844         min-height: 0;
1845 }
1846
1847 #post-body-content {
1848         width: 100%;
1849         min-width: 463px;
1850         float: left;
1851 }
1852
1853 #post-body.columns-2 #postbox-container-1 {
1854         float: right;
1855         margin-right: -300px;
1856         width: 280px;
1857 }
1858
1859 #post-body.columns-2 #side-sortables {
1860         min-height: 250px;
1861 }
1862
1863 /* one column on the dash */
1864 @media only screen and (max-width: 799px) {
1865         #wpbody-content .metabox-holder .postbox-container .empty-container {
1866                 border: 0 none;
1867                 height: 0;
1868                 min-height: 0;
1869         }
1870 }
1871
1872 .js .widget .widget-top,
1873 .js .postbox .hndle {
1874         cursor: move;
1875 }
1876
1877 .hndle a {
1878         font-size: 11px;
1879         font-weight: normal;
1880 }
1881
1882 .postbox .handlediv {
1883         display: none;
1884         float: right;
1885         width: 36px;
1886         height: 36px;
1887         padding: 0;
1888 }
1889
1890 .js .postbox .handlediv {
1891         display: block;
1892 }
1893
1894 .sortable-placeholder {
1895         border: 1px dashed #b4b9be;
1896         margin-bottom: 20px;
1897 }
1898
1899 .postbox,
1900 .stuffbox {
1901         margin-bottom: 20px;
1902         padding: 0;
1903         line-height: 1;
1904 }
1905
1906 /* user-select is not a part of the CSS standard - may change behavior in the future */
1907 .postbox .hndle,
1908 .stuffbox .hndle {
1909         -webkit-user-select: none;
1910         -moz-user-select: none;
1911         -ms-user-select: none;
1912         user-select: none;
1913 }
1914
1915 .postbox .inside,
1916 .stuffbox .inside {
1917         padding: 0 12px 12px;
1918         line-height: 1.4em;
1919         font-size: 13px;
1920 }
1921
1922 .postbox .inside {
1923         margin: 11px 0;
1924         position: relative;
1925 }
1926
1927 .postbox .inside > p:last-child,
1928 .rss-widget ul li:last-child {
1929         margin-bottom: 1px !important;
1930 }
1931
1932 .postbox.closed h3 {
1933         border: none;
1934         -webkit-box-shadow: none;
1935         box-shadow: none;
1936 }
1937
1938 .postbox table.form-table {
1939         margin-bottom: 0;
1940 }
1941
1942 .postbox table.widefat {
1943         -webkit-box-shadow: none;
1944         box-shadow: none;
1945 }
1946
1947 .temp-border {
1948         border: 1px dotted #ccc;
1949 }
1950
1951 .columns-prefs label {
1952         padding: 0 10px 0 0;
1953 }
1954
1955 /* @todo: what is this doing here */
1956 #dashboard_right_now .versions .b,
1957 #post-status-display,
1958 #post-visibility-display,
1959 #adminmenu .wp-submenu li.current,
1960 #adminmenu .wp-submenu li.current a,
1961 #adminmenu .wp-submenu li.current a:hover,
1962 .media-item .percent,
1963 .plugins .name,
1964 #pass-strength-result.strong,
1965 #pass-strength-result.short,
1966 #ed_reply_toolbar #ed_reply_strong,
1967 .item-controls .item-order a,
1968 .feature-filter .feature-name {
1969         font-weight: 600;
1970 }
1971
1972 /*------------------------------------------------------------------------------
1973   21.0 - Admin Footer
1974 ------------------------------------------------------------------------------*/
1975
1976 #wpfooter {
1977         position: absolute;
1978         bottom: 0;
1979         left: 0;
1980         right: 0;
1981         padding: 10px 20px;
1982         color: #555d66;
1983 }
1984
1985 #wpfooter p {
1986         font-size: 13px;
1987         margin: 0;
1988         line-height: 20px;
1989 }
1990
1991 #footer-thankyou {
1992         font-style: italic;
1993 }
1994
1995 #wpfooter a {
1996         text-decoration: none;
1997 }
1998
1999 #wpfooter a:hover {
2000         text-decoration: underline;
2001 }
2002
2003 /*------------------------------------------------------------------------------
2004   25.0 - Tabbed Admin Screen Interface (Experimental)
2005 ------------------------------------------------------------------------------*/
2006
2007 .nav-tab {
2008         float: left;
2009         border: 1px solid #ccc;
2010         border-bottom: none;
2011         margin-left: 0.5em; /* half the font size so set the font size properly */
2012         padding: 5px 10px;
2013         font-size: 14px;
2014         line-height: 24px;
2015         font-weight: 600;
2016         background: #e5e5e5;
2017         color: #555;
2018         text-decoration: none;
2019         white-space: nowrap;
2020 }
2021
2022 h3 .nav-tab, /* Back-compat for pre-4.4 */
2023 .nav-tab-small .nav-tab {
2024         padding: 5px 14px;
2025         font-size: 12px;
2026         line-height: 16px;
2027 }
2028
2029 .nav-tab:hover,
2030 .nav-tab:focus {
2031         background-color: #fff;
2032         color: #444;
2033 }
2034
2035 .nav-tab-active,
2036 .nav-tab:focus:active {
2037         -webkit-box-shadow: none;
2038         box-shadow: none;
2039 }
2040
2041 .nav-tab-active {
2042         margin-bottom: -1px;
2043         color: #444;
2044 }
2045
2046 .nav-tab-active,
2047 .nav-tab-active:hover,
2048 .nav-tab-active:focus,
2049 .nav-tab-active:focus:active {
2050         border-bottom: 1px solid #f1f1f1;
2051         background: #f1f1f1;
2052         color: #000;
2053 }
2054
2055 h1.nav-tab-wrapper, /* Back-compat for pre-4.4 */
2056 .wrap h2.nav-tab-wrapper, /* higher specificity to override .wrap > h2:first-child */
2057 h3.nav-tab-wrapper {
2058         border-bottom: 1px solid #ccc;
2059         margin: 0;
2060         padding-top: 9px;
2061         padding-bottom: 0;
2062         line-height: inherit;
2063 }
2064
2065 /* Back-compat for plugins. Deprecated. Use .wp-clearfix instead. */
2066 .nav-tab-wrapper:not(.wp-clearfix):after {
2067         content: "";
2068         display: table;
2069         clear: both;
2070  }
2071
2072 .ie8 .nav-tab-wrapper {
2073         /* contain floats establishing a new block formatting context */
2074         display: inline-block;
2075         width: 100%;
2076         vertical-align: top;
2077 }
2078
2079 /*------------------------------------------------------------------------------
2080   26.0 - Misc
2081 ------------------------------------------------------------------------------*/
2082
2083 .spinner {
2084         background: url(../images/spinner.gif) no-repeat;
2085         -webkit-background-size: 20px 20px;
2086         background-size: 20px 20px;
2087         display: inline-block;
2088         visibility: hidden;
2089         float: right;
2090         vertical-align: middle;
2091         opacity: 0.7;
2092         filter: alpha(opacity=70);
2093         width: 20px;
2094         height: 20px;
2095         margin: 4px 10px 0;
2096 }
2097
2098 .spinner.is-active {
2099         visibility: visible;
2100 }
2101
2102 #template div {
2103         margin-right: 190px;
2104 }
2105
2106 .metabox-holder .stuffbox > h3, /* Back-compat for pre-4.4 */
2107 .metabox-holder .postbox > h3, /* Back-compat for pre-4.4 */
2108 .metabox-holder h3.hndle, /* Back-compat for pre-4.4 */
2109 .metabox-holder h2.hndle {
2110         font-size: 14px;
2111         padding: 8px 12px;
2112         margin: 0;
2113         line-height: 1.4;
2114 }
2115
2116 /* Back-compat for nav-menus screen */
2117 .nav-menus-php .metabox-holder h3 {
2118         padding: 10px 10px 11px 14px;
2119         line-height: 21px;
2120 }
2121
2122 #templateside ul li a {
2123         text-decoration: none;
2124 }
2125
2126 .plugin-install #description,
2127 .plugin-install-network #description {
2128         width: 60%;
2129 }
2130
2131 table .vers,
2132 table .column-visible,
2133 table .column-rating {
2134         text-align: left;
2135 }
2136
2137 .attention,
2138 .error-message {
2139         color: red;
2140         font-weight: 600;
2141 }
2142
2143 /* Scrollbar fix for bulk upgrade iframe */
2144 body.iframe {
2145         height: 98%;
2146 }
2147
2148 /* Upgrader styles, Specific to Language Packs */
2149 .lp-show-latest p {
2150         display: none;
2151 }
2152 .lp-show-latest p:last-child,
2153 .lp-show-latest .lp-error p {
2154         display: block;
2155 }
2156
2157 /* - Only used once or twice in all of WP - deprecate for global style
2158 ------------------------------------------------------------------------------*/
2159 .media-icon {
2160         width: 62px; /* icon + border */
2161         text-align: center;
2162 }
2163
2164 .media-icon img {
2165         border: 1px solid #e5e5e5;
2166         border: 1px solid rgba(0, 0, 0, 0.07);
2167 }
2168
2169 #howto {
2170         font-size: 11px;
2171         margin: 0 5px;
2172         display: block;
2173 }
2174
2175 .importers td {
2176         padding-right: 14px;
2177 }
2178
2179 .importers {
2180         font-size: 16px;
2181         width: auto;
2182 }
2183
2184 #post-body #post-body-content #namediv h3, /* Back-compat for pre-4.4 */
2185 #post-body #post-body-content #namediv h2 {
2186         margin-top: 0;
2187 }
2188
2189 .edit-comment-author {
2190         font-size: 14px;
2191         line-height: 1.4;
2192         font-weight: 600;
2193         color: #222;
2194         margin: 2px 0 0 9px;
2195 }
2196
2197 #namediv h3 label, /* Back-compat for pre-4.4 */
2198 #namediv h2 label {
2199         vertical-align: baseline;
2200 }
2201
2202 #namediv table {
2203         width: 100%;
2204 }
2205
2206 #namediv td.first {
2207         width: 10px;
2208         white-space: nowrap;
2209 }
2210
2211 #namediv input {
2212         width: 98%;
2213 }
2214
2215 #namediv p {
2216         margin: 10px 0;
2217 }
2218
2219 #submitdiv h3 {
2220         margin-bottom: 0 !important;
2221 }
2222
2223 /* - Used - but could/should be deprecated with a CSS reset
2224 ------------------------------------------------------------------------------*/
2225 .zerosize {
2226         height: 0;
2227         width: 0;
2228         margin: 0;
2229         border: 0;
2230         padding: 0;
2231         overflow: hidden;
2232         position: absolute;
2233 }
2234
2235 br.clear {
2236         height: 2px;
2237         line-height: 2px;
2238 }
2239
2240 .checkbox {
2241         border: none;
2242         margin: 0;
2243         padding: 0;
2244 }
2245
2246 fieldset {
2247         border: 0;
2248         padding: 0;
2249         margin: 0;
2250 }
2251
2252 .post-categories {
2253         display: inline;
2254         margin: 0;
2255         padding: 0;
2256 }
2257
2258 .post-categories li {
2259         display: inline;
2260 }
2261
2262 /* Star Ratings - Back-compat for pre-3.8 */
2263 div.star-holder {
2264         position: relative;
2265         height: 17px;
2266         width: 100px;
2267         background: url(../images/stars.png?ver=20121108) repeat-x bottom left;
2268 }
2269
2270 div.star-holder .star-rating {
2271         background: url(../images/stars.png?ver=20121108) repeat-x top left;
2272         height: 17px;
2273         float: left;
2274 }
2275
2276 /* Star Ratings */
2277 .star-rating {
2278         white-space: nowrap;
2279 }
2280 .star-rating .star {
2281         display: inline-block;
2282         width: 20px;
2283         height: 20px;
2284         -webkit-font-smoothing: antialiased;
2285         font-size: 20px;
2286         line-height: 1;
2287         font-family: dashicons;
2288         text-decoration: inherit;
2289         font-weight: normal;
2290         font-style: normal;
2291         vertical-align: top;
2292         -webkit-transition: color .1s ease-in 0;
2293         transition: color .1s ease-in 0;
2294         text-align: center;
2295         color: #ffb900;
2296 }
2297
2298 .star-rating .star-full:before {
2299         content: "\f155";
2300 }
2301
2302 .star-rating .star-half:before {
2303         content: "\f459";
2304 }
2305
2306 .rtl .star-rating .star-half {
2307         -webkit-transform: rotateY(180deg);
2308         -ms-transform: rotateY(180deg);
2309         transform: rotateY(180deg);
2310 }
2311
2312 .star-rating .star-empty:before {
2313         content: "\f154";
2314 }
2315
2316 div.action-links {
2317         font-weight: normal;
2318         margin: 6px 0 0;
2319 }
2320
2321 /* Plugin install thickbox */
2322 #plugin-information {
2323         background: #fff;
2324         position: fixed;
2325         top: 0;
2326         right: 0;
2327         bottom: 0;
2328         left: 0;
2329         height: 100%;
2330         padding: 0;
2331 }
2332
2333 #plugin-information-scrollable {
2334         overflow: auto;
2335         -webkit-overflow-scrolling: touch;
2336         height: 100%;
2337 }
2338
2339 #plugin-information-title {
2340         padding: 0 20px;
2341         background: #f5f5f5;
2342         font-size: 22px;
2343         font-weight: 600;
2344         line-height: 56px;
2345         position: relative;
2346         top: 0;
2347         right: 0;
2348         left: 0;
2349         height: 56px;
2350         overflow: hidden;
2351         text-overflow: ellipsis;
2352         white-space: nowrap;
2353 }
2354
2355 #plugin-information-title.with-banner {
2356         margin-right: 0;
2357         height: 250px;
2358         bottom: 250px;
2359         -webkit-background-size: cover;
2360         background-size: cover;
2361 }
2362
2363 #plugin-information-title h2 {
2364         font-size: 1em;
2365         font-weight: bold;
2366         padding: 0;
2367         margin: 0;
2368         max-width: 680px;
2369         overflow: hidden;
2370         text-overflow: ellipsis;
2371         white-space: nowrap;
2372 }
2373
2374 #plugin-information-title.with-banner h2 {
2375         font-family: "Helvetica Neue", sans-serif;
2376         display: inline-block;
2377         font-size: 30px;
2378         line-height: 50px;
2379         padding: 0 15px;
2380         margin: 174px 0 0 10px;
2381         color: #fff;
2382         background: rgba( 30, 30, 30, 0.9 );
2383         text-shadow: 0 1px 3px rgba( 0, 0, 0, 0.4 );
2384         -webkit-box-shadow: 0 0 30px rgba( 255, 255, 255, 0.1 );
2385         box-shadow: 0 0 30px rgba( 255, 255, 255, 0.1 );
2386         -webkit-border-radius: 8px;
2387         border-radius: 8px;
2388 }
2389
2390 #plugin-information-title div.vignette {
2391         display: none;
2392 }
2393
2394 #plugin-information-title.with-banner div.vignette {
2395         display: block;
2396         float: right;
2397         top: 0;
2398         height: 250px;
2399         width: 772px;
2400         margin: 0 -20px;
2401         background: transparent;
2402         -webkit-box-shadow: inset 0 0 50px 4px rgba( 0, 0, 0, 0.2 ), inset 0 -1px 0 rgba( 0, 0, 0, 0.1 );
2403         box-shadow: inset 0 0 50px 4px rgba( 0, 0, 0, 0.2 ), inset 0 -1px 0 rgba( 0, 0, 0, 0.1 );
2404 }
2405
2406 #plugin-information-tabs {
2407         padding: 0 16px;
2408         position: relative;
2409         right: 0;
2410         left: 0;
2411         height: 36px;
2412         z-index: 1;
2413         border-bottom: 1px solid #ddd;
2414         background: #f3f3f3;
2415 }
2416
2417 #plugin-information-tabs a {
2418         position: relative;
2419         float: left;
2420         padding: 9px 10px;
2421         margin: 0;
2422         height: 18px;
2423         line-height: 18px;
2424         font-size: 14px;
2425         text-decoration: none;
2426         -webkit-transition: none;
2427         transition: none;
2428 }
2429
2430 #plugin-information-tabs a.current {
2431         margin: 0 -1px 0;
2432         background: #fff;
2433         border: 1px solid #ddd;
2434         border-bottom-color: #fff;
2435         padding-top: 8px;
2436         color: #32373c;
2437 }
2438
2439 #plugin-information-tabs.with-banner a.current {
2440         border-top: none;
2441         padding-top: 9px;
2442 }
2443
2444 #plugin-information-tabs a:active,
2445 #plugin-information-tabs a:focus {
2446         outline: none;
2447 }
2448
2449 #plugin-information-content {
2450         overflow: hidden; /* equal height column trick */
2451         background: #fff;
2452         position: relative;
2453         top: 0;
2454         right: 0;
2455         left: 0;
2456         min-height: 100%;
2457         /* Height of title + tabs + install now */
2458         min-height: -webkit-calc( 100% - 152px );
2459         min-height: calc( 100% - 152px );
2460 }
2461
2462 #plugin-information-content.with-banner {
2463         /* Height of banner + tabs + install now */
2464         min-height: -webkit-calc( 100% - 346px );
2465         min-height: calc( 100% - 346px );
2466 }
2467
2468 #section-holder {
2469         position: relative;
2470         top: 0;
2471         right: 250px;
2472         bottom: 0;
2473         left: 0;
2474         margin-right: 250px; /* FYI box */
2475         padding: 10px 26px;
2476         margin-bottom: -99939px; /* 60px less than the padding below to accommodate footer */
2477         padding-bottom: 99999px; /* equal height column trick */
2478 }
2479
2480 #section-holder .updated {
2481         margin: 16px 0;
2482 }
2483
2484 #plugin-information .fyi {
2485         float: right;
2486         position: relative;
2487         top: 0;
2488         right: 0;
2489         padding: 16px;
2490         margin-bottom: -99939px; /* 60px less than the padding below to accommodate footer */
2491         padding-bottom: 99999px; /* equal height column trick */
2492         width: 217px;
2493         border-left: 1px solid #ddd;
2494         background: #f3f3f3;
2495         color: #666;
2496 }
2497
2498 #plugin-information .fyi strong {
2499         color: #444;
2500 }
2501
2502 #plugin-information .fyi h3 {
2503         font-weight: bold;
2504         text-transform: uppercase;
2505         font-size: 12px;
2506         color: #666;
2507         margin: 24px 0 8px;
2508 }
2509
2510 #plugin-information .fyi h2 {
2511         font-size: 0.9em;
2512         margin-bottom: 0;
2513         margin-right: 0;
2514 }
2515
2516 #plugin-information .fyi ul {
2517         padding: 0;
2518         margin: 0;
2519         list-style: none;
2520 }
2521
2522 #plugin-information .fyi li {
2523         margin: 0 0 10px;
2524 }
2525
2526 #plugin-information .fyi-description {
2527         margin-top: 0;
2528 }
2529
2530 #plugin-information .counter-container {
2531         margin: 3px 0;
2532 }
2533
2534 #plugin-information .counter-label {
2535         float: left;
2536         margin-right: 5px;
2537         min-width: 55px;
2538 }
2539
2540 #plugin-information .counter-back {
2541         height: 17px;
2542         width: 92px;
2543         background-color: #e5e5e5;
2544         float: left;
2545 }
2546
2547 #plugin-information .counter-bar {
2548         height: 17px;
2549         background-color: #ffc733; /* slightly lighter than stars due to larger expanse */
2550         float: left;
2551 }
2552
2553 #plugin-information .counter-count {
2554         margin-left: 5px;
2555 }
2556
2557 #plugin-information .fyi ul.contributors {
2558         margin-top: 10px;
2559 }
2560
2561 #plugin-information .fyi ul.contributors li {
2562         display: inline-block;
2563         margin-right: 8px;
2564         vertical-align: middle;
2565 }
2566
2567 #plugin-information .fyi ul.contributors li {
2568         display: inline-block;
2569         margin-right: 8px;
2570         vertical-align: middle;
2571 }
2572
2573 #plugin-information .fyi ul.contributors li img {
2574         vertical-align: middle;
2575         margin-right: 4px;
2576 }
2577
2578 #plugin-information-footer {
2579         padding: 13px 16px;
2580         position: absolute;
2581         right: 0;
2582         bottom: 0;
2583         left: 0;
2584         height: 33px; /* 33+13+13+1=60 */
2585         border-top: 1px solid #ddd;
2586         background: #f3f3f3;
2587 }
2588
2589 /* rtl:ignore */
2590 #plugin-information .section {
2591         direction: ltr;
2592 }
2593
2594 /* rtl:ignore */
2595 #plugin-information .section ul,
2596 #plugin-information .section ol {
2597         list-style-type: disc;
2598         margin-left: 24px;
2599 }
2600
2601 #plugin-information .section,
2602 #plugin-information .section p {
2603         font-size: 14px;
2604         line-height: 1.7;
2605 }
2606
2607 #plugin-information #section-screenshots ol {
2608         list-style: none;
2609         margin: 0;
2610 }
2611
2612 #plugin-information #section-screenshots li img {
2613         vertical-align: text-top;
2614         margin-top: 16px;
2615         max-width: 100%;
2616         width: auto;
2617         height: auto;
2618         -webkit-box-shadow: 0 1px 2px rgba( 0, 0, 0, 0.3 );
2619         box-shadow: 0 1px 2px rgba( 0, 0, 0, 0.3 );
2620 }
2621
2622 /* rtl:ignore */
2623 #plugin-information #section-screenshots li p {
2624         font-style: italic;
2625         padding-left: 20px;
2626 }
2627
2628 #plugin-information pre {
2629         padding: 7px;
2630         overflow: auto;
2631         border: 1px solid #ccc;
2632 }
2633
2634 /* rtl:ignore */
2635 #plugin-information .review {
2636         overflow: hidden; /* clearfix */
2637         width: 100%;
2638         margin-bottom: 20px;
2639         border-bottom: 1px solid #e5e5e5;
2640 }
2641
2642 #plugin-information .review-title-section {
2643         overflow: hidden; /* clearfix */
2644 }
2645
2646 /* rtl:ignore */
2647 #plugin-information .review-title-section h4 {
2648         display: inline-block;
2649         float: left;
2650         margin: 0 6px 0 0;
2651 }
2652
2653 #plugin-information .reviewer-info p {
2654         clear: both;
2655         margin: 0;
2656         padding-top: 2px;
2657 }
2658
2659 /* rtl:ignore */
2660 #plugin-information .reviewer-info .avatar {
2661         float: left;
2662         margin: 4px 6px 0 0;
2663 }
2664
2665 /* rtl:ignore */
2666 #plugin-information .reviewer-info .star-rating {
2667         float: left;
2668 }
2669
2670 /* rtl:ignore */
2671 #plugin-information .review-meta {
2672         float: left;
2673         margin-left: 0.75em;
2674 }
2675
2676 /* rtl:ignore */
2677 #plugin-information .review-body {
2678         float: left;
2679         width: 100%;
2680 }
2681
2682 .plugin-version-author-uri {
2683         font-size: 13px;
2684 }
2685
2686 @media screen and ( max-width: 771px ) {
2687         #plugin-information-title.with-banner {
2688                 height: 100px;
2689                 bottom: 100px;
2690         }
2691
2692         #plugin-information-title.with-banner h2 {
2693                 margin-top: 30px;
2694                 font-size: 20px;
2695                 line-height: 40px;
2696                 max-width: 85%;
2697         }
2698
2699         #plugin-information-title.with-banner div.vignette {
2700                 height: 100px;
2701                 bottom: 100px;
2702                 width: 800%;
2703         }
2704
2705         #plugin-information-tabs {
2706                 overflow: hidden; /* clearfix */
2707                 padding: 0;
2708                 height: auto; /* let tabs wrap */
2709         }
2710
2711         #plugin-information-tabs a.current {
2712                 margin-bottom: 0;
2713                 border-bottom: none;
2714         }
2715
2716         #plugin-information .fyi {
2717                 float: none;
2718                 border: 1px solid #ddd;
2719                 position: static;
2720                 width: auto;
2721                 margin: 26px 26px 0;
2722                 padding-bottom: 0; /* reset from the two column height fix */
2723         }
2724
2725         #section-holder {
2726                 position: static;
2727                 margin: 0;
2728                 padding-bottom: 70px; /* reset from the two column height fix, plus accomodate footer */
2729         }
2730
2731         #plugin-information .fyi h3,
2732         #plugin-information .fyi small {
2733                 display: none;
2734         }
2735
2736         #plugin-information-footer {
2737                 padding: 12px 16px 0;
2738                 height: 46px;
2739         }
2740 }
2741
2742 /* Thickbox for Plugin Install screen */
2743 body.about-php #TB_window,
2744 body.plugin-install-php #TB_window,
2745 body.import-php #TB_window,
2746 body.plugins-php #TB_window,
2747 body.update-core-php #TB_window,
2748 body.index-php #TB_window {
2749         background: #fcfcfc;
2750 }
2751
2752 /* IE 8 needs a change in the pseudo element content */
2753 .ie8 body.about-php #TB_window:before,
2754 .ie8 body.plugin-install-php #TB_window:before,
2755 .ie8 body.import-php #TB_window:before,
2756 .ie8 body.plugins-php #TB_window:before,
2757 .ie8 body.update-core-php #TB_window:before,
2758 .ie8 body.index-php #TB_window:before {
2759         content: " ";
2760         background: none;
2761 }
2762
2763 body.about-php #TB_window.thickbox-loading:before,
2764 body.plugin-install-php #TB_window.thickbox-loading:before,
2765 body.import-php #TB_window.thickbox-loading:before,
2766 body.plugins-php #TB_window.thickbox-loading:before,
2767 body.update-core-php #TB_window.thickbox-loading:before,
2768 body.index-php #TB_window.thickbox-loading:before {
2769         content: "";
2770         display: block;
2771         width: 20px;
2772         height: 20px;
2773         position: absolute;
2774         left: 50%;
2775         top: 50%;
2776         z-index: -1;
2777         margin: -10px 0 0 -10px;
2778         background: #fcfcfc url(../images/spinner.gif) no-repeat center;
2779         -webkit-background-size: 20px 20px;
2780         background-size: 20px 20px;
2781         -webkit-transform: translateZ(0);
2782         transform: translateZ(0);
2783 }
2784
2785 @media print,
2786         (-webkit-min-device-pixel-ratio: 1.25),
2787         (min-resolution: 120dpi) {
2788
2789         body.about-php #TB_window.thickbox-loading:before,
2790         body.plugin-install-php #TB_window.thickbox-loading:before,
2791         body.import-php #TB_window.thickbox-loading:before,
2792         body.plugins-php #TB_window.thickbox-loading:before,
2793         body.update-core-php #TB_window.thickbox-loading:before,
2794         body.index-php #TB_window.thickbox-loading:before {
2795                 background-image: url(../images/spinner-2x.gif);
2796         }
2797 }
2798
2799 body.about-php #TB_title,
2800 body.plugin-install-php #TB_title,
2801 body.import-php #TB_title,
2802 body.plugins-php #TB_title,
2803 body.update-core-php #TB_title,
2804 body.index-php #TB_title {
2805         float: left;
2806         height: 1px;
2807 }
2808
2809 body.about-php #TB_ajaxWindowTitle,
2810 body.plugin-install-php #TB_ajaxWindowTitle,
2811 body.import-php #TB_ajaxWindowTitle,
2812 body.plugins-php #TB_ajaxWindowTitle,
2813 body.update-core-php #TB_ajaxWindowTitle,
2814 body.index-php #TB_ajaxWindowTitle {
2815         display: none;
2816 }
2817
2818 /* only on these screens */
2819 .about-php #TB_closeWindowButton,
2820 .plugin-install-php #TB_closeWindowButton,
2821 .import-php #TB_closeWindowButton,
2822 .plugins-php #TB_closeWindowButton,
2823 .update-core-php #TB_closeWindowButton,
2824 .index-php #TB_closeWindowButton {
2825         left: auto;
2826         right: -30px;
2827         color: #eee;
2828 }
2829
2830
2831 body.about-php #TB_closeWindowButton:hover,
2832 body.about-php #TB_closeWindowButton:focus,
2833 body.plugin-install-php #TB_closeWindowButton:hover,
2834 body.plugin-install-php #TB_closeWindowButton:focus,
2835 body.import-php #TB_closeWindowButton:hover,
2836 body.import-php #TB_closeWindowButton:focus,
2837 body.plugins-php #TB_closeWindowButton:hover,
2838 body.plugins-php #TB_closeWindowButton:focus,
2839 body.update-core-php #TB_closeWindowButton:hover,
2840 body.update-core-php #TB_closeWindowButton:focus,
2841 body.index-php #TB_closeWindowButton:hover,
2842 body.index-php #TB_closeWindowButton:focus {
2843         color: #00a0d2;
2844         outline: none;
2845         -webkit-box-shadow: none;
2846         box-shadow: none;
2847 }
2848
2849 body.about-php .tb-close-icon,
2850 body.plugin-install-php .tb-close-icon,
2851 body.import-php .tb-close-icon,
2852 body.plugins-php .tb-close-icon,
2853 body.update-core-php .tb-close-icon,
2854 body.index-php .tb-close-icon {
2855         display: none;
2856 }
2857
2858 body.about-php #TB_closeWindowButton:after,
2859 body.plugin-install-php #TB_closeWindowButton:after,
2860 body.import-php #TB_closeWindowButton:after,
2861 body.plugins-php #TB_closeWindowButton:after,
2862 body.update-core-php #TB_closeWindowButton:after,
2863 body.index-php #TB_closeWindowButton:after {
2864         content: "\f335";
2865         font: normal 32px/29px 'dashicons';
2866         speak: none;
2867         -webkit-font-smoothing: antialiased;
2868         -moz-osx-font-smoothing: grayscale;
2869 }
2870
2871 /* move plugin install close icon to top on narrow screens */
2872 @media screen and ( max-width: 830px ) {
2873         body.about-php #TB_closeWindowButton,
2874         body.plugin-install-php #TB_closeWindowButton,
2875         body.import-php #TB_closeWindowButton,
2876         body.plugins-php #TB_closeWindowButton,
2877         body.update-core-php #TB_closeWindowButton,
2878         body.index-php #TB_closeWindowButton {
2879                 right: 0;
2880                 top: -30px;
2881         }
2882 }
2883
2884 /* @todo: move this. */
2885 img {
2886         border: none;
2887 }
2888
2889 /* Metabox collapse arrow indicators */
2890 .js .sidebar-name .sidebar-name-arrow:before,
2891 .js .meta-box-sortables .postbox .toggle-indicator:before {
2892         content: "\f142";
2893         display: inline-block;
2894         font: normal 20px/1 dashicons;
2895         speak: none;
2896         -webkit-font-smoothing: antialiased;
2897         -moz-osx-font-smoothing: grayscale;
2898         text-decoration: none !important;
2899 }
2900
2901 .js .widgets-holder-wrap.closed .sidebar-name-arrow:before,
2902 .js .meta-box-sortables .postbox.closed .handlediv .toggle-indicator:before {
2903         content: "\f140";
2904 }
2905
2906 .js .sidebar-name .sidebar-name-arrow:before {
2907         padding: 10px;
2908         left: 0;
2909 }
2910
2911 .js #widgets-left .sidebar-name .sidebar-name-arrow {
2912         display: none;
2913 }
2914
2915 .js #widgets-left .widgets-holder-wrap.closed .sidebar-name .sidebar-name-arrow,
2916 .js #widgets-left .sidebar-name:hover .sidebar-name-arrow {
2917         display: block;
2918 }
2919
2920 .js .postbox .handlediv .toggle-indicator:before {
2921         margin-top: 4px;
2922         width: 20px;
2923         -webkit-border-radius: 50%;
2924         border-radius: 50%;
2925         text-indent: -1px; /* account for the dashicon alignment */
2926 }
2927
2928 .rtl.js .postbox .handlediv .toggle-indicator:before {
2929         text-indent: 1px; /* account for the dashicon alignment */
2930 }
2931
2932 .js .postbox .handlediv:focus {
2933         -webkit-box-shadow: none;
2934         box-shadow: none;
2935         outline: none;
2936 }
2937
2938 .js .postbox .handlediv:focus .toggle-indicator:before {
2939         -webkit-box-shadow:
2940                 0 0 0 1px #5b9dd9,
2941                 0 0 2px 1px rgba(30, 140, 190, .8);
2942         box-shadow:
2943                 0 0 0 1px #5b9dd9,
2944                 0 0 2px 1px rgba(30, 140, 190, .8);
2945 }
2946
2947 /* @todo: appears to be Press This only and overridden */
2948 #photo-add-url-div input[type="text"] {
2949         width: 300px;
2950 }
2951
2952 /* Theme/Plugin Editor */
2953 .alignleft h2 {
2954         margin: 0;
2955 }
2956
2957 #template textarea {
2958         font-family: Consolas, Monaco, monospace;
2959         font-size: 13px;
2960         width: 97%;
2961         background: #f9f9f9;
2962         outline: none;
2963 }
2964
2965 /* rtl:ignore */
2966 #template textarea,
2967 #docs-list {
2968         direction: ltr;
2969 }
2970
2971 #template p {
2972         width: 97%;
2973 }
2974
2975 #templateside {
2976         float: right;
2977         width: 190px;
2978         word-wrap: break-word;
2979 }
2980
2981 #templateside h2,
2982 #postcustomstuff p.submit {
2983         margin: 0;
2984 }
2985
2986 #templateside h4 {
2987         margin: 1em 0 0;
2988 }
2989
2990 #templateside ol,
2991 #templateside ul {
2992         margin: .5em 0;
2993         padding: 0;
2994 }
2995
2996 #templateside li {
2997         margin: 4px 0;
2998 }
2999
3000 #templateside li a,
3001 .theme-editor-php .highlight {
3002         display: block;
3003         padding: 3px 3px 3px 12px;
3004         text-decoration: none;
3005 }
3006
3007 .theme-editor-php .highlight {
3008         margin: -3px 3px -3px -12px;
3009 }
3010
3011 #templateside .highlight {
3012         border: none;
3013         font-weight: bold;
3014 }
3015
3016 .nonessential {
3017         color: #666;
3018         font-size: 11px;
3019         font-style: italic;
3020         padding-left: 12px;
3021 }
3022
3023 #documentation {
3024         margin-top: 10px;
3025 }
3026
3027 #documentation label {
3028         line-height: 22px;
3029         vertical-align: baseline;
3030         font-weight: 600;
3031 }
3032
3033 .fileedit-sub {
3034         padding: 10px 0 8px;
3035         line-height: 180%;
3036 }
3037
3038 /* @todo: can we use a common class for these? */
3039 .nav-menus-php .item-edit:before,
3040 .widget-top a.widget-action:after,
3041 .control-section .accordion-section-title:after,
3042 .accordion-section-title:after {
3043         right: 0;
3044         content: "\f140";
3045         border: none;
3046         background: none;
3047         font: normal 20px/1 dashicons;
3048         speak: none;
3049         display: block;
3050         padding: 0;
3051         text-indent: 0;
3052         text-align: center;
3053         position: relative;
3054         -webkit-font-smoothing: antialiased;
3055         -moz-osx-font-smoothing: grayscale;
3056         text-decoration: none !important;
3057 }
3058
3059 .handlediv,
3060 .item-edit,
3061 .sidebar-name-arrow,
3062 .accordion-section-title:after {
3063         color: #72777c;
3064 }
3065
3066 .widget-action {
3067         color: #555d66; /* #fafafa background in the Widgets screen */
3068 }
3069
3070 .widget-top:hover .widget-action,
3071 .widget-action:focus,
3072 .handlediv:hover,
3073 .handlediv:focus,
3074 .item-edit:hover,
3075 .item-edit:focus,
3076 .sidebar-name:hover .sidebar-name-arrow,
3077 .accordion-section-title:hover:after {
3078         color: #23282d;
3079 }
3080
3081 .widget-top a.widget-action:after {
3082         padding: 1px 2px 1px 0px;
3083         margin-top: 10px;
3084         margin-right: 10px;
3085         -webkit-border-radius: 50%;
3086         border-radius: 50%;
3087 }
3088
3089 .widget-top a.widget-action:focus:after {
3090         -webkit-box-shadow:
3091                 0 0 0 1px #5b9dd9,
3092                 0 0 2px 1px rgba(30,140,190,.8);
3093         box-shadow:
3094                 0 0 0 1px #5b9dd9,
3095                 0 0 2px 1px rgba(30,140,190,.8);
3096 }
3097
3098 .control-section .accordion-section-title:after,
3099 .accordion-section-title:after {
3100         float: right;
3101         right: 20px;
3102         top: -2px;
3103 }
3104
3105 .control-section.open .accordion-section-title:after,
3106 #customize-info.open .accordion-section-title:after,
3107 .nav-menus-php .menu-item-edit-active .item-edit:before,
3108 .widget.open .widget-top a.widget-action:after {
3109         content: "\f142";
3110 }
3111
3112 /*!
3113  * jQuery UI Draggable/Sortable 1.11.4
3114  * http://jqueryui.com
3115  *
3116  * Copyright jQuery Foundation and other contributors
3117  * Released under the MIT license.
3118  * http://jquery.org/license
3119  */
3120 .ui-draggable-handle,
3121 .ui-sortable-handle {
3122         -ms-touch-action: none;
3123         touch-action: none;
3124 }
3125
3126 /* Accordion */
3127 .accordion-section {
3128         border-bottom: 1px solid #ddd;
3129         margin: 0;
3130 }
3131
3132 .accordion-section.open .accordion-section-content,
3133 .no-js .accordion-section .accordion-section-content {
3134         display: block;
3135 }
3136
3137 .accordion-section.open:hover {
3138         border-bottom-color: #ddd;
3139 }
3140
3141 .accordion-section-content {
3142         display: none;
3143         padding: 10px 20px 15px;
3144         overflow: hidden;
3145         background: #fff;
3146 }
3147
3148 .accordion-section-title {
3149         margin: 0;
3150         padding: 12px 15px 15px;
3151         position: relative;
3152         border-left: 1px solid #ddd;
3153         border-right: 1px solid #ddd;
3154         -webkit-user-select: none;
3155         -moz-user-select: none;
3156         -ms-user-select: none;
3157         user-select: none;
3158 }
3159
3160 .js .accordion-section-title {
3161         cursor: pointer;
3162 }
3163
3164 .js .accordion-section-title:after {
3165         position: absolute;
3166         top: 12px;
3167         right: 10px;
3168         z-index: 1;
3169 }
3170
3171 .accordion-section-title:focus {
3172         outline: none;
3173 }
3174
3175 .accordion-section-title:hover:after,
3176 .accordion-section-title:focus:after {
3177         border-color: #a0a5aa transparent;
3178 }
3179
3180 .cannot-expand .accordion-section-title {
3181         cursor: auto;
3182 }
3183
3184 .cannot-expand .accordion-section-title:after {
3185         display: none;
3186 }
3187
3188 .control-section .accordion-section-title {
3189         border-left: none;
3190         border-right: none;
3191         padding: 10px 10px 11px 14px;
3192         line-height: 21px;
3193         background: #fff;
3194 }
3195
3196 .control-section .accordion-section-title:after {
3197         top: 11px;
3198 }
3199
3200 .js .control-section:hover .accordion-section-title,
3201 .js .control-section .accordion-section-title:hover,
3202 .js .control-section.open .accordion-section-title,
3203 .js .control-section .accordion-section-title:focus {
3204         color: #23282d;
3205         background: #f5f5f5;
3206 }
3207
3208 .control-section.open .accordion-section-title {
3209         /* When expanded */
3210         border-bottom: 1px solid #ddd;
3211 }
3212
3213 /* Edit Site */
3214 .network-admin .edit-site-actions {
3215         margin-top: 0;
3216 }
3217
3218 /* My Sites */
3219 .my-sites {
3220         display: block;
3221         overflow: auto;
3222         zoom: 1;
3223 }
3224
3225 .my-sites li {
3226         display: block;
3227         padding: 8px 3%;
3228         min-height: 130px;
3229         margin: 0;
3230 }
3231
3232 @media only screen and (max-width: 599px) {
3233         .my-sites li {
3234                 min-height: 0;
3235         }
3236 }
3237
3238 @media only screen and (min-width: 600px) {
3239         .my-sites.striped li {
3240                 background-color: #fff;
3241                 position: relative;
3242         }
3243         .my-sites.striped li:after {
3244                 content: "";
3245                 width: 1px;
3246                 height: 100%;
3247                 position: absolute;
3248                 top: 0;
3249                 right: 0;
3250                 background: #ccc;
3251         }
3252
3253 }
3254 @media only screen and (min-width: 600px) and (max-width: 699px) {
3255         .my-sites li{
3256                 float: left;
3257                 width: 44%;
3258         }
3259         .my-sites.striped li {
3260                 background-color: #fff;
3261         }
3262         .my-sites.striped li:nth-of-type(2n+1) {
3263                 clear: left;
3264         }
3265         .my-sites.striped li:nth-of-type(2n+2):after {
3266                 content: none;
3267         }
3268         .my-sites li:nth-of-type(4n+1),
3269         .my-sites li:nth-of-type(4n+2) {
3270                 background-color: #f9f9f9;
3271         }
3272
3273 }
3274
3275 @media only screen and (min-width: 700px) and (max-width: 1199px) {
3276         .my-sites li {
3277                 float: left;
3278                 width: 27.333333%;
3279                 background-color: #fff;
3280         }
3281         .my-sites.striped li:nth-of-type(3n+3):after {
3282                 content: none;
3283         }
3284         .my-sites li:nth-of-type(6n+1),
3285         .my-sites li:nth-of-type(6n+2),
3286         .my-sites li:nth-of-type(6n+3) {
3287                 background-color: #f9f9f9;
3288         }
3289 }
3290
3291 @media only screen and (min-width: 1200px) and (max-width: 1399px) {
3292         .my-sites li {
3293                 float: left;
3294                 width: 21%;
3295                 padding: 8px 2%;
3296                 background-color: #fff;
3297         }
3298         .my-sites.striped li:nth-of-type(4n+1) {
3299                 clear: left;
3300         }
3301         .my-sites.striped li:nth-of-type(4n+4):after {
3302                 content: none;
3303         }
3304         .my-sites li:nth-of-type(8n+1),
3305         .my-sites li:nth-of-type(8n+2),
3306         .my-sites li:nth-of-type(8n+3),
3307         .my-sites li:nth-of-type(8n+4) {
3308                 background-color: #f9f9f9;
3309         }
3310 }
3311
3312 @media only screen and (min-width: 1400px) and (max-width: 1599px) {
3313         .my-sites li {
3314                 float: left;
3315                 width: 16%;
3316                 padding: 8px 2%;
3317                 background-color: #fff;
3318         }
3319         .my-sites.striped li:nth-of-type(5n+1) {
3320                 clear: left;
3321         }
3322         .my-sites.striped li:nth-of-type(5n+5):after {
3323                 content: none;
3324         }
3325         .my-sites li:nth-of-type(10n+1),
3326         .my-sites li:nth-of-type(10n+2),
3327         .my-sites li:nth-of-type(10n+3),
3328         .my-sites li:nth-of-type(10n+4),
3329         .my-sites li:nth-of-type(10n+5) {
3330                 background-color: #f9f9f9;
3331         }
3332 }
3333
3334 @media only screen and (min-width: 1600px) {
3335         .my-sites li {
3336                 float: left;
3337                 width: 12.666666%;
3338                 padding: 8px 2%;
3339                 background-color: #fff;
3340         }
3341         .my-sites.striped li:nth-of-type(6n+1) {
3342                 clear: left;
3343         }
3344         .my-sites.striped li:nth-of-type(6n+6):after {
3345                 content: none;
3346         }
3347         .my-sites li:nth-of-type(12n+1),
3348         .my-sites li:nth-of-type(12n+2),
3349         .my-sites li:nth-of-type(12n+3),
3350         .my-sites li:nth-of-type(12n+4),
3351         .my-sites li:nth-of-type(12n+5),
3352         .my-sites li:nth-of-type(12n+6) {
3353                 background-color: #f9f9f9;
3354         }
3355 }
3356
3357 .my-sites li a {
3358         text-decoration: none;
3359 }
3360
3361 /* =Media Queries
3362 -------------------------------------------------------------- */
3363
3364 /* @todo: de-duplication */
3365 @media only screen and (min-width: 769px) {
3366         /* categories */
3367         #col-left {
3368                 width: 35%;
3369         }
3370
3371         #col-right {
3372                 width: 65%;
3373         }
3374 }
3375
3376 @media only screen and (max-width: 860px) {
3377
3378         /* categories */
3379         #col-left {
3380                 width: 35%;
3381         }
3382
3383         #col-right {
3384                 width: 65%;
3385         }
3386 }
3387
3388 @media only screen and (min-width: 980px) {
3389
3390         /* categories */
3391         #col-left {
3392                 width: 35%;
3393         }
3394
3395         #col-right {
3396                 width: 65%;
3397         }
3398 }
3399
3400 @media only screen and (max-width: 768px) {
3401         /* categories */
3402         #col-left {
3403                 width: 100%;
3404         }
3405
3406         #col-right {
3407                 width: 100%;
3408         }
3409 }
3410
3411 /**
3412  * HiDPI Displays
3413  */
3414 @media print,
3415   (-webkit-min-device-pixel-ratio: 1.25),
3416   (min-resolution: 120dpi) {
3417         /* Back-compat for pre-3.8 */
3418         div.star-holder,
3419         div.star-holder .star-rating {
3420                 background: url(../images/stars-2x.png?ver=20121108) repeat-x bottom left;
3421                 -webkit-background-size: 21px 37px;
3422                 background-size: 21px 37px;
3423         }
3424
3425         .spinner {
3426                 background-image: url(../images/spinner-2x.gif);
3427         }
3428
3429         /* @todo: evaluate - most of these were likely replaced by dashicons */
3430         .curtime #timestamp,
3431         #screen-meta-links a.show-settings,
3432         .widget-top a.widget-action,
3433         .widget-top a.widget-action:hover,
3434         .sidebar-name-arrow,
3435         .sidebar-name:hover .sidebar-name-arrow,
3436         .meta-box-sortables .postbox:hover .handlediv,
3437         .tagchecklist span a,
3438         #bulk-titles div a,
3439         .tagchecklist span a:hover,
3440         #bulk-titles div a:hover {
3441                 background: none !important;
3442         }
3443
3444 }
3445
3446 @-ms-viewport {
3447         width: device-width;
3448 }
3449
3450 @media screen and ( max-width: 782px ) {
3451         html.wp-toolbar {
3452                 padding-top: 46px;
3453         }
3454
3455         body {
3456                 min-width: 240px;
3457                 overflow-x: hidden;
3458         }
3459
3460         body * {
3461                 -webkit-tap-highlight-color: rgba(0, 0, 0, 0) !important;
3462         }
3463
3464         #wpcontent {
3465                 position: relative;
3466                 margin-left: 0;
3467                 padding-left: 10px;
3468         }
3469
3470         #wpbody-content {
3471                 padding-bottom: 100px;
3472         }
3473
3474         .wrap {
3475                 margin-right: 12px;
3476                 margin-left: 0;
3477         }
3478
3479         .col-wrap {
3480                 padding: 0;
3481         }
3482
3483         /* Hidden Elements */
3484         #screen-meta,
3485         #screen-meta-links,
3486         #collapse-menu,
3487         .post-format-select {
3488                 display: none !important;
3489         }
3490
3491         .wrap .add-new-h2, /* deprecated */
3492         .wrap .add-new-h2:active, /* deprecated */
3493         .wrap .page-title-action,
3494         .wrap .page-title-action:active {
3495                 padding: 10px 15px;
3496                 font-size: 14px;
3497                 white-space: nowrap;
3498         }
3499
3500         .wp-color-result {
3501                 height: auto;
3502                 padding-left: 45px;
3503         }
3504
3505         .wp-color-result:after {
3506                 font-size: 14px;
3507                 height: auto;
3508                 padding: 6px 14px;
3509         }
3510
3511         /* Feedback Messages */
3512         .notice,
3513         .wrap div.updated,
3514         .wrap div.error,
3515         .media-upload-form div.error {
3516                 margin: 20px 0 10px 0;
3517                 padding: 5px 10px;
3518                 font-size: 14px;
3519                 line-height: 175%;
3520         }
3521
3522         .wp-core-ui .notice.is-dismissible {
3523                 padding-right: 46px;
3524         }
3525
3526         .notice-dismiss {
3527                 padding: 13px;
3528         }
3529
3530         .wrap .icon32 + h2 {
3531                 margin-top: -2px;
3532         }
3533
3534         .wp-responsive-open #wpbody {
3535                 right: -190px;
3536         }
3537
3538         code {
3539                 word-wrap: break-word;
3540         }
3541
3542         /* General Metabox */
3543         .postbox {
3544                 font-size: 14px;
3545         }
3546
3547         .metabox-holder h3.hndle, /* Back-compat for pre-4.4 */
3548         .metabox-holder .stuffbox > h3, /* Back-compat for pre-4.4 */
3549         .metabox-holder .postbox > h3, /* Back-compat for pre-4.4 */
3550         .metabox-holder h2 {
3551                 padding: 12px;
3552         }
3553
3554         .postbox .handlediv {
3555                 margin-top: 3px;
3556         }
3557
3558         /* Subsubsub Nav */
3559         .subsubsub {
3560                 font-size: 16px;
3561                 text-align: center;
3562                 margin-bottom: 15px;
3563         }
3564
3565         /* Theme/Plugin File Editor */
3566         #templateside {
3567                 float: none;
3568                 width: auto;
3569         }
3570
3571         #templateside li {
3572                 margin: 0;
3573         }
3574
3575         #templateside li a {
3576                 display: block;
3577                 padding: 5px;
3578         }
3579
3580         #templateside .highlight {
3581                 padding: 5px;
3582                 margin-left: -5px;
3583                 margin-top: -5px;
3584         }
3585
3586         #template div {
3587                 float: none;
3588                 margin: 0;
3589                 width: auto;
3590         }
3591
3592         #template textarea {
3593                 width: 100%;
3594         }
3595
3596         .fileedit-sub .alignright {
3597                 margin-top: 15px;
3598         }
3599
3600         #wpfooter {
3601                 display: none;
3602         }
3603
3604         #comments-form .checkforspam {
3605                 display: none;
3606         }
3607
3608         .edit-comment-author {
3609                 margin: 2px 0 0;
3610         }
3611
3612         .filter-drawer .filter-group-feature input,
3613         .filter-drawer .filter-group-feature label {
3614                 line-height: 25px;
3615         }
3616 }
3617
3618 /* Smartphone */
3619 @media screen and (max-width: 600px) {
3620         /* Disable horizontal scroll when responsive menu is open
3621            since we push the main content off to the right. */
3622         #wpwrap.wp-responsive-open {
3623                 overflow-x: hidden;
3624         }
3625
3626         html.wp-toolbar {
3627                 padding-top: 0;
3628         }
3629
3630         #wpbody {
3631                 padding-top: 46px;
3632         }
3633
3634         /* Keep full-width boxes on Edit Post page from causing horizontal scroll */
3635         div#post-body.metabox-holder.columns-1 {
3636                 overflow-x: hidden;
3637         }
3638
3639         h1.nav-tab-wrapper,
3640         .wrap h2.nav-tab-wrapper,
3641         h3.nav-tab-wrapper {
3642                 border-bottom: 0;
3643         }
3644
3645         h1 .nav-tab,
3646         h2 .nav-tab,
3647         h3 .nav-tab {
3648                 margin: 10px 10px 0 0;
3649                 border-bottom: 1px solid #ccc;
3650         }
3651 }
3652
3653 @media screen and (max-width: 320px) {
3654         /* Prevent default center alignment and larger font for the Right Now widget when
3655            the network dashboard is viewed on a small mobile device. */
3656         #network_dashboard_right_now .subsubsub {
3657                 font-size: 14px;
3658                 text-align: left;
3659         }
3660 }