HTML

  <div class="contenedor">
    <form class="formulario">       
      <h2 class="formulario-cabecera">Inicie sesion</h2>
      <input type="text" class="formulario-control" name="username" placeholder="Correo Electronico" required="" autofocus="" />
      <input type="password" class="formulario-control" name="password" placeholder="Contraseña" required=""/>   
      <label class="checkbox">
        <input type="checkbox" value="recuerdame" id="recuerdaMe" name="recuerdaMe"> Recuerdame
      </label>
      <button class="btn btn-lg btn-primary btn-block" type="submit">Entra</button>   
    </form>
  </div>
CSS

@import "bourbon";

body {
	background: #eee !important;	
}

.contenedor {	
	margin-top: 80px;
  margin-bottom: 80px;
}

.formulario {
  max-width: 380px;
  padding: 15px 35px 45px;
  margin: 0 auto;
  background-color: #fff;
  border: 1px solid rgba(0,0,0,0.1);  

  .formulario-cabecera,
	.checkbox {
	  margin-bottom: 30px;
	}

	.checkbox {
	  font-weight: normal;
	}

	.formulario-control {
	  position: relative;
	  font-size: 16px;
	  height: auto;
	  padding: 10px;
		@include box-sizing(border-box);

		&:focus {
		  z-index: 2;
		}
	}

	input[type="text"] {
	  margin-bottom: -1px;
	  border-bottom-left-radius: 0;
	  border-bottom-right-radius: 0;
	}

	input[type="password"] {
	  margin-bottom: 20px;
	  border-top-left-radius: 0;
	  border-top-right-radius: 0;
	}
}
Categorías: Uncategorized

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Copy Protected by Chetan's WP-Copyprotect.