/* General */
.error {
	border-bottom: 1px solid red;
}

body {
	background: white;
}

.menu {
	padding-left: 78px;
}

.barra {
	margin-bottom: 0 !important;
}

form {
	width: 70%;
	position: relative;
}

form label {
	font-size: 14px;
	position: relative;
}

form > label input {
	width: 100%;
}

form input:not([type='submit']) {
	border: none;
	border-bottom: 1px solid #dadada;
	color: #949494;
	padding: 10px;
}

/* Sección */
#login {
	width: 40%;
	padding-left: 78px;
}

#login p {
	font-size: 16px;
	margin-bottom: 20px;
}

#login p span {
	margin-top: 5px;
}

#login h2 {
	font-size: 36px;
	font-weight: 900;
	margin-bottom: 20px;
}

#login > a {
	padding: 20px 0 5px;
	display: block;
}

/* Iniciar sesión */
#iniciar > label {
	margin-bottom: 20px;
}

#iniciar input[type='checkbox'] {
	margin-right: 5px;
}

#iniciar .pass {
	width: 15px;
	height: 13px;
	display: block;
	background: url(/assets/css/icons/ojo.svg);
	font-size: 0;
	position: absolute;
	right: 0;
	top: 11px;
}

/* Olvidé contraseña */
#recuperar > input {
	width: 20px;
	height: 17px;
	display: block;
	background: url(/assets/css/icons/enviar.png);
	font-size: 0;
	position: absolute;
	right: 0;
	top: 12px;
	border: 0;
	padding: 0;
	cursor: pointer;
}

#recuperar span {
	font-size: 13px;
	margin-top: 10px;
}

/* Fondo con imagen */
#background {
	width: 60%;
	height: calc(100vh - 55px);
	display: block;
	background: url(ui/login.png) top center;
	background-size: cover;
}

/* TABLET */
@media ( max-width: 1000px ) {	
	/* General */
	header {
		height: 50px;
	}
	
	form {
		width: 100%;
	}
	
	/* Sección */
	#login {
		width: 50%;
		height: calc(100vh - 55px);
		padding-left: 0;
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		-webkit-box-orient: vertical;
		-webkit-box-direction: normal;
		    -ms-flex-direction: column;
		        flex-direction: column;
		-webkit-box-pack: center;
		    -ms-flex-pack: center;
		        justify-content: center;
		margin: auto;
	}
	
	/* Fondo con imagen */
	#background {
		display: none;
	}
}

/* MOBILE */
@media ( max-width: 767px ) {
	/* General */
	.menu {
		padding-left: 0;
		margin: auto;
	}
	
	/* Sección */
	#login {
		width: 80%;
		margin-top: 30px;
	}
	
	#login p {
		display: block;
		font-size: 14px;
	}
	
	#login h2 {
		font-size: 28px;
	}
	
	/* Iniciar sesión */
	#iniciar > div {
		display: block;
	}
	
	#iniciar > div > input {
		margin: 20px auto 0;
	}
}