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

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

.stack-loader{position:relative;width:92px;height:76px;margin:auto}.stack-base{position:absolute;bottom:9px;left:14px;width:64px;height:11px;border-radius:4px;background:#dce2eb;box-shadow:0 3px 5px #2838501e}.stack-loader i{position:absolute;left:32px;width:28px;height:11px;border-radius:4px;background:#5c7fe0;box-shadow:0 3px 5px #4964aa3d;animation:stack-drop 1.2s cubic-bezier(.55,0,.5,1) infinite}.stack-loader i:nth-of-type(1){background:#ef8d78}.stack-loader i:nth-of-type(2){background:#f1be6d;animation-delay:.4s}.stack-loader i:nth-of-type(3){background:#65b9a5;animation-delay:.8s}@keyframes stack-drop{0%,16%{top:0;opacity:0;transform:scale(.7)}28%{opacity:1}48%{top:53px;transform:scale(1.08,.78)}60%,100%{top:53px;opacity:0;transform:scale(1)}}