<!--
  Author: @codepeek
  License: MIT
  Tags: #buttons #css #interface #opensource #codepeek
-->
<div class="orbit-dot-loader" role="status" aria-label="Loading">
  <span>
  </span>
  <i>
  </i>
  <i>
  </i>
  <i>
  </i>
  <i>
  </i>
  <i>
  </i>
  <i>
  </i>
</div>

/*
 * Author: @codepeek
 * License: MIT
 * Tags: #buttons #css #interface #opensource #codepeek
 */

.orbit-dot-loader{position:relative;width:66px;height:66px;margin:auto;border:2px solid #edf0f5;border-left-color:#8093c9;border-radius:50%;animation:orbit-turn 1.4s linear infinite}.orbit-dot-loader span{position:absolute;top:18px;left:18px;width:26px;height:26px;border-radius:50%;background:#f7f8fb;box-shadow:inset 2px 2px 4px #d6dbe6}.orbit-dot-loader i{position:absolute;top:-5px;left:28px;width:8px;height:8px;border-radius:50%;background:#607ed9;box-shadow:0 2px 4px #607ed955}.orbit-dot-loader i:nth-of-type(2){top:8px;left:52px;background:#8b75df}.orbit-dot-loader i:nth-of-type(3){top:39px;left:52px;background:#d97eb1}.orbit-dot-loader i:nth-of-type(4){top:62px;left:28px;background:#e5a66b}.orbit-dot-loader i:nth-of-type(5){top:39px;left:0;background:#79b99f}.orbit-dot-loader i:nth-of-type(6){top:8px;left:0;background:#70a9da}@keyframes orbit-turn{to{transform:rotate(360deg)}}