File Manager

.wrap.imagify-settings {
	margin-right: 0;
}
.imagify-settings.imagify-have-rocket {
	margin-right: 20px;
}

/* The field that checks the API Key */
#imagify-check-api-container {
	display: block;
	margin-top: 6px;
	font-weight: bold;
}

#imagify-check-api-container .dashicons {
	font-size: 25px;
}

#imagify-check-api-container .dashicons-no:before {
	color: #f06e57;
	vertical-align: -1px;
}

#imagify-check-api-container .imagify-icon {
	font-size: 1.8em;
	margin-right: 3px;
	margin-left: 1px;
	color: #8BC34A;
	vertical-align: -2px;
}

.imagify-account-info-col .imagify-api-line {
	padding: 22px 26px;
	background: #343A49
}

.imagify-api-line label,
p.imagify-api-key-invite-title {
	display: block;
	margin-bottom: 6px;
	font-size: 14px;
	text-transform: uppercase;
	letter-spacing: 0.02em;
	font-weight: bold;
	color: #343A49;
}
.imagify-account-info-col .imagify-api-line label {
	color: #E5EBEF;
	display: inline-block;
}
.imagify-api-line.imagify-api-line input[type="text"] {
	width: 100%;
	padding: 6px 10px;
	border: 1px solid #40B1D0;
	font-family: "PT Mono", "Consolas", monospace;
	font-size: 14px;
	letter-spacing: 0.01em;
	font-weight: bold;
	color: #40B1D0;
	background: transparent;
	box-shadow: none;
}

.imagify-no-api-key .imagify-api-line {
	margin: 3em 0 0 0;
	padding: 2em 0 0;
}
.imagify-no-api-key .imagify-api-line input[type="text"] {
	margin-top: 5px;
	width: 400px;
	max-width: 100%;
}
.imagify-settings .imagify-no-api-key div.submit.submit {
	border: 0;
	padding: 0 16px;
	margin-top: 0;
	background: #FFF;
}
.imagify-settings .imagify-no-api-key div.submit.submit p {
	padding-bottom: 0;
}

.imagify-options-title {
	margin: .75em 0 0 0;
	font-size: 24px;
	letter-spacing: 0.02em;
	font-weight: bold;
	color: #343A49;
}

.imagify-options-subtitle {
	padding-bottom: .3em;
	margin-bottom: 20px;
	border-bottom: 1px solid #D2D3D6;
	font-size: 14px;
	letter-spacing: 0.01em;
	font-weight: bold;
	text-transform: uppercase;
	color: #626E7B;
}

.imagify-options-subtitle a {
	font-size: 12px;
	color: #338EA6;
	text-transform: none;
	letter-spacing: 0;
}

.imagify-options-subtitle .imagify-info {
	margin-left: 15px;
}

.imagify-setting-line {
	border-top: 1px solid #D2D3D6;
	padding: 25px 0 13px;
	margin: 1em 0;
}
.imagify-options-subtitle + .imagify-setting-line {
	border-top: 0;
	padding-top: 8px;
}

/* 3 inlined buttons + Visual comparison */
.imagify-setting-optim-level {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
}

.imagify-setting-optim-level > p {
	margin: 0;
}

.imagify-setting-optim-level .imagify-info {
	margin-top: 10px;
}

.imagify-setting-optim-level .imagify-error {
	margin: 10px 0 0 0;
}

.imagify-setting-optim-level .imagify-error a {
	color: #fff;
}

.imagify-setting-optim-level .imagify-inline-options {
	flex-basis: 60%;
	flex-grow: 1;
	width: auto;
	display: flex;
	background: #2E3243;
	border-radius: 3px;
}
.imagify-setting-optim-level .imagify-inline-options-error {
	background: #ccc;
}

.imagify-setting-optim-level .imagify-inline-options label {
	display: block !important;
	width: 100%;
	font-size: 14px !important;
	border-radius: 3px!important;
}
.imagify-setting-optim-level .imagify-visual-comparison-text {
	flex-basis: 40%;
	flex-shrink: 1;
	padding-left: 20px;
	margin-top: 20px;
	color: #626E7B;
	box-sizing: border-box;
}
.imagify-setting-optim-level.imagify-setting-optim-level .imagify-visual-comparison-btn {
	padding-top: 5px;
	margin-top: 2px;
	border-radius: 2px;
	text-transform: none;
	letter-spacing: 0;
	text-shadow: none!important;
}

