.loader{color:#000;--size:1px;width:calc(8 * var(--size));height:calc(40 * var(--size));border-radius:calc(4 * var(--size));display:block;margin:calc(20 * var(--size)) auto;position:relative;background:currentColor;box-sizing:border-box;animation:animloader .3s linear .3s infinite alternate}.dark .loader{color:#fff}.loader:after,.loader:before{content:"";width:calc(8 * var(--size));height:calc(40 * var(--size));border-radius:calc(4 * var(--size));background:currentColor;position:absolute;top:50%;transform:translateY(-50%);left:calc(20 * var(--size));box-sizing:border-box;animation:animloader .3s linear .45s infinite alternate}.loader:before{left:calc(-20 * var(--size));animation-delay:0s}@keyframes animloader{0%{height:calc(48 * var(--size))}to{height:calc(4 * var(--size))}}