:root{--size:3rem;--duration:2.25s;--bg:#023e8a;--conainer:#e5e5e5;--block:#14213d;--block-2:#fca311;--block-3:#f72585}.preloader .container{width:calc(var(--size)*5);height:calc(var(--size)*8);z-index:10;background-color:var(--conainer);border-radius:.5rem;display:flex;position:relative}.preloader .block{bottom:var(--size);left:calc(var(--size)*2);width:var(--size);height:var(--size);animation:jump var(--duration)linear infinite;border-radius:5px;position:absolute}.preloader .block:first-child:after{content:"";bottom:calc(var(--size)/8);width:calc(var(--size)*2/3);height:calc(var(--size)*2/3);border-top:4px solid var(--block);border-left:4px solid var(--block);border-radius:50%;position:absolute;left:45%;transform:rotate(135deg)}.preloader .block:first-child{background-color:var(--block);z-index:10}.preloader .block:nth-child(2){background-color:var(--block-2);width:calc(var(--size)/2);height:calc(var(--size)/2);left:calc(var(--size)*2.2);z-index:9;animation:jump1 var(--duration)linear infinite}.preloader .block:nth-child(3){background-color:var(--block-3);width:calc(var(--size)/3);height:calc(var(--size)/3);left:calc(var(--size)*5/2);z-index:8;animation:jump2 var(--duration)linear infinite}@keyframes jump{0%{bottom:var(--size);transform-origin:bottom;transform:scaleY(1)scaleX(1)}8%{bottom:var(--size);transform-origin:bottom;animation-timing-function:cubic-bezier(0,.8,.74,1);transform:scaleY(.5)scaleX(1.4)}25%{bottom:calc(var(--size)*3);animation-timing-function:cubic-bezier(.8,.42,1,.64);transform:scaleY(1)scaleX(1)}95%{bottom:var(--size);transform:scaleY(1)scaleX(1)rotate(0)}to{bottom:var(--size);transform:scaleY(1)scaleX(1)rotate(0)}}@keyframes jump1{0%{bottom:var(--size);transform-origin:bottom;transform:scaleY(1)scaleX(1)}8%{bottom:var(--size);transform-origin:bottom;animation-timing-function:cubic-bezier(0,.8,.74,1);transform:scaleY(1)scaleX(1)}55%{bottom:calc(var(--size)*5.5);transform-origin:50%;animation-timing-function:cubic-bezier(.29,.01,1,.55);transform:scaleY(1)scaleX(1)rotate(-1turn)}to{bottom:var(--size);transform:scaleY(1)scaleX(1)rotate(-2turn)}}@keyframes jump2{0%{bottom:var(--size);transform-origin:bottom;transform:scaleY(1)scaleX(1)}8%{bottom:var(--size);transform-origin:bottom;animation-timing-function:cubic-bezier(0,.8,.74,1);transform:scaleY(1)scaleX(1)}55%{bottom:calc(var(--size)*6.5);transform-origin:50%;animation-timing-function:cubic-bezier(.29,.01,1,.55);transform:scaleY(1)scaleX(1)rotate(1turn)}to{bottom:var(--size);transform:scaleY(1)scaleX(1)rotate(2turn)}}