/*
Title: New Colors
Description: A new default color palette for better consistency and usability.
PR: https://github.com/WordPress/design-experiments/pull/15
*/

/* Colors */

$wp-white: #ffffff;
$wp-black: #000000;

$wp-gray-0: #f6f7f7;
$wp-gray-5: #dcdcde;
$wp-gray-10: #c3c4c7;
$wp-gray-20: #a7aaad;
$wp-gray-30: #8e9196;
$wp-gray-40: #787c82;
$wp-gray-50: #646970;
$wp-gray-60: #50575e;
$wp-gray-70: #3c434a;
$wp-gray-80: #2c3338;
$wp-gray-90: #1d2327;
$wp-gray-100: #101517;
$wp-gray: $wp-gray-50;

$wp-blue-0: #eff3f7;
$wp-blue-5: #c6def6;
$wp-blue-10: #9ac6f0;
$wp-blue-20: #72aee6;
$wp-blue-30: #5198d9;
$wp-blue-40: #3582c4;
$wp-blue-50: #2271b1;
$wp-blue-60: #135e96;
$wp-blue-70: #0a4b78;
$wp-blue-80: #043959;
$wp-blue-90: #01263a;
$wp-blue-100: #00131c;
$wp-blue: $wp-blue-50;

$wp-red-0: #f7edee;
$wp-red-5: #ffccd0;
$wp-red-10: #ffa6ab;
$wp-red-20: #ff8085;
$wp-red-30: #f86368;
$wp-red-40: #e65054;
$wp-red-50: #d63638;
$wp-red-60: #b32d2e;
$wp-red-70: #8a2424;
$wp-red-80: #691c1c;
$wp-red-90: #451313;
$wp-red-100: #240a0a;
$wp-red: $wp-red-50;

$wp-yellow-0: #f7f2e6;
$wp-yellow-5: #f7e1ae;
$wp-yellow-10: #f2cf75;
$wp-yellow-20: #f0c443;
$wp-yellow-30: #dbae17;
$wp-yellow-40: #b69000;
$wp-yellow-50: #907300;
$wp-yellow-60: #705b00;
$wp-yellow-70: #5c4b00;
$wp-yellow-80: #453900;
$wp-yellow-90: #302800;
$wp-yellow-100: #1c1700;
$wp-yellow: $wp-yellow-50;

$wp-green-0: #ebf7f1;
$wp-green-5: #a4f5c8;
$wp-green-10: #59e38f;
$wp-green-20: #1ed15a;
$wp-green-30: #00ba37;
$wp-green-40: #00a32a;
$wp-green-50: #008a20;
$wp-green-60: #007017;
$wp-green-70: #005c12;
$wp-green-80: #00450c;
$wp-green-90: #003008;
$wp-green-100: #001c05;
$wp-green: $wp-green-50;

$wp-orange-0: #f7f0ea;
$wp-orange-5: #fcd7ba;
$wp-orange-10: #ffbf86;
$wp-orange-20: #faa754;
$wp-orange-30: #e68b28;
$wp-orange-40: #d67709;
$wp-orange-50: #b26200;
$wp-orange-60: #8a4d00;
$wp-orange-70: #704000;
$wp-orange-80: #543100;
$wp-orange-90: #361f00;
$wp-orange-100: #1f1200;
$wp-orange: $wp-orange-50;



// common.css


.screen-reader-shortcut:focus {
	left: 6px;
	top: -25px;
	height: auto;
	width: auto;
	display: block;
	font-size: 14px;
	font-weight: 600;
	padding: 15px 23px 14px;
	background: $wp-gray-0;
	color: $wp-blue-50;
	z-index: 100000;
	line-height: normal;
	box-shadow: 0 0 2px 2px rgba($wp-black, 0.6);
	text-decoration: none;
	/* Only visible in Windows High Contrast mode */
	outline: 2px solid transparent;
	outline-offset: -2px;
}

/* @todo: Take a second look. Large chunks of shared color, from the colors.css merge */
.widget-top,
.menu-item-handle,
.widget-inside,
#menu-settings-column .accordion-container,
#menu-management .menu-edit,
.manage-menus,
table.widefat,
.stuffbox,
p.popular-tags,
.widgets-holder-wrap,
.wp-editor-container,
.popular-tags,
.feature-filter,
.imgedit-group,
.comment-ays {
	border: 1px solid $wp-gray-5;
	box-shadow: 0 1px 1px rgba($wp-black, 0.04);
}

table.widefat,
.wp-editor-container,
.stuffbox,
p.popular-tags,
.widgets-holder-wrap,
.popular-tags,
.feature-filter,
.imgedit-group,
.comment-ays {
	background: $wp-white;
}

/* general */
html,
body {
	height: 100%;
	margin: 0;
	padding: 0;
}

body {
	background: $wp-gray-0;
	color: $wp-gray-70;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
	font-size: 13px;
	line-height: 1.4em;
	min-width: 600px;
}

body.iframe {
	min-width: 0;
	padding-top: 1px;
}

body.modal-open {
	overflow: hidden;
}

body.mobile.modal-open #wpwrap {
	overflow: hidden;
	position: fixed;
	height: 100%;
}

iframe,
img {
	border: 0;
}

td {
	font-family: inherit;
	font-size: inherit;
	font-weight: inherit;
	line-height: inherit;
}

/* Any change to the default link style must be applied to button-link too. */
a {
	color: $wp-blue-50;
	transition-property: border, background, color;
	transition-duration: .05s;
	transition-timing-function: ease-in-out;
}

a,
div {
	outline: 0;
}

a:hover,
a:active {
	color: $wp-blue-30;
}

a:focus,
a:focus .media-icon img,
.wp-person a:focus .gravatar {
	color: $wp-blue-70;
	box-shadow:
		0 0 0 1px $wp-blue-30,
		0 0 2px 1px rgba($wp-blue-40, 0.8);
	/* Only visible in Windows High Contrast mode */
	outline: 1px solid transparent;
}

.ie8 a:focus {
	outline: $wp-blue-30 solid 1px;
}

#adminmenu a:focus {
	box-shadow: none;
	/* Only visible in Windows High Contrast mode */
	outline: 1px solid transparent;
	outline-offset: -1px;
}

.screen-reader-text:focus {
	box-shadow: none;
	outline: none;
}

blockquote,
q {
	quotes: none;
}

blockquote:before,
blockquote:after,
q:before,
q:after {
	content: "";
	content: none;
}

p {
	font-size: 13px;
	line-height: 1.5;
	margin: 1em 0;
}

blockquote {
	margin: 1em;
}

li,
dd {
	margin-bottom: 6px;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	display: block;
	font-weight: 600;
}

h1 {
	color: $wp-gray-90;
	font-size: 2em;
	margin: .67em 0;
}

h2,
h3 {
	color: $wp-gray-90;
	font-size: 1.3em;
	margin: 1em 0;
}

.update-core-php h2 {
	margin-top: 2em;
}

.update-php h2,
.update-messages h2,
h4 {
	font-size: 1em;
	margin: 1.33em 0;
}

h5 {
	font-size: 0.83em;
	margin: 1.67em 0;
}

h6 {
	font-size: 0.67em;
	margin: 2.33em 0;
}

ul,
ol {
	padding: 0;
}

ul {
	list-style: none;
}

ol {
	list-style-type: decimal;
	margin-left: 2em;
}

ul.ul-disc {
	list-style: disc outside;
}

ul.ul-square {
	list-style: square outside;
}

ol.ol-decimal {
	list-style: decimal outside;
}

ul.ul-disc,
ul.ul-square,
ol.ol-decimal {
	margin-left: 1.8em;
}

ul.ul-disc > li,
ul.ul-square > li,
ol.ol-decimal > li {
	margin: 0 0 0.5em;
}

/* rtl:ignore */
.ltr {
	direction: ltr;
}

/* rtl:ignore */
.code,
code {
	font-family: Consolas, Monaco, monospace;
	direction: ltr;
	unicode-bidi: embed;
}

kbd,
code {
	padding: 3px 5px 2px 5px;
	margin: 0 1px;
	background: $wp-gray-0;
	background: rgba($wp-black, 0.07);
	font-size: 13px;
}

.subsubsub {
	list-style: none;
	margin: 8px 0 0;
	padding: 0;
	font-size: 13px;
	float: left;
	color: $wp-gray-50;
}

.subsubsub a {
	line-height: 2;
	padding: .2em;
	text-decoration: none;
}

.subsubsub a .count,
.subsubsub a.current .count {
	color: $wp-gray-60; /* $wp-gray-0 background */
	font-weight: 400;
}

.subsubsub a.current {
	font-weight: 600;
	border: none;
}

.subsubsub li {
	display: inline-block;
	margin: 0;
	padding: 0;
	white-space: nowrap;
}

/* .widefat - main style for tables */
.widefat {
	border-spacing: 0;
	width: 100%;
	clear: both;
	margin: 0;
}

.widefat * {
	word-wrap: break-word;
}

.widefat a,
.widefat button.button-link {
	text-decoration: none;
}

.widefat td,
.widefat th {
	padding: 8px 10px;
}

.widefat thead th,
.widefat thead td {
	border-bottom: 1px solid $wp-gray-5;
}

.widefat tfoot th,
.widefat tfoot td {
	border-top: 1px solid $wp-gray-5;
	border-bottom: none;
}

.widefat .no-items td {
	border-bottom-width: 0;
}

.widefat td {
	vertical-align: top;
}

.widefat td,
.widefat td p,
.widefat td ol,
.widefat td ul {
	font-size: 13px;
	line-height: 1.5em;
}

.widefat th,
.widefat thead td,
.widefat tfoot td {
	text-align: left;
	line-height: 1.3em;
	font-size: 14px;
}

.widefat th input,
.updates-table td input,
.widefat thead td input,
.widefat tfoot td input {
	margin: 0 0 0 8px;
	padding: 0;
	vertical-align: text-top;
}

.widefat .check-column {
	width: 2.2em;
	padding: 6px 0 25px;
	vertical-align: top;
}

.widefat tbody th.check-column {
	padding: 9px 0 22px;
}

.widefat thead td.check-column,
.widefat tbody th.check-column,
.updates-table tbody td.check-column,
.widefat tfoot td.check-column {
	padding: 11px 0 0 3px;
}

.widefat thead td.check-column,
.widefat tfoot td.check-column {
	padding-top: 4px;
	vertical-align: middle;
}

.update-php div.updated,
.update-php div.error {
	margin-left: 0;
}

.no-js .widefat thead .check-column input,
.no-js .widefat tfoot .check-column input {
	display: none;
}

.widefat .num,
.column-comments,
.column-links,
.column-posts {
	text-align: center;
}

.widefat th#comments {
	vertical-align: middle;
}

.wrap {
	margin: 10px 20px 0 2px;
}

.wrap.block-editor-no-js {
	padding-left: 20px;
}

.wrap > h2:first-child, /* Back-compat for pre-4.4 */
.wrap [class$="icon32"] + h2, /* Back-compat for pre-4.4 */
.postbox .inside h2, /* Back-compat for pre-4.4 */
.wrap h1 {
	font-size: 23px;
	font-weight: 400;
	margin: 0;
	padding: 9px 0 4px 0;
	line-height: 1.3;
}

.wrap h1.wp-heading-inline {
	display: inline-block;
	margin-right: 5px;
}

.wp-header-end {
	visibility: hidden;
	margin: -2px 0 0;
}

.subtitle {
	margin: 0;
	padding-left: 25px;
	color: $wp-gray-60;
	font-size: 14px;
	font-weight: 400;
	line-height: 1;
}

.wrap .add-new-h2, /* deprecated */
.wrap .add-new-h2:active, /* deprecated */
.wrap .page-title-action,
.wrap .page-title-action:active {
	margin-left: 4px;
	padding: 4px 8px;
	position: relative;
	top: -3px;
	text-decoration: none;
	border: none;
	border: 1px solid $wp-gray-10;
	border-radius: 2px;
	background: $wp-gray-0;
	text-shadow: none;
	font-weight: 600;
	font-size: 13px;
	line-height: normal; /* IE8-IE11 need this for buttons */
	color: $wp-blue-50; /* some of these controls are button elements and don't inherit from links */
	cursor: pointer;
}

.wrap .wp-heading-inline + .page-title-action {
	margin-left: 0;
}

.wrap .add-new-h2:hover, /* deprecated */
.wrap .page-title-action:hover {
	border-color: $wp-blue-50;
	background: $wp-blue-50;
	color: $wp-white;
}

/* lower specificity: color needs to be overridden by :hover and :active */
.page-title-action:focus {
	color: $wp-blue-70;
}

.wrap .page-title-action:focus {
	border-color: $wp-blue-30;
	box-shadow: 0 0 2px rgba($wp-blue-40, 0.8);
	/* Only visible in Windows High Contrast mode */
	outline: 2px solid transparent;
}

.wrap h1.long-header {
	padding-right: 0;
}

.wp-dialog {
	background-color: $wp-white;
}

.widgets-chooser ul,
#widgets-left .widget-in-question .widget-top,
#available-widgets .widget-top:hover,
div#widgets-right .widget-top:hover,
#widgets-left .widget-top:hover {
	border-color: $wp-gray-30;
	box-shadow: 0 1px 2px rgba($wp-black, 0.1);
}

.sorthelper {
	background-color: $wp-blue-5;
}

.ac_match,
.subsubsub a.current {
	color: $wp-black;
}

.striped > tbody > :nth-child(odd),
ul.striped > :nth-child(odd),
.alternate {
	background-color: $wp-gray-0;
}

.bar {
	background-color: $wp-gray-0;
	border-right-color: $wp-blue-30;
}

/* Helper classes for plugins to leverage the active WordPress color scheme */

.highlight {
	background-color: $wp-blue-0;
	color: $wp-black;
}

.wp-ui-primary {
	color: $wp-white;
	background-color: $wp-gray-80;
}
.wp-ui-text-primary {
	color: $wp-gray-80;
}

.wp-ui-highlight {
	color: $wp-white;
	background-color: $wp-blue-50;
}
.wp-ui-text-highlight {
	color: $wp-blue-50;
}

.wp-ui-notification {
	color: $wp-white;
	background-color: $wp-red-50;
}
.wp-ui-text-notification {
	color: $wp-red-50;
}

.wp-ui-text-icon {
	color: $wp-gray-40; /* same as new icons */
}

/* For emoji replacement images */
img.emoji {
	display: inline !important;
	border: none !important;
	height: 1em !important;
	width: 1em !important;
	margin: 0 .07em !important;
	vertical-align: -0.1em !important;
	background: none !important;
	padding: 0 !important;
	box-shadow: none !important;
}

/*------------------------------------------------------------------------------
  1.0 - Text Styles
------------------------------------------------------------------------------*/

.widget .widget-top,
.postbox .hndle,
.stuffbox .hndle,
.control-section .accordion-section-title,
.sidebar-name,
#nav-menu-header,
#nav-menu-footer,
.menu-item-handle,
.checkbox,
.side-info,
#your-profile #rich_editing,
.widefat thead th,
.widefat thead td,
.widefat tfoot th,
.widefat tfoot td {
	line-height: 1.4em;
}

.widget .widget-top,
.menu-item-handle {
	background: $wp-gray-0;
	color: $wp-gray-90;
}

.postbox .hndle,
.stuffbox .hndle {
	border-bottom: 1px solid $wp-gray-0;
}

.quicktags,
.search {
	background-color: $wp-gray-10;
	color: $wp-black;
	font-size: 12px;
}

.icon32 {
	display: none;
}

/* @todo can we combine these into a class or use an existing dashicon one? */
.welcome-panel .welcome-panel-close:before,
.tagchecklist .ntdelbutton .remove-tag-icon:before,
#bulk-titles div a:before,
.notice-dismiss:before {
	background: none;
	color: $wp-gray-50;
	content: "\f153";
	display: block;
	font: normal 16px/20px dashicons;
	speak: none;
	height: 20px;
	text-align: center;
	width: 20px;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

.welcome-panel .welcome-panel-close:before {
	margin: 0;
}

#bulk-titles div a:before {
	margin: 1px 0;
}

.tagchecklist .ntdelbutton .remove-tag-icon:before {
	margin-left: 2px;
	border-radius: 50%;
	color: $wp-blue-50;
	/* vertically center the icon cross browsers */
	line-height: 1.28;
}

.tagchecklist .ntdelbutton:focus {
	outline: 0;
}

.welcome-panel .welcome-panel-close:hover:before,
.welcome-panel .welcome-panel-close:focus:before,
.tagchecklist .ntdelbutton:hover .remove-tag-icon:before,
.tagchecklist .ntdelbutton:focus .remove-tag-icon:before,
#bulk-titles div a:hover:before,
#bulk-titles div a:focus:before {
	color: $wp-red-50;
}

.tagchecklist .ntdelbutton:focus .remove-tag-icon:before {
	box-shadow:
		0 0 0 1px $wp-blue-30,
		0 0 2px 1px rgba($wp-blue-40, 0.8);
}

.key-labels label {
	line-height: 24px;
}

strong, b {
	font-weight: 600;
}

.pre {
	/* https://developer.mozilla.org/en-US/docs/CSS/white-space */
	white-space: pre-wrap; /* css-3 */
	word-wrap: break-word; /* IE 5.5 - 7 */
}

.howto {
	color: $wp-gray-50;
	font-style: italic;
	display: block;
}

p.install-help {
	margin: 8px 0;
	font-style: italic;
}

.no-break {
	white-space: nowrap;
}

hr {
	border: 0;
	border-top: 1px solid $wp-gray-5;
	border-bottom: 1px solid $wp-gray-0;
}

.row-actions span.delete a,
.row-actions span.trash a,
.row-actions span.spam a,
.plugins a.delete,
#all-plugins-table .plugins a.delete,
#search-plugins-table .plugins a.delete,
.submitbox .submitdelete,
#media-items a.delete,
#media-items a.delete-permanently,
#nav-menu-footer .menu-delete,
#delete-link a.delete {
	color: $wp-red-70;
}

abbr.required,
span.required,
.file-error,
.row-actions .delete a:hover,
.row-actions .trash a:hover,
.row-actions .spam a:hover,
.plugins a.delete:hover,
#all-plugins-table .plugins a.delete:hover,
#search-plugins-table .plugins a.delete:hover,
.submitbox .submitdelete:hover,
#media-items a.delete:hover,
#media-items a.delete-permanently:hover,
#nav-menu-footer .menu-delete:hover,
#delete-link a.delete:hover {
	color: $wp-red-50;
	border: none;
}

/*------------------------------------------------------------------------------
  3.0 - Actions
------------------------------------------------------------------------------*/

#major-publishing-actions {
	padding: 10px;
	clear: both;
	border-top: 1px solid $wp-gray-5;
	background: $wp-gray-0;
}

#delete-action {
	float: left;
	line-height: 2.1;
}

#delete-link {
	line-height: 2.1;
	vertical-align: middle;
	text-align: left;
	margin-left: 8px;
}

#delete-link a {
	text-decoration: none;
}

#publishing-action {
	text-align: right;
	float: right;
	line-height: 1.9;
}

#publishing-action .spinner {
	float: left;
}

#misc-publishing-actions {
	padding: 6px 0 0;
}

.misc-pub-section {
	padding: 6px 10px 8px;
}

.misc-pub-filename {
	word-wrap: break-word;
}

#minor-publishing-actions {
	padding: 10px 10px 0 10px;
	text-align: right;
}

#save-post {
	float: left;
}

.preview {
	float: right;
}

#sticky-span {
	margin-left: 18px;
}

.approve,
.unapproved .unapprove {
	display: none;
}

.unapproved .approve,
.spam .approve,
.trash .approve {
	display: inline;
}

td.action-links,
th.action-links {
	text-align: right;
}

#misc-publishing-actions .notice {
	margin-left: 10px;
	margin-right: 10px;
}

/* Filter bar */
.wp-filter {
	display: inline-block;
	position: relative;
	box-sizing: border-box;
	margin: 12px 0 25px;
	padding: 0 10px;
	width: 100%;
	box-shadow: 0 1px 1px rgba($wp-black, 0.04);
	border: 1px solid $wp-gray-5;
	background: $wp-white;
	color: $wp-gray-60;
	font-size: 13px;
}

.wp-filter a {
	text-decoration: none;
}

.filter-count {
	display: inline-block;
	vertical-align: middle;
	min-width: 4em;
}

.title-count,
.filter-count .count {
	display: inline-block;
	position: relative;
	top: -1px;
	padding: 4px 10px;
	border-radius: 30px;
	background: $wp-gray-50;
	color: $wp-white;
	font-size: 14px;
	font-weight: 600;
}

/* not a part of filter bar, but derived from it, so here for now */
.title-count {
	display: inline;
	top: -3px;
	margin-left: 5px;
	margin-right: 20px;
}

.filter-items {
	float: left;
}

.filter-links {
	display: inline-block;
	margin: 0;
}

.filter-links li {
	display: inline-block;
	margin: 0;
}

.filter-links li > a {
	display: inline-block;
	margin: 0 10px;
	padding: 15px 0;
	border-bottom: 4px solid $wp-white;
	color: $wp-gray-50;
	cursor: pointer;
}

.filter-links .current {
	box-shadow: none;
	border-bottom: 4px solid $wp-gray-50;
	color: $wp-gray-90;
}

.filter-links li > a:hover,
.filter-links li > a:focus,
.show-filters .filter-links a.current:hover,
.show-filters .filter-links a.current:focus {
	color: $wp-blue-30;
}

.wp-filter .search-form {
	float: right;
	margin: 10px 0;
}

.wp-filter .search-form input[type="search"] {
	margin: 0;
	padding: 3px 5px;
	width: 280px;
	max-width: 100%;
	font-size: 16px;
	font-weight: 300;
	line-height: 1.5;
}

.wp-filter .search-form select {
	margin: 0;
	height: 32px;
	vertical-align: top;
}

.wp-filter .search-form.search-plugins {
	display: inline-block;
}

.wp-filter .button.drawer-toggle {
	margin: 10px 9px 0;
	padding: 0 10px 0 6px;
	border-color: transparent;
	background-color: transparent;
	color: $wp-gray-50;
	vertical-align: baseline;
	box-shadow: none;
}

.wp-filter .drawer-toggle:before {
	content: "\f111";
	margin: 0 5px 0 0;
	color: $wp-gray-50;
	font: normal 16px/1 dashicons;
	vertical-align: text-bottom;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

.wp-filter .button.drawer-toggle:hover,
.wp-filter .drawer-toggle:hover:before,
.wp-filter .button.drawer-toggle:focus,
.wp-filter .drawer-toggle:focus:before {
	background-color: transparent;
	color: $wp-blue-30;
}

.wp-filter .button.drawer-toggle:hover,
.wp-filter .button.drawer-toggle:focus:active {
	border-color: transparent;
}

.wp-filter .button.drawer-toggle:focus {
	border-color: $wp-blue-30;
}

.wp-filter .button.drawer-toggle:active {
	background: transparent;
	box-shadow: none;
	transform: none;
}

.wp-filter .drawer-toggle.current:before {
	color: $wp-white;
}

.filter-drawer,
.wp-filter .favorites-form {
	display: none;
	margin: 0 -10px 0 -20px;
	padding: 20px;
	border-top: 1px solid $wp-gray-0;
	background: $wp-gray-0;
	overflow: hidden;
}

.show-filters .filter-drawer,
.show-favorites-form .favorites-form {
	display: block;
}

.show-filters .filter-links a.current {
	border-bottom: none;
}

.show-filters .wp-filter .button.drawer-toggle {
	border-radius: 2px;
	background: $wp-gray-50;
	color: $wp-white;
}

.show-filters .wp-filter .drawer-toggle:hover,
.show-filters .wp-filter .drawer-toggle:focus {
	background: $wp-blue-30;
}

.show-filters .wp-filter .drawer-toggle:before {
	color: $wp-white;
}

.filter-group {
	box-sizing: border-box;
	position: relative;
	float: left;
	margin: 0 1% 0 0;
	padding: 20px 10px 10px;
	width: 24%;
	background: $wp-white;
	border: 1px solid $wp-gray-5;
	box-shadow: 0 1px 1px rgba($wp-black, 0.04);
}

.filter-group legend {
	position: absolute;
	top: 10px;
	display: block;
	margin: 0;
	padding: 0;
	font-size: 1em;
	font-weight: 600;
}

.filter-drawer .filter-group-feature {
	margin: 28px 0 0;
	list-style-type: none;
	font-size: 12px;
}

.filter-drawer .filter-group-feature input,
.filter-drawer .filter-group-feature label {
	line-height: 1.4;
}

.filter-drawer .filter-group-feature input {
	position: absolute;
	margin: 0;
}

.filter-group .filter-group-feature label {
	display: block;
	margin: 14px 0px 14px 23px;
}

.filter-drawer .buttons {
	clear: both;
	margin-bottom: 20px;
}

.filter-drawer .filter-group + .buttons {
	margin-bottom: 0;
	padding-top: 20px;
}

.filter-drawer .buttons .button span {
	display: inline-block;
	opacity: 0.8;
	font-size: 12px;
	text-indent: 10px;
}

.wp-filter .button.clear-filters {
	display: none;
	margin-left: 10px;
}

.wp-filter .button-link.edit-filters {
	padding: 0 5px;
	line-height: 2.2;
}

.filtered-by {
	display: none;
	margin: 0;
}

.filtered-by > span {
	font-weight: 600;
}

.filtered-by a {
	margin-left: 10px;
}

.filtered-by .tags {
	display: inline;
}

.filtered-by .tag {
	margin: 0 5px;
	padding: 4px 8px;
	border: 1px solid $wp-gray-5;
	box-shadow: 0 1px 1px rgba($wp-black, 0.04);
	background: $wp-white;
	font-size: 11px;
}

.filters-applied .filter-group,
.filters-applied .filter-drawer .buttons,
.filters-applied .filter-drawer br {
	display: none !important;
}

.filters-applied .filtered-by {
	display: block;
}

.filters-applied .filter-drawer {
	padding: 20px;
}

.show-filters .favorites-form,
.show-filters .content-filterable,
.show-filters.filters-applied.loading-content .content-filterable,
.loading-content .content-filterable,
.error .content-filterable {
	display: none;
}

.show-filters.filters-applied .content-filterable {
	display: block;
}

.loading-content .spinner {
	display: block;
	margin: 40px auto 0;
	float: none;
}

@media only screen and (max-width: 1120px) {
	.filter-drawer {
		border-bottom: 1px solid $wp-gray-0;
	}

	.filter-group {
		margin-bottom: 0;
		margin-top: 5px;
		width: 100%;
	}

	.filter-group li {
		margin: 10px 0;
	}
}

@media only screen and (max-width: 1000px) {
	.filter-items {
		float: none;
	}

	.wp-filter .media-toolbar-primary,
	.wp-filter .media-toolbar-secondary,
	.wp-filter .search-form {
		float: none; /* Remove float from media-views.css */
		position: relative;
		max-width: 100%;
	}
}

@media only screen and (max-width: 782px) {
	.filter-group li {
		padding: 0;
		width: 50%;
	}
}

@media only screen and (max-width: 320px) {
	.filter-count {
		display: none;
	}

	.wp-filter .drawer-toggle {
		margin: 10px 0;
	}

	.filter-group li,
	.wp-filter .search-form input[type="search"] {
		width: 100%;
	}
}

/*------------------------------------------------------------------------------
  4.0 - Notifications
------------------------------------------------------------------------------*/

.notice,
div.updated,
div.error {
	background: $wp-white;
	border-left: 4px solid $wp-white;
	box-shadow: 0 1px 1px 0 rgba($wp-black, 0.1);
	margin: 5px 15px 2px;
	padding: 1px 12px;
}

div[class="update-message"] { /* back-compat for pre-4.6 */
	padding: 0.5em 12px 0.5em 0;
}

.notice p,
.notice-title,
div.updated p,
div.error p,
.form-table td .notice p {
	margin: 0.5em 0;
	padding: 2px;
}

.error a {
	text-decoration: underline;
}

.updated a {
	padding-bottom: 2px;
}

.notice-alt {
	box-shadow: none;
}

.notice-large {
	padding: 10px 20px;
}

.notice-title {
	display: inline-block;
	color: $wp-gray-90;
	font-size: 18px;
}

.wp-core-ui .notice.is-dismissible {
	padding-right: 38px;
	position: relative;
}

.notice-dismiss {
	position: absolute;
	top: 0;
	right: 1px;
	border: none;
	margin: 0;
	padding: 9px;
	background: none;
	color: $wp-gray-50;
	cursor: pointer;
}

.notice-dismiss:hover:before,
.notice-dismiss:active:before,
.notice-dismiss:focus:before {
	color: $wp-red-50;
}

.notice-dismiss:focus {
	outline: none;
	box-shadow: 0 0 0 1px $wp-blue-30, 0 0 2px 1px rgba($wp-blue-40, 0.8);
}

.ie8 .notice-dismiss:focus {
	outline: 1px solid $wp-blue-30;
}

.notice-success,
div.updated {
	border-left-color: $wp-green-20;
}

.notice-success.notice-alt {
	background-color: $wp-green-0;
}

.notice-warning {
	border-left-color: $wp-yellow-30;
}

.notice-warning.notice-alt {
	background-color: $wp-yellow-0;
}

.notice-error,
div.error {
	border-left-color: $wp-red-50;
}

.notice-error.notice-alt {
	background-color: $wp-red-0;
}

.notice-info {
	border-left-color: $wp-blue-30;
}

.notice-info.notice-alt {
	background-color: $wp-blue-0;
}

.update-message p:before,
.updating-message p:before,
.updated-message p:before,
.import-php .updating-message:before,
.button.updating-message:before,
.button.updated-message:before,
.button.installed:before,
.button.installing:before {
	display: inline-block;
	font: normal 20px/1 'dashicons';
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	vertical-align: top;
}

.wrap .notice,
.wrap div.updated,
.wrap div.error,
.media-upload-form .notice,
.media-upload-form div.error {
	margin: 5px 0 15px;
}

.wrap #templateside .notice {
	display: block;
	margin: 0;
	padding: 5px 8px;
	font-weight: 600;
	text-decoration: none;
}

.wrap #templateside span.notice {
	margin-left: -12px;
}

#templateside li.notice a {
	padding: 0;
}

/* Update icon. */
.update-message p:before,
.updating-message p:before,
.import-php .updating-message:before,
.button.updating-message:before,
.button.installing:before {
	color: $wp-yellow-50;
	content: "\f463";
}

/* Spins the update icon. */
.updating-message p:before,
.import-php .updating-message:before,
.button.updating-message:before,
.button.installing:before {
	animation: rotation 2s infinite linear;
}

/* Updated icon (check mark). */
.updated-message p:before,
.installed p:before,
.button.updated-message:before {
	color: $wp-green-20;
	content: "\f147";
}

/* Error icon. */
.update-message.notice-error p:before {
	color: $wp-red-50;
	content: "\f534";
}

.wrap .notice p:before,
.import-php .updating-message:before {
	margin-right: 6px;
	vertical-align: bottom;
}

#update-nag,
.update-nag {
	display: inline-block;
	line-height: 1.4;
	padding: 11px 15px;
	font-size: 14px;
	text-align: left;
	margin: 25px 20px 0 2px;
	background-color: $wp-white;
	border-left: 4px solid #ffba00;
	box-shadow: 0 1px 1px 0 rgba($wp-black, 0.1);
}

ul#dismissed-updates {
	display: none;
}

#dismissed-updates li > p {
	margin-top: 0;
}

#dismiss,
#undismiss {
	margin-left: 0.5em;
}

form.upgrade {
	margin-top: 8px;
}

form.upgrade .hint {
	font-style: italic;
	font-size: 85%;
	margin: -0.5em 0 2em 0;
}

.update-php .spinner {
	float: none;
	margin: -4px 0;
}

#ajax-loading,
.ajax-loading,
.ajax-feedback,
.imgedit-wait-spin,
.list-ajax-loading { /* deprecated */
	visibility: hidden;
}

#ajax-response.alignleft {
	margin-left: 2em;
}

.button.updating-message:before,
.button.updated-message:before,
.button.installed:before,
.button.installing:before {
	margin: 3px 5px 0 -2px;
}

.button-primary.updating-message:before {
	color: $wp-white;
}

.button-primary.updated-message:before {
	color: $wp-blue-30;
}

.button.updated-message {
	transition-property: border, background, color;
	transition-duration: .05s;
	transition-timing-function: ease-in-out;
}

@media aural {
	.wrap .notice p:before,
	.button.installing:before,
	.button.installed:before,
	.update-message p:before {
		speak: none;
	}
}


/* @todo: this does not need its own section anymore */
/*------------------------------------------------------------------------------
  6.0 - Admin Header
------------------------------------------------------------------------------*/
#adminmenu a,
#taglist a,
#catlist a {
	text-decoration: none;
}

/*------------------------------------------------------------------------------
  6.1 - Screen Options Tabs
------------------------------------------------------------------------------*/

