* {

  margin: 0;

  padding: 0;

  box-sizing: border-box;

  font-family:"Open Sans", sans-serif;

}



body {

  display: flex;

  justify-content: center;

  align-items: center;

  min-height: 100vh;

  background: linear-gradient(to bottom right, #004aad, #ffffff);

}



.container {

  width: 100%;

  display: flex;

  max-width: 400px;

  background: #0055a6;

  border-radius: 5px;

}



.login {

  width: 400px;

}



form {

  width: 340px;

  margin: 60px auto;

}



h1 {

  margin: 20px;

  text-align: center;

  font-weight: bolder;

  text-transform: uppercase;

}



hr {

  border-top: 3px solid #FFFF06;

}



p {

  text-align: center;

  margin: 10px;

  font-size: 13px;
  color: #fff;

}



form label {

  display: block;

  font-size: 16px;

  font-weight: 600;

  padding: 5px;

  margin-top: 8px;
color: #fff;
  margin-bottom: 0;

}



input {

  width: 100%;

  margin: 2px;

  boder: none;

  outline: none;

  padding: 8px;

  border-radius: 4px;

  border: 1px solid gray;

}



button {

  border: none;

  outline: none;

  padding: 8px;

  width: 100%;

  color: white;

  font-size: 16px;

  cursor: pointer;

  margin-top: 20px;

  border-radius: 8px;

  background: #A6A600;
  font-weight: 600;

}



.forget {

  font-size: 12px;

  margin-top: 16px;

  text-align: right;

}



a {

  text-decoration: none;

  color:#FFFFB9;

}



.signup {

  display: inline;

  margin-bottom: cpx;

}
.site-footer{position: fixed;bottom: 0;}
.site-footer .container{display:inherit;background: transparent;max-width: 1024px;}
@media (max-width: 400px){
  .container{max-width: 90%;}
  form{width: 100%}
  }