body {
  color: white;
  background: #FF512F;
  /* fallback for old browsers */
  background: -webkit-linear-gradient(to left, #FF512F, #DD2476);
  /* Chrome 10-25, Safari 5.1-6 */
  background: linear-gradient(to left, #FF512F, #DD2476);
  /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
  font-family: Open Sans , arial;
}
body .login-form {
  margin: 3em auto;
  border: 1px solid rgba(255, 255, 255, 0.1);
  padding: 5px 20px;
  border-radius: 5px;
}
body .login-form .heading {
  font-size: 30px;
  font-weight: 300;
}
@media (max-width: 768px) {
  body .login-form {
    width: 70%;
  }
}
@media (min-width: 768px) {
  body .login-form {
    width: 30%;
  }
}
body .login-form .form-group {
  margin: 1.8em 0;
}
body .login-form .form-group .input-group .input-group-addon {
  background-color: transparent;
  border-radius: 00;
  height: 40px;
  color: white;
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-right-color: transparent;
}
body .login-form .form-group .input-group .form-control {
  color: white;
  border-radius: 0;
  height: 40px;
  width: 100%;
  border: 1px solid rgba(255, 255, 255, 0.2);
  background: transparent;
}
body .login-form .form-group .input-group .form-control:hover,
body .login-form .form-group .input-group .form-control:focus,
body .login-form .form-group .input-group .form-control:active {
  box-shadow: none;
}
body .login-form .form-group .btn {
  border: 1px solid rgba(255, 255, 255, 0.2);
  background: transparent;
  padding: 10px 20px;
}
body .login-form .form-group .btn:hover,
body .login-form .form-group .btn:focus {
  background: rgba(255, 255, 255, 0.8);
  color: black;
}
body .login-form .form-group.login {
  width: 20%;
  margin: auto;
  margin-bottom: 20px;
}
.form-control::-moz-placeholder {
  color: white;
  font-family: Open Sans , arial;
  opacity: 1;
}
.form-control:-ms-input-placeholder {
  color: white;
  font-family: Open Sans , arial;
}
.form-control::-webkit-input-placeholder {
  color: white;
  font-family: Open Sans , arial;
}