body{background:linear-gradient(45deg,green,#3f5efb);height:100vh;font-family:Montserrat,sans-serif;display:flex}.viewport{display:flex;width:100%;height:100%}.logo{color:#fff;display:flex;align-items:center;justify-content:center;font-size:24px;margin-bottom:px}.side-panel{width:300px;height:98%;border:1px solid rgba(255,255,255,.3);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:20px;background:#ffffff4d;clip-path:polygon(0 0,100% 0,100% 100%,0 100%);z-index:1;transition:all .2s ease-in-out}.menu{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%}.item{margin:1rem 0;padding:10px;width:80%;border-radius:10px;transition:all .2s ease-in-out;background-color:#fff6}.item:hover{background-color:#fff9;border:1px solid rgba(255,255,255,.3);cursor:pointer}.item:hover p{font-size:18px}.item p{font-weight:500;color:#fff;text-align:center}.container{position:absolute;transform:translate(-50%,-50%);top:50%;left:50%}form{background:#ffffff4d;padding:3em;height:75vh;width:80vw;border-radius:20px;border-left:1px solid rgba(255,255,255,.3);border-top:1px solid rgba(255,255,255,.3);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);box-shadow:20px 20px 40px -6px #0003;text-align:center;position:relative;transition:all .2s ease-in-out;overflow-y:auto}form::-webkit-scrollbar{width:12px}form::-webkit-scrollbar-thumb{background:#ffffff4d;border-radius:10px}form::-webkit-scrollbar-thumb:hover{background:#fff}form::-webkit-scrollbar-track{background:#ffffff1a;border-radius:10px}form::-webkit-scrollbar-thumb:active{background:#fff}form p{font-weight:500;color:#fff;opacity:.7;font-size:1.4rem;margin-top:0;margin-bottom:60px;text-shadow:2px 2px 4px rgba(0,0,0,.2)}form a{text-decoration:none;color:#ddd;font-size:12px}form a:hover{text-shadow:2px 2px 6px #00000040}form a:active{text-shadow:none}form input{background:transparent;width:98%;padding:1em;border:none;border-left:1px solid rgba(255,255,255,.3);border-top:1px solid rgba(255,255,255,.3);border-radius:5000px;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);box-shadow:4px 4px 60px #0003;color:#000;font-family:Montserrat,sans-serif;font-weight:500;transition:all .2s ease-in-out;text-shadow:2px 2px 4px rgba(0,0,0,.2);font-size:15px}form textarea{background:transparent;width:98%;padding:1em;margin-bottom:2em;border:none;border-left:1px solid rgba(255,255,255,.3);border-top:1px solid rgba(255,255,255,.3);border-radius:10px;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);box-shadow:4px 4px 60px #0003;color:#000;font-family:Montserrat,sans-serif;font-weight:500;transition:all .01s ease-in-out;text-shadow:2px 2px 4px rgba(0,0,0,.2);font-size:15px}form input:hover,form textarea:hover{background:#ffffff1a;box-shadow:4px 4px 60px 8px #0003}form input[type=email]:focus,form input[type=password]:focus{background:#ffffff1a;box-shadow:4px 4px 60px 8px #0003}form input[type=button]{margin-top:10px;width:150px;font-size:1rem}form input[type=button]:hover{cursor:pointer}form input[type=button]:active{background:#fff3}form:hover{margin:4px}::placeholder{font-family:Montserrat,sans-serif;font-weight:400;color:#fff;text-shadow:2px 2px 4px rgba(0,0,0,.4)}.drop{background:#ffffff4d;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-radius:10px;border-left:1px solid rgba(255,255,255,.3);border-top:1px solid rgba(255,255,255,.3);box-shadow:10px 10px 60px -8px #0003;position:absolute;transition:all .2s ease}.drop-1{height:80px;width:80px;top:-20px;left:-40px;z-index:-1}.drop-2{height:80px;width:80px;bottom:-30px;right:-10px}.drop-3{height:100px;width:100px;bottom:120px;right:-50px;z-index:-1}.drop-4{height:120px;width:120px;top:-60px;right:-60px}.drop-5{height:60px;width:60px;bottom:170px;left:90px;z-index:-1}a,input:focus,select:focus,textarea:focus,button:focus{outline:none}.field{display:flex;flex-direction:column;margin-bottom:1rem}.field label{font-size:15px;margin-bottom:.5rem;align-self:start;color:#fff;padding-left:15px}.login{display:flex;flex-direction:column;align-items:center;justify-content:center;height:350px}@media screen and (max-width: 768px){form{height:70vh}form input,form textarea{width:98%}}.historico-container{background-color:#000000fa;border-radius:20px;display:flex;flex-direction:column;align-items:center;justify-content:center}table{margin-top:2rem}th{background-color:#ffffff4d;color:#fff;font-weight:500;padding:10px;text-align:center;font-size:12px;border:1px solid rgba(255,255,255,.3)}td{background-color:#ffffff1a;color:#fff;font-weight:500;font-size:12px;padding:10px;text-align:center;width:100px;border:1px solid rgba(255,255,255,.3);word-wrap:break-word}thead{position:sticky;top:0;z-index:1}.loader{position:relative;display:flex;align-items:center;justify-content:center;width:100%;max-width:8rem;margin-top:45vh;margin-left:43vw}.loader:before,.loader:after{content:"";position:absolute;border-radius:50%;animation:pulsOut 1.8s ease-in-out infinite;filter:drop-shadow(0 0 1rem rgba(255,255,255,.75))}.loader:before{width:100%;padding-bottom:100%;box-shadow:inset 0 0 0 1rem #fff;animation-name:pulsIn}.loader:after{width:calc(100% - 2rem);padding-bottom:calc(100% - 2rem);box-shadow:0 0 #fff}@keyframes pulsIn{0%{box-shadow:inset 0 0 0 1rem #fff;opacity:1}50%,to{box-shadow:inset 0 0 #fff;opacity:0}}@keyframes pulsOut{0%,50%{box-shadow:0 0 #fff;opacity:0}to{box-shadow:0 0 0 1rem #fff;opacity:1}}