#screen-options-wrap,
#contextual-help-wrap {
	margin: 0;
	padding: 8px 20px 12px;
	position: relative;
}

#contextual-help-wrap {
	overflow: auto;
	margin-left: 0 !important;
}

#screen-meta-links {
	float: right;
	margin: 0 20px 0 0;
}

/* screen options and help tabs revert */
#screen-meta {
	display: none;
	margin: 0 20px -1px 0px;
	position: relative;
	background-color: $wp-white;
	border: 1px solid $wp-gray-5;
	border-top: none;
	box-shadow: 0 1px 0 rgba($wp-black, 0.025);
}

#screen-options-link-wrap,
#contextual-help-link-wrap {
	float: left;
	margin: 0 0 0 6px;
}

#screen-meta-links .screen-meta-toggle {
	position: relative;
	top: 0;
}

#screen-meta-links .show-settings {
	border: 1px solid $wp-gray-5;
	border-top: none;
	border-bottom-color: $wp-gray-10;
	height: auto;
	margin-bottom: 0;
	padding: 3px 6px 3px 16px;
	background: $wp-white;
	border-radius: 0;
	color: $wp-gray-50;
	line-height: 1.7;
	box-shadow: none;
}

#screen-meta-links .show-settings:hover,
#screen-meta-links .show-settings:active,
#screen-meta-links .show-settings:focus {
	color: $wp-gray-80;
}

#screen-meta-links .show-settings:focus {
	border-color: $wp-blue-30;
	box-shadow: 0 0 3px rgba($wp-blue-50, 0.8);
}

#screen-meta-links .show-settings:active {
	transform: none;
}

#screen-meta-links .show-settings:after {
	right: 0;
	content: "\f140";
	font: normal 20px/1 dashicons;
	speak: none;
	display: inline-block;
	padding: 0 5px 0 0;
	bottom: 2px;
	position: relative;
	vertical-align: bottom;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-decoration: none !important;
	color: $wp-gray-50;
}

#screen-meta-links .screen-meta-active:after {
	content: "\f142";
}

/* end screen options and help tabs */

.toggle-arrow {
	background-repeat: no-repeat;
	background-position: top left;
	background-color: transparent;
	height: 22px;
	line-height: 22px;
	display: block;
}

.toggle-arrow-active {
	background-position: bottom left;
}

#screen-options-wrap h5, /* Back-compat for old plugins */
#screen-options-wrap legend,
#contextual-help-wrap h5 {
	margin: 0;
	padding: 8px 0;
	font-size: 13px;
	font-weight: 600;
}

.ie8 #screen-options-wrap legend {
	color: inherit;
}

.metabox-prefs label {
	display: inline-block;
	padding-right: 15px;
	line-height: 2.35;
}

#number-of-columns {
	display: inline-block;
	vertical-align: middle;
	line-height: 30px;
}

.metabox-prefs input[type=checkbox] {
	margin-top: 0;
	margin-right: 6px;
}

.metabox-prefs label input,
.metabox-prefs label input[type=checkbox] {
	margin: -4px 5px 0 0;
}

.metabox-prefs .columns-prefs label input {
	margin: -1px 2px 0 0;
}

.metabox-prefs label a {
	display: none;
}

.metabox-prefs .screen-options input,
.metabox-prefs .screen-options label {
	margin-top: 0;
	margin-bottom: 0;
	vertical-align: middle;
}

.metabox-prefs .screen-options .screen-per-page {
	margin-right: 15px;
}

.metabox-prefs .screen-options label {
	line-height: 2.2;
	padding-right: 0;
}

.screen-options + .screen-options {
	margin-top: 10px;
}

.metabox-prefs .submit {
	margin-top: 1em;
	padding: 0;
}

/*------------------------------------------------------------------------------
  6.2 - Help Menu
------------------------------------------------------------------------------*/

#contextual-help-wrap {
	padding: 0;
}

#contextual-help-columns {
	position: relative;
}

#contextual-help-back {
	position: absolute;
	top: 0;
	bottom: 0;
	left: 150px;
	right: 170px;
	border: 1px solid $wp-gray-5;
	border-top: none;
	border-bottom: none;
	background: $wp-gray-0;
}

#contextual-help-wrap.no-sidebar #contextual-help-back {
	right: 0;
	border-right-width: 0;
	border-bottom-right-radius: 2px;
}

.contextual-help-tabs {
	float: left;
	width: 150px;
	margin: 0;
}

.contextual-help-tabs ul {
	margin: 1em 0;
}

.contextual-help-tabs li {
	margin-bottom: 0;
	list-style-type: none;
	border-style: solid;
	border-width: 0 0 0 2px;
	border-color: transparent;
}

.contextual-help-tabs a {
	display: block;
	padding: 5px 5px 5px 12px;
	line-height: 1.4;
	text-decoration: none;
	border: 1px solid transparent;
	border-right: none;
	border-left: none;
}

.contextual-help-tabs a:hover {
	color: $wp-gray-80;
}

.contextual-help-tabs .active {
	padding: 0;
	margin: 0 -1px 0 0;
	border-left: 2px solid $wp-blue-30;
	background: $wp-gray-0;
	box-shadow: 0 2px 0 rgba($wp-black, 0.02), 0 1px 0 rgba($wp-black, 0.02);
}

.contextual-help-tabs .active a {
	border-color: $wp-gray-5;
	color: $wp-gray-80;
}

.contextual-help-tabs-wrap {
	padding: 0 20px;
	overflow: auto;
}

.help-tab-content {
	display: none;
	margin: 0 22px 12px 0;
	line-height: 1.6;
}

.help-tab-content.active {
	display: block;
}

.help-tab-content ul li {
	list-style-type: disc;
	margin-left: 18px;
}

.contextual-help-sidebar {
	width: 150px;
	float: right;
	padding: 0 8px 0 12px;
	overflow: auto;
}

/*------------------------------------------------------------------------------
  8.0 - Layout Blocks
------------------------------------------------------------------------------*/

html.wp-toolbar {
	padding-top: 32px;
	box-sizing: border-box;
}

.widefat th,
.widefat td {
	color: $wp-gray-60;
}

.widefat th,
.widefat thead td,
.widefat tfoot td {
	font-weight: 400;
}

.widefat thead tr th,
.widefat thead tr td,
.widefat tfoot tr th,
.widefat tfoot tr td {
	color: $wp-gray-80;
}

.widefat td p {
	margin: 2px 0 0.8em;
}

.widefat p,
.widefat ol,
.widefat ul {
	color: $wp-gray-80;
}

.widefat .column-comment p {
	margin: 0.6em 0;
}

.widefat .column-comment ul {
	list-style: initial;
	margin-left: 2em;
}

/* Screens with postboxes */
.postbox-container {
	float: left;
}

.postbox-container .meta-box-sortables {
	box-sizing: border-box;
}

#wpbody-content .metabox-holder {
	padding-top: 10px;
}

.metabox-holder .postbox-container .empty-container {
	border: 3px dashed $wp-gray-10;
	height: 250px;
	position: relative;
}

.metabox-holder .postbox-container .empty-container:after {
	content: attr(data-emptystring);
	margin: auto;
	position: absolute;
	top: 0;
	left: 0;
	bottom: 0;
	right: 0;
	height: 1em;
	width: 200px;
	text-align: center;
	color: $wp-gray-10;
	font-size: 18px;
	display: none;
}

.metabox-holder.columns-1 .postbox-container .empty-container,
.columns-2 #postbox-container-3 .empty-container,
.columns-2 #postbox-container-4 .empty-container,
.columns-3 #postbox-container-4 .empty-container {
	border: 0 none;
	height: 0;
	min-height: 0;
}

#post-body-content {
	width: 100%;
	min-width: 463px;
	float: left;
}

#post-body.columns-2 #postbox-container-1 {
	float: right;
	margin-right: -300px;
	width: 280px;
}

#post-body.columns-2 #side-sortables {
	min-height: 250px;
}

/* one column on the dash */
@media only screen and (max-width: 799px) {
	#wpbody-content .metabox-holder .postbox-container .empty-container {
		border: 0 none;
		height: 0;
		min-height: 0;
	}
}

.js .widget .widget-top,
.js .postbox .hndle {
	cursor: move;
}

.hndle a {
	font-size: 11px;
	font-weight: 400;
}

.postbox .handlediv {
	display: none;
	float: right;
	width: 36px;
	height: 36px;
	margin: 0;
	padding: 0;
	border: 0;
	background: none;
	cursor: pointer;
}

.js .postbox .handlediv {
	display: block;
}

.sortable-placeholder {
	border: 1px dashed $wp-gray-10;
	margin-bottom: 20px;
}

.postbox,
.stuffbox {
	margin-bottom: 20px;
	padding: 0;
	line-height: 1;
}

/* user-select is not a part of the CSS standard - may change behavior in the future */
.postbox .hndle,
.stuffbox .hndle {
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

.postbox .inside {
	padding: 0 12px 12px;
	line-height: 1.4;
	font-size: 13px;
}

.stuffbox .inside {
	padding: 0;
	line-height: 1.4;
	font-size: 13px;
	margin-top: 0;
}

.postbox .inside {
	margin: 11px 0;
	position: relative;
}

.postbox .inside > p:last-child,
.rss-widget ul li:last-child {
	margin-bottom: 1px !important;
}

.postbox.closed h3 {
	border: none;
	box-shadow: none;
}

.postbox table.form-table {
	margin-bottom: 0;
}

.postbox table.widefat {
	box-shadow: none;
}

.temp-border {
	border: 1px dotted $wp-gray-10;
}

.columns-prefs label {
	padding: 0 10px 0 0;
}

/* @todo: what is this doing here */
#dashboard_right_now .versions .b,
#post-status-display,
#post-visibility-display,
#adminmenu .wp-submenu li.current,
#adminmenu .wp-submenu li.current a,
#adminmenu .wp-submenu li.current a:hover,
.media-item .percent,
.plugins .name,
#pass-strength-result.strong,
#pass-strength-result.short,
#ed_reply_toolbar #ed_reply_strong,
.item-controls .item-order a,
.feature-filter .feature-name {
	font-weight: 600;
}

/*------------------------------------------------------------------------------
  21.0 - Admin Footer
------------------------------------------------------------------------------*/

#wpfooter {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	padding: 10px 20px;
	color: $wp-gray-60;
}

#wpfooter p {
	font-size: 13px;
	margin: 0;
	line-height: 1.55;
}

#footer-thankyou {
	font-style: italic;
}

/*------------------------------------------------------------------------------
  25.0 - Tabbed Admin Screen Interface (Experimental)
------------------------------------------------------------------------------*/

.nav-tab {
	float: left;
	border: 1px solid $wp-gray-10;
	border-bottom: none;
	margin-left: 0.5em; /* half the font size so set the font size properly */
	padding: 5px 10px;
	font-size: 14px;
	line-height: 1.71428571;
	font-weight: 600;
	background: $wp-gray-5;
	color: $wp-gray-60;
	text-decoration: none;
	white-space: nowrap;
}

h3 .nav-tab, /* Back-compat for pre-4.4 */
.nav-tab-small .nav-tab {
	padding: 5px 14px;
	font-size: 12px;
	line-height: 1.33;
}

.nav-tab:hover,
.nav-tab:focus {
	background-color: $wp-white;
	color: $wp-gray-70;
}

.nav-tab-active,
.nav-tab:focus:active {
	box-shadow: none;
}

.nav-tab-active {
	margin-bottom: -1px;
	color: $wp-gray-70;
}

.nav-tab-active,
.nav-tab-active:hover,
.nav-tab-active:focus,
.nav-tab-active:focus:active {
	border-bottom: 1px solid $wp-gray-0;
	background: $wp-gray-0;
	color: $wp-black;
}

h1.nav-tab-wrapper, /* Back-compat for pre-4.4 */
.wrap h2.nav-tab-wrapper, /* higher specificity to override .wrap > h2:first-child */
.nav-tab-wrapper {
	border-bottom: 1px solid $wp-gray-10;
	margin: 0;
	padding-top: 9px;
	padding-bottom: 0;
	line-height: inherit;
}

/* Back-compat for plugins. Deprecated. Use .wp-clearfix instead. */
.nav-tab-wrapper:not(.wp-clearfix):after {
	content: "";
	display: table;
	clear: both;
}

.ie8 .nav-tab-wrapper {
	/* contain floats establishing a new block formatting context */
	display: inline-block;
	width: 100%;
	vertical-align: top;
}

/*------------------------------------------------------------------------------
  26.0 - Misc
------------------------------------------------------------------------------*/

.spinner {
	background: url(../images/spinner.gif) no-repeat;
	background-size: 20px 20px;
	display: inline-block;
	visibility: hidden;
	float: right;
	vertical-align: middle;
	opacity: 0.7;
	filter: alpha(opacity=70);
	width: 20px;
	height: 20px;
	margin: 4px 10px 0;
}

.spinner.is-active,
.loading-content .spinner {
	visibility: visible;
}

#template > div {
	margin-right: 16em;
}
#template .notice {
	margin-top: 1em;
	margin-right: 3%;
}
#template .notice p {
	width: auto;
}
#template .submit .spinner {
	float: none;
}

.metabox-holder .stuffbox > h3, /* Back-compat for pre-4.4 */
.metabox-holder .postbox > h3, /* Back-compat for pre-4.4 */
.metabox-holder h3.hndle, /* Back-compat for pre-4.4 */
.metabox-holder h2.hndle {
	font-size: 14px;
	padding: 8px 12px;
	margin: 0;
	line-height: 1.4;
}

/* Back-compat for nav-menus screen */
.nav-menus-php .metabox-holder h3 {
	padding: 10px 10px 11px 14px;
	line-height: 1.5;
}

#templateside ul li a {
	text-decoration: none;
}

.plugin-install #description,
.plugin-install-network #description {
	width: 60%;
}

table .vers,
table .column-visible,
table .column-rating {
	text-align: left;
}

.attention,
.error-message {
	color: $wp-red-50;
	font-weight: 600;
}

/* Scrollbar fix for bulk upgrade iframe */
body.iframe {
	height: 98%;
}

/* Upgrader styles, Specific to Language Packs */
.lp-show-latest p {
	display: none;
}
.lp-show-latest p:last-child,
.lp-show-latest .lp-error p {
	display: block;
}

/* - Only used once or twice in all of WP - deprecate for global style
------------------------------------------------------------------------------*/
.media-icon {
	width: 62px; /* icon + border */
	text-align: center;
}

.media-icon img {
	border: 1px solid $wp-gray-5;
	border: 1px solid rgba($wp-black, 0.07);
}

#howto {
	font-size: 11px;
	margin: 0 5px;
	display: block;
}

.importers {
	font-size: 16px;
	width: auto;
}

.importers td {
	padding-right: 14px;
	line-height: 1.4;
}

.importers .import-system {
	max-width: 250px;
}

.importers td.desc {
	max-width: 500px;
}

.importer-title,
.importer-desc,
.importer-action {
	display: block;
}

.importer-title {
	color: $wp-black;
	font-size: 14px;
	font-weight: 400;
	margin-bottom: .2em;
}

.importer-action {
	line-height: 1.55; /* Same as with .updating-message */
	color: $wp-gray-60;
	margin-bottom: 1em;
}

#post-body #post-body-content #namediv h3, /* Back-compat for pre-4.4 */
#post-body #post-body-content #namediv h2 {
	margin-top: 0;
}

.edit-comment-author {
	color: $wp-gray-90;
	border-bottom: 1px solid $wp-gray-0;
}

#namediv h3 label, /* Back-compat for pre-4.4 */
#namediv h2 label {
	vertical-align: baseline;
}

#namediv table {
	width: 100%;
}

#namediv td.first {
	width: 10px;
	white-space: nowrap;
}

#namediv input {
	width: 98%;
}

#namediv p {
	margin: 10px 0;
}

#submitdiv h3 {
	margin-bottom: 0 !important;
}

/* - Used - but could/should be deprecated with a CSS reset
------------------------------------------------------------------------------*/
.zerosize {
	height: 0;
	width: 0;
	margin: 0;
	border: 0;
	padding: 0;
	overflow: hidden;
	position: absolute;
}

br.clear {
	height: 2px;
	line-height: 0.15;
}

.checkbox {
	border: none;
	margin: 0;
	padding: 0;
}

fieldset {
	border: 0;
	padding: 0;
	margin: 0;
}

.post-categories {
	display: inline;
	margin: 0;
	padding: 0;
}

.post-categories li {
	display: inline;
}

/* Star Ratings - Back-compat for pre-3.8 */
div.star-holder {
	position: relative;
	height: 17px;
	width: 100px;
	background: url(../images/stars.png?ver=20121108) repeat-x bottom left;
}

div.star-holder .star-rating {
	background: url(../images/stars.png?ver=20121108) repeat-x top left;
	height: 17px;
	float: left;
}

/* Star Ratings */
.star-rating {
	white-space: nowrap;
}
.star-rating .star {
	display: inline-block;
	width: 20px;
	height: 20px;
	-webkit-font-smoothing: antialiased;
	font-size: 20px;
	line-height: 1;
	font-family: dashicons;
	text-decoration: inherit;
	font-weight: 400;
	font-style: normal;
	vertical-align: top;
	transition: color .1s ease-in;
	text-align: center;
	color: $wp-yellow-30;
}

.star-rating .star-full:before {
	content: "\f155";
}

.star-rating .star-half:before {
	content: "\f459";
}

.rtl .star-rating .star-half {
	transform: rotateY(180deg);
}

.star-rating .star-empty:before {
	content: "\f154";
}

div.action-links {
	font-weight: 400;
	margin: 6px 0 0;
}

/* Plugin install thickbox */
#plugin-information {
	background: $wp-white;
	position: fixed;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	height: 100%;
	padding: 0;
}

#plugin-information-scrollable {
	overflow: auto;
	-webkit-overflow-scrolling: touch;
	height: 100%;
}

#plugin-information-title {
	padding: 0 26px;
	background: $wp-gray-0;
	font-size: 22px;
	font-weight: 600;
	line-height: 2.4;
	position: relative;
	height: 56px;
}

#plugin-information-title.with-banner {
	margin-right: 0;
	height: 250px;
	background-size: cover;
}

#plugin-information-title h2 {
	font-size: 1em;
	font-weight: 600;
	padding: 0;
	margin: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

#plugin-information-title.with-banner h2 {
	position: relative;
	font-family: "Helvetica Neue", sans-serif;
	display: inline-block;
	font-size: 30px;
	line-height: 1.68;
	box-sizing: border-box;
	max-width: 100%;
	padding: 0 15px;
	margin-top: 174px;
	color: $wp-white;
	background: rgba($wp-gray-90, 0.9);
	text-shadow: 0 1px 3px rgba($wp-black, 0.4);
	box-shadow: 0 0 30px rgba($wp-white, 0.1);
	border-radius: 8px;
}

#plugin-information-title div.vignette {
	display: none;
}

#plugin-information-title.with-banner div.vignette {
	position: absolute;
	display: block;
	top: 0;
	left: 0;
	height: 250px;
	width: 100%;
	background: transparent;
	box-shadow: inset 0 0 50px 4px rgba($wp-black, 0.2), inset 0 -1px 0 rgba($wp-black, 0.1);
}

#plugin-information-tabs {
	padding: 0 16px;
	position: relative;
	right: 0;
	left: 0;
	min-height: 36px;
	font-size: 0;
	z-index: 1;
	border-bottom: 1px solid $wp-gray-5;
	background: $wp-gray-0;
}

#plugin-information-tabs a {
	position: relative;
	display: inline-block;
	padding: 9px 10px;
	margin: 0;
	height: 18px;
	line-height: 1.3;
	font-size: 14px;
	text-decoration: none;
	transition: none;
}

#plugin-information-tabs a.current {
	margin: 0 -1px -1px;
	background: $wp-white;
	border: 1px solid $wp-gray-5;
	border-bottom-color: $wp-white;
	padding-top: 8px;
	color: $wp-gray-80;
}

#plugin-information-tabs.with-banner a.current {
	border-top: none;
	padding-top: 9px;
}

#plugin-information-tabs a:active,
#plugin-information-tabs a:focus {
	outline: none;
}

#plugin-information-content {
	overflow: hidden; /* equal height column trick */
	background: $wp-white;
	position: relative;
	top: 0;
	right: 0;
	left: 0;
	min-height: 100%;
	/* Height of title + tabs + install now */
	min-height: calc( 100% - 152px );
}

#plugin-information-content.with-banner {
	/* Height of banner + tabs + install now */
	min-height: calc( 100% - 346px );
}

#section-holder {
	position: relative;
	top: 0;
	right: 250px;
	bottom: 0;
	left: 0;
	margin-right: 250px; /* FYI box */
	padding: 10px 26px;
	margin-bottom: -99939px; /* 60px less than the padding below to accommodate footer */
	padding-bottom: 99999px; /* equal height column trick */
}

#section-holder .updated {
	margin: 16px 0;
}

#plugin-information .fyi {
	float: right;
	position: relative;
	top: 0;
	right: 0;
	padding: 16px;
	margin-bottom: -99939px; /* 60px less than the padding below to accommodate footer */
	padding-bottom: 99999px; /* equal height column trick */
	width: 217px;
	border-left: 1px solid $wp-gray-5;
	background: $wp-gray-0;
	color: $wp-gray-50;
}

#plugin-information .fyi strong {
	color: $wp-gray-70;
}

#plugin-information .fyi h3 {
	font-weight: 600;
	text-transform: uppercase;
	font-size: 12px;
	color: $wp-gray-50;
	margin: 24px 0 8px;
}

#plugin-information .fyi h2 {
	font-size: 0.9em;
	margin-bottom: 0;
	margin-right: 0;
}

#plugin-information .fyi ul {
	padding: 0;
	margin: 0;
	list-style: none;
}

#plugin-information .fyi li {
	margin: 0 0 10px;
}

#plugin-information .fyi-description {
	margin-top: 0;
}

#plugin-information .counter-container {
	margin: 3px 0;
}

#plugin-information .counter-label {
	float: left;
	margin-right: 5px;
	min-width: 55px;
}

#plugin-information .counter-back {
	height: 17px;
	width: 92px;
	background-color: $wp-gray-5;
	float: left;
}

#plugin-information .counter-bar {
	height: 17px;
	background-color: $wp-yellow-20; /* slightly lighter than stars due to larger expanse */
	float: left;
}

#plugin-information .counter-count {
	margin-left: 5px;
}

#plugin-information .fyi ul.contributors {
	margin-top: 10px;
}

#plugin-information .fyi ul.contributors li {
	display: inline-block;
	margin-right: 8px;
	vertical-align: middle;
}

#plugin-information .fyi ul.contributors li {
	display: inline-block;
	margin-right: 8px;
	vertical-align: middle;
}

#plugin-information .fyi ul.contributors li img {
	vertical-align: middle;
	margin-right: 4px;
}

#plugin-information-footer {
	padding: 13px 16px;
	position: absolute;
	right: 0;
	bottom: 0;
	left: 0;
	height: 33px; /* 33+13+13+1=60 */
	border-top: 1px solid $wp-gray-5;
	background: $wp-gray-0;
}

/* rtl:ignore */
#plugin-information .section {
	direction: ltr;
}

/* rtl:ignore */
#plugin-information .section ul,
#plugin-information .section ol {
	list-style-type: disc;
	margin-left: 24px;
}

#plugin-information .section,
#plugin-information .section p {
	font-size: 14px;
	line-height: 1.7;
}

#plugin-information #section-screenshots ol {
	list-style: none;
	margin: 0;
}

#plugin-information #section-screenshots li img {
	vertical-align: text-top;
	margin-top: 16px;
	max-width: 100%;
	width: auto;
	height: auto;
	box-shadow: 0 1px 2px rgba($wp-black, 0.3);
}

/* rtl:ignore */
#plugin-information #section-screenshots li p {
	font-style: italic;
	padding-left: 20px;
}

#plugin-information pre {
	padding: 7px;
	overflow: auto;
	border: 1px solid $wp-gray-10;
}

#plugin-information blockquote {
	border-left: 2px solid $wp-gray-5;
	color: $wp-gray-50;
	font-style: italic;
	margin: 1em 0;
	padding: 0 0 0 1em;
}

/* rtl:ignore */
#plugin-information .review {
	overflow: hidden; /* clearfix */
	width: 100%;
	margin-bottom: 20px;
	border-bottom: 1px solid $wp-gray-5;
}

#plugin-information .review-title-section {
	overflow: hidden; /* clearfix */
}

/* rtl:ignore */
#plugin-information .review-title-section h4 {
	display: inline-block;
	float: left;
	margin: 0 6px 0 0;
}

#plugin-information .reviewer-info p {
	clear: both;
	margin: 0;
	padding-top: 2px;
}

/* rtl:ignore */
#plugin-information .reviewer-info .avatar {
	float: left;
	margin: 4px 6px 0 0;
}

/* rtl:ignore */
#plugin-information .reviewer-info .star-rating {
	float: left;
}

/* rtl:ignore */
#plugin-information .review-meta {
	float: left;
	margin-left: 0.75em;
}

/* rtl:ignore */
#plugin-information .review-body {
	float: left;
	width: 100%;
}

.plugin-version-author-uri {
	font-size: 13px;
}

/* For non-js plugin installation screen ticket #36430. */
.update-php .button.button-primary {
	margin-right: 1em;
}

@media screen and (max-width: 771px) {
	#plugin-information-title.with-banner {
		height: 100px;
	}

	#plugin-information-title.with-banner h2 {
		margin-top: 30px;
		font-size: 20px;
		line-height: 2;
		max-width: 85%;
	}

	#plugin-information-title.with-banner div.vignette {
		height: 100px;
	}

	#plugin-information-tabs {
		overflow: hidden; /* clearfix */
		padding: 0;
		height: auto; /* let tabs wrap */
	}

	#plugin-information-tabs a.current {
		margin-bottom: 0;
		border-bottom: none;
	}

	#plugin-information .fyi {
		float: none;
		border: 1px solid $wp-gray-5;
		position: static;
		width: auto;
		margin: 26px 26px 0;
		padding-bottom: 0; /* reset from the two column height fix */
	}

	#section-holder {
		position: static;
		margin: 0;
		padding-bottom: 70px; /* reset from the two column height fix, plus accommodate footer */
	}

	#plugin-information .fyi h3,
	#plugin-information .fyi small {
		display: none;
	}

	#plugin-information-footer {
		padding: 12px 16px 0;
		height: 46px;
	}
}

/* Thickbox for the Plugin details modal. */
#TB_window.plugin-details-modal {
	background: $wp-gray-0;
}

#TB_window.plugin-details-modal.thickbox-loading:before {
	content: "";
	display: block;
	width: 20px;
	height: 20px;
	position: absolute;
	left: 50%;
	top: 50%;
	z-index: -1;
	margin: -10px 0 0 -10px;
	background: $wp-gray-0 url(../images/spinner.gif) no-repeat center;
	background-size: 20px 20px;
	transform: translateZ(0);
}

@media print,
	(-webkit-min-device-pixel-ratio: 1.25),
	(min-resolution: 120dpi) {

	#TB_window.plugin-details-modal.thickbox-loading:before {
		background-image: url(../images/spinner-2x.gif);
	}
}

.plugin-details-modal #TB_title {
	float: left;
	height: 1px;
}

.plugin-details-modal #TB_ajaxWindowTitle {
	display: none;
}

.plugin-details-modal #TB_closeWindowButton {
	left: auto;
	right: -30px;
	color: $wp-gray-0;
}

.plugin-details-modal #TB_closeWindowButton:hover,
.plugin-details-modal #TB_closeWindowButton:focus {
	color: $wp-blue-30;
	outline: none;
	box-shadow: none;
}

.plugin-details-modal .tb-close-icon {
	display: none;
}

.plugin-details-modal #TB_closeWindowButton:after {
	content: "\f335";
	font: normal 32px/29px 'dashicons';
	speak: none;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

/* move plugin install close icon to top on narrow screens */
@media screen and (max-width: 830px) {
	.plugin-details-modal #TB_closeWindowButton {
		right: 0;
		top: -30px;
	}
}

/* @todo: move this. */
img {
	border: none;
}

/* Metabox collapse arrow indicators */
.sidebar-name .toggle-indicator:before,
.js .meta-box-sortables .postbox .toggle-indicator:before,
.bulk-action-notice .toggle-indicator:before,
.privacy-text-box .toggle-indicator:before {
	content: "\f142";
	display: inline-block;
	font: normal 20px/1 dashicons;
	speak: none;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-decoration: none !important;
}

.js .widgets-holder-wrap.closed .toggle-indicator:before,
.js .meta-box-sortables .postbox.closed .handlediv .toggle-indicator:before,
.bulk-action-notice .bulk-action-errors-collapsed .toggle-indicator:before,
.privacy-text-box.closed .toggle-indicator:before {
	content: "\f140";
}

.js .postbox .handlediv .toggle-indicator:before {
	margin-top: 4px;
	width: 20px;
	border-radius: 50%;
	text-indent: -1px; /* account for the dashicon alignment */
}

.rtl.js .postbox .handlediv .toggle-indicator:before {
	text-indent: 1px; /* account for the dashicon alignment */
}

.bulk-action-notice .toggle-indicator:before {
	line-height: 16px;
	vertical-align: top;
	color: $wp-gray-50;
}

.js .postbox .handlediv:focus {
	box-shadow: none;
	outline: none;
}

.js .postbox .handlediv:focus .toggle-indicator:before {
	box-shadow:
		0 0 0 1px $wp-blue-30,
		0 0 2px 1px rgba($wp-blue-40, 0.8);
}

/* @todo: appears to be Press This only and overridden */
#photo-add-url-div input[type="text"] {
	width: 300px;
}

/* Theme/Plugin Editor */
.alignleft h2 {
	margin: 0;
}

#template textarea {
	font-family: Consolas, Monaco, monospace;
	font-size: 13px;
	background: $wp-gray-0;
	-moz-tab-size: 4;
	-o-tab-size: 4;
	tab-size: 4;
}

#template textarea,
#template .CodeMirror {
	width: 100%;
	min-height: 60vh;
	height: calc( 100vh - 295px );
	border: 1px solid $wp-gray-5;
	box-sizing: border-box;
}

#templateside > h2 {
	padding-top: 6px;
	padding-bottom: 7px;
	margin: 0;
}

#templateside ol,
#templateside ul {
	margin: 0;
	padding: 0;
}
#templateside > ul {
	box-sizing: border-box;
	margin-top: 0;
	overflow: auto;
	padding: 0;
	min-height: 60vh;
	height: calc(100vh - 295px);
	background-color: $wp-gray-0;
	border: 1px solid $wp-gray-5;
	border-left: none;
}
#templateside ul ul {
	padding-left: 12px;
}
#templateside > ul > li > ul[role=group] {
	padding-left: 0;
}

/*
 * Styles for Theme and Plugin editors.
 */

/* Hide collapsed items. */
[role="treeitem"][aria-expanded="false"] > ul {
	display: none;
}

/* Use arrow dashicons for folder states, but hide from screen readers. */
[role="treeitem"] span[aria-hidden] {
	display: inline;
	font-family: dashicons;
	font-size: 20px;
	position: absolute;
	pointer-events: none;
}
[role="treeitem"][aria-expanded="false"] > .folder-label .icon:after {
	content: "\f139";
}
[role="treeitem"][aria-expanded="true"] > .folder-label .icon:after {
	content: "\f140";
}
[role="treeitem"] .folder-label {
	display: block;
	padding: 3px 3px 3px 12px;
	cursor: pointer;
}

/* Remove outline, and create our own focus and hover styles */
[role="treeitem"] {
	outline: 0;
}
[role="treeitem"] .folder-label.focus {
	color: $wp-blue-70;
	box-shadow: 0 0 0 1px $wp-blue-30, 0 0 2px 1px rgba($wp-blue-40, 0.8);
}
[role="treeitem"].hover,
[role="treeitem"] .folder-label.hover {
	background-color: $wp-gray-0;
}

.tree-folder {
	margin: 0;
	position: relative;
}
[role="treeitem"] li {
	position: relative;
}

/* Styles for folder indicators/depth */
.tree-folder .tree-folder::after {
	content: "";
	display: block;
	position: absolute;
	left: 2px;
	border-left: 1px solid $wp-gray-10;
	top: -13px;
	bottom: 10px;
}
.tree-folder > li::before {
	content: "";
	position: absolute;
	display: block;
	border-left: 1px solid $wp-gray-10;
	left: 2px;
	top: -5px;
	height: 18px;
	width: 7px;
	border-bottom: 1px solid $wp-gray-10;
}
.tree-folder > li::after {
	content: "";
	position: absolute;
	display: block;
	border-left: 1px solid $wp-gray-10;
	left: 2px;
	bottom: -7px;
	top: 0;
}

/* current-file needs to adjustment for .notice styles */
#templateside .current-file {
	margin: -4px 0 -2px;
}
.tree-folder > .current-file::before {
	left: 4px;
	height: 15px;
	width: 0px;
	border-left: none;
	top: 3px;
}
.tree-folder > .current-file::after {
	bottom: -4px;
	height: 7px;
	left: 2px;
	top: auto;
}

