@keyframes fade-in{0%{opacity:0}to{opacity:1}}@keyframes spinner{0%{transform:rotate(0)}to{transform:rotate(360deg)}}body{font-size:2rem;background:#eee;color:#000;font-family:Avenir,sans-serif;transition:all 1s ease-in .3s}body .spinner{width:500px;height:500px;margin:auto;font-size:50px;animation:fade-in ease .8s forwards;text-align:center;display:flex;justify-content:center;align-items:center;position:relative}body .spinner span{position:absolute;bottom:10px;animation:spinner 1s infinite forwards ease-out;border:16px solid #f3f3f3;border-top:16px solid #d32f2f;border-bottom:16px solid #303f9f;border-radius:50%;width:120px;height:120px}main h1{text-align:center;margin:0 0 10px;font-size:20px}main p{font-size:16px;text-align:center;margin:0 0 10px}main .chart{width:90%;margin:0 auto;animation:fade-in ease .8s forwards}main .chart .change-chart-wrapper{display:flex;justify-content:space-between;padding:10px 0}