/* TODO: maybe remove table lines, we don't use theme anymore… */
@media (max-width: 782px) {
	.imagify-settings .form-table th {
		padding-top: 2em;
		padding-bottom: .5em;
	}
}
.imagify-settings .form-table td {
	vertical-align: top;
}
.imagify-settings .form-table th span {
	cursor: pointer;
}
.imagify-middle th {
	padding-top: 35px;
}

.imagify-settings div.submit.submit {
	border-top: 1px solid #D9D9D9;
	margin-top: 2em;
	padding: 18px 0 7px 30px;
}
.imagify-settings .hidden + div.submit.submit {
	margin-top: -1px;
}
.imagify-settings p.submit {
	float: left;
	margin-top: 0;
}
.imagify-settings p.submit .button {
	margin: 0 5px;
}

.imagify-sub-header th {
	text-align: right;
}
.imagify-sub-header .form-table {
	margin: 0;
}
.imagify-sub-header th,
.imagify-sub-header td {
	padding-top: 0;
	padding-bottom: 0;
}

.imagify-sub-header [for="api_key"] {
	padding-top: 5px;
}

@media (max-width: 1120px) {
	.imagify-settings .imagify-logo-block {
		margin-right: 0;
	}
	.imagify-settings .imagify-rate-us.imagify-rate-us {
		margin: 1em 0 -1em;
	}
}

.imagify-settings .imagify-rate-us {
	margin-right: 25px;
	margin-left: auto;
}

/* Label & fake labels */
label + .imagify-info,
.imagify-visual-label {
	display: inline-block;
	width: 550px;
	max-width: calc(100% - 38px);
	margin-left: 38px;
	padding-right: 25px;
}
.imagify-options-line {
	-webkit-transition: opacity .3s;
	transition: opacity .3s;
}
label ~ .imagify-options-line {
	display: block;
	margin: 8px 0 20px 40px;
	font-size: 14px;
}
.imagify-options-line + .imagify-info {
	margin-left: 38px;
}
label + .imagify-info {
	margin-top: 10px;
}
.imagify-options-line + .imagify-info + .imagify-options-line {
	margin-top: 20px;
}
.imagify-visual-label {
	vertical-align: -5px;
}
label[for="imagify_sizes_full"] + .imagify-info {
	vertical-align: middle;
}

.imagify-settings.imagify-settings [type="checkbox"]:not(:checked) + label ~ .imagify-options-line,
.imagify-settings.imagify-settings [type="checkbox"]:not(:checked) + label .imagify-visual-label,
:checked + label ~ .imagify-options-line :checked + label ~ .imagify-options-line .imagify-faded {
	opacity: .5;
}
.imagify-settings.imagify-settings [type="checkbox"]:checked + label ~ .imagify-options-line,
.imagify-settings.imagify-settings [type="checkbox"]:checked + label .imagify-visual-label,
.imagify-settings.imagify-settings :not(:checked) + label ~ .imagify-options-line :not(:checked) + label ~ .imagify-options-line {
	opacity: 1;
}

.imagify-radio-group + .imagify-options-line {
	display: block;
	margin: 0 0 0 1.7em;
	font-size: 14px;
}

.imagify-checkbox-marged {
	max-width: 500px;
	margin-left: 45px;
}

.imagify-settings [type="text"],
.imagify-settings [type="number"] {
	width: 20em;
	max-width: 100%;
	height: auto;
	padding: 6px;
	margin: 0 6px;
	border: 1px solid #8BA6B4;
	box-shadow: none;
	border-radius: 2px;
	color: #338EA6;
	font-weight: bold;
}
.imagify-settings [type="number"] {
	width: 5em;
}
.imagify-settings ::-webkit-input-placeholder {
	color: #B1B1B1;
	font-weight: 400;
}
.imagify-settings ::-moz-placeholder {
	color: #B1B1B1;
	font-weight: 400;
	opacity: 1;
}
.imagify-settings :-ms-input-placeholder {
	color: #B1B1B1;
	font-weight: 400;
}
.imagify-settings :-moz-placeholder {
	color: #B1B1B1;
	font-weight: 400;
	opacity: 1;
}
.imagify-settings ::placeholder {
	color: #B1B1B1;
	font-weight: 400;
}

