9 * normalize.css v3.0.0 | MIT License | git.io/normalize
12 font-family: sans-serif;
13 -ms-text-size-adjust: 100%;
14 -webkit-text-size-adjust: 100%;
24 -webkit-box-sizing: border-box;
25 -moz-box-sizing: border-box;
26 box-sizing: border-box;
28 @media only screen and (-webkit-min-device-pixel-ratio: 1.5), only screen and (min-resolution: 144dpi) {
32 -webkit-font-smoothing: antialiased;
55 display: inline-block;
56 vertical-align: baseline;
59 audio:not([controls]) {
70 background: transparent;
79 border-bottom: 1px dotted;
110 vertical-align: baseline;
134 -webkit-box-sizing: content-box;
135 -moz-box-sizing: content-box;
136 box-sizing: content-box;
148 font-family: monospace, monospace;
168 text-transform: none;
172 html input[type="button"],
174 input[type="submit"] {
175 -webkit-appearance: button;
180 html input[disabled] {
184 button::-moz-focus-inner,
185 input::-moz-focus-inner {
194 input[type="checkbox"],
195 input[type="radio"] {
196 -webkit-box-sizing: border-box;
197 -moz-box-sizing: border-box;
198 box-sizing: border-box;
202 input[type="number"]::-webkit-inner-spin-button,
203 input[type="number"]::-webkit-outer-spin-button {
207 input[type="search"] {
208 -webkit-appearance: textfield;
209 -webkit-box-sizing: content-box;
210 -moz-box-sizing: content-box;
211 box-sizing: content-box;
214 input[type="search"]::-webkit-search-cancel-button,
215 input[type="search"]::-webkit-search-decoration {
216 -webkit-appearance: none;
239 border-collapse: collapse;
261 .screen-reader-text {
276 * Base element typographic styles.
284 font-family: "Open Sans", Helvetica, Arial, sans-serif;
300 margin-bottom: 1.5em;
312 * Pushing buttons is what I do.
317 display: inline-block;
322 -webkit-border-radius: 3px;
326 text-decoration: none;
329 -webkit-appearance: none;
338 .button-subtle:visited {
342 .button-subtle:focus,
343 .button-subtle:hover,
344 .button-subtle:active,
345 .edit-post-link:focus,
346 .edit-post-link:hover,
347 .edit-post-link:active {
351 .button-subtle:focus,
352 .button-subtle:active,
353 .edit-post-link:focus,
354 .edit-post-link:active {
356 text-decoration: underline;
369 -webkit-appearance: none;
372 .button-reset:focus {
383 -webkit-appearance: none;
390 text-decoration: underline;
397 * So many input types.
405 vertical-align: baseline;
406 *vertical-align: middle;
415 -webkit-appearance: textfield;
416 -webkit-box-sizing: content-box;
417 -moz-box-sizing: content-box;
418 box-sizing: content-box;
421 [type="search"]::-webkit-search-decoration {
422 -webkit-appearance: none;
425 button::-moz-focus-inner,
426 input::-moz-focus-inner {
437 padding: 0.4em 0.75em;
439 border: 1px solid #ccc;
443 [type="email"]:focus,
445 [type="password"]:focus,
446 [type="search"]:focus,
482 margin: 0 3em 1.5em 0;
504 margin: 0 1.5em 1.5em;
511 * Complete styles for post formats UI
513 /* TODO if we remove the <br> during merge, this can go. */
514 #post-formats-select br {
525 .lt-ie9 .post-format {
526 margin: 17px 13px 0 12px;
539 padding: 13px 13px 14px 2px;
543 .post-format-icon:before,
544 .post-format-icon:after {
546 display: inline-block;
552 font-family: dashicons;
553 text-decoration: inherit;
559 -webkit-transition: color .1s ease-in 0;
560 transition: color .1s ease-in 0;
561 -webkit-font-smoothing: antialiased;
562 -moz-osx-font-smoothing: grayscale;
565 .post-format-icon:before {
569 .post-format-icon:after {
575 .post-format:checked + .post-format-icon {
576 -webkit-box-shadow: inset -6px 0 0 #00a0d2;
577 box-shadow: inset -6px 0 0 #00a0d2;
578 background: rgba(46, 162, 204, 0.1);
581 .post-format:checked + .post-format-icon:before,
582 .post-format:checked + .post-format-icon:after {
586 .post-format:focus + .post-format-icon {
591 .post-format:focus + .post-format-icon:before,
592 .post-format:focus + .post-format-icon:after {
596 .post-format:checked + .post-format-icon:after {
600 .lt-ie9 .post-format-icon {
604 .post-format-aside:before {
608 .post-format-image:before {
612 .post-format-video:before {
616 .post-format-audio:before {
620 .post-format-quote:before {
624 .post-format-link:before {
628 .post-format-gallery:before {
636 * Complete styles for tags UI
649 padding: 11px 16px 11px 58px;
652 border-bottom: 1px solid #e5e5e5;
662 -webkit-border-radius: 0;
667 border-right: 1px solid #f1f1f1;
668 -webkit-box-shadow: none;
672 .tagsdiv .tagadd:hover,
673 .tagsdiv .tagadd:active,
674 .tagsdiv .tagadd:focus {
677 border-color: #20708e;
679 -webkit-box-shadow: none;
686 margin: 10px 16px 6px 0;
690 /* Tag hint TODO needed? */
691 /* Tag suggestions */
694 margin: -1px -1px 0 0;
699 border: 1px solid #d8d8d8;
700 background-color: #fff;
711 .ac_results .ac_over {
712 background-color: #e5e5e5;
713 background-color: #00a0d2;
719 text-decoration: underline;
724 padding: 16px 28px 5px;
727 .tagchecklist:before,
728 .tagchecklist:after {
733 .tagchecklist:after {
747 @media (max-width: 600px) {
755 .tagchecklist .ntdelbutton {
756 margin: 1px -17px 0 0;
768 .tagchecklist .ntdelbutton:before {
776 font: 400 16px/1 dashicons;
779 -webkit-font-smoothing: antialiased;
782 .tagchecklist .ntdelbutton:focus:before {
795 text-decoration: none;
799 .tagcloud-link:focus {
800 text-decoration: underline;
806 padding: 8px 12px 12px;
820 text-decoration: none;
824 .the-tagcloud a:focus {
825 text-decoration: underline;
836 * Complete styles for post categories UI
838 input[type="search"].categories-search,
842 padding: 0.85714em 1.07143em;
844 -webkit-border-radius: 0;
846 border-bottom: 1px solid #e5e5e5;
848 -webkit-appearance: none;
852 @media (max-width: 600px) {
853 input[type="search"].categories-search,
855 /* Needs to be 16px to prevent zooming on iOS. Guh. */
864 padding: 12px 10px 8px;
867 .add-cat-toggle:focus {
868 text-decoration: none;
872 .add-cat-toggle.is-toggled {
876 .add-cat-toggle.is-toggled .dashicons:before {
882 border-bottom: 1px solid #e5e5e5;
885 .add-category.is-hidden {
889 .add-category .add-cat-submit {
894 -webkit-border-radius: 0;
898 border-right: 1px solid #f1f1f1;
901 .add-category .add-cat-submit:hover,
902 .add-category .add-cat-submit:active,
903 .add-category .add-cat-submit:focus {
906 border-color: #20708e;
910 /* Parent category select */
921 -webkit-border-radius: 0;
923 border: 1px solid #e5e5e5;
925 -webkit-background-size: 20px 20px;
926 background-size: 20px 20px;
929 text-overflow: ellipsis;
930 text-decoration: none;
938 border-color: #0073aa;
939 -webkit-box-shadow: 0 0 0 3px #00a0d2;
940 box-shadow: 0 0 0 3px #00a0d2;
943 -moz-user-focus: ignore;
946 .postform::-ms-expand {
950 .postform::-ms-value {
955 .postform:-moz-focusring {
957 text-shadow: 0 0 0 #727272;
967 .categories-select ul {
976 padding: 13px 16px 14px 16px;
982 .category.selected:focus {
989 -webkit-box-shadow: inset -6px 0 0 #00a0d2;
990 box-shadow: inset -6px 0 0 #00a0d2;
994 .category.selected:after {
995 display: inline-block;
1005 font-family: dashicons;
1006 text-decoration: inherit;
1010 vertical-align: top;
1012 -webkit-transition: color .1s ease-in 0;
1013 transition: color .1s ease-in 0;
1014 -webkit-font-smoothing: antialiased;
1015 -moz-osx-font-smoothing: grayscale;
1018 .category.selected:focus:after {
1022 .categories-select ul .category {
1023 padding-right: 24px;
1026 .categories-select ul ul .category {
1027 padding-right: 32px;
1030 .categories-select ul ul ul .category {
1031 padding-right: 40px;
1034 .categories-select ul ul ul ul .category {
1035 padding-right: 48px;
1038 .categories-select ul ul ul ul ul .category {
1039 padding-right: 56px;
1042 .categories-select ul ul ul ul ul ul .category {
1043 padding-right: 64px;
1046 .categories-select .is-hidden {
1050 .categories-select .is-hidden.searched-parent {
1054 /* Category search */
1055 .categories-search-wrapper {
1059 .categories-search-wrapper.is-hidden {
1063 .categories-search-wrapper label {
1086 -webkit-box-shadow: 10px 0 0 rgba(0, 0, 0, 0.3);
1087 box-shadow: 10px 0 0 rgba(0, 0, 0, 0.3);
1090 @media (max-width: 900px) {
1096 @media (max-width: 320px) {
1111 background: #23282d;
1126 .adminbar .dashicons {
1137 @media (max-width: 320px) {
1144 margin-top: 0.5625em;
1149 white-space: nowrap;
1150 text-overflow: ellipsis;
1153 @media (max-width: 600px) {
1159 @media (max-width: 320px) {
1166 .current-site-link {
1167 text-decoration: none;
1170 .current-site-link:focus {
1174 .current-site-link:focus .current-site-name{
1175 text-decoration: underline;
1178 .current-site-name {
1182 @media (max-width: 320px) {
1183 .current-site-name {
1188 .current-site .dashicons-wordpress {
1192 vertical-align: middle;
1196 .options.open .on-closed,
1197 .options.closed .on-open {
1201 @media (max-width: 900px) {
1207 .options-panel-back.is-hidden {
1211 .options:focus .dashicons {
1213 text-decoration: none;
1216 .options .dashicons {
1228 border-bottom: 1px solid #e5e5e5;
1240 -webkit-border-radius: 50%;
1242 background: #00a0d2;
1245 @media (max-width: 600px) {
1254 .alert.is-error:before {
1260 border-bottom: 1px solid #e5e5e5;
1263 @media (max-width: 900px) {
1265 -webkit-transition: opacity .3s ease-in-out;
1266 transition: opacity .3s ease-in-out;
1268 .scan.is-hidden form {
1270 pointer-events: none;
1277 padding: 0.85714em 1.07143em;
1282 @media (max-width: 600px) {
1293 padding: 0 1.07143em;
1294 background: #f7f7f7;
1295 border-color: #dedede;
1297 border-right: 1px solid #f1f1f1;
1298 -webkit-border-radius: 0;
1306 .scan-submit:focus {
1307 background: #2991b7;
1308 border-color: #20708e;
1313 .scan-submit:active {
1314 background: #2581a2;
1315 border-color: #20708e;
1319 .scan-submit:visited {
1325 margin-bottom: 60px;
1339 @media (max-width: 900px) {
1352 .editor-wrapper:before,
1353 .editor-wrapper:after {
1358 .editor-wrapper:after {
1363 padding: 0 1.5em 4.75em;
1371 display: inline-block;
1373 background: url(../images/spinner.gif) no-repeat center;
1374 -webkit-background-size: 20px 20px;
1375 background-size: 20px 20px;
1377 filter: alpha(opacity=70);
1379 vertical-align: middle;
1383 (-webkit-min-device-pixel-ratio: 1.25),
1384 (min-resolution: 120dpi) {
1387 background-image: url(../images/spinner-2x.gif);
1391 .spinner.is-active {
1392 visibility: visible;
1395 /* Make the text inside the editor textarea white. Prevents a "flash" on loading the page */
1400 @media (min-width: 901px) {
1406 @media (max-width: 320px) {
1413 .post-title-placeholder {
1417 border-bottom: 1px solid #e5e5e5;
1425 .post-title-placeholder:active,
1426 .post-title-placeholder:focus {
1428 -webkit-box-shadow: inset 0px -3px 0 #00a0d2;
1429 box-shadow: inset 0px -3px 0 #00a0d2;
1430 border-color: #00a0d2;
1433 @media (max-width: 900px) {
1435 .post-title-placeholder {
1440 @media (max-height: 400px) {
1442 .post-title-placeholder {
1448 @media (max-width: 320px) {
1450 .post-title-placeholder {
1453 padding: 1.14286em 1.42857em;
1459 background: url(data:image/gif;base64,R0lGODlhAQABAJEAAAAAAP///////wAAACH5BAEHAAIALAAAAAABAAEAAAICVAEAOw==);
1460 background: none, none;
1463 .post-title:before {
1464 /* Keeps empty container from collapsing */
1466 display: inline-block;
1471 .post-title-placeholder {
1478 .post-title-placeholder.is-hidden {
1482 /* Suggested images */
1483 .media-list-container {
1486 border-bottom: 1px solid #e5e5e5;
1490 .media-list-inner-container {
1496 .media-list-container.has-media {
1500 .media-list-inner-container:before,
1501 .media-list-inner-container:after {
1506 .media-list-inner-container:after {
1515 @media (min-width: 321px) {
1516 .media-list-inner-container {
1522 @media (min-width: 601px) {
1523 .media-list-inner-container {
1525 max-height: 18.75vw;
1529 .wppt-all-media-list {
1535 .suggested-media-thumbnail:focus,
1538 -webkit-box-shadow: inset 0 0 0 3px #00a0d2;
1539 box-shadow: inset 0 0 0 3px #00a0d2;
1542 .suggested-media-thumbnail {
1547 padding: 16.66% 16.66% 0 0;
1548 background-position: center;
1549 background-repeat: no-repeat;
1550 -webkit-background-size: cover;
1551 background-size: cover;
1552 background-color: #d8d8d8;
1554 color: rgba(255, 255, 255, 0.6);
1558 .suggested-media-thumbnail:hover,
1559 .suggested-media-thumbnail:active,
1560 .suggested-media-thumbnail:focus {
1564 .suggested-media-thumbnail:before,
1565 .suggested-media-thumbnail:after {
1566 display: inline-block;
1570 font-family: dashicons;
1571 text-decoration: inherit;
1574 -webkit-transition: color .1s ease-in 0;
1575 transition: color .1s ease-in 0;
1576 -webkit-font-smoothing: antialiased;
1577 -moz-osx-font-smoothing: grayscale;
1580 .suggested-media-thumbnail:before {
1583 margin: -20px -20px 0 0;
1587 .suggested-media-thumbnail:after {
1593 @media (min-width: 601px) {
1594 .suggested-media-thumbnail {
1596 padding: 12.5% 12.5% 0 0;
1603 color: rgba(255, 255, 255, 0.9);
1606 .is-embed.is-audio:hover:before,
1607 .is-embed.is-audio:active:before,
1608 .is-embed.is-audio:focus:before,
1609 .is-embed.is-tweet:hover:before,
1610 .is-embed.is-tweet:active:before,
1611 .is-embed.is-tweet:focus:before {
1615 .is-embed.is-video {
1616 background-color: #23282d;
1619 .is-embed.is-video:hover:before,
1620 .is-embed.is-video:active:before,
1621 .is-embed.is-video:focus:before {
1622 color: rgba(255, 255, 255, 0.2);
1625 .is-embed.is-video:before {
1629 .is-embed.is-audio {
1630 background-color: #ff7d44;
1633 .is-embed.is-audio:before {
1637 .is-embed.is-tweet {
1638 background-color: #55acee;
1641 .is-embed.is-tweet:before {
1652 .press-this-actions {
1657 background: #f1f1f1;
1658 background: rgba(241, 241, 241, 0.9);
1659 border-top: 1px solid #e5e5e5;
1662 @media (max-width: 900px) {
1663 .press-this-actions {
1664 -webkit-transform: translateY(0);
1665 -ms-transform: translateY(0);
1666 transform: translateY(0);
1667 -webkit-transition: -webkit-transform .3s ease-in-out;
1668 transition: transform .3s ease-in-out;
1670 .press-this-actions.is-hidden {
1671 -webkit-transform: translateY(100%);
1672 -ms-transform: translateY(100%);
1673 transform: translateY(100%);
1679 margin: 14px 30px 14px 0;
1683 @media (max-width: 320px) {
1685 margin: 10px 10px 10px 0;
1695 border-left: 1px solid #e5e5e5;
1696 -webkit-border-radius: 0;
1699 -webkit-box-shadow: none;
1704 .insert-media:hover,
1705 .insert-media:focus,
1706 .insert-media:active {
1709 border-color: #e5e5e5;
1713 .insert-media:focus,
1714 .insert-media:active {
1717 text-decoration: none;
1720 .insert-media .dashicons {
1727 @media (max-width: 320px) {
1728 .insert-media .dashicons {
1738 margin: 14px 0 14px 30px;
1742 @media (max-width: 320px) {
1744 margin: 10px 0 10px 10px;
1750 display: inline-block;
1751 text-decoration: none;
1755 .draft-button.is-hidden,
1756 .draft-button .saving-draft,
1757 .draft-button.is-saving .save-draft {
1761 .draft-button.is-saving .saving-draft {
1765 /* TinyMCE styles */
1766 .editor .wp-media-buttons {
1770 .editor div.mce-toolbar-grp {
1771 padding: 0.71429em 0;
1776 @media (max-height: 400px), (max-width: 320px) {
1777 .editor div.mce-toolbar-grp {
1782 .mce-stack-layout:before,
1783 .mce-stack-layout:after {
1788 .mce-stack-layout:after {
1792 .mce-container.mce-toolbar {
1796 .mce-container.mce-toolbar:nth-child(2) {
1800 @media (max-width: 600px) {
1801 .mce-first .mce-btn:nth-child(3),
1802 .mce-first .mce-btn:nth-child(4) {
1809 clip: rect(0 0 0 0);
1813 .mce-first .mce-btn:nth-child(3):focus,
1814 .mce-first .mce-btn:nth-child(4):focus {
1822 border: 1px solid #999;
1830 #wp-link-wrap input[type="text"] {
1835 @media screen and (max-width: 782px) {
1840 #wp-link-wrap input[type="text"] {
1845 #wp-link-wrap .howto {
1850 /* Options panel (sidebar) */
1854 margin-left: -320px;
1856 border-right: 1px solid #e5e5e5;
1858 /* Keeps background the full height of the screen, but only visually. Clicks go through. */
1859 -webkit-box-shadow: -5001px 5000px 0 5000px #fff, -5000px 5000px 0 5000px #e5e5e5;
1860 box-shadow: -5001px 5000px 0 5000px #fff, -5000px 5000px 0 5000px #e5e5e5;
1864 .options-panel-back {
1873 @media (max-width: 900px) {
1876 -webkit-transform: translateX(100%);
1877 -ms-transform: translateX(100%);
1878 transform: translateX(100%);
1879 -webkit-transition: -webkit-transform .3s ease-in-out;
1880 transition: transform .3s ease-in-out;
1883 .options-panel.is-hidden {
1887 .options-panel.is-off-screen {
1888 -webkit-transform: translateX(0);
1889 -ms-transform: translateX(0);
1890 transform: translateX(0);
1894 @media (max-width: 320px) {
1899 -webkit-box-shadow: -5001px 5000px 0 5000px #fff;
1900 box-shadow: -5001px 5000px 0 5000px #fff;
1903 .options-panel-back {
1916 .post-options .post-option-contents {
1921 .post-option-forward:before {
1929 .post-option-back:before {
1933 .lt-ie9 .options-panel,
1934 .lt-ie9 .post-options {
1935 border-right: 1px solid #e5e5e5;
1938 .lt-ie9 .post-options.is-off-screen {
1946 .post-options .post-option {
1949 padding: 13px 14px 13px 37px;
1950 border-bottom: 1px solid #e5e5e5;
1951 text-decoration: none;
1954 text-overflow: ellipsis;
1955 white-space: nowrap;
1957 -webkit-transition: -webkit-transform .3s ease-in-out;
1958 transition: transform .3s ease-in-out;
1961 .post-options .post-option:focus {
1963 -webkit-box-shadow: inset -5px 0 0 #00a0d2;
1964 box-shadow: inset -5px 0 0 #00a0d2;
1967 .is-off-screen > .post-option {
1971 .is-hidden > .post-option {
1975 @media (min-width: 1px) {
1976 .is-off-screen > .post-option {
1978 -webkit-transform: translateX(100%);
1979 -ms-transform: translateX(100%);
1980 transform: translateX(100%);
1984 .post-option-title {
1985 display: inline-block;
1988 font-weight: normal;
1997 -webkit-transition: -webkit-transform .3s ease-in-out;
1998 transition: transform .3s ease-in-out;
2001 .setting-modal.is-hidden {
2006 .setting-modal.is-off-screen {
2010 @media (min-width: 1px) {
2011 .setting-modal.is-off-screen {
2013 -webkit-transform: translateX(-100%);
2014 -ms-transform: translateX(-100%);
2015 transform: translateX(-100%);
2023 border-bottom: 1px solid #e5e5e5;
2025 text-decoration: none;
2029 .modal-close:focus {
2031 -webkit-box-shadow: inset -5px 0 0 #00a0d2;
2032 box-shadow: inset -5px 0 0 #00a0d2;