.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;
}

.dark .loading div {
  border: 3px solid #606f7b;
  border-top-color: #dae1e7;
}

.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; }
}