Login Screen

index.html

<div class="header">
	  <div class="container">
    		<div class="logo">
			      <h1><a href="#"></a>Logo</h1>
		    </div><!--logo-->
		
    		<div class="nav">
			      <ul>
          <li><a href="#">Login</a></li>
          <li><a href="#">Page 2</a></li>
          <li><a href="#">Page 3</a></li>
          <li><a href="#">Account</a></li>
      			</ul>
		    </div><!--nav-->

	  </div><!--container-->	
	</div><!--header-->

	<div class="container">
    <div class="content">
      <form action="">
        <label class="login">Username or Email</label>
          <input type="text" name="User"/>
        <label class="login">Password</label>
          <input type="password" name="password"/>
        <label id="remeber_me">
            <input type="checkbox" name="Remember Me" id="remember_me">
             Remember me on this computer</label>
      </form>
    </div>
	</div>

Login Screen.markdown

Login Screen

A Pen by Mark Sweet on CodePen.

License.

style.css

body{
	width: 100%;
	margin: auto;
  padding-top: 100px;
}

.container{
	width: 960px;
	margin: 0 auto;
}

.header{
	background: #6396bc;
	width: 100%;
	top:0;
	position:fixed;
}

.logo{
	float: left;
	font-family: helvetica;
	font-size: 15px;
}

a {
	text-decoration: none;
	color: white;
}

li{
	list-style: none; 
	float: left;
	margin: 15px;
	padding-top: 15px;

}

.nav{
	float: right;
}

form {
  width: 300px;
  margin: 0 auto;
}

.login, input {
  display: block;
  width: 100%;
}

#remember_me{
  display: inline;
  width: auto;
}

input {
  margin-bottom: 15px;
}

replaced width: 100% with width: auto