@import url(https://fonts.googleapis.com/css2?family=Space+Mono:wght@400;700&display=swap);:root{--clrLightCyan:#a1e8e0;--clrStrongCyan:#26c0ab;--clrMediumCyan:#0c696e;--clrVeryDarkCyan:#00494d;--clrDarkGrayishCyan:#5e7a7d;--clrGrayishCyan:#7f9c9f;--clrLightGrayishCyan:#c5e4e7;--clrVeryLightGrayishCyan:#e7f2f3}*,:after,:before{box-sizing:border-box;margin:0;padding:0}.btn{background:#0c696e;background:var(--clrMediumCyan);border:none;border-radius:5px;color:#00494d;color:var(--clrVeryDarkCyan);font-size:18px;font-weight:700;padding:15px;text-transform:uppercase}.btn.reset-active{background:#26c0ab;background:var(--clrStrongCyan);cursor:pointer}body{align-items:center;background:#c5e4e7;background:var(--clrLightGrayishCyan);display:flex;font-family:Space Mono,monospace;font-weight:700;height:100vh;justify-content:center}header{margin-bottom:50px}.main-title{color:#00494d;color:var(--clrVeryDarkCyan);font-size:25px;letter-spacing:10px;line-height:1.5;text-align:center}.main-panel{grid-gap:50px;background:#fff;border-radius:30px;display:grid;gap:50px;grid-template-columns:repeat(2,1fr);height:500px;padding:40px;width:920px}.splitter-panel{color:#5e7a7d;color:var(--clrDarkGrayishCyan)}.bill-input-group,.tip-calculator{margin-bottom:40px}.bill-title-group{display:flex;justify-content:space-between}.tip-title{margin-bottom:20px}.percentage-grid{grid-gap:15px;display:grid;gap:15px;grid-template-columns:repeat(3,1fr)}.input-field,.percentage{background:#e7f2f3;background:var(--clrVeryLightGrayishCyan);border:none;border-radius:5px;color:#00494d;color:var(--clrVeryDarkCyan);font-family:inherit;font-size:25px;font-weight:700;height:50px;padding:5px 10px;text-align:right;width:100%}.input-title{margin-bottom:10px}.percentage{background:#00494d;background:var(--clrVeryDarkCyan);color:#e7f2f3;color:var(--clrVeryLightGrayishCyan);text-align:center;transition:all .1s ease-in-out}.percentage.active{background:#26c0ab;background:var(--clrStrongCyan)}.percentage.active,.percentage.custom{color:#00494d;color:var(--clrVeryDarkCyan)}.percentage.custom{background:#e7f2f3;background:var(--clrVeryLightGrayishCyan);height:50px;text-align:right}.percentage.custom::-webkit-input-placeholder{color:#5e7a7d;color:var(--clrDarkGrayishCyan)}.percentage.custom::placeholder{color:#5e7a7d;color:var(--clrDarkGrayishCyan)}.percentage:not(.custom):hover{background:#a1e8e0;background:var(--clrLightCyan);color:#00494d;color:var(--clrVeryDarkCyan)}input[type=text]::-webkit-input-placeholder{color:#7f9c9f;color:var(--clrGrayishCyan)}input[type=text]::placeholder{color:#7f9c9f;color:var(--clrGrayishCyan)}input[type=text]:focus{outline:2px solid #26c0ab;outline:2px solid var(--clrStrongCyan)}.input-field.alert{outline:2px solid red}.alert{color:red}label[for=bill-input],label[for=nbr-people]{position:relative}label[for=bill-input]:before,label[for=nbr-people]:before{color:#7f9c9f;color:var(--clrGrayishCyan);font-family:Space Mono,monospace;font-size:20px;font-weight:400;left:10px;position:absolute;top:50%;-webkit-transform:translateY(-50%);transform:translateY(-50%)}label[for=bill-input]:before{content:"$"}label[for=nbr-people]:before{content:url(/static/media/icon-person.65bfd20465dd1d2cb58c.svg)}.nbr-people-container,.total-panel{display:flex;justify-content:space-between}.total-panel{background:#00494d;background:var(--clrVeryDarkCyan);border-radius:15px;flex-direction:column;padding:40px}.amount{align-items:center;display:flex;justify-content:space-between;margin-bottom:30px}.amount h3{font-size:15px;margin-bottom:5px}.amount p{color:#7f9c9f;color:var(--clrGrayishCyan);font-size:13px}.amount-label{color:#e7f2f3;color:var(--clrVeryLightGrayishCyan)}.amount h1{color:#26c0ab;color:var(--clrStrongCyan);font-size:50px}
/*# sourceMappingURL=main.446e533e.css.map*/