<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 formlogin"> <form class="form"> <div class="col-md-4 col"> <h3>Login Here</h3> <div style="margin-bottom:20px;text-align:center;"> <img src="http://i.imgur.com/oGUYN9p.jpg" class="img-circle" alt="Cinque Terre" width="100" height="100"> </div> <div style="margin-bottom:20px;"> <input placeholder="Email or Mobile" class="form-control" id="ex2" type="text" /> </div> <div style="margin-bottom:10px;"> <input placeholder="password" class="form-control" id="ex2" type="password" /> </div> <div style="margin-bottom:10px;"> <input type="checkbox" /> <a style="color:#fff;" href="" >Remember Me?</a> <a style="float:right;color:#fff;" href="">Forget Password</a> </div> <div class="social"> <a href="#"><div class="fb"><i class="fa fa-facebook-f"></i> Login With Facebook</div></a> <a href="#"><div class="tw"><i class="fa fa-twitter"></i> Login With Twitter</div></a> </div> <div style="margin-bottom:10px;" > <button type="button" class="btn btn-success btn-block">Sign In</button> </div> </div> </form> </div>

.formlogin{ position: absolute; margin: -150px 0 0 -150px; left: 50%; top: 50%;; overflow-x: hidden; overflow-y: hidden; } h3{ color:#fff; text-align:center; } .col{ background: #FF1493; box-shadow:10px 10px 30px 20px rgba(0, 243, 255, 0.54); overflow-x: hidden; overflow-y: hidden; } #ex2{ url('http://i.imgur.com/u0XmBmv.png') 20px top no-repeat; } /*social*/ .social{height:30px; line-height:30px; display:table; width:100%;margin-bottom:20px;} .social div{display:inline-block; width:42%; color:#eee; font-size:12px; text-align:center; border-radius:3px} .social div i.fa{font-size:16px; line-height:30px} .fb{background:#3B5A9A; border-bottom:solid 3px #036} .tw{background:#2CA8D2; margin-left:16%; border-bottom:solid 3px #3399CC} @media(max-width:480px){ .form{width:100%}}