body{margin:0}#app{font-family:Avenir,Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;color:#2c3e50}main{text-align:center;margin-top:40px}header{margin:0;height:56px;padding:0 16px 0 24px;background-color:#35495e;color:#fff}header span{display:block;position:relative;font-size:20px;line-height:1;letter-spacing:.02em;font-weight:400;box-sizing:border-box;padding-top:16px}.shutdown{border:8px solid #0cf;border-radius:100px;height:100px;width:100px;margin:auto}.shutdown,.shutdown .inner{box-shadow:0 0 10px #0cf,inset 0 0 10px #0cf}.shutdown .inner{border:5px solid #0cf;border-radius:100px;height:30px;left:30px;position:relative;top:30px;width:30px}.shutdown .bar{border-left:5px solid #0cf;box-shadow:0 0 10px #0cf;height:20px;left:47px;position:relative;top:-15px;width:0}.shutdown .sub-bar{height:30px;margin-left:44px;margin-top:-20px;position:absolute;width:0}.loader{height:4px;width:100%;position:relative;overflow:hidden;background-color:#ddd}.loader:before{display:block;position:absolute;content:"";left:-200px;width:200px;height:4px;background-color:#2980b9;animation:loading 2s linear infinite}@keyframes loading{0%{left:-200px;width:30%}50%{width:30%}70%{width:70%}80%{left:50%}95%{left:120%}to{left:100%}}