<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 ----------> <!--forms--> <link href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet" integrity="sha384-wvfXpqpZZVQGK6TAh5PVlGOfQNHSoD2xbE+QkPxCAFlNEevoEH3Sl0sibVcOQVnN" crossorigin="anonymous"> <div class="space-medium"> <div class="container"> <div class="row"> <div class="col-lg-6 col-md-6 col-sm-6 col-xs-12"> <div class="account-holder"> <!--login-form--> <h3>Login to Today’s Fashion</h3> <br> <div class="social-btn"> <h6>Sign in With</h6> <div class="fb-btn"> <i class="fa fa-facebook-official"></i><a href="#" class="fb-btn-text">facebook</a> </div> <div class="google-btn"> <i class="fa fa-google"></i><a href="#" class="google-btn-text">Google</a> </div> </div> <div class="row"> <form> <div class="col-lg-12 col-md-12 col-sm-6 col-xs-12"> <div class="form-group"> <label class="control-label required" for="email">Email<sup style="color:red">*</sup></label> <input id="email" name="email" type="text" class="form-control" placeholder="Enter Email Address"> </div> </div> <div class="col-lg-12 col-md-12 col-sm-6 col-xs-12"> <div class="form-group"> <label class="control-label required" for="email">Password<sup style="color:red">*</sup></label> <input id="password" name="password" type="password" class="form-control" placeholder="password"> </div> <a href="#" class="forgot-password">Forgot Password?</a> </div> <div class="col-lg-12 col-md-12 col-sm-6 col-xs-12"> <button class="btn btn-primary btn-block">Login</button> <div class="checkbox"> <label> <input type="checkbox" value=""> <p>Remember Me?</p> </label> </div> </div> </form> </div> </div> </div> <!--/.login-form--> <!--sing-up-form--> <div class="col-lg-6 col-md-6 col-sm-6 col-xs-12"> <div class="account-holder"> <h3>Signup With Today’s Fashion</h3> <br> <div class="social-btn"> <h6>Sign up With</h6> <div class="fb-btn"> <i class="fa fa-facebook-official"></i><a href="#" class="fb-btn-text">facebook</a> </div> <div class="google-btn"> <i class="fa fa-google"></i><a href="#" class="google-btn-text">Google</a> </div> </div> <div class="row"> <form> <div class="col-lg-12 col-md-12 col-sm-6 col-xs-12"> <div class="form-group"> <label class="control-label required" for="name"> Name<sup style="color:red">*</sup></label> <input id="name" name="name" type="text" class="form-control" placeholder="Enter Your NAme"> </div> </div> <div class="col-lg-12 col-md-12 col-sm-6 col-xs-12"> <div class="form-group"> <label class="control-label required" for="phone">Phone<sup style="color:red">*</sup></label> <input id="phone" name="phone" type="text" class="form-control" placeholder="Enter Mobile Number"> </div> </div> <div class="col-lg-12 col-md-12 col-sm-6 col-xs-12"> <div class="form-group"> <label class="control-label required" for="email">Email<sup style="color:red">*</sup></label> <input id="email" name="email" type="text" class="form-control" placeholder="Enter Email Address"> </div> </div> <div class="col-lg-12 col-md-12 col-sm-6 col-xs-12"> <div class="form-group"> <label class="control-label required" for="password">Password<sup style="color:red">*</sup></label> <input id="password" name="password" type="password" class="form-control" placeholder="password"> </div> <div class="mb30"> <p>Already have an account?   <a href="#">Login</a></p> </div> </div> <div class="col-lg-12 col-md-12 col-sm-6 col-xs-12"> <button class="btn btn-primary btn-block">Register</button> </div> </form> </div> </div> </div> <!--/.sing-up-form--> Created by <a href="https://goo.gl/aiZCwf" target="_blank">easetemplate</a> </div> </div> </div> </div> <!--/.forms-->

h1, h2, h3, h4, h5, h6 { font-weight: 600; color: #301c1e; font-family: 'Hind Siliguri', sans-serif; margin: 0px 0px 15px 0px; letter-spacing: 1.6px; text-transform: uppercase; } a { text-decoration: none; color: #301c1e; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; } a:focus, a:hover { text-decoration: none; color: #f25b6a; } /*------------------------ Account --------------------------*/ .account-holder { border: 1px solid #ededed; padding: 30px; } .social-btn { margin-bottom: 20px; } .fb-btn { border: 1px solid #ededed; padding: 7px 18px; display: inline-block; color: #3a549e; font-size: 14px; margin-bottom: 20px; } .fb-btn-text { padding-left: 8px; font-size: 14px; text-transform: uppercase; letter-spacing: 1.6px; color: #301c1e; font-weight: 700; } .google-btn { border: 1px solid #ededed; padding: 7px 18px; display: inline-block; color: #f04c42; font-size: 14px; margin-left: 10px; } .google-btn-text { padding-left: 8px; font-size: 14px; text-transform: uppercase; letter-spacing: 1.6px; color: #301c1e; font-weight: 700; } .forgot-password { color: #f25b6a; text-transform: uppercase; font-size: 12px; font-weight: 700; display: block; margin-bottom: 16px; } .btn { font-family: 'Hind Siliguri', sans-serif; font-size: 15px; text-transform: uppercase; font-weight: 600; padding: 14px 24px; margin-bottom: 4px; letter-spacing: 2.2px; border-radius: 0px; line-height: 1.6; border: transparent; -webkit-transition: all 0.3s; -moz-transition: all 0.3s; transition: all 0.3s; word-wrap: break-word; white-space: normal !important; } .btn-primary { background-color: #f25b6a; color: #fff; } .btn-primary:hover { background-color: #e14e5c; color: #fff; } /*----------------------- Form Elements: -------------------------*/ label { } .control-label { font-size: 14px; text-transform: uppercase; letter-spacing: 1px; color: #301c1e; margin-bottom: 10px; } .form-control:focus { } .textarea.form-control { } .required { } .form-control { border-radius: 0px; text-transform: capitalize; color: #aca5a5; font-size: 12px; font-weight: 500; width: 100%; height: 50px; padding: 14px; line-height: 1.42857143; background-image:; border: transparent; background-color: #f1f1f1; letter-spacing: 1px; margin-bottom: 10px; text-transform: uppercase; -webkit-box-shadow: inset 0 0px 0px rgba(0, 0, 0, .075); box-shadow: inset 0 0px 0px rgba(0, 0, 0, .075); } .input-group { position: relative; display: table; border-collapse: separate; } input[type=checkbox], input[type=radio] { margin: 8px 0 0; margin-top: 1px\9; line-height: normal; } input::-webkit-input-placeholder { color: #595857 !important; } textarea::-webkit-input-placeholder { color: #595857 !important; }