*{margin:0;padding:0;box-sizing:border-box}body{height:100vh;background:#eff0f4;overflow:hidden}.box{position:relative;display:flex;justify-content:space-between;margin:150px auto;width:470px}.box .content{position:relative;display:flex;flex-direction:column;justify-content:space-around;align-items:center;width:350px;height:350px;padding:60px 20px;box-shadow:inset 20px 20px 20px #0000000d,25px 35px 20px #0000000d,25px 30px 30px #0000000d,inset -20px -20px 25px #ffffffe6}.box .content{border-radius:52% 48% 33% 67%/38% 45% 55% 62%;transition:.5s}.box .content:hover{border-radius:50%}.box .content:before{content:"";position:absolute;top:50px;left:85px;width:35px;height:35px;border-radius:50%;background:#fff;opacity:.9}.box .content:after{content:"";position:absolute;top:90px;left:110px;width:15px;height:15px;border-radius:50%;background:#fff;opacity:.9}.box .content div{position:relative;width:225px;border-radius:25px;box-shadow:inset 2px 5px 10px #0000001a,inset -2px -5px 10px #fff,15px 15px 10px #0000000d,15px 10px 15px #00000006}.box .content div:before{content:"";position:absolute;top:8px;left:50%;transform:translate(-50%);width:65%;height:5px;background:#ffffff80;border-radius:5px}.box .content input{width:100%;border:none;outline:none;background:transparent;font-size:16px;padding:10px 15px}.box .content input[type=submit]{color:#fff;cursor:pointer}.box .content div:last-child{width:120px;background:#ff0f5b;box-shadow:inset 2px 5px 10px #0000001a,15px 15px 10px #0000000d,15px 10px 15px #00000006;transition:.5s}.box .content div:last-child:hover{width:150px}.btns{position:absolute;right:0;bottom:0;width:120px;height:120px;background:#c61dff;display:flex;justify-content:center;align-items:center;cursor:pointer;text-decoration:none;color:#fff;font-size:14px;box-shadow:inset 10px 10px 10px #be01fe0d,15px 25px 10px #be01fe1a,15px 20px 20px #be01fe1a,inset -10px -10px 15px #ffffff80;border-radius:44% 56% 65% 35%/57% 58% 42% 43%}.register{bottom:150px;right:0;width:80px;height:80px;border-radius:49% 51% 52% 48%/63% 59% 41% 37%;background:#01b4ff;box-shadow:inset 10px 10px 10px #01b4ff0d,15px 25px 10px #01b4ff1a,15px 20px 20px #01b4ff1a,inset -10px -10px 15px #ffffff80}.btns:before{content:"";position:absolute;top:15px;left:30px;width:20px;height:20px;border-radius:50%;background:#fff;opacity:.45}.register:before{left:20px;width:15px;height:15px}.btns{transition:.25s}.btns:hover{border-radius:50%}#footer{width:100%;text-align:center;padding:20px 0;background-color:#f8f8f8;box-sizing:border-box}.power{display:block;width:100%}