.login-wrapper {
    background-color: #f1f7fc;
    margin: 0;
    padding: 0;
    height: 100vh;
    display: block;
  }
  .login-area {
    width: 75%;
    margin: 50px auto;
    background: #FFF;
    text-align: center;
    box-shadow: 1px 1px 5px rgba(0,0,0,0.1);
  }
  .login-area img {
    width: 100%;
    height: 100%;
    background-position: center center;
    background-size: cover;
    background-color: #CCC;
  }
  .login-area form {
    display: block;
    padding: 25px;
  }

  .login-area p {
  text-shadow: 0px 1px 1px #333;
  font-size: 30px;
  color: #CCC;
  text-transform: uppercase;
  padding: 20px 0px;
  letter-spacing: 0;
}
  form .form-group {
    text-align: left;
    width: 100%;
    color: #505e6c;
  }
  .form-group .col-md-6 {
    width: 100%;
  }

  .loginbtn {
    display: block;
    height: 50px;
  }
  .left {
    float: left;
  }
  .right {
    float: right;
    text-align: right;
  }
  .form-group.loginbtn button {
    margin-top: 13px;
  }
  .input-group-addon{padding: 0px 12px;}
  label{padding: 8px 0px;}
  /*******************************
    All Responsive Code
  *******************************/

  /*Tablet Layout: 768px*/
  @media only screen and (min-width: 768px) and (max-width: 991px){
    .login-area img {display: none;}
    .login-area {width: 65%;margin: 30px auto;}
  }

  /*wide mobile Layout: 480px*/
  @media only screen and (min-width: 480px) and (max-width: 767px){
    .login-area img {display: none;}
    
  }

  /*Mobile Layout: 320px*/
  @media only screen and (min-width: 320px) and (max-width: 479px){
    
    .login-area img {display: none;}
  }