WPS3Media/assets/css/style.css

#as3cf-settings.wpome button, #as3cf-settings.wpome a, #as3cf-settings.wpome input {
  transition: all 0.3s ease;
}
#as3cf-settings.wpome button, #as3cf-settings.wpome a.button {
  font-weight: 500;
  border-radius: 6px;
  white-space: nowrap;
  min-width: 4rem;
}
#as3cf-settings.wpome button.btn-lg, #as3cf-settings.wpome a.button.btn-lg {
  font-size: 0.875rem;
  padding: 0.95rem 1.2rem;
  min-width: 6rem;
}
#as3cf-settings.wpome button.btn-md, #as3cf-settings.wpome a.button.btn-md {
  font-size: 0.875rem;
  padding: 0.75rem 1.05rem;
}
#as3cf-settings.wpome button.btn-sm, #as3cf-settings.wpome a.button.btn-sm {
  font-size: 0.875rem;
  padding: 0.55rem 0.9rem;
}
#as3cf-settings.wpome button.btn-xs, #as3cf-settings.wpome a.button.btn-xs {
  font-size: 0.7rem;
  padding: 0.4rem 0.6rem;
  min-width: 3rem;
}
#as3cf-settings.wpome button.btn-primary, #as3cf-settings.wpome .btn-row button.btn-primary, #as3cf-settings.wpome a.button.btn-primary {
  color: var(--as3cf-color-white);
  background: var(--as3cf-color-primary-500);
  border: 1px solid rgba(0, 0, 0, 0.12);
}
#as3cf-settings.wpome button.btn-primary:hover, #as3cf-settings.wpome a.button.btn-primary:hover {
  background-color: var(--as3cf-color-primary-600);
}
#as3cf-settings.wpome button.btn-outline, #as3cf-settings.wpome .btn-row button.btn-outline, #as3cf-settings.wpome a.button.btn-outline {
  color: var(--as3cf-color-primary-500);
  background: none;
  border: 1px solid var(--as3cf-color-primary-500);
}
#as3cf-settings.wpome button.btn-outline:hover, #as3cf-settings.wpome a.button.btn-outline:hover {
  color: var(--as3cf-color-primary-600);
  background-color: var(--as3cf-color-primary-50);
  border: 1px solid var(--as3cf-color-primary-600);
}
#as3cf-settings.wpome button.btn-outline:focus, #as3cf-settings.wpome button.btn-outline:active, #as3cf-settings.wpome a.button.btn-outline:focus, #as3cf-settings.wpome a.button.btn-outline:active {
  border: 1px solid var(--as3cf-color-primary-200);
}
#as3cf-settings.wpome button.btn-primary:focus, #as3cf-settings.wpome button.btn-primary:active, #as3cf-settings.wpome button.btn-outline:focus, #as3cf-settings.wpome button.btn-outline:active, #as3cf-settings.wpome a.button.btn-primary:focus, #as3cf-settings.wpome a.button.btn-primary:active, #as3cf-settings.wpome a.button.btn-outline:focus, #as3cf-settings.wpome a.button.btn-outline:active {
  box-shadow: 0 0 0 1.5px var(--as3cf-color-white), 0 0 0 3.5px var(--as3cf-color-primary-400);
  outline: 0;
}
#as3cf-settings.wpome button.btn-disabled, #as3cf-settings.wpome .btn-row button.btn-disabled, #as3cf-settings.wpome a.button.btn-disabled {
  color: var(--as3cf-text-disabled);
  border: 1px solid var(--as3cf-color-gray-400);
  opacity: 0.5;
  cursor: default;
}
#as3cf-settings.wpome button.btn-disabled.btn-primary, #as3cf-settings.wpome a.button.btn-disabled.btn-primary {
  background: var(--as3cf-color-gray-300);
}
#as3cf-settings.wpome button.btn-disabled:hover, #as3cf-settings.wpome a.button.btn-disabled:hover {
  box-shadow: none !important;
}
#as3cf-settings.wpome button.btn-disabled.btn-outline:hover, #as3cf-settings.wpome a.button.btn-disabled.btn-outline:hover {
  color: var(--as3cf-text-disabled);
  border: 1px solid var(--as3cf-color-gray-400);
}
#as3cf-settings.wpome button.btn-expandable, #as3cf-settings.wpome a.button.btn-expandable {
  all: unset;
  box-sizing: border-box;
  cursor: pointer;
  flex: 0 0 auto;
  width: 24px;
  height: 24px;
  min-width: 24px;
  min-height: 24px;
  background: url(../img/icon/arrow.svg) no-repeat center/18px;
  border-radius: 12px;
  transition: all 0.2s ease-in;
}
#as3cf-settings.wpome button.btn-expandable.btn-expanded, #as3cf-settings.wpome a.button.btn-expandable.btn-expanded {
  transform: rotate(180deg);
}
#as3cf-settings.wpome button.btn-expandable:hover, #as3cf-settings.wpome button.btn-expandable:focus, #as3cf-settings.wpome button.btn-expandable:active, #as3cf-settings.wpome a.button.btn-expandable:hover, #as3cf-settings.wpome a.button.btn-expandable:focus, #as3cf-settings.wpome a.button.btn-expandable:active {
  box-shadow: 0 0 0 1.5px var(--as3cf-color-white), 0 0 0 3.5px var(--as3cf-color-secondary-500);
  outline: 0;
}
#as3cf-settings.wpome button.btn-refresh, #as3cf-settings.wpome a.button.btn-refresh {
  all: unset;
  display: flex;
  align-items: center;
  gap: 0.25rem;
  box-sizing: border-box;
  cursor: pointer;
  flex: 0 0 auto;
  font-size: 13px;
  font-weight: 500;
  color: var(--as3cf-link-color);
  border-radius: 3px;
  padding: 0.1rem;
  margin-right: 0 -0.1rem;
  text-decoration: underline;
}
#as3cf-settings.wpome button.btn-refresh img.refresh, #as3cf-settings.wpome a.button.btn-refresh img.refresh {
  width: 12px;
  height: 12px;
  min-width: 12px;
  min-height: 12px;
}
#as3cf-settings.wpome button.btn-refresh img.refresh.refreshing, #as3cf-settings.wpome a.button.btn-refresh img.refresh.refreshing {
  animation: spin 1s linear infinite;
}
@keyframes spin {
  100% {
    transform: rotate(360deg);
  }
}
#as3cf-settings.wpome button.btn-refresh.btn-refreshing, #as3cf-settings.wpome a.button.btn-refresh.btn-refreshing {
  cursor: default;
}
#as3cf-settings.wpome button.btn-refresh:hover, #as3cf-settings.wpome button.btn-refresh:active, #as3cf-settings.wpome button.btn-refresh:focus, #as3cf-settings.wpome a.button.btn-refresh:hover, #as3cf-settings.wpome a.button.btn-refresh:active, #as3cf-settings.wpome a.button.btn-refresh:focus {
  text-decoration: none !important;
  box-shadow: 0;
}
#as3cf-settings.wpome button.btn-refresh:focus-visible, #as3cf-settings.wpome a.button.btn-refresh:focus-visible {
  text-decoration: none;
  box-shadow: 0 0 0 1.5px var(--as3cf-color-white), 0 0 0 3.5px var(--as3cf-color-secondary-500);
  outline: 0;
}
#as3cf-settings.wpome button.btn-refresh:disabled, #as3cf-settings.wpome a.button.btn-refresh:disabled {
  color: var(--as3cf-color-gray-800);
  text-decoration: none;
}
#as3cf-settings.wpome a,
#as3cf-settings.wpome button {
  cursor: pointer;
}
#as3cf-settings.wpome .btn-row {
  width: 100%;
  display: flex;
  flex-direction: row;
  margin: 2.5rem 0 2.5rem 0;
}
#as3cf-settings.wpome .btn-row .buttons-left .btn-primary {
  margin-left: 0.85rem;
}
#as3cf-settings.wpome .btn-row .btn-outline {
  margin-left: auto;
}
#as3cf-settings.wpome .btn-row .btn-primary {
  margin-left: auto;
}
#as3cf-settings.wpome .btn-row .btn-outline + .btn-primary {
  margin-left: 0.85rem;
}
#as3cf-settings.wpome .buttons-right {
  margin-left: auto;
  flex: 0 0 auto;
}
#as3cf-settings.wpome .buttons-right .pause {
  margin-right: 0.7rem;
}
#as3cf-settings.wpome .fixed-cta-block {
  width: calc(100% - 160px);
  display: flex;
  flex-direction: row;
  background: var(--as3cf-color-white);
  box-shadow: 0 -11px 24px 0 rgba(151, 146, 175, 0.2);
  box-sizing: border-box;
  z-index: 9999;
  position: fixed;
  bottom: 0;
  left: 160px;
}
@media screen and (max-width: 960px) {
  #as3cf-settings.wpome .fixed-cta-block {
    width: calc(100% - 36px);
    left: 36px;
  }
}
@media screen and (max-width: 782px) {
  #as3cf-settings.wpome .fixed-cta-block {
    width: 100%;
    left: 0;
  }
}
#as3cf-settings.wpome .fixed-cta-block .buttons {
  margin: 0;
  padding: 1rem 2rem;
  display: flex;
  justify-content: flex-end;
  width: calc(1220px + 4rem);
  max-width: calc(1220px + 4rem);
  box-sizing: border-box;
}
@media screen and (max-width: 1100px) {
  #as3cf-settings.wpome .fixed-cta-block .buttons {
    max-width: calc(780px + 4rem);
  }
}
@media screen and (max-width: 872px) {
  #as3cf-settings.wpome .fixed-cta-block .buttons {
    max-width: 100%;
  }
}
#as3cf-settings.wpome .fixed-cta-block .buttons .btn-outline {
  margin-right: 1rem;
}
#as3cf-settings.wpome .button-tab {
  background: var(--as3cf-color-white);
  border: 1px solid var(--as3cf-color-gray-400);
  border-radius: 6px;
  height: 3rem;
  display: flex;
  flex-direction: row;
  align-items: center;
  padding: 0 1.3rem;
  text-decoration: none;
  margin-right: 1.5rem;
  position: relative;
  transition-duration: 0.15s;
  transition-timing-function: linear;
}
#as3cf-settings.wpome .button-tab.active {
  border: 1px solid var(--as3cf-color-primary-500);
  box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.05), 0 2px 1px 0 rgba(0, 0, 0, 0.05);
}
#as3cf-settings.wpome .button-tab:hover {
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.05), 0 2px 1px 0 rgba(0, 0, 0, 0.05);
}
#as3cf-settings.wpome .button-tab:focus, #as3cf-settings.wpome .button-tab:active {
  box-shadow: 0 0 0 1.5px var(--as3cf-color-white), 0 0 0 3.5px var(--as3cf-color-secondary-500);
  outline: 0;
}
#as3cf-settings.wpome .button-tab.btn-disabled {
  cursor: default;
}
#as3cf-settings.wpome .button-tab.btn-disabled:hover {
  box-shadow: none;
}

#as3cf-settings.wpome a.help {
  width: 18px;
  height: 18px;
  min-width: 18px;
  min-height: 18px;
  border: none;
  border-radius: 100%;
}
#as3cf-settings.wpome a.help:hover, #as3cf-settings.wpome a.help:focus, #as3cf-settings.wpome a.help:active {
  filter: brightness(90%);
  box-shadow: 0 0 0 1.5px var(--as3cf-color-white), 0 0 0 3.5px var(--as3cf-color-secondary-500);
  outline: 0;
}
#as3cf-settings.wpome a.help .icon.help {
  width: 18px;
  height: 18px;
  min-width: 18px;
  min-height: 18px;
  border: none;
  border-radius: 100%;
}
#as3cf-settings.wpome .icon.status {
  width: 16px;
  height: 16px;
}
#as3cf-settings.wpome .icon.status:hover {
  filter: brightness(90%);
}
#as3cf-settings.wpome .icon.close:hover {
  filter: brightness(90%);
}
#as3cf-settings.wpome .icon.bucket {
  width: 18px;
  height: 18px;
  margin-right: 1.4rem;
}
#as3cf-settings.wpome .icon.region {
  width: 18px;
  height: 18px;
}
#as3cf-settings.wpome .icon.notice-icon {
  width: 24px;
  height: 24px;
  margin-right: 0.8rem;
}
#as3cf-settings.wpome .icon.notice-icon.assets-wizard {
  margin-top: -2px;
}