.imagify-menu-bar-img {
	box-sizing: border-box;
	max-width: 100%;
	width: 350px;
	height: auto;
	margin-top: 0;
	border: 1px solid #8BA6B4;
}

/* Layout */
.imagify-col.imagify-main {
	float: left;
	width: calc(100% - 320px);
	padding-left: 0;
	padding-right: 0;
}
.imagify-have-rocket .imagify-main {
	float: none;
	width: 1265px;
	max-width: 100%;
}
.imagify-sidebar {
	float: left;
	width: 300px;
	max-width: 100%;
}

/* Sidebar with Ads */
.imagify-sidebar-section {
	border: 1px solid #BBB;
	background: #1F2332;
}
.imagify-sidebar-section + .imagify-sidebar-section {
	margin-top: 2em;
}

@media (max-width: 820px) {
	.imagify-settings {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		-ms-flex-direction: column;
		flex-direction: column;
	}
	.imagify-main {
		width: auto;
		float: none;
	}
	.imagify-sidebar {
		order: 2;
		float: none;
		width: auto;
		max-width: none;
		margin-left: 0;
		margin-top: 25px;
	}
	.wp-media-products {
		text-align: center;
	}
	.wp-media-products li {
		display: inline-block;
		width: 100%;
		max-width: 276px;
	}
}
@media (min-width: 1400px) {
	.imagify-main {
		width: 74%;
	}
}
.imagify-sidebar-section {
	position: relative;
	padding: 10px 20px;
	text-align: center;
	color: #F2F2F2;
}
.imagify-sidebar-close {
	position: absolute;
	top: 8px;
	right: 12px;
	text-decoration: none;
}
.imagify-sidebar-close i {
	font-size: 2em;
	color: rgba(255,255,255,.5);
}
p.imagify-sidebar-title {
	margin: 1.2em 0 1.5em;
	text-align: left;
	color: #F56640;
	text-transform: uppercase;
	letter-spacing: 0.015em;
	word-spacing: 0.015em;
	font-weight: bold;
}
p.imagify-sidebar-description {
	margin: 1.5em 0;
	text-align: left;
	font-weight: 500;
	color: #F2F2F2;
}
.imagify-sidebar-description strong {
	color: #39CE9A;
}
.imagify-rocket-cta-promo {
	display: block;
	padding: 8px 10px;
	margin: 1.3em 0 .5em 0;
	border: 2px dashed #F56640;
	border-radius: 3px;
	font-size: 18px;
	font-weight: bold;
	color: #F56640;
}
.imagify-rocket-cta-promo strong {
	color: #F2F2F2;
}
a.btn-rocket {
	display: block;
	font-size: 15px;
	padding: 10px 12px;
	margin: 0 0 1.5em;
	background: #F56640;
	border-radius: 3px;
	color: #F2F2F2;
	text-transform: uppercase;
	font-weight: bold;
	text-decoration: none;
}
a.btn-rocket:hover,
a.btn-rocket:focus {
	background: #AC2B15;
}

.imagify-sidebar-section ul {
	margin-top: 20px;
}

.imagify-sidebar-section li {
	position: relative;
	margin: 1.2em 0;
	padding-left: 25px;
	text-align: left;
}
.imagify-sidebar-section li:before {
	content: "✓";
	position: absolute;
	left: 0; top: 0;
	color: #39CE9A;
	font-size: 18px;
}

/* Menu in admin bar label exception */
label[for="imagify_admin_bar_menu"],
label[for="imagify_partner_links"] {
	font-weight: normal !important;
	color: #626E7B !important;
}

