#world{position:absolute;width:100%;height:100%;overflow:hidden;background:linear-gradient(#e4e0ba,#f7d9aa)}*{margin:0;padding:0}body{overflow:hidden}#tip{color:#fff;font-size:26px;position:absolute;top:2.5%;left:2.5%}#screen{position:fixed;top:0;left:0;right:0;bottom:0;z-index:100;background:#000;display:flex;align-items:center}.loader{width:100%;height:15px;text-align:center}.dot{position:relative;width:15px;height:15px;margin:0 2px;display:inline-block}.dot:first-child:before{animation-delay:0ms}.dot:first-child:after{animation-delay:0ms}.dot:last-child:before{animation-delay:.2s}.dot:last-child:after{animation-delay:.2s}.dot:before{content:"";position:absolute;left:0;width:15px;height:15px;background-color:#00f;animation-name:dotHover;animation-duration:.9s;animation-timing-function:cubic-bezier(.82,0,.26,1);animation-iteration-count:infinite;animation-delay:.1s;background:#fff;border-radius:100%}.dot:after{content:"";position:absolute;z-index:-1;background:#000;box-shadow:0 0 1px #000;opacity:.2;width:100%;height:3px;left:0;bottom:-2px;border-radius:100%;animation-name:dotShadow;animation-duration:.9s;animation-timing-function:cubic-bezier(.82,0,.26,1);animation-iteration-count:infinite;animation-delay:.1s}@keyframes dotShadow{0%{transform:scaleX(1)}50%{opacity:0;transform:scaleX(.6)}to{transform:scaleX(1)}}@keyframes dotHover{0%{top:0}50%{top:-50px;transform:scale(1.1)}to{top:0}}