*,:before,:after{box-sizing:border-box;outline:none}.button{color:#fff;text-transform:uppercase;border:none;border-radius:2.25rem;flex-direction:column;justify-content:center;align-items:center;width:16.275rem;height:4.5rem;font-size:20px;font-weight:500;line-height:30px;display:flex;position:relative;overflow:hidden}.button:before{content:"";width:0%;height:100%;position:absolute;bottom:0;left:0}.button .submit,.button .loading,.button .check,.button .icon{line-height:0;position:absolute}.button .submit .animation,.button .loading .animation,.button .check .animation,.button .icon .animation{transform-origin:50%}.button .submit:first-of-type,.button .loading:first-of-type,.button .check:first-of-type,.button .icon:first-of-type{transform:translateY(-50%)}.button .submit:nth-of-type(2),.button .loading:nth-of-type(2),.button .check:nth-of-type(2),.button .icon:nth-of-type(2),.button .submit:nth-of-type(3),.button .loading:nth-of-type(3),.button .check:nth-of-type(3),.button .icon:nth-of-type(3){display:none}.active{background-color:#54289c}.active:before{width:100%;transition:width 3s linear}.active .submit:first-of-type,.active .loading:first-of-type,.active .check:first-of-type,.active .icon:first-of-type{top:-100%;transform:translateY(-50%)}.active .submit:nth-of-type(2),.active .loading:nth-of-type(2),.active .check:nth-of-type(2),.active .icon:nth-of-type(2){display:block;top:60px;left:95px;transform:translateY(-50%)}.active .submit:nth-of-type(2) .animation,.active .loading:nth-of-type(2) .animation,.active .check:nth-of-type(2) .animation,.active .icon:nth-of-type(2) .animation{animation:1s linear infinite loading}.active .submit:nth-of-type(3),.active .loading:nth-of-type(3),.active .check:nth-of-type(3),.active .icon:nth-of-type(3){display:none}.finished{background:#612eb5}.finished .submit,.finished .loading{display:none}.finished .check{opacity:1;font-size:24px;animation:.5s linear fade;top:40px;transform:rotate(-45deg);display:block!important}.finished .check .animation{transform-origin:50%}@keyframes fade{0%{opacity:0}to{opacity:1}}@keyframes loading{to{transform:rotate(360deg)}}@keyframes lds-rolling{0%{transform:translate(-50%,-50%)rotate(0)}to{transform:translate(-50%,-50%)rotate(360deg)}}.lds-rolling{position:relative}.lds-rolling .animation,.lds-rolling .animation:after{border:4px solid #fff;border-top-color:#0000;border-radius:50%;width:48px;height:48px;position:absolute}.lds-rolling .animation{animation:1s linear infinite lds-rolling;top:-25px;left:20px}.lds-rolling .animation:after{transform:rotate(90deg)}.lds-rolling{transform:translate(-81px,-81px)scale(.81)translate(81px,81px)}.icon{color:#000;border-bottom:4px solid #fff;border-left:4px solid #fff;width:30px;height:12px;position:absolute}