#as3cf-settings.wpome label {
  font-size: 0.875rem;
  color: var(--as3cf-color-gray-900);
  cursor: pointer;
  display: flex;
  align-items: center;
}
#as3cf-settings.wpome .disabled > label {
  cursor: default;
}
#as3cf-settings.wpome input[type=checkbox], #as3cf-settings.wpome input[type=radio] {
  all: unset;
  box-sizing: border-box;
  background: var(--as3cf-color-white);
  border: 1px solid var(--as3cf-color-gray-400);
  width: 18px;
  height: 18px;
  min-width: 18px;
  min-height: 18px;
  margin: 0 0.85rem 0 0;
  padding: 0;
}
#as3cf-settings.wpome input[type=checkbox]:disabled, #as3cf-settings.wpome input[type=checkbox]:disabled:hover, #as3cf-settings.wpome input[type=radio]:disabled, #as3cf-settings.wpome input[type=radio]:disabled:hover {
  box-shadow: none;
}
#as3cf-settings.wpome input[type=checkbox]:disabled:checked, #as3cf-settings.wpome input[type=checkbox]:disabled:hover:checked, #as3cf-settings.wpome input[type=radio]:disabled:checked, #as3cf-settings.wpome input[type=radio]:disabled:hover:checked {
  color: var(--as3cf-color-gray-400);
  background-color: var(--as3cf-color-gray-200);
  border: 1px solid var(--as3cf-color-gray-400);
}
#as3cf-settings.wpome input[type=checkbox]:disabled:not(:checked), #as3cf-settings.wpome input[type=checkbox]:disabled:hover:not(:checked), #as3cf-settings.wpome input[type=radio]:disabled:not(:checked), #as3cf-settings.wpome input[type=radio]:disabled:hover:not(:checked) {
  background-color: var(--as3cf-color-gray-100);
  border: 1px solid var(--as3cf-color-gray-300);
}
#as3cf-settings.wpome input[type=radio] {
  border-radius: 100%;
}
#as3cf-settings.wpome input[type=radio]:checked {
  border: 1px solid var(--as3cf-color-secondary-700);
  background: var(--as3cf-color-secondary-500) url('data:image/svg+xml;utf8,<svg width="6" height="6" viewBox="0 0 6 6" fill="none" xmlns="http://www.w3.org/2000/svg"><rect width="6" height="6" rx="3" fill="white"/></svg>') no-repeat center;
}
#as3cf-settings.wpome input[type=radio]:checked:disabled {
  background-image: url('data:image/svg+xml;utf8,<svg width="6" height="6" viewBox="0 0 6 6" fill="none" xmlns="http://www.w3.org/2000/svg"><rect width="6" height="6" rx="3" fill="%23D0D5DD"/></svg>');
}
#as3cf-settings.wpome input[type=radio]:checked::before {
  content: none;
}
#as3cf-settings.wpome input[type=radio]:hover {
  box-shadow: 0 0 0 1.5px var(--as3cf-color-white), 0 0 0 3.5px var(--as3cf-color-secondary-500);
  outline: 0;
}
#as3cf-settings.wpome input[type=radio]:hover:not(:checked) {
  background-color: var(--as3cf-color-secondary-50);
}
#as3cf-settings.wpome input[type=checkbox] {
  border-radius: 3px;
  margin-top: -2px;
}
#as3cf-settings.wpome input[type=checkbox]:checked {
  background: var(--as3cf-color-secondary-500) url('data:image/svg+xml;utf8,<svg width="12" height="9" viewBox="0 0 12 9" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M11.8547 1.0848L10.9136 0.146569C10.7187 -0.0477426 10.4014 -0.0490232 10.205 0.143761L4.30235 5.93454L1.80554 3.44516C1.61065 3.25085 1.29338 3.24957 1.0969 3.44231L0.148199 4.37303C-0.0482736 4.56577 -0.0495681 4.87956 0.145359 5.07391L3.93621 8.85343C4.1311 9.04774 4.44838 9.04902 4.64485 8.85624L11.8519 1.78568C12.0483 1.5929 12.0495 1.27911 11.8547 1.0848Z" fill="white"/></svg>') no-repeat center/75%;
  border: 1px solid var(--as3cf-color-secondary-600);
}
#as3cf-settings.wpome input[type=checkbox]:checked:disabled {
  background-image: url('data:image/svg+xml;utf8,<svg width="12" height="9" viewBox="0 0 12 9" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill-rule="evenodd" clip-rule="evenodd" d="M11.8547 1.0848L10.9136 0.146569C10.7187 -0.0477426 10.4014 -0.0490232 10.205 0.143761L4.30235 5.93454L1.80554 3.44516C1.61065 3.25085 1.29338 3.24957 1.0969 3.44231L0.148199 4.37303C-0.0482736 4.56577 -0.0495681 4.87956 0.145359 5.07391L3.93621 8.85343C4.1311 9.04774 4.44838 9.04902 4.64485 8.85624L11.8519 1.78568C12.0483 1.5929 12.0495 1.27911 11.8547 1.0848Z" fill="%23D0D5DD"/></svg>');
}
#as3cf-settings.wpome input[type=checkbox]:checked::before {
  content: none;
}
#as3cf-settings.wpome input[type=checkbox]:hover {
  box-shadow: 0 0 0 1.5px var(--as3cf-color-white), 0 0 0 3.5px var(--as3cf-color-secondary-500);
  outline: 0;
}
#as3cf-settings.wpome input[type=checkbox]:hover:not(:checked) {
  background-color: var(--as3cf-color-secondary-50);
}
#as3cf-settings.wpome .checkbox,
#as3cf-settings.wpome .radio-btn {
  display: flex;
  flex-direction: row;
  align-items: center;
  margin-bottom: 0.75rem;
}
#as3cf-settings.wpome .checkbox:last-of-type,
#as3cf-settings.wpome .radio-btn:last-of-type {
  margin-bottom: 0;
}
#as3cf-settings.wpome .checkbox label {
  line-height: 1;
  display: flex;
  align-items: center;
}
#as3cf-settings.wpome input[type=text],
#as3cf-settings.wpome textarea {
  background: var(--as3cf-color-white);
  border: 1px solid var(--as3cf-color-gray-400);
  box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.05);
  border-radius: 8px;
  padding: 0.95rem 1rem;
  font-size: 0.875rem;
  color: var(--as3cf-color-gray-900);
  line-height: 1.2;
  margin: 0;
  box-sizing: border-box;
}
#as3cf-settings.wpome input[type=text].licence-field,
#as3cf-settings.wpome textarea.licence-field {
  width: 510px;
  margin-right: 0.75rem !important;
  letter-spacing: 0.75px;
}
#as3cf-settings.wpome input[type=text].licence-field::placeholder,
#as3cf-settings.wpome textarea.licence-field::placeholder {
  letter-spacing: 0.25px;
}
#as3cf-settings.wpome textarea {
  line-height: 1.3 !important;
  /* Standards compliant scrollbar (future) */
  /*
  scrollbar-color: var(--as3cf-secondary-color) var(--as3cf-color-white);
  scrollbar-width: 12px;
   */
  /* Ye olde webkit scrollbar */
}
#as3cf-settings.wpome textarea::-webkit-scrollbar {
  width: 12px;
}
#as3cf-settings.wpome textarea::-webkit-scrollbar-track {
  background: var(--as3cf-color-white);
  border-radius: 6px;
}
#as3cf-settings.wpome textarea::-webkit-scrollbar-corner {
  background-color: var(--as3cf-color-white);
  border-radius: 6px;
}
#as3cf-settings.wpome textarea::-webkit-resizer {
  background-color: var(--as3cf-color-white);
  border-radius: 6px;
}
#as3cf-settings.wpome textarea::-webkit-scrollbar-thumb {
  background-color: var(--as3cf-secondary-color);
  border: 1px solid var(--as3cf-color-white);
  border-radius: 5px;
}
#as3cf-settings.wpome select {
  all: unset;
  background: var(--as3cf-color-white) url(../img/icon/arrow.svg) no-repeat calc(100% - 18px) 50%;
  border: 1px solid var(--as3cf-color-gray-400);
  box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.05);
  border-radius: 8px;
  padding: 0 1rem !important;
  font-size: 0.875rem !important;
  color: var(--as3cf-color-gray-900);
  line-height: 1.2 !important;
  margin: 0;
  box-sizing: border-box;
  cursor: pointer;
  appearance: none;
  height: 46px !important;
  display: flex;
  align-items: center;
}
#as3cf-settings.wpome input::placeholder, #as3cf-settings.wpome textarea::placeholder, #as3cf-settings.wpome select::placeholder {
  color: var(--as3cf-color-gray-500);
}
#as3cf-settings.wpome input:hover, #as3cf-settings.wpome textarea:hover, #as3cf-settings.wpome select:hover {
  border: 1px solid var(--as3cf-color-gray-500);
}
#as3cf-settings.wpome input:focus, #as3cf-settings.wpome input:active, #as3cf-settings.wpome textarea:focus, #as3cf-settings.wpome textarea:active, #as3cf-settings.wpome select:focus, #as3cf-settings.wpome select:active {
  box-shadow: 0 0 0 1.5px var(--as3cf-color-white), 0 0 0 3.5px var(--as3cf-color-secondary-500);
  outline: 0;
}
#as3cf-settings.wpome input:disabled, #as3cf-settings.wpome textarea:disabled, #as3cf-settings.wpome select:disabled {
  cursor: default;
}
#as3cf-settings.wpome input.disabled, #as3cf-settings.wpome textarea.disabled, #as3cf-settings.wpome select.disabled {
  color: var(--as3cf-color-gray-500);
  background-color: var(--as3cf-color-gray-100);
  border: 1px solid var(--as3cf-color-gray-300);
  cursor: default;
}
#as3cf-settings.wpome .input-label {
  font-size: 0.78125rem;
  color: var(--as3cf-color-gray-500);
  margin-bottom: 0.5rem;
  font-weight: 400;
  text-transform: uppercase;
  letter-spacing: 0.3px;
}
#as3cf-settings.wpome .input-error {
  color: var(--as3cf-wordpress-notice-error-color);
  font-weight: 400;
}
#as3cf-settings.wpome .panel div.setting .input-error {
  margin-left: 5rem;
  margin-right: 1.5rem;
  margin-bottom: 1rem;
}
#as3cf-settings.wpome .toggle-switch {
  display: flex;
  align-items: center;
}
#as3cf-settings.wpome .toggle-switch input[type=checkbox] {
  all: unset;
  height: 0;
  width: 0;
  border: none !important;
}
#as3cf-settings.wpome .toggle-switch label {
  box-sizing: border-box;
  cursor: pointer;
  text-indent: -9999px;
  width: 36px;
  height: 20px;
  background: var(--as3cf-color-gray-400);
  border: none;
  border-radius: 100px;
  display: block;
  position: relative;
}
#as3cf-settings.wpome .toggle-switch label:after {
  content: "";
  position: absolute;
  top: 2px;
  left: 2px;
  width: 16px;
  height: 16px;
  background: var(--as3cf-color-white);
  border-radius: 100%;
  transition: 0.3s;
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.06), 0 1px 2px 0 rgba(0, 0, 0, 0.1);
}
#as3cf-settings.wpome .toggle-switch input:checked + label {
  background: var(--as3cf-complete-color);
  transition: 0.3s;
}
#as3cf-settings.wpome .toggle-switch input:checked + label:after {
  left: calc(100% - 2px);
  transform: translateX(-100%);
}
#as3cf-settings.wpome .toggle-switch label:active:after {
  width: 26px;
}
#as3cf-settings.wpome .toggle-switch input:focus + label, #as3cf-settings.wpome .toggle-switch input:active + label {
  border: none;
  box-shadow: 0 0 0 1.5px var(--as3cf-color-white), 0 0 0 3.5px var(--as3cf-color-secondary-500);
  outline: 0;
}
#as3cf-settings.wpome .toggle-switch input:disabled + label {
  cursor: default;
  background: var(--as3cf-color-gray-300);
}
#as3cf-settings.wpome .toggle-switch input:disabled + label:after {
  background: var(--as3cf-color-gray-100);
}

