body{margin:0;padding:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-moz-osx-font-smoothing:grayscale}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}body{font-family:Roboto,-apple-system,BlinkMacSystemFont,Segoe UI,Helvetica Neue,sans-serif}.ex1.container{margin:auto;padding:100px 0;min-height:100vh}.ex1-wrap{margin:auto;max-width:400px;border-radius:8px;background:#fff;padding:32px}.ex1-field{position:relative;margin-bottom:32px}.ex1-fields{display:-webkit-flex;display:flex;margin-left:-16px}.ex1-fields .ex1-field{-webkit-flex:1 1;flex:1 1;margin-left:16px}.ex1-label{font-size:12px;font-weight:500;color:#7b808c;position:absolute;top:.25rem;pointer-events:none;padding-left:.125rem;z-index:1;font-weight:400;transition:all .28s ease}.ex1-input{width:100%;display:block;background:transparent;border-radius:0;padding:4px 2px;border:0 transparent;color:#333;font-size:16px;font-family:inherit;font-weight:500;transition:.2s;cursor:text;transition:all .28s ease;box-shadow:none}.ex1-input::-webkit-input-placeholder{color:transparent}.ex1-input::-ms-input-placeholder{color:transparent}.ex1-input::placeholder{color:transparent}.ex1-input:focus::-webkit-input-placeholder{color:#7b808c}.ex1-input:focus::-ms-input-placeholder{color:#7b808c}.ex1-input:focus::placeholder{color:#7b808c}.ex1-input.complete~.ex1-label,.ex1-input.focus~.ex1-label,.ex1-input.invalid~.ex1-label,.ex1-input.val~.ex1-label,.ex1-input:focus~.ex1-label{font-size:.8rem;color:#7b808c;top:-1rem;left:0}.ex1-bar{position:relative;border-bottom:.0625rem solid #999;display:block}.ex1-bar:before{content:"";height:.125rem;width:0;left:50%;bottom:-.0625rem;position:absolute;background:#337ab7;transition:left .28s ease,width .28s ease;z-index:2}.ex1-input.focus~.ex1-bar:before,.ex1-input:focus~.ex1-bar:before{width:100%;left:0}.ex1-button{background:#0950cc;background:#0c0ebd;color:#fff;font-size:16px;font-family:inherit;border:none;border-radius:4px;padding:12px 20px;display:block;width:100%;letter-spacing:.5px;transition:.2s;cursor:pointer}.ex1-button:focus,.ex1-button:hover{background:#0641a7;background:#0a0b9a}.ex1-button.submit{background-image:url(data:image/svg+xml;base64,PHN2ZyBjbGFzcz0ic3ZnLWxvYWRlciIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB3aWR0aD0iNTUiIGhlaWdodD0iNTUiIHZpZXdCb3g9IjAgMCA4MCA4MCI+PHBhdGggZmlsbD0iI2ZmZiIgZD0iTTQwIDcyQzIyLjQgNzIgOCA1Ny42IDggNDBTMjIuNCA4IDQwIDhzMzIgMTQuNCAzMiAzMmMwIDEuMS0uOSAyLTIgMnMtMi0uOS0yLTJjMC0xNS40LTEyLjYtMjgtMjgtMjhTMTIgMjQuNiAxMiA0MHMxMi42IDI4IDI4IDI4YzEuMSAwIDIgLjkgMiAycy0uOSAyLTIgMnoiPjxhbmltYXRlVHJhbnNmb3JtIGF0dHJpYnV0ZVR5cGU9InhtbCIgYXR0cmlidXRlTmFtZT0idHJhbnNmb3JtIiB0eXBlPSJyb3RhdGUiIGZyb209IjAgNDAgNDAiIHRvPSIzNjAgNDAgNDAiIGR1cj0iMC42cyIgcmVwZWF0Q291bnQ9ImluZGVmaW5pdGUiLz48L3BhdGg+PC9zdmc+);background-position:50%;background-repeat:no-repeat;background-size:20px;color:transparent!important;transition-duration:0s}.ex1-wrap .token{color:#555}.ex1-wrap .error,.ex1-wrap .token{padding:10px;text-align:center;font-weight:500}.ex1-wrap .error{color:#e41029}:root{--main-bg:#262e3a;--secondary-bg:#3e4b5b;--main-text:#fff;--placeholder:#939aa3;--placeholder-focused:#ccc;--primary-btn:#6eedb6;--btn-text:#1c2026;--primary-btn-focus:#46cb91}body{color:#fff;color:var(--main-text);font-family:Lato,-apple-system,BlinkMacSystemFont,Segoe UI,Helvetica Neue,sans-serif}.ex2.container,body{background:#262e3a;background:var(--main-bg)}.ex2.container{margin:auto;padding:100px 0;min-height:100vh}.ex2-wrap{max-width:480px;margin:auto}.ex2-field{position:relative;margin-bottom:16px;display:-webkit-flex;display:flex;background:#3e4b5b;background:var(--secondary-bg);border-radius:4px;-webkit-align-items:center;align-items:center}.ex2-label{font-size:14px;-webkit-flex-basis:80px;flex-basis:80px;padding:4px 0 4px 16px}.ex2-input,.ex2-label{font-weight:500;color:#fff;color:var(--main-text)}.ex2-input{width:100%;display:block;background:transparent;border-radius:0;padding:16px;border:0 transparent;font-size:16px;font-family:inherit;transition:.2s;cursor:text;transition:all .28s ease;box-shadow:none}.ex2-input::-webkit-input-placeholder{color:#939aa3;color:var(--placeholder)}.ex2-input::-ms-input-placeholder{color:#939aa3;color:var(--placeholder)}.ex2-input::placeholder{color:#939aa3;color:var(--placeholder)}.ex2-input:focus::-webkit-input-placeholder{color:#ccc;color:var(--placeholder-focused)}.ex2-input:focus::-ms-input-placeholder{color:#ccc;color:var(--placeholder-focused)}.ex2-input:focus::placeholder{color:#ccc;color:var(--placeholder-focused)}.ex2-button{background:#6eedb6;background:var(--primary-btn);color:#1c2026;color:var(--btn-text);font-size:16px;font-weight:600;font-family:inherit;border:none;border-radius:4px;padding:16px 20px;display:block;width:100%;letter-spacing:.5px;transition:.2s;cursor:pointer}.ex2-button:focus,.ex2-button:hover{background:#46cb91;background:var(--primary-btn-focus)}.ex2-button.submit{background-image:url(data:image/svg+xml;base64,PHN2ZyBjbGFzcz0ic3ZnLWxvYWRlciIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB3aWR0aD0iNTUiIGhlaWdodD0iNTUiIHZpZXdCb3g9IjAgMCA4MCA4MCI+PHBhdGggZmlsbD0iI2ZmZiIgZD0iTTQwIDcyQzIyLjQgNzIgOCA1Ny42IDggNDBTMjIuNCA4IDQwIDhzMzIgMTQuNCAzMiAzMmMwIDEuMS0uOSAyLTIgMnMtMi0uOS0yLTJjMC0xNS40LTEyLjYtMjgtMjgtMjhTMTIgMjQuNiAxMiA0MHMxMi42IDI4IDI4IDI4YzEuMSAwIDIgLjkgMiAycy0uOSAyLTIgMnoiPjxhbmltYXRlVHJhbnNmb3JtIGF0dHJpYnV0ZVR5cGU9InhtbCIgYXR0cmlidXRlTmFtZT0idHJhbnNmb3JtIiB0eXBlPSJyb3RhdGUiIGZyb209IjAgNDAgNDAiIHRvPSIzNjAgNDAgNDAiIGR1cj0iMC42cyIgcmVwZWF0Q291bnQ9ImluZGVmaW5pdGUiLz48L3BhdGg+PC9zdmc+);background-position:50%;background-repeat:no-repeat;background-size:20px;color:transparent!important;transition-duration:0s}#error,#token{text-align:center;margin-top:10px}.theme-palette{display:-webkit-flex;display:flex;margin-top:20px}.theme-palette>.ex2-button{margin:0 10px;padding:5px 10px;height:50%;font-size:14px}.title{color:#fff;color:var(--main-text);margin-top:30px}body{background-color:#2c2e33;color:#252857;font-family:Raleway,-apple-system,BlinkMacSystemFont,Segoe UI,Helvetica Neue,sans-serif;font-size:16px;line-height:1.4;font-weight:300;-webkit-font-smoothing:antialiased}*{margin:0;padding:0;box-sizing:border-box;outline:none}a{cursor:pointer;color:inherit;text-decoration:none;border-bottom:1px dotted}.ex3.container{margin:auto;padding:100px 0;min-height:100vh;background:#fca571;color:#252857}.ex3-wrap{max-width:480px;margin:auto}.ex3-contain{border-radius:4px;background:#fff;padding:24px;box-shadow:0 2px 5px 0 rgba(0,0,0,.04);margin-bottom:16px}.ex3-fieldset .ex3-field{margin-bottom:32px}.ex3-field{position:relative}.ex3-fields{display:-webkit-flex;display:flex;margin-left:-16px}.ex3-fields .ex3-field{-webkit-flex:1 1;flex:1 1;margin-left:16px}.ex3-label{font-size:12px;font-weight:500;color:#3a62ba;position:absolute;left:0;bottom:.25rem;pointer-events:none;padding-left:.125rem;z-index:1;font-weight:400;transition:all .28s ease}.ex3-input{width:100%;display:block;background:transparent;border-radius:0;padding:4px 2px;border:0 transparent;color:#252857;font-size:16px;font-family:inherit;font-weight:500;transition:.2s;cursor:text;transition:all .28s ease;box-shadow:none}.ex3-input::-webkit-input-placeholder{font-size:14px;color:#9293ab}.ex3-input::-ms-input-placeholder{font-size:14px;color:#9293ab}.ex3-input::placeholder{font-size:14px;color:#9293ab}.ex3-input:focus::-webkit-input-placeholder{color:#666}.ex3-input:focus::-ms-input-placeholder{color:#666}.ex3-input:focus::placeholder{color:#666}.ex3-input.complete~.ex3-label,.ex3-input.focus~.ex3-label,.ex3-input.invalid~.ex3-label,.ex3-input:focus~.ex3-label{font-size:.8rem;color:#3a62ba;bottom:-1.2rem}.ex3-bar{position:relative;border-bottom:.0625rem solid #ebebeb;display:block}.ex3-bar:before{content:"";height:.125rem;width:0;left:50%;bottom:-.0625rem;position:absolute;background:#252857;transition:left .28s ease,width .28s ease;z-index:2}.ex3-input.focus~.ex3-bar:before,.ex3-input.invalid~.ex3-bar:before,.ex3-input:focus~.ex3-bar:before{width:100%;left:0}.ex3-input.invalid~.ex3-bar:before{background:#e94745}.ex3-button{background:#252857;color:#fff;font-size:16px;font-family:inherit;border:none;border-radius:4px;padding:12px 20px;display:block;width:100%;letter-spacing:.5px;transition:.2s;cursor:pointer}.ex3-button:focus,.ex3-button:hover{background:#191c4a}.ex3-button.submit{background-image:url(data:image/svg+xml;base64,PHN2ZyBjbGFzcz0ic3ZnLWxvYWRlciIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB3aWR0aD0iNTUiIGhlaWdodD0iNTUiIHZpZXdCb3g9IjAgMCA4MCA4MCI+PHBhdGggZmlsbD0iI2ZmZiIgZD0iTTQwIDcyQzIyLjQgNzIgOCA1Ny42IDggNDBTMjIuNCA4IDQwIDhzMzIgMTQuNCAzMiAzMmMwIDEuMS0uOSAyLTIgMnMtMi0uOS0yLTJjMC0xNS40LTEyLjYtMjgtMjgtMjhTMTIgMjQuNiAxMiA0MHMxMi42IDI4IDI4IDI4YzEuMSAwIDIgLjkgMiAycy0uOSAyLTIgMnoiPjxhbmltYXRlVHJhbnNmb3JtIGF0dHJpYnV0ZVR5cGU9InhtbCIgYXR0cmlidXRlTmFtZT0idHJhbnNmb3JtIiB0eXBlPSJyb3RhdGUiIGZyb209IjAgNDAgNDAiIHRvPSIzNjAgNDAgNDAiIGR1cj0iMC42cyIgcmVwZWF0Q291bnQ9ImluZGVmaW5pdGUiLz48L3BhdGg+PC9zdmc+);background-position:50%;background-repeat:no-repeat;background-size:20px;color:transparent!important;transition-duration:0s}.token{color:#555}.error,.token{padding:10px;text-align:center;font-weight:500}.error{color:#e41029}.language-palette{display:-webkit-flex;display:flex}.language-palette>.ex3-button{margin:0 10px;padding:5px 10px;height:50%;font-size:14px}.ex3-button.small{height:30px}
/*# sourceMappingURL=main.c9be080c.chunk.css.map */