body{background-color:#525050;justify-content:center;align-items:center;width:100%;min-height:100vh;margin:0;padding:0;font-family:sans-serif;display:flex}#root{flex-direction:column;justify-content:center;align-items:center;width:100%;padding:20px;display:flex;overflow-x:hidden}:root{--primary-color:#3498db;--input-border:#ccc;--input-focus:#808a84;--spacing-small:8px;--border-radius:6px;--background-color:#242323;--font-color:#ddd;--btn-color:#0c0c0c;--box-shadow-0:inset 6px 6px 12px #bec3c9;--box-shadow-1:inset -6px -6px 12px #fff;--box-shadow-2:20px 20px 60px #bec3c9;--box-shadow-3:-20px -20px 60px #fff}.btn-action{background-color:var(--btn-color);color:#ddd;border-radius:var(--border-radius);border:none;outline:none;width:100%;padding:.7rem;font-size:1rem}.btn-action:hover{opacity:.7;box-shadow:var(--box-shadow-2,--box-shadow-3);transition:all .3s ease-in-out}#delBtn:hover{box-shadow:none;background-color:red;transition:all .3s ease-in-out}.header-Items{flex-direction:column;align-items:center;gap:1rem;width:100%;max-width:500px;display:flex}@media (width>=768px){.header-Items{grid-template-columns:1fr 1fr;max-width:800px;display:grid}.btn-action{grid-column:span 2}}.input-item{flex-direction:column;width:100%;display:flex}.FName,.LName,.EMail,.Birthday{border-radius:var(--border-radius);box-sizing:border-box;width:100%;box-shadow:var(--box-shadow-0,--box-shadow-1,);border:1px solid #ccc;outline:none;gap:.3rem;padding:.75rem;font-size:16px;overflow:hidden}label{color:#fff}#birthday{border-radius:var(--border-radius);border:none;padding:.75rem;font-size:1rem}.render-data{scroll-snap-type:x mandatory;scroll-behavior:smooth;border-radius:var(--border-radius);box-sizing:border-box;-webkit-overflow-scrolling:touch;gap:2rem;width:100%;height:320px;margin:2rem auto;padding:1rem;display:flex;overflow-x:auto;box-shadow:0 2px 8px 5px #859eaf}.render-data::-webkit-scrollbar{display:none}.render-item{scroll-snap-align:center;color:#fff;box-sizing:border-box;background:#424242;border-radius:12px;flex-direction:column;flex:0 0 100%;justify-content:space-between;align-items:flex-start;min-width:600px;min-height:250px;padding:1.5rem;font-size:1rem;display:flex;box-shadow:0 4px 15px #0006}.render-item p{margin:.5rem 0;line-height:1.4}.render-item strong{color:#d3a858;margin-right:5px}.edit-inputs{flex-direction:column;align-items:center;gap:1rem;width:100%;display:flex}.edit-inputs input{border-radius:var(--border-radius);border:none;width:80%;padding:8px}.editDeleteBtn{justify-content:flex-end;gap:1rem;width:100%;margin-top:1.5rem;display:flex}.editDeleteBtn>*{flex:1;max-width:150px}.breakBtn{background-color:var(--primary-color);border-radius:var(--border-radius);border:3px solid #000;min-width:10rem}.breakBtn:hover{opacity:.7;box-shadow:var(--box-shadow-2,--box-shadow-3);transition:all .3s ease-in-out}.hero{background-color:#0000;flex-direction:column;justify-content:center;align-items:center;width:700px;height:fit-content;min-height:80vh;padding:1rem;display:flex}