header{display:flex;justify-content:space-between;align-items:center;flex-direction:row;padding:1rem 2rem;background-color:#232d3f9e;border-radius:76px}.logo{width:30%;padding:0 2em}.logo img{width:100%}.main_menu{display:flex;gap:1rem}.menu_item{display:flex;align-items:center;gap:3px;font-size:16px;background-color:#133d6452;border-radius:20px;padding:.4rem 1.5rem;transition:all .4s;text-decoration:none}.menu_item:hover:not(.selected){cursor:pointer;padding-right:35px;background-color:#0d5c707e;border:transparent}.menu_item.selected{border:transparent;background-color:#0d5c707e}@media (max-width: 768px){.logo img{width:240px}.main_menu{gap:.7rem}.menu_item{font-size:12px;padding:.4rem 1rem}}@media (max-width: 425px){header{flex-direction:column;gap:.2rem;padding:.8rem;border-radius:38px}.logo img{width:180px}.main_menu{flex-direction:row;align-items:center;justify-content:space-between;gap:1rem}.menu_item{padding:.5rem 1rem}}@media (max-width: 375px){.menu_item{padding:.3rem;font-size:10px}}ul.vault-list{list-style-type:none}.vault-header{display:flex;align-items:baseline;justify-content:space-between}.vault-header_details{display:flex;flex-direction:column;align-items:baseline}.vault-header_actions{display:flex;gap:10px}.vault-header_actions button{display:inline-flex;align-items:center;width:fit-content;font-size:14px;gap:5px;padding:10px 20px}.icon{font-size:20px}.filter_container{display:flex;margin-top:1.5rem;width:100%}.filter_container input{width:30%;padding:.4rem .6rem;font-size:14px;border-bottom-right-radius:0!important;border-top-right-radius:0!important}.filter_container button{width:fit-content;display:inline-flex;align-items:center;gap:4px;border-top-left-radius:0;border-bottom-left-radius:0}.filter_container button span{font-size:14px}@media (max-width: 425px){.filter_container input{font-size:12px;width:100%}.filter_container button span{font-size:12px}}.vault-items{width:100%;margin:2rem auto;display:grid;grid-template-columns:repeat(3,minmax(200px,1fr));grid-gap:15px}@media only screen and (max-width: 1300px){.vault-items{grid-template-columns:repeat(2,minmax(200px,1fr));grid-gap:20px}}@media only screen and (max-width: 815px){.vault-items{grid-template-columns:repeat(1,minmax(200px,1fr))}}article.item{display:flex;flex-direction:column;align-items:flex-start;min-height:140px;justify-content:space-between;background-color:#00000031;padding:1.5rem;border-radius:20px}.item_header{display:flex;align-items:baseline;width:100%;height:fit-content;justify-content:space-between;margin-bottom:20px}.item_header-info{display:flex;width:70%;flex-direction:column;align-items:baseline;text-align:start}.item_header-info span{font-style:italic;font-size:14px}.item_header-actions{display:inline-flex;gap:5px;align-items:baseline}.item_header button{display:inline-flex;align-items:center;width:fit-content;height:fit-content;font-size:14px;padding:10px}.item_action{display:flex;flex-direction:row;width:100%;justify-content:space-around}.item_action input{min-width:65%;padding:10px}.item_action button{padding:.1rem}.none_vaults h3{margin-block-end:1.5rem}.loader{margin:auto;width:14px;height:14px;border-radius:50%;background-color:#fff;box-shadow:32px 0 #fff,-32px 0 #fff;animation:flash .5s ease-out infinite alternate}@keyframes flash{0%{background-color:#fff2;box-shadow:32px 0 #fff2,-32px 0 #fff}50%{background-color:#fff;box-shadow:32px 0 #fff2,-32px 0 #fff2}to{background-color:#fff2;box-shadow:32px 0 #fff,-32px 0 #fff2}}@media (max-width: 425px){h2{font-size:14px}.vault-list{margin-block-start:0px;margin-block-end:0px;padding-inline-start:0;margin:auto}.vault-header{flex-direction:column;gap:1rem}.vault-header_actions{gap:1rem}.vault-header_actions button{font-size:12px;padding:10px 15px}.icon{font-size:14px}article.item{min-height:80px}.item_header-info h3{font-size:12px}.item_header-info span{font-size:11px}.item_action{gap:5px}.item_action input{min-width:65%;padding:.4rem .6rem;font-size:12px}.item_action button{padding:.5rem}}@media (max-width: 375px){h2{font-size:12px}span{font-size:10px}.vault-header_actions{width:100%;gap:5px}.vault-header_actions button{font-size:10px}}.none_credential_container{margin:2rem auto 0;width:100%}.none_credential_container h4{font-weight:600;margin-block-end:0}.login_form{width:100%;display:flex;flex-direction:column;align-items:center;gap:2rem}.login_form label{width:70%;display:flex;justify-content:center;align-items:center;gap:1rem}.login_form .icon{font-size:25px}::placeholder{color:#a9a9a9;font-weight:300;font-style:oblique}.login_form input{padding:.7rem 1rem;border-radius:15px;font-size:medium;font-weight:500;width:50%}.login_form input.invalid{border:2px solid #d10f0fc9}.login-options{display:flex;flex-direction:column;width:100%;align-items:center;gap:20px}.login-options input[type=checkbox]{width:unset}button{width:180px}.validation_error{display:flex;flex-direction:column;align-items:flex-start;gap:5px}.validation_error span{color:#990b0b}.validation_error span.success{color:#fff;font-weight:600}@media screen and (max-width: 768px){.form_header{font-size:14px}.login_form{gap:2rem}.login_form label{width:90%;gap:.7rem}.login_form .icon{font-size:20px}.login_form input,.login_form button{width:80%;font-size:14px}}@media screen and (max-width: 320px){.form_header{font-size:10px}.login_form{gap:1rem}.login_form label{width:100%;gap:.5rem}.login_form .icon{font-size:15px}.login_form input{width:80%;font-size:11px;padding:.5rem .7rem}.login_form button{width:100%;font-size:12px;padding:.6rem}}footer{width:fit-content;margin:2rem;background-color:#232d3f9e;padding:1rem 2rem;border-radius:10px;transition:all .4s}footer:hover{cursor:pointer;padding-right:50px;background-color:#0d5c707e;border:solid 1.5px #232d3f9e}footer a{text-decoration:none;display:flex;align-items:center;gap:.6rem;font-size:14px}.account_form{display:block;margin:auto;width:50%}.inputs{display:flex;flex-direction:column;gap:1rem;margin-block-end:2rem}.inputs label{display:flex;flex-direction:column;align-items:baseline}.inputs div{display:inline-flex;align-items:center;width:100%;gap:5px}.account_form input{padding:.7rem 1rem;border-radius:15px;font-size:medium;font-weight:500;width:80%}.change_password{display:flex;flex-direction:column;align-content:flex-start;width:100%;gap:1rem;margin-block-end:2rem}.change_password button,.form_actions button{width:fit-content}.invalid{border:1px solid brown!important}.validation_message{font-size:14px;font-weight:600;margin-top:4px;color:brown}.loading{width:25px;height:25px;border:4px solid #FFF;border-bottom-color:transparent;border-radius:50%;box-sizing:border-box;display:inline-block;animation:rotation 1s linear infinite}@keyframes rotation{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.icon.tooltip{width:10%}.icon.tooltip .tooltip_text{margin-left:32px;top:0;left:0}.icon.tooltip .tooltip_text:after{bottom:31%;left:-4%;border-color:transparent #2f70ad transparent transparent}.icon_button{width:fit-content;padding:.8rem 1rem}.validation{margin-block-end:1rem}@media (max-width: 425px){.account_form{width:80%}.inputs label{gap:5px}.account_form input,.input_group input{font-size:12px;padding:.5rem 1rem}.validation_message{font-size:12px}.icon_button{padding:.5rem .6rem}}.credential_form{display:block;margin:auto;width:50%}.credential_form label{display:flex;flex-direction:column;align-items:baseline;gap:10px;margin:2rem 0;width:100%}.credential_form input{padding:.7rem 1rem;border-radius:15px;font-size:medium;font-weight:500;width:100%}.password_field{display:flex;width:100%;gap:.5rem;align-items:center}.password_actions{width:10%;display:inline-flex;gap:2px}.password_actions button{padding:.5rem 1rem}.validation_errors{margin-block-end:1rem;text-align:start}.validation_errors p{color:brown;font-size:14px;margin-block-start:1px;margin-block-end:1px}@media (max-width: 425px){.credential_form{width:80%}.credential_form label{margin:1rem 0}.credential_form input{padding:.6rem 1rem;font-size:12px;font-weight:500}.password_field{width:90%}}.form{display:flex;flex-direction:column;align-items:center;gap:1.5rem;width:50%;margin:auto}.form label{display:flex;flex-direction:column;align-items:flex-start;gap:5px;width:100%}.form label input{width:100%;padding:.7rem 1rem;font-size:14px}.form_actions{display:flex;width:100%;gap:1rem}.form_actions button[type=reset]{background-color:#2f455b}.form_actions button[type=reset]:hover{background-color:#375069}.form button{width:100%;max-width:258px;margin-top:1rem}@media (max-width: 425px){.form{width:90%;margin:unset;gap:1rem}.form label input{padding:.4rem .8rem}.form button{max-width:unset}}body{background-image:url(/assets/background-46d1bb4d.jpg);background-size:cover;color:#fff;font-family:Open Sans,sans-serif;font-family:Poppins,sans-serif}#root{max-width:1280px;margin:0 auto;padding:2rem;text-align:center;display:flex;flex-direction:column;align-items:stretch;gap:2rem;border-radius:20px}main{background-color:#232d3f9e;min-width:70%;padding:2rem;display:flex;flex-direction:column;border-radius:76px}.logo-home{width:460px}input[type=text],input[type=password],input[type=email]{background-color:#0d5c70;border:1px solid transparent;border-radius:15px;color:#fff}button{padding:.8rem 2rem;font-size:medium;color:#f5f5f5;background-color:#133d64;border:none;border-radius:20px}button:hover{cursor:pointer;background-color:#1d4469}button:disabled{background-color:#415262}button:disabled:hover{cursor:not-allowed}@media (max-width: 425px){#root{padding:1rem;gap:1rem;overflow-x:hidden}main{padding:1rem;font-size:12px;border-radius:38px}.logo-home{width:100%}button{padding:.6rem 1rem;font-size:13px}}@media (max-width: 375px){button{font-size:12px}}@media (max-width: 320px){button{font-size:11px}}a{color:#fff}h2,h3{margin-block-end:.5rem}.tooltip{position:relative;display:inline-block}.tooltip .tooltip_text{visibility:hidden;width:max-content;background-color:#2f70ad;font-size:14px;color:#fff;text-align:center;padding:5px 10px;border-radius:6px;position:absolute;z-index:1;top:125%;left:50%;margin-left:-60px;opacity:0;transition:all ease .4s}.tooltip .tooltip_text:after{content:"";position:absolute;bottom:100%;left:50%;margin-left:-5px;border-width:7px;border-style:solid;border-color:transparent transparent #2f70ad transparent}.tooltip:hover .tooltip_text{visibility:visible;opacity:1}.toogle,.toogle:hover{background-color:#2f70ad}
