<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 ----------> <nav class="navbar navbar-default visa-navbar"> <div class="container-fluid"> <div class="navbar-header"> <a class="navbar-brand " href="#"> <img alt="Brand" src="http://airzone-eg.com/wp-content/themes/airzone/assets/img/logo-visa.png" width=100 > </a> </div> <ul class="nav navbar-nav navbar-right " style="display:inline-block;margin-top:25px;" > <li><a class="" style="color:white !important" href="#">Have an account ?</a></li> <li><a class="" style="color:white !important" href="#">Sign In</a></li> </ul> </div> </nav> <div class="container"> <div class="row "> <h1 style="margin-bottom:0;" align ="center"> Confirm your Email</h1> <h1 style="margin-top:0;" align ="center">address</h1> <div class="col-md-offset-4 col-md-4"> <h4 align="center">To confirm your identity, we've sent a code to</h4> <h4 align="center">john@smith.com</h4> <h4 align="center">Please enter the code to continue.</h4> <form class="main_form"> <input type="text" name="textfield" placeholder ="1" class="txt col-sm-1"/> <input type="text" name="textfield" placeholder ="1" class="txt col-sm-1"/> <input type="text" name="textfield" placeholder ="1" class="txt col-sm-1"/> <input type="text" name="textfield" placeholder ="1" class="txt col-sm-1"/> <input type="text" name="textfield" placeholder ="1" class="txt col-sm-1"/> <div class="btn-group center-block"> <a class="btn btn-default visa-button ">Continue </a> <a class="btn btn-default visa-button ">Continue </a> </div> </form> </div> </div> <div class="row "> <a class="btn btn-default visa-button center-block col-md-offset-6 " style="width:200px">Continue </a> </div> </div>

form_main { width: 100%; } .form_main h4 { font-family: roboto; font-size: 20px; font-weight: 300; margin-bottom: 15px; margin-top: 20px; text-transform: uppercase; } .heading { border-bottom: 1px solid #fcab0e; padding-bottom: 9px; position: relative; } .heading span { background: #9e6600 none repeat scroll 0 0; bottom: -2px; height: 3px; left: 0; position: absolute; width: 75px; } .form { border-radius: 7px; padding: 6px; } .txt[type="text"] { border: 1px solid #ccc; margin: 10px 0; padding: 10px 0 10px 5px; width: 100%; border-left:none; border-right:none; border-top:none; } [type="checkbox"] { width:20px; height:20px; } .txt_3[type="text"] { margin: 10px 0 0; padding: 10px 0 10px 5px; width: 100%; } .txt2[type="submit"] { background: #242424 none repeat scroll 0 0; border: 1px solid #4f5c04; border-radius: 25px; color: #fff; font-size: 16px; font-style: normal; line-height: 35px; margin: 10px 0; padding: 0; text-transform: uppercase; width: 30%; } .txt2:hover { background: rgba(0, 0, 0, 0) none repeat scroll 0 0; color: #5793ef; transition: all 0.5s ease 0s; } .checkbox label { color : #ccc; text-size:0.6em; } #login-header{ color:#1a1f71; } .visa-navbar { background-color:#1a1f71 ; height:100px; } .visa-navbar navbar-right{ color : white; margin-top:25px; font-size:1.1em; } .visa-button { width:50%; background-color:#1a1f71 ; color:white; } .main_form [type=text] { display:inline; margin-left:20px; width:40px; }