/* Lines shouldn't continue on last item */
.tree-folder > li:last-child::after,
.tree-folder li:last-child > .tree-folder::after {
	display: none;
}


#theme-plugin-editor-label {
	display: inline-block;
	margin-bottom: 1em;
	font-weight: 600;
}

/* rtl:ignore */
#template textarea,
#docs-list {
	direction: ltr;
}

.fileedit-sub #theme,
.fileedit-sub #plugin {
	max-width: 40%;
}
.fileedit-sub .alignright {
	text-align: right;
}

#template p {
	width: 97%;
}

#file-editor-linting-error {
	margin-top: 1em;
	margin-bottom: 1em;
}
#file-editor-linting-error > .notice {
	margin: 0;
	display: inline-block;
}
#file-editor-linting-error > .notice > p {
	width: auto;
}
#template .submit {
	margin-top: 1em;
	padding: 0;
}

#template .submit input[type=submit][disabled] {
	cursor: not-allowed;
}
#templateside {
	float: right;
	width: 16em;
	word-wrap: break-word;
}

#postcustomstuff p.submit {
	margin: 0;
}

#templateside h4 {
	margin: 1em 0 0;
}

#templateside li {
	margin: 4px 0;
}

#templateside li:not(.howto) a,
.theme-editor-php .highlight {
	display: block;
	padding: 3px 0 3px 12px;
	text-decoration: none;
}

#templateside li:not(.howto) > a:first-of-type {
	padding-top: 0;
}

#templateside li.howto {
	padding: 6px 12px 12px 12px;
}

.theme-editor-php .highlight {
	margin: -3px 3px -3px -12px;
}

#templateside .highlight {
	border: none;
	font-weight: 600;
}

.nonessential {
	color: $wp-gray-50;
	font-size: 11px;
	font-style: italic;
	padding-left: 12px;
}

#documentation {
	margin-top: 10px;
}

#documentation label {
	line-height: 1.8;
	vertical-align: baseline;
	font-weight: 600;
}

.fileedit-sub {
	padding: 10px 0 8px;
	line-height: 180%;
}

#file-editor-warning .file-editor-warning-content {
	margin: 25px;
}

/* @todo: can we use a common class for these? */
.nav-menus-php .item-edit:before,
.widget-top .widget-action .toggle-indicator:before,
.control-section .accordion-section-title:after,
.accordion-section-title:after {
	content: "\f140";
	font: normal 20px/1 dashicons;
	speak: none;
	display: block;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-decoration: none !important;
}

.widget-top .widget-action .toggle-indicator:before {
	padding: 1px 2px 1px 0px;
	border-radius: 50%;
}

.handlediv,
.postbox .handlediv.button-link,
.item-edit,
.toggle-indicator,
.accordion-section-title:after {
	color: $wp-gray-50;
}

.widget-action {
	color: $wp-gray-60; /* $wp-gray-0 background in the Widgets screen */
}

.widget-top:hover .widget-action,
.widget-action:focus,
.handlediv:hover,
.handlediv:focus,
.postbox .handlediv.button-link:hover,
.postbox .handlediv.button-link:focus,
.item-edit:hover,
.item-edit:focus,
.sidebar-name:hover .toggle-indicator,
.accordion-section-title:hover:after {
	color: $wp-gray-90;
}

.widget-top .widget-action:focus .toggle-indicator:before {
	box-shadow:
		0 0 0 1px $wp-blue-30,
		0 0 2px 1px rgba($wp-blue-40, 0.8);
}

.control-section .accordion-section-title:after,
.accordion-section-title:after {
	float: right;
	right: 20px;
	top: -2px;
}

.control-section.open .accordion-section-title:after,
#customize-info.open .accordion-section-title:after,
.nav-menus-php .menu-item-edit-active .item-edit:before,
.widget.open .widget-top .widget-action .toggle-indicator:before,
.widget.widget-in-question .widget-top .widget-action .toggle-indicator:before {
	content: "\f142";
}

/*!
 * jQuery UI Draggable/Sortable 1.11.4
 * http://jqueryui.com
 *
 * Copyright jQuery Foundation and other contributors
 * Released under the MIT license.
 * http://jquery.org/license
 */
.ui-draggable-handle,
.ui-sortable-handle {
	touch-action: none;
}

/* Accordion */
.accordion-section {
	border-bottom: 1px solid $wp-gray-5;
	margin: 0;
}

.accordion-section.open .accordion-section-content,
.no-js .accordion-section .accordion-section-content {
	display: block;
}

.accordion-section.open:hover {
	border-bottom-color: $wp-gray-5;
}

.accordion-section-content {
	display: none;
	padding: 10px 20px 15px;
	overflow: hidden;
	background: $wp-white;
}

.accordion-section-title {
	margin: 0;
	padding: 12px 15px 15px;
	position: relative;
	border-left: 1px solid $wp-gray-5;
	border-right: 1px solid $wp-gray-5;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

.js .accordion-section-title {
	cursor: pointer;
}

.js .accordion-section-title:after {
	position: absolute;
	top: 12px;
	right: 10px;
	z-index: 1;
}

.accordion-section-title:focus {
	outline: none;
}

.accordion-section-title:hover:after,
.accordion-section-title:focus:after {
	border-color: $wp-gray-20 transparent;
}

.cannot-expand .accordion-section-title {
	cursor: auto;
}

.cannot-expand .accordion-section-title:after {
	display: none;
}

.control-section .accordion-section-title,
.customize-pane-child .accordion-section-title {
	border-left: none;
	border-right: none;
	padding: 10px 10px 11px 14px;
	line-height: 1.55;
	background: $wp-white;
}

.control-section .accordion-section-title:after,
.customize-pane-child .accordion-section-title:after {
	top: calc(50% - 10px); /* Arrow height is 20px, so use half of that to vertically center */
}

.js .control-section:hover .accordion-section-title,
.js .control-section .accordion-section-title:hover,
.js .control-section.open .accordion-section-title,
.js .control-section .accordion-section-title:focus {
	color: $wp-gray-90;
	background: $wp-gray-0;
}

.control-section.open .accordion-section-title {
	/* When expanded */
	border-bottom: 1px solid $wp-gray-5;
}

/* Edit Site */
.network-admin .edit-site-actions {
	margin-top: 0;
}

/* My Sites */
.my-sites {
	display: block;
	overflow: auto;
	zoom: 1;
}

.my-sites li {
	display: block;
	padding: 8px 3%;
	min-height: 130px;
	margin: 0;
}

@media only screen and (max-width: 599px) {
	.my-sites li {
		min-height: 0;
	}
}

@media only screen and (min-width: 600px) {
	.my-sites.striped li {
		background-color: $wp-white;
		position: relative;
	}
	.my-sites.striped li:after {
		content: "";
		width: 1px;
		height: 100%;
		position: absolute;
		top: 0;
		right: 0;
		background: $wp-gray-10;
	}

}
@media only screen and (min-width: 600px) and (max-width: 699px) {
	.my-sites li{
		float: left;
		width: 44%;
	}
	.my-sites.striped li {
		background-color: $wp-white;
	}
	.my-sites.striped li:nth-of-type(2n+1) {
		clear: left;
	}
	.my-sites.striped li:nth-of-type(2n+2):after {
		content: none;
	}
	.my-sites li:nth-of-type(4n+1),
	.my-sites li:nth-of-type(4n+2) {
		background-color: $wp-gray-0;
	}

}

@media only screen and (min-width: 700px) and (max-width: 1199px) {
	.my-sites li {
		float: left;
		width: 27.333333%;
		background-color: $wp-white;
	}
	.my-sites.striped li:nth-of-type(3n+3):after {
		content: none;
	}
	.my-sites li:nth-of-type(6n+1),
	.my-sites li:nth-of-type(6n+2),
	.my-sites li:nth-of-type(6n+3) {
		background-color: $wp-gray-0;
	}
}

@media only screen and (min-width: 1200px) and (max-width: 1399px) {
	.my-sites li {
		float: left;
		width: 21%;
		padding: 8px 2%;
		background-color: $wp-white;
	}
	.my-sites.striped li:nth-of-type(4n+1) {
		clear: left;
	}
	.my-sites.striped li:nth-of-type(4n+4):after {
		content: none;
	}
	.my-sites li:nth-of-type(8n+1),
	.my-sites li:nth-of-type(8n+2),
	.my-sites li:nth-of-type(8n+3),
	.my-sites li:nth-of-type(8n+4) {
		background-color: $wp-gray-0;
	}
}

@media only screen and (min-width: 1400px) and (max-width: 1599px) {
	.my-sites li {
		float: left;
		width: 16%;
		padding: 8px 2%;
		background-color: $wp-white;
	}
	.my-sites.striped li:nth-of-type(5n+1) {
		clear: left;
	}
	.my-sites.striped li:nth-of-type(5n+5):after {
		content: none;
	}
	.my-sites li:nth-of-type(10n+1),
	.my-sites li:nth-of-type(10n+2),
	.my-sites li:nth-of-type(10n+3),
	.my-sites li:nth-of-type(10n+4),
	.my-sites li:nth-of-type(10n+5) {
		background-color: $wp-gray-0;
	}
}

@media only screen and (min-width: 1600px) {
	.my-sites li {
		float: left;
		width: 12.666666%;
		padding: 8px 2%;
		background-color: $wp-white;
	}
	.my-sites.striped li:nth-of-type(6n+1) {
		clear: left;
	}
	.my-sites.striped li:nth-of-type(6n+6):after {
		content: none;
	}
	.my-sites li:nth-of-type(12n+1),
	.my-sites li:nth-of-type(12n+2),
	.my-sites li:nth-of-type(12n+3),
	.my-sites li:nth-of-type(12n+4),
	.my-sites li:nth-of-type(12n+5),
	.my-sites li:nth-of-type(12n+6) {
		background-color: $wp-gray-0;
	}
}

// forms.css

/* Include margin and padding in the width calculation of input and textarea. */
input,
textarea {
	box-sizing: border-box;
}

input[type="text"],
input[type="password"],
input[type="checkbox"],
input[type="color"],
input[type="date"],
input[type="datetime"],
input[type="datetime-local"],
input[type="email"],
input[type="month"],
input[type="number"],
input[type="search"],
input[type="radio"],
input[type="tel"],
input[type="text"],
input[type="time"],
input[type="url"],
input[type="week"],
select,
textarea {
	border: 1px solid $wp-gray-5;
	box-shadow: inset 0 1px 2px $wp-gray-0;
	background-color: $wp-white;
	color: $wp-gray-80;
	outline: none;
	transition: 0.05s border-color ease-in-out;
}

input[type="text"]:focus,
input[type="password"]:focus,
input[type="color"]:focus,
input[type="date"]:focus,
input[type="datetime"]:focus,
input[type="datetime-local"]:focus,
input[type="email"]:focus,
input[type="month"]:focus,
input[type="number"]:focus,
input[type="search"]:focus,
input[type="tel"]:focus,
input[type="text"]:focus,
input[type="time"]:focus,
input[type="url"]:focus,
input[type="week"]:focus,
input[type="checkbox"]:focus,
input[type="radio"]:focus,
select:focus,
textarea:focus {
	border-color: $wp-blue-30;
	box-shadow: 0 0 2px rgba($wp-blue-40, 0.8);
	/* Only visible in Windows High Contrast mode */
	outline: 2px solid transparent;
}

/* rtl:ignore */
input[type="email"],
input[type="url"] {
	direction: ltr;
}

/* Vertically align the number selector with the input. */
input[type="number"] {
	height: 28px;
	line-height: 1;
}

input[type="checkbox"],
input[type="radio"] {
	border: 1px solid $wp-gray-10;
	background: $wp-white;
	color: $wp-gray-60;
	clear: none;
	cursor: pointer;
	display: inline-block;
	line-height: 0;
	height: 16px;
	margin: -4px 4px 0 0;
	outline: 0;
	padding: 0 !important;
	text-align: center;
	vertical-align: middle;
	width: 16px;
	min-width: 16px;
	-webkit-appearance: none;
	box-shadow: inset 0 1px 2px rgba($wp-black, 0.1);
	transition: .05s border-color ease-in-out;
}

input[type="radio"]:checked + label:before {
	color: $wp-gray-40;
}

.wp-core-ui input[type="reset"]:hover,
.wp-core-ui input[type="reset"]:active {
	color: $wp-blue-30;
}

td > input[type="checkbox"],
.wp-admin p input[type="checkbox"],
.wp-admin p input[type="radio"] {
	margin-top: 0;
}

.wp-admin p label input[type="checkbox"] {
	margin-top: -4px;
}

.wp-admin p label input[type="radio"] {
	margin-top: -2px;
}

input[type="radio"] {
	border-radius: 50%;
	margin-right: 4px;
	line-height: 10px;
}

input[type="checkbox"]:checked:before,
input[type="radio"]:checked:before {
	float: left;
	display: inline-block;
	vertical-align: middle;
	width: 16px;
	font: normal 21px/1 dashicons;
	speak: none;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

input[type="checkbox"]:checked:before {
	content: "\f147";
	margin: -3px 0 0 -4px;
	color: $wp-blue-40;
}

input[type="radio"]:checked:before {
	content: "\2022";
	text-indent: -9999px;
	border-radius: 50px;
	font-size: 24px;
	width: 6px;
	height: 6px;
	margin: 4px;
	line-height: 16px;
	background-color: $wp-blue-40;
}

@-moz-document url-prefix() {
	input[type="checkbox"],
	input[type="radio"],
	.form-table input.tog {
		margin-bottom: -1px;
	}
}

/* Search */
input[type="search"] {
	-webkit-appearance: textfield;
}

input[type="search"]::-webkit-search-decoration {
	display: none;
}

.ie8 input[type="password"] {
	font-family: sans-serif;
}

textarea,
input,
select,
button {
	font-family: inherit;
	font-size: inherit;
	font-weight: inherit;
}

textarea,
input,
select {
	font-size: 14px;
	padding: 3px 5px;
	border-radius: 0; /* Reset mobile webkit's default element styling */
}

textarea {
	overflow: auto;
	padding: 2px 6px;
	line-height: 1.4;
	resize: vertical;
}

.wp-admin input[type="file"] {
	padding: 3px 0;
	cursor: pointer;
}

label {
	cursor: pointer;
}

input,
select {
	margin: 1px;
	padding: 3px 5px;
}

input.code {
	padding-top: 6px;
}

textarea.code {
	line-height: 1.4;
	padding: 4px 6px 1px 6px;
}

input.readonly,
input[readonly],
textarea.readonly,
textarea[readonly] {
	background-color: $wp-gray-0;
}

::-webkit-input-placeholder {
	color: $wp-gray-40;
}

::-moz-placeholder {
	color: $wp-gray-40;
	opacity: 1;
}

:-ms-input-placeholder {
	color: $wp-gray-40;
}

.form-invalid input,
.form-invalid input:focus,
.form-invalid select,
.form-invalid select:focus {
	border-color: $wp-red-50 !important;
	box-shadow: 0 0 2px rgba($wp-red-50, 0.8);
}

.form-table .form-required.form-invalid td:after {
	content: "\f534";
	font: normal 20px/1 dashicons;
	color: $wp-red-50;
	margin-left: -25px;
	vertical-align: middle;
}

/* Adjust error indicator for password layout */
.form-table .form-required.user-pass1-wrap.form-invalid td:after {
	content: "";
}

.form-table .form-required.user-pass1-wrap.form-invalid .password-input-wrapper:after {
	content: "\f534";
	font: normal 20px/1 dashicons;
	color: $wp-red-50;
	margin: 0 6px 0 -29px;
	vertical-align: middle;
}

.form-input-tip {
	color: $wp-gray-50;
}

input:disabled,
input.disabled,
select:disabled,
select.disabled,
textarea:disabled,
textarea.disabled {
	background: rgba($wp-white, 0.5);
	border-color: rgba($wp-gray-5, 0.75);
	box-shadow: inset 0 1px 2px rgba($wp-black, 0.04);
	color: rgba($wp-gray-80, 0.5);
}

input[type="file"]:disabled,
input[type="file"].disabled,
input[type="range"]:disabled,
input[type="range"].disabled {
	background: none;
	box-shadow: none;
	cursor: default;
}

input[type="checkbox"]:disabled,
input[type="checkbox"].disabled,
input[type="radio"]:disabled,
input[type="radio"].disabled,
input[type="checkbox"]:disabled:checked:before,
input[type="checkbox"].disabled:checked:before,
input[type="radio"]:disabled:checked:before,
input[type="radio"].disabled:checked:before {
	opacity: 0.7;
}

/*------------------------------------------------------------------------------
  2.0 - Forms
------------------------------------------------------------------------------*/


.wp-admin select {
	padding: 2px;
	line-height: 28px;
	height: 28px;
	vertical-align: middle;
}

.wp-admin .button-cancel {
	padding: 0 5px;
	line-height: 2;
}

.meta-box-sortables select {
	max-width: 100%;
}

.wp-admin select[multiple] {
	height: auto;
}

.submit {
	padding: 1.5em 0;
	margin: 5px 0;
	border-bottom-left-radius: 3px;
	border-bottom-right-radius: 3px;
	border: none;
}

form p.submit a.cancel:hover {
	text-decoration: none;
}

p.submit {
	text-align: left;
	max-width: 100%;
	margin-top: 20px;
	padding-top: 10px;
}

.textright p.submit {
	border: none;
	text-align: right;
}

table.form-table + p.submit,
table.form-table + input + p.submit,
table.form-table + input + input + p.submit {
	border-top: none;
	padding-top: 0;
}

#minor-publishing-actions input,
#major-publishing-actions input,
#minor-publishing-actions .preview {
	text-align: center;
}

textarea.all-options,
input.all-options {
	width: 250px;
}

input.large-text,
textarea.large-text {
	width: 99%;
}

.regular-text {
	width: 25em;
}

input.small-text {
	width: 50px;
	padding: 1px 6px;
}

input[type="number"].small-text {
	width: 65px;
}

input.tiny-text {
	width: 35px;
}

input[type="number"].tiny-text {
	width: 45px;
}

#doaction,
#doaction2,
#post-query-submit {
	margin: 1px 8px 0 0;
}

.tablenav #changeit,
.tablenav #delete_all,
.tablenav #clear-recent-list,
.wp-filter #delete_all {
	margin-top: 1px;
}

.tablenav .actions select {
	float: left;
	margin-right: 6px;
	max-width: 200px;
}

.ie8 .tablenav .actions select {
	width: 155px;
}

.ie8 .tablenav .actions select#cat {
	width: 200px;
}

#timezone_string option {
	margin-left: 1em;
}

.wp-hide-pw > .dashicons,
.wp-cancel-pw > .dashicons {
	position: relative;
	top: 3px;
}

.wp-cancel-pw .dashicons-no {
	display: none;
}

label,
#your-profile label + a {
	vertical-align: middle;
}

fieldset label,
#your-profile label + a {
	vertical-align: middle;
}

.options-media-php [for*="_size_"] {
	min-width: 10em;
	vertical-align: baseline;
}

.options-media-php .small-text[name*="_size_"] {
	margin: 0 0 1em;
}

#misc-publishing-actions label {
	vertical-align: baseline;
}

#pass-strength-result {
	background-color: $wp-gray-0;
	border: 1px solid $wp-gray-5;
	color: $wp-gray-90;
	margin: -1px 0 5px;
	padding: 3px 5px;
	text-align: center;
	width: 25em;
	box-sizing: border-box;
	opacity: 0;
}

#pass-strength-result.short {
	background-color: $wp-red-10;
	border-color: $wp-red-40;
	opacity: 1;
}

#pass-strength-result.bad {
	background-color: $wp-orange-5;
	border-color: $wp-orange-20;
	opacity: 1;
}

#pass-strength-result.good {
	background-color: $wp-yellow-5;
	border-color: $wp-yellow-20;
	opacity: 1;
}

#pass-strength-result.strong {
	background-color: $wp-green-5;
	border-color: $wp-green-10;
	opacity: 1;
}

#pass1.short, #pass1-text.short {
	border-color: $wp-red-40;
}

#pass1.bad, #pass1-text.bad {
	border-color: $wp-orange-20;
}

#pass1.good, #pass1-text.good {
	border-color: $wp-yellow-20;
}

#pass1.strong, #pass1-text.strong {
	border-color: $wp-green-10;
}

.pw-weak {
	display: none;
}

.indicator-hint {
	padding-top: 8px;
}

.wp-pwd [type="text"],
.wp-pwd [type="password"] {
	margin: 0;
	/* Same height as the buttons */
	line-height: 20px;
	min-height: 28px;
	max-height: 40px;
}

#pass1-text,
.show-password #pass1 {
	display: none;
}

#pass1-text::-ms-clear {
	display: none;
}

.show-password #pass1-text {
	display: inline-block;
}

.form-table span.description.important {
	font-size: 12px;
}

p.search-box {
	float: right;
	margin: 0;
}

.network-admin.themes-php p.search-box {
	clear: left;
}

.search-box input[name="s"],
.tablenav .search-plugins input[name="s"],
.tagsdiv .newtag {
	float: left;
	height: 28px;
	margin: 0 4px 0 0;
}

.js.plugins-php .search-box .wp-filter-search {
	margin: 0;
	width: 280px;
	font-size: 16px;
	font-weight: 300;
	line-height: 1.5;
	padding: 3px 5px;
	height: 32px;
}

input[type="text"].ui-autocomplete-loading,
input[type="email"].ui-autocomplete-loading {
	background-image: url(../images/loading.gif);
	background-repeat: no-repeat;
	background-position: right center;
	visibility: visible;
}

input.ui-autocomplete-input.open {
	border-bottom-color: transparent;
}

ul#add-to-blog-users {
	margin: 0 0 0 14px;
}

.ui-autocomplete {
	padding: 0;
	margin: 0;
	list-style: none;
	position: absolute;
	z-index: 10000;
	border: 1px solid $wp-blue-30;
	box-shadow: 0 1px 2px rgba($wp-blue-40, 0.8);
	background-color: $wp-white;
}

.ui-autocomplete li {
	margin-bottom: 0;
	padding: 4px 10px;
	white-space: nowrap;
	text-align: left;
	cursor: pointer;
}

/* Colors for the wplink toolbar autocomplete. */
.ui-autocomplete .ui-state-focus {
	background-color: $wp-gray-5;
}

/* Colors for the tags autocomplete. */
.wp-tags-autocomplete .ui-state-focus {
	background-color: $wp-blue-40;
	color: $wp-white;
}

/*------------------------------------------------------------------------------
  15.0 - Comments Screen
------------------------------------------------------------------------------*/

.form-table {
	border-collapse: collapse;
	margin-top: 0.5em;
	width: 100%;
	clear: both;
}

.form-table,
.form-table td,
.form-table th,
.form-table td p {
	font-size: 14px;
}

.form-table td {
	margin-bottom: 9px;
	padding: 15px 10px;
	line-height: 1.3;
	vertical-align: middle;
}

.form-table th,
.form-wrap label {
	color: $wp-gray-90;
	font-weight: 400;
	text-shadow: none;
	vertical-align: baseline;
}

.form-table th {
	vertical-align: top;
	text-align: left;
	padding: 20px 10px 20px 0;
	width: 200px;
	line-height: 1.3;
	font-weight: 600;
}

.form-table th.th-full, /* Not used by core. Back-compat for pre-4.8 */
.form-table .td-full {
	width: auto;
	padding: 20px 10px 20px 0;
	font-weight: 400;
}

.form-table td p {
	margin-top: 4px;
	margin-bottom: 0;
}

.form-table .date-time-doc {
	margin-top: 1em;
}

.form-table p.timezone-info {
	margin: 1em 0;
}

.form-table td fieldset label {
	margin: 0.25em 0 0.5em !important;
	display: inline-block;
}

.form-table td fieldset label,
.form-table td fieldset p,
.form-table td fieldset li {
	line-height: 1.4em;
}

.form-table input.tog,
.form-table input[type="radio"] {
	margin-top: -4px;
	margin-right: 4px;
	float: none;
}

.form-table .pre {
	padding: 8px;
	margin: 0;
}

table.form-table td .updated {
	font-size: 13px;
}

table.form-table td .updated p {
	font-size: 13px;
	margin: 0.3em 0;
}

/*------------------------------------------------------------------------------
  18.0 - Users
------------------------------------------------------------------------------*/

#profile-page .form-table textarea {
	width: 500px;
	margin-bottom: 6px;
}

#profile-page .form-table #rich_editing {
	margin-right: 5px
}

#your-profile legend {
	font-size: 22px;
}

#display_name {
	width: 15em;
}

#adduser .form-field input,
#createuser .form-field input {
	width: 25em;
}

.color-option {
	display: inline-block;
	width: 24%;
	padding: 5px 15px 15px;
	box-sizing: border-box;
	margin-bottom: 3px;
}

.color-option:hover,
.color-option.selected {
	background: $wp-gray-5;
}

.color-palette {
	width: 100%;
	border-spacing: 0;
	border-collapse: collapse;
}
.color-palette td {
	height: 20px;
	padding: 0;
	border: none;
}

.color-option {
	cursor: pointer;
}

/*------------------------------------------------------------------------------
  19.0 - Tools
------------------------------------------------------------------------------*/

.tool-box .title {
	margin: 8px 0;
	font-size: 18px;
	font-weight: 400;
	line-height: 24px;
}

.label-responsive {
	vertical-align: middle;
}

#export-filters p {
	margin: 0 0 1em;
}

#export-filters p.submit {
	margin: 7px 0 5px;
}

/* Card styles */

.card {
	position: relative;
	margin-top: 20px;
	padding: 0.7em 2em 1em;
	min-width: 255px;
	max-width: 520px;
	border: 1px solid $wp-gray-5;
	box-shadow: 0 1px 1px rgba($wp-black, 0.04);
	background: $wp-white;
	box-sizing: border-box;
}

/* Press this styles */

.pressthis h4 {
	margin: 2em 0 1em;
}

.pressthis textarea {
	width: 100%;
	font-size: 1em;
}

#pressthis-code-wrap {
	overflow: auto;
}

.pressthis-bookmarklet-wrapper {
	margin: 20px 0 8px;
	vertical-align: top;
	position: relative;
	z-index: 1;
}

.pressthis-bookmarklet,
.pressthis-bookmarklet:hover,
.pressthis-bookmarklet:focus,
.pressthis-bookmarklet:active {
	display: inline-block;
	position: relative;
	cursor: move;
	color: $wp-gray-80;
	background: $wp-gray-5;
	border-radius: 5px;
	border: 1px solid $wp-gray-10;
	font-style: normal;
	line-height: 16px;
	font-size: 14px;
	text-decoration: none;
}

.pressthis-bookmarklet:active {
	outline: none;
}

.pressthis-bookmarklet:after {
	content: "";
	width: 70%;
	height: 55%;
	z-index: -1;
	position: absolute;
	right: 10px;
	bottom: 9px;
	background: transparent;
	transform: skew(20deg) rotate(6deg);
	box-shadow: 0 10px 8px rgba($wp-black, 0.6);
}

.pressthis-bookmarklet:hover:after {
	transform: skew(20deg) rotate(9deg);
	box-shadow: 0 10px 8px rgba($wp-black, 0.7);
}

.pressthis-bookmarklet span {
	display: inline-block;
	margin: 0px 0 0;
	padding: 0px 12px 8px 9px;
}

.pressthis-bookmarklet span:before {
	color: $wp-gray-40;
	font: normal 20px/1 dashicons;
	content: "\f157";
	position: relative;
	display: inline-block;
	top: 4px;
	margin-right: 4px;
}

.pressthis-js-toggle {
	margin-left: 10px;
	padding: 0;
	height: auto;
	vertical-align: top;
}

/* to override the button class being applied */
.pressthis-js-toggle.button.button {
	margin-left: 10px;
	padding: 0;
	height: auto;
	vertical-align: top;
}

.pressthis-js-toggle .dashicons {
	margin: 5px 8px 6px 7px;
	color: $wp-gray-60;
}

/*------------------------------------------------------------------------------
  20.0 - Settings
------------------------------------------------------------------------------*/

.timezone-info code {
	white-space: nowrap;
}

.defaultavatarpicker .avatar {
	margin: 2px 0;
	vertical-align: middle;
}

.options-general-php .date-time-text {
	display: inline-block;
	min-width: 10em;
}

.options-general-php input.small-text {
	width: 56px;
}

.options-general-php .spinner {
	float: none;
	margin: -3px 3px 0;
}

.settings-php .language-install-spinner,
.options-general-php .language-install-spinner {
	display: inline-block;
	float: none;
	margin: -3px 5px 0;
	vertical-align: middle;
}

.form-table.permalink-structure .available-structure-tags li {
	float: left;
	margin-right: 5px;
}

/*------------------------------------------------------------------------------
  21.0 - Network Admin
------------------------------------------------------------------------------*/

.setup-php textarea {
	max-width: 100%;
}

.form-field #site-address {
	max-width: 25em;
}

.form-field #domain {
	max-width: 22em;
}

.form-field #site-title,
.form-field #admin-email,
.form-field #path,
.form-field #blog_registered,
.form-field #blog_last_updated {
	max-width: 25em;
}

.form-field #path {
	margin-bottom: 5px;
}

#search-users,
#search-sites {
	max-width: 100%;
}

/*------------------------------------------------------------------------------
   Credentials check dialog for Install and Updates
------------------------------------------------------------------------------*/

.request-filesystem-credentials-dialog {
	display: none;
	/* The customizer uses visibility: hidden on the body for full-overlays. */
	visibility: visible;
}

.request-filesystem-credentials-dialog .notification-dialog {
	top: 10%;
	max-height: 85%;
}

.request-filesystem-credentials-dialog-content {
	margin: 25px;
}

#request-filesystem-credentials-title {
	font-size: 1.3em;
	margin: 1em 0;
}

.request-filesystem-credentials-form legend {
	font-size: 1em;
	padding: 1.33em 0;
	font-weight: 600;
}

.request-filesystem-credentials-form input[type="text"],
.request-filesystem-credentials-form input[type="password"] {
	display: block;
}

.request-filesystem-credentials-dialog input[type="text"],
.request-filesystem-credentials-dialog input[type="password"] {
	width: 100%;
}

.request-filesystem-credentials-form .field-title {
	font-weight: 600;
}

.request-filesystem-credentials-dialog label[for="hostname"],
.request-filesystem-credentials-dialog label[for="public_key"],
.request-filesystem-credentials-dialog label[for="private_key"] {
	display: block;
	margin-bottom: 1em;
}

.request-filesystem-credentials-dialog .ftp-username,
.request-filesystem-credentials-dialog .ftp-password {
	float: left;
	width: 48%;
}

.request-filesystem-credentials-dialog .ftp-password {
	margin-left: 4%;
}

.request-filesystem-credentials-dialog .request-filesystem-credentials-action-buttons {
	text-align: right;
}

.request-filesystem-credentials-dialog label[for="ftp"] {
	margin-right: 10px;
}

.request-filesystem-credentials-dialog #auth-keys-desc {
	margin-bottom: 0;
}

#request-filesystem-credentials-dialog .button:not(:last-child) {
	margin-right: 10px;
}

#request-filesystem-credentials-form .cancel-button {
	display: none;
}

#request-filesystem-credentials-dialog .cancel-button {
	display: inline;
}

.request-filesystem-credentials-dialog .ftp-username,
.request-filesystem-credentials-dialog .ftp-password {
	float: none;
	width: auto;
}

.request-filesystem-credentials-dialog .ftp-username {
	margin-bottom: 1em;
}

.request-filesystem-credentials-dialog .ftp-password {
	margin: 0;
}

.request-filesystem-credentials-dialog .ftp-password em {
	color: $wp-gray-30;
}

.request-filesystem-credentials-dialog label {
	display: block;
	line-height: 1.5;
	margin-bottom: 1em;
}

.request-filesystem-credentials-form legend {
	padding-bottom: 0;
}

.request-filesystem-credentials-form #ssh-keys legend {
	font-size: 1.3em;
}

.request-filesystem-credentials-form .notice {
	margin: 0 0 20px 0;
	clear: both;
}

/*------------------------------------------------------------------------------
   Privacy Policy settings screen
------------------------------------------------------------------------------*/
.tools-privacy-policy-page form {
	margin-bottom: 1.3em;
}

.tools-privacy-policy-page input.button,
.tools-privacy-policy-page select {
	margin-left: 6px;
}

.tools-privacy-edit {
	margin: 1.5em 0;
}

.tools-privacy-policy-page span {
	line-height: 2em;
}

.privacy_requests .column-email {
	width: 40%;
}

.privacy_requests .column-type {
	text-align: center;
}

.privacy_requests thead td:first-child,
.privacy_requests tfoot td:first-child {
	border-left: 4px solid $wp-white;
}

.privacy_requests tbody th {
	border-left: 4px solid $wp-white;
	background: $wp-white;
	box-shadow: inset 0 -1px 0 rgba($wp-black, 0.1);
}

