@import url(https://fonts.googleapis.com/css2?family=Muli&display=swap);:root{--line-border-fill:#3498db;--line-border-empty:#e0e0e0;--gray-text:#888;--dark-gray-text:#252525}*{box-sizing:border-box}body{background-color:#f6f7fb;font-family:Muli,sans-serif;color:var(--dark-gray-text);display:flex;align-items:center;justify-content:center;height:100vh;overflow:hidden;margin:0}.container{text-align:center}h1{color:#5e5e5e}h3{color:var(--gray-text)}ion-icon{border:1px solid var(--gray-text);color:var(--gray-text);background-color:#fff;vertical-align:bottom;border-radius:50%;padding:.5rem;margin:0 0 0 .3rem}ion-icon#reset{background-color:var(--gray-text);color:#fff}.progress-container{display:flex;justify-content:center;position:relative;margin-bottom:2rem;max-width:100%;width:22rem;color:#fff}.progress-container::before{content:'';background-color:var(--line-border-empty);position:absolute;top:50%;left:0;transform:translateY(-50%);height:1rem;width:100%;z-index:-1;border-radius:10px}.progress{background-color:var(--line-border-fill);position:absolute;top:50%;left:0;transform:translateY(-50%);height:1rem;width:0%;max-width:100%;z-index:-1;transition:.4s ease;border-radius:10px;overflow:hidden}.btn{background-color:var(--line-border-fill);color:#fff;border:0;border-radius:6px;cursor:pointer;font-family:inherit;padding:.5rem 1rem;margin:.3rem;font-size:.9rem}.btn:active,ion-icon:active{transform:scale(.98)}.btn:focus,input:focus,ion-icon:focus,input:focus{outline:0}input{width:6rem;font-family:inherit;padding:.3rem 1rem;font-size:.9rem;border:1px solid #ccc;border-radius:6px}footer{position:fixed;left:0;bottom:0;width:100%;text-align:center;margin-bottom:1rem;padding-top:1rem;color:var(--gray-text);border-top:1px solid #ccc}