body {
  font-family: 'Franklin Gothic Medium', 'Arial Narrow', Arial, sans-serif; /* fonte principal */
  background-color: white;/* cor de fundo principal */
  margin: 0; /* completar bordas */
}
 
/* cabeçalho preto no topo */
.NomeSite {
  background-color: black; /* cor do cabeçalho */
  padding: 20px 40px; /* ajuste de tamanho do cabeçalho */
}
 
.NomeSite h1 {
  color: white; /* cor do nome do site */
  font-size: 40px; /* tamanho do nome */
}
 
/* titulo grande "bem vindo de volta" */
.titulo {
  text-align: center; /* titulo centralizado */
  color: rgb(0, 0, 0); /* cor do titulo */
  font-size: 60px; /* tamanho do titulo */
  margin-top: 50px; /* posição de altitude do titulo */
}
 
/* caixa cinza do login */
.base1 {
  border-style:solid; /* estilo da borda */
  border-width: 1px; /* espessura da borda */
  border-color: rgb(116, 95, 95); /* cor da borda */
  background: linear-gradient(1deg, #d0d0d0, #d3d3d3); /* cor do card */
  width: 500px; /* largura do card */
  height: 300px; /* altura do card */
  margin: 0 auto; /* serve pra centralizar o card */
  padding: 30px; /* serve pra aumentar o card */
  border-radius: 10px; /* raio da borda */
}
 
.base1 h2 {
  text-align: center; /* centralizando o texto "login" */
  color: white; /* cor do texto "login" */
  font-size: 50px; /* tamanho do texto "login" */
  margin-bottom: 25px; /* ajustar a base do texto "login" */
  margin-top: auto; /* posição da altitude do texto "login" */
  height: 60px; /* altura do texto "login" */
}
 
/* caixinhas de digitar email e senha */
input[type="email"], /* serve pra escrever na caixa de e-mai */
input[type="password"] { /* serve pra escrever na caixa de senha */
  width: 95%; /* largura das caixas */
  height: 30px; /* altura das caixas */
  padding: 15px; /* ajuste de tamanho das caixas */
  margin-bottom: 20px; /* ajuste de base das caixas */
  border: none; /* remove a borda da caixa de texto */
  border-radius: 3px; /* raio da borda */
  font-size: 16px; /* tamanho dos textos */
  color: #999; /* cor dos textos */
}
 
.senha-input {
  position: relative; /* posição da senha */
}
 
.olho {
  position: absolute;
}
 
/* botão de entrar */
.botao-entrar {
  width: 40%; /* largura do botão entrar */
  background-color: #8b5d5d; /* cor do botão */
  color: white; /* cor do texto do botão */
  border: none; /* remover borta */
  padding: 15px; /* ajustar posição do botão */
  font-size: 18px; /* tamanho do texto do botão */
  border-radius: 3px; /* raio botão */
  cursor: pointer; /* mudar o cursor para cursor de clique */
  margin-top: 10px; /* ajustar altura do botão */
  margin-left: 150px; /* ajustar posição do botão */
}
 
/* texto embaixo do card */
.rodape {
  text-align: center; /* alinhar texto e rodape pro centro */
  margin-top: 20px; /* alinhar texto e rodape pra de baixo do card */
  color: rgb(59, 59, 59); /* cor do texto do rodape */
}
 
.rodape a {
  color: rgb(59, 59, 59); /* cor do texto de criar conta do rodape*/
  font-weight: bold; /* deixa em negrito */
}