#as3cf-settings.wpome > .header {
  padding: 0 2rem;
  background-color: #FFE4CD;
  display: flex;
  align-items: center;
  height: 96px;
}
#as3cf-settings.wpome > .header .header-wrapper {
  width: 1110px;
  max-width: 1110px;
  height: 100%;
  background-image: url("../img/brand/ome-branding-transparent.svg");
  background-repeat: no-repeat;
  background-size: contain;
  background-position: center top;
  display: flex;
  align-items: center;
}
#as3cf-settings.wpome > .header .header-wrapper h1 {
  font-size: 1.3125rem;
  font-weight: 500;
  color: #490D32;
}
#as3cf-settings.wpome > .header .header-wrapper .medallion {
  filter: drop-shadow(0px 1px 4px rgba(0, 0, 0, 0.15));
  margin-right: 1rem;
  width: 52px;
  height: 52px;
}
#as3cf-settings.wpome > .header .header-wrapper .licence {
  display: flex;
  flex-direction: column;
  margin-left: auto;
}
#as3cf-settings.wpome > .header .header-wrapper .licence .licence-type {
  color: #EB422D;
  display: flex;
  align-items: center;
  justify-content: flex-end;
}
#as3cf-settings.wpome > .header .header-wrapper .licence .licence-type a {
  font-size: 0.825rem;
  font-weight: 500;
  margin-left: 0.6rem;
  text-decoration: underline;
  color: var(--as3cf-color-primary-500) !important;
}
#as3cf-settings.wpome > .header .header-wrapper .licence .licence-type a:hover {
  filter: brightness(105%);
}
#as3cf-settings.wpome > .header .header-wrapper .licence p {
  font-size: 0.8125rem;
  color: #4D443D;
  margin: 0.5rem 0 0;
}
#as3cf-settings.wpome > .header .header-wrapper button, #as3cf-settings.wpome > .header .header-wrapper a.button {
  text-transform: uppercase;
}
#as3cf-settings.wpome div.nav {
  width: 100%;
  margin: 0 auto 2.5rem 0;
  background: var(--as3cf-color-white);
  border-bottom: 1px solid var(--as3cf-wordpress-border-color);
}
#as3cf-settings.wpome div.nav div.items {
  max-width: 1110px;
  display: flex;
  flex-direction: row;
  align-items: baseline;
  padding: 0 2rem;
}
#as3cf-settings.wpome div.nav div.items ul.nav {
  display: flex;
  flex-direction: row;
  align-items: baseline;
  margin: 0;
  padding: 1.5rem 2rem 0 0;
  font-size: 0.75rem;
  font-weight: 500;
  text-transform: uppercase;
}
#as3cf-settings.wpome div.nav div.items ul.nav li {
  margin-right: 1.75rem;
  padding: 0.6rem 0.2rem 0.65rem;
  border-bottom: 3px solid #fff;
}
#as3cf-settings.wpome div.nav div.items ul.nav li a {
  color: var(--as3cf-color-gray-600);
  text-decoration: none;
}
#as3cf-settings.wpome div.nav div.items ul.nav li a:hover {
  color: var(--as3cf-color-primary-600);
}
#as3cf-settings.wpome div.nav div.items ul.nav li a:focus, #as3cf-settings.wpome div.nav div.items ul.nav li a:active {
  box-shadow: none;
}
#as3cf-settings.wpome div.nav div.items ul.nav li a:focus-visible {
  color: var(--as3cf-color-primary-600);
  box-shadow: 0 0 0 1.5px var(--as3cf-color-white), 0 0 0 3.5px var(--as3cf-color-primary-400);
  border-radius: 3px;
  outline: none;
}
#as3cf-settings.wpome div.nav div.items ul.nav li.focus, #as3cf-settings.wpome div.nav div.items ul.nav li.hover {
  border-bottom: 3px solid var(--as3cf-color-gray-600);
}
#as3cf-settings.wpome div.nav div.items ul.nav li.active {
  border-bottom: 3px solid var(--as3cf-color-primary-500);
}
#as3cf-settings.wpome div.nav div.items ul.nav li.active a {
  color: var(--as3cf-active-nav-color);
}
#as3cf-settings.wpome div.nav div.items .nav-status-wrapper {
  display: flex;
  flex-direction: row;
  align-items: center;
  margin-left: auto;
  text-decoration: none;
  gap: 0.5rem;
  align-self: stretch;
  min-width: 20px;
  /* When complete there's an icon prefix that takes up more room. */
  /* When a tool is running there is longer status text taking up room. */
}
#as3cf-settings.wpome div.nav div.items .nav-status-wrapper:focus {
  box-shadow: none;
  outline: none;
}
#as3cf-settings.wpome div.nav div.items .nav-status-wrapper .nav-status {
  height: 100%;
  display: flex;
  flex-direction: row;
  align-items: center;
  gap: 0.5rem;
  min-width: 20px;
  cursor: pointer;
}
#as3cf-settings.wpome div.nav div.items .nav-status-wrapper p {
  font-size: 0.75rem;
}
#as3cf-settings.wpome div.nav div.items .nav-status-wrapper p.status-text {
  flex: 0 0 max-content;
}
#as3cf-settings.wpome div.nav div.items .nav-status-wrapper > p {
  cursor: pointer;
}
#as3cf-settings.wpome div.nav div.items .nav-status-wrapper .progress-bar {
  cursor: pointer;
  width: 200px;
}
#as3cf-settings.wpome div.nav div.items .nav-status-wrapper button {
  flex: 0 0 max-content;
}
#as3cf-settings.wpome div.nav div.items .nav-status-wrapper .animation-running {
  cursor: pointer;
  display: none;
}
#as3cf-settings.wpome div.nav div.items .nav-status-wrapper .animation-running img {
  height: 42px;
}
@media (max-width: 1120px) {
  #as3cf-settings.wpome div.nav div.items .nav-status-wrapper > button:not(.btn-expandable) {
    display: none;
  }
  #as3cf-settings.wpome div.nav div.items .nav-status-wrapper .animation-running {
    display: block;
  }
}
@media (max-width: 700px) {
  #as3cf-settings.wpome div.nav div.items .nav-status-wrapper .progress-bar {
    display: none;
  }
}
@media (max-width: 640px) {
  #as3cf-settings.wpome div.nav div.items .nav-status-wrapper {
    display: none;
  }
}
#as3cf-settings.wpome div.nav div.items .nav-status-wrapper.complete {
  /* Remove complete icon before removing whole status. */
}
@media (max-width: 720px) {
  #as3cf-settings.wpome div.nav div.items .nav-status-wrapper.complete .progress-bar {
    display: none;
  }
}
@media (max-width: 670px) {
  #as3cf-settings.wpome div.nav div.items .nav-status-wrapper.complete img.icon.type {
    display: none;
  }
}
#as3cf-settings.wpome div.nav div.items .nav-status-wrapper.tool-running {
  /* Because there is an animated icon giving context we can reduce text. */
}
@media (max-width: 800px) {
  #as3cf-settings.wpome div.nav div.items .nav-status-wrapper.tool-running .progress-bar {
    display: none;
  }
}
@media (max-width: 740px) {
  #as3cf-settings.wpome div.nav div.items .nav-status-wrapper.tool-running .status-text strong {
    font-size: 1.1rem;
  }
  #as3cf-settings.wpome div.nav div.items .nav-status-wrapper.tool-running .status-text span {
    display: none;
  }
}
#as3cf-settings.wpome .subnav {
  display: flex;
  border-bottom: 1px solid var(--as3cf-wordpress-border-color);
  padding: 0;
  align-items: baseline;
  margin: 0 0 3rem;
}
#as3cf-settings.wpome .subnav.subpage {
  display: none;
}
@media (max-width: 1100px) {
  #as3cf-settings.wpome .subnav.subpage {
    display: flex;
  }
}
#as3cf-settings.wpome .subnav li {
  font-size: 0.875rem;
  font-weight: 500;
  padding-bottom: 1rem;
  margin: 0 2rem 0 0;
}
#as3cf-settings.wpome .subnav li.step-arrow {
  all: unset;
  display: flex;
  align-self: flex-start;
  margin: 0 2rem 0 0;
}
#as3cf-settings.wpome .subnav li.has-icon {
  margin: 0 0.5625rem 0 0;
}
#as3cf-settings.wpome .subnav li a {
  color: var(--as3cf-color-gray-600);
  text-decoration: none;
}
#as3cf-settings.wpome .subnav li a:hover {
  color: var(--as3cf-color-primary-600);
}
#as3cf-settings.wpome .subnav li a:focus, #as3cf-settings.wpome .subnav li a:active {
  box-shadow: none;
  outline: none;
}
#as3cf-settings.wpome .subnav li a:focus-visible {
  color: var(--as3cf-color-primary-600);
  box-shadow: 0 0 0 1.5px var(--as3cf-wordpress-background-color), 0 0 0 3.5px var(--as3cf-color-primary-400);
  border-radius: 3px;
  outline: none;
}
#as3cf-settings.wpome .subnav li.focus, #as3cf-settings.wpome .subnav li.hover {
  border-bottom: 3px solid var(--as3cf-color-gray-600);
}
#as3cf-settings.wpome .subnav li.active {
  border-bottom: 3px solid var(--as3cf-color-primary-500);
}
#as3cf-settings.wpome .subnav li.active a {
  color: var(--as3cf-active-nav-color);
}
#as3cf-settings.wpome .lite-wrapper .subnav {
  display: flex !important;
}
#as3cf-settings.wpome.wpomepro > .header .header-wrapper {
  width: 1220px;
  max-width: 1220px;
}
#as3cf-settings.wpome.wpomepro > .nav div.items {
  max-width: 1220px;
}