.privacy_requests tbody .has-request-results th {
	box-shadow: none;
}

.privacy_requests tbody .request-results th .notice {
	margin: 0 0 5px;
}

.privacy_requests tbody td {
	background: $wp-white;
	box-shadow: inset 0 -1px 0 rgba($wp-black, 0.1);
}

.privacy_requests tbody .has-request-results td {
	box-shadow: none;
}

.privacy_requests .next_steps .button {
	height: auto;
	line-height: 1.5;
	padding: 4px 10px;
	word-break: break-all;
	white-space: unset;
}

.privacy_requests .status-request-confirmed th,
.privacy_requests .status-request-confirmed td {
	background-color: $wp-gray-0;
	border-left-color: $wp-blue-30;
}

.privacy_requests .status-request-failed th,
.privacy_requests .status-request-failed td {
	background-color: $wp-red-0;
	border-left-color: $wp-red-50;
}

.privacy_requests .export_personal_data_failed a {
	vertical-align: baseline;
}

.status-label {
	font-weight: 600;
}

.status-label.status-request-pending {
	font-weight: 400;
	font-style: italic;
	color: $wp-gray-40;
}

.status-label.status-request-failed {
	color: $wp-red-70;
	font-weight: 600;
}

.wp-privacy-request-form {
	clear: both;
}

.wp-privacy-request-form-field {
	margin: 1.5em 0;
}

.wp-privacy-request-form label {
	font-weight: 600;
	line-height: 1.5;
	padding-bottom: .5em;
	display: block;
}

.wp-privacy-request-form input {
	line-height: 1.5;
	margin: 0;
}

.email-personal-data::before {
	display: inline-block;
	font: normal 20px/1 dashicons;
	margin: 3px 5px 0 -2px;
	speak: none;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	vertical-align: top;
}

.email-personal-data--sending::before {
	color: $wp-yellow-50;
	content: "\f463";
	animation: rotation 2s infinite linear;
}

.email-personal-data--sent::before {
	color: $wp-green-20;
	content: "\f147";
}

// admin-menu.css

#adminmenuback,
#adminmenuwrap,
#adminmenu,
#adminmenu .wp-submenu {
	width: 160px;
	background-color: $wp-gray-90;
}

/* New Menu icons */

.icon16:before {
	color: $wp-gray-40; /* same as new icons */
	font: normal 20px/1 dashicons;
	speak: none;
	padding: 6px 0;
	height: 34px;
	width: 20px;
	display: inline-block;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	transition: all .1s ease-in-out;
}

/*------------------------------------------------------------------------------
  7.0 - Main Navigation (Left Menu)
------------------------------------------------------------------------------*/

#adminmenuwrap {
	position: relative;
	float: left;
	z-index: 9990;
}

#adminmenu li {
	margin: 0;
	padding: 0;
	cursor: pointer;
}

#adminmenu a {
	display: block;
	line-height: 1.3;
	padding: 2px 5px;
	color: $wp-gray-0;
}

#adminmenu .wp-submenu a {
	color: $wp-gray-10;
	color: rgba($wp-blue-0, 0.7);
}

#adminmenu .wp-submenu a:hover,
#adminmenu .wp-submenu a:focus {
	background: none;
}

#adminmenu a:hover,
#adminmenu li.menu-top > a:focus,
#adminmenu .wp-submenu a:hover,
#adminmenu .wp-submenu a:focus {
	color: $wp-blue-30;
}

#adminmenu li.menu-top {
	border: none;
	min-height: 34px;
	position: relative;
}

#adminmenu .wp-submenu {
	list-style: none;
	position: absolute;
	top: -1000em;
	left: 160px;
	overflow: visible;
	word-wrap: break-word;
}

#adminmenu .wp-submenu,
.folded #adminmenu a.wp-has-current-submenu:focus + .wp-submenu,
.folded #adminmenu .wp-has-current-submenu .wp-submenu {
	padding: 7px 0 8px;
	z-index: 9999;
	background-color: $wp-gray-80;
	box-shadow: 0 3px 5px rgba($wp-black, 0.2);
}

.js #adminmenu .sub-open,
.js #adminmenu .opensub .wp-submenu,
#adminmenu a.menu-top:focus + .wp-submenu,
.no-js li.wp-has-submenu:hover .wp-submenu {
	top: -1px;
}

#adminmenu .wp-has-current-submenu .wp-submenu,
.no-js li.wp-has-current-submenu:hover .wp-submenu,
#adminmenu a.wp-has-current-submenu:focus + .wp-submenu,
#adminmenu .wp-has-current-submenu .wp-submenu.sub-open,
#adminmenu .wp-has-current-submenu.opensub .wp-submenu {
	position: relative;
	z-index: 3;
	top: auto;
	left: auto;
	right: auto;
	bottom: auto;
	border: 0 none;
	margin-top: 0;
	box-shadow: none;
	background-color: $wp-gray-80;
}

/* ensure that wp-submenu's box shadow doesn't appear on top of the focused menu item's background. */
#adminmenu li.menu-top:hover,
#adminmenu li.opensub > a.menu-top,
#adminmenu li > a.menu-top:focus {
	position: relative;
	background-color: $wp-gray-90;
	color: $wp-blue-30;
}

.folded #adminmenu li.menu-top:hover,
.folded #adminmenu li.opensub > a.menu-top,
.folded #adminmenu li > a.menu-top:focus {
	z-index: 10000;
}

#adminmenu li.wp-has-current-submenu a.wp-has-current-submenu,
#adminmenu li.current a.menu-top,
.folded #adminmenu li.wp-has-current-submenu,
.folded #adminmenu li.current.menu-top,
#adminmenu .wp-menu-arrow,
#adminmenu .wp-has-current-submenu .wp-submenu .wp-submenu-head,
#adminmenu .wp-menu-arrow div {
	background: $wp-blue-50;
	color: $wp-white;
}

.folded #adminmenu .wp-submenu.sub-open,
.folded #adminmenu .opensub .wp-submenu,
.folded #adminmenu .wp-has-current-submenu .wp-submenu.sub-open,
.folded #adminmenu .wp-has-current-submenu.opensub .wp-submenu,
.folded #adminmenu a.menu-top:focus + .wp-submenu,
.folded #adminmenu .wp-has-current-submenu a.menu-top:focus + .wp-submenu,
.no-js.folded #adminmenu .wp-has-submenu:hover .wp-submenu {
	top: 0;
	left: 36px;
}

.folded #adminmenu a.wp-has-current-submenu:focus + .wp-submenu,
.folded #adminmenu .wp-has-current-submenu .wp-submenu {
	position: absolute;
	top: -1000em;
}

#adminmenu .wp-not-current-submenu .wp-submenu,
.folded #adminmenu .wp-has-current-submenu .wp-submenu {
	min-width: 160px;
	width: auto;
}

#adminmenu .wp-submenu a {
	font-size: 13px;
	line-height: 1.4;
	margin: 0;
	padding: 5px 0;
}

#adminmenu .wp-submenu li.current,
#adminmenu .wp-submenu li.current a,
#adminmenu .opensub .wp-submenu li.current a,
#adminmenu a.wp-has-current-submenu:focus + .wp-submenu li.current a,
#adminmenu .wp-submenu li.current a:hover,
#adminmenu .wp-submenu li.current a:focus {
	color: $wp-white;
}

#adminmenu .wp-not-current-submenu li > a,
.folded #adminmenu .wp-has-current-submenu li > a {
	padding-right: 16px;
	padding-left: 14px;
	/* Exclude from the transition the outline for Windows High Contrast mode */
	transition: all .1s ease-in-out, outline 0s;
}

#adminmenu .wp-has-current-submenu ul > li > a,
.folded #adminmenu li.menu-top .wp-submenu > li > a {
	padding: 5px 12px;
}

#adminmenu a.menu-top,
#adminmenu .wp-submenu-head {
	font-size: 14px;
	font-weight: 400;
	line-height: 1.3;
	padding: 0;
}

#adminmenu .wp-submenu-head {
	display: none;
}

.folded #adminmenu .wp-menu-name {
	position: absolute;
	left: -999px;
}

.folded #adminmenu .wp-submenu-head {
	display: block;
}

#adminmenu .wp-submenu li {
	padding: 0;
	margin: 0;
}

#adminmenu .wp-menu-image img {
	padding: 9px 0 0 0;
	opacity: 0.6;
	filter: alpha(opacity=60);
}

#adminmenu div.wp-menu-image.svg {
	background-repeat: no-repeat;
	background-position: center;
	background-size: 20px auto;
}

div.wp-menu-image:before {
	color: $wp-gray-20;
	color: $wp-gray-20;
	padding: 7px 0;
	transition: all .1s ease-in-out;
}

#adminmenu div.wp-menu-image:before {
	color: $wp-gray-20;
	color: $wp-gray-20;
}

#adminmenu li.wp-has-current-submenu:hover div.wp-menu-image:before,
#adminmenu .wp-has-current-submenu div.wp-menu-image:before,
#adminmenu .current div.wp-menu-image:before,
#adminmenu a.wp-has-current-submenu:hover div.wp-menu-image:before,
#adminmenu a.current:hover div.wp-menu-image:before,
#adminmenu li.wp-has-current-submenu a:focus div.wp-menu-image:before,
#adminmenu li.wp-has-current-submenu.opensub div.wp-menu-image:before {
	color: $wp-white;
}

#adminmenu li:hover div.wp-menu-image:before,
#adminmenu li a:focus div.wp-menu-image:before,
#adminmenu li.opensub div.wp-menu-image:before {
	color: $wp-blue-30;
}

/* IE8 doesn't redraw the pseudo elements unless you make a change to the content, this restore the initial color after hover */
.ie8 #adminmenu li.opensub div.wp-menu-image:before {
	color: $wp-gray-20;
}

.folded #adminmenu div.wp-menu-image {
	width: 35px;
	height: 30px;
	position: absolute;
	z-index: 25;
}

.folded #adminmenu a.menu-top {
	height: 34px;
}

/* No @font-face support */
.no-font-face #adminmenu .wp-menu-image {
	display: none;
}

.no-font-face #adminmenu div.wp-menu-name {
	padding: 8px 12px;
}

.no-font-face.auto-fold #adminmenu .wp-menu-name {
	margin-left: 0;
}
/* End no @font-face support */

/* Sticky admin menu */
.sticky-menu #adminmenuwrap {
	position: fixed;
}

/* A new arrow */

.wp-menu-arrow {
	display: none !important;
}

ul#adminmenu a.wp-has-current-submenu {
	position: relative;
}

ul#adminmenu a.wp-has-current-submenu:after,
ul#adminmenu > li.current > a.current:after {
	right: 0;
	border: solid 8px transparent;
	content: " ";
	height: 0;
	width: 0;
	position: absolute;
	pointer-events: none;
	border-right-color: $wp-gray-0;
	top: 50%;
	margin-top: -8px;
}

.folded ul#adminmenu li:hover a.wp-has-current-submenu:after {
	display: none;
}

.folded ul#adminmenu a.wp-has-current-submenu:after,
.folded ul#adminmenu > li a.current:after {
	border-width: 4px;
	margin-top: -4px;
}

#adminmenu li.wp-has-submenu.wp-not-current-submenu.opensub:hover:after {
	border-right-color: $wp-gray-80;
}

#adminmenu li.menu-top:hover .wp-menu-image img,
#adminmenu li.wp-has-current-submenu .wp-menu-image img {
	opacity: 1;
	filter: alpha(opacity=100);
}

#adminmenu li.wp-menu-separator {
	height: 5px;
	padding: 0;
	margin: 0 0 6px 0;
	cursor: inherit;
}

#adminmenu .wp-submenu .wp-submenu-head {
	color: $wp-white;
	font-weight: 400;
	font-size: 14px;
	padding: 8px 4px 8px 11px;
	margin: -7px 0px 4px;
}

/* @todo: consider to use a single rule for these counters and the list table comments counters. */
#adminmenu .awaiting-mod,
#adminmenu .update-plugins {
	display: inline-block;
	vertical-align: top;
	box-sizing: border-box;
	margin: 1px 0 -1px 2px;
	padding: 0 5px;
	min-width: 18px;
	height: 18px;
	border-radius: 9px;
	background-color: $wp-red-50;
	color: $wp-white;
	font-size: 11px;
	line-height: 1.6;
	text-align: center;
	z-index: 26;
}

#adminmenu li.current a .awaiting-mod,
#adminmenu li a.wp-has-current-submenu .update-plugins {
	background-color: $wp-red-50;
	color: $wp-white;
}

#collapse-button {
	display: block;
	width: 100%;
	height: 34px;
	margin: 0;
	border: none;
	padding: 0;
	position: relative;
	overflow: visible;
	background: none;
	color: $wp-gray-20;
	cursor: pointer;
}

#collapse-button:hover {
	color: $wp-blue-30;
}

#collapse-button:focus {
	color: $wp-blue-30;
	/* Only visible in Windows High Contrast mode */
	outline: 1px solid transparent;
	outline-offset: -1px;
}

@media screen and (max-width: 782px) {

	.wp-responsive-open #wpadminbar #wp-admin-bar-menu-toggle a {
		background: $wp-gray-80;
	}

	.wp-responsive-open #wpadminbar #wp-admin-bar-menu-toggle .ab-icon:before {
		color: $wp-blue-30;
	}
}


// dashboard.css

/* Welcome Panel */
.welcome-panel {
	position: relative;
	overflow: auto;
	margin: 16px 0;
	padding: 23px 10px 0;
	border: 1px solid $wp-gray-5;
	box-shadow: 0 1px 1px rgba($wp-black, 0.04);
	background: $wp-white;
	font-size: 13px;
	line-height: 2.1em;
}

.welcome-panel p {
	color: $wp-gray-40;
}

.welcome-panel-column p {
	margin-top: 7px;
	color: $wp-gray-70;
}

/* Welcome Panel and Right Now common Icons style */

.welcome-panel .welcome-icon:before,
#dashboard_right_now li a:before,
#dashboard_right_now li span:before {
	color: $wp-gray-40;
	font: normal 20px/1 dashicons;
	speak: none;
	display: inline-block;
	padding: 0 10px 0 0;
	position: relative;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-decoration: none !important;
	vertical-align: top;
}

/* Dashboard WordPress events */

.community-events li.event-none {
	border-left: 4px solid $wp-blue-30;
}

.community-events ul {
	background-color: $wp-gray-0;
	padding-left: 0;
	padding-right: 0;
	padding-bottom: 0;
}

.community-events li {
	margin: 0;
	padding: 8px 12px;
	color: $wp-gray-80;
}
.community-events li:first-child {
	border-top: 1px solid $wp-gray-0;
}

.community-events li ~ li {
	border-top: 1px solid $wp-gray-0;
}

.community-events .activity-block.last {
	border-bottom: 1px solid $wp-gray-0;
	padding-top: 0;
	margin-top: -1px;
}

.event-icon:before {
	color: $wp-gray-40;
	font-size: 18px;
}

.community-events-footer {
	margin-top: 0;
	margin-bottom: 0;
	padding: 12px;
	border-top: 1px solid $wp-gray-0;
	color: $wp-gray-5;
}

.rssSummary {
	color: $wp-gray-40;
	margin-top: 4px;
}

#dashboard_primary .rss-widget span,
#dashboard_primary .rss-widget span.rss-date {
	color: $wp-gray-40;
}

/* Dashboard right now */

/* Dashboard right now - Colors */

#dashboard_right_now .sub {
	color: $wp-gray-60;
	background: $wp-gray-0;
	border-top: 1px solid $wp-gray-0;
	padding: 10px 12px 6px 12px;
}

#dashboard_right_now .sub h3 {
	color: $wp-gray-60;
}

#dashboard_right_now .sub p {
	margin: 0 0 1em;
}

#dashboard_right_now .warning a:before,
#dashboard_right_now .warning span:before {
	color: $wp-red-50;
}

/* Dashboard Quick Draft */

#dashboard_quick_press .inside {
	margin: 0;
	padding: 0;
}

#dashboard_quick_press div.updated {
	margin-bottom: 10px;
	border: 1px solid $wp-gray-0;
	border-width: 1px 1px 1px 0;
}

#dashboard_quick_press form {
	margin: 12px;
}

#dashboard_quick_press .drafts {
	padding: 10px 0 0;
}

/* Dashboard Quick Draft - Form styling */

#dashboard_quick_press label {
	display: inline-block;
	margin-bottom: 4px;
}

#dashboard_quick_press input,
#dashboard_quick_press textarea {
	box-sizing: border-box;
	margin: 0;
}

#dashboard-widgets .postbox form .submit {
	margin: -39px 0;
	float: right;
}

#description-wrap {
	margin-top: 12px;
}

#quick-press textarea#content {
	min-height: 90px;
	max-height: 1300px;
	margin: 0 0 8px;
	padding: 6px 7px;
	resize: none;
}

/* Dashboard Quick Draft - Drafts list */

.js #dashboard_quick_press .drafts {
	border-top: 1px solid $wp-gray-0;
}

#dashboard_quick_press .drafts abbr {
	border: none;
}

#dashboard_quick_press .drafts .view-all {
	float: right;
	margin: 0 12px 0 0;
}

#dashboard_primary a.rsswidget {
	font-weight: 400;
}

#dashboard_quick_press .drafts ul {
	margin: 0 12px;
}

#dashboard_quick_press .drafts li {
	margin-bottom: 1em;
}
#dashboard_quick_press .drafts li time {
	color: $wp-gray-40;
}

#dashboard_quick_press .drafts p {
	margin: 0;
	word-wrap: break-word;
}

#dashboard_quick_press .draft-title {
	word-wrap: break-word;
}

#dashboard_quick_press .draft-title a,
#dashboard_quick_press .draft-title time {
	margin: 0 5px 0 0;
}

/* Dashboard common styles */

#dashboard-widgets h4, /* Back-compat for pre-4.4 */
#dashboard-widgets h3,
#dashboard_quick_press .drafts h2 {
	margin: 0 12px 8px;
	padding: 0;
	font-size: 14px;
	font-weight: 400;
	color: $wp-gray-90;
}

#dashboard_quick_press .drafts h2 {
	line-height: inherit;
}

#dashboard-widgets .inside h4, /* Back-compat for pre-4.4 */
#dashboard-widgets .inside h3 {
	margin-left: 0;
	margin-right: 0;
}

/* Dashboard activity widget */


#dashboard_activity .no-activity p {
	color: $wp-gray-40;
	font-size: 16px;
}

#dashboard_activity .subsubsub {
	float: none;
	border-top: 1px solid $wp-gray-0;
	margin: 0 -12px;
	padding: 8px 12px 4px;
}

#dashboard_activity .subsubsub a .count,
#dashboard_activity .subsubsub a.current .count {
	color: $wp-gray-40; /* white background on the dashboard but $wp-gray-0 on list tables */
}


#future-posts ul span,
#published-posts ul span {
	display: inline-block;
	margin-right: 5px;
	min-width: 150px;
	color: $wp-gray-40;
}

.activity-block {
	border-bottom: 1px solid $wp-gray-0;
	margin: 0 -12px;
	padding: 8px 12px 4px;
}

.activity-block .subsubsub li {
	color: $wp-gray-5;
}

/* Dashboard activity widget - Comments */
/* @todo: needs serious de-duplication */

#activity-widget #the-comment-list .comment-item {
	background: $wp-gray-0;
	padding: 12px;
	position: relative;
}

#activity-widget #the-comment-list .comment-item:first-child {
	border-top: 1px solid $wp-gray-0;
}

#activity-widget #the-comment-list .unapproved {
	background-color: $wp-gray-0;
}

#activity-widget #the-comment-list .unapproved:before {
	content: "";
	display: block;
	position: absolute;
	left: 0;
	top: 0;
	bottom: 0;
	background: $wp-red-50;
	width: 4px;
}

#activity-widget #the-comment-list .comment,
#activity-widget #the-comment-list .pingback {
	box-shadow: inset 0 1px 0 rgba($wp-black, 0.06);
}

#latest-comments #the-comment-list .comment-meta {
	line-height: 1.5em;
	margin: 0;
	color: $wp-gray-50;
}

.rss-widget span.rss-date {
	color: $wp-gray-40;
	font-size: 13px;
	margin-left: 3px;
}

#dashboard_browser_nag.postbox.browser-insecure {
	background-color: $wp-red-50;
	border-color: $wp-red-50;
}

#dashboard_browser_nag.postbox {
	background-color: $wp-yellow-30;
	background-image: none;
	border-color: $wp-yellow-20;
	color: $wp-white;
	box-shadow: none;
}

#dashboard_browser_nag.postbox.browser-insecure h2 {
	border-bottom-color: $wp-red-40;
	color: $wp-white;
}

#dashboard_browser_nag.postbox h2 {
	border-bottom-color: $wp-yellow-5;
	background: transparent none;
	color: $wp-white;
	box-shadow: none;
}

#dashboard_browser_nag a {
	color: $wp-white;
}

/* PHP Nag */
#dashboard_php_nag .dashicons-warning {
	color: $wp-yellow-30;
	padding-right: 6px;
}

#dashboard_php_nag.php-insecure .dashicons-warning {
	color: $wp-red-50;
}

// list-tables.css

.response-links {
	display: block;
	margin-bottom: 1em;
}

.response-links a {
	display: block;
}

.response-links a.comments-edit-item-link {
	font-weight: 600;
}

.response-links a.comments-view-item-link {
	font-size: 12px;
}

.post-com-count-wrapper strong {
	font-weight: 400;
}

.comments-view-item-link {
	display: inline-block;
	clear: both;
}

.column-response .post-com-count-wrapper,
.column-comments .post-com-count-wrapper {
	white-space: nowrap;
	word-wrap: normal;
}

/* comments bubble common */
.column-response .post-com-count,
.column-comments .post-com-count {
	display: inline-block;
	vertical-align: top;
}

/* comments bubble approved */
.column-response .post-com-count-no-comments,
.column-response .post-com-count-approved,
.column-comments .post-com-count-no-comments,
.column-comments .post-com-count-approved {
	margin-top: 5px;
}

.column-response .comment-count-no-comments,
.column-response .comment-count-approved,
.column-comments .comment-count-no-comments,
.column-comments .comment-count-approved {
	box-sizing: border-box;
	display: block;
	padding: 0 8px;
	min-width: 24px;
	height: 2em;
	border-radius: 5px;
	background-color: $wp-gray-50;
	color: $wp-white;
	font-size: 11px;
	line-height: 21px;
	text-align: center;
}

.ie8 .column-response .comment-count-no-comments,
.ie8 .column-response .comment-count-approved,
.ie8 .column-comments .comment-count-no-comments,
.ie8 .column-comments .comment-count-approved {
	min-width: 0;
}

.column-response .post-com-count-no-comments:after,
.column-response .post-com-count-approved:after,
.column-comments .post-com-count-no-comments:after,
.column-comments .post-com-count-approved:after {
	content: "";
	display: block;
	margin-left: 8px;
	width: 0;
	height: 0;
	border-top: 5px solid $wp-gray-50;
	border-right: 5px solid transparent;
}

.column-response .post-com-count-approved:hover .comment-count-approved,
.column-response .post-com-count-approved:focus .comment-count-approved,
.column-comments .post-com-count-approved:hover .comment-count-approved,
.column-comments .post-com-count-approved:focus .comment-count-approved {
	background: $wp-blue-50;
}

.column-response .post-com-count-approved:hover:after,
.column-response .post-com-count-approved:focus:after,
.column-comments .post-com-count-approved:hover:after,
.column-comments .post-com-count-approved:focus:after {
	border-top-color: $wp-blue-50;
}

/* @todo: consider to use a single rule for these counters and the admin menu counters. */
.column-response .post-com-count-pending,
.column-comments .post-com-count-pending {
	position: relative;
	left: -3px;
	padding: 0 5px;
	min-width: 7px;
	height: 17px;
	border: 2px solid $wp-white;
	border-radius: 11px;
	background: $wp-red-50;
	color: $wp-white;
	font-size: 9px;
	line-height: 17px;
	text-align: center;
}

.column-response .post-com-count-no-pending,
.column-comments .post-com-count-no-pending {
	display: none;
}

/* comments */

.commentlist li {
	padding: 1em 1em .2em;
	margin: 0;
	border-bottom: 1px solid $wp-gray-10;
}

.commentlist li li {
	border-bottom: 0;
	padding: 0;
}

.commentlist p {
	padding: 0;
	margin: 0 0 .8em;
}

#submitted-on,
.submitted-on {
	color: $wp-gray-60;
}

/* reply to comments */
#replyrow td {
	padding: 2px;
}

#replysubmit {
	margin: 0;
	padding: 5px 7px 10px;
	overflow: hidden;
}

#replysubmit .reply-submit-buttons {
	margin-bottom: 0;
}

#replysubmit .button {
	margin-right: 5px;
}

#replysubmit .spinner {
	float: none;
	margin: -4px 0 0;
}

#replyrow.inline-edit-row fieldset.comment-reply {
	font-size: inherit;
	line-height: inherit;
}

#replyrow legend {
	margin: 0;
	padding: .2em 5px 0;
	font-size: 13px;
	line-height: 1.4;
	font-weight: 600;
}

#replyrow.inline-edit-row label {
	display: inline;
	vertical-align: baseline;
	line-height: inherit;
}

#edithead .inside,
#commentsdiv #edithead .inside {
	float: left;
	padding: 3px 0 2px 5px;
	margin: 0;
	text-align: center;
}

#edithead .inside input {
	width: 180px;
}

#edithead label {
	padding: 2px 0;
}

#replycontainer {
	padding: 5px;
}

#replycontent {
	height: 120px;
	box-shadow: none;
}

#replyerror {
	border-color: $wp-gray-5;
	background-color: $wp-gray-0;
}

/* @todo: is this used? */
.commentlist .avatar {
	vertical-align: text-top;
}

#the-comment-list tr.undo,
#the-comment-list div.undo {
	background-color: $wp-gray-0;
}

#the-comment-list .unapproved th,
#the-comment-list .unapproved td {
	background-color: $wp-gray-0;
}

#the-comment-list .unapproved th.check-column {
	border-left: 4px solid $wp-red-50;
}

#the-comment-list .unapproved th.check-column input {
	margin-left: 4px;
}

#the-comment-list .approve a {
	color: $wp-green-70;
}

#the-comment-list .unapprove a {
	color: $wp-yellow-50;
}

#the-comment-list th,
#the-comment-list td {
	box-shadow: inset 0 -1px 0 rgba($wp-black, 0.1);
}

#the-comment-list tr:last-child th,
#the-comment-list tr:last-child td {
	box-shadow: none;
}

#the-comment-list tr.unapproved + tr.approved th,
#the-comment-list tr.unapproved + tr.approved td {
	border-top: 1px solid rgba($wp-black, 0.03);
}

/* table vim shortcuts */
.vim-current,
.vim-current th,
.vim-current td {
	background-color: $wp-blue-0 !important;
}

th .comment-grey-bubble {
	height: 16px;
	width: 16px;
}

th .comment-grey-bubble:before {
	content: "\f101";
	font: normal 20px/.5 dashicons;
	speak: none;
	display: inline-block;
	padding: 0;
	top: 4px;
	left: -4px;
	position: relative;
	vertical-align: top;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-decoration: none !important;
	color: $wp-gray-70;
}

/*------------------------------------------------------------------------------
  10.0 - List Posts (/Pages/etc)
------------------------------------------------------------------------------*/

table.fixed {
	table-layout: fixed;
}

.fixed .column-rating,
.fixed .column-visible {
	width: 8%;
}

.fixed .column-posts,
.fixed .column-date,
.fixed .column-parent,
.fixed .column-links,
.fixed .column-author,
.fixed .column-format {
	width: 10%;
}

.fixed .column-posts {
	width: 74px;
}

.fixed .column-comment .comment-author {
	display: none;
}

.fixed .column-response,
.fixed .column-categories,
.fixed .column-tags,
.fixed .column-rel,
.fixed .column-role {
	width: 15%;
}

.fixed .column-slug {
	width: 25%;
}

.fixed .column-locations {
	width: 35%;
}

.fixed .column-comments {
	width: 5.5em;
	padding: 8px 0;
	text-align: left;
}

.fixed .column-comments .vers {
	padding-left: 3px;
}

td.column-title strong,
td.plugin-title strong {
	display: block;
	margin-bottom: .2em;
	font-size: 14px;
}

td.column-title p,
td.plugin-title p {
	margin: 6px 0;
}

/* Media file column */
table.media .column-title .media-icon {
	float: left;
	min-height: 60px;
	margin: 0 9px 0 0;
}

table.media .column-title .media-icon img {
	max-width: 60px;
	height: auto;
	vertical-align: top; /* Remove descender white-space. */
}

table.media .column-title .has-media-icon ~ .row-actions {
	margin-left: 70px; /* 60px image + margin */
}

table.media .column-title .filename {
	margin-bottom: 0.2em;
}

/* @todo: pick a consistent list table selector */
.wp-list-table a {
	transition: none;
}

#the-list tr:last-child td,
#the-list tr:last-child th {
	border-bottom: none !important;
	box-shadow: none;
}

#comments-form .fixed .column-author {
	width: 20%;
}

#comments-form .fixed .column-date {
	width: 14%;
}

#commentsdiv.postbox .inside {
	margin: 0;
	padding: 0;
}

#commentsdiv .inside .row-actions {
	line-height: 18px;
}

#commentsdiv .inside .column-author {
	width: 25%;
}

#commentsdiv .column-comment p {
	margin: 0.6em 0;
	padding: 0;
}

#commentsdiv #replyrow td {
	padding: 0;
}

#commentsdiv p {
	padding: 8px 10px;
	margin: 0;
}

#commentsdiv .comments-box {
	border: 0 none;
}

#commentsdiv .comments-box thead th,
#commentsdiv .comments-box thead td {
	background: transparent;
	padding: 0 7px 4px;
	font-style: italic;
}

#commentsdiv .comments-box tr:last-child td {
	border-bottom: 0 none;
}

#commentsdiv #edithead .inside input {
	width: 160px;
}

.sorting-indicator {
	display: block;
	visibility: hidden;
	width: 10px;
	height: 4px;
	margin-top: 8px;
	margin-left: 7px;
}

.sorting-indicator:before {
	content: "\f142";
	font: normal 20px/1 dashicons;
	speak: none;
	display: inline-block;
	padding: 0;
	top: -4px;
	left: -8px;
	color: $wp-gray-70;
	line-height: 10px;
	position: relative;
	vertical-align: top;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-decoration: none !important;
	color: $wp-gray-70;
}

.column-comments .sorting-indicator:before {
	top: 0;
	left: -10px;
}

th.sorted.asc .sorting-indicator:before,
th.desc:hover span.sorting-indicator:before,
th.desc a:focus span.sorting-indicator:before {
	content: "\f142";
}

th.sorted.desc .sorting-indicator:before,
th.asc:hover span.sorting-indicator:before,
th.asc a:focus span.sorting-indicator:before {
	content: "\f140";
}

.wp-list-table .toggle-row {
	position: absolute;
	right: 8px;
	top: 10px;
	display: none;
	padding: 0;
	width: 40px;
	height: 40px;
	border: none;
	outline: none;
	background: transparent;
}

.wp-list-table .toggle-row:hover {
	cursor: pointer;
}

.wp-list-table .toggle-row:focus:before {
	box-shadow:
		0 0 0 1px $wp-blue-30,
		0 0 2px 1px rgba($wp-blue-40, 0.8);
}

.ie8 .wp-list-table .toggle-row:focus:before {
	outline: $wp-blue-30 solid 1px;
}

.wp-list-table .toggle-row:active {
	box-shadow: none;
}

.wp-list-table .toggle-row:before {
	position: absolute;
	top: -5px;
	left: 10px;
	border-radius: 50%;
	display: block;
	padding: 1px 2px 1px 0;
	color: $wp-gray-70; /* same as table headers sort arrows */
	content: "\f140";
	font: normal 20px/1 dashicons;
	line-height: 1;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	speak: none;
}

.wp-list-table .is-expanded .toggle-row:before {
	content: "\f142";
}

tr.wp-locked .locked-indicator {
	margin-left: 6px;
	height: 20px;
	width: 16px;
}

tr.wp-locked .locked-indicator-icon:before {
	color: $wp-gray-40;
	content: "\f160";
	display: inline-block;
	font: normal 20px/1 dashicons;
	speak: none;
	vertical-align: middle;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

tr.wp-locked .check-column label,
tr.wp-locked .check-column input[type="checkbox"],
tr.wp-locked .row-actions .inline,
tr.wp-locked .row-actions .trash {
	display: none;
}

tr .locked-info {
	height: 0;
	opacity: 0;
}

tr.wp-locked .locked-info {
	margin-top: 4px;
	height: auto;
	opacity: 1;
}

.locked-text {
	vertical-align: top;
}

tr.locked-info, tr.wp-locked .locked-info {
	transition: height 1s, opacity 0.5s;
}

.fixed .column-comments .sorting-indicator {
	margin-top: 3px;
}

#menu-locations-wrap .widefat {
	width: 60%;
}

