body.loading *{ pointer-events:none; cursor:wait;  }

#backImage{  }
#backImage:after{ display:none; }

#entrance{ position:fixed; top:50%; left:50%; transform:translate(-50%,-50%); width:70%; max-width:504px; cursor:pointer;
  transition:500ms ease-in-out;
  /* transition-delay:1200ms; */
}
  #entrance a{ position:absolute; top:0; left:0; right:0; bottom:0; width:100%; height:100%; }
  #entrance img{ pointer-events:none; }
  /* specific */
  #entrance img:is(#too,#much,#part){ position:relative; display:block; margin:0 auto;
    animation:updown infinite forwards 21s linear;
  }
  #entrance img#too{ width:468px; animation-delay:0s; }
  #entrance img#much{ width:465px; animation-delay:-7s; margin-top:2%; }
  #entrance img#part{ width:504px; margin-top:-17%; animation-delay:-14s; }
  #entrance img:is(#scissors,#rock,#paper){ position:absolute; width:15%;
    animation:tilt infinite forwards 4500ms steps(1);
  }
  #entrance img#scissors{ top:-4%; right:-13%; animation-delay:0ms; }
  #entrance img#rock{ top:50%; left:-10%; animation-delay:-300ms; }
  #entrance img#paper{ left:55%; bottom:-10%; margin-top:-100px; animation-delay:-1200ms; }

@keyframes updown {
  0%{ top:0; }
  50%{ top:-20px; }
  100%{ top:0; }
}
@keyframes tilt{
  0%{ transform:rotate(0deg); }
  50%{ transform:rotate(15deg); }
  100%{ transform:rotate(0deg); }
}

/* moving */
body.entrance{  }
  body.entrance #entrance{ cursor:default; pointer-events:none; transition-delay:100ms;
    /* transform-origin:54% 85%; */
    transform:translate(-50%,-50%) scale(1.2);
    opacity:0;
  }