#as3cf-settings.wpome .notifications.wrapper {
  margin: 0 0 2rem 0;
}
#as3cf-settings.wpome .notification {
  box-sizing: border-box;
  padding: 0;
  margin: 0 0 0.5rem 0;
  box-shadow: 0 2px 8px -5px rgba(50, 50, 93, 0.25), 0px 8px 5px -12px rgba(0, 0, 0, 0.3);
  border-radius: 8px;
  display: flex;
  flex-direction: column;
  /* Probably redundant now, but keeping until verified post 3.0 release. */
}
#as3cf-settings.wpome .notification .content {
  box-sizing: border-box;
  padding: 10px 14px 10px 12px;
  margin: 0;
  display: flex;
  align-items: center;
  gap: 14px;
}
#as3cf-settings.wpome .notification .content div.icon.type {
  margin: 0;
  padding: 0;
  width: 28px;
  height: 28px;
  border-radius: 6px;
  flex: 0 0 28px;
  align-self: flex-start;
  display: flex;
  align-items: center;
  justify-content: center;
}
#as3cf-settings.wpome .notification .content div.icon.type.in-panel {
  align-self: auto;
}
#as3cf-settings.wpome .notification .content div.icon.type img.icon.type {
  width: 16px;
  height: 16px;
}
#as3cf-settings.wpome .notification .content h3 {
  margin: 0 0.5rem 0.5rem 0;
  font-size: 0.8125rem;
  line-height: 1.3rem;
  font-weight: 600;
  color: var(--as3cf-color-gray-900);
  width: 100%;
}
#as3cf-settings.wpome .notification .content p {
  margin: 0 0.5rem 0.5rem 0;
  font-size: 0.8125rem;
  line-height: 1.3rem;
  color: var(--as3cf-color-gray-900);
}
#as3cf-settings.wpome .notification .content p li {
  list-style: disc;
}
#as3cf-settings.wpome .notification .content p:last-of-type {
  margin-bottom: 0;
}
#as3cf-settings.wpome .notification .content code {
  padding: 0.05rem 0.4rem;
  margin: 0 0.1rem;
  border-radius: 5px;
  line-height: 1;
}
#as3cf-settings.wpome .notification .content .body {
  margin: 0;
  padding: 0;
  width: 100%;
  overflow-wrap: anywhere;
  display: flex;
  flex-direction: column;
}
#as3cf-settings.wpome .notification .content .body .heading {
  display: flex;
  flex-direction: row;
  align-items: center;
}
#as3cf-settings.wpome .notification .content .body .heading p {
  width: 100%;
}
#as3cf-settings.wpome .notification .content .body .heading .close {
  flex: 0 0 16px;
  width: 16px;
  height: 16px;
  min-width: 16px;
  min-height: 16px;
  background: url(../img/icon/close.svg) no-repeat;
  border: none;
  border-radius: 100%;
  cursor: pointer;
}
#as3cf-settings.wpome .notification .content .body .links a {
  margin-right: 0.75rem;
}
#as3cf-settings.wpome .notification.multiline .content {
  padding: 14px 14px 14px 12px;
}
#as3cf-settings.wpome .notification.multiline .content .body .heading .close {
  align-self: first baseline;
}
#as3cf-settings.wpome .notification.multiline .content.in-panel {
  padding: 0.875rem 1.5rem 0.875rem 1.5rem;
  gap: 16px;
}
#as3cf-settings.wpome .notification.inline.multiline .content {
  padding: 16px;
  gap: 16px;
}
#as3cf-settings.wpome .notification.inline.multiline .content div.icon.type {
  margin-top: 4px;
}
#as3cf-settings.wpome .notification.expandable .heading {
  gap: 8px;
}
#as3cf-settings.wpome .notification.expandable.expanded .details {
  max-height: 14.5rem;
  overflow-y: auto;
  margin: 0;
  padding: 0;
}
#as3cf-settings.wpome .notification.expandable.expanded .details .item {
  margin: 0;
  padding: 1.5rem;
  line-height: 1.4;
  display: flex;
  flex-direction: column;
}
#as3cf-settings.wpome .notification.expandable.expanded .details .item .summary {
  margin-bottom: 0.75rem;
  display: flex;
  align-items: center;
  width: 100%;
}
#as3cf-settings.wpome .notification.expandable.expanded .details .item .summary .title {
  width: 100%;
  font-weight: 600;
}
#as3cf-settings.wpome .notification.expandable.expanded .details .item ul.detail {
  margin: 0;
  padding: 0;
}
#as3cf-settings.wpome .notification.expandable.expanded .details .item ul.detail > li {
  padding: 0.3rem 0 0;
  line-height: 1.4;
}
#as3cf-settings.wpome .notification.expandable button {
  color: var(--as3cf-link-color);
  background-color: rgba(17, 17, 17, 0.04);
  border: 1px solid rgba(17, 17, 17, 0.08);
}
#as3cf-settings.wpome .notification.expandable button.btn-expandable {
  width: 22px;
  height: 22px;
  min-width: 22px;
  min-height: 22px;
  background-size: 11px;
  border-radius: 11px;
  filter: invert(27%) sepia(84%) saturate(1886%) hue-rotate(177deg) brightness(90%) contrast(103%);
}
#as3cf-settings.wpome .notification.expandable button.btn-expandable:hover, #as3cf-settings.wpome .notification.expandable button.btn-expandable:focus, #as3cf-settings.wpome .notification.expandable button.btn-expandable:active {
  filter: brightness(90%);
}
#as3cf-settings.wpome .notification.expandable button.dismiss {
  box-sizing: border-box;
  flex: 0 0 auto;
  display: flex;
  flex-direction: row;
  align-items: center;
  padding: 5px 10px;
  gap: 4px;
  border-radius: 6px;
}
#as3cf-settings.wpome .notification.expandable button.dismiss:before {
  content: url(../img/icon/x.svg);
  width: 7.5px;
}
#as3cf-settings.wpome .notification button:not(.btn-refresh):focus, #as3cf-settings.wpome .notification button:not(.btn-refresh):active {
  filter: brightness(90%);
  box-shadow: 0 0 0 1.5px var(--as3cf-color-white), 0 0 0 3.5px var(--as3cf-color-secondary-500);
  outline: 0;
}
#as3cf-settings.wpome .notification.info {
  background: var(--as3cf-notice-info-background-color);
  border: 1px solid var(--as3cf-notice-info-border-color);
}
#as3cf-settings.wpome .notification.info div.icon.type {
  background: var(--as3cf-notice-info-color);
}
#as3cf-settings.wpome .notification.info.expandable.expanded .details .item {
  border-top: 1px solid rgba(46, 107, 222, 0.16);
}
#as3cf-settings.wpome .notification.success {
  background: var(--as3cf-notice-success-background-color);
  border: 1px solid var(--as3cf-notice-success-border-color);
}
#as3cf-settings.wpome .notification.success div.icon.type {
  background: var(--as3cf-notice-success-color);
}
#as3cf-settings.wpome .notification.success.expandable.expanded .details .item {
  border-top: 1px solid rgba(232, 99, 94, 0.16);
}
#as3cf-settings.wpome .notification.warning {
  background: var(--as3cf-notice-warning-background-color);
  border: 1px solid var(--as3cf-notice-warning-border-color);
}
#as3cf-settings.wpome .notification.warning div.icon.type {
  background: var(--as3cf-notice-warning-color);
}
#as3cf-settings.wpome .notification.warning code {
  background: var(--as3cf-notice-warning-code-background-color);
}
#as3cf-settings.wpome .notification.warning.expandable.expanded .details .item {
  border-top: 1px solid rgba(99, 185, 105, 0.16);
}
#as3cf-settings.wpome .notification.error {
  background: var(--as3cf-notice-error-background-color);
  border: 1px solid var(--as3cf-notice-error-border-color);
}
#as3cf-settings.wpome .notification.error div.icon.type {
  background: var(--as3cf-notice-error-color);
}
#as3cf-settings.wpome .notification.error.expandable.expanded .details .item {
  border-top: 1px solid rgba(232, 99, 94, 0.16);
}
#as3cf-settings.wpome .notification.in-panel {
  border-left: 0;
  border-right: 0;
  border-radius: 0;
}
#as3cf-settings.wpome .notification.wordpress {
  background: var(--as3cf-color-white);
  border: 1px solid var(--as3cf-wordpress-border-color);
}
#as3cf-settings.wpome .notification.wordpress.info {
  border-left: 5px solid var(--as3cf-wordpress-notice-info-color);
}
#as3cf-settings.wpome .notification.wordpress.success {
  border-left: 5px solid var(--as3cf-wordpress-notice-success-color);
}
#as3cf-settings.wpome .notification.wordpress.warning {
  border-left: 5px solid var(--as3cf-wordpress-notice-warning-color);
}
#as3cf-settings.wpome .notification.wordpress.error {
  border-left: 5px solid var(--as3cf-wordpress-notice-error-color);
}

#as3cf-settings.wpome .indicator,
#as3cf-settings.wpome .progress-bar {
  height: 8px;
  border-radius: 8px;
}
#as3cf-settings.wpome .progress-bar {
  background: var(--as3cf-color-gray-300);
}
#as3cf-settings.wpome .progress-bar.stripe.animate,
#as3cf-settings.wpome .progress-bar.stripe > .indicator.animate {
  background-size: 30px 30px;
  background-image: -moz-linear-gradient(-45deg, rgba(255, 255, 255, 0.15) 0%, rgba(255, 255, 255, 0.15) 25%, rgba(255, 255, 255, 0) 25%, rgba(255, 255, 255, 0) 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, rgba(255, 255, 255, 0) 75%, rgba(255, 255, 255, 0) 100%);
  background-image: -webkit-gradient(linear, left top, right bottom, color-stop(0%, rgba(255, 255, 255, 0.2)), color-stop(25%, rgba(255, 255, 255, 0.2)), color-stop(25%, rgba(255, 255, 255, 0)), color-stop(50%, rgba(255, 255, 255, 0)), color-stop(50%, rgba(255, 255, 255, 0.2)), color-stop(75%, rgba(255, 255, 255, 0.2)), color-stop(75%, rgba(255, 255, 255, 0)), color-stop(100%, rgba(255, 255, 255, 0)));
  background-image: -webkit-linear-gradient(-45deg, rgba(255, 255, 255, 0.3) 0%, rgba(255, 255, 255, 0.3) 25%, rgba(255, 255, 255, 0) 25%, rgba(255, 255, 255, 0) 50%, rgba(255, 255, 255, 0.3) 50%, rgba(255, 255, 255, 0.3) 75%, rgba(255, 255, 255, 0) 75%, rgba(255, 255, 255, 0) 100%);
  background-image: -o-linear-gradient(-45deg, rgba(255, 255, 255, 0.15) 0%, rgba(255, 255, 255, 0.15) 25%, rgba(255, 255, 255, 0) 25%, rgba(255, 255, 255, 0) 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, rgba(255, 255, 255, 0) 75%, rgba(255, 255, 255, 0) 100%);
  background-image: -ms-linear-gradient(-45deg, rgba(255, 255, 255, 0.15) 0%, rgba(255, 255, 255, 0.15) 25%, rgba(255, 255, 255, 0) 25%, rgba(255, 255, 255, 0) 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, rgba(255, 255, 255, 0) 75%, rgba(255, 255, 255, 0) 100%);
  background-image: linear-gradient(135deg, rgba(255, 255, 255, 0.15) 0%, rgba(255, 255, 255, 0.15) 25%, rgba(255, 255, 255, 0) 25%, rgba(255, 255, 255, 0) 50%, rgba(255, 255, 255, 0.15) 50%, rgba(255, 255, 255, 0.15) 75%, rgba(255, 255, 255, 0) 75%, rgba(255, 255, 255, 0) 100%);
  animation: progress 5s linear infinite;
}
@keyframes progress {
  from {
    background-position: 0 0;
  }
  to {
    background-position: -60px -60px;
  }
}
#as3cf-settings.wpome .progress-bar.stripe.animate {
  background-color: var(--as3cf-secondary-color);
}
#as3cf-settings.wpome .progress-bar .indicator {
  display: block;
  background-color: var(--as3cf-color-primary-500);
  width: 40%;
}
#as3cf-settings.wpome .progress-bar .indicator.running {
  background-color: var(--as3cf-color-secondary-500);
}
#as3cf-settings.wpome .progress-bar .indicator.complete {
  background-color: var(--as3cf-complete-color);
  width: 100%;
}

/*
 * Storage and Delivery Provider specific styles.
 */
#as3cf-settings.wpome .delivery.aws .gradient {
  background: linear-gradient(225deg, rgba(255, 213, 213, 0.5) 0%, rgba(255, 213, 213, 0) 50%);
}
#as3cf-settings.wpome .delivery.cloudflare .gradient {
  background: linear-gradient(225deg, rgba(255, 221, 192, 0.5) 0%, rgba(255, 221, 192, 0) 50%);
}
#as3cf-settings.wpome .delivery.do .gradient {
  background: linear-gradient(225deg, rgba(205, 230, 255, 0.5) 0%, rgba(205, 230, 255, 0) 50%);
}
#as3cf-settings.wpome .delivery.gcp .gradient {
  background: linear-gradient(225deg, rgba(226, 226, 226, 0.5) 0%, rgba(226, 226, 226, 0) 50%);
}
#as3cf-settings.wpome .delivery.keycdn .gradient {
  background: linear-gradient(225deg, rgba(4, 122, 237, 0.16) 0%, rgba(4, 122, 237, 0) 50%);
}
#as3cf-settings.wpome .delivery.other .gradient {
  background: linear-gradient(225deg, rgba(228, 234, 241, 0.5) 0%, rgba(228, 234, 241, 0) 50%);
}
#as3cf-settings.wpome .delivery.stackpath .gradient {
  background: linear-gradient(225deg, rgba(226, 226, 226, 0.5) 0%, rgba(226, 226, 226, 0) 50%);
}
#as3cf-settings.wpome .storage.aws .gradient {
  background: linear-gradient(225deg, rgba(255, 214, 197, 0.5) 0%, rgba(255, 214, 197, 0) 50%);
}
#as3cf-settings.wpome .storage.do .gradient {
  background: linear-gradient(225deg, rgba(205, 230, 255, 0.5) 0%, rgba(205, 230, 255, 0) 50%);
}
#as3cf-settings.wpome .storage.gcp .gradient {
  background: linear-gradient(225deg, rgba(226, 226, 226, 0.5) 0%, rgba(226, 226, 226, 0) 50%);
}