.widefat th.sortable,
.widefat th.sorted {
	padding: 0;
}

th.sortable a,
th.sorted a {
	display: block;
	overflow: hidden;
	padding: 8px;
}

.fixed .column-comments.sortable a,
.fixed .column-comments.sorted a {
	padding: 8px 0;
}

th.sortable a span,
th.sorted a span {
	float: left;
	cursor: pointer;
}

th.sorted .sorting-indicator,
th.desc:hover span.sorting-indicator,
th.desc a:focus span.sorting-indicator,
th.asc:hover span.sorting-indicator,
th.asc a:focus span.sorting-indicator {
	visibility: visible;
}

.tablenav-pages .current-page {
	margin: 0 2px 0 0;
	padding-top: 5px;
	padding-bottom: 5px;
	font-size: 13px;
	text-align: center;
}

.tablenav .total-pages {
	margin-right: 2px;
}

.tablenav #table-paging {
	margin-left: 2px;
}

.tablenav {
	clear: both;
	height: 30px;
	margin: 6px 0 4px;
	vertical-align: middle;
}

.tablenav.themes {
	max-width: 98%;
}

.tablenav .tablenav-pages {
	float: right;
	margin: 3px 0 9px;
}

.tablenav .no-pages,
.tablenav .one-page .pagination-links {
	display: none;
}

.tablenav .tablenav-pages .button,
.tablenav .tablenav-pages .tablenav-pages-navspan {
	display: inline-block;
	vertical-align: baseline;
	min-width: 28px;
	min-height: 28px;
	margin: 0;
	padding: 0 4px;
	font-size: 16px;
	line-height: 1.5;
	text-align: center;
}

.tablenav .displaying-num {
	margin-right: 7px;
}

.tablenav .one-page .displaying-num {
	display: inline-block;
	margin: 5px 0;
}

.tablenav .actions {
	overflow: hidden;
	padding: 2px 8px 0 0;
}

.wp-filter .actions {
	display: inline-block;
	vertical-align: middle;
}

.tablenav .delete {
	margin-right: 20px;
}

/* This view-switcher is still used on multisite. */
.tablenav .view-switch {
	float: right;
	margin: 0 5px;
	padding-top: 3px;
}

.wp-filter .view-switch {
	display: inline-block;
	vertical-align: middle;
	padding: 12px 0;
	margin: 0 8px 0 2px;
}

.media-toolbar.wp-filter .view-switch {
	margin: 0 12px 0 2px;
}

.view-switch a {
	float: left;
	width: 28px;
	height: 28px;
	text-align: center;
	line-height: 24px;
	text-decoration: none;
}

.view-switch a:before {
	color: $wp-gray-10;
	display: inline-block;
	font: normal 20px/1 dashicons;
	speak: none;
	vertical-align: middle;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

.view-switch a:hover:before,
.view-switch a:focus:before {
	color: $wp-gray-50;
}

.view-switch a.current:before {
	color: $wp-blue-50;
}

.view-switch .view-list:before {
	content: "\f163";
}

.view-switch .view-excerpt:before {
	content: "\f164";
}

.view-switch .view-grid:before {
	content: "\f509";
}

.filter {
	float: left;
	margin: -5px 0 0 10px;
}

.filter .subsubsub {
	margin-left: -10px;
	margin-top: 13px;
}
.screen-per-page {
	width: 4em;
}

#posts-filter .wp-filter {
	margin-bottom: 0;
}

#posts-filter fieldset {
	float: left;
	margin: 0 1.5ex 1em 0;
	padding: 0;
}

#posts-filter fieldset legend {
	padding: 0 0 .2em 1px;
}

p.pagenav {
	margin: 0;
	display: inline;
}

.pagenav span {
	font-weight: 600;
	margin: 0 6px;
}

.row-title {
	font-size: 14px !important;
	font-weight: 600;
}

.column-comment .comment-author {
	margin-bottom: 0.6em;
}

.column-author img,
.column-username img,
.column-comment .comment-author img {
	float: left;
	margin-right: 10px;
	margin-top: 1px;
}

.row-actions {
	color: $wp-gray-5;
	font-size: 13px;
	padding: 2px 0 0;
	position: relative;
	left: -9999em;
}

/* ticket #34150 */
.rtl .row-actions a {
	display: inline-block;
}

.row-actions .network_only,
.row-actions .network_active {
	color: $wp-black;
}

.no-js .row-actions,
tr:hover .row-actions,
.mobile .row-actions,
.row-actions.visible,
.comment-item:hover .row-actions {
	position: static;
}

/* deprecated */
.row-actions-visible {
	padding: 2px 0 0;
}


/*------------------------------------------------------------------------------
  10.1 - Inline Editing
------------------------------------------------------------------------------*/

/*
.quick-edit* is for Quick Edit
.bulk-edit* is for Bulk Edit
.inline-edit* is for everything
*/

/*	Layout */

#wpbody-content .inline-edit-row fieldset {
	font-size: 12px;
	float: left;
	margin: 0;
	padding: 0;
	width: 100%;
}

tr.inline-edit-row td,
#wpbody-content .inline-edit-row fieldset .inline-edit-col {
	padding: 0 0.5em;
}

#wpbody-content .quick-edit-row-post .inline-edit-col-left {
	width: 40%;
}

#wpbody-content .quick-edit-row-post .inline-edit-col-right {
	width: 39%;
}

#wpbody-content .inline-edit-row-post .inline-edit-col-center {
	width: 20%;
}

#wpbody-content .quick-edit-row-page .inline-edit-col-left {
	width: 50%;
}

#wpbody-content .quick-edit-row-page .inline-edit-col-right,
#wpbody-content .bulk-edit-row-post .inline-edit-col-right {
	width: 49%;
}

#wpbody-content .bulk-edit-row .inline-edit-col-left {
	width: 30%;
}

#wpbody-content .bulk-edit-row-page .inline-edit-col-right {
	width: 69%;
}

#wpbody-content .bulk-edit-row .inline-edit-col-bottom {
	float: right;
	width: 69%;
}

#wpbody-content .inline-edit-row-page .inline-edit-col-right {
	margin-top: 27px;
}

.inline-edit-row fieldset .inline-edit-group {
	clear: both;
	line-height: 2.5;
}

.inline-edit-row .submit {
	clear: both;
	padding: 0.5em;
	margin: 0.5em 0 0;
}

.inline-edit-row .notice-error {
	margin-top: 1em;
}

.inline-edit-row .notice-error .error {
	margin: 0.5em 0;
	padding: 2px;
}

/*	Positioning */

/* Needs higher specificity for the padding */
#the-list .inline-edit-row .inline-edit-legend {
	margin: 0;
	padding: 0.2em 0.5em 0;
	line-height: 2.5;
	font-weight: 600;
}

#the-list #bulk-edit.inline-edit-row .inline-edit-legend {
	padding: 0.2em 0.5em;
}

.inline-edit-row fieldset span.title,
.inline-edit-row fieldset span.checkbox-title {
	margin: 0;
	padding: 0;
}

.inline-edit-row fieldset label,
.inline-edit-row fieldset span.inline-edit-categories-label {
	display: block;
	margin: .2em 0;
	line-height: 2.5;
}

.inline-edit-row fieldset.inline-edit-date label {
	display: inline-block;
	margin: 0;
	line-height: 1.5;
	vertical-align: baseline;
}

.inline-edit-row fieldset label.inline-edit-tags {
	margin-top: 0;
}

.inline-edit-row fieldset label.inline-edit-tags span.title {
	margin: .2em 0;
	width: auto;
}

.inline-edit-row fieldset label span.title,
.inline-edit-row fieldset.inline-edit-date legend {
	display: block;
	float: left;
	width: 6em;
	line-height: 2.5;
}

#posts-filter fieldset.inline-edit-date legend {
	padding: 0;
}

.inline-edit-row fieldset.inline-edit-date select {
	margin: 1px;
	line-height: 28px;
}

.inline-edit-row fieldset label span.input-text-wrap,
.inline-edit-row fieldset .timestamp-wrap {
	display: block;
	margin-left: 6em;
}

.quick-edit-row-post fieldset.inline-edit-col-right label span.title {
	width: auto;
	padding-right: 0.5em;
}

.inline-edit-row .inline-edit-or {
	margin: .2em 6px .2em 0;
	line-height: 2.5;
}

.inline-edit-row .input-text-wrap input[type=text] {
	width: 100%;
}

.inline-edit-row fieldset label input[type=checkbox] {
	vertical-align: middle;
}

.inline-edit-row fieldset label textarea {
	width: 100%;
	height: 4em;
	vertical-align: top;
}

#wpbody-content .bulk-edit-row fieldset .inline-edit-group label {
	max-width: 50%;
}

#wpbody-content .quick-edit-row fieldset .inline-edit-group label.alignleft:first-child {
	margin-right: 0.5em
}

.inline-edit-col-right .input-text-wrap input.inline-edit-menu-order-input {
	width: 6em;
}

/*	Styling */
.inline-edit-row .inline-edit-legend {
	text-transform: uppercase;
}

.inline-edit-row fieldset span.title,
.inline-edit-row fieldset span.checkbox-title {
	font-style: italic;
}

/*	Specific Elements */
.inline-edit-row fieldset .inline-edit-date {
	float: left;
}

.inline-edit-row fieldset input[name=jj],
.inline-edit-row fieldset input[name=hh],
.inline-edit-row fieldset input[name=mn] {
	font-size: 12px;
	width: 2.3em;
}

.inline-edit-row fieldset input[name=aa] {
	font-size: 12px;
	width: 3.5em;
}

.inline-edit-row fieldset label input.inline-edit-password-input {
	width: 8em;
}

ul.cat-checklist {
	height: 12em;
	border: solid 1px $wp-gray-5;
	overflow-y: scroll;
	padding: 0 5px;
	margin: 0;
	background-color: $wp-white;
}

#bulk-titles {
	display: block;
	height: 12em;
	border: 1px solid $wp-gray-5;
	overflow-y: scroll;
	padding: 0 5px;
	margin: 0 0 5px;
}

.inline-edit-row fieldset ul.cat-checklist li,
.inline-edit-row fieldset ul.cat-checklist input {
	margin: 0;
	position: relative; /* RTL fix, #WP27629 */
}

.inline-edit-row fieldset ul.cat-checklist label,
.inline-edit-row #bulk-titles div {
	font-style: normal;
	font-size: 11px;
}

.inline-edit-row fieldset label input.inline-edit-menu-order-input {
	width: 3em;
}

.inline-edit-row fieldset label input.inline-edit-slug-input {
	width: 75%;
}

.inline-edit-row #post_parent,
.inline-edit-row select[name="page_template"] {
	max-width: 80%;
}

.ie8 .inline-edit-row #post_parent,
.ie8 .inline-edit-row select[name="page_template"] {
	width: 250px;
}

.quick-edit-row-post fieldset label.inline-edit-status {
	float: left;
}

#bulk-titles {
	line-height: 140%;
}
#bulk-titles div {
	margin: 0.2em 0.3em;
}

#bulk-titles div a {
	cursor: pointer;
	display: block;
	float: left;
	height: 18px;
	margin: 0 3px 0 -2px;
	overflow: hidden;
	position: relative;
	width: 20px;
}

#bulk-titles div a:before {
	position: relative;
	top: -3px;
}

/*------------------------------------------------------------------------------
  17.0 - Plugins
------------------------------------------------------------------------------*/

.plugins tbody th.check-column,
.plugins tbody {
	padding: 8px 0 0 2px;
}

.plugins tbody th.check-column input[type=checkbox] {
	margin-top: 4px;
}

.updates-table .plugin-title p {
	margin-top: 0;
}

.plugins thead td.check-column,
.plugins tfoot td.check-column,
.plugins .inactive th.check-column {
	padding-left: 6px;
}

.plugins,
.plugins th,
.plugins td {
	color: $wp-black;
}

.plugins tr {
	background: $wp-white;
}

.plugins p {
	margin: 0 4px;
	padding: 0;
}

.plugins .desc p {
	margin: 0 0 8px;
}

.plugins td.desc {
	line-height: 1.5em;
}

.plugins .desc ul,
.plugins .desc ol {
	margin: 0 0 0 2em;
}

.plugins .desc ul {
	list-style-type: disc;
}

.plugins .row-actions {
	font-size: 13px;
	padding: 0;
}

.plugins .inactive td,
.plugins .inactive th,
.plugins .active td,
.plugins .active th {
	padding: 10px 9px;
}

.plugins .active td,
.plugins .active th {
	background-color: $wp-blue-0;
}

.plugins .update th,
.plugins .update td {
	border-bottom: 0;
}

.plugins .inactive td,
.plugins .inactive th,
.plugins .active td,
.plugins .active th,
.plugin-install #the-list td,
.upgrade .plugins td,
.upgrade .plugins th {
	box-shadow: inset 0 -1px 0 rgba($wp-black, 0.1);
}

.plugins tr.active.plugin-update-tr + tr.inactive th,
.plugins tr.active.plugin-update-tr + tr.inactive td,
.plugins tr.active + tr.inactive th,
.plugins tr.active + tr.inactive td {
	border-top: 1px solid rgba($wp-black, 0.03);
	box-shadow: inset 0 1px 0 rgba($wp-black, 0.02), inset 0 -1px 0 $wp-gray-5;
}

.plugins .update td,
.plugins .update th,
.upgrade .plugins tr:last-of-type td,
.upgrade .plugins tr:last-of-type th,
.plugins tr.active + tr.inactive.update th,
.plugins tr.active + tr.inactive.update td,
.plugins .updated td,
.plugins .updated th,
.plugins tr.active + tr.inactive.updated th,
.plugins tr.active + tr.inactive.updated td {
	box-shadow: none;
}

.plugins .active th.check-column,
.plugin-update-tr.active td {
	border-left: 4px solid $wp-blue-30;
}

.wp-list-table.plugins .plugin-title,
.wp-list-table.plugins .theme-title {
	padding-right: 12px;
	white-space: nowrap;
}

.plugins .plugin-title img,
.plugins .plugin-title .dashicons {
	float: left;
	padding: 0 10px 0 0;
	width: 64px;
	height: 64px;
}

.plugins .plugin-title .dashicons:before {
	padding: 2px;
	background-color: $wp-gray-0;
	box-shadow: inset 0 0 10px rgba($wp-gray-20, 0.15);
	font-size: 60px;
	color: $wp-gray-10;
}

#update-themes-table .plugin-title img,
#update-themes-table .plugin-title .dashicons {
	width: 85px;
}

.plugins .inactive .plugin-title strong {
	font-weight: 400;
}

.plugins .second,
.plugins .row-actions {
	padding: 0 0 5px;
}

.plugins .update .second,
.plugins .update .row-actions,
.plugins .updated .second,
.plugins .updated .row-actions {
	padding-bottom: 0;
}

.plugins-php .widefat tfoot th,
.plugins-php .widefat tfoot td {
	border-top-style: solid;
	border-top-width: 1px;
}

.plugins .plugin-update-tr .plugin-update {
	box-shadow: inset 0 -1px 0 rgba($wp-black, 0.1);
	overflow: hidden; /* clearfix */
	padding: 0;
}

.plugins .plugin-update-tr .notice,
.plugins .plugin-update-tr div[class="update-message"] { /* back-compat for pre-4.6 */
	margin: 5px 20px 15px 40px;
}

.plugins .notice p {
	margin: 0.5em 0;
}

.plugins .plugin-description a,
.plugins .plugin-update a,
.updates-table .plugin-title a {
	text-decoration: underline;
}

.plugins tr.paused th.check-column {
	border-left: 4px solid $wp-red-50;
}

.plugins tr.paused th,
.plugins tr.paused td {
	background-color: $wp-gray-0;
}

.plugins tr.paused .plugin-title,
.plugins .paused .dashicons-warning {
	color: $wp-red-50;
}

.plugins .paused .error-display p,
.plugins .paused .error-display code {
	font-size: 90%;
	font-style: italic;
	color: rgba( $wp-black, 0.7 );
}

.plugins .resume-link {
	color: $wp-red-50;
}

.plugin-card .update-now:before {
	color: $wp-yellow-50;
	content: "\f463";
	display: inline-block;
	font: normal 20px/1 dashicons;
	margin: 3px 5px 0 -2px;
	speak: none;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	vertical-align: top;
}

.plugin-card .updating-message:before {
	content: "\f463";
	animation: rotation 2s infinite linear;
}

@keyframes rotation {
	0% {
		transform: rotate(0deg);
	}
	100% {
		transform: rotate(359deg);
	}
}

.plugin-card .updated-message:before {
	color: $wp-green-20;
	content: "\f147";
}

.plugin-install-php h2 {
	clear: both;
}

.plugin-install-php h3 {
	margin: 2.5em 0 8px;
}

.plugin-install-php .wp-filter {
	margin-bottom: 0;
}

/* Plugin card table view */
.plugin-group {
	overflow: hidden; /* clearfix */
	margin-top: 1.5em;
}

.plugin-group h3 {
	margin-top: 0;
}

.plugin-card {
	float: left;
	margin: 0 8px 16px;
	width: 48.5%;
	width: calc( 50% - 8px );
	background-color: $wp-white;
	border: 1px solid $wp-gray-5;
	box-sizing: border-box;
}

.plugin-card:nth-child(odd) {
	clear: both;
	margin-left: 0;
}

.plugin-card:nth-child(even) {
	margin-right: 0;
}

@media screen and (min-width: 1600px) and ( max-width: 2299px ) {
	.plugin-card {
		width: 30%;
		width: calc( 33.1% - 8px );
	}

	.plugin-card:nth-child(odd) {
		clear: none;
		margin-left: 8px;
	}

	.plugin-card:nth-child(even) {
		margin-right: 8px;
	}

	.plugin-card:nth-child(3n+1) {
		clear: both;
		margin-left: 0;
	}

	.plugin-card:nth-child(3n) {
		margin-right: 0;
	}
}

@media screen and (min-width: 2300px) {
	.plugin-card {
		width: 25%;
		width: calc( 25% - 12px );
	}

	.plugin-card:nth-child(odd) {
		clear: none;
		margin-left: 8px;
	}

	.plugin-card:nth-child(even) {
		margin-right: 8px;
	}

	.plugin-card:nth-child(4n+1) {
		clear: both;
		margin-left: 0;
	}

	.plugin-card:nth-child(4n) {
		margin-right: 0;
	}
}

.plugin-card-top {
	position: relative;
	padding: 20px 20px 10px;
	min-height: 135px;
}

div.action-links,
.plugin-action-buttons {
	margin: 0; /* Override existing margins */
}

.plugin-card h3 {
	margin: 0 0 12px;
	font-size: 18px;
	line-height: 1.3;
}

.plugin-card .name,
.plugin-card .desc {
	margin-left: 148px; /* icon + margin */
	margin-right: 120px; /* action links */
}

.plugin-card .action-links {
	position: absolute;
	top: 20px;
	right: 20px;
	width: 120px;
}

.plugin-action-buttons {
	clear: right;
	float: right;
	margin-left: 2em;
	margin-bottom: 1em;
	text-align: right;
}

.plugin-action-buttons li {
	margin-bottom: 10px;
}

.plugin-card-bottom {
	clear: both;
	padding: 12px 20px;
	background-color: $wp-gray-0;
	border-top: 1px solid $wp-gray-5;
	overflow: hidden;
}

.plugin-card-bottom .star-rating {
	display: inline;
}

.plugin-card-update-failed .update-now {
	font-weight: 600;
}

.plugin-card-update-failed .notice-error {
	margin: 0;
	padding-left: 16px;
	box-shadow: 0 -1px 0 $wp-gray-5;
}

.plugin-card-update-failed .plugin-card-bottom {
	display: none;
}

.plugin-card .column-rating {
	line-height: 23px;
}

.plugin-card .column-rating,
.plugin-card .column-updated {
	margin-bottom: 4px;
}

.plugin-card .column-rating,
.plugin-card .column-downloaded {
	float: left;
	clear: left;
	max-width: 180px;
}

.plugin-card .column-updated,
.plugin-card .column-compatibility {
	text-align: right;
	float: right;
	clear: right;
	width: 65%;
	width: calc( 100% - 180px );
}

.plugin-card .column-compatibility span:before {
	font: normal 20px/.5 dashicons;
	speak: none;
	display: inline-block;
	padding: 0;
	top: 4px;
	left: -2px;
	position: relative;
	vertical-align: top;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	text-decoration: none !important;
	color: $wp-gray-70;
}

.plugin-card .column-compatibility .compatibility-incompatible:before {
	content: "\f158";
	color: $wp-red-50;
}

.plugin-card .column-compatibility .compatibility-compatible:before {
	content: "\f147";
	color: $wp-green-30;
}

.plugin-card .notice {
	margin: 20px 20px 0 20px;
}

.plugin-icon {
	position: absolute;
	top: 20px;
	left: 20px;
	width: 128px;
	height: 128px;
	margin: 0 20px 20px 0;
}

.no-plugin-results {
	color: $wp-gray-50; /* same as no themes and no media */
	font-size: 18px;
	font-style: normal;
	margin: 0;
	padding: 100px 0 0;
	text-align: center;
}

/* ms */
/* Background Color for Site Status */
.wp-list-table .site-deleted,
.wp-list-table tr.site-deleted {
	background: $wp-red-20;
}
.wp-list-table .site-spammed,
.wp-list-table tr.site-spammed {
	background: $wp-red-10;
}
.wp-list-table .site-archived,
.wp-list-table tr.site-archived {
	background: $wp-orange-0;
}
.wp-list-table .site-mature,
.wp-list-table tr.site-mature {
	background: $wp-red-5;
}

.sites.fixed .column-lastupdated,
.sites.fixed .column-registered {
	width: 20%;
}

.sites.fixed .column-users {
	width: 80px;
}

/* =Media Queries
-------------------------------------------------------------- */

@media screen and (max-width: 1100px) and (min-width: 782px), (max-width: 480px) {
	.plugin-card .action-links {
		position: static;
		margin-left: 148px;
		width: auto;
	}

	.plugin-action-buttons {
		float: none;
		margin: 1em 0 0;
		text-align: left;
	}

	.plugin-action-buttons li {
		display: inline-block;
		vertical-align: middle;
	}

	.plugin-action-buttons li .button {
		margin-right: 20px;
	}

	.plugin-card .name,
	.plugin-card .desc {
		margin-right: 0;
	}

	.plugin-card .desc p:first-of-type {
		margin-top: 0;
	}

	.fixed .column-date {
		width: 14%;
	}
}

@media screen and (max-width: 782px) {
	/* WP List Table Options & Filters */
	.tablenav {
		height: auto;
	}

	.tablenav.top {
		margin: 20px 0 5px 0;
	}

	.tablenav.bottom {
		position: relative;
		margin-top: 15px;
	}

	.tablenav br {
		display: none;
	}

	.tablenav br.clear {
		display: block;
	}

	.tablenav.top .actions,
	.tablenav .view-switch {
		display: none;
	}

	.view-switch a {
		width: 36px;
		height: 36px;
		line-height: 33px;
	}

	/* Pagination */
	.tablenav.top .displaying-num {
		display: none;
	}

	.tablenav.bottom .displaying-num {
		position: absolute;
		right: 0;
		top: 11px;
		margin: 0;
		font-size: 14px;
	}

	.tablenav .tablenav-pages {
		width: 100%;
		text-align: center;
		margin: 0 0 25px;
	}

	.tablenav.bottom .tablenav-pages {
		margin-top: 25px;
	}

	.tablenav.top .tablenav-pages.one-page {
		display: none;
	}

	.tablenav.bottom .tablenav-pages.one-page {
		margin: 15px 0 0 0;
		height: 0;
	}

	.tablenav-pages .pagination-links {
		font-size: 16px;
	}

	.tablenav .tablenav-pages .button,
	.tablenav .tablenav-pages .tablenav-pages-navspan {
		min-width: 44px;
		padding: 12px 8px;
		font-size: 18px;
		line-height: 1;
	}

	.tablenav-pages .pagination-links .current-page {
		min-width: 44px;
		padding: 12px 6px;
		font-size: 16px;
		line-height: 18px;
	}

	/* WP List Table Adjustments: General */
	.form-wrap > p {
		display: none;
	}

	.comment-count {
		font-size: 14px;
	}

	.wp-list-table th.column-primary ~ th,
	.wp-list-table tr:not(.inline-edit-row):not(.no-items) td.column-primary ~ td:not(.check-column) {
		display: none;
	}

	.wp-list-table thead th.column-primary {
		width: 100%;
	}

	/* Checkboxes need to show */
	.wp-list-table tr th.check-column {
		display: table-cell;
		width: 35px;
	}

	.wp-list-table .column-primary .toggle-row {
		display: block;
	}

	.wp-list-table tr:not(.inline-edit-row):not(.no-items) td:not(.check-column) {
		position: relative;
		clear: both;
		display: block;
		width: auto !important; /* needs to override some columns that are more specifically targeted */
	}

	.wp-list-table td.column-primary {
		padding-right: 50px; /* space for toggle button */
	}

	.wp-list-table tr:not(.inline-edit-row):not(.no-items) td.column-primary ~ td:not(.check-column) {
		padding: 3px 8px 3px 35%;
	}

	.wp-list-table tr:not(.inline-edit-row):not(.no-items) td:not(.column-primary)::before {
		position: absolute;
		left: 10px; /* match padding of regular table cell */
		display: block;
		overflow: hidden;
		width: 32%; /* leave a little space for a gutter */
		content: attr(data-colname);
		white-space: nowrap;
		text-overflow: ellipsis;
	}

	.wp-list-table .is-expanded td:not(.hidden) {
		display: block !important;
		overflow: hidden; /* clearfix */
	}

	/* Special cases */
	.widefat .num,
	.column-posts {
		text-align: left;
	}

	#comments-form .fixed .column-author,
	#commentsdiv .fixed .column-author {
		display: none !important;
	}

	.fixed .column-comment .comment-author {
		display: block;
	}

	/* Comment author hidden via Screen Options */
	.fixed .column-author.hidden ~ .column-comment .comment-author {
		display: none;
	}

	#the-comment-list .is-expanded td {
		box-shadow: none;
	}

	#the-comment-list .is-expanded td:last-child {
		box-shadow: inset 0 -1px 0 rgba($wp-black, 0.1);
	}

	/* Show comment bubble as text instead */
	.post-com-count .screen-reader-text {
		position: static;
		-webkit-clip-path: none;
		clip-path: none;
		width: auto;
		height: auto;
		margin: 0;
	}

	.column-response .post-com-count-no-comments:after,
	.column-response .post-com-count-approved:after,
	.column-comments .post-com-count-no-comments:after,
	.column-comments .post-com-count-approved:after {
		content: none;
	}

	.column-response .post-com-count [aria-hidden="true"],
	.column-comments .post-com-count [aria-hidden="true"] {
		display: none;
	}

	.column-response .post-com-count-wrapper,
	.column-comments .post-com-count-wrapper {
		white-space: normal;
	}

	.column-response .post-com-count-wrapper > a,
	.column-comments .post-com-count-wrapper > a {
		display: block;
	}

	.column-response .post-com-count-no-comments,
	.column-response .post-com-count-approved,
	.column-comments .post-com-count-no-comments,
	.column-comments .post-com-count-approved {
		margin-top: 0;
		margin-right: 0.5em;
	}

	.column-response .post-com-count-pending,
	.column-comments .post-com-count-pending {
		position: static;
		height: auto;
		min-width: 0;
		padding: 0;
		border: none;
		border-radius: 0;
		background: none;
		color: $wp-red-50;
		font-size: inherit;
		line-height: inherit;
		text-align: left;
	}

	.column-response .post-com-count-pending:hover,
	.column-comments .post-com-count-pending:hover {
		color: $wp-red-50;
	}

	.widefat thead td.check-column,
	.widefat tfoot td.check-column {
		padding-top: 10px;
	}

	.widefat * {
		word-wrap: normal;
	}

	/* Make row actions more easy to select on mobile */
	body:not(.plugins-php) .row-actions {
		display: -ms-grid;
		display: grid;
		-ms-grid-columns: auto auto auto;
		grid-template-columns: auto auto auto;
		color: transparent;
	}

	.row-actions span {
		padding: 4px 0;
	}

	.row-actions span a,
	.row-actions span .button-link {
		display: inline-block;
		padding: 4px 0;
	}

	.row-actions span.approve:before,
	.row-actions span.unapprove:before {
		content: "| ";
	}

	/* Quick Edit and Bulk Edit */
	#wpbody-content .quick-edit-row-post .inline-edit-col-left,
	#wpbody-content .quick-edit-row-post .inline-edit-col-right,
	#wpbody-content .inline-edit-row-post .inline-edit-col-center,
	#wpbody-content .quick-edit-row-page .inline-edit-col-left,
	#wpbody-content .quick-edit-row-page .inline-edit-col-right,
	#wpbody-content .bulk-edit-row-post .inline-edit-col-right,
	#wpbody-content .bulk-edit-row .inline-edit-col-left,
	#wpbody-content .bulk-edit-row-page .inline-edit-col-right,
	#wpbody-content .bulk-edit-row .inline-edit-col-bottom {
		float: none;
		width: 100%;
	}

	#wpbody-content .quick-edit-row fieldset .inline-edit-col label,
	#wpbody-content .quick-edit-row fieldset .inline-edit-group label,
	#wpbody-content .bulk-edit-row fieldset .inline-edit-col label,
	#wpbody-content .bulk-edit-row fieldset .inline-edit-group label {
		max-width: none;
		float: none;
		margin-bottom: 5px;
	}

	#wpbody .bulk-edit-row fieldset select {
		display: block;
		width: 100%;
		max-width: none;
		box-sizing: border-box;
	}

	.inline-edit-row fieldset ul.cat-checklist label,
	.inline-edit-row #bulk-titles div {
		font-size: 16px;
	}

	.inline-edit-row fieldset label span.title,
	.inline-edit-row fieldset.inline-edit-date legend {
		float: none;
	}

	.inline-edit-row fieldset label.inline-edit-tags {
		padding: 0 0.5em;
	}

	.inline-edit-row fieldset .inline-edit-col label.inline-edit-tags {
		padding: 0;
	}

	.inline-edit-row fieldset label span.input-text-wrap,
	.inline-edit-row fieldset .timestamp-wrap {
		margin-left: 0;
	}

	.inline-edit-row fieldset input[name=jj],
	.inline-edit-row fieldset input[name=hh],
	.inline-edit-row fieldset input[name=mn] {
		width: 3em;
	}

	.inline-edit-row fieldset input[name=aa] {
		width: 4.5em;
	}

	.inline-edit-row .inline-edit-or {
		margin: 0 6px 0 0;
	}

	#edithead .inside,
	#commentsdiv #edithead .inside {
		float: none;
		text-align: left;
		padding: 3px 5px;
	}

	#commentsdiv #edithead .inside input,
	#edithead .inside input {
		width: 100%;
	}

	#edithead label {
		display: block;
	}

	#bulk-titles div {
		margin: 0.8em 0.3em;
	}

	#bulk-titles div a {
		height: 22px;
	}

	/* Updates */
	#wpbody-content .updates-table .plugin-title {
		width: auto;
		white-space: normal;
	}

	/* Links */
	.link-manager-php #posts-filter {
		margin-top: 25px;
	}

	.link-manager-php .tablenav.bottom {
		overflow: hidden;
	}

	/* List tables that don't toggle rows */
	.comments-box .toggle-row,
	.wp-list-table.plugins .toggle-row {
		display: none;
	}

	/* Plugin/Theme Management */
	#wpbody-content .wp-list-table.plugins td {
		display: block;
		width: auto;
		padding: 10px 9px; /* reset from other list tables that have a label at this width */
	}

	/* Plugin description hidden via Screen Options */
	#wpbody-content .wp-list-table.plugins .desc.hidden {
		display: none;
	}

	#wpbody-content .wp-list-table.plugins .column-description {
		padding-top: 2px;
	}

	#wpbody-content .wp-list-table.plugins .plugin-title,
	#wpbody-content .wp-list-table.plugins .theme-title {
		padding-right: 12px;
		white-space: normal;
	}

	.wp-list-table.plugins .plugin-title,
	.wp-list-table.plugins .theme-title {
		padding-top: 13px;
		padding-bottom: 4px;
	}

	.plugins #the-list tr > td:not(:last-child),
	.plugins #the-list .update th,
	.plugins #the-list .update td,
	.wp-list-table.plugins #the-list .theme-title {
		box-shadow: none;
		border-top: none;
	}

	.plugins #the-list tr td {
		border-top: none;
	}

	.plugins tbody {
		padding: 1px 0 0;
	}

	.plugins tr.active + tr.inactive th.check-column,
	.plugins tr.active + tr.inactive td.column-description,
	.plugins .plugin-update-tr:before {
		box-shadow: inset 0 -1px 0 rgba($wp-black, 0.1);
	}

	.plugins tr.active + tr.inactive th.check-column,
	.plugins tr.active + tr.inactive td {
		border-top: none;
	}

	/* mimic the checkbox th */
	.plugins .plugin-update-tr:before {
		content: "";
		display: table-cell;
	}

	.plugins .active.update + .plugin-update-tr:before {
		border-left: 4px solid $wp-red-50;
		background-color: $wp-gray-0;
	}

	.plugins #the-list .plugin-update-tr .plugin-update {
		border-left: none;
	}

	.plugin-update-tr .update-message {
		margin-left: 0;
	}

	.plugins .active.update + .plugin-update-tr:before {
		background-color: $wp-gray-0;
		border-left: 4px solid $wp-blue-30;
	}

	.plugins .plugin-update-tr .update-message {
		margin-left: 0;
	}

	.wp-list-table.plugins .plugin-title strong,
	.wp-list-table.plugins .theme-title strong {
		font-size: 1.4em;
		line-height: 1.5;
	}

	/* Add New plugins page */
	table.plugin-install .column-name,
	table.plugin-install .column-version,
	table.plugin-install .column-rating,
	table.plugin-install .column-description {
		display: block;
		width: auto;
	}

	table.plugin-install th.column-name,
	table.plugin-install th.column-version,
	table.plugin-install th.column-rating,
	table.plugin-install th.column-description {
		display: none;
	}

	table.plugin-install td.column-name strong {
		font-size: 1.4em;
		line-height: 1.6em;
	}

	table.plugin-install #the-list td {
		box-shadow: none;
	}

	table.plugin-install #the-list tr {
		display: block;
		box-shadow: inset 0 -1px 0 rgba($wp-black, 0.1);
	}

	.plugin-card {
		margin-left: 0;
		margin-right: 0;
		width: 100%;
	}
}

