.ValidCode{display:flex;justify-content:center;align-items:center;cursor:pointer}.ValidCode span{display:inline-block}*{margin:0;padding:0;box-sizing:border-box;-webkit-user-select:none;-moz-user-select:none;user-select:none}body{height:100vh;display:flex;justify-content:center;align-items:center;font-size:12px;color:#a0a5a8}.shell,body{width:100%;background-color:#ecf0f3}.shell{position:relative;min-width:1000px;min-height:600px;height:600px;padding:25px;box-shadow:10px 10px 10px #d1d9e6,-10px -10px 10px #f9f9f9;border-radius:12px;overflow:hidden}@media (max-width:1200px){.shell{transform:scale(.7)}}@media (max-width:1000px){.shell{transform:scale(.6)}}@media (max-width:800px){.shell{transform:scale(.5)}}@media (max-width:600px){.shell{transform:scale(.4)}}.container{position:absolute;top:0;width:600px;padding:25px;background-color:#ecf0f3;transition:1.25s}.container,.form{display:flex;justify-content:center;align-items:center;height:100%}.form{flex-direction:column;width:100%}.iconfont{margin:0 5px;border:2px solid rgba(0,0,0,.5);border-radius:50%;font-size:25px;padding:3px;opacity:.5;transition:.1s}.iconfont:hover{opacity:1;transition:.15s;cursor:pointer}.form_title{width:350px;height:40px;margin:4px 0;padding-left:25px;font-size:13px;letter-spacing:.15px;border:none;outline:none;background-color:#ecf0f3;transition:.25s ease;border-radius:8px;box-shadow:inset 2px 2px 4px #d1d9e6,inset -2px -2px 4px #f9f9f9}.form_input:focus{box-shadow:inset 4px 4px 4px #d1d9e6,inset -4px -4px 4px #f9f9f9}.form_span{margin-top:50px;margin-bottom:2px;color:#000}.form_link{color:#181818;font-size:15px;margin-top:15px;border-bottom:1px solid #a0a5a8;line-height:2}.title{font-size:34px;font-weight:700;line-height:3;color:#181818;letter-spacing:10px}.description{font-size:14px;letter-spacing:.25px;text-align:center;line-height:1.6}.button{width:180px;height:50px;border-radius:25px;margin-top:10px;font-weight:700;font-size:14px;letter-spacing:1.15px;background-color:#4b70e2;color:#f9f9f9;box-shadow:8px 8px 16px #d1d9e6,-8px -8px 16px #f9f9f9;border:none;outline:none}.a-container{z-index:100;left:calc(100% - 600px)}.b-container{left:calc(100% - 600px);z-index:0}.switch{display:flex;justify-content:center;align-items:center;top:0;left:0;width:400px;height:100%;padding:50px;z-index:200;overflow:hidden;box-shadow:4px 4px 10px #d1d9e6,-4px -4px 10px #d1d9e6}.switch,.switch_circle{position:absolute;transition:1.25s;background-color:#ecf0f3}.switch_circle{width:500px;height:500px;border-radius:50%;box-shadow:inset 8px 8px 12px #b8bec7,inset -8px -8px 12px #fff;bottom:-60%;left:-60%}.switch_circle-t{top:-30%;left:-60%;width:300px;height:300px}.switch_container{display:flex;justify-content:center;align-items:center;flex-direction:column;position:absolute;width:400px;padding:50px 55px;transition:1.25s}.switch_button{cursor:pointer}.submit:hover,.switch_button:hover{box-shadow:6px 6px 10px #d1d9e6,-6px -6px 10px #f9f9f9;transform:scale(.985);transition:.25s}.switch_button:active,.switch_button:focus{box-shadow:2px 2px 6px #d1d9e6,-2px -2px 6px #f9f9f9;transform:scale(.97);transition:.25s}.is-txr{left:calc(100% - 400px);transform-origin:left}.is-txl,.is-txr{transition:1.25s}.is-txl{left:0;transform-origin:right}.is-z{z-index:200;transition:1.25s}.is-hidden{visibility:hidden;opacity:0;position:absolute;transition:1.25s}.is-gx{animation:is-gx 1.25s}@keyframes is-gx{0%,10%,to{width:400px}30%,50%{width:500px}}.code-input-container{display:flex;align-items:center}