0
Loading
body { margin:0; padding:0; overflow-x:hidden; } body:before { content:""; position:absolute; top:0; left:0; width:100%; height:100%; background:#232428; } .ind1 { padding-top:5px; font-size:18px; } .ind2 { padding-top:5px; font-size:18px; } .ind3 { padding-top:10px; font-size:16px; line-height:25px; } #indicator { position:absolute; top:50%; left:50%; padding-left:2px; transform:translate(-50%,-50%); width:150px; height:150px; background:transparent; border:3px solid #3c3c3c; border-radius:50%; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; font-family:sans-serif; color:#d5c999; letter-spacing:3px; text-transform:uppercase; text-shadow:0 0 10px #fff000; box-shadow:0 0 20px rgba(0,0,0,.5); } #indicator:before { content:""; position:absolute; top:-3px; left:-3px; width:104%; height:104%; border:3px solid transparent; border-top:3px solid #d5c999; border-right:3px solid #d5c999; border-radius:50%; animation:animateC 2s linear infinite; } #indicator > div { max-width:120px; } #lm { opacity:0; transition:opacity 0.5s; } @keyframes animateC { 0% { transform:rotate(0deg); } 100% { transform:rotate(360deg); } } @keyframes animate { 0% { transform:rotate(45deg); } 100% { transform:rotate(405deg); } }
0