@media screen and (max-width: 480px) {
	.tablenav-pages .current-page {
		margin: 0;
	}

	/* Drop row actions to two columns on a small screen */
	.row-actions:not(.plugins-php) {
		-ms-grid-columns: auto auto;
		grid-template-columns: auto auto;
	}

	.tablenav-pages .tablenav-paging-text {
		float: left;
		width: 100%;
		padding-top: 0.5em;
	}
}


// edit.css

/*------------------------------------------------------------------------------
  11.0 - Write/Edit Post Screen
------------------------------------------------------------------------------*/

#titlediv #title {
	padding: 3px 8px;
	font-size: 1.7em;
	line-height: 100%;
	height: 1.7em;
	width: 100%;
	outline: none;
	margin: 0 0 3px;
	background-color: $wp-white;
}

#titlediv #title-prompt-text {
	color: $wp-gray-50;
	position: absolute;
	font-size: 1.7em;
	padding: 11px 10px;
}

#edit-slug-box,
#comment-link-box {
	line-height: 24px;
	min-height: 25px; /* Yes, line-height + 1 */
	margin-top: 5px;
	padding: 0 10px;
	color: $wp-gray-50;
}

.postbox {
	position: relative;
	min-width: 255px;
	border: 1px solid $wp-gray-5;
	box-shadow: 0 1px 1px rgba($wp-black, 0.04);
	background: $wp-white;
}

#trackback_url {
	width: 99%;
}

#normal-sortables .postbox .submit {
	background: transparent none;
	border: 0 none;
	float: right;
	padding: 0 12px;
	margin: 0;
}

.category-add input[type="text"],
.category-add select {
	width: 100%;
	max-width: 260px;
	vertical-align: baseline;
}

#side-sortables .category-add input[type="text"],
#side-sortables .category-add select {
	margin: 0 0 1em;
}

ul.category-tabs li,
#side-sortables .add-menu-item-tabs li,
.wp-tab-bar li {
	display: inline;
	line-height: 1.35em;
}

.no-js .category-tabs li.hide-if-no-js {
	display: none;
}

.category-tabs a,
#side-sortables .add-menu-item-tabs a,
.wp-tab-bar a {
	text-decoration: none;
}

/* @todo: do these really need to be so specific? */
#side-sortables .category-tabs .tabs a,
#side-sortables .add-menu-item-tabs .tabs a,
.wp-tab-bar .wp-tab-active a,
#post-body ul.category-tabs li.tabs a,
#post-body ul.add-menu-item-tabs li.tabs a {
	color: $wp-gray-80;
}

.category-tabs {
	margin: 8px 0 5px;
}

/* Back-compat for pre-4.4 */
#category-adder h4 {
	margin: 0;
}

.taxonomy-add-new {
	display: inline-block;
	margin: 10px 0;
	font-weight: 600;
}

#side-sortables .add-menu-item-tabs,
.wp-tab-bar {
	margin-bottom: 3px;
}

#normal-sortables .postbox #replyrow .submit {
	float: none;
	margin: 0;
	padding: 5px 7px 10px;
	overflow: hidden;
}

#side-sortables .submitbox .submit input,
#side-sortables .submitbox .submit .preview,
#side-sortables .submitbox .submit a.preview:hover {
	border: 0 none;
}

/* @todo: make this a more generic class */
ul.category-tabs,
ul.add-menu-item-tabs,
ul.wp-tab-bar {
	margin-top: 12px;
}

ul.category-tabs li,
ul.add-menu-item-tabs li {
	border: solid 1px transparent;
	position: relative;
}

ul.category-tabs li.tabs,
ul.add-menu-item-tabs li.tabs,
.wp-tab-active {
	border: 1px solid $wp-gray-5;
	border-bottom-color: $wp-gray-0;
	background-color: $wp-gray-0;
}

ul.category-tabs li,
ul.add-menu-item-tabs li,
ul.wp-tab-bar li {
	padding: 3px 5px 6px;
}

#set-post-thumbnail {
	display: inline-block;
	max-width: 100%;
}

#postimagediv .inside img {
	max-width: 100%;
	height: auto;
	width: auto;
	vertical-align: top;
	background-image: linear-gradient(45deg, #c4c4c4 25%, transparent 25%, transparent 75%, #c4c4c4 75%, #c4c4c4), linear-gradient(45deg, #c4c4c4 25%, transparent 25%, transparent 75%, #c4c4c4 75%, #c4c4c4);
	background-position: 0 0, 10px 10px;
	background-size: 20px 20px;
}

form#tags-filter {
	position: relative;
}

/* Global classes */
.wp-hidden-children .wp-hidden-child,
.ui-tabs-hide {
	display: none;
}

#post-body .tagsdiv #newtag {
	margin-right: 5px;
	width: 16em;
}

#side-sortables input#post_password {
	width: 94%
}

#side-sortables .tagsdiv #newtag {
	width: 68%;
}

#post-status-info {
	width: 100%;
	border-spacing: 0;
	border: 1px solid $wp-gray-5;
	border-top: none;
	background-color: $wp-gray-0;
	box-shadow: 0 1px 1px rgba($wp-black, 0.04);
	z-index: 999;
}

#post-status-info td {
	font-size: 12px;
}

.autosave-info {
	padding: 2px 10px;
	text-align: right;
}

#editorcontent #post-status-info {
	border: none;
}

#content-resize-handle {
	background: transparent url(../images/resize.gif) no-repeat scroll right bottom;
	width: 12px;
	cursor: row-resize;
}

/*rtl:ignore*/
.rtl #content-resize-handle {
	background-image: url(../images/resize-rtl.gif);
	background-position: left bottom;
}

.wp-editor-expand #content-resize-handle {
	display: none;
}

#postdivrich #content {
	resize: none;
}

#wp-word-count {
	display: block;
	padding: 2px 10px;
}

#wp-content-editor-container {
	position: relative;
}

.wp-editor-expand #wp-content-editor-tools {
	z-index: 1000;
	border-bottom: 1px solid $wp-gray-5;
}

.wp-editor-expand #wp-content-editor-container {
	box-shadow: none;
	margin-top: -1px;
}

.wp-editor-expand #wp-content-editor-container {
	border-bottom: 0 none;
}

.wp-editor-expand div.mce-statusbar {
	z-index: 1;
}

.wp-editor-expand #post-status-info {
	border-top: 1px solid $wp-gray-5;
}

.wp-editor-expand div.mce-toolbar-grp {
	z-index: 999;
}

/* TinyMCE native fullscreen mode override */
.mce-fullscreen #wp-content-wrap .mce-menubar,
.mce-fullscreen #wp-content-wrap .mce-toolbar-grp,
.mce-fullscreen #wp-content-wrap .mce-edit-area,
.mce-fullscreen #wp-content-wrap .mce-statusbar {
	position: static !important;
	width: auto !important;
	padding: 0 !important;
}

.mce-fullscreen #wp-content-wrap .mce-statusbar {
	visibility: visible !important;
}

.mce-fullscreen #wp-content-wrap .mce-tinymce .mce-wp-dfw {
	display: none;
}

.post-php.mce-fullscreen #wpadminbar,
.mce-fullscreen #wp-content-wrap .mce-wp-dfw {
	display: none;
}
/* End TinyMCE native fullscreen mode override */

#wp-content-editor-tools {
	background-color: $wp-gray-0;
	padding-top: 20px;
}

#poststuff #post-body.columns-2 #side-sortables {
	width: 280px;
}

#timestampdiv select {
	height: 21px;
	line-height: 14px;
	padding: 0;
	vertical-align: top;
	font-size: 12px;
}

#aa, #jj, #hh, #mn {
	padding: 1px;
	font-size: 12px;
}

#jj, #hh, #mn {
	width: 2em;
}

#aa {
	width: 3.4em;
}

.curtime #timestamp {
	padding: 2px 0 1px 0;
	display: inline !important;
	height: auto !important;
}

#post-body .misc-pub-post-status:before,
#post-body #visibility:before,
.curtime #timestamp:before,
#post-body .misc-pub-revisions:before,
span.wp-media-buttons-icon:before {
	color: $wp-gray-40;
}

#post-body .misc-pub-post-status:before,
#post-body #visibility:before,
.curtime #timestamp:before,
#post-body .misc-pub-revisions:before {
	font: normal 20px/1 dashicons;
	speak: none;
	display: inline-block;
	margin-left: -1px;
	padding-right: 3px;
	vertical-align: top;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

#post-body .misc-pub-post-status:before {
	content: "\f173";
}

#post-body #visibility:before {
	content: "\f177";
}

.curtime #timestamp:before {
	content: "\f145";
	position: relative;
	top: -1px;
}

#post-body .misc-pub-revisions:before {
	content: "\f321";
}

#timestampdiv {
	padding-top: 5px;
	line-height: 23px;
}

#timestampdiv p {
	margin: 8px 0 6px;
}

#timestampdiv input {
	border-width: 1px;
	border-style: solid;
	text-align: center;
}

.notification-dialog {
	position: fixed;
	top: 30%;
	max-height: 70%;
	left: 50%;
	width: 450px;
	margin-left: -225px;
	background: $wp-white;
	box-shadow: 0 3px 6px rgba($wp-black, 0.3);
	line-height: 1.5;
	z-index: 1000005;
	overflow-y: auto;
}

.notification-dialog-background {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: $wp-black;
	opacity: 0.7;
	filter: alpha(opacity=70);
	z-index: 1000000;
}

#post-lock-dialog .post-locked-message,
#post-lock-dialog .post-taken-over {
	margin: 25px;
}

#post-lock-dialog .post-locked-message a.button,
#file-editor-warning .button {
	margin-right: 10px;
}

#post-lock-dialog .post-locked-avatar {
	float: left;
	margin: 0 20px 20px 0;
}

#post-lock-dialog .wp-tab-first {
	outline: 0;
}

#post-lock-dialog .locked-saving img {
	float: left;
	margin-right: 3px;
}

#post-lock-dialog.saving .locked-saving,
#post-lock-dialog.saved .locked-saved {
	display: inline;
}

#excerpt {
	display: block;
	margin: 12px 0 0;
	height: 4em;
	width: 100%;
}

.tagchecklist {
	margin-left: 14px;
	font-size: 12px;
	overflow: auto;
}

.tagchecklist br {
	display: none;
}

.tagchecklist strong {
	margin-left: -8px;
	position: absolute;
}

.tagchecklist > li {
	float: left;
	margin-right: 25px;
	font-size: 13px;
	line-height: 1.8em;
	cursor: default;
	max-width: 100%;
	overflow: hidden;
	text-overflow: ellipsis;
}

.tagchecklist .ntdelbutton {
	position: absolute;
	width: 24px;
	height: 24px;
	border: none;
	margin: 0 0 0 -19px;
	padding: 0;
	background: none;
	cursor: pointer;
	text-indent: 0;
}

#poststuff h3.hndle, /* Back-compat for pre-4.4 */
#poststuff .stuffbox > h3, /* Back-compat for pre-4.4 */
#poststuff h2 {
	font-size: 14px;
	padding: 8px 12px;
	margin: 0;
	line-height: 1.4;
}

#poststuff .stuffbox h2 {
	padding: 8px 10px;
}

#poststuff .inside {
	margin: 6px 0 0 0;
}

#poststuff .stuffbox .inside {
	margin: 0;
}

#poststuff .inside #parent_id,
#poststuff .inside #page_template {
	max-width: 100%;
}

.ie8 #poststuff .inside #parent_id,
.ie8 #poststuff .inside #page_template {
	width: 250px;
}

.post-attributes-label-wrapper {
	margin-bottom: 0.5em;
}

.post-attributes-label {
	vertical-align: baseline;
	font-weight: 600;
}

#post-visibility-select {
	line-height: 1.5em;
	margin-top: 3px;
}

#linksubmitdiv .inside, /* Old Link Manager back-compat. */
#poststuff #submitdiv .inside {
	margin: 0;
	padding: 0;
}

#post-body-content,
.edit-form-section {
	margin-bottom: 20px;
}

/* Suggested text for privacy policy */
.wp-privacy-policy-guide {
	max-width: 1000px;
}

.privacy-text-box {
	width: calc(100% - 260px);
}

.privacy-text-box-toc {
	float: right;
	width: 250px;
	background-color: $wp-white;
}

.privacy-text-box-toc p {
	margin: 0;
	padding: 0.7em 1em;
	border-bottom: 1px solid $wp-gray-0;
}

.privacy-text-box-toc ol {
	margin-left: 2em;
}

.wp-privacy-policy-guide h3 {
	font-size: 1.2em;
	margin: 1em 0 0.5em;
}

.privacy-text-section .privacy-text-copy {
	float: right;
}

.privacy-text-section {
	position: relative;
	border-top: 1px solid $wp-gray-5;
}

.privacy-text-box-head,
.privacy-text-section.text-removed {
	padding-bottom: 12px;
}

.text-removed .policy-text {
	font-style: italic;
	color: $wp-gray-50;
	font-weight: 600;
}

.privacy-text-actions {
	height: 32px;
	line-height: 32px;
	padding-bottom: 6px;
}

.wp-privacy-policy-guide .policy-text h2 {
	margin: 1.2em 0 1em;
	padding: 0;
}

.suggested-policy-content {
	font-style: italic;
}

.privacy-text-section a.return-to-top {
	float: right;
	margin-right: -250px;
	margin-top: 6px;
}

.hide-privacy-policy-tutorial .privacy-policy-tutorial {
	visibility: hidden;
}

.wp-suggested-text p {
	font-style: italic;
}

.wp-suggested-text p.privacy-policy-tutorial {
	font-style: normal;
}

.notice.wp-pp-notice {
	margin: 15px 0 3px;
}

/*------------------------------------------------------------------------------
  11.1 - Custom Fields
------------------------------------------------------------------------------*/

#postcustomstuff thead th {
	padding: 5px 8px 8px;
	background-color: $wp-gray-0;
}

#postcustom #postcustomstuff .submit {
	border: 0 none;
	float: none;
	padding: 0 8px 8px;
}

#side-sortables #postcustom #postcustomstuff .submit {
	margin: 0;
	padding: 0;
}

#side-sortables #postcustom #postcustomstuff #the-list textarea {
	height: 85px;
}

#side-sortables #postcustom #postcustomstuff td.left input,
#side-sortables #postcustom #postcustomstuff td.left select,
#side-sortables #postcustomstuff #newmetaleft a {
	margin: 3px 3px 0;
}

#postcustomstuff table {
	margin: 0;
	width: 100%;
	border: 1px solid $wp-gray-5;
	border-spacing: 0;
	background-color: $wp-gray-0;
}

#postcustomstuff tr {
	vertical-align: top;
}

#postcustomstuff table input,
#postcustomstuff table select,
#postcustomstuff table textarea {
	width: 96%;
	margin: 8px;
}

#side-sortables #postcustomstuff table input,
#side-sortables #postcustomstuff table select,
#side-sortables #postcustomstuff table textarea {
	margin: 3px;
}

#postcustomstuff th.left,
#postcustomstuff td.left {
	width: 38%;
}

#postcustomstuff .submit input {
	margin: 0;
	width: auto;
}

#postcustomstuff #newmetaleft a {
	display: inline-block;
	margin: 0 8px 8px;
	text-decoration: none;
}

.no-js #postcustomstuff #enternew {
	display: none;
}

#post-body-content .compat-attachment-fields {
	margin-bottom: 20px;
}

.compat-attachment-fields th {
	padding-top: 5px;
	padding-right: 10px;
}

/*------------------------------------------------------------------------------
  11.4 - Post formats
------------------------------------------------------------------------------*/

.post-format-icon::before {
	display: inline-block;
	vertical-align: middle;
	height: 20px;
	width: 20px;
	margin-top: -4px;
	margin-right: 7px;
	color: $wp-gray-5;
	font: normal 20px/1 dashicons;
	speak: none;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

a.post-format-icon:hover:before {
	color: $wp-blue-30;
}

#post-formats-select {
	line-height: 2em;
}

#post-formats-select .post-format-icon::before {
	top: 5px;
}

input.post-format {
	margin-top: 1px;
}

label.post-format-icon {
	margin-left: 0;
	padding: 2px 0;
}

/*------------------------------------------------------------------------------
  12.0 - Categories
------------------------------------------------------------------------------*/

.category-adder {
	margin-left: 120px;
	padding: 4px 0;
}

.category-adder h4 {
	margin: 0 0 8px;
}

#side-sortables .category-adder {
	margin: 0;
}

.wp-tab-panel,
.categorydiv div.tabs-panel,
.customlinkdiv div.tabs-panel,
.posttypediv div.tabs-panel,
.taxonomydiv div.tabs-panel {
	min-height: 42px;
	max-height: 200px;
	overflow: auto;
	padding: 0 0.9em;
	border: solid 1px $wp-gray-5;
	background-color: $wp-gray-0;
}

div.tabs-panel-active {
	display: block;
}

div.tabs-panel-inactive {
	display: none;
}

#front-page-warning,
#front-static-pages ul,
ul.export-filters,
.inline-editor ul.cat-checklist ul,
.categorydiv ul.categorychecklist ul,
.customlinkdiv ul.categorychecklist ul,
.posttypediv ul.categorychecklist ul,
.taxonomydiv ul.categorychecklist ul {
	margin-left: 18px;
}

ul.categorychecklist li {
	margin: 0;
	padding: 0;
	line-height: 22px;
	word-wrap: break-word;
}

.categorydiv .tabs-panel,
.customlinkdiv .tabs-panel,
.posttypediv .tabs-panel,
.taxonomydiv .tabs-panel {
	border-width: 3px;
	border-style: solid;
}

.form-wrap label {
	display: block;
	padding: 2px 0;
}

.form-field input[type="text"],
.form-field input[type="password"],
.form-field input[type="email"],
.form-field input[type="number"],
.form-field input[type="search"],
.form-field input[type="tel"],
.form-field input[type="url"],
.form-field textarea {
	border-style: solid;
	border-width: 1px;
	width: 95%;
}

p.description,
.form-wrap p {
	margin: 2px 0 5px;
	color: $wp-gray-50;
}

p.help,
p.description,
span.description,
.form-wrap p {
	font-size: 13px;
	font-style: italic;
}

.form-wrap .form-field {
	margin: 1em 0;
	padding: 0;
}

.form-wrap .form-field #parent {
	max-width: 100%;
}

.col-wrap h2 {
	margin: 12px 0;
	font-size: 1.1em;
}

.col-wrap p.submit {
	margin-top: -10px;
}

.edit-term-notes {
	margin-top: 2em;
}

/*------------------------------------------------------------------------------
  13.0 - Tags
------------------------------------------------------------------------------*/

#poststuff .tagsdiv .ajaxtag {
	margin-top: 1em;
}

#poststuff .tagsdiv .howto {
	margin: 1em 0 6px 0;
}

.ajaxtag .newtag {
	position: relative;
}

.tagsdiv .newtag {
	width: 180px;
}

.tagsdiv .the-tags {
	display: block;
	height: 60px;
	margin: 0 auto;
	overflow: auto;
	width: 260px;
}

#post-body-content .tagsdiv .the-tags {
	margin: 0 5px;
}

p.popular-tags {
	border: none;
	line-height: 2em;
	padding: 8px 12px 12px;
	text-align: justify;
}

p.popular-tags a {
	padding: 0 3px;
}

.tagcloud {
	width: 97%;
	margin: 0 0 40px;
	text-align: justify;
}

.tagcloud h2 {
	margin: 2px 0 12px;
}

.the-tagcloud ul {
	margin: 0;
}

.the-tagcloud ul li {
	display: inline-block;
}

/* Suggest.js autocomplete, no more used by core. */
.ac_results {
	display: none;
	margin: -1px 0 0;
	padding: 0;
	list-style: none;
	position: absolute;
	z-index: 10000;
	border: 1px solid $wp-blue-30;
	background-color: $wp-white;
}

.wp-customizer .ac_results {
	z-index: 500000;
}

.ac_results li {
	margin: 0;
	padding: 5px 10px;
	white-space: nowrap;
	text-align: left;
}

.ac_results .ac_over,
.ac_over .ac_match {
	background-color: $wp-blue-50;
	color: $wp-white;
	cursor: pointer;
}

.ac_match {
	text-decoration: underline;
}

#edittag {
	max-width: 800px;
}

.edit-tag-actions {
	margin-top: 20px;
}

/* Comments */

.comment-php .wp-editor-area {
	height: 200px;
}

.comment-ays th,
.comment-ays td {
	padding: 10px 15px;
}

.comment-ays .comment-content ul {
	list-style: initial;
	margin-left: 2em;
}

.comment-ays .comment-content a[href]:after {
	content: "(" attr( href ) ")";
	display: inline-block;
	padding: 0 4px;
	color: $wp-gray-50;
	font-size: 13px;
	word-break: break-all;
}

.comment-ays .comment-content p.edit-comment {
	margin-top: 10px;
}

.comment-ays .comment-content p.edit-comment a[href]:after {
	content: "";
	padding: 0;
}

.comment-ays-submit .button-cancel {
	margin-left: 1em;
}

.trash-undo-inside,
.spam-undo-inside {
	margin: 1px 8px 1px 0;
	line-height: 16px;
}

.spam-undo-inside .avatar,
.trash-undo-inside .avatar {
	height: 20px;
	width: 20px;
	margin-right: 8px;
	vertical-align: middle;
}

.stuffbox .editcomment {
	clear: none;
	margin-top: 0;
}

#namediv.stuffbox .editcomment input {
	width: 100%;
}

#namediv.stuffbox .editcomment.form-table td {
	padding: 10px;
}

#comment-status-radio p {
	margin: 3px 0 5px;
}

#comment-status-radio input {
	margin: 2px 3px 5px 0;
	vertical-align: middle;
}

#comment-status-radio label {
	padding: 5px 0;
}

/* links tables */
table.links-table {
	width: 100%;
	border-spacing: 0;
}

.links-table th {
	font-weight: 400;
	text-align: left;
	vertical-align: top;
	min-width: 80px;
	width: 20%;
	word-wrap: break-word;
}

.links-table th,
.links-table td {
	padding: 5px 0;
}

.links-table td label {
	margin-right: 8px;
}

.links-table td input[type="text"],
.links-table td textarea {
	width: 100%;
}

.links-table #link_rel {
	max-width: 280px;
}


// revisions.css

.revisions.pinned .revisions-controls {
	position: fixed;
	top: 0;
	height: 82px;
	background: $wp-white;
	box-shadow: 0 1px 3px rgba($wp-black, 0.1);
}

.revisions-tickmarks {
	position: relative;
	margin: 0 auto;
	height: 0.7em;
	top: 7px;
	max-width: 70%;
	box-sizing: border-box;
	background-color: $wp-white;
}

.revisions-tickmarks > div {
	position: absolute;
	height: 100%;
	border-left: 1px solid $wp-gray-20;
	box-sizing: border-box;
}

.revisions-meta {
	margin-top: 20px;
	background-color: $wp-white;
	box-shadow: 0 1px 3px rgba($wp-black, 0.1);
	overflow: hidden;
}

.revisions-controls .author-card .date {
	color: $wp-gray-50;
}

.revisions-controls .author-card.autosave {
	color: $wp-red-50;
}

.revisions-diff {
	padding: 15px;
	background-color: $wp-white;
	box-shadow: 0 1px 3px rgba($wp-black, 0.1);
}

table.diff .diff-deletedline {
	background-color: $wp-red-0;
}

table.diff .diff-deletedline del {
	background-color: $wp-red-10;
}

table.diff .diff-addedline {
	background-color: $wp-green-0;
}

table.diff .diff-addedline ins {
	background-color: $wp-green-5;
}

.revisions-tooltip,
.revisions-tooltip-arrow > span {
	border: 1px solid $wp-gray-5;
	background-color: $wp-white;
}

.arrow:after {
	z-index: 9999;
	background-color: $wp-white;
	box-shadow: 0 1px 3px rgba($wp-black, 0.1);
}

.wp-slider.ui-slider {
	position: relative;
	border: 1px solid $wp-gray-5;
	text-align: left;
	cursor: pointer;
}

.wp-slider .ui-slider-handle,
.wp-slider .ui-slider-handle.focus {
	background: $wp-gray-0;
	border: 1px solid $wp-gray-10;
	box-shadow: 0 1px 0 $wp-gray-10;
}

.wp-slider .ui-slider-handle:hover,
.wp-slider .ui-slider-handle.ui-state-hover {
	background: $wp-gray-0;
	border-color: $wp-gray-30;
}

.wp-slider .ui-slider-handle:active,
.wp-slider .ui-slider-handle.ui-state-active {
	background: $wp-gray-0;
	border-color: $wp-gray-30;
	box-shadow: inset 0 2px 5px -3px rgba($wp-black, 0.5);
	transform: translateY(1px);
}

.wp-slider .ui-slider-handle:before {
	background: none;
	position: absolute;
	top: 2px;
	left: 2px;
	color: $wp-gray-60;
	content: "\f229";
	font: normal 18px/1 dashicons;
	speak: none;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

.wp-slider .ui-slider-handle:hover:before,
.wp-slider .ui-slider-handle.ui-state-hover:before {
	color: $wp-gray-90;
}

// media.css

.media-item .describe {
	border-collapse: collapse;
	width: 100%;
	border-top: 1px solid $wp-gray-5;
	clear: both;
	cursor: default;
}

.media-upload-form .media-item {
	min-height: 36px;
	margin-bottom: 1px;
	position: relative;
	width: 100%;
	background: $wp-white;
}

.media-upload-form .media-item,
.media-upload-form .media-item .error {
	box-shadow: 0 1px 0 $wp-gray-5;
}

.media-item .progress {
	float: right;
	height: 22px;
	margin: 7px 6px;
	width: 200px;
	line-height: 2em;
	padding: 0;
	overflow: hidden;
	border-radius: 22px;
	background: $wp-gray-5;
	box-shadow: inset 0 1px 2px rgba($wp-black, 0.1);
}

.media-item .bar {
	z-index: 9;
	width: 0;
	height: 100%;
	margin-top: -22px;
	border-radius: 22px;
	background-color: $wp-blue-50;
	box-shadow: inset 0 0 2px rgba($wp-black, 0.3);
}

.media-item .progress .percent {
	z-index: 10;
	position: relative;
	width: 200px;
	padding: 0;
	color: $wp-white;
	text-align: center;
	line-height: 22px;
	font-weight: 400;
	text-shadow: 0 1px 2px rgba($wp-black, 0.2);
}


/*------------------------------------------------------------------------------
  14.1 - Media Library
------------------------------------------------------------------------------*/

.find-box {
	background-color: $wp-white;
	box-shadow: 0 3px 6px rgba($wp-black, 0.3);
	width: 600px;
	overflow: hidden;
	margin-left: -300px;
	position: fixed;
	top: 30px;
	bottom: 30px;
	left: 50%;
	z-index: 100105;
}

.find-box-head {
	background: $wp-gray-0;
	border-bottom: 1px solid $wp-gray-5;
	height: 36px;
	font-size: 18px;
	font-weight: 600;
	line-height: 36px;
	padding: 0 36px 0 16px;
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
}

.find-box-inside {
	overflow: auto;
	padding: 16px;
	background-color: $wp-white;
	position: absolute;
	top: 37px;
	bottom: 45px;
	overflow-y: scroll;
	width: 100%;
	box-sizing: border-box;
}

#find-posts-close {
	width: 36px;
	height: 36px;
	border: none;
	padding: 0;
	position: absolute;
	top: 0;
	right: 0;
	cursor: pointer;
	text-align: center;
	background: none;
	color: $wp-gray-50;
}

#find-posts-close:hover,
#find-posts-close:focus {
	color: $wp-blue-30;
}

#find-posts-close:focus {
	box-shadow:
		0 0 0 1px $wp-blue-30,
		0 0 2px 1px rgba($wp-blue-40, 0.8);
	/* Only visible in Windows High Contrast mode */
	outline: 2px solid transparent;
	outline-offset: -2px;
}

#find-posts-close:before {
	font: normal 20px/36px dashicons;
	vertical-align: top;
	speak: none;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	content: "\f158";
}

.find-box-buttons {
	padding: 8px 16px;
	background: $wp-gray-0;
	border-top: 1px solid $wp-gray-5;
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
}

.ui-find-overlay {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	background: $wp-black;
	opacity: 0.7;
	filter: alpha(opacity=70);
	z-index: 100100;
}

ul#dismissed-updates {
	display: none;
}

form.upgrade {
	margin-top: 8px;
}

form.upgrade .hint {
	font-style: italic;
	font-size: 85%;
	margin: -0.5em 0 2em 0;
}

#poststuff .inside .the-tagcloud {
	margin: 5px 0 10px;
	padding: 8px;
	border: 1px solid $wp-gray-5;
	line-height: 1.8em;
	word-spacing: 3px;
}

.drag-drop #drag-drop-area {
	border: 4px dashed $wp-gray-10;
	height: 200px;
}

.drag-drop .drag-drop-inside {
	margin: 70px auto 0;
	width: 250px;
}

.drag-drop-inside p {
	color: $wp-gray-20;
	font-size: 14px;
	margin: 5px 0;
	display: none;
}

.drag-drop .drag-drop-inside p {
	text-align: center;
}

.drag-drop-inside p.drag-drop-info {
	font-size: 20px;
}

.drag-drop .drag-drop-inside p,
.drag-drop-inside p.drag-drop-buttons {
	display: block;
}

.drag-drop.drag-over #drag-drop-area {
	border-color: $wp-blue-30;
}

#plupload-upload-ui {
	position: relative;
}

/**
 * Media Library grid view
 */

.media-frame.mode-grid,
.media-frame.mode-grid .media-frame-content,
.media-frame.mode-grid .attachments-browser .attachments,
.media-frame.mode-grid .uploader-inline-content {
	position: static;
}

/* Regions we don't use at all */
.media-frame.mode-grid .media-frame-title,
.media-frame.mode-grid .media-frame-router,
.media-frame.mode-grid .media-frame-menu {
	display: none;
}

.media-frame.mode-grid .media-frame-content {
	background-color: transparent;
	border: none;
}

.upload-php .mode-grid .media-sidebar {
	position: relative;
	width: auto;
	margin-top: 12px;
	padding: 0 16px;
	border-left: 4px solid $wp-red-50;
	box-shadow: 0 1px 1px 0 rgba($wp-black, 0.1);
	background-color: $wp-white;
}

.upload-php .mode-grid .hide-sidebar .media-sidebar {
	display: none;
}

.upload-php .mode-grid .media-sidebar .media-uploader-status {
	border-bottom: none;
	padding-bottom: 0;
	max-width: 100%;
}

.upload-php .mode-grid .media-sidebar .upload-error {
	margin: 12px 0;
	padding: 4px 0 0;
	border: none;
	box-shadow: none;
	background: none;
}

.upload-php .mode-grid .media-sidebar .media-uploader-status .upload-dismiss-errors {
	top: -10px;
	right: -14px;
	padding: 10px;
}

.upload-php .mode-grid .media-sidebar .media-uploader-status .upload-dismiss-errors:before {
	content: "\f153";
	display: block;
	font: normal 16px/1 dashicons;
	color: $wp-gray-50;
}

.upload-php .mode-grid .media-sidebar .media-uploader-status .upload-dismiss-errors:focus:before,
.upload-php .mode-grid .media-sidebar .media-uploader-status .upload-dismiss-errors:hover:before {
	color: $wp-red-50;
}