#as3cf-settings.wpome {
  /**
   * Misc
   */
}
#as3cf-settings.wpome .as3cf-sidebar {
  width: 292px;
  min-width: 292px;
  height: max-content;
  margin-left: 2.25rem;
  margin-top: -0.5rem;
}
#as3cf-settings.wpome .as3cf-sidebar.lite {
  background: white;
  border-radius: 7px;
  border: 1px solid #D9E1EB;
  overflow: hidden;
  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.1);
}
#as3cf-settings.wpome .as3cf-sidebar .block {
  padding: 20px;
  border: 1px solid #ccc;
}
#as3cf-settings.wpome .as3cf-sidebar .subscribe {
  border-top: none;
  text-align: center;
  padding: 40px 20px;
}
#as3cf-settings.wpome .as3cf-sidebar .subscribe h2 {
  padding: 0;
  margin: 0;
  margin-bottom: 0.5em;
  color: #666;
  font-size: 17px;
  line-height: 1.2em;
  float: none;
  text-transform: none;
  font-weight: 500;
}
#as3cf-settings.wpome .as3cf-sidebar .subscribe .button {
  width: 100% !important;
  margin: 1rem auto;
  text-transform: uppercase;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center !important;
}
#as3cf-settings.wpome .as3cf-sidebar .subscribe p {
  margin: 0;
}
#as3cf-settings.wpome .as3cf-sidebar .subscribe .discount-applied {
  color: rgba(0, 0, 0, 0.4);
  font-size: 12px;
  line-height: 1.4em;
  margin-top: 10px;
}
@media screen and (max-width: 1052px) {
  #as3cf-settings.wpome .as3cf-sidebar {
    position: relative;
    top: auto;
    right: auto;
  }
}
#as3cf-settings.wpome .as3cf-active-provider, #as3cf-settings.wpome .as3cf-active-bucket {
  font-weight: bold;
  margin-right: 10px;
}
#as3cf-settings.wpome .as3cf-banner {
  width: 292px;
  height: 156px;
  display: block;
  background: #f8cfae url(../img/sidebar/os3-banner.svg) left bottom/100% no-repeat;
}
#as3cf-settings.wpome .as3cf-banner:focus {
  box-shadow: none;
}
#as3cf-settings.wpome .as3cf-upgrade-details {
  background-color: #4e0d33;
  padding: 10px 20px 20px 20px;
  color: #eee;
  font-size: 12.5px;
  display: block;
  text-decoration: none;
}
#as3cf-settings.wpome .as3cf-upgrade-details h1 {
  font-size: 27px;
  color: #f8cfae;
  margin: 0 0 15px 0;
  padding: 0;
  font-weight: 300;
  line-height: 1;
}
#as3cf-settings.wpome .as3cf-upgrade-details h2 {
  font-size: 15px;
  color: #F8CFAE;
  margin: 0 0 30px 0;
  font-weight: 600;
  line-height: 20px;
}
#as3cf-settings.wpome .as3cf-upgrade-details p {
  margin: 0;
}
#as3cf-settings.wpome .as3cf-upgrade-details a {
  color: #eee;
  font-weight: bold;
  text-decoration: none;
  font-size: 16px;
  box-shadow: none;
}
#as3cf-settings.wpome .as3cf-upgrade-details a:hover {
  color: #fff;
}
#as3cf-settings.wpome .as3cf-upgrade-details ul {
  margin: 0 !important;
  padding: 0;
  list-style: none;
}
#as3cf-settings.wpome .as3cf-upgrade-details ul li {
  margin-bottom: 15px;
  line-height: 18px;
  padding-left: 25px;
  background: url(../img/sidebar/item-checked.svg) left center no-repeat;
}

#as3cf-settings.wpome {
  /*
   * Add an external link icon after any link that uses "_blank" target.
   * There's a couple of classes where we don't want the icon too.
    */
}
#as3cf-settings.wpome a,
#as3cf-settings.wpome button,
#as3cf-settings.wpome h1,
#as3cf-settings.wpome h2,
#as3cf-settings.wpome h3,
#as3cf-settings.wpome h4,
#as3cf-settings.wpome h5,
#as3cf-settings.wpome input,
#as3cf-settings.wpome li,
#as3cf-settings.wpome p,
#as3cf-settings.wpome pre,
#as3cf-settings.wpome select,
#as3cf-settings.wpome span,
#as3cf-settings.wpome textarea {
  letter-spacing: 0.25px;
  line-height: 1;
  margin: 0;
}
#as3cf-settings.wpome li {
  list-style: none;
}
#as3cf-settings.wpome .semibold {
  font-weight: 600;
}
#as3cf-settings.wpome .bold {
  font-weight: 700;
}
#as3cf-settings.wpome p {
  font-size: 0.875rem;
  color: var(--as3cf-color-gray-900);
  font-weight: 400;
}
#as3cf-settings.wpome .page-title {
  margin-bottom: 3rem;
}
#as3cf-settings.wpome a[target=_blank]:not(.help):not(.licence):not(.email):after {
  box-sizing: border-box;
  content: "\f504";
  display: inline-block;
  font-family: "dashicons", emoji;
  font-size: larger;
  text-decoration: none;
  vertical-align: sub;
  margin-left: 0.2rem;
  margin-right: -1rem;
}
#as3cf-settings.wpome .link {
  font-size: 0.8125rem;
  color: #0073AA;
}
#as3cf-settings.wpome .link:hover {
  filter: brightness(115%);
}
#as3cf-settings.wpome pre, #as3cf-settings.wpome textarea.pre {
  background: var(--as3cf-code-background);
  border: 1px solid #D2CFCF;
  border-radius: 6px;
  padding: 1rem 1.2rem;
  display: flex;
  flex: 1;
  font-size: 0.8125rem;
  line-height: 1.6;
  color: var(--as3cf-color-white);
  font-weight: 400;
  margin: 0 0 1.5rem;
  box-sizing: border-box;
  width: 100%;
  overflow-y: scroll;
  /* Standards compliant scrollbar (future) */
  /*
  scrollbar-color: var(--as3cf-secondary-color) var(--as3cf-code-background);
  scrollbar-width: 12px;
   */
  /* Ye olde webkit scrollbar */
}
#as3cf-settings.wpome pre::-webkit-scrollbar, #as3cf-settings.wpome textarea.pre::-webkit-scrollbar {
  width: 12px;
}
#as3cf-settings.wpome pre::-webkit-scrollbar-track, #as3cf-settings.wpome textarea.pre::-webkit-scrollbar-track {
  background: var(--as3cf-code-background);
  border-radius: 6px;
}
#as3cf-settings.wpome pre::-webkit-scrollbar-corner, #as3cf-settings.wpome textarea.pre::-webkit-scrollbar-corner {
  background-color: var(--as3cf-code-background);
  border-radius: 6px;
}
#as3cf-settings.wpome pre::-webkit-resizer, #as3cf-settings.wpome textarea.pre::-webkit-resizer {
  background-color: var(--as3cf-code-background);
  border-radius: 6px;
}
#as3cf-settings.wpome pre::-webkit-scrollbar-thumb, #as3cf-settings.wpome textarea.pre::-webkit-scrollbar-thumb {
  background-color: var(--as3cf-secondary-color);
  border: 1px solid var(--as3cf-code-background);
  border-radius: 5px;
}

