Generated by SassMeister.com.

SassMeister-input-HTML.html

<img class="Logo" src="https://www.prospecteye.com/info/wp-content/themes/prospecteye/images/logo.png?new">
<div class="Login">
    <form method="post">
      <label for="Login-email">E-mail</label>
    	<input type="text" name="Login-email" id="Login-email" placeholder="Username" required="required" />
      <label for="Login-password">Password</label>
      <input type="password" name="Login-password" placeholder="Password" required="required" />
      <button type="submit" class="btn"><span>Log in</span></button>
      <a href="#" class="Login-forgotLink">I forgot my password</a>
    </form>
</div>

SassMeister-input.scss

// ----
// Sass (v3.3.0.rc.2)
// Compass (v1.0.0.alpha.17)
// ----

@import url(http://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400);

.btn {
  display: block;
  width: 100%;
  padding: 14px 10px;
  margin-bottom: 0;
  line-height: 18px;
  color: #444;
  text-align: center;
  vertical-align: middle;
  background-color: #009FE3;
  cursor: pointer;
  border: none;
  color: white;
  font-size: 16px;
  font-weight: 300;
  transition: background-color 0.2s ease;
  outline: none;
}

.btn:hover, btn:focus {
  background-color: darken(#009FE3, 10%);
}

.btn:active {
  background: darken(#009FE3, 20%);
  transition: none;
  -webkit-transform: translateY(1px);
  -moz-transform: translateY(1px);
  transform: translateY(1px);
}

input {
	width: 100%;
	margin-bottom: 10px;
	background: #333;
	border: none;
	outline: none;
	padding: 14px 10px;
	font-size: 16px;
	font-weigth: 300;
	color: #fff;
	transition: background .2s ease;
}

input:hover {
 	background: #363636;
}
input:focus {
 	background: #444;
}

label {
 	color: transparent;
	font: 0/0 a;
	text-shadow: none;
 	display: block;
}

.Login-forgotLink {
  display: inline-block;
  float: right;
  color: #fff;
  text-decoration: none;
  border-bottom: 1px dotted #fff;
  margin: 10px 0;
  padding-bottom: 2px;
  font-size: 14px;
}

* {
	box-sizing:border-box;
}

html {
	width: 100%;
	height:100%;
	overflow:hidden;
	-webkit-font-smoothing: antialiased;
}

body {
	  width: 100%;
	  height:100%;
	  font-family: 'Source Sans Pro', sans-serif;
    font-size: 16px;
    font-weight: 300;
	  background: #222;
}

.Login {
  	display: block;
  	margin: 0 auto;
	  width:300px;
	  height:300px;
}

.Logo {
  display: block;
  margin: 50px auto 10px;
  -webkit-transform: translateX(-55px);
  -moz-transform: translateX(-55px);
  transform: translateX(-55px);
}
.container {
  margin-top:200px;
}

SassMeister-output.css

@import url(http://fonts.googleapis.com/css?family=Source+Sans+Pro:300,400);
.btn {
  display: block;
  width: 100%;
  padding: 14px 10px;
  margin-bottom: 0;
  line-height: 18px;
  color: #444;
  text-align: center;
  vertical-align: middle;
  background-color: #009FE3;
  cursor: pointer;
  border: none;
  color: white;
  font-size: 16px;
  font-weight: 300;
  transition: background-color 0.2s ease;
  outline: none;
}

.btn:hover, btn:focus {
  background-color: #007bb0;
}

.btn:active {
  background: #00587d;
  transition: none;
  -webkit-transform: translateY(1px);
  -moz-transform: translateY(1px);
  transform: translateY(1px);
}

input {
  width: 100%;
  margin-bottom: 10px;
  background: #333;
  border: none;
  outline: none;
  padding: 14px 10px;
  font-size: 16px;
  font-weigth: 300;
  color: #fff;
  transition: background .2s ease;
}

input:hover {
  background: #363636;
}

input:focus {
  background: #444;
}

label {
  color: transparent;
  font: 0/0 a;
  text-shadow: none;
  display: block;
}

.Login-forgotLink {
  display: inline-block;
  float: right;
  color: #fff;
  text-decoration: none;
  border-bottom: 1px dotted #fff;
  margin: 10px 0;
  padding-bottom: 2px;
  font-size: 14px;
}

* {
  box-sizing: border-box;
}

html {
  width: 100%;
  height: 100%;
  overflow: hidden;
  -webkit-font-smoothing: antialiased;
}

body {
  width: 100%;
  height: 100%;
  font-family: 'Source Sans Pro', sans-serif;
  font-size: 16px;
  font-weight: 300;
  background: #222;
}

.Login {
  display: block;
  margin: 0 auto;
  width: 300px;
  height: 300px;
}

.Logo {
  display: block;
  margin: 50px auto 10px;
  -webkit-transform: translateX(-55px);
  -moz-transform: translateX(-55px);
  transform: translateX(-55px);
}

.container {
  margin-top: 200px;
}

SassMeister-rendered.html

<img class="Logo" src="https://www.prospecteye.com/info/wp-content/themes/prospecteye/images/logo.png?new">
<div class="Login">
    <form method="post">
      <label for="Login-email">E-mail</label>
    	<input type="text" name="Login-email" id="Login-email" placeholder="Username" required="required" />
      <label for="Login-password">Password</label>
      <input type="password" name="Login-password" placeholder="Password" required="required" />
      <button type="submit" class="btn"><span>Log in</span></button>
      <a href="#" class="Login-forgotLink">I forgot my password</a>
    </form>
</div>