@import url(https://fonts.googleapis.com/css2?family=Public+Sans:ital,wght@0,100..900;1,100..900&display=swap);*,:after,:before{box-sizing:border-box;margin:0;padding:0}html{font-size:100%;line-height:1.6}body{background-color:#fff;color:#000;font-family:sans-serif}a{color:inherit;text-decoration:none}ol,ul{list-style:none}img{display:block;height:auto;max-width:100%}button,input,textarea{font:inherit}table{border-collapse:collapse;width:100%}blockquote,q{quotes:none}blockquote:after,blockquote:before,q:after,q:before{content:""}body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:Public Sans,sans-serif;margin:0}code{font-family:source-code-pro,Menlo,Monaco,Consolas,Courier New,monospace}.loginContainer{align-items:center;background-color:#f8f4f0;display:flex;flex-direction:row;justify-content:flex-start}@media(max-width:1000px){.loginContainer{flex-direction:row;height:954px}.loginContainer,.loginContainer .tabletLogo{align-items:center;display:flex;justify-content:center}.loginContainer .tabletLogo{background-color:#201f24;height:66px;position:absolute;top:0;width:100%}}@media(max-width:600px){.loginContainer{height:825px}}.loginContainer .left{align-items:flex-end;background:url(/static/media/illustration-authentication.60f4a94f4382d6824928.svg);background-repeat:no-repeat;background-size:cover;border-radius:12px;color:#fff;display:flex;flex-direction:row;height:120vh;justify-content:flex-start;margin:20px;min-height:920px;width:40%}.loginContainer .left>div{margin:40px}.loginContainer .left>div h2{font-size:32px;font-weight:700;letter-spacing:0;line-height:120%;margin-bottom:24px}.loginContainer .left>div p{font-size:14px;font-weight:400;letter-spacing:0;line-height:150%}@media(max-width:1000px){.loginContainer .left{display:none}}.loginContainer .right{align-items:stretch;display:flex;flex-direction:row;justify-content:center;width:60%}.loginContainer .right form{background-color:#fff;border-radius:12px;padding:32px;width:70%}.loginContainer .right form h1{color:#201f24;font-size:32px;font-weight:700;letter-spacing:0;line-height:120%;margin-bottom:32px}.loginContainer .right form label p{color:#696868;font-size:12px;font-weight:700;letter-spacing:0;line-height:150%;margin-bottom:5px}.loginContainer .right form label input{border:.5px solid #696868;border-radius:8px;outline:none;padding:12px 20px;width:100%}.loginContainer .right form label:first-child input{margin-bottom:24px}.loginContainer .right form .pass{position:relative}.loginContainer .right form .pass img{cursor:pointer;height:20px;position:absolute;right:15px;top:50%;transform:translateY(-50%);width:20px}.loginContainer .right form .login{margin:32px 0;padding:12px 20px;width:100%}.loginContainer .right form .loading{animation:fade 1.4s infinite}.loginContainer .right form .signUpLink{color:#696868;font-size:14px;font-weight:400;letter-spacing:0;line-height:150%;text-align:center}.loginContainer .right form .signUpLink button{background:inherit;border:none;font-size:14px;font-weight:700;letter-spacing:0;line-height:150%;margin-left:4px;text-decoration:underline}.loginContainer .right form .error,.loginContainer .right form .success{font-size:14px;font-weight:700;letter-spacing:0;line-height:150%;margin-top:32px;text-align:center}.loginContainer .right form .success{animation:fade-2 1.4s infinite;color:#277c78}.loginContainer .right form .error{color:#c94736}@media(max-width:1000px){.loginContainer .right{width:75%}.loginContainer .right form{width:100%}}@media(max-width:600px){.loginContainer .right{width:95%}}.btn{border-radius:8px;cursor:pointer}.btn--primary{background-color:#201f24;border:none;color:#fff}.btn--primary:hover{background-color:#696868}.btn--secondary{background-color:#f8f4f0;border:1px solid #f8f4f0;color:#201f24}.btn--secondary:hover{background-color:#fff;border-color:#201f24}.btn--tertiary{align-items:center;background-color:initial;border:none;color:#696868;display:flex;flex-direction:row;height:21px;justify-content:flex-start;width:102px}.btn--tertiary img{margin-left:10px}.btn--tertiary:hover{color:#201f24}.btn--destroy{background-color:#c94736;border:none;color:#fff}.btn--destroy:hover{background-color:#c94736b3}.btn--large{height:53px;width:129px}.btn--word{background-color:#fff;border:none;color:#696868!important;font-size:14px;font-weight:400;letter-spacing:0;line-height:150%}.btn--word:hover{color:#201f24!important}.signUpContainer{align-items:center;background-color:#f8f4f0;display:flex;flex-direction:row;justify-content:flex-start}@media(max-width:1000px){.signUpContainer{flex-direction:row;height:954px}.signUpContainer,.signUpContainer .tabletLogo{align-items:center;display:flex;justify-content:center}.signUpContainer .tabletLogo{background-color:#201f24;height:66px;position:absolute;top:0;width:100%}}@media(max-width:600px){.signUpContainer{height:825px}}.signUpContainer .left{align-items:flex-end;background:url(/static/media/illustration-authentication.60f4a94f4382d6824928.svg);background-repeat:no-repeat;background-size:cover;border-radius:12px;color:#fff;display:flex;flex-direction:row;height:120vh;justify-content:flex-start;margin:20px;min-height:920px;width:40%}.signUpContainer .left>div{margin:40px}.signUpContainer .left>div h2{font-size:32px;font-weight:700;letter-spacing:0;line-height:120%;margin-bottom:24px}.signUpContainer .left>div p{font-size:14px;font-weight:400;letter-spacing:0;line-height:150%}@media(max-width:1000px){.signUpContainer .left{display:none}}.signUpContainer .right{align-items:stretch;display:flex;flex-direction:row;justify-content:center;width:60%}.signUpContainer .right form{background-color:#fff;border-radius:12px;padding:32px;width:70%}.signUpContainer .right form h1{color:#201f24;font-size:32px;font-weight:700;letter-spacing:0;line-height:120%;margin-bottom:32px}.signUpContainer .right form label p{color:#696868;font-size:12px;font-weight:700;letter-spacing:0;line-height:150%;margin-bottom:5px}.signUpContainer .right form label input{border:.5px solid #696868;border-radius:8px;outline:none;padding:12px 20px;width:100%}.signUpContainer .right form label:first-child input{margin-bottom:24px}.signUpContainer .right form .pass{position:relative}.signUpContainer .right form .pass img{cursor:pointer;height:20px;position:absolute;right:15px;top:50%;transform:translateY(-50%);width:20px}.signUpContainer .right form .login{margin:32px 0;padding:12px 20px;width:100%}.signUpContainer .right form .loading{animation:fade 1.4s infinite}.signUpContainer .right form .signUpLink{color:#696868;font-size:14px;font-weight:400;letter-spacing:0;line-height:150%;text-align:center}.signUpContainer .right form .signUpLink button{background:inherit;border:none;font-size:14px;font-weight:700;letter-spacing:0;line-height:150%;margin-left:4px;text-decoration:underline}.signUpContainer .right form .error,.signUpContainer .right form .success{font-size:14px;font-weight:700;letter-spacing:0;line-height:150%;margin-top:32px;text-align:center}.signUpContainer .right form .success{animation:fade-2 1.4s infinite;color:#277c78}.signUpContainer .right form .error{color:#c94736}@media(max-width:1000px){.signUpContainer .right{width:75%}.signUpContainer .right form{width:100%}}@media(max-width:600px){.signUpContainer .right{width:95%}}@keyframes fade{0%{background-color:#201f24;opacity:1}25%{background-color:#696868;opacity:1}75%{background-color:#b3b3b3;opacity:1}to{background-color:#f2f2f2;opacity:1}}@keyframes fade-2{0%{opacity:1}25%{opacity:.75}75%{opacity:.5}to{opacity:.25}}.sidebar{color:#b3b3b3;grid-template-columns:90px 1fr;min-height:100vh}.sidebar,.sidebar.open{display:grid;transition:grid-template-columns .3s ease-in-out}.sidebar.open{align-items:start;grid-template-columns:300px 1fr}.sidebar.open .content{transition:margin-left .5s ease-in-out}.sidebar.closed{align-items:start;display:grid;grid-template-columns:90px 1fr;transition:grid-template-columns .5s ease-in-out}.sidebar.closed .content{transition:margin-left .5s ease-in-out}.sidebar--right .nav--desktopClose{border-radius:15px 0 0 15px}.sidebar--right .nav--desktopClose .active{align-items:center;background-color:#f8f4f0;border-left:4px solid #277c78;border-radius:0 8px 8px 0;display:flex;flex-direction:row;height:54px;justify-content:center;width:76px}.sidebar--right .nav--desktopClose .active span{color:#201f24}.sidebar--right .nav--desktopOpen{border-radius:15px 0 0 15px}.sidebar--right .nav--desktopOpen .active{align-items:center;background-color:#f8f4f0;border-left:4px solid #277c78;border-radius:0 8px 8px 0;display:flex;flex-direction:row;height:54px;justify-content:flex-start;padding-left:32px;width:256px}.sidebar--right .nav--desktopOpen .active span{color:#201f24}.sidebar--right.open{transition:grid-template-columns .3s ease-in-out}.sidebar--right.open .content{grid-column:1/3;margin-right:300px;transition:margin-right .5s ease-in-out}.sidebar--right.open .content--mobile,.sidebar--right.open .content--tablet{grid-column:1/3;margin-right:0}.sidebar--right.closed{transition:grid-template-columns .5s ease-in-out}.sidebar--right.closed .content{grid-column:1/3;margin-right:90px;transition:margin-right .5s ease-in-out}.sidebar--right.closed .content--mobile,.sidebar--right.closed .content--tablet{grid-column:1/3;margin-right:0}.sidebar--left .nav--desktopClose{border-radius:0 15px 15px 0}.sidebar--left .nav--desktopClose .imageMinimize{padding-left:15px}.sidebar--left .nav--desktopClose ul{align-items:flex-end;display:flex;flex-direction:column;justify-content:flex-end}.sidebar--left .nav--desktopClose .active{align-items:center;background-color:#f8f4f0;border-radius:8px 0 0 8px;border-right:4px solid #277c78;display:flex;flex-direction:row;height:54px;justify-content:center;width:76px}.sidebar--left .nav--desktopClose .active span{color:#201f24}.sidebar--left .nav--desktopClose .imageMinimize{align-items:center;display:flex;flex-direction:column;justify-content:center;width:100%}.sidebar--left .nav--desktopOpen .imageMinimize{align-items:flex-end;display:flex;flex-direction:row;justify-content:center;padding-left:15px;transition:transform .3s ease;width:256px}.sidebar--left .nav--desktopOpen ul{align-items:flex-end;display:flex;flex-direction:column;justify-content:flex-end}.sidebar--left .nav--desktopOpen li a{align-items:center;display:flex;flex-direction:row;justify-content:flex-end}.sidebar--left .nav--desktopOpen li .active{align-items:center;background-color:#f8f4f0;border-radius:8px 0 0 8px;border-right:4px solid #277c78;display:flex;flex-direction:row;height:54px;justify-content:flex-start;padding-right:32px;width:256px}.sidebar--left .nav--desktopOpen li .active span{color:#201f24}.sidebar .content{grid-column:2/3;padding:32px 40px;transition:margin-left .5s ease-in-out}@media(max-width:1000px){.sidebar .content{padding:24px}}@media(max-width:600px){.sidebar .content{padding:24px 16px}}.sidebar .content--mobile,.sidebar .content--tablet{grid-column:1/3}.nav--desktop{transition:width .3s ease}.nav--desktop .toggleMenuContainer{width:100%}.nav--desktop img,.nav--desktop svg{margin-right:8px}.nav--desktop .logo img{transition:opacity .3s ease}.nav--desktop .userName{color:#b3b3b3;cursor:auto;font-size:14px;font-weight:400;letter-spacing:0;line-height:150%;margin-top:12px}.nav--desktop .imageMinimize:hover{transform:scale(1.1)}.nav--desktop ul{opacity:1;transition:opacity .3s ease}.nav--desktop ul li span{color:#b3b3b3;font-size:16px;font-weight:700;line-height:150%}.nav--desktop ul li .active .svgIcon .svgColor{fill:#277c78!important}.nav--desktop ul li .active .recurringBill{background-color:#277c78}.nav--desktop ul li .active .recurringBill .svgColor{fill:#fff!important}.nav--desktop .imageMinimize{align-items:center;bottom:50px;cursor:pointer;display:flex;flex-direction:row;justify-content:center;position:absolute;transition:transform .3s ease;width:76px}.nav--desktop .imageMinimize img{height:24px;transition:transform .3s ease;width:24px}.nav--desktop .imageMinimize img.rotate-closed{transform:rotate(180deg)}.nav--desktop .imageMinimize img.rotate-open{transform:rotate(0deg)}.nav--desktop>div:last-child{width:100%}.nav--desktopClose{align-items:center;background-color:#201f24;border-radius:0 15px 15px 0;display:flex;flex-direction:column;height:100vh;justify-content:flex-start;min-height:606px;position:fixed;width:88px;z-index:999}.nav--desktopClose .logo{cursor:pointer;position:absolute;top:25px}.nav--desktopClose ul{align-items:flex-start;display:flex;flex-direction:column;justify-content:flex-end;margin-top:6rem}.nav--desktopClose ul li{align-items:center;cursor:pointer;display:flex;flex-direction:row;height:54px;justify-content:center;width:76px}.nav--desktopClose ul li:not(:first-child){margin-top:12px}.nav--desktopClose ul li img,.nav--desktopClose ul li svg{height:24px;width:24px}.nav--desktopOpen{align-items:flex-start;background-color:#201f24;border-radius:0 15px 15px 0;color:#fff;display:flex;flex-direction:column;height:100vh;justify-content:flex-start;min-height:606px;position:relative;position:fixed;width:280px}.nav--desktopOpen .logo{cursor:pointer;margin-left:32px;position:absolute;top:25px}.nav--desktopOpen ul{margin-top:6rem}.nav--desktopOpen ul,.nav--desktopOpen ul li{align-items:flex-start;display:flex;flex-direction:column;justify-content:flex-start}.nav--desktopOpen ul li{cursor:pointer;margin-bottom:32px;width:256px}.nav--desktopOpen ul li a{align-items:flex-start;display:flex;flex-direction:row;justify-content:flex-start;padding-left:32px}.nav--desktopOpen ul li img,.nav--desktopOpen ul li svg{height:24px;margin-right:12px;width:24px}.nav--desktopOpen .imageMinimize{align-items:center;display:flex;flex-direction:row;justify-content:flex-start;padding-left:32px;transition:transform .3s ease;width:256px}.nav--desktopOpen .imageMinimize span{color:#b3b3b3;font-size:16px;font-weight:700;line-height:150%;margin-left:12px}.nav--right{grid-column:2/3;right:0}.nav--right .imageMinimize img.rotate-closed{transform:rotate(0deg)}.nav--right .imageMinimize img.rotate-open{transform:rotate(180deg)}.nav--tablet{background-color:#201f24;border-radius:15px 15px 0 0;bottom:0;height:70px;left:0;margin-top:32px;position:fixed;width:100%;z-index:999}.nav--tablet .logo{display:none}.nav--tablet ul{align-items:flex-end;display:flex;flex-direction:row;height:70px;justify-content:space-around;width:100%}.nav--tablet ul li{color:#fff;justify-content:flex-start}.nav--tablet ul li,.nav--tablet ul li a{align-items:center;display:flex;flex-direction:column}.nav--tablet ul li a{height:60px;justify-content:center;width:90px}.nav--tablet ul li a span{color:#696868;font-size:12px;font-weight:700;letter-spacing:0;line-height:150%}.nav--tablet ul li img,.nav--tablet ul li svg{height:18px;margin-bottom:4px;width:18px}.nav--tablet .imageMinimize{display:none}.nav--tablet .sidebar .content{grid-column:1/3;padding:32px 40px;transition:margin-left .5s ease-in-out}.nav--tablet .active{background-color:#f8f4f0;border-bottom:4px solid #277c78;border-radius:8px 8px 0 0}.nav--tablet .active .svgIcon .svgColor{fill:#277c78!important}.nav--tablet .active .recurringBill{background-color:#277c78}.nav--tablet .active .recurringBill .svgColor{fill:#fff!important}.nav--tablet .active span{color:#201f24}.nav--mobile{background-color:#201f24;border-radius:15px 15px 0 0;bottom:0;height:44px;left:0;margin-top:32px;position:fixed;width:100%;z-index:999}.nav--mobile .logo{display:none}.nav--mobile ul{align-items:flex-end;display:flex;flex-direction:row;height:44px;justify-content:space-around;overflow:auto;width:100%}.nav--mobile ul li{color:#fff;justify-content:flex-start}.nav--mobile ul li,.nav--mobile ul li a{align-items:center;display:flex;flex-direction:column}.nav--mobile ul li a{height:36px;justify-content:center;width:50px}.nav--mobile ul li a span{color:#696868;font-size:12px;font-weight:700;letter-spacing:0;line-height:150%}.nav--mobile ul li .active .svgIcon .svgColor{fill:#277c78!important}.nav--mobile ul li .active .recurringBill{background-color:#277c78}.nav--mobile ul li .active .recurringBill .svgColor{fill:#fff!important}.nav--mobile ul li img,.nav--mobile ul li svg{height:18px;margin-bottom:4px;width:18px}.nav--mobile ul li span{display:block}.nav--mobile .imageMinimize{display:none}.nav--mobile .active{background-color:#f8f4f0;border-bottom:4px solid #277c78;border-radius:8px 8px 0 0}.nav--mobile .active span{color:#201f24}.homeContainer{background-color:#f8f4f0}@media(max-width:1000px){.homeContainer .content{margin-bottom:24px}}.homeContainer .content h1{color:#201f24;font-size:32px;font-weight:700;letter-spacing:0;line-height:120%}.homeContainer .content .topSection{align-items:stretch;display:flex;flex-direction:row;justify-content:space-between;margin:32px 0}@media(max-width:1000px){.homeContainer .content .topSection{flex-wrap:wrap}}@media(max-width:600px){.homeContainer .content .topSection{display:block}}.homeContainer .content .topSection>div{background-color:#fff;border-radius:12px;padding:24px;width:32%}@media(max-width:600px){.homeContainer .content .topSection>div{margin-bottom:12px;padding:24px 20px;width:100%}.homeContainer .content .topSection>div:last-child{margin-bottom:0}}.homeContainer .content .topSection>div h5{color:#696868;font-size:14px;font-weight:400;letter-spacing:0;line-height:150%}.homeContainer .content .topSection>div h3{color:#201f24;font-size:32px;font-weight:700;letter-spacing:0;line-height:120%;margin-top:12px;word-break:break-word}.homeContainer .content .topSection>div:first-child{background-color:#201f24}.homeContainer .content .topSection>div:first-child h3,.homeContainer .content .topSection>div:first-child h5{color:#fff}.homeContainer .content .bottomSection{align-items:stretch;display:flex;flex-direction:row;justify-content:space-between}.homeContainer .content .bottomSection .left{margin-right:24px;width:60%}@media(max-width:1000px){.homeContainer .content .bottomSection .left{width:100%}}.homeContainer .content .bottomSection .left .potsSummary{margin-bottom:24px}.homeContainer .content .bottomSection .left .potsSummary .potsSummaryContent{align-items:stretch;display:flex;flex-direction:row;justify-content:flex-start}@media(max-width:600px){.homeContainer .content .bottomSection .left .potsSummary .potsSummaryContent{display:block}}.homeContainer .content .bottomSection .left .potsSummary .potsSummaryContent .totalSaved{align-items:center;background-color:#f8f4f0;border-radius:12px;display:flex;flex-direction:row;height:110px;justify-content:flex-start;margin-right:20px;padding:16px;width:50%}@media(max-width:600px){.homeContainer .content .bottomSection .left .potsSummary .potsSummaryContent .totalSaved{margin-bottom:20px;width:100%}}.homeContainer .content .bottomSection .left .potsSummary .potsSummaryContent .totalSaved p{font-size:14px;font-weight:400;letter-spacing:0;line-height:150%;margin-left:16px}.homeContainer .content .bottomSection .left .potsSummary .potsSummaryContent .totalSaved p span{color:#201f24;display:block;font-size:32px;font-weight:700;letter-spacing:0;line-height:120%}.homeContainer .content .bottomSection .left .potsSummary .potsSummaryContent .potsPreview{align-items:center;display:flex;flex-direction:row;flex-wrap:wrap;justify-content:flex-start;width:50%}@media(max-width:600px){.homeContainer .content .bottomSection .left .potsSummary .potsSummaryContent .potsPreview{width:100%}}.homeContainer .content .bottomSection .left .potsSummary .potsSummaryContent .potsPreview .potCard{align-items:stretch;display:flex;flex-direction:row;justify-content:flex-start;width:50%}.homeContainer .content .bottomSection .left .potsSummary .potsSummaryContent .potsPreview .potCard:first-child,.homeContainer .content .bottomSection .left .potsSummary .potsSummaryContent .potsPreview .potCard:nth-child(2){margin-bottom:16px}.homeContainer .content .bottomSection .left .potsSummary .potsSummaryContent .potsPreview .potCard>div{border-left:4px solid;border-radius:8px;margin-right:16px}.homeContainer .content .bottomSection .left .potsSummary .potsSummaryContent .potsPreview .potCard p{color:#696868;font-size:12px;font-weight:400;letter-spacing:0;line-height:150%}.homeContainer .content .bottomSection .left .potsSummary .potsSummaryContent .potsPreview .potCard p span{color:#201f24;display:block;font-size:14px;font-weight:700;letter-spacing:0;line-height:150%;margin-top:4px}.homeContainer .content .bottomSection .left .transactionSummary ul li{align-items:stretch;display:flex;flex-direction:row;justify-content:space-between;padding:20px 0}.homeContainer .content .bottomSection .left .transactionSummary ul li .nameAndImg{align-items:center;cursor:pointer;display:flex;flex-direction:row;justify-content:flex-start;text-align:left;width:40%}.homeContainer .content .bottomSection .left .transactionSummary ul li .nameAndImg h3{color:#201f24;font-size:14px;font-weight:700;letter-spacing:0;line-height:150%;margin-left:12px}.homeContainer .content .bottomSection .left .transactionSummary ul li .nameAndImg h3:first-child{margin-left:0}.homeContainer .content .bottomSection .left .transactionSummary ul li .nameAndImg .transactionAvatarColor{border-radius:50%;height:32px;opacity:.9;width:32px}.homeContainer .content .bottomSection .left .transactionSummary ul li .nameAndImg img{border-radius:50%;height:40px;width:40px}.homeContainer .content .bottomSection .left .transactionSummary ul li .nameAndImg h4{color:#201f24;font-size:14px;font-weight:700;letter-spacing:0;line-height:150%;margin-left:14px}.homeContainer .content .bottomSection .left .transactionSummary ul li .amountAndDate{text-align:right}.homeContainer .content .bottomSection .left .transactionSummary ul li .amountAndDate p{font-size:12px;font-weight:400;letter-spacing:0;line-height:150%}.homeContainer .content .bottomSection .left .transactionSummary ul li .amountAndDate p.positive{color:#277c78;font-size:14px;font-weight:700;letter-spacing:0;line-height:150%;margin-bottom:4px}.homeContainer .content .bottomSection .left .transactionSummary ul li .amountAndDate p.negative{color:#201f24;font-size:14px;font-weight:700;letter-spacing:0;line-height:150%;margin-bottom:4px}.homeContainer .content .bottomSection .right{align-items:stretch;display:flex;flex-direction:column;justify-content:space-between;width:40%}@media(max-width:1000px){.homeContainer .content .bottomSection .right{margin-bottom:32px;margin-top:24px;width:100%}}.homeContainer .content .bottomSection .right .budgetsSummary{margin-bottom:24px}.homeContainer .content .bottomSection .right .budgetsSummary .budgetSummaryContent{align-items:center;display:flex;flex-direction:row;flex-wrap:wrap;justify-content:center}@media(max-width:1000px){.homeContainer .content .bottomSection .right .budgetsSummary .budgetSummaryContent{align-items:center;display:flex;flex-direction:row;justify-content:space-around}}.homeContainer .content .bottomSection .right .budgetsSummary .budgetSummaryContent .pieChartContainer .pieChart{border-radius:50%;box-sizing:border-box;height:100%;min-height:240px;min-width:240px;outline:1px solid #ccc;position:relative;width:100%}.homeContainer .content .bottomSection .right .budgetsSummary .budgetSummaryContent .pieChartContainer .pieChart p{color:#696868;font-size:12px;font-weight:400;left:50%;letter-spacing:0;line-height:150%;position:absolute;top:50%;transform:translate(-50%,-50%)}.homeContainer .content .bottomSection .right .budgetsSummary .budgetSummaryContent .pieChartContainer .pieChart p span{color:#201f24;display:block;font-size:32px;font-weight:700;letter-spacing:0;line-height:120%;margin-bottom:8px;text-align:center}.homeContainer .content .bottomSection .right .budgetsSummary .budgetSummaryContent ul{margin-left:16px;margin-top:20px}.homeContainer .content .bottomSection .right .budgetsSummary .budgetSummaryContent ul li{align-items:stretch;display:flex;flex-direction:row;font-size:12px;font-weight:400;justify-content:flex-start;letter-spacing:0;line-height:150%;margin-bottom:16px}.homeContainer .content .bottomSection .right .budgetsSummary .budgetSummaryContent ul li div{border-left:4px solid;border-radius:8px;margin-right:16px}.homeContainer .content .bottomSection .right .budgetsSummary .budgetSummaryContent ul li span{color:#201f24;display:block;font-size:14px;font-weight:700;letter-spacing:0;line-height:150%;margin-top:4px}.homeContainer .content .bottomSection .right .recurringBillsSummary .summaryContent p{align-items:stretch;background-color:#f8f4f0;border-radius:8px;color:#696868;display:flex;flex-direction:row;font-size:14px;font-weight:400;justify-content:space-between;letter-spacing:0;line-height:150%;margin-bottom:12px;padding:20px 16px}.homeContainer .content .bottomSection .right .recurringBillsSummary .summaryContent p span{color:#201f24;font-size:14px;font-weight:700;letter-spacing:0;line-height:150%}.homeContainer .content .bottomSection .right .recurringBillsSummary .summaryContent p.paid{border-left:5px solid #277c78}.homeContainer .content .bottomSection .right .recurringBillsSummary .summaryContent p.upcoming{border-left:5px solid #f2cdac}.homeContainer .content .bottomSection .right .recurringBillsSummary .summaryContent p.soon{border-left:5px solid #82c9d7}.homeContainer .content .bottomSection .budgetsSummary,.homeContainer .content .bottomSection .potsSummary,.homeContainer .content .bottomSection .recurringBillsSummary,.homeContainer .content .bottomSection .transactionSummary{background-color:#fff;border-radius:12px;padding:32px}@media(max-width:600px){.homeContainer .content .bottomSection .budgetsSummary,.homeContainer .content .bottomSection .potsSummary,.homeContainer .content .bottomSection .recurringBillsSummary,.homeContainer .content .bottomSection .transactionSummary{padding:24px 20px}}.homeContainer .content .bottomSection .summaryHeader{align-items:center;display:flex;flex-direction:row;justify-content:space-between;margin-bottom:20px}.homeContainer .content .bottomSection .summaryHeader h3{color:#201f24;font-size:20px;font-weight:700;letter-spacing:0;line-height:120%}.homeContainer .content .bottomSection .summaryHeader button{align-items:center;color:#696868;display:flex;flex-direction:row;font-size:14px;font-weight:400;justify-content:flex-end;letter-spacing:0;line-height:150%}@media(max-width:1000px){.homeContainer .content .bottomSection{display:block;width:100%}}.skeletonPot{animation:shimmer 1.5s infinite;background-color:#fff;border-radius:12px;padding:24px}.skeletonPot .skeletonPotHeader{align-items:center;display:flex;justify-content:space-between}.skeletonPot .skeletonPotHeader .circle{background:#f2f2f2;border-radius:50%;height:16px;width:16px}.skeletonPot .skeletonPotHeader .title{background:#f2f2f2;border-radius:4px;flex:1 1;height:20px;margin-left:14px}.skeletonPot .skeletonPotContent{margin:32px 0}.skeletonPot .skeletonPotContent .totalSaved{align-items:center;display:flex;justify-content:space-between;margin-bottom:16px}.skeletonPot .skeletonPotContent .totalSaved .amount,.skeletonPot .skeletonPotContent .totalSaved .label{background:#f2f2f2;border-radius:4px;height:16px}.skeletonPot .skeletonPotContent .totalSaved .label{width:50%}.skeletonPot .skeletonPotContent .totalSaved .amount{width:30%}.skeletonPot .skeletonPotContent .progressBar{background:#f2f2f2;border-radius:6px;height:12px;width:100%}.skeletonPot .skeletonPotFooter{display:flex;justify-content:space-between}.skeletonPot .skeletonPotFooter .button{background:#f2f2f2;border-radius:8px;height:40px;width:48%}.transactionContainer{background-color:var(--color-beige-100)}.transactionContainer .skeleton{display:flex;flex-direction:column;gap:1rem}.transactionContainer .skeleton-amount,.transactionContainer .skeleton-button,.transactionContainer .skeleton-category,.transactionContainer .skeleton-date,.transactionContainer .skeleton-filter,.transactionContainer .skeleton-heading,.transactionContainer .skeleton-name,.transactionContainer .skeleton-pagination,.transactionContainer .skeleton-search{animation:shimmer 1.5s infinite;background:linear-gradient(90deg,var(--color-grey-100) 25%,var(--color-grey-200) 50%,var(--color-grey-100) 75%);background-size:200% 100%;border-radius:4px}.transactionContainer .skeleton-heading{height:1.5rem;width:30%}.transactionContainer .skeleton-button{border-radius:8px;height:2.5rem;width:10rem}.transactionContainer .skeleton-search{border-radius:8px;height:2.5rem;width:40%}.transactionContainer .skeleton-filter{border-radius:8px;height:2.5rem;width:20%}.transactionContainer .skeleton-filter:not(:last-child){margin-right:1rem}.transactionContainer .skeleton-transaction{border-bottom:1px solid var(--color-grey-100);display:flex;gap:1rem;padding:.5rem 0}.transactionContainer .skeleton-transaction .skeleton-name{height:2rem;width:40%}.transactionContainer .skeleton-transaction .skeleton-category,.transactionContainer .skeleton-transaction .skeleton-date{height:1.5rem;width:15%}.transactionContainer .skeleton-transaction .skeleton-amount{height:1.5rem;width:20%}.transactionContainer .skeleton-pagination{border-radius:8px;height:2rem;width:100%}.transactionContainer .shimmer{animation:shimmer 1.5s infinite;background:linear-gradient(90deg,var(--color-grey-100) 25%,var(--color-grey-200) 50%,var(--color-grey-100) 75%);background-size:200% 100%}.budgetContainerSkeleton{background-color:#f8f4f0}.budgetContainerSkeleton .budgetContentSkeleton,.budgetContainerSkeleton .budgetHeaderSkeleton{align-items:flex-start;display:flex;justify-content:space-between}.budgetContainerSkeleton .budgetContentSkeleton .skeleton,.budgetContainerSkeleton .budgetHeaderSkeleton .skeleton{animation:shimmer 1.5s infinite;background:linear-gradient(90deg,#f0f0f0 25%,#e0e0e0 50%,#f0f0f0 75%);background-size:200% 100%;border-radius:8px}.budgetContainerSkeleton .budgetHeaderSkeleton .headerSkeleton{height:32px;width:40%}.budgetContainerSkeleton .budgetHeaderSkeleton .buttonSkeleton{height:40px;width:20%}.budgetContainerSkeleton .budgetContentSkeleton{margin-top:32px}.budgetContainerSkeleton .budgetContentSkeleton .leftSkeleton,.budgetContainerSkeleton .budgetContentSkeleton .rightSkeleton{background-color:#fff;border-radius:12px;padding:32px}.budgetContainerSkeleton .budgetContentSkeleton .leftSkeleton{width:35%}.budgetContainerSkeleton .budgetContentSkeleton .leftSkeleton .pieChartSkeleton{border-radius:50%;height:240px;margin:0 auto;width:240px}.budgetContainerSkeleton .budgetContentSkeleton .leftSkeleton .summarySkeleton{margin-top:32px}.budgetContainerSkeleton .budgetContentSkeleton .leftSkeleton .summarySkeleton .summaryLine{height:16px;margin-bottom:16px;width:80%}.budgetContainerSkeleton .budgetContentSkeleton .rightSkeleton{display:flex;flex-direction:column;gap:1rem;width:60%}.budgetContainerSkeleton .budgetContentSkeleton .rightSkeleton .categorySkeleton{margin-bottom:24px}.budgetContainerSkeleton .budgetContentSkeleton .rightSkeleton .categorySkeleton .headerSkeleton{height:32px;margin-bottom:16px}.budgetContainerSkeleton .budgetContentSkeleton .rightSkeleton .categorySkeleton .lineSkeleton{border-radius:4px;height:24px;margin:16px 0;width:100%}.budgetContainerSkeleton .budgetContentSkeleton .rightSkeleton .categorySkeleton .spentRemainSkeleton{display:flex;justify-content:space-between}.budgetContainerSkeleton .budgetContentSkeleton .rightSkeleton .categorySkeleton .spentRemainSkeleton .themeSkeleton{height:24px;margin-right:16px;width:15%}.budgetContainerSkeleton .budgetContentSkeleton .rightSkeleton .categorySkeleton .spentRemainSkeleton .textSkeleton{height:16px;width:40%}.budgetContainerSkeleton .budgetContentSkeleton .rightSkeleton .transactionListSkeleton .transactionSkeleton{height:32px;margin-top:20px}.skeletonBill .billRow{display:flex;justify-content:space-between;margin-bottom:12px}.skeletonBill .billRow .label{background:#f2f2f2;border-radius:4px;height:16px;width:70%}.skeletonBill .billRow .status{background:#f2f2f2;border-radius:4px;height:16px;width:20%}.skeletonReccontainer .skeleton{animation:shimmer 1.5s infinite;background:linear-gradient(90deg,#f0f0f0 25%,#e0e0e0 50%,#f0f0f0 75%);background-size:200% 100%;border-radius:4px}.skeletonReccontainer .skeletonHeader{margin-bottom:16px}.skeletonReccontainer .skeletonTitle{height:20px;margin-bottom:8px;width:150px}.skeletonReccontainer .skeletonSubtitle{height:16px;width:100px}.skeletonReccontainer .skeletonBills{display:flex;flex-direction:column;gap:12px}.skeletonReccontainer .skeletonBill{align-items:center;border:1px solid #f0f0f0;border-radius:6px;display:flex;justify-content:space-between;padding:12px}.skeletonReccontainer .skeletonName{height:14px;width:120px}.skeletonReccontainer .skeletonDate{height:14px;width:90px}.skeletonReccontainer .skeletonAmount{height:14px;width:60px}.skeleton-home{display:flex;flex-direction:column;gap:1rem;padding:1.5rem}.skeleton-home .shimmer{animation:shimmer 1.5s infinite;background:linear-gradient(90deg,#f0f0f0 25%,#e0e0e0 50%,#f0f0f0 75%);background-size:200% 100%}.skeleton-home .skeleton-header{border-radius:.5rem;height:2rem;width:50%}.skeleton-home .skeleton-top-section{display:flex;gap:1rem;justify-content:space-between}.skeleton-home .skeleton-top-section .skeleton-card{border-radius:.5rem;flex:1 1;height:6rem}.skeleton-home .skeleton-bottom-section{display:flex;gap:1.5rem;justify-content:space-between}.skeleton-home .skeleton-bottom-section .skeleton-left,.skeleton-home .skeleton-bottom-section .skeleton-right{display:flex;flex:1 1;flex-direction:column;gap:1rem}.skeleton-home .skeleton-bottom-section .skeleton-left .skeleton-box,.skeleton-home .skeleton-bottom-section .skeleton-right .skeleton-box{border-radius:.5rem;height:10rem}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}.potsContainer{background-color:#f8f4f0}@media(max-width:1000px){.potsContainer{margin-bottom:3rem}}.potsContainer .potsHeader{align-items:center;display:flex;flex-direction:row;justify-content:space-between}.potsContainer .potsHeader h1{color:#201f24;font-size:32px;font-weight:700;line-height:120%}.potsContainer .potsHeader button{font-size:14px;font-weight:700;line-height:150%}.potsContainer .pots{grid-gap:20px;display:grid;gap:20px;grid-template-columns:repeat(2,1fr);margin-top:32px}@media(max-width:1000px){.potsContainer .pots{display:block}}.potsContainer .pots .potsInfo{background-color:#fff;border-radius:12px;padding:24px}@media(max-width:1000px){.potsContainer .pots .potsInfo{margin-bottom:32px}}.potsContainer .pots .potsInfo .potsInfoHeader{align-items:stretch;display:flex;flex-direction:row;justify-content:space-between}.potsContainer .pots .potsInfo .potsInfoHeader h5{align-items:center;color:#201f24;display:flex;flex-direction:row;font-size:20px;font-weight:700;justify-content:flex-start}.potsContainer .pots .potsInfo .potsInfoHeader h5 span{border-radius:50%;height:16px;margin-right:14px;width:16px}.potsContainer .pots .potsInfo .potsInfoHeader button{background-color:inherit;border:none}.potsContainer .pots .potsInfo .potsInfoContent{margin:32px 0}.potsContainer .pots .potsInfo .potsInfoContent .target,.potsContainer .pots .potsInfo .potsInfoContent .totalSaved{align-items:center;display:flex;flex-direction:row;justify-content:space-between}.potsContainer .pots .potsInfo .potsInfoContent .totalSaved{margin-bottom:16px}.potsContainer .pots .potsInfo .potsInfoContent .totalSaved span{color:#696868;font-size:14px;font-weight:400;letter-spacing:0;line-height:150%}.potsContainer .pots .potsInfo .potsInfoContent .totalSaved p{color:#201f24;font-size:32px;font-weight:700;letter-spacing:0;line-height:120%}.potsContainer .pots .potsInfo .potsInfoContent .target{margin-top:13px}.potsContainer .pots .potsInfo .potsInfoContent .target span{color:#696868;font-size:12px;font-weight:700;letter-spacing:0;line-height:150%}.potsContainer .pots .potsInfo .potsInfoContent .target p{font-size:12px;font-weight:400;letter-spacing:0;line-height:150%}.potsContainer .pots .potsInfo .potsInfoFooter{align-items:stretch;display:flex;flex-direction:row;flex-wrap:wrap;justify-content:space-between}.potsContainer .pots .potsInfo .potsInfoFooter button{color:#201f24;font-size:14px;font-weight:700;letter-spacing:0;line-height:150%;width:48%}.potsContainer .modalOverlay{align-items:center;background-color:#00000080;display:flex;flex-direction:row;height:100%;justify-content:center;left:0;opacity:0;pointer-events:none;position:fixed;top:0;transition:opacity .6s ease;width:100%;z-index:999}.potsContainer .modalOverlay.open,.potsContainer .modalOverlay.opening{opacity:1;pointer-events:auto}.potsContainer .modalOverlay.closing{opacity:0;pointer-events:none}.potsContainer .modalOverlay .modal{align-items:center;background-color:#fff;border-radius:8px;box-shadow:0 4px 15px #0003;display:flex;flex-direction:column;gap:.45rem;margin-top:2%;max-width:400px;min-width:580px;opacity:0;padding:2rem;width:100%;z-index:1000}@media(max-width:1000px){.potsContainer .modalOverlay .modal{max-width:100%;min-width:100%}}@media(max-width:600px){.potsContainer .modalOverlay .modal{overflow-y:auto;transform:scale(.75)!important}}.potsContainer .modalOverlay .modal.open,.potsContainer .modalOverlay .modal.opening{opacity:1;transform:scale(.85);transition:opacity .4s ease,transform .4s ease}.potsContainer .modalOverlay .modal.closing{opacity:0;transform:scale(.6)}.potsContainer .modalOverlay .modal .modalHeader{align-items:stretch;display:flex;flex-direction:row;justify-content:flex-start}.potsContainer .modalOverlay .modal .modalHeader img{cursor:pointer}.potsContainer .modalOverlay .modal h2{font-size:32px;font-weight:700;letter-spacing:0;line-height:120%;text-align:left;width:100%}.potsContainer .modalOverlay .modal .addItemName>div,.potsContainer .modalOverlay .modal p{color:#696868;font-size:14px;font-weight:400;letter-spacing:0;line-height:150%}.potsContainer .modalOverlay .modal .addItemName{align-items:stretch;display:flex;flex-direction:column;justify-content:flex-start}.potsContainer .modalOverlay .modal .addItemName>div{align-self:flex-end;margin-top:4px}.potsContainer .modalOverlay .modal .transactionButton{background-color:#201f24;border:none;color:#fff;cursor:pointer;font-size:12px;height:51px;transition:background-color .3s,color .3s;width:14%}.potsContainer .modalOverlay .modal .transactionButton:hover{background-color:#e6e6e6}.potsContainer .modalOverlay .modal .transactionButton.active{background-color:#4caf50;border-color:#4caf50;color:#fff}.potsContainer .modalOverlay .modal .transactionButton.active.send{background-color:#f44336;border-color:#f44336}.potsContainer .modalOverlay .modal .addAmount .amountInputWrapper{align-items:center;background-color:#f9f9f9;display:flex;flex-direction:row;justify-content:space-between;position:relative}.potsContainer .modalOverlay .modal .addAmount .amountInputWrapper input{padding-left:16%}.potsContainer .modalOverlay .modal .addAmount .amountInputWrapper .receiveBtn{border-radius:8px 0 0 8px;left:0;margin:0;position:absolute;top:0}.potsContainer .modalOverlay .modal .addAmount .amountInputWrapper .sentBtn{border-radius:0 8px 8px 0;margin:0;position:absolute;right:0;top:0}.potsContainer .modalOverlay .modal .dateAndCategory{align-items:center;display:flex;flex-direction:row;justify-content:space-between}.potsContainer .modalOverlay .modal .dateAndCategory input{padding:9px 24px}.potsContainer .modalOverlay .modal .dateAndCategory .colorOptions{width:35%}.potsContainer .modalOverlay .modal .dateAndCategory .addDate{width:60%}.potsContainer .modalOverlay .modal .newAmount{align-items:center;display:flex;flex-direction:row;justify-content:space-between;margin:14px 0;width:100%}.potsContainer .modalOverlay .modal .newAmount span{font-size:14px;font-weight:400;letter-spacing:0;line-height:150%}.potsContainer .modalOverlay .modal .newAmount h2{text-align:right;width:50%}.potsContainer .modalOverlay .modal .addTarget,.potsContainer .modalOverlay .modal .amountContainer{position:relative;width:100%}.potsContainer .modalOverlay .modal .addTarget input,.potsContainer .modalOverlay .modal .amountContainer input{padding:12px 32px}.potsContainer .modalOverlay .modal .addTarget span:after,.potsContainer .modalOverlay .modal .amountContainer span:after{color:#696868;content:"$";font-size:14px;font-weight:400;left:16px;letter-spacing:0;line-height:150%;position:absolute;top:50%}.potsContainer .modalOverlay .modal>div{width:100%}.potsContainer .modalOverlay .modal .theme,.potsContainer .modalOverlay .modal label{color:#696868;cursor:pointer;display:block;font-size:12px;font-weight:700;letter-spacing:0;line-height:150%;margin-bottom:4px}.potsContainer .modalOverlay .modal input,.potsContainer .modalOverlay .modal select{border:1px solid #696868;border-radius:8px;outline:none;padding:12px 24px;width:100%}.potsContainer .modalOverlay .modal input[type=number]::-webkit-inner-spin-button,.potsContainer .modalOverlay .modal input[type=number]::-webkit-outer-spin-button,.potsContainer .modalOverlay .modal select[type=number]::-webkit-inner-spin-button,.potsContainer .modalOverlay .modal select[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.potsContainer .modalOverlay .modal button{border-radius:8px;color:#fff;cursor:pointer;font-size:14px;font-weight:700;height:53px;letter-spacing:0;line-height:150%;margin-top:13px;width:100%}.potsContainer .modalOverlay .modal .colorOptions .customSelect{position:relative}.potsContainer .modalOverlay .modal .colorOptions .customSelect.closed{display:none}.potsContainer .modalOverlay .modal .colorOptions .customSelect.open{display:block}.potsContainer .modalOverlay .modal .colorOptions .selectedColor{border:1px solid #696868;border-radius:8px;color:#201f24;cursor:pointer;font-size:14px;font-weight:400;letter-spacing:0;line-height:150%;padding:12px 24px}.potsContainer .modalOverlay .modal .colorOptions .colorAndName{align-items:center;display:flex;flex-direction:row;justify-content:flex-start}.potsContainer .modalOverlay .modal .colorOptions .options{background-color:#fff;border:1px solid #ccc;border-radius:8px;left:0;max-height:0;opacity:0;overflow-y:auto;position:absolute;right:0;top:80px;transition:max-height .3s ease-out,opacity .3s ease-out;z-index:1}.potsContainer .modalOverlay .modal .colorOptions .options.open{max-height:200px;opacity:1;overflow-y:auto}.potsContainer .modalOverlay .modal .colorOptions .options .option{border-bottom:1px solid #f2f2f2;color:#201f24;font-size:14px;font-weight:400;letter-spacing:0;line-height:150%;padding:12px 20px;transition:background-color .2s}.potsContainer .modalOverlay .modal .colorOptions .options .option,.potsContainer .modalOverlay .modal .colorOptions .options .option .colorAndName{align-items:center;display:flex;flex-direction:row;justify-content:space-between}.potsContainer .dropDownContainer{display:inline-block;position:relative}.potsContainer .dropDownContainer>button{cursor:pointer}.potsContainer .dropDownContainer .dropdownMenu{animation:dropdownAnimation .5s ease;background-color:#fff;border:1px solid #ccc;border-radius:8px;box-shadow:0 4px 8px #0003;min-width:125px;padding:0 20px;position:absolute;right:0;top:80%;z-index:10}.potsContainer .dropDownContainer .dropdownMenu button{background:none;border:none;border-radius:8px;cursor:pointer;display:block;font-size:14px;font-weight:400;letter-spacing:0;line-height:150%;padding:14px 0;text-align:left;width:100%}.potsContainer .dropDownContainer .dropdownMenu button:first-child{border-bottom:1px solid #f2f2f2;color:#201f24}.potsContainer .dropDownContainer .dropdownMenu button:nth-child(2){color:#c94736}@keyframes dropdownAnimation{0%{opacity:0;transform:translateY(-10%)}to{opacity:1;transform:translateY(0)}}.progressBar{background-color:#f8f4f0;border-radius:4px;height:8px;margin:0 auto;width:100%}.progressBar--current{background-color:#201f24;border-radius:4px;height:8px}.progressBar--future{border-radius:0 4px 4px 0;height:8px;margin-left:3px}.progressBar>div{align-items:stretch;display:flex;flex-direction:row;justify-content:flex-start}.progressBar>div .openModal{border-radius:4px 0 0 4px}.progressBarContainer{align-items:center;display:flex;flex-direction:column;width:100%}.progressBarContainer span{font-size:14px;margin-top:5px;overflow:hidden;text-align:center;text-overflow:ellipsis;white-space:nowrap;width:100%}.progressBarContainer .targetAndAmount{align-items:center;display:flex;flex-direction:row;justify-content:flex-start;margin-top:13px;width:100%}.progressBarContainer .targetAndAmount span:first-child{color:#696868;font-size:12px;font-weight:700;letter-spacing:0;line-height:150%;text-align:left}.progressBarContainer .targetAndAmount span:nth-child(2){color:#696868;font-size:12px;font-weight:400;letter-spacing:0;line-height:150%;text-align:right}.transactionContainer{background-color:#f8f4f0}@media(max-width:1000px){.transactionContainer{margin-bottom:4rem}}@media(max-width:600px){.transactionContainer{margin-bottom:2rem}}.transactionContainer .modalOverlay{align-items:center;background-color:#00000080;display:flex;flex-direction:row;height:100%;justify-content:center;left:0;opacity:0;pointer-events:none;position:fixed;top:0;transition:opacity .6s ease;width:100%;z-index:999}.transactionContainer .modalOverlay.open,.transactionContainer .modalOverlay.opening{opacity:1;pointer-events:auto}.transactionContainer .modalOverlay.closing{opacity:0;pointer-events:none}.transactionContainer .modalOverlay .modal{align-items:center;background-color:#fff;border-radius:8px;box-shadow:0 4px 15px #0003;display:flex;flex-direction:column;gap:.45rem;margin-top:2%;max-width:400px;min-width:580px;opacity:0;padding:2rem;width:100%;z-index:1000}@media(max-width:1000px){.transactionContainer .modalOverlay .modal{max-width:100%;min-width:100%}}@media(max-width:600px){.transactionContainer .modalOverlay .modal{overflow-y:auto;transform:scale(.75)!important}}.transactionContainer .modalOverlay .modal.open,.transactionContainer .modalOverlay .modal.opening{opacity:1;transform:scale(.85);transition:opacity .4s ease,transform .4s ease}.transactionContainer .modalOverlay .modal.closing{opacity:0;transform:scale(.6)}.transactionContainer .modalOverlay .modal .modalHeader{align-items:stretch;display:flex;flex-direction:row;justify-content:flex-start}.transactionContainer .modalOverlay .modal .modalHeader img{cursor:pointer}.transactionContainer .modalOverlay .modal h2{font-size:32px;font-weight:700;letter-spacing:0;line-height:120%;text-align:left;width:100%}.transactionContainer .modalOverlay .modal .addItemName>div,.transactionContainer .modalOverlay .modal p{color:#696868;font-size:14px;font-weight:400;letter-spacing:0;line-height:150%}.transactionContainer .modalOverlay .modal .addItemName{align-items:stretch;display:flex;flex-direction:column;justify-content:flex-start}.transactionContainer .modalOverlay .modal .addItemName>div{align-self:flex-end;margin-top:4px}.transactionContainer .modalOverlay .modal .transactionButton{background-color:#201f24;border:none;color:#fff;cursor:pointer;font-size:12px;height:51px;transition:background-color .3s,color .3s;width:14%}.transactionContainer .modalOverlay .modal .transactionButton:hover{background-color:#e6e6e6}.transactionContainer .modalOverlay .modal .transactionButton.active{background-color:#4caf50;border-color:#4caf50;color:#fff}.transactionContainer .modalOverlay .modal .transactionButton.active.send{background-color:#f44336;border-color:#f44336}.transactionContainer .modalOverlay .modal .addAmount .amountInputWrapper{align-items:center;background-color:#f9f9f9;display:flex;flex-direction:row;justify-content:space-between;position:relative}.transactionContainer .modalOverlay .modal .addAmount .amountInputWrapper input{padding-left:16%}.transactionContainer .modalOverlay .modal .addAmount .amountInputWrapper .receiveBtn{border-radius:8px 0 0 8px;left:0;margin:0;position:absolute;top:0}.transactionContainer .modalOverlay .modal .addAmount .amountInputWrapper .sentBtn{border-radius:0 8px 8px 0;margin:0;position:absolute;right:0;top:0}.transactionContainer .modalOverlay .modal .dateAndCategory{align-items:center;display:flex;flex-direction:row;justify-content:space-between}.transactionContainer .modalOverlay .modal .dateAndCategory input{padding:9px 24px}.transactionContainer .modalOverlay .modal .dateAndCategory .colorOptions{width:35%}.transactionContainer .modalOverlay .modal .dateAndCategory .addDate{width:60%}.transactionContainer .modalOverlay .modal .newAmount{align-items:center;display:flex;flex-direction:row;justify-content:space-between;margin:14px 0;width:100%}.transactionContainer .modalOverlay .modal .newAmount span{font-size:14px;font-weight:400;letter-spacing:0;line-height:150%}.transactionContainer .modalOverlay .modal .newAmount h2{text-align:right;width:50%}.transactionContainer .modalOverlay .modal .addTarget,.transactionContainer .modalOverlay .modal .amountContainer{position:relative;width:100%}.transactionContainer .modalOverlay .modal .addTarget input,.transactionContainer .modalOverlay .modal .amountContainer input{padding:12px 32px}.transactionContainer .modalOverlay .modal .addTarget span:after,.transactionContainer .modalOverlay .modal .amountContainer span:after{color:#696868;content:"$";font-size:14px;font-weight:400;left:16px;letter-spacing:0;line-height:150%;position:absolute;top:50%}.transactionContainer .modalOverlay .modal>div{width:100%}.transactionContainer .modalOverlay .modal .theme,.transactionContainer .modalOverlay .modal label{color:#696868;cursor:pointer;display:block;font-size:12px;font-weight:700;letter-spacing:0;line-height:150%;margin-bottom:4px}.transactionContainer .modalOverlay .modal input,.transactionContainer .modalOverlay .modal select{border:1px solid #696868;border-radius:8px;outline:none;padding:12px 24px;width:100%}.transactionContainer .modalOverlay .modal input[type=number]::-webkit-inner-spin-button,.transactionContainer .modalOverlay .modal input[type=number]::-webkit-outer-spin-button,.transactionContainer .modalOverlay .modal select[type=number]::-webkit-inner-spin-button,.transactionContainer .modalOverlay .modal select[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.transactionContainer .modalOverlay .modal button{border-radius:8px;color:#fff;cursor:pointer;font-size:14px;font-weight:700;height:53px;letter-spacing:0;line-height:150%;margin-top:13px;width:100%}.transactionContainer .modalOverlay .modal .colorOptions .customSelect{position:relative}.transactionContainer .modalOverlay .modal .colorOptions .customSelect.closed{display:none}.transactionContainer .modalOverlay .modal .colorOptions .customSelect.open{display:block}.transactionContainer .modalOverlay .modal .colorOptions .selectedColor{border:1px solid #696868;border-radius:8px;color:#201f24;cursor:pointer;font-size:14px;font-weight:400;letter-spacing:0;line-height:150%;padding:12px 24px}.transactionContainer .modalOverlay .modal .colorOptions .colorAndName{align-items:center;display:flex;flex-direction:row;justify-content:flex-start}.transactionContainer .modalOverlay .modal .colorOptions .options{background-color:#fff;border:1px solid #ccc;border-radius:8px;left:0;max-height:0;opacity:0;overflow-y:auto;position:absolute;right:0;top:80px;transition:max-height .3s ease-out,opacity .3s ease-out;z-index:1}.transactionContainer .modalOverlay .modal .colorOptions .options.open{max-height:200px;opacity:1;overflow-y:auto}.transactionContainer .modalOverlay .modal .colorOptions .options .option{border-bottom:1px solid #f2f2f2;color:#201f24;font-size:14px;font-weight:400;letter-spacing:0;line-height:150%;padding:12px 20px;transition:background-color .2s}.transactionContainer .modalOverlay .modal .colorOptions .options .option,.transactionContainer .modalOverlay .modal .colorOptions .options .option .colorAndName{align-items:center;display:flex;flex-direction:row;justify-content:space-between}.transactionContainer .modalOverlay .modal .categorySpan{display:none!important}.transactionContainer .modalOverlay .modal>p{text-align:left;width:100%}.transactionContainer h1{color:#201f24}@media(max-width:600px){.transactionContainer h1{margin-top:2rem}}.transactionContainer .transactionHeader{align-items:stretch;display:flex;flex-direction:row;justify-content:space-between}@media(max-width:600px){.transactionContainer .transactionHeader{justify-content:flex-end}}.transactionContainer .transactionHeader h1{color:#201f24;font-size:32px;font-weight:700;letter-spacing:0;line-height:120%}.transactionContainer .transactionHeader button{font-size:14px;font-weight:700;letter-spacing:0;line-height:150%;width:155px}.transactionContainer .transactions{background-color:#fff;border-radius:12px;margin-top:32px;padding:32px}@media(max-width:1000px){.transactionContainer .transactions{padding:32px 20px}}@media(max-width:600px){.transactionContainer .transactions{padding:24px 14px}}.transactionContainer .transactions .searchAndFilters{align-items:center;display:flex;flex-direction:row;justify-content:space-between}.transactionContainer .transactions .searchAndFilters .search{width:40%}@media(max-width:1000px){.transactionContainer .transactions .searchAndFilters .search{width:25%}}@media(max-width:600px){.transactionContainer .transactions .searchAndFilters .search{width:80%}}.transactionContainer .transactions .searchAndFilters .filters{align-items:stretch;display:flex;flex-direction:row;justify-content:flex-end;width:60%}@media(max-width:1000px){.transactionContainer .transactions .searchAndFilters .filters{width:80%}}.transactionContainer .transactions .searchAndFilters .filters .filterSelect{align-items:center;display:flex;flex-direction:row;justify-content:flex-start}.transactionContainer .transactions .searchAndFilters .filters .filterSelect label{color:#696868;font-size:14px;font-weight:400;letter-spacing:0;line-height:150%;margin-right:8px}.transactionContainer .transactions .searchAndFilters .filters>div:first-child{margin-right:24px}@media(max-width:1000px){.transactionContainer .transactions .searchAndFilters .filters>div:first-child{margin-right:16px}}.transactionContainer .transactions .details ul li{align-items:center;border-bottom:1px solid #f2f2f2;display:flex;flex-direction:row;justify-content:space-between;padding:16px;position:relative}@media(max-width:600px){.transactionContainer .transactions .details ul li{padding:12px 0}}.transactionContainer .transactions .details ul li .nameAndImg{align-items:center;cursor:pointer;display:flex;flex-direction:row;justify-content:flex-start;text-align:left;width:40%}.transactionContainer .transactions .details ul li .nameAndImg h3{color:#201f24;font-size:14px;font-weight:700;letter-spacing:0;line-height:150%;margin-left:12px}.transactionContainer .transactions .details ul li .nameAndImg h3:first-child{margin-left:0}.transactionContainer .transactions .details ul li .nameAndImg .transactionAvatarColor{border-radius:50%;height:32px;opacity:.9;width:32px}.transactionContainer .transactions .details ul li .nameAndImg .nameAndCategoryMobile .category,.transactionContainer .transactions .details ul li .nameAndImg .nameAndCategoryMobile h3{margin-left:12px;width:100%}.transactionContainer .transactions .details ul li .nameAndImg img{border-radius:50%;height:40px;width:40px}@media(max-width:600px){.transactionContainer .transactions .details ul li .nameAndImg{width:70%}}.transactionContainer .transactions .details ul li .dropDownTransaction{display:inline-block;left:75px;position:absolute!important;position:relative;top:25px;z-index:1}.transactionContainer .transactions .details ul li .dropDownTransaction>button{cursor:pointer}.transactionContainer .transactions .details ul li .dropDownTransaction button{background-color:inherit;border:none}.transactionContainer .transactions .details ul li .dropDownTransaction .dropdownMenu{animation:dropdownAnimation .5s ease;background-color:#fff;border:1px solid #ccc;border-radius:8px;box-shadow:0 4px 8px #0003;left:0;min-width:125px;min-width:140px;padding:0 20px;position:absolute;right:0;right:auto;top:80%;top:25px;z-index:10}.transactionContainer .transactions .details ul li .dropDownTransaction .dropdownMenu button{background:none;border:none;border-radius:8px;cursor:pointer;display:block;font-size:14px;font-weight:400;letter-spacing:0;line-height:150%;padding:14px 0;text-align:left;width:100%}.transactionContainer .transactions .details ul li .dropDownTransaction .dropdownMenu button:first-child{border-bottom:1px solid #f2f2f2;color:#201f24}.transactionContainer .transactions .details ul li .dropDownTransaction .dropdownMenu button:nth-child(2){color:#c94736}.transactionContainer .transactions .details ul li .dateAndAmountMobile{align-items:stretch;display:flex;flex-direction:column;justify-content:flex-end}.transactionContainer .transactions .details ul li .dateAndAmountMobile .amount,.transactionContainer .transactions .details ul li .dateAndAmountMobile .date{text-align:right;width:100%}.transactionContainer .transactions .details ul li .category,.transactionContainer .transactions .details ul li .date{align-items:stretch;color:#696868;display:flex;flex-direction:row;font-size:12px;font-weight:400;justify-content:space-between;letter-spacing:0;line-height:150%;text-align:left;width:15%}.transactionContainer .transactions .details ul li .amount{font-size:14px;font-weight:700;letter-spacing:0;line-height:150%;text-align:right;width:20%}.transactionContainer .transactions .details ul li .amount.positive{color:#277c78}.transactionContainer .transactions .details ul li .amount.negative{color:#201f24}.transactionContainer .transactions .details ul li:first-child{margin:24px 0}.transactionContainer .transactions .details ul li:first-child .nameAndImg h3{color:#696868;font-size:12px;font-weight:400;letter-spacing:0;line-height:150%}@media(max-width:600px){.transactionContainer .transactions .details ul li:first-child .nameAndImg h3{color:#201f24;font-size:14px;font-weight:700;letter-spacing:0;line-height:150%}}.transactionContainer .transactions .details ul li:first-child .amount{color:#696868;font-size:12px;font-weight:400;letter-spacing:0;line-height:150%}@media(max-width:600px){.transactionContainer .transactions .details ul li:first-child .amount{font-size:14px;font-weight:700;letter-spacing:0;line-height:150%}.transactionContainer .transactions .details ul li:first-child .amount.negative{color:#201f24}.transactionContainer .transactions .details ul li:first-child .amount.positive{color:#277c78}}.searchContainer{position:relative}.searchContainer input{border:1px solid #696868;border-radius:8px;color:#201f24;font-size:14px;font-weight:400;letter-spacing:0;line-height:150%;outline:none;padding:12px 20px;width:100%}@media(max-width:1000px){.searchContainer input{padding:12px 8px}}.searchContainer img{height:16px;position:absolute;right:20px;top:50%;transform:translateY(-50%);width:16px}.selectWrapper{align-items:center;border:1px solid #98908b;border-radius:8px;cursor:pointer;display:flex;flex-direction:row;justify-content:flex-start;padding:12px 20px;position:relative;width:100%}@media(max-width:1000px){.selectWrapper{padding:12px 8px}}@media(max-width:600px){.selectWrapper{border:0 solid #98908b}}.selectWrapper>span{color:#201f24;font-weight:400;margin-right:16px}.selectWrapper .selected,.selectWrapper>span{font-size:14px;letter-spacing:0;line-height:150%}.selectWrapper .selected{font-weight:700}.selectWrapper .dropdownOptions{animation:fadeIn .3s ease forwards;background-color:#fff;border-radius:8px;box-shadow:0 2px 8px #00000026;box-shadow:0 5px 15px #00000059;color:#201f24;font-size:14px;font-weight:400;left:0;letter-spacing:0;line-height:150%;max-height:250px;overflow-y:auto;position:absolute;right:0;scrollbar-width:none;top:120%;z-index:1}@media(max-width:600px){.selectWrapper .dropdownOptions{width:-webkit-max-content;width:max-content}.selectWrapper .dropdownOptions.default{left:-90px}}.selectWrapper .dropdownOptions::-webkit-scrollbar{display:none}.selectWrapper .dropdownOptions.open{max-height:300px}.selectWrapper .dropdownOptions .dropdownOption{cursor:pointer;padding:12px 16px}.selectWrapper .dropdownOptions .dropdownOption:hover{background-color:#f2f2f2}.selectWrapper img{height:16px;pointer-events:none;transition:transform .3s ease;width:16px}@media(max-width:600px){.selectWrapper img{height:20px;width:20px}}.selectWrapper img.rotate{transform:rotate(180deg)}@keyframes fadeIn{0%{opacity:0;transform:translateY(-10%)}to{opacity:1;transform:translateY(0)}}.pagination{align-items:center;display:flex;flex-direction:row;justify-content:space-between;margin-top:24px;padding-top:24px}.pagination button{cursor:pointer;justify-content:center}.pagination .prev button{align-items:center;display:flex;flex-direction:row-reverse;height:40px;justify-content:space-between}@media(max-width:600px){.pagination .prev button{height:35px;justify-content:center;width:40px}.pagination .prev button>span{display:none}}.pagination .prev button img{margin-right:16px;rotate:180deg}@media(max-width:600px){.pagination .prev button img{margin-left:0;margin-right:0}}.pagination .next button{align-items:center;display:flex;flex-direction:row;height:40px;justify-content:space-between;width:100px}@media(max-width:600px){.pagination .next button{height:35px;justify-content:center;width:40px}.pagination .next button>span{display:none}}.pagination .next button img{margin-left:16px}@media(max-width:600px){.pagination .next button img{margin-left:0}}.pagination button{border:1px solid #98908b;border-radius:8px;color:#201f24;font-size:14px;font-weight:400;letter-spacing:0;line-height:150%;padding:16px}.pagination .pages{align-items:stretch;display:flex;flex-direction:row;flex-wrap:wrap;justify-content:flex-start;justify-content:center}.pagination .pages button{height:40px;width:40px}@media(max-width:600px){.pagination .pages button{height:35px;width:35px}}.pagination .pages button img{display:none}.pagination .pages button:not(:first-child){margin-left:8px}@media(max-width:600px){.pagination .pages button:not(:first-child){margin-left:5px}}.pagination .pages button:hover{background-color:#696868;color:#fff}.pagination .pages .sm{width:20px}.pagination .active{background-color:#201f24;color:#fff}.billContainer{background-color:#f8f4f0}@media(max-width:1000px){.billContainer{margin-bottom:3rem}}.billContainer h1{color:#201f24}.billContainer .billContent{align-items:stretch;display:flex;flex-direction:row;justify-content:flex-start;margin-top:32px}@media(max-width:1000px){.billContainer .billContent{display:block}.billContainer .billContent .left{align-items:center;display:flex;flex-direction:row;justify-content:space-between;margin-bottom:24px}}@media(max-width:600px){.billContainer .billContent .left{display:block}}.billContainer .billContent .left .total{align-items:flex-start;background-color:#201f24;border-radius:12px;color:#fff;display:flex;flex-direction:column;justify-content:space-between;min-width:337px;padding:24px;width:100%}@media(max-width:1000px){.billContainer .billContent .left .total{min-height:204px;min-width:auto;width:49%}}@media(max-width:600px){.billContainer .billContent .left .total{align-items:center;display:flex;flex-direction:row;justify-content:flex-start;margin-bottom:16px;min-height:118px;width:100%}.billContainer .billContent .left .total img{width:40px}}@media(max-width:600px)and (max-width:600px){.billContainer .billContent .left .total>div{margin-left:20px;word-break:break-all}}.billContainer .billContent .left .total p{font-size:14px;font-weight:400;letter-spacing:0;line-height:150%;margin-bottom:11px;margin-top:32px}@media(max-width:600px){.billContainer .billContent .left .total p{margin-top:0}}.billContainer .billContent .left .total div{font-size:32px;font-weight:700;letter-spacing:0;line-height:120%}.billContainer .billContent .left .summary{align-items:flex-start;background-color:#fff;border-radius:12px;display:flex;flex-direction:column;justify-content:space-between;margin-top:24px;padding:20px;width:337px;width:100%}@media(max-width:1000px){.billContainer .billContent .left .summary{margin-top:0;min-height:204px;width:49%}}@media(max-width:600px){.billContainer .billContent .left .summary{width:100%}}.billContainer .billContent .left .summary>div{width:100%}.billContainer .billContent .left .summary h3{color:#201f24;font-size:16px;font-weight:700;letter-spacing:0;line-height:150%;margin-bottom:20px}.billContainer .billContent .left .summary .paid{padding-bottom:16px}.billContainer .billContent .left .summary .upcoming{padding:16px 0}.billContainer .billContent .left .summary .soon{padding-top:16px}.billContainer .billContent .left .summary .paid,.billContainer .billContent .left .summary .upcoming{border-bottom:1px solid #f2f2f2}.billContainer .billContent .left .summary .paid,.billContainer .billContent .left .summary .soon,.billContainer .billContent .left .summary .upcoming{align-items:stretch;color:#696868;display:flex;flex-direction:row;font-size:12px;font-weight:400;justify-content:space-between;letter-spacing:0;line-height:150%;width:100%}.billContainer .billContent .left .summary .paid span,.billContainer .billContent .left .summary .soon span,.billContainer .billContent .left .summary .upcoming span{color:#201f24;font-size:12px;font-weight:700;letter-spacing:0;line-height:150%}.billContainer .billContent .left .summary .soon,.billContainer .billContent .left .summary .soon span{color:#c94736}.billContainer .billContent .bills{background-color:#fff;border-radius:12px;color:#201f24;margin-left:24px;padding:32px;width:100%}@media(max-width:600px){.billContainer .billContent .bills{padding:32px 16px}}@media(max-width:1000px){.billContainer .billContent .bills{margin-left:0}}.billContainer .billContent .bills .searchFilter{align-items:center;display:flex;flex-direction:row;justify-content:space-between}.billContainer .billContent .bills .searchFilter .searchContainer{width:40%}@media(max-width:1000px){.billContainer .billContent .bills .searchFilter .searchContainer{width:60%}}@media(max-width:600px){.billContainer .billContent .bills .searchFilter .searchContainer{width:70%}}.billContainer .billContent .bills .searchFilter .searchContainer input{width:100%}.billContainer .billContent .bills .searchFilter .filterSelect{align-items:center;display:flex;flex-direction:row;justify-content:flex-start}.billContainer .billContent .bills .searchFilter .filterSelect .selectWrapper{min-width:125px}@media(max-width:1000px){.billContainer .billContent .bills .searchFilter .filterSelect .selectWrapper{min-width:100px}}@media(max-width:600px){.billContainer .billContent .bills .searchFilter .filterSelect .selectWrapper{min-width:0}}.billContainer .billContent .bills .searchFilter .filterSelect label{margin-right:8px;width:100%}.billContainer .billContent .bills ul li{align-items:center;border-bottom:1px solid #f2f2f2;color:#201f24;display:flex;flex-direction:row;font-size:12px;font-weight:400;justify-content:space-between;letter-spacing:0;line-height:150%;padding:20px 16px}@media(max-width:600px){.billContainer .billContent .bills ul li{align-items:flex-end;display:flex;flex-direction:row;justify-content:space-between;padding:18px 12px}}.billContainer .billContent .bills ul li .nameAndImg{align-items:center;display:flex;flex-direction:row;font-size:14px;font-weight:700;justify-content:flex-start;letter-spacing:0;line-height:150%;width:50%}@media(max-width:600px){.billContainer .billContent .bills ul li .nameAndImg{font-size:12px;font-weight:700;letter-spacing:0;line-height:150%;width:100%}}.billContainer .billContent .bills ul li .nameAndImg .billAvatarColor,.billContainer .billContent .bills ul li .nameAndImg img{border-radius:50%;height:32px;margin-right:8px;width:32px}@media(max-width:600px){.billContainer .billContent .bills ul li .nameAndImg{display:block}.billContainer .billContent .bills ul li .nameAndImg>div{align-items:center;display:flex;flex-direction:row;justify-content:flex-start;width:100%}.billContainer .billContent .bills ul li .nameAndImg .date{margin-top:8px;width:100%}.billContainer .billContent .bills ul li .nameAndImg .date img{height:16px;width:16px}}.billContainer .billContent .bills ul li .date{align-items:center;display:flex;flex-direction:row;font-size:12px;font-weight:400;justify-content:flex-start;letter-spacing:0;line-height:150%;text-align:left;width:25%}.billContainer .billContent .bills ul li .date img{margin-left:8px}.billContainer .billContent .bills ul li .date.paid{color:#277c78}.billContainer .billContent .bills ul li .amount{color:#201f24;font-size:14px;font-weight:700;letter-spacing:0;line-height:150%;text-align:right;width:25%}.billContainer .billContent .bills ul li .amount.dueSoon{color:#c94736}.billContainer .billContent .bills ul li:nth-child(2){padding-top:0}@media(max-width:600px){.billContainer .billContent .bills ul li:nth-child(2){padding:18px 12px}}.billContainer .billContent .bills ul li:first-child{padding:0}@media(max-width:600px){.billContainer .billContent .bills ul li:first-child{margin-top:24px;padding:18px 12px}}.billContainer .billContent .bills ul .categories{margin:24px 0;padding:12px 16px!important}.billContainer .billContent .bills ul .categories .amount,.billContainer .billContent .bills ul .categories .date,.billContainer .billContent .bills ul .categories .nameAndImg{color:#696868;font-size:12px;font-weight:400;letter-spacing:0;line-height:150%}.budgetContainer{background-color:#f8f4f0}@media(max-width:1000px){.budgetContainer{margin-bottom:3rem}}.budgetContainer .modalOverlay{align-items:center;background-color:#00000080;display:flex;flex-direction:row;height:100%;justify-content:center;left:0;opacity:0;pointer-events:none;position:fixed;top:0;transition:opacity .6s ease;width:100%;z-index:999}.budgetContainer .modalOverlay.open,.budgetContainer .modalOverlay.opening{opacity:1;pointer-events:auto}.budgetContainer .modalOverlay.closing{opacity:0;pointer-events:none}.budgetContainer .modalOverlay .modal{align-items:center;background-color:#fff;border-radius:8px;box-shadow:0 4px 15px #0003;display:flex;flex-direction:column;gap:.45rem;margin-top:2%;max-width:400px;min-width:580px;opacity:0;padding:2rem;width:100%;z-index:1000}@media(max-width:1000px){.budgetContainer .modalOverlay .modal{max-width:100%;min-width:100%}}@media(max-width:600px){.budgetContainer .modalOverlay .modal{overflow-y:auto;transform:scale(.75)!important}}.budgetContainer .modalOverlay .modal.open,.budgetContainer .modalOverlay .modal.opening{opacity:1;transform:scale(.85);transition:opacity .4s ease,transform .4s ease}.budgetContainer .modalOverlay .modal.closing{opacity:0;transform:scale(.6)}.budgetContainer .modalOverlay .modal .modalHeader{align-items:stretch;display:flex;flex-direction:row;justify-content:flex-start}.budgetContainer .modalOverlay .modal .modalHeader img{cursor:pointer}.budgetContainer .modalOverlay .modal h2{font-size:32px;font-weight:700;letter-spacing:0;line-height:120%;text-align:left;width:100%}.budgetContainer .modalOverlay .modal .addItemName>div,.budgetContainer .modalOverlay .modal p{color:#696868;font-size:14px;font-weight:400;letter-spacing:0;line-height:150%}.budgetContainer .modalOverlay .modal .addItemName{align-items:stretch;display:flex;flex-direction:column;justify-content:flex-start}.budgetContainer .modalOverlay .modal .addItemName>div{align-self:flex-end;margin-top:4px}.budgetContainer .modalOverlay .modal .transactionButton{background-color:#201f24;border:none;color:#fff;cursor:pointer;font-size:12px;height:51px;transition:background-color .3s,color .3s;width:14%}.budgetContainer .modalOverlay .modal .transactionButton:hover{background-color:#e6e6e6}.budgetContainer .modalOverlay .modal .transactionButton.active{background-color:#4caf50;border-color:#4caf50;color:#fff}.budgetContainer .modalOverlay .modal .transactionButton.active.send{background-color:#f44336;border-color:#f44336}.budgetContainer .modalOverlay .modal .addAmount .amountInputWrapper{align-items:center;background-color:#f9f9f9;display:flex;flex-direction:row;justify-content:space-between;position:relative}.budgetContainer .modalOverlay .modal .addAmount .amountInputWrapper input{padding-left:16%}.budgetContainer .modalOverlay .modal .addAmount .amountInputWrapper .receiveBtn{border-radius:8px 0 0 8px;left:0;margin:0;position:absolute;top:0}.budgetContainer .modalOverlay .modal .addAmount .amountInputWrapper .sentBtn{border-radius:0 8px 8px 0;margin:0;position:absolute;right:0;top:0}.budgetContainer .modalOverlay .modal .dateAndCategory{align-items:center;display:flex;flex-direction:row;justify-content:space-between}.budgetContainer .modalOverlay .modal .dateAndCategory input{padding:9px 24px}.budgetContainer .modalOverlay .modal .dateAndCategory .colorOptions{width:35%}.budgetContainer .modalOverlay .modal .dateAndCategory .addDate{width:60%}.budgetContainer .modalOverlay .modal .newAmount{align-items:center;display:flex;flex-direction:row;justify-content:space-between;margin:14px 0;width:100%}.budgetContainer .modalOverlay .modal .newAmount span{font-size:14px;font-weight:400;letter-spacing:0;line-height:150%}.budgetContainer .modalOverlay .modal .newAmount h2{text-align:right;width:50%}.budgetContainer .modalOverlay .modal .addTarget,.budgetContainer .modalOverlay .modal .amountContainer{position:relative;width:100%}.budgetContainer .modalOverlay .modal .addTarget input,.budgetContainer .modalOverlay .modal .amountContainer input{padding:12px 32px}.budgetContainer .modalOverlay .modal .addTarget span:after,.budgetContainer .modalOverlay .modal .amountContainer span:after{color:#696868;content:"$";font-size:14px;font-weight:400;left:16px;letter-spacing:0;line-height:150%;position:absolute;top:50%}.budgetContainer .modalOverlay .modal>div{width:100%}.budgetContainer .modalOverlay .modal .theme,.budgetContainer .modalOverlay .modal label{color:#696868;cursor:pointer;display:block;font-size:12px;font-weight:700;letter-spacing:0;line-height:150%;margin-bottom:4px}.budgetContainer .modalOverlay .modal input,.budgetContainer .modalOverlay .modal select{border:1px solid #696868;border-radius:8px;outline:none;padding:12px 24px;width:100%}.budgetContainer .modalOverlay .modal input[type=number]::-webkit-inner-spin-button,.budgetContainer .modalOverlay .modal input[type=number]::-webkit-outer-spin-button,.budgetContainer .modalOverlay .modal select[type=number]::-webkit-inner-spin-button,.budgetContainer .modalOverlay .modal select[type=number]::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.budgetContainer .modalOverlay .modal button{border-radius:8px;color:#fff;cursor:pointer;font-size:14px;font-weight:700;height:53px;letter-spacing:0;line-height:150%;margin-top:13px;width:100%}.budgetContainer .modalOverlay .modal .colorOptions .customSelect{position:relative}.budgetContainer .modalOverlay .modal .colorOptions .customSelect.closed{display:none}.budgetContainer .modalOverlay .modal .colorOptions .customSelect.open{display:block}.budgetContainer .modalOverlay .modal .colorOptions .selectedColor{border:1px solid #696868;border-radius:8px;color:#201f24;cursor:pointer;font-size:14px;font-weight:400;letter-spacing:0;line-height:150%;padding:12px 24px}.budgetContainer .modalOverlay .modal .colorOptions .colorAndName{align-items:center;display:flex;flex-direction:row;justify-content:flex-start}.budgetContainer .modalOverlay .modal .colorOptions .options{background-color:#fff;border:1px solid #ccc;border-radius:8px;left:0;max-height:0;opacity:0;overflow-y:auto;position:absolute;right:0;top:80px;transition:max-height .3s ease-out,opacity .3s ease-out;z-index:1}.budgetContainer .modalOverlay .modal .colorOptions .options.open{max-height:200px;opacity:1;overflow-y:auto}.budgetContainer .modalOverlay .modal .colorOptions .options .option{border-bottom:1px solid #f2f2f2;color:#201f24;font-size:14px;font-weight:400;letter-spacing:0;line-height:150%;padding:12px 20px;transition:background-color .2s}.budgetContainer .modalOverlay .modal .colorOptions .options .option,.budgetContainer .modalOverlay .modal .colorOptions .options .option .colorAndName{align-items:center;display:flex;flex-direction:row;justify-content:space-between}.budgetContainer .modalOverlay .modal .categorySpan{display:none!important}.budgetContainer .modalOverlay .modal>p{text-align:left;width:100%}.budgetContainer .dropDownContainer{display:inline-block;position:relative}.budgetContainer .dropDownContainer>button{cursor:pointer}.budgetContainer .dropDownContainer button{background-color:inherit;border:none}.budgetContainer .dropDownContainer .dropdownMenu{animation:dropdownAnimation .5s ease;background-color:#fff;border:1px solid #ccc;border-radius:8px;box-shadow:0 4px 8px #0003;min-width:125px;min-width:140px;padding:0 20px;position:absolute;right:0;top:80%;top:25px;z-index:10}.budgetContainer .dropDownContainer .dropdownMenu button{background:none;border:none;border-radius:8px;cursor:pointer;display:block;font-size:14px;font-weight:400;letter-spacing:0;line-height:150%;padding:14px 0;text-align:left;width:100%}.budgetContainer .dropDownContainer .dropdownMenu button:first-child{border-bottom:1px solid #f2f2f2;color:#201f24}.budgetContainer .dropDownContainer .dropdownMenu button:nth-child(2){color:#c94736}.budgetContainer .budgetHeader{align-items:center;display:flex;flex-direction:row;justify-content:space-between}.budgetContainer .budgetHeader h3{color:#201f24;font-size:32px;font-weight:700;letter-spacing:0;line-height:120%}.budgetContainer .budgetHeader h3>span{display:block;font-size:12px;font-weight:400;letter-spacing:0;line-height:150%}.budgetContainer .budgetHeader button{font-size:14px;font-weight:700;letter-spacing:0;line-height:150%;width:155px}.budgetContainer .budgetContent{align-items:flex-start;display:flex;flex-direction:row;justify-content:space-between;margin-top:32px}@media(max-width:1000px){.budgetContainer .budgetContent{display:block}}.budgetContainer .budgetContent .left{background-color:#fff;border-radius:12px;padding:28px;width:35%}@media(max-width:1000px){.budgetContainer .budgetContent .left{align-items:flex-start;display:flex;flex-direction:row;justify-content:space-between;margin-bottom:24px;padding:32px 24px;width:100%}}@media(max-width:600px){.budgetContainer .budgetContent .left{align-items:center;display:flex;flex-direction:column;justify-content:space-between}}.budgetContainer .budgetContent .left .pieChart{border-radius:50%;height:240px;margin:0 auto;outline:1px solid #ccc;position:relative;width:240px}.budgetContainer .budgetContent .left .pieChart p{color:#696868;font-size:12px;font-weight:400;left:50%;letter-spacing:0;line-height:150%;position:absolute;top:50%;transform:translate(-50%,-50%)}.budgetContainer .budgetContent .left .pieChart p span{color:#201f24;display:block;font-size:32px;font-weight:700;letter-spacing:0;line-height:120%;margin-bottom:8px;text-align:center}@media(max-width:1000px){.budgetContainer .budgetContent .left .pieChart{margin:0}}.budgetContainer .budgetContent .left .budgetSummaryInfo{margin-top:32px}@media(max-width:1000px){.budgetContainer .budgetContent .left .budgetSummaryInfo{width:50%}}@media(max-width:600px){.budgetContainer .budgetContent .left .budgetSummaryInfo{width:100%}}.budgetContainer .budgetContent .left .budgetSummaryInfo h3{color:#201f24;font-size:20px;font-weight:700;letter-spacing:0;line-height:120%;margin-bottom:24px}.budgetContainer .budgetContent .left .budgetSummaryInfo .budgetSummaryInfoContent{align-items:center;border-left:4px solid;display:flex;flex-direction:row;justify-content:space-between;margin:16px 0}.budgetContainer .budgetContent .left .budgetSummaryInfo .budgetSummaryInfoContent .name{color:#696868;font-size:14px;font-weight:400;letter-spacing:0;line-height:150%;padding-left:16px}.budgetContainer .budgetContent .left .budgetSummaryInfo .budgetSummaryInfoContent .amounts{font-size:12px;font-weight:400;letter-spacing:0;line-height:150%}.budgetContainer .budgetContent .left .budgetSummaryInfo .budgetSummaryInfoContent .amounts span{color:#201f24;font-size:16px;font-weight:700;letter-spacing:0;line-height:150%}.budgetContainer .budgetContent .left .budgetSummaryInfo .budgetSummaryInfoContent:first-child{margin-top:0}.budgetContainer .budgetContent .left .budgetSummaryInfo .budgetSummaryInfoContent:last-child{margin-bottom:0}.budgetContainer .budgetContent .right{width:60%}@media(max-width:1000px){.budgetContainer .budgetContent .right{width:100%}}.budgetContainer .budgetContent .right .categoryTransactions{background-color:#fff;border-radius:12px;margin-bottom:24px;padding:32px}@media(max-width:600px){.budgetContainer .budgetContent .right .categoryTransactions{padding:32px 20px}}.budgetContainer .budgetContent .right .categoryTransactions .categoryHeader{align-items:center;color:#201f24;display:flex;flex-direction:row;font-size:20px;font-weight:700;justify-content:space-between;letter-spacing:0;line-height:120%}.budgetContainer .budgetContent .right .categoryTransactions .categoryHeader .nameAndColor{align-items:center;display:flex;flex-direction:row;justify-content:flex-start}.budgetContainer .budgetContent .right .categoryTransactions .categoryHeader .nameAndColor>div{border-radius:50%;height:16px;margin-right:16px;width:16px}.budgetContainer .budgetContent .right .categoryTransactions .categorySpent{margin:16px 0}.budgetContainer .budgetContent .right .categoryTransactions .categorySpent .max{color:#696868;font-size:14px;font-weight:400;letter-spacing:0;line-height:150%}.budgetContainer .budgetContent .right .categoryTransactions .categorySpent .line{align-items:stretch;background-color:#f8f4f0;border-radius:4px;display:flex;flex-direction:row;height:32px;justify-content:flex-start;margin:16px 0;width:100%}.budgetContainer .budgetContent .right .categoryTransactions .categorySpent .line>div{align-self:center;border-radius:4px;height:24px;margin-left:4px}.budgetContainer .budgetContent .right .categoryTransactions .categorySpent .spentAndRemain{align-items:center;display:flex;flex-direction:row;justify-content:space-between}.budgetContainer .budgetContent .right .categoryTransactions .categorySpent .spentAndRemain .remain,.budgetContainer .budgetContent .right .categoryTransactions .categorySpent .spentAndRemain .spent{align-items:stretch;display:flex;flex-direction:row;justify-content:flex-start;width:100%}.budgetContainer .budgetContent .right .categoryTransactions .categorySpent .spentAndRemain .remain .theme,.budgetContainer .budgetContent .right .categoryTransactions .categorySpent .spentAndRemain .spent .theme{border-left:4px solid;border-radius:8px;margin-right:16px}.budgetContainer .budgetContent .right .categoryTransactions .categorySpent .spentAndRemain .remain .title,.budgetContainer .budgetContent .right .categoryTransactions .categorySpent .spentAndRemain .spent .title{color:#696868;font-size:12px;font-weight:400;letter-spacing:0;line-height:150%;margin-bottom:4px}.budgetContainer .budgetContent .right .categoryTransactions .categorySpent .spentAndRemain .remain .amount,.budgetContainer .budgetContent .right .categoryTransactions .categorySpent .spentAndRemain .spent .amount{color:#201f24;font-size:14px;font-weight:700;letter-spacing:0;line-height:150%}.budgetContainer .budgetContent .right .categoryTransactions .categorySpent .spentAndRemain .remain .themeRemain{border-left:4px solid #f8f4f0;border-radius:8px;margin-right:16px}.budgetContainer .budgetContent .right .transactionList{background-color:#f8f4f0;border-radius:20px;margin-top:20px;padding:20px}.budgetContainer .budgetContent .right .transactionList .listHeader{align-items:stretch;display:flex;flex-direction:row;justify-content:space-between;margin-bottom:12px}.budgetContainer .budgetContent .right .transactionList .listHeader h4{color:#201f24;font-size:16px;font-weight:700;letter-spacing:0;line-height:150%}.budgetContainer .budgetContent .right .transactionList .listHeader button{justify-content:flex-end}.budgetContainer .budgetContent .right .transactionList .transactionItem{padding:12px 0}.budgetContainer .budgetContent .right .transactionList .transactionItem .transactionInfo{align-items:stretch;display:flex;flex-direction:row;justify-content:space-between}.budgetContainer .budgetContent .right .transactionList .transactionItem .transactionInfo .nameAndPic{align-items:center;display:flex;flex-direction:row;justify-content:flex-start}.budgetContainer .budgetContent .right .transactionList .transactionItem .transactionInfo .nameAndPic .transactionAvatarColor,.budgetContainer .budgetContent .right .transactionList .transactionItem .transactionInfo .nameAndPic img{border-radius:50%;height:32px;width:32px}@media(max-width:600px){.budgetContainer .budgetContent .right .transactionList .transactionItem .transactionInfo .nameAndPic .transactionAvatarColor,.budgetContainer .budgetContent .right .transactionList .transactionItem .transactionInfo .nameAndPic img{display:none}}.budgetContainer .budgetContent .right .transactionList .transactionItem .transactionInfo .nameAndPic .transactionAvatarColor{opacity:.8}.budgetContainer .budgetContent .right .transactionList .transactionItem .transactionInfo .nameAndPic p{color:#201f24;font-size:12px;font-weight:700;letter-spacing:0;line-height:150%;margin-left:16px}@media(max-width:600px){.budgetContainer .budgetContent .right .transactionList .transactionItem .transactionInfo .nameAndPic p{margin-left:0;text-align:left}}.budgetContainer .budgetContent .right .transactionList .transactionItem .transactionInfo .dateAndAmount{align-items:flex-end;display:flex;flex-direction:column;justify-content:flex-start}.budgetContainer .budgetContent .right .transactionList .transactionItem .transactionInfo .dateAndAmount span:first-child{color:#201f24;font-size:12px;font-weight:700;letter-spacing:0;line-height:150%}.budgetContainer .budgetContent .right .transactionList .transactionItem .transactionInfo .dateAndAmount span:last-child{color:#696868;font-size:12px;font-weight:400;letter-spacing:0;line-height:150%}.budgetContainer .pie-chart h2{font-size:1.2rem;font-weight:700;left:1rem;position:absolute;top:1rem}.budgetContainer .pie-chart figcaption{bottom:1rem;font-size:.9rem;position:absolute;right:1rem;text-align:right}.budgetContainer .pie-chart figcaption div{margin-bottom:.5rem}.budgetContainer .pie-chart cite{bottom:0;color:gray;font-size:.8rem;left:1rem;position:absolute}
/*# sourceMappingURL=main.18822636.css.map*/