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;
849 -moz-appearance: none;
853 @media (max-width: 600px) {
854 input[type="search"].categories-search,
856 /* Needs to be 16px to prevent zooming on iOS. Guh. */
865 padding: 12px 10px 8px;
868 .add-cat-toggle:focus {
869 text-decoration: none;
873 .add-cat-toggle.is-toggled {
877 .add-cat-toggle.is-toggled .dashicons:before {
883 border-bottom: 1px solid #e5e5e5;
886 .add-category.is-hidden {
890 .add-category .add-cat-submit {
895 -webkit-border-radius: 0;
899 border-right: 1px solid #f1f1f1;
902 .add-category .add-cat-submit:hover,
903 .add-category .add-cat-submit:active,
904 .add-category .add-cat-submit:focus {
907 border-color: #20708e;
911 /* Parent category select */
922 -webkit-border-radius: 0;
924 border: 1px solid #e5e5e5;
926 -webkit-background-size: 20px 20px;
927 background-size: 20px 20px;
930 text-overflow: ellipsis;
931 text-decoration: none;
939 border-color: #0073aa;
940 -webkit-box-shadow: 0 0 0 3px #00a0d2;
941 box-shadow: 0 0 0 3px #00a0d2;
944 -moz-user-focus: ignore;
947 .postform::-ms-expand {
951 .postform::-ms-value {
956 .postform:-moz-focusring {
958 text-shadow: 0 0 0 #727272;
968 .categories-select ul {
977 padding: 13px 16px 14px 16px;
983 .category.selected:focus {
990 -webkit-box-shadow: inset -6px 0 0 #00a0d2;
991 box-shadow: inset -6px 0 0 #00a0d2;
995 .category.selected:after {
996 display: inline-block;
1006 font-family: dashicons;
1007 text-decoration: inherit;
1011 vertical-align: top;
1013 -webkit-transition: color .1s ease-in 0;
1014 transition: color .1s ease-in 0;
1015 -webkit-font-smoothing: antialiased;
1016 -moz-osx-font-smoothing: grayscale;
1019 .category.selected:focus:after {
1023 .categories-select ul .category {
1024 padding-right: 24px;
1027 .categories-select ul ul .category {
1028 padding-right: 32px;
1031 .categories-select ul ul ul .category {
1032 padding-right: 40px;
1035 .categories-select ul ul ul ul .category {
1036 padding-right: 48px;
1039 .categories-select ul ul ul ul ul .category {
1040 padding-right: 56px;
1043 .categories-select ul ul ul ul ul ul .category {
1044 padding-right: 64px;
1047 .categories-select .is-hidden {
1051 .categories-select .is-hidden.searched-parent {
1055 /* Category search */
1056 .categories-search-wrapper {
1060 .categories-search-wrapper.is-hidden {
1064 .categories-search-wrapper label {
1087 -webkit-box-shadow: 10px 0 0 rgba(0, 0, 0, 0.3);
1088 box-shadow: 10px 0 0 rgba(0, 0, 0, 0.3);
1091 @media (max-width: 900px) {
1097 @media (max-width: 320px) {
1112 background: #23282d;
1127 .adminbar .dashicons {
1138 @media (max-width: 320px) {
1145 margin-top: 0.5625em;
1150 white-space: nowrap;
1151 text-overflow: ellipsis;
1154 @media (max-width: 600px) {
1160 @media (max-width: 320px) {
1167 .current-site-link {
1168 text-decoration: none;
1171 .current-site-link:focus {
1175 .current-site-link:focus .current-site-name{
1176 text-decoration: underline;
1179 .current-site-name {
1183 @media (max-width: 320px) {
1184 .current-site-name {
1189 .current-site .dashicons-wordpress {
1193 vertical-align: middle;
1197 .options.open .on-closed,
1198 .options.closed .on-open {
1202 @media (max-width: 900px) {
1208 .options-panel-back.is-hidden {
1212 .options:focus .dashicons {
1214 text-decoration: none;
1217 .options .dashicons {
1229 border-bottom: 1px solid #e5e5e5;
1241 -webkit-border-radius: 50%;
1243 background: #00a0d2;
1246 @media (max-width: 600px) {
1255 .alert.is-error:before {
1261 border-bottom: 1px solid #e5e5e5;
1264 @media (max-width: 900px) {
1266 -webkit-transition: opacity .3s ease-in-out;
1267 transition: opacity .3s ease-in-out;
1269 .scan.is-hidden form {
1271 pointer-events: none;
1278 padding: 0.85714em 1.07143em;
1283 @media (max-width: 600px) {
1294 padding: 0 1.07143em;
1295 background: #f7f7f7;
1296 border-color: #dedede;
1298 border-right: 1px solid #f1f1f1;
1299 -webkit-border-radius: 0;
1307 .scan-submit:focus {
1308 background: #2991b7;
1309 border-color: #20708e;
1314 .scan-submit:active {
1315 background: #2581a2;
1316 border-color: #20708e;
1320 .scan-submit:visited {
1326 margin-bottom: 60px;
1340 @media (max-width: 900px) {
1353 .editor-wrapper:before,
1354 .editor-wrapper:after {
1359 .editor-wrapper:after {
1364 padding: 0 1.5em 4.75em;
1372 display: inline-block;
1374 background: url(../images/spinner.gif) no-repeat center;
1375 -webkit-background-size: 20px 20px;
1376 background-size: 20px 20px;
1378 filter: alpha(opacity=70);
1380 vertical-align: middle;
1384 (-webkit-min-device-pixel-ratio: 1.25),
1385 (min-resolution: 120dpi) {
1388 background-image: url(../images/spinner-2x.gif);
1392 .spinner.is-active {
1393 visibility: visible;
1396 /* Make the text inside the editor textarea white. Prevents a "flash" on loading the page */
1401 @media (min-width: 901px) {
1407 @media (max-width: 320px) {
1414 .post-title-placeholder {
1418 border-bottom: 1px solid #e5e5e5;
1426 .post-title-placeholder:active,
1427 .post-title-placeholder:focus {
1429 -webkit-box-shadow: inset 0px -3px 0 #00a0d2;
1430 box-shadow: inset 0px -3px 0 #00a0d2;
1431 border-color: #00a0d2;
1434 @media (max-width: 900px) {
1436 .post-title-placeholder {
1441 @media (max-height: 400px) {
1443 .post-title-placeholder {
1449 @media (max-width: 320px) {
1451 .post-title-placeholder {
1454 padding: 1.14286em 1.42857em;
1460 background: url(data:image/gif;base64,R0lGODlhAQABAJEAAAAAAP///////wAAACH5BAEHAAIALAAAAAABAAEAAAICVAEAOw==);
1461 background: none, none;
1464 .post-title:before {
1465 /* Keeps empty container from collapsing */
1467 display: inline-block;
1472 .post-title-placeholder {
1479 .post-title-placeholder.is-hidden {
1483 /* Suggested images */
1484 .media-list-container {
1487 border-bottom: 1px solid #e5e5e5;
1491 .media-list-inner-container {
1497 .media-list-container.has-media {
1501 .media-list-inner-container:before,
1502 .media-list-inner-container:after {
1507 .media-list-inner-container:after {
1516 @media (min-width: 321px) {
1517 .media-list-inner-container {
1523 @media (min-width: 601px) {
1524 .media-list-inner-container {
1526 max-height: 18.75vw;
1530 .wppt-all-media-list {
1536 .suggested-media-thumbnail:focus,
1539 -webkit-box-shadow: inset 0 0 0 3px #00a0d2;
1540 box-shadow: inset 0 0 0 3px #00a0d2;
1543 .suggested-media-thumbnail {
1548 padding: 16.66% 16.66% 0 0;
1549 background-position: center;
1550 background-repeat: no-repeat;
1551 -webkit-background-size: cover;
1552 background-size: cover;
1553 background-color: #d8d8d8;
1555 color: rgba(255, 255, 255, 0.6);
1559 .suggested-media-thumbnail:hover,
1560 .suggested-media-thumbnail:active,
1561 .suggested-media-thumbnail:focus {
1565 .suggested-media-thumbnail:before,
1566 .suggested-media-thumbnail:after {
1567 display: inline-block;
1571 font-family: dashicons;
1572 text-decoration: inherit;
1575 -webkit-transition: color .1s ease-in 0;
1576 transition: color .1s ease-in 0;
1577 -webkit-font-smoothing: antialiased;
1578 -moz-osx-font-smoothing: grayscale;
1581 .suggested-media-thumbnail:before {
1584 margin: -20px -20px 0 0;
1588 .suggested-media-thumbnail:after {
1594 @media (min-width: 601px) {
1595 .suggested-media-thumbnail {
1597 padding: 12.5% 12.5% 0 0;
1604 color: rgba(255, 255, 255, 0.9);
1607 .is-embed.is-audio:hover:before,
1608 .is-embed.is-audio:active:before,
1609 .is-embed.is-audio:focus:before,
1610 .is-embed.is-tweet:hover:before,
1611 .is-embed.is-tweet:active:before,
1612 .is-embed.is-tweet:focus:before {
1616 .is-embed.is-video {
1617 background-color: #23282d;
1620 .is-embed.is-video:hover:before,
1621 .is-embed.is-video:active:before,
1622 .is-embed.is-video:focus:before {
1623 color: rgba(255, 255, 255, 0.2);
1626 .is-embed.is-video:before {
1630 .is-embed.is-audio {
1631 background-color: #ff7d44;
1634 .is-embed.is-audio:before {
1638 .is-embed.is-tweet {
1639 background-color: #55acee;
1642 .is-embed.is-tweet:before {
1653 .press-this-actions {
1658 background: #f1f1f1;
1659 background: rgba(241, 241, 241, 0.9);
1660 border-top: 1px solid #e5e5e5;
1663 @media (max-width: 900px) {
1664 .press-this-actions {
1665 -webkit-transform: translateY(0);
1666 -ms-transform: translateY(0);
1667 transform: translateY(0);
1668 -webkit-transition: -webkit-transform .3s ease-in-out;
1669 transition: transform .3s ease-in-out;
1671 .press-this-actions.is-hidden {
1672 -webkit-transform: translateY(100%);
1673 -ms-transform: translateY(100%);
1674 transform: translateY(100%);
1680 margin: 14px 30px 14px 0;
1684 @media (max-width: 320px) {
1686 margin: 10px 10px 10px 0;
1696 border-left: 1px solid #e5e5e5;
1697 -webkit-border-radius: 0;
1700 -webkit-box-shadow: none;
1705 .insert-media:hover,
1706 .insert-media:focus,
1707 .insert-media:active {
1710 border-color: #e5e5e5;
1714 .insert-media:focus,
1715 .insert-media:active {
1718 text-decoration: none;
1721 .insert-media .dashicons {
1728 @media (max-width: 320px) {
1729 .insert-media .dashicons {
1739 margin: 14px 0 14px 30px;
1743 @media (max-width: 320px) {
1745 margin: 10px 0 10px 10px;
1751 display: inline-block;
1752 text-decoration: none;
1756 .draft-button.is-hidden,
1757 .draft-button .saving-draft,
1758 .draft-button.is-saving .save-draft {
1762 .draft-button.is-saving .saving-draft {
1766 /* TinyMCE styles */
1767 .editor .wp-media-buttons {
1771 .editor div.mce-toolbar-grp {
1772 padding: 0.71429em 0;
1777 @media (max-height: 400px), (max-width: 320px) {
1778 .editor div.mce-toolbar-grp {
1783 .mce-stack-layout:before,
1784 .mce-stack-layout:after {
1789 .mce-stack-layout:after {
1793 .mce-container.mce-toolbar {
1797 .mce-container.mce-toolbar:nth-child(2) {
1801 @media (max-width: 600px) {
1802 .mce-first .mce-btn:nth-child(3),
1803 .mce-first .mce-btn:nth-child(4) {
1810 clip: rect(0 0 0 0);
1814 .mce-first .mce-btn:nth-child(3):focus,
1815 .mce-first .mce-btn:nth-child(4):focus {
1823 border: 1px solid #999;
1831 #wp-link-wrap input[type="text"] {
1836 @media screen and (max-width: 782px) {
1841 #wp-link-wrap input[type="text"] {
1846 #wp-link-wrap .howto {
1851 /* Options panel (sidebar) */
1855 margin-left: -320px;
1857 border-right: 1px solid #e5e5e5;
1859 /* Keeps background the full height of the screen, but only visually. Clicks go through. */
1860 -webkit-box-shadow: -5001px 5000px 0 5000px #fff, -5000px 5000px 0 5000px #e5e5e5;
1861 box-shadow: -5001px 5000px 0 5000px #fff, -5000px 5000px 0 5000px #e5e5e5;
1865 .options-panel-back {
1874 @media (max-width: 900px) {
1877 -webkit-transform: translateX(100%);
1878 -ms-transform: translateX(100%);
1879 transform: translateX(100%);
1880 -webkit-transition: -webkit-transform .3s ease-in-out;
1881 transition: transform .3s ease-in-out;
1884 .options-panel.is-hidden {
1888 .options-panel.is-off-screen {
1889 -webkit-transform: translateX(0);
1890 -ms-transform: translateX(0);
1891 transform: translateX(0);
1895 @media (max-width: 320px) {
1900 -webkit-box-shadow: -5001px 5000px 0 5000px #fff;
1901 box-shadow: -5001px 5000px 0 5000px #fff;
1904 .options-panel-back {
1917 .post-options .post-option-contents {
1922 .post-option-forward:before {
1930 .post-option-back:before {
1934 .lt-ie9 .options-panel,
1935 .lt-ie9 .post-options {
1936 border-right: 1px solid #e5e5e5;
1939 .lt-ie9 .post-options.is-off-screen {
1947 .post-options .post-option {
1950 padding: 13px 14px 13px 37px;
1951 border-bottom: 1px solid #e5e5e5;
1952 text-decoration: none;
1955 text-overflow: ellipsis;
1956 white-space: nowrap;
1958 -webkit-transition: -webkit-transform .3s ease-in-out;
1959 transition: transform .3s ease-in-out;
1962 .post-options .post-option:focus {
1964 -webkit-box-shadow: inset -5px 0 0 #00a0d2;
1965 box-shadow: inset -5px 0 0 #00a0d2;
1968 .is-off-screen > .post-option {
1972 .is-hidden > .post-option {
1976 @media (min-width: 1px) {
1977 .is-off-screen > .post-option {
1979 -webkit-transform: translateX(100%);
1980 -ms-transform: translateX(100%);
1981 transform: translateX(100%);
1985 .post-option-title {
1986 display: inline-block;
1989 font-weight: normal;
1998 -webkit-transition: -webkit-transform .3s ease-in-out;
1999 transition: transform .3s ease-in-out;
2002 .setting-modal.is-hidden {
2007 .setting-modal.is-off-screen {
2011 @media (min-width: 1px) {
2012 .setting-modal.is-off-screen {
2014 -webkit-transform: translateX(-100%);
2015 -ms-transform: translateX(-100%);
2016 transform: translateX(-100%);
2024 border-bottom: 1px solid #e5e5e5;
2026 text-decoration: none;
2030 .modal-close:focus {
2032 -webkit-box-shadow: inset -5px 0 0 #00a0d2;
2033 box-shadow: inset -5px 0 0 #00a0d2;