@import url(https://fonts.googleapis.com/css?family=Poppins:100,200,300,400,500,600,700,800,900&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}*,:after,:before{margin:0;padding:0;box-sizing:border-box;font-family:"Poppins",sans-serif}html{font-size:62.5%}body{box-sizing:border-box}section.login{position:relative;min-height:100vh;background:#000;background:linear-gradient(156deg,#000,#21201c 53%,#171514);display:flex;justify-content:center;align-items:center;padding:20px}section.login .titleImage img{position:absolute;top:0;left:27%;width:45%;z-index:1}@media (max-width:500px){section.login .titleImage img{position:absolute;top:15%;left:10%;width:80%;z-index:1}}section.login .container{position:relative;margin-top:100px;width:400px;height:500px;background:#fff;box-shadow:0 15px 50px rgba(0,0,0,.1);overflow:hidden;border-radius:10px}section.login .container .user{position:absolute;top:0;left:0;width:100%;height:100%;display:flex}section.login .container .user .formBx{position:relative;width:100%;height:100%;background:#fff;display:flex;justify-content:center;align-items:center;padding:40px;transition:.5s}section.login .container .user .formBx form{width:400px}section.login .container .user .formBx form h2{font-size:18px;font-weight:600;text-transform:uppercase;letter-spacing:2px;text-align:center;width:100%;margin-bottom:10px;color:#555}section.login .container .user .formBx form input{position:relative;width:100%;padding:10px;background:#f5f5f5;color:#333;border:none;outline:none;box-shadow:none;margin:8px 0;font-size:14px;letter-spacing:1px;font-weight:300;border-radius:7px}section.login .container .user .formBx form input:focus{outline:none;border:1px solid #ff5e24;color:#ff5e24}section.login .container .user .formBx form input[type=password],section.login .container .user .formBx form input[type=text]{border-radius:7px 0 0 7px}section.login .container .user .formBx form button{position:relative;width:140px;height:35px;background:#1b1a17;color:#fff;cursor:pointer;font-size:14px;font-weight:500;letter-spacing:1px;transition:.5s;border:none;border-radius:7px;display:flex;align-items:center;justify-content:center;margin:8px 0}section.login .container .user .formBx form button.btn-4{background-color:#f40;background-image:linear-gradient(315deg,#f40,#ff8153 74%);line-height:42px;padding:0;border:none}section.login .container .user .formBx form button.btn-4:hover{background-color:#ff5e24;background-image:linear-gradient(315deg,#ff5e24,#cf3903 74%)}section.login .container .user .formBx form .bt,section.login .container .user .formBx form .pd{display:flex;align-items:center;justify-content:center}section.login .container .user .formBx form i{height:42px;padding-left:5px;padding-right:5px;font-size:25px;cursor:pointer;color:#1b1a17;background:#f5f5f5;border-radius:0 7px 7px 0}section .container .user .formBx form .signup{text-align:center;position:relative;margin-top:20px;font-size:12px;letter-spacing:1px;color:#555;text-transform:uppercase;font-weight:300}section .container .user .formBx form p{background-color:transparent;box-shadow:none}section .container .user .formBx form .signup a{font-weight:600;text-decoration:none;color:#1b1a17}@media (max-width:991px){section.login .container{max-width:400px}section.login .container .imgBx{display:none}section.login .container .user .formBx{width:100%}}.homeContainer{min-height:100vh;margin:auto;width:100%;background:#000;background:linear-gradient(156deg,#000,#21201c 53%,#171514)}.header{padding-top:10px;margin:0 30px 10px;border-bottom:1px solid #f40;display:flex;align-items:center;justify-content:space-between}.header .title img{padding:10px;width:70%}.header .userDetails{display:flex;flex-direction:column;align-items:flex-end;color:#fff;font-family:"Poppins",sans-serif}.header .userDetails .username{font-size:2rem;font-weight:600;margin:0}.header .userDetails .username span{color:#ff5e24}.header .userDetails .email{font-size:10px;margin:0 0 10px}.header .userDetails button.btn-4{width:120px;height:30px;background:#1b1a17;color:#fff;cursor:pointer;font-size:14px;font-weight:500;letter-spacing:1px;transition:.5s;border:none;border-radius:7px;display:flex;align-items:center;justify-content:center;margin:0 0 15px;background-color:#f40;background-image:linear-gradient(315deg,#f40,#ff8153 74%);line-height:42px;padding:0}.header .userDetails button.btn-4:hover{background-color:#ff5e24;background-image:linear-gradient(315deg,#ff5e24,#cf3903 74%)}@media (max-width:576px){.header{position:relative;padding-top:10px;margin:0 10px 10px;border-bottom:1px solid #f40;display:flex;align-items:center;justify-content:space-between}.header .title img{padding:10px;width:100%}.header .userDetails{display:flex;flex-direction:column;align-items:flex-start;color:#fff;font-family:"Poppins",sans-serif}.header .userDetails .username{font-size:14px;font-weight:600;margin:0}.header .userDetails .username span{color:#ff5e24}.header .userDetails .email{font-size:8px;margin:0 0 10px}.header .userDetails button.btn-4{position:absolute;right:20px;width:100px;height:25px;background:#1b1a17;color:#fff;cursor:pointer;font-size:10px;font-weight:500;letter-spacing:1px;transition:.5s;border:none;border-radius:7px;display:flex;align-items:center;justify-content:center;margin:0 0 15px;background-color:#f40;background-image:linear-gradient(315deg,#f40,#ff8153 74%);line-height:42px;padding:0}}.main-content{min-height:80vh;padding-top:10px;margin:0 30px 30px}.options{margin-bottom:30px}.options,.options .expenses-filter{display:flex;align-items:center;justify-content:center}.options .expenses-filter{color:#ff5e24}.options .expenses-filter select{background-color:transparent;text-align:center;border:none;width:100px;padding:0;font-size:18px;font-weight:400;height:30px;color:#fff;cursor:pointer;letter-spacing:1px;transition:.5s;border-radius:7px;display:flex;align-items:center;justify-content:center;margin:0 0 15px;background-color:rgba(27,26,23,.4549019607843137);background-image:linear-gradient(315deg,rgba(71,66,51,.4745098039215686),rgba(27,26,23,.5529411764705883) 74%);line-height:42px}.options .expenses-filter.month select{width:150px}.options .balances{display:flex;align-items:center;justify-content:center;color:#fff}.options .balances .balance,.options .balances .income,.options .balances .total-expense{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;margin:0}.options .balances p span.money{font-size:20px;color:#ff5e24;border-bottom:1px solid #ff5e24}.options .balances .income .edit-icon{cursor:pointer;margin:5px;font-size:18px;position:absolute;bottom:1px}.options .balances .income .edit-icon:hover{color:#ff5e24}.options .balances .income input{width:120px;text-align:center;background:none;border:none}.chart-and-addExpense{margin-bottom:30px}.chart{padding:1rem;border-radius:12px;background-color:rgba(27,26,23,.4549019607843137);background-image:linear-gradient(315deg,rgba(71,66,51,.4745098039215686),rgba(27,26,23,.5529411764705883) 74%);text-align:center;display:flex;justify-content:space-around;height:15rem;box-shadow:0 1px 8px rgba(0,0,0,.25)}.chart-bar{align-items:center;margin:0 10px}.chart-bar,.chart-bar__inner{height:100%;display:flex;flex-direction:column;width:100%}.chart-bar__inner{border:1px solid #313131;border-radius:12px;background-color:#1b1a17;overflow:hidden;justify-content:flex-end}.chart-bar__fill{background-color:#f40;background-image:linear-gradient(315deg,#f40,#ff8153 74%);width:100%;transition:all .3s ease-out}.chart-bar__label{margin-top:5px;color:#fff;font-weight:700;font-size:14px;text-align:center}@media (max-width:576px){.chart-and-addExpense{margin-bottom:0}.chart{height:13rem;position:relative;top:20px}.chart-bar{width:15px;margin:0 4px}.chart-bar__label{margin-top:5px;color:#fff;font-weight:400;font-size:10px;text-align:center}}.new-expense{display:flex;align-items:center;justify-content:center;background-color:#f40;background-image:linear-gradient(315deg,#f40,#ff8153 74%);padding:1rem;height:100%;border-radius:12px;text-align:center;box-shadow:0 1px 8px rgba(0,0,0,.25)}.new-expense button{font:inherit;cursor:pointer;padding:1rem 2rem;border:none;background-color:transparent;color:#fff;border-radius:12px;height:100%;width:100%;font-size:30px;font-weight:600}.new-expense:active,.new-expense:hover{background-color:#ff5e24;background-image:linear-gradient(315deg,#ff5e24,#cf3903 74%)}.modal-dialog{width:500px}.modal-content{border-radius:12px;box-shadow:0 1px 8px rgb(0 0 0/25%);background-color:#fff}.new-expense__controls{display:flex;flex-wrap:wrap;margin:2rem 2rem 0}.new-expense__control input{position:relative;width:100%;padding:10px;background:#e4e4e4;color:#333;border:none;outline:none;box-shadow:none;margin:8px 0;font-size:14px;letter-spacing:1px;font-weight:300;border-radius:7px}.new-expense__control input:focus{outline:none;border:1px solid #ff5e24;color:#ff5e24}.modal-footer,.modal-footer button{display:flex;align-items:center;justify-content:center}.modal-footer button{width:160px;height:35px;background:#1b1a17;color:#fff;cursor:pointer;font-size:18px;font-weight:500;letter-spacing:1px;transition:.5s;border:none;border-radius:7px;margin:0 15px 15px 0;background-color:#f40;background-image:linear-gradient(315deg,#f40,#ff8153 74%);line-height:42px;padding:0}.modal-footer button:hover{background-color:#ff5e24;background-image:linear-gradient(315deg,#ff5e24,#cf3903 74%)}@media (max-width:576px){.main-content{padding-top:5px;margin:0 10px 10px}.options{margin-bottom:10px}.options .balances{margin-bottom:10px;font-size:12px}.options .balances p span.money{font-size:14px}.options .expenses-filter select{justify-content:flex-start;width:60px;padding:0;font-size:12px;height:30px;margin:0}.options .expenses-filter.month select{width:100px}.new-expense{position:relative;top:-170px;left:10px;padding:0;width:100px}.new-expense button{width:100px;font-size:12px;font-weight:400;padding:5px}.modal-dialog{width:330px;position:relative;left:20px}.modal-content{border-radius:12px;box-shadow:0 1px 8px rgb(0 0 0/25%);background-color:#fff}.new-expense__controls{display:flex;flex-wrap:wrap;margin:1rem 1rem 0}.new-expense__control input{position:relative;width:100%;padding:10px;background:#e4e4e4;color:#333;border:none;outline:none;box-shadow:none;margin:8px 0;font-size:14px;letter-spacing:1px;font-weight:300;border-radius:7px}.new-expense__control input:focus{outline:none;border:1px solid #ff5e24;color:#ff5e24}.modal-footer,.modal-footer button{display:flex;align-items:center;justify-content:center}.modal-footer button{width:160px;height:35px;background:#1b1a17;color:#fff;cursor:pointer;font-size:18px;font-weight:500;letter-spacing:1px;transition:.5s;border:none;border-radius:7px;margin:0 15px 15px 0;background-color:#f40;background-image:linear-gradient(315deg,#f40,#ff8153 74%);line-height:42px;padding:0}.modal-footer button:hover{background-color:#ff5e24;background-image:linear-gradient(315deg,#ff5e24,#cf3903 74%)}}.expense-item.no-expense{color:#fff;font-size:20px;font-weight:500}.expense-item,.expense-item.no-expense{display:flex;align-items:center;justify-content:center;height:70px}.expense-item{box-shadow:0 2px 8px rgba(0,0,0,.25);padding:.5rem;margin:1rem 0;border-radius:12px;background-color:rgba(27,26,23,.4549019607843137);background-image:linear-gradient(315deg,rgba(71,66,51,.4745098039215686),rgba(27,26,23,.5529411764705883) 74%)}.expense-item .expense-title{color:#fff;font-size:20px;display:flex;flex-direction:column;justify-content:center}.expense-item .expense-title span.date{font-size:14px;color:#ff5e24}.expense-item .expense-amount{color:#fff;font-size:20px;color:#ff5e24}.expense-item .expense-actions,.expense-item .expense-amount{display:flex;align-items:center;justify-content:flex-end}.expense-item .expense-actions .edit-icon{padding:10px 10px 10px 12px}.expense-item .expense-actions .delete,.expense-item .expense-actions .edit-icon{color:#fff;font-size:20px;margin:10px;border-radius:7px;background:#ab3a00;background:linear-gradient(156deg,#ab3a00,#e04d01 53%,#ff5f00);display:flex;align-items:center;justify-content:flex-end}.expense-item .expense-actions .delete{cursor:pointer;padding:5px 10px}.expense-item .expense-actions .delete:hover,.expense-item .expense-actions .edit-icon:hover{background-color:#ff5e24;background-image:linear-gradient(315deg,#ff5e24,#cf3903 74%)}@media (max-width:576px){.expense-item{padding-top:15px;height:110px;align-items:flex-start}.expense-item .expense-title{font-size:16px}.expense-item .expense-title span.date{margin-top:5px;font-size:10px}.expense-item .expense-amount{font-size:16px}.expense-item .expense-actions .delete,.expense-item .expense-actions .edit-icon{-webkit-transform:scale(.8);transform:scale(.8)}.expense-item .expense-actions .delete{margin:0}}form .expense-item{height:120px;display:flex;justify-content:space-between}.expense-item input{width:150px;background:none;border:none;border-bottom:1px solid #ff5e24}.expense-item .expense-title span.date input{margin-top:10px;width:110px}.expense-item .expense-amount input{margin-top:10px;width:60px}.expense-item .buttons,.expense-item .buttons button{display:flex;align-items:center;justify-content:center}.expense-item .buttons button{width:120px;height:30px;background:#1b1a17;color:#fff;cursor:pointer;font-size:14px;font-weight:500;letter-spacing:1px;transition:.5s;border:none;border-radius:7px;margin:10px 20px 15px 0;background-color:#f40;background-image:linear-gradient(315deg,#f40,#ff8153 74%);line-height:42px;padding:0}.expense-item .buttons button:hover{background-color:#ff5e24;background-image:linear-gradient(315deg,#ff5e24,#cf3903 74%)}@media (max-width:576px){form .expense-item{height:150px}.expense-item .expense-title span.date input{margin-bottom:10px}.expense-item .expense-amount input{margin-top:0}}.footer{margin:0 30px 10px;height:120px;border-top:1px solid #f40}.footer,.footer .buttons,.footer .myicons,.footer .myicons .created,.footer .myicons .findme,.footer .myicons .socialIcons{display:flex;align-items:center;justify-content:center}.footer .findme{color:#fff;font-size:20px;font-weight:500}.footer .created{color:#fff;margin:10px;font-size:10px;border:1px solid #ff5e24;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;border-radius:8px}.footer .created span{color:#ff5e24;margin-left:5px}.footer .socialIcons a i{margin-left:10px;font-size:20px;color:#fff;float:left;width:44px;height:44px;background:#ab3a00;background:linear-gradient(156deg,#ab3a00,#e04d01 53%,#ff5f00);display:flex;justify-content:center;align-items:center;border-radius:50px;transition:all .2s ease-in-out}.footer .socialIcons a:hover i{background-color:#ff5e24;background-image:linear-gradient(315deg,#ff5e24,#cf3903 74%)}.footer .buttons button{width:120px;height:30px;background:#1b1a17;color:#fff;cursor:pointer;font-size:14px;font-weight:500;letter-spacing:1px;transition:.5s;border:none;border-radius:7px;display:flex;align-items:center;justify-content:center;margin:0 0 15px;background-color:#f40;background-image:linear-gradient(315deg,#f40,#ff8153 74%);line-height:42px;padding:0}.footer .buttons button:hover{background-color:#ff5e24;background-image:linear-gradient(315deg,#ff5e24,#cf3903 74%)}.footer .buttons button a{text-decoration:none;color:#fff}@media (max-width:576px){.footer{margin:0 30px 10px;height:200px}}
/*# sourceMappingURL=main.c5c33205.chunk.css.map */