:root{--color-primary:#304890;--color-primary-t:rgba(48,72,144,.85)}.loader{width:48px;height:48px;display:inline-block;position:relative;transform:rotate(45deg)}.loader:before{content:"";box-sizing:border-box;width:24px;height:24px;animation:4s infinite animloader;position:absolute;top:-24px;left:0}.loader:after{content:"";box-sizing:border-box;background:var(--color-primary-t);width:24px;height:24px;animation:2s infinite animloader2;position:absolute;top:0;left:0;box-shadow:0 0 10px rgba(0,0,0,.15)}@keyframes animloader{0%{box-shadow:0 24px rgba(255,255,255,0),24px 24px rgba(255,255,255,0),24px 48px rgba(255,255,255,0),0 48px rgba(255,255,255,0)}12%{box-shadow:0 24px var(--color-primary),24px 24px rgba(255,255,255,0),24px 48px rgba(255,255,255,0),0px 48px rgba(255,255,255,0)}25%{box-shadow:0 24px var(--color-primary),24px 24px var(--color-primary),24px 48px rgba(255,255,255,0),0px 48px rgba(255,255,255,0)}37%{box-shadow:0 24px var(--color-primary),24px 24px var(--color-primary),24px 48px var(--color-primary),0px 48px rgba(255,255,255,0)}50%{box-shadow:0 24px var(--color-primary),24px 24px var(--color-primary),24px 48px var(--color-primary),0px 48px var(--color-primary)}62%{box-shadow:0 24px rgba(255,255,255,0),24px 24px var(--color-primary),24px 48px var(--color-primary),0px 48px var(--color-primary)}75%{box-shadow:0 24px rgba(255,255,255,0),24px 24px rgba(255,255,255,0),24px 48px var(--color-primary),0px 48px var(--color-primary)}87%{box-shadow:0 24px rgba(255,255,255,0),24px 24px rgba(255,255,255,0),24px 48px rgba(255,255,255,0),0px 48px var(--color-primary)}to{box-shadow:0 24px rgba(255,255,255,0),24px 24px rgba(255,255,255,0),24px 48px rgba(255,255,255,0),0 48px rgba(255,255,255,0)}}@keyframes animloader2{0%{transform:translate(0)rotateX(0)rotateY(0)}25%{transform:translate(100%)rotateX(0)rotateY(180deg)}50%{transform:translate(100%,100%)rotateX(-180deg)rotateY(180deg)}75%{transform:translateY(100%)rotateX(-180deg)rotateY(360deg)}to{transform:translate(0)rotateX(0)rotateY(360deg)}}