/* Select / Unselect all buttons */
.imagify-select-all-buttons {
	margin-top: 8px;
}
.imagify-link-like.imagify-select-all {
	font-weight: bold;
	font-size: 12px;
	color: #3694AE;
}
.imagify-select-all.imagify-is-inactive {
	color: inherit;
	text-decoration: none;
	cursor: default;
}

/* Add Themes box */
.imagify-fts-header {
	padding: 10px 16px;
	background: #343A49;
	color: #FFF;
}
.imagify-fts-header i {
	font-size: 1.8em;
	margin-right: 12px;
}
.imagify-fts-header p {
	margin: 0;
	color: #FFF;
}
.imagify-fts-header strong,
#imagify-add-themes-to-custom-folder strong {
	color: #40B1D0;
	font-weight: bold;
}

.imagify-fts-content {
	padding: 16px;
	background: #F4F7F9;
	border: 1px solid #CDD0D4;
	border-top: 0;
}

.imagify-fts-content p {
	margin-top: 0;
}

.imagify-kindof-title {
	margin-top: 2em;
	padding: 0 0 10px 0;
	border-bottom: 1px solid #D2D3D6;
	justify-content: space-between;
	font-weight: bold;
}
.imagify-settings .imagify-button-mini {
	padding: 4px 13px 4px 10px;
}
.imagify-settings .imagify-button-mini .dashicons-plus {
	vertical-align: -7.5px;
}
.imagify-settings .imagify-button-mini.imagify-button-primary:hover,
.imagify-settings .imagify-button-mini.imagify-button-primary:focus {
	color: #FFF;
}

p.imagify-custom-folder-line {
	position: relative;
	margin: 0;
	padding: 12px 15px;
	color: #4A5362;
	font-weight: 500;
	transition: all .75s;
}
.imagify-custom-folder-line.imagify-will-remove {
	background: #C51162;
	color: #FFF;
	transform: translateX(-120px);
	opacity: 0;
}
.imagify-custom-folder-line:first-child {
	margin-top: -.5em;
}
.imagify-custom-folder-line + .imagify-custom-folder-line {
	border-top: 1px solid #E9EFF2;
}

.imagify-custom-folders-remove {
	position: absolute;
	right: 0;
	top: 6px;
	border: 0;
	padding: 5px 10px 4px;
	box-shadow: none;
	color: #7A8996;
	border-radius: 16px;
	font-size: 13px;
	line-height: 18px;
	background: #FFF;
	transition: all .275s;
	cursor: pointer;
}
.imagify-custom-folders-remove-text {
	max-width: 0;
	overflow: hidden;
	white-space: nowrap;
	display: inline-block;
	transform: scale(0);
	opacity: 0;
	transition: all .275s;
}
.imagify-custom-folders-remove:hover,
.imagify-custom-folders-remove:focus {
	background: #D9EFF6;
	color: #225E6E;
}
.imagify-custom-folders-remove:hover .imagify-custom-folders-remove-text,
.imagify-custom-folders-remove:focus .imagify-custom-folders-remove-text {
	max-width: 6em;
	transform: scale(1);
	opacity: 1;
}

/* Progress bar */
.imagify-settings .progress {
	height: 8px;
	margin-top: 1em;
	background: #343A49;
}
.imagify-settings .bar {
	position: relative;
	width: 1px;
	height: 8px;
	background: #46B1CE;
	-webkit-transition: width .5s;
	transition: width .5s;
}
.imagify-settings .percent {
	position: absolute;
	top: 6px;
	right: 0;
	padding: 0 5px;
	line-height: 1.85;
	font-size: 14px;
	font-weight: bold;
	color: #40B1D0;
}

/* Icon rotation */
.dashicons.rotate {
	-webkit-animation: icon-rotate 2.6s infinite linear;
	animation: icon-rotate 2.6s infinite linear;
}

@-webkit-keyframes icon-rotate {
	from {
		-webkit-transform: rotate(0deg);
		transform: rotate(0deg);
	}
	to {
		-webkit-transform: rotate(360deg);
		transform: rotate(360deg);
	}
}
@keyframes icon-rotate {
	from {
		transform: rotate(0deg);
	}
	to {
		transform: rotate(360deg);
	}
}

