<link href="//netdna.bootstrapcdn.com/bootstrap/3.0.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//netdna.bootstrapcdn.com/bootstrap/3.0.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"> <div class="row"> <div class="container-fluid login_main"> <h2 class="login_heading"> Welcome, let's get started </h2> <div class="login_wrapper"> <form class="login_form_0"> <div class="from-group form-group-lg"> <label for="name">Name </label> <input type="text" class="form-control" id="usr"> </div> <div class="from-group form-group-lg"> <label for="email">Email_Address: </label> <input type="email" class="form-control" id="email"> </div> <div class="form-group form-group-lg"> <label for="pwd">Password: </label> <input type="password" class="form-control" id="pwd"> </div> <div class="form-group form-group-lg"> <label for="Phone">Phone Number: </label> <input type="" class="form-control" id="number"> </div> </form> <div class="login_submit"> <a href="#"><button class="btn btn-primary btn-lg">Create Account</button></a> </div> <h3 class="login_or"> OR</h3> <div> <h3 class="login_or_another "> Already have an Account ? <a href="register.html"> Login</a> </h3> </div> </div> </div> </div> </div>

.login_main{ background-image: url(http://www.teluguwishesh.com/images/phocagallery/wallpapers/Nature/The-Amazing-Scene-of-nature/amazing-scene-of-nature-05.jpg); background-position: cover; background-position:repeat-y; } .login_heading{ text-align: center; color:green; margin-bottom: 30px; margin-top:120px; } .login_form_0{ } .login_wrapper{ max-width:500px; margin-left: 32%; margin-bottom: 115px; box-shadow: 0 12px 200px #e7e7e7; padding: 25px; } .login_wrapper label{ font-weight:500; font-style: 18px; padding: 5px; } .login_submit{ margin-left: 30%; } .login_submit_button_0 button{ margin-left: 40%; margin-top: 20px; } .login_or{ opacity: 0.7; text-align: center; font-weight: 400; } .login_or_0{ opacity: 0.7; color: white; text-align: center; font-weight: 400; } .login_or_another{ text-align: center; font-weight:500; color:white; } .login_or_another a{ color:white; } .login_form_1{ margin-top: 80px; color: white; text-align: center; font-weight: 400; } .login_check_0{ margin-top: 7px; } .login_check_1{ font-size: 18px; margin-left:-305px; } .login_check_1 input[type="checkbox"]{ width:20px; height: 20px; margin-top: 0px; } @media only screen and (max-width: 787px) { .login_check_0{ margin-left:90px; } .login_wrapper{ margin-left: 1px; } .login_or_another{ font-size: 22px; } }