<div class="container">
<div class="row navbar-fixed-top header">
<img class="header-img" src="http://lakshmip.com/images/bond-logo.png" id="bond-logo" />
</div>
<div class="row">
<div class="col-sm-6 col-md-4 col-md-offset-4">
<!-- <h1 class="text-center login-title">Sign in to continue to Bootsnipp</h1> -->
<div class="account-wall">
<div class="chase-logo">
<img class="profile-img" src="http://lakshmip.com/images/chase-logo.png"
alt="">
<h1 class="text-center login-title">CHASE BANK</h1>
<p class="text-center normal-text ">Enter your Chase credentials to link your account.</p>
<p class="text-center smaller-text"><a>LEARN MORE</a></p>
<p id="error"><span class="glyphicon glyphicon-warning-sign left"></span> Invalid routing number</p>
</div>
<form class="form-signin">
<input type="text" class="form-control" placeholder="Username" id="email" required>
<input type="password" class="form-control" placeholder="Password" required>
<input type="text" class="form-control" placeholder="Routing Number" id="routing" required>
<button class="btn btn-lg btn-primary btn-block" type="button" onclick="validateRoutingNum('114910222');">
Sign in</button>
<!--<label class="checkbox pull-left">
<input type="checkbox" value="remember-me">
Remember me
</label>
<a href="#" class="pull-right need-help">Need help? </a><span class="clearfix"></span>
</form>
</div>
<a href="#" class="text-center new-account">Create an account </a>-->
<p class="text-center smallest-text">If you'd rather set up your account by entering your account and routing numbers you can do so by <a>setting up manually</a>.</p>
</div>
</div>
</div>
body
{
padding-top: 70px;
}
.container {
background-color: #f7f7f7
}
.header
{
background-color: #ffffff;
border-bottom: 1px solid #CCC;
}
.header-img
{
margin: 15px auto 10px;
display: block;
/*-moz-border-radius: 50%;
-webkit-border-radius: 50%;
border-radius: 50%;*/
padding: 10px 0 10px 0;
}
.normal-text
{
padding: 7px 35px 0px 35px;
color: #CCC;
}
.smaller-text
{
font-size:11px;
font-weight:bold;
}
.smallest-text
{
padding: 12px 30px 0px 30px;
color: #CCC;
font-size:11px;
}
.form-signin
{
max-width: 360px;
padding: 0px 0 0px 0;
margin: 0 auto;
}
.form-signin .form-signin-heading, .form-signin .checkbox
{
margin-bottom: 10px;
}
.form-signin .checkbox
{
font-weight: normal;
}
.form-signin .form-control
{
position: relative;
font-size: 16px;
height: auto;
padding: 10px;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
box-sizing: border-box;
}
.form-signin .form-control:focus
{
z-index: 2;
}
.form-signin input[type="text"]
{
margin-bottom: -1px;
border-radius: 0;
border-left: 0;
border-right: 0;
}
.form-signin input[type="number"]
{
margin-bottom: -1px;
border-radius: 0;
border-left: 0;
border-right: 0;
}
.form-signin input[type="password"]
{
border-radius: 0;
border-left: 0;
border-right: 0;
margin-bottom: -1px;
}
.account-wall
{
margin-top: 20px;
padding: 10px 0px 10px 0px;
background-color: #ffffff;
-moz-box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3);
-webkit-box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3);
box-shadow: 0px 2px 2px rgba(0, 0, 0, 0.3);
}
.login-title
{
color: #000;
font-size: 22px;
font-weight: 600;
display: block;
}
.profile-img
{
/*width: 96px;
height: 96px;*/
margin: 0 auto 10px;
display: block;
/*-moz-border-radius: 50%;
-webkit-border-radius: 50%;
border-radius: 50%;*/
}
.need-help
{
margin-top: 10px;
}
.new-account
{
display: block;
margin-top: 10px;
}
.btn
{
border-radius:0;
}
.chase-logo
{
text-align: center;
padding: 0px 15px 20px 15px;
}
#error
{
color: red;
display: none;
}