/* Files tree Part */
.imagify-add-custom-folder + .imagify-loader {
	display: none;
	vertical-align: middle;
}
.imagify-add-custom-folder[disabled] + .imagify-loader {
	display: inline-block;
}

.imagify-folders-information {
	position: relative;
	margin: -5px 0 20px 0;
	padding: 10px 10px 10px 40px;
	text-align: left;
	background: #F2F2F2;
}
.imagify-folders-information i {
	position: absolute;
	left: 10px;
	top: 50%;
	margin-top: -10px;
}

/* Tree */
.imagify-folders-tree {
	margin: 0;
	text-align: left;
}
.imagify-folders-tree li {
	clear: left;
}
.imagify-folders-tree .imagify-folder {
	box-sizing: border-box;
	position: relative;
	width: 48px;
	z-index: 2;
	float: left;
	margin-top: -3px;
	padding: 0 8px 0 0;
	border: 0;
	background: transparent!important;
	box-shadow: none;
	cursor: pointer;
	transition: all .275s;
}
.imagify-folders-tree span.imagify-folder {
	padding-left: 1.5px;
}
.imagify-folders-tree .imagify-folder:before {
	content: "+";
	display: inline-block;
	width: 13px;
	height: 21px;
	font-size: 1.5em;
	vertical-align: .15em;
}
.imagify-folders-tree span.imagify-folder:before {
	content: '';
}
.imagify-folders-tree .imagify-folder-icon path {
	transition: all .275s;
}
.imagify-folders-tree .imagify-is-open .imagify-folder-icon path {
	stroke: #7A8996;
}
.imagify-folders-tree .imagify-is-open.imagify-folder:before {
	content: "-";
	color: #7A8996;
}
.imagify-folders-tree .imagify-is-open ~ label {
	color: #7A8996;
}
.imagify-folders-tree .imagify-folder.imagify-loading:before,
.imagify-folders-tree .imagify-folder .imagify-loader {
	display: none;
}
.imagify-folders-tree .imagify-folder.imagify-loading .imagify-loader {
	display: inline-block;
	width: 13px;
	height: 21px;
	font-size: 1.5em;
	vertical-align: .15em;
}
.imagify-folders-tree .imagify-folder.imagify-loading .imagify-loader img {
	display: inline-block;
	width: 100%;
	height: auto;
	vertical-align: middle;
}

.imagify-folders-tree button.imagify-folder:hover,
.imagify-folders-tree button.imagify-folder:focus,
.imagify-folders-tree button.imagify-folder:hover path,
.imagify-folders-tree button.imagify-folder:focus path {
	color: #3694AE;
	stroke: #3694AE;
}

.imagify-folders-tree .imagify-folder:disabled,
.imagify-folders-tree .imagify-folder.disabled {
	color: rgb(127, 127, 127);
}
.imagify-swal-content .imagify-folders-tree label {
	position: relative;
	display: block;
	width: 100%;
	padding: 3px 0;
	font-size: 15px;
	font-weight: 500;
	vertical-align: top;
	transition: all .475s;
}
.imagify-swal-content .imagify-folders-tree label:hover,
.imagify-folders-tree input:focus + label {
	background: #F4F7F9;
}

.imagify-folders-tree .imagify-folder-already-selected label,
.imagify-folders-tree .imagify-folder-already-selected label:hover,
.imagify-folders-tree .imagify-folder-already-selected input:focus + label {
	background: #40B1D0;
	color: #FFF;
	border-radius: 3px;
	cursor: default;
}
.imagify-folders-tree .imagify-folder-already-selected button,
.imagify-folders-tree .imagify-folder-already-selected button path {
	color: #FFF;
	stroke: #FFF;
	cursor: default;
}
.imagify-folders-tree .imagify-folder-already-selected button:hover path,
.imagify-folders-tree .imagify-folder-already-selected button:focus path {
	stroke: #FFF;
}
.imagify-folders-tree .imagify-folder-already-selected button:before {
	content: '';
}

