html, body{margin: 0 auto; width: 100%; height: 100%}
/*#todo{font-family: verdana; width: 100%; height: 100%; background-image: url(../imagem/pneu1.jpg); background-size: cover}*/
#todo{font-family: verdana; width: 100%; height: 100%; background-size: cover}

@media screen and (max-width: 600px){

/*#msgbloqueio{width: 300px; height: 300px; position: absolute; margin-left: -150px; margin-top: -150px; left: 50%; top: 50%; border: 1px solid white;}
#bloqueio{text-align:center; font-size: 20px; color: white; width: 100%; height: 100%; opacity: 0.9; background: black; z-index: 998; position: absolute;} */ 
#escurece{display: none; width: 100%; height: 100%; opacity: 0.7; background: black; z-index: 998; position: absolute;} 
#alertas{display: none; box-shadow: 5px 5px 5px white; line-height: 100px; text-align: center; border: 2px solid black; width: 90%; height: 100px; position: absolute; margin-left: -45%; margin-top: -50px; left: 50%; top: 50%; background: white; z-index: 999; border-radius: 10px}  
  
#todo{font-family: verdana; width: 100%; height: 100%; background-size: cover; min-height: 500px}
#cabecalho{text-align: center; width: 100%; height: 60px; background: gray; float: left; line-height: 60px; color: white; font-size: 28px}
#cabecalho2{width: 100%; height: 3px; background: white; float: left}
.bloco{width: 99%; height: auto; float: left; margin-top: 80px; border: px solid white}
.bloco table{width: 100%; text-align: center}
.bloco table input[type=text]{margin-left: 1px; float: left; width: 99%; text-align: center; height: 35px; font-size: 20px; outline-color: black; float: left}
.bloco table input[type=password]{margin-left: 1px; float: left; width: 99%; text-align: center; height: 35px; font-size: 20px; outline-color: black}
.bloco table input[type=button]{margin-left: 3px; float: left; outline-color: black; border: 4px solid white; background: black; color: white; width: 99%; text-align: center; height: 50px; font-size: 30px}
#direitos{margin-bottom: 15px; width: 100%; color: white; text-align: center; height: auto; bottom: 0; position: absolute; font-size: 10px}
#bloqueio{width: 100%; height: 100%; z-index: 999; position: absolute;}
#msgbl{}

p{
  animation-duration: 3s;
  animation-name: slidein;
}

@keyframes slidein {
  from {
    margin-left: 100%;
    width: 300%
  }

  to {
    margin-left: 0%;
    width: 100%;
  }
}
}


@media screen and (min-width: 601px){
    
.cabecalho{text-align: center; width: 100%; height: 60px; background: gray; float: left; line-height: 60px; color: white; font-size: 45px} 
.cabecalho2{width: 100%; height: 3px; background: white; float: left}
#todo *{display: none}
}