body {
  margin: 0;
}

html {
  overflow-x: hidden;
  overflow-y: scroll;
}

#loading-bg {
  position: absolute;
  display: block;
  left: 0;
  top: 0;
  background:linear-gradient(to right,rgba(115,103,240,0.4) 10%, rgba(118,87,209,0.7) 40%) left/200% 100%;
   animation:change 2s infinite linear alternate;
  block-size: 100%;
  inline-size: 100%;
}
@keyframes change {
  to {
    background-position:right;
  }
}


.yupanaSpinner {
  width:100px;
  height:100px;
  background: #fff;
  -webkit-mask:url('/logo.svg') center/contain;
          mask:url('/logo.svg') center/contain;
	display: block;
	position: absolute;
  left: 50%;
	margin-left: -50px;
	top: 50%;
  margin-top: -50px;
}



.yupanaLoaderV {
  width:100px;
  height: 100vh;
  display: block;
  position: fixed;
    top: 0;
    left:0;
    z-index: 0;
  background:linear-gradient(to right,rgba(118,87,209,0.2) 10%, rgba(118,87,209,0.4) 40%) left/200% 100%;

  -webkit-mask:url('/aguayo_v.svg') center/cover;
          mask:url('/aguayo_v.svg') center/cover;

   animation:change 20s infinite linear alternate;
}
@keyframes change {
  to {
    background-position:right;
  }
}