html, body {margin: 0; padding: 0; font-size: 16px;}
header, footer {width:100%; height:50px;}
.left {float: left;}
.right {float: right;}
header {
	padding: .5rem;
	box-sizing: border-box;
}
header #logout {float: right;}
#contenedor {
	width: 80%;
	margin: 0 auto;
}
#login {
	width: 30%;
	margin: 20% auto;
}
#login > * {
	display: block;
	width: 100%;
}
#login input {
	box-sizing: border-box;
	margin-bottom: 1rem;
}
#filtros {
	display: flex;
	flex-direction: row;
	justify-content: center;
	flex-wrap: nowrap;
}
#filtros > * {width: 100%;}
#productos {
	display: flex;
	flex-direction: column;
}
.producto {padding: .6rem 1rem .5rem;}
.producto.desplegable {cursor: pointer;}
.producto.even {background-color: #eee;}
.producto.oculto {display: none;}
.producto > * {width: 100%;}
.producto .cabecera .right i {line-height: 3.4rem;}
.producto .cuerpo {
	max-height: 0;
	overflow: hidden;
	transition: max-height 0.2s ease-out;
}
.producto .cuerpo h3 {text-transform: uppercase;}
#cargar-mas {margin: 1rem 0;}
#cargar-mas * {
	display: block;
	text-align: center;
	width: 100%;
}
#cargar-mas i {font-size: 3rem;}