@import"https://fonts.googleapis.com/css2?family=Nunito:wght@400;500;600;700;800&display=swap";html,body,div,span,h1,h2,h3,h4,h5,h6,p,a,img,ol,ul,li,form,label,table,caption,article,aside,figure,figcaption,footer,header,menu,nav,output{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline}button{cursor:pointer}.main{width:100vw;height:100vh;background-color:var(--color-grey-4);display:flex;align-items:center;justify-content:center;gap:48px}.leftCol{display:flex;flex-direction:column;gap:28px;width:347px}.leftCol img{width:122px}.leftCol h1{font-size:var(--title-1);font-weight:var(--weigth-0);line-height:126%;color:#fff}.spanLP{font-size:var(--title-3);font-weight:var(--weigth-4);color:#fff}.btnLP{padding:13px 20px;height:48px;background-color:var(--color-primary);border:2px solid var(--color-primary);border-radius:var(--radius-2);font-size:var(--title-3);font-weight:var(--weigth-3);color:#fff}.form{display:flex;flex-direction:column;gap:17px;border:1px solid var(--color-grey-2);border-radius:var(--radius-1);padding:38px 24px}.topForm{display:flex;flex-direction:column;align-items:flex-start}label{font-size:var(--title-4);font-weight:var(--weigth-2);color:var(--color-grey-4)}.topForm>input{margin-top:12px;height:22px;width:94%;padding:13px 16px;background-color:var(--color-grey-2);border-radius:var(--radius-1);border:none;font-size:var(--title-3);font-weight:var(--weigth-4);color:var(--color-grey-4)}input::placeholder{font-size:var(--title-3);font-weight:var(--weigth-4);color:var(--color-grey-3)}span{font-size:var(--title-4);font-weight:var(--weigth-2);color:var(--color-grey-3)}.midForm{display:flex;align-items:center;justify-content:space-between}.divValue>input{height:22px;width:100%;padding:13px 16px;background-color:var(--color-grey-2);border-radius:var(--radius-1);border:none;font-size:var(--title-3);font-weight:var(--weigth-4);color:var(--color-grey-4)}.divValue,.divValueType{display:flex;flex-direction:column;align-items:flex-start;width:45%;gap:10px}.divValueType>label{line-height:20px}#select{height:48px;width:100%;padding:13px 16px;background-color:var(--color-grey-2);border-radius:var(--radius-1);border:none;color:var(--color-grey-4);font-size:var(--title-3)}#select>option{height:48px;padding:13px 16px;background-color:var(--color-grey-2)}.primaryBtn{height:48px;padding:13px 20px;background-color:var(--color-primary);font-size:var(--title-3);font-weight:var(--weigth-4);color:var(--color-grey-1);border:2px solid var(--color-primary);border-radius:var(--radius-2)}.primaryBtn:hover{background-color:var(--color-primary2)}.header{height:88px;display:flex;box-shadow:3px -1px 15px 3px #00000038}.header button{height:40px;padding:15px;display:flex;align-items:center;background-color:var(--color-grey-2);border:1px solid var(--color-grey-2);border-radius:var(--radius-2);color:var(--color-grey-4);font-weight:var(--weigth-1)}.header button:hover{background-color:var(--color-grey-4);color:var(--color-grey-1)}.header button:focus{background-color:var(--color-primary);border:1.4px solid var(--color-primary);color:var(--color-grey-1)}.divTotal{margin-top:1rem;padding:20px 24px;border:1px solid var(--color-grey-2);border-radius:var(--radius1)}.divTotal>div{display:flex;justify-content:space-between}.divTotal>div h3{font-size:var(--title-3);font-weight:var(--weigth-1);color:var(--color-grey-4)}.divTotal>div p{font-size:var(--title-3);font-weight:var(--weigth-1);color:var(--color-primary)}.valueList{margin-top:2rem;display:flex;flex-direction:column;gap:2rem;width:60%}.listHeader{display:flex;justify-content:space-between;align-items:center}.listHeader>h3{font-size:var(--title-3);font-weight:var(--weigth-1);color:var(--color-grey-4)}.catFilter{display:flex;gap:16px}.catFilter button{display:flex;align-items:center;justify-content:center;height:40px;padding:15px;background-color:var(--color-grey-2);border:1.4px solid var(--color-grey-2);border-radius:var(--radius-2);font-size:.85rem;font-weight:var(--weigth-3);color:var(--color-grey-4)}.catFilter button:hover{background-color:var(--color-grey-4);color:var(--color-grey-1)}.catFilter button:focus{background-color:var(--color-primary);border:1.4px solid var(--color-primary);color:var(--color-grey-1)}.card{display:flex;flex-direction:column;padding:18px;position:relative;background-color:var(--color-grey-1);border-radius:var(--radius-1)}.card:hover{background-color:#fff;box-shadow:0 0 10px #00000024}.entry{border-left:4px solid var(--color-secondary)}.exit{border-left:4px solid var(--color-grey-3)}.trashBtn{position:absolute;top:18px;right:13px;width:22px;height:22px;border:none;border-radius:var(--radius-0);background-image:url(/assets/trash.e9d24087.svg);background-position:center;background-repeat:no-repeat;background-color:var(--color-grey-2)}.trashBtn:hover{background-image:url(/assets/trashW.525debd4.svg);background-color:var(--color-grey-4)}.divCard{display:flex}.divCard h3{font-size:var(--title-3);font-weight:var(--weigth-1);color:var(--color-grey-4)}.divCard p{font-size:var(--title-4);font-weight:var(--weigth-4);color:var(--color-grey-4);position:absolute;top:18px;right:102px}.valueType{font-size:var(--title-4);font-weight:var(--weigth-4);color:var(--color-grey-3)}.valueList h3{font-size:var(--title-2);font-weight:var(--weigth-1)}.valueList img{width:80%}:root{font-family:Nunito,sans-serif;font-size:16px;line-height:24px;color:#101010de;background-color:#fff;--color-primary: #fd377e;--color-primary2: #e34981;--color-secondary: #03b898;--color-grey-1: #f8f9fa;--color-grey-2: #e9ecef;--color-grey-3: #868e96;--color-grey-4: #212529;--title-1: 2.375rem ;--title-2: 1.375rem ;--title-3: 1rem ;--title-4: .75rem ;--weigth-0: 800;--weigth-1: 700;--weigth-2: 600;--weigth-3: 500;--weigth-4: 400;--radius-0: 2px;--radius-1: 4px;--radius-2: 8px}.container{margin:0 auto;width:80%;display:flex;justify-content:space-between;align-items:center}.mainBody{margin:40px auto;width:80%;display:flex;justify-content:space-between;gap:58px}.leftColMain{width:40%}@media (max-width: 850px){.rightCol{display:none}.mainBody{flex-direction:column;align-items:center}.leftColMain,.valueList{width:100%}}
