.spinner-wrapper {
  position: fixed;
  inset:0;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index:9999;
  background:#fff;
  opacity:0;
  transition: opacity .3s ease
}

.spinner-wrapper.visible {
  opacity:1
}

.spinner-wrapper.fade-out {
  opacity:0
}

.spinner {
  padding-top:16px;
  width:32px;
  height:32px;
  margin-top:-16px;
  margin-left:-16px;
  position: relative
}

.spinner div {
  box-sizing: border-box;
  display: block;
  position: absolute;
  width:32px;
  height:32px;
  margin:8px;
  border-width:3px;
  border-style: solid;
  border-radius:100%;
  animation: spinner 1.7s cubic-bezier(.5,0,.5,1) infinite;
  border-color:#92979b transparent transparent transparent
}

.spinner div:nth-child(1) {
  animation-delay:-.45s
}

.spinner div:nth-child(2) {
  animation-delay:-.3s
}

.spinner div:nth-child(3) {
  animation-delay:-.15s
}

@keyframes spinner {
  0% {
    transform: rotate(0)
  }

  to {
    transform: rotate(360deg)
  }
}

.is-lock-scroll {
  overflow: hidden
}
