<link href="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//maxcdn.bootstrapcdn.com/bootstrap/3.3.0/js/bootstrap.min.js"></script> <script src="//code.jquery.com/jquery-1.11.1.min.js"></script> <!------ Include the above in your HEAD tag ----------> <div class="container-fluid"> <div class="row"> <div class="col-xs-12 col-sm-6 col-md-8 lg-bg"></div> <div class="col-xs-6 col-md-4"> <div class="logo-area"><img src="http://lorempixel.com/210/120/"></img></div> <div class="logo-text">Sign in with your access information below...</div> <form> <div class="form-group"> <div class="checkbox"> <label> <input type="checkbox" value=""> N/A </label> </div> <label for="exampleInputEmail1">Login</label> <input type="email" class="form-control" id="exampleInputEmail1" placeholder="Email"> </div> <div class="form-group"> <label for="exampleInputPassword1">Password</label> <input type="password" class="form-control" id="exampleInputPassword1" placeholder="Password"> </div> <button type="submit" class="btn btn-success">Login</button> </form> <div class="copy-text"><p>Lorem ipsum dolor sit amet, saepe mollis propriae ad eum, solet scripta est et. Ut dicit volumus electram mei, ius purto officiis corrumpit id, mea affert definiebas ne. Quas nostrud ponderum ex sit. Vim at lobortis pertinacia, alia natum erant ex cum. Honestatis consectetuer vix in, te sea elit inimicus.</p>All rights reserved © 2015 Steel Art Signs</div> </div> </div> </div>

.lg-bg {background-image:url('http://lorempixel.com/abstract/1920/1920/'); background-repeat: no-repeat; height:auto; min-height:800px;} .logo-area {margin-bottom:30px; margin-top:40px; } .logo-text {margin-bottom:20px; margin-top:20px;} .copy-text {margin-bottom:20px; margin-top:80px; position:relative; bottom:-120px;}