#as3cf-settings.wpome .page-wrapper h2.page-title {
  font-size: 0.9375rem;
  color: var(--as3cf-color-gray-900);
  font-weight: 500;
  margin: 0 0 1.25rem;
}
#as3cf-settings.wpome .lite-wrapper {
  display: flex;
  max-width: 1110px;
}
@media (max-width: 1024px) {
  #as3cf-settings.wpome .lite-wrapper .as3cf-sidebar {
    display: none;
  }
}
#as3cf-settings.wpome .lite-wrapper .page-wrapper {
  width: 840px;
}
#as3cf-settings.wpome .lite-wrapper .page-wrapper.assets, #as3cf-settings.wpome .lite-wrapper .page-wrapper.tools {
  width: 768px;
}
#as3cf-settings.wpome .lite-wrapper .page-wrapper.media {
  width: 780px;
  max-width: 780px;
}
#as3cf-settings.wpome .lite-wrapper .media-page.wrapper {
  flex-direction: column !important;
}
#as3cf-settings.wpome .lite-wrapper .media-page.wrapper .panel {
  width: 100%;
  max-width: 780px;
}
#as3cf-settings.wpome .lite-wrapper .media-page.wrapper .delivery-settings {
  margin: 0;
  display: none;
}
#as3cf-settings.wpome .lite-wrapper .media-page.wrapper .delivery-settings.active {
  display: flex;
}
#as3cf-settings.wpome .lite-wrapper .media-page.wrapper .storage-settings {
  margin: 0;
  display: none;
}
#as3cf-settings.wpome .lite-wrapper .media-page.wrapper .storage-settings.active {
  display: flex;
}
#as3cf-settings.wpome .lite-wrapper .panel.url-preview {
  width: 100%;
  max-width: 780px;
}
#as3cf-settings.wpome .lite-wrapper .fixed-cta-block .buttons {
  width: calc(1110px + 4rem);
  max-width: calc(1110px + 4rem);
}
@media screen and (max-width: 1024px) {
  #as3cf-settings.wpome .lite-wrapper .fixed-cta-block .buttons {
    max-width: calc(780px + 4rem);
  }
}
#as3cf-settings.wpome .media-page.wrapper {
  margin: 0;
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}
@media (max-width: 1100px) {
  #as3cf-settings.wpome .media-page.wrapper {
    flex-direction: column;
  }
}
@media (max-width: 1100px) {
  #as3cf-settings.wpome .media-page.wrapper .panel {
    max-width: 100%;
  }
}
#as3cf-settings.wpome .media-page.wrapper .delivery-settings,
#as3cf-settings.wpome .media-page.wrapper .storage-settings {
  display: flex;
  flex-direction: column;
}
#as3cf-settings.wpome .media-page.wrapper .storage-settings {
  margin: 0 2rem 0 0;
}
@media (max-width: 1100px) {
  #as3cf-settings.wpome .media-page.wrapper .storage-settings {
    margin: 0;
    display: none;
  }
  #as3cf-settings.wpome .media-page.wrapper .storage-settings.active {
    display: flex;
  }
}
#as3cf-settings.wpome .media-page.wrapper .delivery-settings {
  margin: 0 0 0 2rem;
}
@media (max-width: 1100px) {
  #as3cf-settings.wpome .media-page.wrapper .delivery-settings {
    margin: 0;
    display: none;
  }
  #as3cf-settings.wpome .media-page.wrapper .delivery-settings.active {
    display: flex;
  }
}
#as3cf-settings.wpome .subpage.wrapper, #as3cf-settings.wpome .subpage.page-wrapper {
  margin: 0;
  max-width: 840px;
}
#as3cf-settings.wpome .storage-page.wrapper .panel.multi .panel-container .panel-row.tab-buttons {
  gap: 1.5rem;
  flex-wrap: wrap;
}
#as3cf-settings.wpome .storage-page.wrapper .panel.multi .panel-container .panel-row.tab-buttons .button-tab {
  margin: 0;
  flex: 0 0 auto;
}
#as3cf-settings.wpome .storage-page.wrapper .panel.multi .panel-container .notification.notice-qsg {
  width: 100%;
}
#as3cf-settings.wpome .delivery-provider-settings-page.wrapper .panel.multi .panel-container .panel-row.delivery-provider-buttons .row {
  margin-bottom: 1.25rem;
  display: flex;
  align-items: center;
  width: 100%;
}
#as3cf-settings.wpome .delivery-provider-settings-page.wrapper .panel.multi .panel-container .panel-row.delivery-provider-buttons .row:last-of-type {
  margin-bottom: 0;
}
#as3cf-settings.wpome .delivery-provider-settings-page.wrapper .panel.multi .panel-container .panel-row.delivery-provider-buttons .row .button-tab {
  width: 12rem;
}
#as3cf-settings.wpome .delivery-provider-settings-page.wrapper .panel.multi .panel-container .panel-row.delivery-provider-buttons .row .button-tab:not(.btn-disabled):hover ~ p, #as3cf-settings.wpome .delivery-provider-settings-page.wrapper .panel.multi .panel-container .panel-row.delivery-provider-buttons .row .button-tab.active ~ p {
  font-weight: 600;
  opacity: 1;
}
#as3cf-settings.wpome .delivery-provider-settings-page.wrapper .panel.multi .panel-container .panel-row.delivery-provider-buttons .row p {
  margin: 0;
}
#as3cf-settings.wpome .delivery-provider-settings-page.wrapper .panel.multi .panel-container .panel-row.delivery-provider-buttons .row .speed,
#as3cf-settings.wpome .delivery-provider-settings-page.wrapper .panel.multi .panel-container .panel-row.delivery-provider-buttons .row .private-media {
  margin-left: 1.5rem;
  opacity: 0.7;
  font-size: 0.8125rem;
}
#as3cf-settings.wpome .delivery-provider-settings-page.wrapper .panel.multi .panel-container .panel-row.delivery-provider-buttons .row .help {
  margin-left: auto;
  display: flex;
}
#as3cf-settings.wpome .licence-page.wrapper {
  margin: 0 0 2rem;
  max-width: 700px;
  display: flex;
  flex-direction: row;
}
#as3cf-settings.wpome .licence-page.wrapper.defined {
  flex-direction: column;
  align-items: flex-start;
  gap: 0.5rem;
}
#as3cf-settings.wpome .licence-page.wrapper.defined .wp-config {
  margin-left: 0;
  flex: 0 0 auto;
}
#as3cf-settings.wpome .support-page.wrapper {
  margin: 0;
  max-width: 960px;
}
#as3cf-settings.wpome .support-page.wrapper .columns {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
}
#as3cf-settings.wpome .support-page.wrapper .licence-type {
  margin-bottom: 3rem;
}
#as3cf-settings.wpome .support-page.wrapper .licence-type span {
  font-weight: 700;
  color: var(--as3cf-color-primary-500);
}
#as3cf-settings.wpome .support-page.wrapper .lite-support {
  margin-bottom: 2rem;
}
#as3cf-settings.wpome .support-page.wrapper .lite-support p {
  line-height: 1.8;
  font-weight: 400;
}
#as3cf-settings.wpome .assets-page.wrapper {
  margin: 0;
  max-width: 768px;
}
#as3cf-settings.wpome .assets-page.wrapper .assets-panel {
  padding: 0.45rem 0;
  max-width: 768px;
}
#as3cf-settings.wpome .assets-page.wrapper .notice {
  margin-right: auto;
}
#as3cf-settings.wpome .assets-page.wrapper .settings {
  margin-bottom: 2rem;
  max-width: 100%;
}
#as3cf-settings.wpome .assets-page.wrapper .panel-row.status {
  padding: 1.75rem 0 0 4rem !important;
  height: max-content;
}
#as3cf-settings.wpome .assets-page.wrapper .panel-row.status img {
  width: 18px;
  height: 18px;
}
#as3cf-settings.wpome .assets-page.wrapper .panel-row.status h4 {
  margin-left: 0.8rem;
}
#as3cf-settings.wpome .assets-page.wrapper .panel-row.status p {
  margin: 0 !important;
}
#as3cf-settings.wpome .assets-page.wrapper .panel-row.last-checked {
  display: flex;
  align-items: center;
  margin: 0.7rem 0 0 4.7rem !important;
  height: max-content;
}
#as3cf-settings.wpome .assets-page.wrapper .panel-row.last-checked p {
  font-size: 0.75rem;
  margin: 0 !important;
}
#as3cf-settings.wpome .assets-page.wrapper .panel-row.last-checked a {
  margin-left: 1rem;
  text-decoration: underline;
}
#as3cf-settings.wpome .tools-page.wrapper {
  margin: 0;
  max-width: 768px;
}
#as3cf-settings.wpome .tools-page.wrapper .panel.multi .panel-container.tools-panel {
  padding: 0 0 0.45rem;
}
#as3cf-settings.wpome .tools-page.wrapper .panel.multi .panel-container.tools-panel .panel-row.header {
  height: 4.5rem !important;
}
#as3cf-settings.wpome .tools-page.wrapper .panel.multi .panel-container.tools-panel .panel-row.header img {
  margin-right: 2rem;
}
#as3cf-settings.wpome .tools-page.wrapper .panel.multi .panel-container.tools-panel .panel-row.header button {
  margin-left: auto;
}
#as3cf-settings.wpome .tools-page.wrapper .panel.multi .panel-container.tools-panel .panel-row.header .emoji-party {
  font-size: 28px;
}
#as3cf-settings.wpome .tools-page.wrapper .panel.multi .panel-container.tools-panel .panel-row.body {
  padding: 1.6rem 2.6rem 1.6rem 6.1rem;
}
#as3cf-settings.wpome .tools-page.wrapper .panel.multi .panel-container.tools-panel .panel-row.body.show-progress {
  margin: 0;
  display: flex;
  flex-direction: column;
}
#as3cf-settings.wpome .tools-page.wrapper .panel.multi .panel-container.tools-panel .panel-row.body.show-progress .status {
  display: flex;
  flex-direction: row;
  width: 100%;
  align-items: baseline;
}
#as3cf-settings.wpome .tools-page.wrapper .panel.multi .panel-container.tools-panel .panel-row.body.show-progress .status h4 {
  font-size: 0.8125rem;
  color: var(--as3cf-color-gray-900);
  font-weight: 400;
  margin: 0;
  opacity: 80%;
}
#as3cf-settings.wpome .tools-page.wrapper .panel.multi .panel-container.tools-panel .panel-row.body.show-progress .status h4 strong {
  font-size: 1.0625rem;
  font-weight: 600;
  opacity: 100%;
}
#as3cf-settings.wpome .tools-page.wrapper .panel.multi .panel-container.tools-panel .panel-row.body.show-progress .progress-bar {
  width: 100%;
  margin-top: 1rem;
}
#as3cf-settings.wpome .tools-page.wrapper .panel.multi .panel-container.tools-panel .panel-row.desc {
  font-size: 0.8125rem;
  color: var(--as3cf-color-gray-500);
  line-height: 1.65;
}
#as3cf-settings.wpome .panel.url-preview {
  max-width: 100%;
}
#as3cf-settings.wpome .panel.url-preview .panel-row {
  /* Good for Firefox & Safari, but Chrome isn't ready for this yet, experimental in v105.
   * @see https://developer.mozilla.org/en-US/docs/Web/CSS/contain#inline-size
   */
  /* Required until Chrome gets contain: inline-size */
}
#as3cf-settings.wpome .panel.url-preview .panel-row.desc p {
  font-size: 0.8125rem;
  color: var(--as3cf-color-gray-600);
  line-height: 1.625;
  margin: 1.5rem 0 0;
}
@supports (contain: inline-size) {
  #as3cf-settings.wpome .panel.url-preview .panel-row.body {
    contain: inline-size;
  }
}
#as3cf-settings.wpome .panel.url-preview .panel-row dl {
  margin: 1rem -1.5rem;
  padding: 0 1.5rem 1rem;
  display: flex;
  gap: 0.5rem;
  overflow-x: auto;
}
#as3cf-settings.wpome .panel.url-preview .panel-row dl div {
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2px;
  background: #E1E5E9;
  border-radius: 6px;
}
#as3cf-settings.wpome .panel.url-preview .panel-row dl div dt {
  margin: 0;
  padding: 0.5rem 1rem 0.375rem;
  white-space: nowrap;
  font-weight: 510;
}
#as3cf-settings.wpome .panel.url-preview .panel-row dl div dd {
  margin: 0;
  padding: 0.407rem 1rem;
  white-space: nowrap;
  display: flex;
  flex-direction: column;
  align-items: center;
  align-self: stretch;
  background: #FAFAFA;
  border: 1px solid #CBD5E0;
  border-radius: 6px;
  font-weight: 400;
  font-size: 0.75rem;
}
@supports not (contain: inline-size) {
  #as3cf-settings.wpome .panel.url-preview .panel-row dl {
    contain: size;
    width: 100%;
    height: 68px;
  }
}
#as3cf-settings.wpome .panel {
  flex: 1 0 auto;
  max-width: 575px;
  margin-bottom: 3rem;
  display: flex;
  flex-direction: column;
}
#as3cf-settings.wpome .panel .heading {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: 0.5rem;
}
#as3cf-settings.wpome .panel h2 {
  font-size: 0.9375rem;
  color: var(--as3cf-color-gray-900);
  font-weight: 500;
  margin: 0 0 1.25rem;
}
#as3cf-settings.wpome .panel .notification.inline {
  margin-left: 5rem;
  margin-right: 1.5rem;
}
#as3cf-settings.wpome .panel .panel-container {
  flex: 1 0 auto;
  display: flex;
  flex-direction: column;
  background: var(--as3cf-color-white);
  border: 1px solid var(--as3cf-wordpress-border-color);
  box-shadow: 0 1px 8px 0 rgba(0, 0, 0, 0.05), 0 2px 1px 0 rgba(0, 0, 0, 0.03);
  border-radius: 6px;
}
#as3cf-settings.wpome .panel .panel-container .panel-row {
  display: flex;
  align-items: center;
  padding: 0 1.5rem;
}
#as3cf-settings.wpome .panel .panel-container .panel-row.header {
  height: 6rem;
  border-bottom: 1px solid var(--as3cf-separator-color);
}
#as3cf-settings.wpome .panel .panel-container .panel-row.footer {
  border-top: 1px solid var(--as3cf-separator-color);
  border-bottom-left-radius: 5px;
  border-bottom-right-radius: 5px;
}
#as3cf-settings.wpome .panel .panel-container .panel-row h3, #as3cf-settings.wpome .panel .panel-container .panel-row h4 {
  font-size: 0.875rem;
  font-weight: 500;
  color: var(--as3cf-color-gray-800);
  margin-left: 1rem;
  margin-right: auto;
}
#as3cf-settings.wpome .panel .panel-container .panel-row .link {
  font-size: 0.8125rem;
  text-align: right;
  line-height: 1.5;
  margin-left: auto;
  font-weight: 500;
}
#as3cf-settings.wpome .panel .panel-container .panel-row .link + .help {
  margin-left: 1rem;
}
#as3cf-settings.wpome .panel .panel-container .setting .panel-row.option {
  margin-top: 1.5rem;
}
#as3cf-settings.wpome .panel .panel-container .setting .panel-row.option h4 {
  margin: 0 0 0 var(--as3cf-settings-option-indent);
}
#as3cf-settings.wpome .panel .panel-container .setting .panel-row.option a {
  margin-left: auto;
}
#as3cf-settings.wpome .panel .panel-container .setting .panel-row.desc {
  padding-right: var(--as3cf-settings-option-indent-right);
}
#as3cf-settings.wpome .panel .panel-container .setting .panel-row.desc p {
  font-size: 0.8125rem;
  color: var(--as3cf-color-gray-600);
  line-height: 1.625;
  margin-left: calc(var(--as3cf-settings-ctrl-width) + var(--as3cf-settings-option-indent));
  margin-top: 0.57rem;
  margin-bottom: 0.75rem;
}
#as3cf-settings.wpome .panel .panel-container .setting .panel-row.input {
  padding-right: var(--as3cf-settings-option-indent-right);
}
#as3cf-settings.wpome .panel .panel-container .setting .panel-row.input input[type=text] {
  margin-left: calc(var(--as3cf-settings-ctrl-width) + var(--as3cf-settings-option-indent));
  margin-bottom: 1.2rem;
  width: 100%;
}
#as3cf-settings.wpome .panel .panel-container .setting .panel-row.input input[type=text] + label {
  visibility: collapse;
}
#as3cf-settings.wpome .panel .panel-container .setting.nested {
  margin: 0 0 0.125rem 5.25rem;
  display: flex;
  flex-direction: column;
  border-left: 2px dotted #C2CBD3;
}
#as3cf-settings.wpome .panel .panel-container .setting.nested .panel-row {
  height: max-content;
  margin-bottom: 0;
}
#as3cf-settings.wpome .panel .panel-container .setting.nested .panel-row img {
  margin-left: auto;
}
#as3cf-settings.wpome .panel .panel-container .setting.nested .panel-row h4 {
  margin: 0;
}
#as3cf-settings.wpome .panel .panel-container .setting.nested .panel-row.option {
  margin-top: 1rem;
}
#as3cf-settings.wpome .panel .panel-container .setting.nested .panel-row.desc {
  height: max-content;
  padding: 0.4rem 2.25rem 0.85rem 1.65rem;
}
#as3cf-settings.wpome .panel .panel-container .setting.nested .panel-row.desc p {
  font-size: 0.8125rem;
  color: var(--as3cf-color-gray-600);
  line-height: 1.625;
  margin: 0;
}
#as3cf-settings.wpome .panel .panel-container .setting.nested .panel-row.input input[type=text] {
  margin-left: var(--as3cf-settings-input-indent);
}
#as3cf-settings.wpome .panel .panel-container .setting:last-of-type {
  margin-bottom: 0.75rem;
}
#as3cf-settings.wpome .panel .panel-container hr {
  height: 1px;
  width: 100%;
  border: 0;
  margin: 0;
  background: var(--as3cf-separator-color);
}
#as3cf-settings.wpome .panel.multi {
  max-width: 840px;
  margin-bottom: 2rem;
}
#as3cf-settings.wpome .panel.multi .panel-container.toggle-header .toggle-switch {
  margin-right: 1.25rem;
}
#as3cf-settings.wpome .panel.multi .panel-container.toggle-header .toggle-reveal label {
  display: inline-flex;
}
#as3cf-settings.wpome .panel.multi .panel-container.toggle-header .toggle-reveal a {
  margin-left: 0.3rem;
  display: contents;
}
#as3cf-settings.wpome .panel.multi .panel-container .panel-row {
  height: auto;
}
#as3cf-settings.wpome .panel.multi .panel-container .panel-row h3 {
  margin: 0;
}
#as3cf-settings.wpome .panel.multi .panel-container .panel-row p:last-of-type {
  margin-bottom: 0;
}
#as3cf-settings.wpome .panel.multi .panel-container .panel-row.header {
  height: 4rem;
  display: flex;
}
#as3cf-settings.wpome .panel.multi .panel-container .panel-row.header a {
  margin-left: auto;
  display: flex;
  align-items: center;
}
#as3cf-settings.wpome .panel.multi .panel-container .panel-row.header .provider {
  display: flex;
  margin-left: auto;
  align-items: center;
}
#as3cf-settings.wpome .panel.multi .panel-container .panel-row.header .provider a {
  display: flex;
  align-items: center;
  margin-left: auto;
}
#as3cf-settings.wpome .panel.multi .panel-container .panel-row.header .provider img {
  width: 24px;
  height: 24px;
  margin-right: 0.5rem;
}
#as3cf-settings.wpome .panel.multi .panel-container .panel-row.header .wp-config + .provider {
  margin-left: 1rem;
}
#as3cf-settings.wpome .panel.multi .panel-container .panel-row.body {
  padding: 2.5rem;
  align-items: flex-start;
}
#as3cf-settings.wpome .panel.multi .panel-container .panel-row.body .row {
  margin: 0;
  width: 100%;
}
#as3cf-settings.wpome .panel.multi .panel-container .panel-row.body .row.radio-btns {
  margin-bottom: 2.2rem;
}
#as3cf-settings.wpome .panel.multi .panel-container .panel-row.body .radio-desc {
  margin: -0.35rem 0 1.25rem 2rem;
  font-size: 12px;
  font-weight: 500;
  line-height: 1.4;
  opacity: 0.75;
}
#as3cf-settings.wpome .panel.multi .panel-container .panel-row.body.access-keys > p {
  margin-bottom: 1.5rem !important;
}
#as3cf-settings.wpome .panel.multi .panel-container .panel-row.body input[type=text],
#as3cf-settings.wpome .panel.multi .panel-container .panel-row.body textarea {
  width: 100%;
  margin-bottom: 1.5rem;
}
#as3cf-settings.wpome .panel.multi .panel-container .panel-row.body .bucket-name, #as3cf-settings.wpome .panel.multi .panel-container .panel-row.body .cdn-name {
  width: 100%;
}
#as3cf-settings.wpome .panel.multi .panel-container .panel-row.body p {
  margin: 0 0 1.5rem;
  line-height: 1.5;
}
#as3cf-settings.wpome .panel.multi .panel-container .panel-row.body p:last-of-type {
  margin-bottom: 0;
}
#as3cf-settings.wpome .panel.multi .panel-container .panel-row.body .link {
  text-decoration: underline;
}
#as3cf-settings.wpome .panel.multi .panel-container .panel-row.body .button-tab img {
  width: 24px;
  height: 24px;
  margin-right: 0.9rem;
}
#as3cf-settings.wpome .panel.multi .panel-container .panel-row.body .button-tab .checkmark {
  width: 16px;
  height: 16px;
  position: absolute;
  right: -19px;
  top: -5px;
}
#as3cf-settings.wpome .panel.multi .panel-container .panel-row.body .button-tab p {
  font-weight: 500;
  margin-bottom: 0;
}
#as3cf-settings.wpome .panel.multi .panel-container .panel-row.body .radio-btn {
  margin-bottom: 0.8rem;
}
#as3cf-settings.wpome .panel.multi .panel-container .panel-row.body .radio-btn:last-of-type {
  margin-bottom: 0;
}
#as3cf-settings.wpome .panel.multi .panel-container .panel-row.body .radio-btn.list {
  margin: 0 1.5rem 0 0;
}
#as3cf-settings.wpome .panel.multi .panel-container .panel-row.body .bucket-list {
  background: var(--as3cf-color-white);
  border: 1px solid var(--as3cf-wordpress-border-color);
  box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.05);
  border-radius: 6px;
  width: 100%;
  max-width: 580px;
  padding: 0 0.4rem;
  display: flex;
  flex-direction: column;
  height: 260px;
  overflow-y: scroll;
  box-sizing: border-box;
}
#as3cf-settings.wpome .panel.multi .panel-container .panel-row.body .bucket-list .row {
  display: flex;
  align-items: center;
  padding: 0.78rem 1.4rem;
  background: #F6F7F8;
  border-radius: 4px;
  margin: 0 0 0.3rem;
  cursor: pointer;
  box-sizing: border-box;
  flex: none;
  /* TODO: Better styling for no buckets in browse list? */
}
#as3cf-settings.wpome .panel.multi .panel-container .panel-row.body .bucket-list .row.active {
  background: rgba(236, 112, 94, 0.1);
  border: 1px solid var(--as3cf-color-primary-500);
  border-radius: 4px;
}
#as3cf-settings.wpome .panel.multi .panel-container .panel-row.body .bucket-list .row:first-of-type {
  margin-top: 0.4rem;
}
#as3cf-settings.wpome .panel.multi .panel-container .panel-row.body .bucket-list .row:last-of-type {
  margin-bottom: 0.4rem;
}
#as3cf-settings.wpome .panel.multi .panel-container .panel-row.body .bucket-list .row:nth-child(even) {
  background: var(--as3cf-color-white);
}
#as3cf-settings.wpome .panel.multi .panel-container .panel-row.body .bucket-list .row p {
  margin: 0;
  font-size: 0.84375rem;
}
#as3cf-settings.wpome .panel.multi .panel-container .panel-row.body .bucket-list .row .status {
  margin-left: auto;
}
#as3cf-settings.wpome .panel.multi .panel-container .panel-row.body .bucket-list .row.nothing-found {
  cursor: default;
  justify-content: center;
  align-items: center;
}
#as3cf-settings.wpome .panel.multi .panel-container .panel-row.body .new-bucket-details {
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
  margin-right: 1.8rem;
  flex: 5;
}
#as3cf-settings.wpome .panel.multi .panel-container .panel-row.body .region {
  width: 30%;
  flex: 3;
  margin-left: auto;
  margin-bottom: 1.5rem;
  box-sizing: border-box;
}
#as3cf-settings.wpome .panel.flyout {
  position: absolute;
  top: 50px;
  right: 0;
  min-width: 384px;
  z-index: 99;
  cursor: default;
}
#as3cf-settings.wpome .panel.flyout.multi .panel-container .panel-row.header {
  height: auto;
  padding: 1rem 1.5rem;
  align-items: center;
}
#as3cf-settings.wpome .panel.flyout.multi .panel-container .panel-row.header h3 {
  font-size: 13px;
  font-weight: 600;
  flex: 1 1 auto;
}
#as3cf-settings.wpome .panel.flyout.multi .panel-container .panel-row.summary {
  padding: 0;
}
#as3cf-settings.wpome .panel.flyout.multi .panel-container .panel-row.summary table {
  width: 100%;
  border-collapse: collapse;
  /* Indent the columns. */
  /* Table header has different styling and vertical padding. */
  /* Top and bottom rows have different vertical padding than between rows. */
}
#as3cf-settings.wpome .panel.flyout.multi .panel-container .panel-row.summary table th, #as3cf-settings.wpome .panel.flyout.multi .panel-container .panel-row.summary table td {
  padding: 0 0 1rem 2rem;
  color: var(--as3cf-color-gray-800);
  font-size: 12px;
  text-align: left;
  /* Make title column cell's width stretch, numerics are compact. */
  width: 100%;
}
#as3cf-settings.wpome .panel.flyout.multi .panel-container .panel-row.summary table th:first-of-type, #as3cf-settings.wpome .panel.flyout.multi .panel-container .panel-row.summary table td:first-of-type {
  padding-left: 1.5rem;
}
#as3cf-settings.wpome .panel.flyout.multi .panel-container .panel-row.summary table th:last-of-type, #as3cf-settings.wpome .panel.flyout.multi .panel-container .panel-row.summary table td:last-of-type {
  padding-right: 1.5rem;
}
#as3cf-settings.wpome .panel.flyout.multi .panel-container .panel-row.summary table thead {
  background-color: var(--as3cf-color-gray-100);
}
#as3cf-settings.wpome .panel.flyout.multi .panel-container .panel-row.summary table thead tr {
  border-bottom: 1px solid var(--as3cf-separator-color);
}
#as3cf-settings.wpome .panel.flyout.multi .panel-container .panel-row.summary table thead tr th {
  padding-top: 10px;
  padding-bottom: 10px;
  color: var(--as3cf-color-gray-700);
  font-weight: 500;
  font-size: 10px;
}
#as3cf-settings.wpome .panel.flyout.multi .panel-container .panel-row.summary table tbody tr:first-of-type td, #as3cf-settings.wpome .panel.flyout.multi .panel-container .panel-row.summary table tfoot tr:first-of-type td {
  padding-top: 1rem;
}
#as3cf-settings.wpome .panel.flyout.multi .panel-container .panel-row.summary table tbody tr:last-of-type td, #as3cf-settings.wpome .panel.flyout.multi .panel-container .panel-row.summary table tfoot tr:last-of-type td {
  padding-bottom: 1rem;
}
#as3cf-settings.wpome .panel.flyout.multi .panel-container .panel-row.summary table tfoot {
  /*
   * Hack in an indented border even though table header has
   * full width background and borders, without using extra
   * cells, and retaining relationship between header
   * and main body columns.
   *
   * PhpStorm will complain that there's no colours here, but there are!
   */
  background-image: linear-gradient(var(--as3cf-separator-color), var(--as3cf-separator-color));
  background-repeat: no-repeat;
  background-size: calc(100% - 1.5rem - 1.5rem) 1px;
  background-position: 1.5rem 0;
}
#as3cf-settings.wpome .panel.flyout.multi .panel-container .panel-row.summary table tfoot td {
  font-weight: 500;
}
#as3cf-settings.wpome .panel.flyout.multi .panel-container .panel-row.summary table .numeric {
  text-align: right;
  width: max-content;
  min-width: max-content;
  white-space: nowrap;
}
#as3cf-settings.wpome .panel.flyout.multi .panel-container .panel-row.summary table a {
  color: var(--as3cf-color-primary-500);
}
#as3cf-settings.wpome .panel.flyout.multi .panel-container .panel-row.footer {
  padding: 1.5rem;
  display: flex;
}
#as3cf-settings.wpome .panel.flyout.multi .panel-container .panel-row.footer.upsell {
  border-top: 1px solid var(--as3cf-color-primary-100);
  background-color: var(--as3cf-color-primary-50);
  flex-direction: column;
}
#as3cf-settings.wpome .panel.flyout.multi .panel-container .panel-row.footer.upsell p {
  margin-bottom: 0.5rem;
  white-space: nowrap;
}
#as3cf-settings.wpome .panel.flyout.multi .panel-container .panel-row.footer.upsell .button {
  margin: 0;
  width: 100%;
}
#as3cf-settings.wpome .panel.flyout.multi .panel-container .panel-row.footer.offload-remaining {
  background-color: var(--as3cf-color-gray-100);
}
#as3cf-settings.wpome .panel.flyout.multi .panel-container .panel-row.footer.offload-remaining button {
  flex: 100%;
}
#as3cf-settings.wpome .panel.flyout.multi .panel-container .panel-row.footer.licence {
  display: flex;
  align-items: center;
  padding-top: 10px;
  padding-bottom: 10px;
  background-color: var(--as3cf-color-gray-200);
  font-size: 12px;
}
#as3cf-settings.wpome .panel.flyout.multi .panel-container .panel-row.footer.licence .details {
  flex: 1 1 auto;
}
#as3cf-settings.wpome .panel.flyout.multi .panel-container .panel-row.footer.licence .details p {
  color: var(--as3cf-color-gray-600);
  line-height: 18px;
}
#as3cf-settings.wpome .panel.flyout.multi .panel-container .panel-row.footer.licence .details .title {
  color: var(--as3cf-color-gray-700);
  font-size: 10px;
}
#as3cf-settings.wpome .panel.flyout.multi .panel-container .panel-row.footer.licence a {
  color: var(--as3cf-color-primary-500);
}
#as3cf-settings.wpome .panel.flyout.multi .panel-container .panel-row.footer.licence a.upgrade {
  margin-right: 1rem;
}
#as3cf-settings.wpome p.wp-config {
  margin-left: auto;
  padding: 0.4rem 0.75rem;
  color: var(--as3cf-color-gray-500) !important;
  background: rgba(113, 135, 154, 0.15) !important;
  border: 1px solid rgba(113, 135, 154, 0.15) !important;
  border-radius: 5px;
  font-size: 0.84375rem;
  font-weight: 500;
  white-space: nowrap;
}
#as3cf-settings.wpome .panel .panel-container .setting .panel-row.option p.wp-config + a {
  margin-left: 1rem;
}
#as3cf-settings.wpome .panel .panel-container .setting .panel-row.desc p.wp-config {
  margin-right: 0;
}
#as3cf-settings.wpome .panel .panel-container .setting .panel-row label.input-label p.wp-config {
  text-transform: none;
  padding: 0.2rem 0.5rem;
}
#as3cf-settings.wpome .notice {
  all: unset;
  display: flex;
  flex-direction: row;
  background: rgba(56, 125, 189, 0.1);
  border: 1px solid #AFC8ED;
  border-radius: 5px;
  padding: 0.8rem 1.25rem;
  align-items: center;
}
#as3cf-settings.wpome .notice a,
#as3cf-settings.wpome .notice p {
  margin: 0 !important;
}
#as3cf-settings.wpome .notice a {
  display: inline-block;
  text-decoration: underline;
  font-size: 0.875rem !important;
}
#as3cf-settings.wpome .support-form {
  width: 600px;
}
#as3cf-settings.wpome .support-form input[type=text],
#as3cf-settings.wpome .support-form select,
#as3cf-settings.wpome .support-form textarea {
  width: 100%;
  margin-bottom: 1rem;
}
#as3cf-settings.wpome .support-form textarea {
  margin-bottom: 1.5rem;
}
#as3cf-settings.wpome .support-form .note {
  font-size: 0.78125rem;
  color: var(--as3cf-color-gray-500);
  margin-bottom: 2.5rem;
  line-height: 1.5;
}
#as3cf-settings.wpome .support-form .note.first {
  margin-bottom: 0.5rem;
}
#as3cf-settings.wpome .support-form .actions {
  display: flex;
  width: 100%;
  margin-bottom: 2rem;
  align-items: center;
}
#as3cf-settings.wpome .support-form .actions .btn-primary {
  margin-left: auto;
}
#as3cf-settings.wpome .diagnostic-info {
  max-width: 600px;
  padding: 0.25rem 0;
}
#as3cf-settings.wpome .diagnostic-info pre {
  height: 14.375rem;
  white-space: pre-wrap;
  word-break: keep-all;
}
#as3cf-settings.wpome .diagnostic-info hr {
  background: #D3D7DB;
  height: 3px;
  width: 100%;
  border: 0;
  margin-bottom: 3rem;
}
#as3cf-settings.wpome .diagnostic-info .btn-outline {
  display: flex;
  justify-content: center;
  margin-left: auto;
  width: max-content;
}
#as3cf-settings.wpome .documentation {
  background: #E4E5E7;
  border: 1px solid var(--as3cf-wordpress-border-color);
  box-shadow: 0 2px 8px 0 rgba(0, 0, 0, 0.05);
  border-radius: 6px;
  padding: 2.5rem;
  display: flex;
  flex-direction: column;
  margin: 1.4rem 0 0 3rem;
  height: max-content;
  width: 240px;
  box-sizing: border-box;
}
#as3cf-settings.wpome .documentation h3 {
  font-size: 1.03125rem;
  color: var(--as3cf-color-gray-900);
  letter-spacing: 0.15px;
  font-weight: 500;
  margin: 0 0 2.25rem;
}
#as3cf-settings.wpome .documentation a {
  font-size: 0.875rem;
  margin-bottom: 1.25rem;
}
#as3cf-settings.wpome .documentation a:last-of-type {
  margin-bottom: 0;
}
#as3cf-settings.wpome .upsell.panel {
  max-width: 768px;
}
#as3cf-settings.wpome .upsell .panel-container {
  padding: 0;
  flex-direction: row;
  background: linear-gradient(136.01deg, rgba(255, 228, 205, 0.7) 0.94%, rgb(255, 255, 255) 33.33%);
}
#as3cf-settings.wpome .upsell .branding {
  background: url(../../assets/img/brand/upsell-bunny.svg) no-repeat left bottom;
  min-width: 280px;
  border-radius: 5px;
  margin-right: -1.25rem;
}
@media (max-width: 840px) {
  #as3cf-settings.wpome .upsell .branding {
    display: none;
  }
}
#as3cf-settings.wpome .upsell .button {
  margin: 1rem auto;
  display: flex;
  justify-content: center;
  align-items: center;
  text-align: center !important;
}