.upload-php .mode-grid .media-sidebar .media-uploader-status.errors h3, /* Back-compat for pre-4.4 */
.upload-php .mode-grid .media-sidebar .media-uploader-status.errors h2 {
	display: none;
}

.media-frame.mode-grid .uploader-inline {
	position: relative;
	top: auto;
	right: auto;
	left: auto;
	bottom: auto;
	padding-top: 0;
	margin-top: 20px;
	border: 4px dashed $wp-gray-10;
}

.media-frame.mode-select .attachments-browser.fixed .attachments {
	position: relative;
	top: 94px; /* prevent jumping up when the toolbar becomes fixed */
	padding-bottom: 94px; /* offset for above so the bottom doesn't get cut off */
}

.media-frame.mode-grid .attachment:focus,
.media-frame.mode-grid .selected.attachment:focus,
.media-frame.mode-grid .attachment.details:focus {
	box-shadow:
		inset 0 0 2px 3px $wp-gray-0,
		inset 0 0 0 7px $wp-blue-30;
	/* Only visible in Windows High Contrast mode */
	outline: 2px solid transparent;
	outline-offset: -6px;
}

.media-frame.mode-grid .selected.attachment {
	box-shadow:
		inset 0 0 0 5px $wp-gray-0,
		inset 0 0 0 7px $wp-gray-10;
}

.media-frame.mode-grid .attachment.details {
	box-shadow:
		inset 0 0 0 3px $wp-gray-0,
		inset 0 0 0 7px $wp-blue-50;
}

.media-frame.mode-grid .attachments-browser .no-media {
	color: $wp-gray-50; /* same as no plugins and no themes */
	font-size: 18px;
	font-style: normal;
	margin: 0;
	padding: 100px 0 0;
	text-align: center;
}

/**
 * Attachment details modal
 */

.edit-attachment-frame {
	display: block;
	height: 100%;
	width: 100%;
}

.edit-attachment-frame .edit-media-header {
	overflow: hidden;
}

.upload-php .media-modal-close .media-modal-icon:before {
	content: "\f335";
	font-size: 22px;
}

.upload-php .media-modal-close,
.edit-attachment-frame .edit-media-header .left,
.edit-attachment-frame .edit-media-header .right {
	cursor: pointer;
	color: $wp-gray-50;
	background-color: transparent;
	height: 50px;
	width: 50px;
	padding: 0;
	position: absolute;
	text-align: center;
	border: 0;
	border-left: 1px solid $wp-gray-5;
	transition: color .1s ease-in-out, background .1s ease-in-out;
}

.upload-php .media-modal-close {
	top: 0;
	right: 0;
}

.edit-attachment-frame .edit-media-header .left {
	right: 102px;
}

.edit-attachment-frame .edit-media-header .right {
	right: 51px;
}

.edit-attachment-frame .media-frame-title {
	left: 0;
	right: 150px; /* leave space for prev/next/close */
}

.edit-attachment-frame .edit-media-header .right:before,
.edit-attachment-frame .edit-media-header .left:before {
	font: normal 20px/50px dashicons !important;
	display: inline;
	font-weight: 300;
}

.upload-php .media-modal-close:hover,
.upload-php .media-modal-close:focus,
.edit-attachment-frame .edit-media-header .left:hover,
.edit-attachment-frame .edit-media-header .right:hover,
.edit-attachment-frame .edit-media-header .left:focus,
.edit-attachment-frame .edit-media-header .right:focus {
	background: $wp-gray-5;
	border-color: $wp-gray-10;
	color: $wp-black;
	outline: none;
	box-shadow: none;
}

.upload-php .media-modal-close:focus,
.edit-attachment-frame .edit-media-header .left:focus,
.edit-attachment-frame .edit-media-header .right:focus {
	/* Only visible in Windows High Contrast mode */
	outline: 2px solid transparent;
	outline-offset: -2px;
}

.upload-php .media-modal-close:focus .media-modal-icon:before,
.upload-php .media-modal-close:hover .media-modal-icon:before {
	color: $wp-black;
}

.edit-attachment-frame .edit-media-header .left.disabled,
.edit-attachment-frame .edit-media-header .right.disabled,
.edit-attachment-frame .edit-media-header .left.disabled:hover,
.edit-attachment-frame .edit-media-header .right.disabled:hover {
	color: $wp-gray-10;
	background: inherit;
	cursor: default;
	pointer-events: none;
}

.edit-attachment-frame .media-frame-content,
.edit-attachment-frame .media-frame-router {
	left: 0;
}

.edit-attachment-frame .media-frame-content {
	border-bottom: none;
	bottom: 0;
	top: 50px;
}

.edit-attachment-frame .attachment-details {
	position: absolute;
	overflow: auto;
	top: 0;
	bottom: 0;
	right: 0;
	left: 0;
	box-shadow: inset 0px 4px 4px -4px rgba($wp-black, 0.1);
}

.edit-attachment-frame .attachment-media-view {
	float: left;
	width: 65%;
	height: 100%;
}

.edit-attachment-frame .attachment-media-view .thumbnail {
	box-sizing: border-box;
	padding: 16px;
	height: 100%;
}

.edit-attachment-frame .attachment-media-view .details-image {
	display: block;
	margin: 0 auto 16px;
	max-width: 100%;
	max-height: 90%;
	max-height: calc( 100% - 42px ); /* leave space for actions underneath */
	background-image: linear-gradient(45deg, #c4c4c4 25%, transparent 25%, transparent 75%, #c4c4c4 75%, #c4c4c4), linear-gradient(45deg, #c4c4c4 25%, transparent 25%, transparent 75%, #c4c4c4 75%, #c4c4c4);
	background-position: 0 0, 10px 10px;
	background-size: 20px 20px;
}

.edit-attachment-frame .attachment-media-view .details-image.icon {
	background: none;
}

.edit-attachment-frame .attachment-media-view .attachment-actions {
	text-align: center;
}

.edit-attachment-frame .wp-media-wrapper {
	margin-bottom: 12px;
}

.edit-attachment-frame input,
.edit-attachment-frame textarea {
	padding: 6px 8px;
	line-height: 16px;
}

.edit-attachment-frame .attachment-info {
	overflow: auto;
	box-sizing: border-box;
	margin-bottom: 0;
	padding: 12px 16px 0;
	width: 35%;
	height: 100%;
	box-shadow: inset 0px 4px 4px -4px rgba($wp-black, 0.1);
	border-bottom: 0;
	border-left: 1px solid $wp-gray-5;
	background: $wp-gray-0;
}

.edit-attachment-frame .attachment-info .details,
.edit-attachment-frame .attachment-info .settings {
	position: relative; /* RTL fix, #WP29352 */
	overflow: hidden;
	float: none;
	margin-bottom: 15px;
	padding-bottom: 15px;
	border-bottom: 1px solid $wp-gray-5;
}

.edit-attachment-frame .attachment-info .filename {
	font-weight: 400;
	color: $wp-gray-50;
}

.edit-attachment-frame .attachment-info .thumbnail {
	margin-bottom: 12px;
}

.attachment-info .actions {
	margin-bottom: 16px;
}

.attachment-info .actions a {
	display: inline;
	text-decoration: none;
}


/*------------------------------------------------------------------------------
  14.2 - Image Editor
------------------------------------------------------------------------------*/
.wp_attachment_details .attachment-alt-text {
	margin-bottom: 5px;
}

.wp_attachment_details .attachment-alt-text-description {
	margin-top: 5px;
}

.wp_attachment_details label[for="content"] {
	font-size: 13px;
	line-height: 1.5;
	margin: 1em 0;
}

.wp_attachment_details #attachment_caption {
	height: 4em;
}

.describe .image-editor {
	vertical-align: top;
}

.imgedit-wrap {
	position: relative;
	padding-top: 10px;
}

.imgedit-settings p,
.imgedit-settings fieldset {
	margin: 8px 0;
}

.imgedit-settings legend {
	margin-bottom: 5px;
}

.describe .imgedit-wrap .imgedit-settings {
	padding: 0 5px;
}

.wp_attachment_holder div.updated {
	margin-top: 0;
}

.wp_attachment_holder .imgedit-wrap > div {
	height: auto;
}

.wp_attachment_holder .imgedit-wrap .imgedit-panel-content {
	padding: 3px 16px 0 0;
	float: left;
}

.wp_attachment_holder .imgedit-wrap .imgedit-settings {
	float: right;
	width: 250px;
}

.imgedit-settings input {
	margin-top: 0;
	vertical-align: middle;
}

.imgedit-wait {
	position: absolute;
	top: 0;
	bottom: 0;
	width: 100%;
	background: $wp-white;
	opacity: 0.7;
	filter: alpha(opacity=70);
	display: none;
}

.imgedit-wait:before {
	content: "";
	display: block;
	width: 20px;
	height: 20px;
	position: absolute;
	left: 50%;
	top: 50%;
	margin: -10px 0 0 -10px;
	background: transparent url(../images/spinner.gif) no-repeat center;
	background-size: 20px 20px;
	transform: translateZ(0);
}

.no-float {
	float: none;
}

.media-disabled,
.imgedit-settings .disabled {
	/* WCAG 1.4.3 Text or images of text that are part of an inactive user
	   interface component ... have no contrast requirement. */
	color: $wp-gray-20;
}

.A1B1 {
	overflow: hidden;
}

.wp_attachment_image .button,
.A1B1 .button {
	float: left;
}

.no-js .wp_attachment_image .button {
	display: none;
}

.wp_attachment_image .spinner,
.A1B1 .spinner {
	float: left;
}

.imgedit-menu {
	min-width: 300px;
	margin: 0 0 12px;
}

.imgedit-menu .note-no-rotate {
	clear: both;
	margin: 0;
	padding: 1em 0 0;
}

.image-editor .imgedit-menu .button {
	float: left;
	width: 32px;
	height: 32px;
	margin: 0 8px 0 0;
	padding: 0;
	background: $wp-gray-0;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	line-height: 16px;
	color: $wp-gray-50;
}

.imgedit-menu .button:before {
	font: normal 20px/1 dashicons;
	speak: none;
	vertical-align: middle;
}

.imgedit-menu .button.disabled {
	border-color: $wp-gray-10;
	background-color: $wp-gray-5;
	color: $wp-gray-50;
	filter: alpha(opacity=50);
	opacity: 0.5;
	cursor: default;
}

.imgedit-crop-wrap img {
	background-image: linear-gradient(45deg, #c4c4c4 25%, transparent 25%, transparent 75%, #c4c4c4 75%, #c4c4c4), linear-gradient(45deg, #c4c4c4 25%, transparent 25%, transparent 75%, #c4c4c4 75%, #c4c4c4);
	background-position: 0 0, 10px 10px;
	background-size: 20px 20px;
}


#poststuff .imgedit-group-top h3, /* Back-compat for pre-4.4 */
#poststuff .imgedit-group-top h2 {
	display: inline-block;
	margin: 0;
	padding: 0;
	font-size: 14px;
	line-height: 1.4;
}

#poststuff .imgedit-group-top .button-link {
	text-decoration: none;
	color: $wp-gray-90;
}

.imgedit-applyto .imgedit-label {
	display: block;
	padding: .5em 0 0;
}

.imgedit-help {
	display: none;
	font-style: italic;
}

/* higher specificity than buttons */
.image-editor .imgedit-settings .imgedit-help-toggle,
.image-editor .imgedit-settings .imgedit-help-toggle:hover,
.image-editor .imgedit-settings .imgedit-help-toggle:active {
	border: 1px solid transparent;
	margin: -1px 0 0 -1px;
	padding: 0;
	background: transparent;
	color: $wp-blue-50;
	font-size: 20px;
	line-height: 1;
	cursor: pointer;
	box-sizing: content-box;
	box-shadow: none;
}

.image-editor .imgedit-settings .imgedit-help-toggle:focus {
	color: $wp-blue-50;
	border-color: $wp-blue-30;
	box-shadow: 0 0 3px rgba($wp-blue-50, 0.8);
	/* Only visible in Windows High Contrast mode */
	outline: 2px solid transparent;
}


span.imgedit-scale-warn {
	color: $wp-red-50;
	font-size: 20px;
	font-style: normal;
	visibility: hidden;
	vertical-align: middle;
}

.imgedit-settings .imgedit-scale input[type="text"],
.imgedit-settings .imgedit-crop-ratio input[type="text"],
.imgedit-settings .imgedit-crop-sel input[type="text"] {
	width: 50px;
	font-size: 14px;
	padding: 5px 8px;
}

.imgedit-separator {
	display: inline-block;
	width: 7px;
	text-align: center;
	vertical-align: middle;
	font-size: 13px;
	color: $wp-gray-70;
}

.imgedit-settings .imgedit-scale .button {
	margin-bottom: 0;
}

audio, video {
	display: inline-block;
	max-width: 100%;
}

.mejs-container {
	width: 100%;
	max-width: 100%;
}


// themes.css

.theme-browser .theme {
	border: 1px solid $wp-gray-5;
	box-shadow: 0 1px 1px -1px rgba($wp-black, 0.1);
	box-sizing: border-box;
}


.theme-browser .theme .theme-name {
	font-size: 15px;
	font-weight: 600;
	height: 18px;
	margin: 0;
	padding: 15px;
	box-shadow: inset 0 1px 0 rgba($wp-black, 0.1);
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
	background: $wp-white;
	background: rgba($wp-white, 0.65);
}

/* Activate and Customize buttons, shown on hover and focus */
.theme-browser .theme .theme-actions {
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
	opacity: 0;
	transition: opacity 0.1s ease-in-out;
	height: auto;
	background: rgba($wp-gray-0, 0.7);
	border-left: 1px solid rgba($wp-black, 0.05);
}

.theme-browser .theme:hover .theme-screenshot,
.theme-browser .theme:focus .theme-screenshot {
	background: $wp-white;
}

.theme-browser .theme .more-details {
	-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
	opacity: 0;
	position: absolute;
	top: 35%;
	right: 20%;
	left: 20%;
	background: $wp-gray-90;
	background: rgba($wp-black, 0.7);
	color: $wp-white;
	font-size: 15px;
	text-shadow: 0 1px 0 rgba($wp-black, 0.6);
	-webkit-font-smoothing: antialiased;
	font-weight: 600;
	padding: 15px 12px;
	text-align: center;
	border-radius: 3px;
	transition: opacity 0.1s ease-in-out;
}

.theme-browser .theme:focus {
	border-color: $wp-blue-30;
	box-shadow: 0 0 2px rgba($wp-blue-40, 0.8);
}


/**
 * The currently active theme
 */
.theme-browser .theme.active .theme-name {
	background: $wp-gray-90;
	color: $wp-white;
	padding-right: 110px;
	font-weight: 300;
	box-shadow: inset 0 1px 1px rgba($wp-black, 0.5);
}


.theme-browser .theme.active .theme-actions {
	background: rgba($wp-gray-80, 0.7);
	border-left: none;
	opacity: 1;
}

.theme-id-container {
	position: relative;
}

.theme-browser .theme.active .theme-actions,
.theme-browser .theme .theme-actions {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	right: 0;
	padding: 10px 15px;
	box-shadow: inset 0 1px 0 rgba($wp-black, 0.1);
}

.theme-browser .theme.active .theme-actions .button-primary {
	margin-right: 0;
}

.theme-browser .theme .theme-author {
	background: $wp-gray-90;
	color: $wp-gray-0;
	display: none;
	font-size: 14px;
	margin: 0 10px;
	padding: 5px 10px;
	position: absolute;
	bottom: 56px;
}

.theme-browser .theme.add-new-theme a:after {
	display: block;
	content: "";
	background: transparent;
	background: rgba($wp-black, 0);
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	padding: 0;
	text-shadow: none;
	border: 5px dashed #d5d2ca;
	border: 5px dashed rgba($wp-black, 0.1);
	box-sizing: border-box;
}

.theme-browser .theme.add-new-theme span:after {
	background: $wp-gray-5;
	background: rgba($wp-gray-30, 0.1);
	border-radius: 50%;
	display: inline-block;
	content: "\f132";
	-webkit-font-smoothing: antialiased;
	font: normal 74px/115px dashicons;
	width: 100px;
	height: 100px;
	vertical-align: middle;
	text-align: center;
	color: $wp-gray-30;
	position: absolute;
	top: 30%;
	left: 50%;
	margin-left: -50px;
	text-indent: -4px;
	padding: 0;
	text-shadow: none;
	z-index: 4;
}


.theme-browser .theme.add-new-theme a:hover span:after,
.theme-browser .theme.add-new-theme a:focus span:after {
	background: $wp-white;
	color: $wp-blue-50;
}

.theme-browser .theme.add-new-theme a:hover:after,
.theme-browser .theme.add-new-theme a:focus:after {
	border-color: transparent;
	color: $wp-white;
	background: $wp-blue-50;
	content: "";
}


.theme-browser .theme.add-new-theme a:hover .theme-name,
.theme-browser .theme.add-new-theme a:focus .theme-name {
	color: $wp-white;
	z-index: 2;
}

/**
 * Theme Overlay
 * Shown when clicking a theme
 */
.theme-overlay .theme-backdrop {
	position: absolute;
	left: -20px;
	right: 0;
	top: 0;
	bottom: 0;
	background: $wp-gray-0;
	background: rgba($wp-gray-0, 0.9);
	z-index: 10000; /* Over WP Pointers. */
}

.theme-overlay .theme-header {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	height: 48px;
	border-bottom: 1px solid $wp-gray-5;
}

.theme-overlay .theme-header button {
	padding: 0;
}

.theme-overlay .theme-header .close {
	cursor: pointer;
	height: 48px;
	width: 50px;
	text-align: center;
	float: right;
	border: 0;
	border-left: 1px solid $wp-gray-5;
	background-color: transparent;
	transition: color .1s ease-in-out, background .1s ease-in-out;
}

.theme-overlay .theme-header .close:before {
	font: normal 22px/50px dashicons !important;
	color: $wp-gray-50;
	display: inline-block;
	content: "\f335";
	font-weight: 300;
}

/* Left and right navigation */
.theme-overlay .theme-header .right,
.theme-overlay .theme-header .left {
	cursor: pointer;
	color: $wp-gray-50;
	background-color: transparent;
	height: 48px;
	width: 54px;
	float: left;
	text-align: center;
	border: 0;
	border-right: 1px solid $wp-gray-5;
	transition: color .1s ease-in-out, background .1s ease-in-out;
}

.theme-overlay .theme-header .close:focus,
.theme-overlay .theme-header .close:hover,
.theme-overlay .theme-header .right:focus,
.theme-overlay .theme-header .right:hover,
.theme-overlay .theme-header .left:focus,
.theme-overlay .theme-header .left:hover {
	background: $wp-gray-5;
	border-color: $wp-gray-10;
	color: $wp-black;
}

.theme-overlay .theme-header .close:focus:before,
.theme-overlay .theme-header .close:hover:before {
	color: $wp-black;
}

.theme-overlay .theme-header .close:focus,
.theme-overlay .theme-header .right:focus,
.theme-overlay .theme-header .left:focus {
	box-shadow: none;
	outline: none;
}

.theme-overlay .theme-header .left.disabled,
.theme-overlay .theme-header .right.disabled,
.theme-overlay .theme-header .left.disabled:hover,
.theme-overlay .theme-header .right.disabled:hover {
	color: $wp-gray-10;
	background: inherit;
	cursor: inherit;
}

.theme-overlay .theme-wrap {
	clear: both;
	position: fixed;
	top: 9%;
	left: 190px;
	right: 30px;
	bottom: 3%;
	background: $wp-white;
	box-shadow: 0 1px 20px 5px rgba($wp-black, 0.1);
	z-index: 10000; /* Over WP Pointers. */
	box-sizing: border-box;
	-webkit-overflow-scrolling: touch;
}

.theme-overlay .theme-actions {
	position: absolute;
	text-align: center;
	bottom: 0;
	left: 0;
	right: 0;
	padding: 10px 25px 5px;
	background: $wp-gray-0;
	z-index: 30;
	box-sizing: border-box;
	border-top: 1px solid $wp-gray-0;
}

.ie8 .theme-overlay .theme-actions {
	border: 1px solid $wp-gray-0;
}


.broken-themes a.delete-theme,
.theme-overlay .theme-actions .delete-theme {
	color: $wp-red-70;
	text-decoration: none;
	border-color: transparent;
	box-shadow: none;
	background: transparent;
}


.broken-themes a.delete-theme:hover,
.broken-themes a.delete-theme:focus,
.theme-overlay .theme-actions .delete-theme:hover,
.theme-overlay .theme-actions .delete-theme:focus {
	background: $wp-red-50;
	color: $wp-white;
	border-color: $wp-red-50;
}


/* First screenshot, shown big */
.theme-overlay .screenshot {
	border: 1px solid $wp-white;
	box-sizing: border-box;
	overflow: hidden;
	position: relative;
	box-shadow: 0 0 0 1px rgba($wp-black, 0.2);
}


/* Other screenshots, shown small and square */
.theme-overlay .screenshot.thumb {
	background: $wp-gray-10;
	border: 1px solid $wp-gray-0;
	float: none;
	display: inline-block;
	margin: 10px 5px 0;
	width: 140px;
	height: 80px;
	cursor: pointer;
}


.theme-overlay .screenshot.selected {
	background: transparent;
	border: 2px solid $wp-blue-30;
}


.theme-overlay .current-label {
	background: $wp-gray-80;
	color: $wp-white;
	font-size: 11px;
	display: inline-block;
	padding: 2px 8px;
	border-radius: 2px;
	margin: 0 0 -10px;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

.theme-overlay .theme-name {
	color: $wp-gray-90;
	font-size: 32px;
	font-weight: 100;
	margin: 10px 0 0;
	line-height: 1.3;
	word-wrap: break-word;
	overflow-wrap: break-word;
}

.theme-overlay .theme-version {
	color: $wp-gray-50;
	font-size: 13px;
	font-weight: 400;
	float: none;
	display: inline-block;
	margin-left: 10px;
}

.theme-overlay .theme-author {
	margin: 15px 0 25px;
	color: $wp-gray-50;
	font-size: 16px;
	font-weight: 400;
	line-height: inherit;
}

.theme-overlay .theme-author a {
	text-decoration: none;
}

.theme-overlay .theme-description {
	color: $wp-gray-60;
	font-size: 15px;
	font-weight: 400;
	line-height: 1.5;
	margin: 30px 0 0 0;
}

.theme-overlay .theme-tags {
	border-top: 3px solid $wp-gray-0;
	color: $wp-gray-40;
	font-size: 13px;
	font-weight: 400;
	margin: 30px 0 0 0;
	padding-top: 20px;
}

.theme-overlay .theme-tags span {
	color: $wp-gray-70;
	font-weight: 600;
	margin-right: 5px;
}

.theme-overlay .parent-theme {
	background: $wp-gray-0;
	border: 1px solid $wp-gray-0;
	border-left: 4px solid $wp-blue-30;
	font-size: 14px;
	font-weight: 400;
	margin-top: 30px;
	padding: 10px 10px 10px 20px;
}

.theme-overlay .parent-theme strong {
	font-weight: 600;
}

/*------------------------------------------------------------------------------
  16.2 - Install Themes
------------------------------------------------------------------------------*/

/* Already installed theme */
.theme-browser .theme .theme-installed {
	background: $wp-blue-50;
}
.theme-browser .theme .notice-success p:before {
	color: $wp-green-20;
	content: "\f147";
	display: inline-block;
	font: normal 20px/1 'dashicons';
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	vertical-align: top;
}

.upload-theme .wp-upload-form,
.upload-plugin .wp-upload-form {
	background: $wp-gray-0;
	border: 1px solid $wp-gray-5;
	padding: 30px;
	margin: 30px auto;
	max-width: 380px;
}
.upload-theme .install-help,
.upload-plugin .install-help {
	color: $wp-gray-60; /* $wp-gray-0 background */
	font-size: 18px;
	font-style: normal;
	margin: 0;
	padding: 0;
	text-align: center;
}

p.no-themes,
p.no-themes-local {
	clear: both;
	color: $wp-gray-50;
	font-size: 18px;
	font-style: normal;
	margin: 0;
	padding: 100px 0;
	text-align: center;
	display: none;
}


.theme-details .num-ratings,
.theme-details .no-rating {
	font-size: 11px;
	color: $wp-gray-50;
}

/*------------------------------------------------------------------------------
  16.3 - Custom Header Screen
------------------------------------------------------------------------------*/

.appearance_page_custom-header #headimg {
	border: 1px solid $wp-gray-5;
	overflow: hidden;
	width: 100%;
}


/*------------------------------------------------------------------------------
  16.4 - Custom Background Screen
------------------------------------------------------------------------------*/

div#custom-background-image {
	min-height: 100px;
	border: 1px solid $wp-gray-5;
}

div#custom-background-image img {
	max-width: 400px;
	max-height: 300px;
}

.background-position-control input[type="radio"]:checked ~ .button {
	background: $wp-gray-0;
	border-color: $wp-gray-30;
	box-shadow: inset 0 2px 5px -3px rgba($wp-black, 0.5);
	z-index: 1;
}

.background-position-control input[type="radio"]:focus ~ .button {
	border-color: $wp-blue-30;
	box-shadow: inset 0 2px 5px -3px rgba($wp-black, 0.5), 0 0 3px rgba($wp-blue-50, 0.8);
	color: $wp-gray-90;
}

.background-position-control .background-position-center-icon,
.background-position-control .background-position-center-icon:before {
	display: inline-block;
	line-height: 1;
	text-align: center;
	transition: background-color .1s ease-in;
}

.background-position-control .background-position-center-icon {
	height: 20px;
	margin-top: 13px;
	vertical-align: top;
	width: 20px;
}

.background-position-control .background-position-center-icon:before {
	background-color: $wp-gray-60;
	border-radius: 50%;
	content: "";
	height: 12px;
	width: 12px;
}

.background-position-control .button:hover .background-position-center-icon:before,
.background-position-control input[type="radio"]:focus ~ .button .background-position-center-icon:before {
	background-color: $wp-gray-90;
}

.background-position-control .button-group {
	display: block;
}

.background-position-control .button-group .button {
	border-radius: 0;
	box-shadow: none;
	/* Following properties are overridden by buttons responsive styles (see: wp-includes/css/buttons.css). */
	height: 40px !important;
	line-height: 2.9 !important;
	margin: 0 -1px 0 0 !important;
	padding: 0 10px 1px !important;
	position: relative;
}

.background-position-control .button-group .button:active,
.background-position-control .button-group .button:hover,
.background-position-control .button-group .button:focus {
	z-index: 1;
}

.background-position-control .button-group:last-child .button {
	box-shadow: 0 1px 0 $wp-gray-10;
}

/*------------------------------------------------------------------------------
  23.0 - Full Overlay w/ Sidebar
------------------------------------------------------------------------------*/

body.full-overlay-active {
	overflow: hidden;
	/* Hide all the content, the Customizer overlay is then made visible to be the only available content. */
	visibility: hidden;
}

.wp-full-overlay {
	background: transparent;
	z-index: 500000;
	position: fixed;
	overflow: visible;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	height: 100%;
	min-width: 0;
}

.wp-full-overlay-sidebar {
	box-sizing: border-box;
	position: fixed;
	min-width: 300px;
	max-width: 600px;
	width: 18%;
	height: 100%;
	top: 0;
	bottom: 0;
	left: 0;
	padding: 0;
	margin: 0;
	z-index: 10;
	background: $wp-gray-0;
	border-right: none;
}

.wp-full-overlay.collapsed .wp-full-overlay-sidebar {
	overflow: visible;
}

.wp-full-overlay.collapsed,
.wp-full-overlay.expanded .wp-full-overlay-sidebar {
	margin-left: 0 !important;
}

.wp-full-overlay.expanded {
	margin-left: 300px;
}

.wp-full-overlay.collapsed .wp-full-overlay-sidebar {
	margin-left: -300px;
}

@media screen and (min-width: 1667px) {
	.wp-full-overlay.expanded {
		margin-left: 18%;
	}

	.wp-full-overlay.collapsed .wp-full-overlay-sidebar {
		margin-left: -18%;
	}
}

@media screen and (min-width: 3333px) {
	.wp-full-overlay.expanded {
		margin-left: 600px;
	}

	.wp-full-overlay.collapsed .wp-full-overlay-sidebar {
		margin-left: -600px;
	}
}

.wp-full-overlay-sidebar:after {
	content: "";
	display: block;
	position: absolute;
	top: 0;
	bottom: 0;
	right: 0;
	width: 3px;
	z-index: 1000;
}

.wp-full-overlay-main {
	position: absolute;
	left: 0;
	right: 0;
	top: 0;
	bottom: 0;
	height: 100%;
}

.wp-full-overlay-sidebar .wp-full-overlay-header {
	position: absolute;
	left: 0;
	right: 0;
	height: 45px;
	padding: 0 15px;
	line-height: 3.2;
	z-index: 10;
	margin: 0;
	border-top: none;
	box-shadow: none;
}

.wp-full-overlay-sidebar .wp-full-overlay-header a.back {
	margin-top: 9px;
}

.wp-full-overlay-sidebar .wp-full-overlay-footer {
	bottom: 0;
	border-bottom: none;
	border-top: none;
	box-shadow: none;
}

.wp-full-overlay-sidebar .wp-full-overlay-sidebar-content {
	position: absolute;
	top: 45px;
	bottom: 45px;
	left: 0;
	right: 0;
	overflow: auto;
}

/* Close & Navigation Links */
.theme-install-overlay .wp-full-overlay-sidebar .wp-full-overlay-header {
	padding: 0;
}

.theme-install-overlay .close-full-overlay,
.theme-install-overlay .previous-theme,
.theme-install-overlay .next-theme {
	display: block;
	position: relative;
	float: left;
	width: 45px;
	height: 45px;
	padding-right: 2px;
	background: $wp-gray-0;
	border-right: 1px solid $wp-gray-5;
	color: $wp-gray-70;
	cursor: pointer;
	text-decoration: none;
	transition: color .1s ease-in-out, background .1s ease-in-out;
}

.theme-install-overlay .close-full-overlay:hover,
.theme-install-overlay .close-full-overlay:focus,
.theme-install-overlay .previous-theme:hover,
.theme-install-overlay .previous-theme:focus,
.theme-install-overlay .next-theme:hover,
.theme-install-overlay .next-theme:focus {
	background: $wp-gray-5;
	border-color: $wp-gray-10;
	color: $wp-black;
	outline: none;
	box-shadow: none;
}

.theme-install-overlay .close-full-overlay:before {
	font: normal 22px/1 dashicons;
	content: "\f335";
	position: relative;
	top: 7px;
	left: 13px;
}

.theme-install-overlay .previous-theme:before {
	font: normal 20px/1 dashicons;
	content: "\f341";
	position: relative;
	top: 6px;
	left: 14px;
}

.theme-install-overlay .next-theme:before {
	font: normal 20px/1 dashicons;
	content: "\f345";
	position: relative;
	top: 6px;
	left: 13px;
}

.theme-install-overlay .previous-theme.disabled,
.theme-install-overlay .next-theme.disabled,
.theme-install-overlay .previous-theme.disabled:hover,
.theme-install-overlay .previous-theme.disabled:focus,
.theme-install-overlay .next-theme.disabled:hover,
.theme-install-overlay .next-theme.disabled:focus {
	color: $wp-gray-10;
	background: $wp-gray-0;
	cursor: default;
	pointer-events: none;
}

.theme-install-overlay .close-full-overlay,
.theme-install-overlay .previous-theme,
.theme-install-overlay .next-theme {
	border-left: 0;
	border-top: 0;
	border-bottom: 0;
}

.theme-install-overlay .close-full-overlay:before,
.theme-install-overlay .previous-theme:before,
.theme-install-overlay .next-theme:before {
	top: 2px;
	left: 0;
}

/* Collapse Button */
.wp-core-ui .wp-full-overlay .collapse-sidebar {
	position: fixed;
	bottom: 0;
	left: 0;
	padding: 9px 0 9px 10px;
	height: 45px;
	color: $wp-gray-50;
	outline: 0;
	line-height: 1;
	background-color: transparent !important;
	border: none !important;
	box-shadow: none !important;
	border-radius: 0 !important;
}

.wp-core-ui .wp-full-overlay .collapse-sidebar:hover,
.wp-core-ui .wp-full-overlay .collapse-sidebar:focus {
	color: $wp-blue-50;
}

.wp-full-overlay .collapse-sidebar-arrow,
.wp-full-overlay .collapse-sidebar-label {
	display: inline-block;
	vertical-align: middle;
	line-height: 1.6;
}

.wp-full-overlay .collapse-sidebar-arrow {
	width: 20px;
	height: 20px;
	margin: 0 2px; /* avoid the focus box-shadow to be cut-off */
	border-radius: 50%;
	overflow: hidden;
}

.wp-full-overlay .collapse-sidebar:hover .collapse-sidebar-arrow,
.wp-full-overlay .collapse-sidebar:focus .collapse-sidebar-arrow {
	box-shadow:
		0 0 0 1px $wp-blue-30,
		0 0 2px 1px rgba($wp-blue-40, 0.8);
}

