*{margin:0;padding:0;font-family:'Google Sans';cursor:default;user-select:none}body{background:#191919}body .wrapper{height:calc(100vh - 48px);padding:24px;overflow:hidden}body .wrapper h1.app-title{position:fixed;font-size:20px;color:#E91E63;font-weight:700;display:inline-block;margin-left:52px;letter-spacing:2px;line-height:40px}body .wrapper img.app-logo{position:fixed;width:40px;height:40px;float:left}body .wrapper .input-elements{position:relative;display:inline-block;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);max-width:344px;margin:0px auto;display:block}body .wrapper .input-elements .input-bar{width:100%;max-width:48px;position:relative;border-radius:50px;box-shadow:0 0 50px 10px #E91E63;overflow:hidden;transition:all 255ms ease-out 455ms,transform 255ms ease-out;z-index:1;margin:0 auto;transform:scale(3)}body .wrapper .input-elements .input-bar input.qrText{background:#fff;width:100%;height:48px;border:0;outline:0;border-radius:50px;box-sizing:border-box;padding-left:20px;padding-right:56px;color:#E91E63;font-size:14px}body .wrapper .input-elements .input-bar button#generate-btn{position:relative;display:inline-block;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%);transform:translateY(-50%) rotate(0deg);position:absolute;right:0;border-radius:50px;background:#FFEB3B;border:0;outline:0;box-shadow:0 4px 5px 0 rgba(0,0,0,0.14),0 1px 10px 0 rgba(0,0,0,0.12),0 2px 4px -1px rgba(0,0,0,0.4);font-size:14px;padding:4px;z-index:1;transition:transform 255ms ease-in-out}body .wrapper .input-elements .input-bar button#generate-btn svg{float:left;padding:8px;width:24px;height:24px}body .wrapper .input-elements .load{max-width:344px !important;transform:scale(1)}body .wrapper .input-elements .load button{transform:translateY(-50%) rotate(360deg) !important}body .wrapper .input-elements #qrcode{width:240px;height:240px;box-shadow:0 2px 2px 0 rgba(0,0,0,0.14),0 1px 5px 0 rgba(0,0,0,0.12),0 3px 1px -2px rgba(0,0,0,0.2);background:#fff;display:none;padding:15px;box-sizing:border-box;margin:30px auto;border:5px solid #FFEB3B;border-radius:20px}body .wrapper .input-elements #qrcode::after{content:"";position:absolute;width:auto;top:340px;text-align:center;left:50%;transform:translateX(-50%);display:inline-table;color:#FFEB3B;font-weight:700;font-size:18px}