/*
 * Our CSS variables, namespaced so they can be used anywhere.
 */
:root {
  --as3cf-code-type: consolas, monospace;
  --as3cf-color-white: #FFF;
  --as3cf-color-black: #000;
  --as3cf-color-gray-50: #FCFDFD;
  --as3cf-color-gray-100: #F9FAFB;
  --as3cf-color-gray-200: #F2F4F7;
  --as3cf-color-gray-300: #EAECF0;
  --as3cf-color-gray-400: #D0D5DD;
  --as3cf-color-gray-500: #98A2B3;
  --as3cf-color-gray-600: #667085;
  --as3cf-color-gray-700: #344054;
  --as3cf-color-gray-800: #1D2939;
  --as3cf-color-gray-900: #101828;
  --as3cf-color-primary-50: #FDF1EF;
  --as3cf-color-primary-100: #FBE2DF;
  --as3cf-color-primary-200: #F7C6BF;
  --as3cf-color-primary-300: #F4A99E;
  --as3cf-color-primary-400: #F08D7E;
  --as3cf-color-primary-500: #EC705E;
  --as3cf-color-primary-600: #C15B4C;
  --as3cf-color-primary-700: #96453A;
  --as3cf-color-primary-800: #6B3027;
  --as3cf-color-primary-900: #401A15;
  --as3cf-color-secondary-50: #EFF8FF;
  --as3cf-color-secondary-100: #D1E9FF;
  --as3cf-color-secondary-200: #B2DDFF;
  --as3cf-color-secondary-300: #84CAFF;
  --as3cf-color-secondary-400: #52B1FD;
  --as3cf-color-secondary-500: #2C90FA;
  --as3cf-color-secondary-600: #1270EF;
  --as3cf-color-secondary-700: #155CD3;
  --as3cf-color-secondary-800: #1749A9;
  --as3cf-color-secondary-900: #184185;
  --as3cf-secondary-color: #D8DDE2;
  --as3cf-text-disabled: #98A2B3;
  --as3cf-code-background: #102B44;
  --as3cf-separator-color: #EBEFF3;
  --as3cf-complete-color: #5BCB86;
  --as3cf-active-nav-color: #4E0D34;
  --as3cf-link-color: #0073AA;
  --as3cf-wordpress-background-color: #F1F1F1;
  --as3cf-wordpress-border-color: #D6D6D6;
  --as3cf-wordpress-notice-info-color: #02A0D2;
  --as3cf-notice-info-color: #2D69DA;
  --as3cf-notice-info-border-color: #2E6BDE;
  --as3cf-notice-info-background-color: #E7EFF9;
  --as3cf-wordpress-notice-success-color: #45B450;
  --as3cf-notice-success-color: #52AA59;
  --as3cf-notice-success-border-color: #63B969;
  --as3cf-notice-success-background-color: #EDF7EF;
  --as3cf-wordpress-notice-warning-color: #FFBA00;
  --as3cf-notice-warning-color: #F49C53;
  --as3cf-notice-warning-border-color: #E29936;
  --as3cf-notice-warning-background-color: #FDF8EB;
  --as3cf-notice-warning-code-background-color: #FCECC6;
  --as3cf-wordpress-notice-error-color: #DD3232;
  --as3cf-notice-error-color: #DA5A39;
  --as3cf-notice-error-border-color: #E8635E;
  --as3cf-notice-error-background-color: #F7EEEB;
  --as3cf-settings-ctrl-width: 36px;
  --as3cf-settings-option-indent: 1.2rem;
  --as3cf-settings-input-indent: 0;
  --as3cf-settings-option-indent-right: 2.25rem;
}

body.settings_page_amazon-s3-and-cloudfront {
  background: var(--as3cf-wordpress-background-color);
}
body.settings_page_amazon-s3-and-cloudfront #wpcontent {
  padding-left: 0 !important;
}
body.settings_page_amazon-s3-and-cloudfront #wpcontent #wpbody #wpbody-content > .notice {
  display: none;
}
body.settings_page_amazon-s3-and-cloudfront #wpcontent #wpbody #wpbody-content .wpome .wpome-wrapper {
  max-width: 1220px;
  margin: 0 2rem 3rem 2rem;
}
body.settings_page_amazon-s3-and-cloudfront #wpfooter {
  font-style: italic;
}

.locked {
  opacity: 0.55;
}

.flex-row {
  display: flex;
  flex-direction: row;
}

.flex-column {
  display: flex;
  flex-direction: column;
}

.align-center {
  align-items: center;
}

.align-center {
  align-items: center;
}

.align-baseline {
  align-items: baseline !important;
}

/*# sourceMappingURL=style.css.map */