.loading { width: 50px; height: 50px; animation: loaderFadein .2s ease-in; } .loading.sm { width: 25px; height: 25px; } .loading div { display: inline-block; width: 50px; height: 50px; border: 3px solid #dae1e7; border-radius: 50%; border-top-color: #606f7b; animation: spin 1s ease-in-out infinite; -webkit-animation: spin 1s ease-in-out infinite; } .loading.sm div { width: 25px; height: 25px; } @keyframes spin { to { -webkit-transform: rotate(360deg); } } @-webkit-keyframes spin { to { -webkit-transform: rotate(360deg); } } @keyframes loaderFadein { 0% { opacity: 0; } 50% { opacity: 0; } 100% { opacity: 1; } }