/* Add Folder fake checkbox */
.imagify-add-ed-folder {
	position: absolute;
	top: 0;
	bottom: 0;
	right: 0;
	font-size: 11px;
	text-transform: uppercase;
	letter-spacing: 0.02em;
	word-spacing: 0.02em;
	color: #3694AE;
	background: #F4F7F9;
	opacity: 0;
	transform: translateX(15px);
	transition: all .275s;
}
label:hover .imagify-add-ed-folder,
input:focus + label .imagify-add-ed-folder,
input:checked + label .imagify-add-ed-folder,
.imagify-folder-already-selected .imagify-add-ed-folder {
	opacity: 1;
	transform: translateX(0);
}
input:checked + label .imagify-add-ed-folder {
	background: #FFF;
}
input:checked:focus + label .imagify-add-ed-folder,
input:checked + label:hover .imagify-add-ed-folder {
	background: #F4F7F9;
}
.imagify-folder-already-selected .imagify-add-ed-folder {
	background: #40B1D0;
	color: #FFF;
}
.imagify-fake-checkbox {
	position: relative;
	display: inline-block;
	width: 14px;
	height: 14px;
	margin: 3.5px 15px 0 5px;
	border: 1.5px solid #3694AE;
	border-radius: 3px;
	vertical-align: -4px;
}
.imagify-fake-checkbox:after {
	position: absolute;
	left: 1px;
	top: 0;
	content: "✓";
	color: #3694AE;
	font-size: 14px;
	line-height: .9;
	font-style: normal;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Oxygen-Sans, Ubuntu, Cantarell, "Helvetica Neue", sans-serif;
	opacity: 0;
	transform: scale(0);
	transition: all .475s;
}
input:checked + label .imagify-fake-checkbox:after,
.imagify-folder-already-selected .imagify-fake-checkbox:after {
	opacity: 1;
	transform: scale(1);
}
.imagify-folder-already-selected .imagify-fake-checkbox {
	border-color: #40B1D0;
}
.imagify-folder-already-selected .imagify-fake-checkbox:after {
	color: #FFF;
}

/* Sub Trees */
.imagify-folders-sub-tree {
	position: relative;
	margin-left: .75em;
	padding-top: .6em;
	padding-left: 1em;
	border-left: 1px dotted rgba(98, 110, 123, .3);
}
.imagify-folders-sub-tree li {
	position: relative;
	margin-bottom: 4px;
}
.imagify-folders-sub-tree li:before {
	content: "";
	position: absolute;
	top: 12px;
	left: -1em;
	height: 1px;
	width: 0.9em;
	border-top: 1px dotted rgba(98, 110, 123, .3);
}
.imagify-folders-sub-tree li:last-child:after {
	content: "";
	position: absolute;
	left: -1.1em;
	bottom: 0;
	height: 11px;
	width: 3px;
	background: #FFF;
}

.imagify-empty-folder {
	margin-top: -.5em;
}
.imagify-empty-folder em {
	font-size: 12px;
	font-weight: 500;
	color: #A2AFBC;
}
@media (max-width: 782px) {
	.imagify-settings.imagify-have-rocket {
		margin-right: 10px;
	}

	label + .imagify-info, .imagify-visual-label {
		max-width: calc(100% - 65px);
		padding-right: 0;
	}

	.imagify-options-title {
		font-size: 22px;
	}

	.imagify-user-plan-label {
		margin-right: -5px;
	}

	.imagify-col.imagify-main {
		width:100%;
		padding-right: 10px;
	}
	.imagify-col + .imagify-col{
		padding:0px 10px 0px 0px;
	}
	.imagify-no-api-key .imagify-api-line input[type="text"]{
		margin-left: 0;
	}
}
@media (max-width: 513px) {
	.imagify-setting-optim-level .imagify-visual-comparison-text{
		margin-top: 20px;
	}
}

.imagify-col-content .imagify-space-left {
	margin: 15px 30px 15px 0;
}

.imagify-col-content .imagify-space-left p {
	margin: 0 0 10px 0;
	font-size: 19px;
	font-weight: 500;
	color: #343A49;
}

.imagify-col-content .imagify-meteo-icon {
	height: 64px;
	margin: 15px 15px 15px 0;
}