HTML

<html style="
    height: 100%;
"><head>
    <meta charset="utf-8">
    <title>Bem vindo à To-Do It!</title>
    <link href="http://fonts.googleapis.com/css?family=Raleway" rel="stylesheet" type="text/css">
    <link rel="stylesheet" type="text/css" href="css/index.css">
    <meta name=" viewport " content=" initial-scale=1.0 , width=device-width ">
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js"></script><style></style>
      </head>
  <body style="
    height: 100%;
">
    <div class="canvas" style="
    position: relative;
    height: 100%;
    width: 100%;
    margin-left: auto;
margin-right: auto;
    left: 0; /* remover o left 50% no .css */
    right: 0;
">
      <div class="box">
        <h1>To-Do It!</h1>
        <form action="index.php" method="post">
          <p>
            <input type="text" name="login" id="login" placeholder="Login" required="">
          </p>
          <p>
            <input type="password" name="passwd" id="passwd" placeholder="Senha" required="">
          </p>
          <input type="submit" id="bt_join" value="Entrar">
          <p><a href="cadastro.php">Cadastre-se</a></p>
        </form>
      </div>
    </div>


</body></html>