@-moz-keyframes spin {
  100% {
    -moz-transform: rotate(360deg);
  }
}
@-webkit-keyframes spin {
  100% {
    -webkit-transform: rotate(360deg);
  }
}
@keyframes spin {
  100% {
    -webkit-transform: rotate(360deg);
    transform: rotate(360deg);
  }
}

.mp-search-form .ajax-progress-throbber .throbber,
.mp-recipe-search__form .ajax-progress-throbber .throbber,
#sl-calendar .ajax-progress-throbber .throbber,
.mp-onboarding .ajax-progress-throbber .throbber,
.addrecipe .ajax-progress-throbber .throbber,
.mp-dialog.ui-dialog .ajax-progress-throbber,
.preset-menu .ajax-progress-throbber .throbber,
.add-meal .ajax-progress-throbber .throbber,
.mp-loading.mp-loading--small.ajax-progress-throbber .throbber,
.menu-preferences .ajax-progress-throbber .throbber,
.ln-srh-mmp-api-renewal-confirmation .ajax-progress-throbber .throbber {
  display: inline-block;
  padding: 0;
  width: 20px;
  height: 20px;
  background: transparent url(../../icons/spinner-20-x-20.svg) no-repeat center center;
  background-size: contain;
  -webkit-animation: spin 2s infinite linear;
  animation: spin 2s infinite linear;
  filter: var(--filter-spinner);
}
.mp-loading--full-page-no-message .ajax-progress-throbber,
.mp-loading--full-page-no-message .mp-loading.ajax-progress-throbber,
.mp-loading--full-page .ajax-progress-throbber,
.mp-loading--full-page .mp-loading.ajax-progress-throbber,
.menu-preferences .ajax-progress-throbber,
.mealplanner .ajax-progress-throbber {
  position: fixed;
  display: block;
  width: 100vw;
  height: 100vh;
  background-color: rgba(99,99,99,.4);
  top: 0;
  left: 0;
  z-index: 1500;
}

.mp-loading--full-page .ajax-progress-throbber .throbber,
.mp-loading--full-page-no-message .ajax-progress-throbber .throbber,
.menu-preferences .ajax-progress-throbber .throbber,
.mealplanner .ajax-progress-throbber .throbber {
  position: absolute;
  display: block;
  top: 40vh;
  left: calc(50vw - 40px);
  width: 80px;
  height: 80px;
  background: transparent url(../../icons/spinner-20-x-20.svg) no-repeat center center;
  background-size: contain;
  -webkit-animation: spin 2s infinite linear;
  animation: spin 2s infinite linear;
  filter: var(--filter-spinner);
  z-index: 1;
}

.mp-loading--full-page .ajax-progress-throbber .message {
  position: relative;
  display: block;
  margin: 0 auto;
  box-sizing: border-box;
  padding: 128px 24px 36px 24px;
  top: 36vh;
  background-color: var(--mp-white);
  width: 500px;
  border-radius: var(--border-radius-small);
  max-width: 95%;
  text-align: center;
}

#sl-calendar .mp-loading.ajax-progress-throbber {
  top: 0px;
  left: 0px;
  position: fixed;
}
#sl-calendar .ajax-progress-throbber .throbber {
  width: 80px;
  height: 80px;
}

.meal-wrapper .mp-loading.ajax-progress-throbber .throbber,
.mp-week-calendar .mp-loading.ajax-progress-throbber .throbber,
.tab-pane .mp-loading.ajax-progress-throbber .throbber,
.mealplanner .ajax-progress-throbber .throbber,
.mp-onboarding .ajax-progress-throbber .throbber {
  display: inline-block;
  padding: 0;
  width: 80px;
  height: 80px;
  background: transparent url(../../icons/spinner-20-x-20.svg) no-repeat center center;
  background-size: contain;
  -webkit-animation: spin 2s infinite linear;
  animation: spin 2s infinite linear;
  filter: var(--filter-spinner);
}

.meal-wrapper .mp-loading.ajax-progress-throbber,
.mp-week-calendar .mp-loading.ajax-progress-throbber,
.tab-pane .mp-loading.ajax-progress-throbber,
.mealplanner .ajax-progress-throbber .throbber,
.mp-onboarding .ajax-progress-throbber .throbber {
  position: absolute;
  top: calc(50% - 40px);
  left: calc(50% - 40px);
  z-index: 200;
}

[dir="rtl"] .ajax-progress {
  float: unset;
}

.mp-loading--inline.mp-loading.ajax-progress-throbber {
  position: relative;
  top: auto;
  left: auto;
  z-index: auto;
  width: auto;
  height: auto;
  background-color: transparent;
}

.mp-loading--inline.mp-loading.ajax-progress-throbber .throbber {
  position: relative;
  z-index: auto;
  left: auto;
}

.mp-loading.ajax-progress-throbber {
  position: fixed;
  display: block;
  width: 100vw;
  height: 100vh;
  background-color: rgba(99,99,99,.4);
  top: 0;
  left: 0;
  z-index: 1500;
  text-align: center;
}

.mp-loading.ajax-progress-throbber .throbber {
  display: inline-block;
  padding: 0;
  width: 80px;
  height: 80px;
  background: transparent url(../../icons/spinner-20-x-20.svg) no-repeat center center;
  background-size: contain;
  -webkit-animation: spin 2s infinite linear;
  animation: spin 2s infinite linear;
  filter: var(--filter-spinner);
  margin-top: 50vh;
}

.mp-pending-day .mp-loading.ajax-progress-throbber .throbber {
  margin-top: 0;
}

#mealplanner .mp-loading.ajax-progress-throbber .throbber {
  margin-top: 0;
  display: inline-block;
  padding: 0;
  width: 80px;
  height: 80px;
  background: transparent url(../../icons/spinner-20-x-20.svg) no-repeat center center;
  background-size: contain;
  -webkit-animation: spin 2s infinite linear;
  animation: spin 2s infinite linear;
  filter: var(--filter-spinner);
}