<link href="//netdna.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css"> <script src="//netdna.bootstrapcdn.com/bootstrap/3.2.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="login-body"> <article class="container-login center-block"> <section> <div class="tab-content tabs-login col-lg-12 col-md-12 col-sm-12 cols-xs-12"> <div id="login-access" class="tab-pane fade active in"> <h2><i class="glyphicon glyphicon-leaf"></i> SisNutri</h2> <form method="post" accept-charset="utf-8" autocomplete="off" role="form" class="form-horizontal"> <div class="form-group "> <label for="cpf" class="">CPF</label> <input type="text" class="form-control" name="login" id="cpf" placeholder="CPF" tabindex="1" value="" /> </div> <div class="form-group "> <label for="senha" class="">Senha</label> <input type="password" class="form-control" name="password" id="senha" placeholder="Senha" value="" tabindex="2" /> </div> <div class="form-group" align="right"> <span align="right"><a>esqueci minha senha</a></span> </div> <br/> <div class="form-group "> <button type="submit" name="log-me-in" id="submit" tabindex="5" class="btn btn-lg btn-primary">Entrar</button> </div> </form> </div> </div> </section> </article> </div>

body { font-family: Open Sans; font-size: 14px; line-height: 1.42857; background: #333333; height: 350px; padding: 0; margin: 0; } .container-login { min-height: 0; width: 480px; color: #333333; margin-top: 40px; padding: 0; } .center-block { display: block; margin-left: auto; margin-right: auto; } .container-login > section { margin-left: 0; margin-right: 0; padding-bottom: 10px; } #top-bar { display: inherit; } .nav-tabs.nav-justified { border-bottom: 0 none; width: 100%; } .nav-tabs.nav-justified > li { display: table-cell; width: 1%; float: none; } .container-login .nav-tabs.nav-justified > li > a, .container-login .nav-tabs.nav-justified > li > a:hover, .container-login .nav-tabs.nav-justified > li > a:focus { background: #ea533f; border: medium none; color: #ffffff; margin-bottom: 0; margin-right: 0; border-radius: 0; } .container-login .nav-tabs.nav-justified > .active > a, .container-login .nav-tabs.nav-justified > .active > a:hover, .container-login .nav-tabs.nav-justified > .active > a:focus { background: #ffffff; color: #333333; } .container-login .nav-tabs.nav-justified > li > a:hover, .container-login .nav-tabs.nav-justified > li > a:focus { background: #de2f18; } .tabs-login { background: #ffffff; border: medium none; margin-top: -1px; padding: 10px 30px; } .container-login h2 { color: #1fa67b; } .form-control { background-color: #ffffff; background-image: none; border: 1px solid #999999; border-radius: 0; box-shadow: 0 1px 1px rgba(0, 0, 0, 0.075) inset; color: #333333; display: block; font-size: 14px; height: 34px; line-height: 1.42857; padding: 6px 12px; transition: border-color 0.15s ease-in-out 0s, box-shadow 0.15s ease-in-out 0s; width: 100%; } .container-login button { background-color: #1fa67b; border-color: #073325; color: #ffffff; border-radius: 0; font-size: 18px; line-height: 1.33; padding: 10px 16px; width: 100%; } .container-login button:hover, .container-login button:focus { background: #029f5b; border-color: #00875C; }