@import"https://fonts.googleapis.com/css2?family=Exo+2:wght@100;400&display=swap";body{margin:0;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}:root{--main-bg-color: #ebeae0;--main-font-color: #24bbef;--main-button-font-color: #FFFFFF;--main-input-text-background-color: #e0e0d4;--main-input-text-color: #000000;--main-button-color: #24bbef}html,body{margin:0;padding:0;font-family:"Exo 2",sans-serif;height:calc(100% - 2rem)}body{background-color:#fff;background-repeat:no-repeat;background-size:cover;background-position:center}#root{height:100vh}.App{text-align:center;background-color:var(--main-bg-color);height:100%;display:flex;justify-content:center;align-items:center;font-family:"Exo 2",sans-serif;flex-direction:column}.App .logo{position:relative;width:100px;height:auto}.App .InputBox{display:flex;justify-content:center;align-items:center;flex-direction:column;gap:4rem;min-height:400px;min-width:50%;position:relative;padding:0 1rem}.App .InputBox .form{display:flex;flex-direction:column;align-items:center;gap:1rem;width:100%;min-height:30vh}.App .InputBox .form .error{color:red}.App .InputBox .form .success{color:green}.App .InputBox .form button{background-color:var(--main-button-color);width:100%;border:none;color:var(--main-button-font-color);padding:1rem;font-size:1.2rem;font-family:"Exo 2",sans-serif;min-height:60px;display:inline-flex;align-items:center;justify-content:center;cursor:pointer;position:relative}.App .InputBox .form button.loading{opacity:.6;cursor:default}.App .InputBox .form button svg{height:100px;padding:1rem;position:absolute}.App .InputBox .form input{font-family:"Exo 2",sans-serif;text-align:center;font-size:2rem;background-color:var(--main-input-text-background-color);border:none;width:100%;outline:none;padding:1rem 0;color:var(--main-input-text-color)}.loader-wrapper{display:flex;width:100%;height:100%;justify-content:center;align-items:center}.loader-wrapper .loader{width:45px;aspect-ratio:1;--c: no-repeat linear-gradient(#24bbef 0 0);background:var(--c) 0% 50%,var(--c) 50% 50%,var(--c) 100% 50%;background-size:20% 100%;animation:l1 1s infinite linear}@keyframes l1{0%{background-size:20% 100%,20% 100%,20% 100%}33%{background-size:20% 10%,20% 100%,20% 100%}50%{background-size:20% 100%,20% 10%,20% 100%}66%{background-size:20% 100%,20% 100%,20% 10%}to{background-size:20% 100%,20% 100%,20% 100%}}