*,*::after,*::before{margin:0;padding:0;box-sizing:border-box}html{font-size:62.5%}@media only screen and (max-width: 26.5em){html{font-size:52.5%}}@media only screen and (min-width: 89em){html{font-size:70%}}body{font-family:"Roboto", sans-serif;font-weight:400;height:100vh;width:100vw;position:relative;background-color:#223fc9}.container{position:absolute;top:0;left:50%;transform:translate(-50%);display:flex;justify-content:center;align-items:center;flex-direction:column}.month{flex:1;color:white;text-align:center;padding:2.5rem;font-size:2.5rem;text-transform:uppercase}.card{flex:1;width:42rem;background-color:white;border-radius:1rem;box-shadow:0rem 0rem 1rem rgba(0,0,0,0.1);color:white;font-size:2rem;padding:2rem 2rem 0;text-align:center;align-items:center;display:flex;flex-wrap:wrap;justify-content:center;margin-bottom:4rem;color:black}@media only screen and (max-width: 26.5em){.card{width:34rem}}.card__text{flex:100%;align-self:flex-end;color:gray;font-size:1.4rem;text-transform:capitalize}.card__balance{flex:100%;align-self:flex-start;font-size:4rem;font-weight:700;display:flex;justify-content:space-evenly;align-items:center;margin-bottom:1.5rem}.card__statu{flex:1;border-top:1px solid #e4e4e4;padding:2rem;display:flex;font-size:1.5rem;margin-bottom:0.5rem}.card__income{flex:50%;display:flex;flex-wrap:wrap;justify-content:center;color:gray}.card__income--sign{height:2rem;margin-right:8px;color:darkgreen}.card__income--value{margin-top:4px;flex:100%;color:darkgreen;font-size:1.6rem}.card__expenses{flex:50%;display:flex;flex-wrap:wrap;justify-content:center;color:gray}.card__expenses--sign{height:2rem;color:darkred;margin-right:8px}.card__expenses--value{margin-top:4px;flex:100%;color:darkred;font-size:1.6rem}.popup{width:42rem;background-image:linear-gradient(111.4deg, #f1cb27 -.4%, #f18919 100.2%);box-shadow:0rem 0rem 1rem rgba(0,0,0,0.3);margin-top:-12rem;border-radius:1rem;flex-wrap:wrap;padding:10rem 2rem 2rem 2rem;align-items:center;justify-content:flex-start;display:flex;opacity:1;transition:all 0.3s ease;z-index:-10}@media only screen and (max-width: 26.5em){.popup{width:34rem}}.budget-switch{flex:100%;align-self:flex-start;display:flex;align-items:flex-start;margin-bottom:1.5rem}.budget-switch-input{display:none}.budget-switch-label{padding:1rem;font-size:1.3rem;color:white;margin-right:1rem;cursor:pointer;transition:all 0.2s}.budget-switch-input:checked+.budget-switch-label{color:#0b85ea;background:white;border-radius:4px}.budget-switch-input:not(:checked)+.budget-switch-label:hover{background:rgba(255,255,255,0.09);border-radius:4px}.error{margin-top:.5rem;color:darkred;width:48%;font-size:1.2rem}.error_desc{display:none}.error_val{display:none}.budget-input{padding:1.3rem 1rem;border-radius:5px;border:1px solid whitesmoke;background-color:white;font-size:1.3rem;margin-right:1rem}.budget-input:focus{border:1px solid #c7c7c7;outline:0}.budget-input-desc{width:45%}.budget-input-val{width:30%}.popup__btn{flex:1;padding:1.2rem 1rem;border:none;background-color:#0b85ea;border-radius:3px;font-size:1.4rem;color:white;transition:all 0.2s}.popup__btn:hover{background-color:#223fc9}.items__container{color:black;width:42rem;font-size:1.6rem;margin-top:2rem}@media only screen and (max-width: 26.5em){.items__container{width:34rem}}.items__container .day__items .day{grid-column:1/2;color:white;font-size:2.5rem;margin-bottom:1rem}.items__container .day__items .item{grid-column:2/3;box-shadow:0rem 0rem 1rem rgba(0,0,0,0.1);padding:2rem;margin-bottom:1.3rem;border-radius:1rem;display:flex;align-items:center;font-size:1.7rem;text-transform:capitalize;background-color:white;transition:all 0.2s ease}.items__container .day__items .item__img{height:3rem;margin-right:2rem}.items__container .day__items .item__desc{flex:1}.items__container .day__items .item:hover .item__delete{opacity:1;display:block}.items__container .day__items .item__val{transition:all 0.2s ease}.items__container .day__items .item:hover .item__val{transform:translate(-1rem)}.items__container .day__items .item__delete{width:2rem;display:none;transition:all 0.2s ease-in-out}.items__container .day__items .item__delete:hover{width:2.2rem}.copyright{color:white;font-size:1.6rem;text-transform:capitalize;padding:2rem;letter-spacing:0.1rem}.copyright a:visited,.copyright a:link{color:#f18919}