@import url(https://fonts.googleapis.com/css2?family=Baloo+Da+2:wght@400;500;600;700;800&family=Muli:ital,wght@0,200;0,300;0,400;1,200;1,300;1,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}*{margin:0;padding:0}html{font-size:62.5%}.container{width:100%;height:100vh;background-color:#458f89;display:flex;justify-content:center;align-items:center}.app-wrapper{width:90%;max-width:150rem;height:80vh;background-color:#1c717c;color:#eee;border-radius:.5rem;box-shadow:0 1rem 5rem rgba(0,0,0,.7);display:grid;grid-template-columns:minmax(38%,40rem) repeat(2,minmax(29%,29rem));grid-template-rows:repeat(10,1fr);grid-gap:1rem}.header{grid-column:1/2;grid-row:1/4;display:flex;justify-content:center;align-items:center}.header h1{font-family:"Muli",sans-serif;font-size:6rem;font-weight:300;text-transform:uppercase;letter-spacing:.2rem;color:#fff;text-shadow:0 .2rem .5rem rgba(0,0,0,.4)}.balance{grid-column:1/1;grid-row:3/-1;display:flex;flex-direction:column;align-items:center;margin-top:10rem;text-align:center}.balance h2{font-size:4.5rem}.balance h2,.balance h3{font-family:"Baloo Da 2",serif;font-weight:300;text-shadow:0 .2rem .5rem rgba(0,0,0,.4)}.balance h3{font-size:4rem}.income-expense{display:flex;justify-content:space-evenly;margin-top:10rem;font-family:"Muli",serif;text-shadow:0 .2rem .5rem rgba(0,0,0,.4);text-align:right}.minus,.plus{margin:0 2rem}.plus{color:#16f7e4}.minus{color:#fff}.income-expense h3{font-size:3.5rem;font-weight:300;margin-bottom:2rem;width:100%}.income-expense p{font-size:3rem;font-weight:700;text-align:center}.form-wrapper{grid-column:2/-1;grid-row:2/4;display:grid;grid-template-columns:repeat(2,1fr);grid-template-rows:repeat(2,1fr)}input::-webkit-input-placeholder{color:#fff}input:-ms-input-placeholder{color:#fff}input::-ms-input-placeholder{color:#fff}input::placeholder{color:#fff}.input-group{display:flex;flex-direction:column}.income{grid-column:1/2;grid-row:1/-1}.expense{grid-column:2/-1;grid-row:1/-1}.input-group input:not([type=submit]){width:30rem;margin-bottom:2.5rem;background:transparent;border:none;border-bottom:.2rem solid #777;padding:.5rem .5rem .5rem 0;font-family:"Baloo Da 2",serif;font-size:1.8rem;color:#eee;outline:none;transition:border-bottom .4s}.income input:not([type=submit]):focus{border-bottom:.2rem solid #77c987}.expense input:not([type=submit]):focus{border-bottom:.2rem solid #ff716e}.input-group input[type=submit]{width:10rem;padding:.7rem;border:none;outline:none;border-radius:.7rem;font-family:"Muli",serif;font-size:1.6rem;font-weight:700;letter-spacing:.1rem;color:#eee;box-shadow:0 .5rem 1rem rgba(0,0,0,.2);cursor:pointer;margin-top:1rem;text-shadow:0 .2rem .5rem rgba(0,0,0,.4)}.input-group input[type=submit]:active{transform:translateY(.3rem)}.income input[type=submit]{background-color:#18b3a6}.expense input[type=submit]{background-color:#d65957}input[type=number]::-webkit-inner-spin-button{-webkit-appearance:none}.transactions{margin-top:3rem}.transactions h2{font-family:"Baloo da 2",serif;font-size:2.5rem;letter-spacing:.1rem;font-weight:300;margin-bottom:2rem}.transactions-income{grid-column:2/3;grid-row:5/-1}.transactions-expense{grid-column:3/-1;grid-row:5/-1}.transaction-list{width:92%;max-height:35rem;overflow:hidden;overflow-y:auto}::-webkit-scrollbar{width:10px}::-webkit-scrollbar-track{border-radius:10px;background-color:#aaa}::-webkit-scrollbar-thumb{background:#444;border-radius:10px}.transaction{list-style:none;font-family:"Baloo da 2",serif;font-size:1.8rem;letter-spacing:.1rem;margin-bottom:1.5rem;color:#fff;padding:.4rem .4rem .4rem .7rem;border-radius:.3rem;width:32rem;display:flex;justify-content:space-between;box-shadow:0 .5rem 1rem rgba(0,0,0,.2)}.transactions-income .transaction{background-color:#18b3a6}.transactions-expense .transaction{background-color:#cf5856}.transaction-text{width:23rem}.transaction-amount{transform:translateX(3rem)}.delete-btn{transform:translateX(4rem);border:none;background-color:transparent;font-size:2rem;margin:0 1rem;color:#d4403e;text-shadow:0 .2rem .5rem rgba(0,0,0,.4);cursor:pointer;outline:none}@media (max-width:1500px){html{font-size:58%}.app-wrapper{width:95%;max-width:140rem;height:85vh}.balance{margin-top:6rem}.income-expense{margin-top:7rem}.transaction-list{max-height:31rem}.transaction{width:30rem}}@media (max-width:1200px){html{font-size:52%}.app-wrapper{grid-gap:0}.transaction-list{max-height:29rem}.transaction{width:28rem}}
/*# sourceMappingURL=main.45d23cc6.chunk.css.map */