.wp-full-overlay .collapse-sidebar-label {
	margin-left: 3px;
}

.wp-full-overlay.collapsed .collapse-sidebar-label {
	display: none;
}

.wp-full-overlay .collapse-sidebar-arrow:before {
	display: block;
	content: "\f148";
	background: $wp-gray-0;
	font: normal 20px/1 dashicons;
	speak: none;
	padding: 0;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
}

.wp-core-ui .wp-full-overlay.collapsed .collapse-sidebar {
	padding: 9px 10px;
}

/* rtl:ignore */
.wp-full-overlay.collapsed .collapse-sidebar-arrow:before,
.rtl .wp-full-overlay .collapse-sidebar-arrow:before {
	transform: rotate(180.001deg); /* Firefox: promoting to its own layer to trigger anti-aliasing */
}

.rtl .wp-full-overlay.collapsed .collapse-sidebar-arrow:before {
	transform: none;
}

/* Animations */
.wp-full-overlay,
.wp-full-overlay-sidebar,
.wp-full-overlay .collapse-sidebar,
.wp-full-overlay-main {
	transition-property: left, right, top, bottom, width, margin;
	transition-duration: 0.2s;
}

/* Device/preview size toggles */

.wp-full-overlay {
	background: $wp-gray-90;
}

.wp-full-overlay-main {
	background-color: $wp-gray-0;
}

.expanded .wp-full-overlay-footer {
	position: fixed;
	bottom: 0;
	left: 0;
	min-width: 299px;
	max-width: 599px;
	width: 18%;
	width: calc( 18% - 1px );
	height: 45px;
	border-top: 1px solid $wp-gray-5;
	background: $wp-gray-0;
}

.wp-full-overlay-footer .devices-wrapper {
	float: right;
}

.wp-full-overlay-footer .devices {
	position: relative;
	background: $wp-gray-0;
	box-shadow: -20px 0 10px -5px $wp-gray-0;
}

.wp-full-overlay-footer .devices button {
	cursor: pointer;
	background: transparent;
	border: none;
	height: 45px;
	padding: 0 3px;
	margin: 0 0 0 -4px;
	box-shadow: none;
	border-top: 1px solid transparent;
	border-bottom: 4px solid transparent;
	transition:
		.15s color ease-in-out,
		.15s background-color ease-in-out,
		.15s border-color ease-in-out;
}

.wp-full-overlay-footer .devices button:focus {
	box-shadow: none;
	outline: none;
}

.wp-full-overlay-footer .devices button:before {
	display: inline-block;
	-webkit-font-smoothing: antialiased;
	font: normal 20px/30px "dashicons";
	vertical-align: top;
	margin: 3px 0;
	padding: 4px 8px;
	color: $wp-gray-50;
}

.wp-full-overlay-footer .devices button.active {
	border-bottom-color: $wp-gray-90;
}

.wp-full-overlay-footer .devices button:hover,
.wp-full-overlay-footer .devices button:focus {
	background-color: $wp-white;
}

.wp-full-overlay-footer .devices button:focus,
.wp-full-overlay-footer .devices button.active:hover {
	border-bottom-color: $wp-blue-50;
}

.wp-full-overlay-footer .devices button.active:before {
	color: $wp-gray-90;
}

.wp-full-overlay-footer .devices button:hover:before,
.wp-full-overlay-footer .devices button:focus:before {
	color: $wp-blue-50;
}

.wp-full-overlay-footer .devices .preview-desktop:before {
	content: "\f472";
}

.wp-full-overlay-footer .devices .preview-tablet:before {
	content: "\f471";
}

.wp-full-overlay-footer .devices .preview-mobile:before {
	content: "\f470";
}

@media screen and (max-width: 1024px) {
	.wp-full-overlay-footer .devices {
		display: none;
	}
}

.collapsed .wp-full-overlay-footer .devices button:before {
	display: none;
}

.preview-mobile .wp-full-overlay-main {
	margin: auto 0 auto -160px;
	width: 320px;
	height: 480px;
	max-height: 100%;
	max-width: 100%;
	left: 50%;
}

.preview-tablet .wp-full-overlay-main {
	margin: auto 0 auto -360px;
	width: 720px; /* Size is loosely based on a typical "tablet" device size. Intentionally ambiguous - this does not represent any particular device precisely. */
	height: 1080px;
	max-height: 100%;
	max-width: 100%;
	left: 50%;
}


/*------------------------------------------------------------------------------
  24.0 - Customize Loader
------------------------------------------------------------------------------*/


#customize-container,
#customize-controls .notice.notification-overlay {
	background: $wp-gray-0;
	z-index: 500000;
	position: fixed;
	overflow: visible;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
	height: 100%;
}

.install-theme-info .theme-screenshot {
	margin: 15px 0;
	width: 258px;
	border: 1px solid $wp-gray-10;
}

.install-theme-info .theme-details {
	overflow: hidden;
}

.theme-details .theme-version {
	margin: 15px 0;
}

.theme-details .theme-description {
	float: left;
	color: $wp-gray-50;
	line-height: 1.6;
	max-width: 100%;
}

.theme-install-overlay .wp-full-overlay-header .button {
	float: right;
	margin: 8px 10px 0 0;
	/* For when .theme-install is a span rather than a.button-primary (already installed theme) */
	line-height: 2;
}

.theme-install-overlay .wp-full-overlay-sidebar {
	background: $wp-gray-0;
	border-right: 1px solid $wp-gray-5;
}

.theme-install-overlay .wp-full-overlay-sidebar-content {
	background: $wp-white;
	border-top: 1px solid $wp-gray-5;
	border-bottom: 1px solid $wp-gray-5;
}

.theme-install-overlay .wp-full-overlay-main {
	position: absolute;
	z-index: 0;
	background-color: $wp-gray-0;
}

.customize-loading #customize-container {
	background-color: $wp-gray-0;
}


// about.css

.about-wrap hr {
	border: 0;
	height: 0;
	margin: 3em 0 0;
	border-top: 1px solid rgba($wp-black, 0.1);
}

.wp-badge {
	background: $wp-blue-50 url(../images/w-logo-white.png?ver=20160308) no-repeat;
	background-position: center 25px;
	background-size: 80px 80px;
	color: $wp-white;
	font-size: 14px;
	text-align: center;
	font-weight: 600;
	margin: 5px 0 0;
	padding-top: 120px;
	height: 40px;
	display: inline-block;
	width: 140px;
	text-rendering: optimizeLegibility;
	box-shadow: 0 1px 3px rgba($wp-black, 0.2);
}

.about-wrap h1 {
	margin: 0.2em 200px 0 0;
	padding: 0;
	color: $wp-gray-80;
	line-height: 1.2;
	font-size: 2.8em;
	font-weight: 400;
}

.about-wrap h4 {
	font-size: 16px;
	color: $wp-gray-90;
}

.about-wrap .about-text {
	margin: 1em 200px 1em 0;
	color: $wp-gray-60;
}

.about-wrap .point-releases {
	margin-top: 5px;
	border-bottom: 1px solid $wp-gray-5;
}

// nav-menus.css

.is-submenu {
	color: $wp-gray-60; /* $wp-gray-0 background */
	font-style: italic;
	font-weight: 400;
	margin-left: 4px;
}

.manage-menus {
	margin-top: 23px;
	padding: 10px;
	overflow: hidden;
	background: $wp-gray-0;
}

.menu-settings {
	border-top: 1px solid $wp-gray-0;
	margin-top: 2em;
}

.theme-location-set {
	color: $wp-gray-50;
	font-size: 11px;
}

.nav-menus-php #post-body {
	padding: 0 10px;
	border-top: 1px solid $wp-white;
	border-bottom: 1px solid $wp-gray-5;
	background: $wp-white;
}

#nav-menu-header,
#nav-menu-footer {
	padding: 0 10px;
	background: $wp-gray-0;
}

#nav-menu-header {
	border-bottom: 1px solid $wp-gray-5;
	margin-bottom: 0;
}

.locations-edit-menu-link {
	padding-right: 3px;
	border-right: 1px solid $wp-gray-10;
}

.menu-item-bar .menu-item-handle {
	border: 1px solid $wp-gray-5;
	position: relative;
	padding: 10px 15px;
	height: auto;
	min-height: 20px;
	width: 382px;
	line-height: 2.4;
	overflow: hidden;
	word-wrap: break-word;
}

.menu-item-bar .menu-item-handle:hover {
	border-color: $wp-gray-30;
}

#menu-to-edit .menu-item-invalid .menu-item-handle {
	background: $wp-red-5;
	border-color: $wp-red-10;
}

.menu li.deleting .menu-item-handle {
	background-image: none;
	background-color: $wp-red-30;
}

.menu-item-handle .menu-item-title.no-title {
	color: $wp-gray-50;
}

/* Menu item controls */
.item-type {
	display: inline-block;
	padding: 12px 16px;
	color: $wp-gray-50;
	font-size: 12px;
	line-height: 1.5;
}

.no-js.nav-menus-php .item-edit {
	position: static;
	float: right;
	width: auto;
	height: auto;
	margin: 12px -10px 12px 0;
	padding: 0;
	color: $wp-blue-50;
	text-decoration: underline;
	font-size: 12px;
	line-height: 1.5;
}

.nav-menus-php .item-edit:focus:before {
	box-shadow:
		0 0 0 1px $wp-blue-30,
		0 0 2px 1px rgba($wp-blue-40, 0.8);
}

/* Menu editing */
.menu-instructions-inactive {
	display: none;
}

.menu-item-settings {
	display: block;
	width: 402px;
	padding: 10px 0 10px 10px;
	position: relative;
	z-index: 10; /* Keep .item-title's shadow from appearing on top of .menu-item-settings */
	border: 1px solid $wp-gray-5;
	border-top: none;
	box-shadow: 0 1px 1px rgba($wp-black, 0.04);
}

.link-to-original {
	display: block;
	margin: 0 0 15px;
	padding: 3px 5px 5px;
	border: 1px solid $wp-gray-5;
	color: $wp-gray-50;
	font-size: 12px;
	font-style: italic;
}

// widgets.css

/* General Widgets Styles */

.widget-top {
	font-size: 13px;
	font-weight: 600;
	background: $wp-gray-0;
}

.in-widget-title,
#widgets-right a.widget-control-edit,
#available-widgets .widget-description {
	color: $wp-gray-50;
}

.deleting .widget-title,
.deleting .widget-top .widget-action .toggle-indicator:before {
	color: $wp-gray-20;
}

.media-widget-control .attachment-media-view .button-add-media,
.media-widget-control .placeholder {
	border: 1px dashed $wp-gray-10;
	box-sizing: border-box;
	cursor: pointer;
	line-height: 1.6;
	padding: 9px 0;
	position: relative;
	text-align: center;
	width: 100%;
}

.media-widget-control .attachment-media-view .button-add-media {
	cursor: pointer;
	background-color: $wp-gray-0;
	color: $wp-gray-80;
}

.media-widget-control .attachment-media-view .button-add-media:hover {
	background-color: $wp-gray-0;
}

.media-widget-control .attachment-media-view .button-add-media:focus {
	background-color: $wp-gray-0;
	border-style: solid;
	border-color: $wp-blue-30;
	box-shadow: 0 0 3px rgba( $wp-blue-50, .8 );
	/* Only visible in Windows High Contrast mode */
	outline: 2px solid transparent;
	outline-offset: -2px;
}

.media-widget-control .media-widget-preview .wp-video-shortcode {
	background: $wp-black;
}

.media-widget-video-link .dashicons {
	font: normal 60px/1 'dashicons';
	position: relative;
	width: 100%;
	top: -90px;
	color: white;
	text-decoration: none;
}


.media-frame #embed-url-field.invalid,
.media-widget-image-link > .link:invalid {
	border: 1px solid $wp-red-50;
}

.media-widget-preview .placeholder {
	background: $wp-gray-0;
}

.media-widget-gallery-preview .gallery-icon-placeholder {
	position: absolute;
	top: 0;
	bottom: 0;
	width: 100%;
	box-sizing: border-box;
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: rgba($wp-black, 0.5);
}

.media-widget-gallery-preview .gallery-icon-placeholder-text {
	font-weight: 600;
	font-size: 2em;
	color: white;
}

.widget-placeholder {
	border: 1px dashed $wp-gray-10;
	margin: 0 auto 10px;
	height: 45px;
	width: 100%;
	box-sizing: border-box;
}

.sidebar-name .handlediv:focus .toggle-indicator:before {
	box-shadow:
		0 0 0 1px $wp-blue-30,
		0 0 2px 1px rgba($wp-blue-40, 0.8);
}

.widgets-holder-wrap .description {
	padding: 0 0 15px;
	margin: 0;
	font-style: normal;
	color: $wp-gray-50;
}

.widget-holder .description,
.inactive-sidebar .description {
	color: $wp-gray-60;
}

/* Dragging a widget over a closed sidebar */
#widgets-right .widgets-holder-wrap.widget-hover {
	border-color: $wp-gray-50;
	box-shadow: 0 1px 2px rgba($wp-black, 0.3);
}

.widgets_access #widgets-left .widget .widget-top:hover,
.widgets_access #widgets-right .widget .widget-top:hover {
	border-color: $wp-gray-5;
}

.widget-control-edit {
	display: block;
	color: $wp-gray-50;
	background: $wp-gray-0;
	padding: 0 15px;
	line-height: 3.35;
	border-left: 1px solid $wp-gray-5;
}

#widgets-left .widget-control-edit:hover,
#widgets-right .widget-control-edit:hover {
	color: $wp-white;
	background: $wp-gray-70;
	border-left: 0;
	outline: 1px solid $wp-gray-70;
}

.widget-inside {
	background: $wp-white;
}

.js #removing-widget {
	color: $wp-blue-30;
}

.widgets-chooser ul,
#widgets-left .widget-in-question .widget-top,
#available-widgets .widget-top:hover,
div#widgets-right .widget-top:hover,
#widgets-left .widget-top:hover {
	border-color: $wp-gray-30;
	box-shadow: 0 1px 2px rgba($wp-black, 0.1);
}

.widgets-chooser ul {
	border: 1px solid $wp-gray-10;
}

.widgets-chooser li {
	border-bottom: 1px solid $wp-gray-10;
	background: $wp-white;
	margin: 0;
	position: relative;
}

.widgets-chooser .widgets-chooser-selected .widgets-chooser-button {
	background: $wp-blue-50;
	color: $wp-white;
}

.widgets-chooser .widgets-chooser-selected:before {
	content: "\f147";
	display: block;
	-webkit-font-smoothing: antialiased;
	font: normal 26px/1 dashicons;
	color: $wp-white;
	position: absolute;
	top: 7px;
	left: 5px;
}

.custom-html-widget-fields > p > .CodeMirror {
	border: 1px solid $wp-gray-5;
}


// site-icon.css

.site-icon-preview .app-icon-preview {
	background-color: $wp-black;
	border-radius: 16px;
	height: 64px;
	overflow: hidden;
	width: 64px;
	margin-top: 5px;
}

// site-health.css

.health-check-header {
	text-align: center;
	margin: 0 0 1rem;
	background: $wp-white;
	border-bottom: 1px solid #e2e4e7;
}

.site-health-progress.loading svg #bar {
	stroke-dashoffset: 0;
	stroke: #adc5d2;
	animation: loadingPulse 3s infinite ease-in-out;
}

.site-health-progress svg circle {
	stroke-dashoffset: 0;
	transition: stroke-dashoffset 1s linear;
	stroke: $wp-gray-10;
	stroke-width: 2em;
}

.site-health-progress svg #bar {
	stroke-dashoffset: 565;
	stroke: $wp-red-50;
}

.site-health-progress svg #bar.green {
	stroke: $wp-green-20;
}

.site-health-progress svg #bar.orange {
	stroke: $wp-yellow-30;
}

@keyframes loadingPulse {
	0% {
		stroke: #adc5d2;
	}
	50% {
		stroke: $wp-blue-30;
	}
	100% {
		stroke: #adc5d2;
	}
}

.health-check-tab:focus {
	color: $wp-gray-90;
	outline: 1px solid #6c7781;
	box-shadow: none;
}

.health-check-tab.active {
	box-shadow: inset 0 -3px #007cba;
	font-weight: 600;
}

.health-check-body .pass::before,
.health-check-body .good::before {
	content: "\f147";
	color: $wp-green-20;
}

.health-check-body .warning::before {
	content: "\f460";
	color: $wp-yellow-30;
}

.health-check-body .info::before {
	content: "\f348";
	color: $wp-blue-30;
}

.health-check-body .fail::before,
.health-check-body .error::before {
	content: "\f335";
	color: $wp-red-50;
}

.site-health-copy-buttons .success {
	display: none;
	color: $wp-green-30;
	line-height: 1.8;
	margin-left: 0.5rem;
}

.health-check-accordion {
	border: 1px solid #e2e4e7;
}

.health-check-accordion-heading {
	margin: 0;
	border-top: 1px solid #e2e4e7;
	font-size: inherit;
	line-height: inherit;
	font-weight: 600;
	color: inherit;
}

.health-check-accordion-trigger {
	background: $wp-white;
	border: 0;
	color: $wp-gray-80;
	cursor: pointer;
	display: flex;
	font-weight: 400;
	margin: 0;
	padding: 1em 3.5em 1em 1.5em;
	min-height: 46px;
	position: relative;
	text-align: left;
	width: 100%;
	align-items: center;
	justify-content: space-between;
}

.health-check-accordion-trigger:hover,
.health-check-accordion-trigger:active {
	background: $wp-gray-0;
}

.health-check-accordion-trigger:focus {
	color: $wp-gray-90;
	border: none;
	box-shadow: none;
	outline-offset: -2px;
	outline: 1px dotted $wp-gray-60;
}

.health-check-accordion-trigger .icon,
.site-health-view-passed .icon {
	border: solid $wp-gray-60;
	border-width: 0 2px 2px 0;
	height: 0.5rem;
	pointer-events: none;
	position: absolute;
	right: 1.5em;
	top: 50%;
	transform: translateY(-70%) rotate(45deg);
	width: 0.5rem;
}

.health-check-accordion-trigger .badge {
	padding: 0.1rem 0.5rem 0.15rem;
	color: $wp-gray-80;
	font-weight: 600;
	margin-left: 0.5rem;
}

.health-check-accordion-trigger .badge.blue {
	border: 1px solid $wp-blue-5;
}

.health-check-accordion-trigger .badge.orange {
	border: 1px solid $wp-yellow-30;
}

.health-check-accordion-trigger .badge.red {
	border: 1px solid $wp-red-50;
}

.health-check-accordion-trigger .badge.green {
	border: 1px solid $wp-green-20;
}

.health-check-accordion-trigger .badge.purple {
	border: 1px solid #826eb4;
}

.health-check-accordion-trigger .badge.gray {
	border: 1px solid #ccd0d4;
}

.health-check-accordion-panel {
	margin: 0;
	padding: 1em 1.5em;
	background: $wp-white;
}


/* ----------------------------------------------------------------------------
  2.0 - Default Button Style
---------------------------------------------------------------------------- */

.wp-core-ui .button,
.wp-core-ui .button-secondary {
	color: $wp-gray-50;
	border-color: $wp-gray-10;
	background: $wp-gray-0;
	box-shadow: 0 1px 0 $wp-gray-10;
	vertical-align: top;
}

.wp-core-ui p .button {
	vertical-align: baseline;
}

.wp-core-ui .button.hover,
.wp-core-ui .button:hover,
.wp-core-ui .button-secondary:hover,
.wp-core-ui .button.focus,
.wp-core-ui .button:focus,
.wp-core-ui .button-secondary:focus {
	background: $wp-gray-0;
	border-color: $wp-gray-30;
	color: $wp-gray-90;
}

.wp-core-ui .button.focus,
.wp-core-ui .button:focus,
.wp-core-ui .button-secondary:focus {
	border-color: $wp-blue-30;
	box-shadow: 0 0 3px rgba($wp-blue-50, 0.8);
}

.wp-core-ui .button.active,
.wp-core-ui .button.active:hover,
.wp-core-ui .button:active,
.wp-core-ui .button-secondary:active {
	background: $wp-gray-0;
	border-color: $wp-gray-30;
	box-shadow: inset 0 2px 5px -3px rgba($wp-black, 0.5);
	transform: translateY(1px);
}

.wp-core-ui .button.active:focus {
	border-color: $wp-blue-30;
	box-shadow:
		inset 0 2px 5px -3px rgba($wp-black, 0.5),
		0 0 3px rgba($wp-blue-50, 0.8);
}

.wp-core-ui .button[disabled],
.wp-core-ui .button:disabled,
.wp-core-ui .button.disabled,
.wp-core-ui .button-secondary[disabled],
.wp-core-ui .button-secondary:disabled,
.wp-core-ui .button-secondary.disabled,
.wp-core-ui .button-disabled {
	color: $wp-gray-20 !important;
	border-color: $wp-gray-5 !important;
	background: $wp-gray-0 !important;
	box-shadow: none !important;
	text-shadow: 0 1px 0 $wp-white !important;
	cursor: default;
	transform: none !important;
}

/* Buttons that look like links, for a cross of good semantics with the visual */
.wp-core-ui .button-link {
	margin: 0;
	padding: 0;
	box-shadow: none;
	border: 0;
	border-radius: 0;
	background: none;
	cursor: pointer;
	text-align: left;
	/* Mimics the default link style in common.css */
	color: $wp-blue-50;
	text-decoration: underline;
	transition-property: border, background, color;
	transition-duration: .05s;
	transition-timing-function: ease-in-out;
}

.wp-core-ui .button-link:hover,
.wp-core-ui .button-link:active {
	color: $wp-blue-30;
}

.wp-core-ui .button-link:focus {
	color: $wp-blue-70;
	box-shadow:
		0 0 0 1px $wp-blue-30,
		0 0 2px 1px rgba($wp-blue-40, 0.8);
	/* Only visible in Windows High Contrast mode */
	outline: 1px solid transparent;
}

.wp-core-ui .button-link-delete {
	color: $wp-red-70;
}

.wp-core-ui .button-link-delete:hover,
.wp-core-ui .button-link-delete:focus {
	color: $wp-red-50;
}

.ie8 .wp-core-ui .button-link:focus {
	outline: $wp-blue-30 solid 1px;
}

/* ----------------------------------------------------------------------------
  3.0 - Primary Button Style
---------------------------------------------------------------------------- */

.wp-core-ui .button-primary {
	background: $wp-blue-50;
	border-color: $wp-blue-50 $wp-blue-60 $wp-blue-60;
	box-shadow: 0 1px 0 $wp-blue-60;
	color: $wp-white;
	text-decoration: none;
	text-shadow: 0 -1px 1px $wp-blue-60,
		1px 0 1px $wp-blue-60,
		0 1px 1px $wp-blue-60,
		-1px 0 1px $wp-blue-60;
}

.wp-core-ui .button-primary.hover,
.wp-core-ui .button-primary:hover,
.wp-core-ui .button-primary.focus,
.wp-core-ui .button-primary:focus {
	background: $wp-blue-50;
	border-color: $wp-blue-60;
	color: $wp-white;
}

.wp-core-ui .button-primary.focus,
.wp-core-ui .button-primary:focus {
	box-shadow: 0 1px 0 $wp-blue-50,
		0 0 2px 1px $wp-blue-30;
}

.wp-core-ui .button-primary.active,
.wp-core-ui .button-primary.active:hover,
.wp-core-ui .button-primary.active:focus,
.wp-core-ui .button-primary:active {
	background: $wp-blue-50;
	border-color: $wp-blue-60;
	box-shadow: inset 0 2px 0 $wp-blue-60;
}

.wp-core-ui .button-primary[disabled],
.wp-core-ui .button-primary:disabled,
.wp-core-ui .button-primary-disabled,
.wp-core-ui .button-primary.disabled {
	color: $wp-blue-20 !important;
	background: $wp-blue-40 !important;
	border-color: $wp-blue-40 !important;
	box-shadow: none !important;
	text-shadow: 0 -1px 0 rgba($wp-black, 0.1) !important;
	cursor: default;
}

.wp-core-ui .button.button-primary.button-hero {
	box-shadow: 0 2px 0 $wp-blue-60;
}

.wp-core-ui .button.button-primary.button-hero:focus {
	box-shadow:
		0 2px 0 $wp-blue-60,
		0 1px 0 $wp-blue-50,
		0 0 2px 1px $wp-blue-30;
}

.wp-core-ui .button.button-primary.button-hero.active,
.wp-core-ui .button.button-primary.button-hero.active:hover,
.wp-core-ui .button.button-primary.button-hero.active:focus,
.wp-core-ui .button.button-primary.button-hero:active {
	box-shadow: inset 0 3px 0 $wp-blue-60;
}

// admin-bar.css

#wpadminbar .ab-empty-item,
#wpadminbar a.ab-item,
#wpadminbar > #wp-toolbar span.ab-label,
#wpadminbar > #wp-toolbar span.noticon {
	color: $wp-gray-0;
}

#wpadminbar {
	direction: ltr;
	color: $wp-gray-10;
	font-size: 13px;
	font-weight: 400;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
	line-height: 32px;
	height: 32px;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	min-width: 600px; /* match the min-width of the body in wp-admin/css/common.css */
	z-index: 99999;
	background: $wp-gray-90;
}

#wpadminbar .menupop .ab-sub-wrapper,
#wpadminbar .shortlink-input {
	margin: 0;
	padding: 0;
	box-shadow: 0 3px 5px rgba($wp-black, 0.2);
	background: $wp-gray-80;
	display: none;
	position: absolute;
	float: none;
}

#wpadminbar:not(.mobile) .ab-top-menu > li > .ab-item:focus,
#wpadminbar.nojq .quicklinks .ab-top-menu > li > .ab-item:focus,
#wpadminbar:not(.mobile) .ab-top-menu > li:hover > .ab-item,
#wpadminbar .ab-top-menu > li.hover > .ab-item {
	background: $wp-gray-80;
	color: $wp-blue-20;
}

#wpadminbar:not(.mobile) > #wp-toolbar li:hover span.ab-label,
#wpadminbar > #wp-toolbar li.hover span.ab-label,
#wpadminbar:not(.mobile) > #wp-toolbar a:focus span.ab-label {
	color: $wp-blue-20;
}

#wpadminbar .ab-icon:before,
#wpadminbar .ab-item:before,
#wpadminbar #adminbarsearch:before {
	color: $wp-gray-20;
	color: rgba($wp-blue-0, 0.6);
}

#wpadminbar .ab-submenu .ab-item {
	color: $wp-gray-10;
	color: rgba($wp-blue-0, 0.7);
}

#wpadminbar .quicklinks .menupop ul li a,
#wpadminbar .quicklinks .menupop ul li a strong,
#wpadminbar .quicklinks .menupop.hover ul li a,
#wpadminbar.nojs .quicklinks .menupop:hover ul li a {
	color: $wp-gray-10;
	color: rgba($wp-blue-0, 0.7);
}

#wpadminbar .quicklinks .menupop ul li a:hover,
#wpadminbar .quicklinks .menupop ul li a:focus,
#wpadminbar .quicklinks .menupop ul li a:hover strong,
#wpadminbar .quicklinks .menupop ul li a:focus strong,
#wpadminbar .quicklinks .ab-sub-wrapper .menupop.hover > a,
#wpadminbar .quicklinks .menupop.hover ul li a:hover,
#wpadminbar .quicklinks .menupop.hover ul li a:focus,
#wpadminbar .quicklinks .menupop.hover ul li div[tabindex]:hover,
#wpadminbar .quicklinks .menupop.hover ul li div[tabindex]:focus,
#wpadminbar.nojs .quicklinks .menupop:hover ul li a:hover,
#wpadminbar.nojs .quicklinks .menupop:hover ul li a:focus,
#wpadminbar li:hover .ab-icon:before,
#wpadminbar li:hover .ab-item:before,
#wpadminbar li a:focus .ab-icon:before,
#wpadminbar li .ab-item:focus:before,
#wpadminbar li .ab-item:focus .ab-icon:before,
#wpadminbar li.hover .ab-icon:before,
#wpadminbar li.hover .ab-item:before,
#wpadminbar li:hover #adminbarsearch:before,
#wpadminbar li #adminbarsearch.adminbar-focused:before {
	color: $wp-blue-20;
}

#wpadminbar.mobile .quicklinks .ab-icon:before,
#wpadminbar.mobile .quicklinks .ab-item:before {
	color: $wp-gray-10;
}

#wpadminbar.mobile .quicklinks .hover .ab-icon:before,
#wpadminbar.mobile .quicklinks .hover .ab-item:before {
	color: $wp-blue-20;
}

#wpadminbar .ab-top-secondary .menupop .menupop > .ab-item .wp-admin-bar-arrow:before {
	top: 1px;
	left: 6px;
	content: "\f141";
}

#wpadminbar .quicklinks .menupop ul.ab-sub-secondary,
#wpadminbar .quicklinks .menupop ul.ab-sub-secondary .ab-submenu {
	background: $wp-gray-70;
}

#wpadminbar .quicklinks .menupop .ab-sub-secondary > li > a:hover,
#wpadminbar .quicklinks .menupop .ab-sub-secondary > li .ab-item:focus a {
	color: $wp-blue-20;
}

#wpadminbar .quicklinks a span#ab-updates {
	background: $wp-gray-0;
	color: $wp-gray-80;
	display: inline;
	padding: 2px 5px;
	font-size: 10px;
	font-weight: 600;
	border-radius: 10px;
}

#wpadminbar .quicklinks a:hover span#ab-updates {
	background: $wp-white;
	color: $wp-black;
}

/**
 * Recovery Mode
 */
#wpadminbar #wp-admin-bar-recovery-mode {
	color: $wp-white;
	background-color: $wp-red-50;
}

#wpadminbar .ab-top-menu > #wp-admin-bar-recovery-mode.hover >.ab-item,
#wpadminbar.nojq .quicklinks .ab-top-menu > #wp-admin-bar-recovery-mode > .ab-item:focus,
#wpadminbar:not(.mobile) .ab-top-menu > #wp-admin-bar-recovery-mode:hover > .ab-item,
#wpadminbar:not(.mobile) .ab-top-menu > #wp-admin-bar-recovery-mode > .ab-item:focus {
	color: $wp-white;
	background-color: $wp-red-50;
}

#wpadminbar #wp-admin-bar-user-info .username {
	color: $wp-gray-20;
	font-size: 11px;
}

#wpadminbar #wp-admin-bar-my-account.with-avatar > .ab-empty-item img,
#wpadminbar #wp-admin-bar-my-account.with-avatar > a img {
	width: auto;
	height: 16px;
	padding: 0;
	border: 1px solid $wp-gray-40;
	background: $wp-gray-0;
	line-height: 24px;
	vertical-align: middle;
	margin: -4px 0 0 6px;
	float: none;
	display: inline;
}

/*
 * My Sites & Site Title
 */
#wpadminbar .quicklinks li .blavatar {
	float: left;
	font: normal 16px/1 dashicons !important;
	speak: none;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	color: $wp-gray-0;
}

#wpadminbar .quicklinks li a:hover .blavatar,
#wpadminbar .quicklinks li a:focus .blavatar,
#wpadminbar .quicklinks .ab-sub-wrapper .menupop.hover > a .blavatar {
	color: $wp-blue-20;
}

/* The admin bar search field needs to reset many styles that might be inherited from the active Theme CSS. See ticket #40313. */
#wpadminbar > #wp-toolbar > #wp-admin-bar-top-secondary > #wp-admin-bar-search #adminbarsearch input.adminbar-input {
	color: $wp-gray-10;
	background-color: rgba($wp-white, 0);
}

#wpadminbar > #wp-toolbar > #wp-admin-bar-top-secondary > #wp-admin-bar-search #adminbarsearch input.adminbar-input:focus {
	z-index: 10;
	color: $wp-black;
	width: 200px;
	background-color: rgba($wp-white, 0.9);
	cursor: text;
	border: 0;
}

#wpadminbar.ie8 > #wp-toolbar > #wp-admin-bar-top-secondary > #wp-admin-bar-search #adminbarsearch input.adminbar-input:focus {
	background: $wp-white;
	z-index: -1;
}

#wpadminbar .screen-reader-shortcut:focus {
	left: 6px;
	top: 7px;
	height: auto;
	width: auto;
	display: block;
	font-size: 14px;
	font-weight: 600;
	padding: 15px 23px 14px;
	background: $wp-gray-0;;
	color: $wp-blue-50;;
	z-index: 100000;
	line-height: normal;
	text-decoration: none;
	box-shadow: 0 0 2px 2px rgba($wp-black, 0.6);
}

.no-font-face #wpadminbar #wp-admin-bar-menu-toggle span.ab-icon:before {
	content: "Menu";
	font: 14px/45px sans-serif !important;
	display: inline-block !important;
	color: $wp-white;
}

.no-font-face #wpadminbar #wp-admin-bar-site-name a.ab-item {
	color: $wp-white;
}