*{margin:0;padding:0;box-sizing:border-box}body{background-color:#0b0224}input{background-color:#1a1036;color:#f5f5f5}p,label{color:#f5f5f5}button{background-color:#f5f5f5}.login{height:100vh;width:100vw}.login input{padding:10px;border-radius:6px;outline:0;border:0}.login input:focus{outline:none}.login form,.add form{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);width:400px}.login form .input,.add form .input{margin:15px 0;display:flex;flex-direction:column}.login form .input label,.add form .input label{margin-bottom:5px}.login form button,.add form button{width:100%;padding:10px;border-radius:12px;outline:0;border:0}.error_msg{color:red}.search{display:flex;align-items:center;justify-content:space-between;border:1px solid gray;border-radius:8px;margin:20px;padding:0 10px}.search input{border:none;outline:none;height:50px;flex:1;background-color:transparent}.search button{background-color:transparent;border:none;outline:none;cursor:pointer;transition:all .05s linear}.search button:active{transform:scale(.7)}.search img{height:25px}table{margin:20px;width:100%}table th,td{text-align:left;color:#f5f5f5}.clickable,table img,.logout{transition:all .05s linear;cursor:pointer}.clickable:active,table img:active,.logout:active{transform:scale(.7)}.error,.ok{color:red;font-weight:700;text-transform:uppercase}.ok{color:green}.all button{width:100%;height:30px;margin:10px 0}.all{padding:10px}.logout{position:fixed;right:10px;bottom:10px}.logout img{height:50px;object-fit:contain}.loading{margin:auto;height:50px;width:50px;border-radius:50%;border-top:3px solid rgba(0,0,0,.7);border-left:3px solid rgba(0,0,0,.7);border-bottom:3px solid rgba(0,0,0,.7);animation:3s infinite alternate;animation-name:rotate}@keyframes rotate{0%{transform:rotate(0)}to{transform:rotate(360deg)}}