body{font-family:arial}#table_teclado_virtual{margin-top:5px;margin-left:50px}#main_login{width:400px;background:#f2f2f2;height:auto;padding:10px}#table_button{margin-left:58px}#table_button_corrigir_senha{margin-left:35px}#table_button_corrigir_senha button{background:#00cc33;border:1px solid silver;border-radius:3px}#table_button_corrigir_senha button:hover{opacity:0.8;color:white}#legenda_main_login{display:block;background:#6F6F6F;color:white;width:400px;padding:10px;padding-top:3px;padding-bottom:3px;font-size:16px;margin-bottom:0;text-align:center}#entrar{background:#6F6F6F;color:white;border:1px solid #9a9a9a}section{width:420px;height:auto;margin:auto;border:1px solid silver;padding:10px;background:#f7f5f5}#legenda_digitos{font-size:11px;opacity:0.6;margin-top:3px;display:block}.erro{color:#f88989}@-webkit-keyframes fadeIn{0%{opacity:0}100%{opacity:1}}@-moz-keyframes fadeIn{0%{opacity:0}100%{opacity:1}}@-o-keyframes fadeIn{0%{opacity:0}100%{opacity:1}}@keyframes fadeIn{0%{opacity:0}100%{opacity:1}}.fadeIn{-webkit-animation:fadeIn 1s ease-in-out;-moz-animation:fadeIn 1s ease-in-out;-o-animation:fadeIn 1s ease-in-out;animation:fadeIn 1s ease-in-out}.area{position:relative;width:95%;height:500px;top:50px;align-content:center}#webCamera{width:100% !important;height:500px !important;transform:scaleX(-1);z-index:1;overflow:hidden}#canvas{position:absolute;top:0;left:0;width:100% !important;height:500px !important;transform:scaleX(-1);z-index:2;pointer-events:none;background-color:transparent;overflow:hidden}.fixed-name{width:100%;background-color:rgba(0,0,0,0.7);color:white;padding:4px 8px;text-align:center;z-index:1000;border-radius:6px}.fixed-button{position:fixed;top:4px;right:10px}#locationStatus{position:fixed;top:10%;right:10%;background-color:yellow;padding:10px;border-radius:5px;font-size:16px;z-index:1000}#countdown{background-color:black;border-radius:10px;padding:15px 20px;position:fixed;top:60%;left:50%;transform:translate(-50%,-50%);font-size:24px;color:white;z-index:1000;text-shadow:-1px -1px 0 red,1px -1px 0 red,-1px 1px 0 red,1px 1px 0 red;opacity:0}/* Estilos para a div */.fade-in{animation:fadeIn 1s forwards}.fade-out{animation:fadeOut 1s forwards}@keyframes fadeIn{from{opacity:0;transform:translate(-50%,-50%) scale(0.9)}to{opacity:1;transform:translate(-50%,-50%) scale(1)}}@keyframes fadeOut{from{opacity:1;transform:translate(-50%,-50%) scale(1)}to{opacity:0;transform:translate(-50%,-50%) scale(0.9)}}