/* GLOBALES ------------------------------------------------------------------------ */
@font-face {
	font-family: 'Roboto';
	src: url('Roboto-Regular.ttf');
	font-family: 'Roboto-light';
	src: url('Roboto-Light.ttf') ;
}
@font-face {
	font-family: 'MeathFLF';
	src: url('MeathFLF.ttf');
}
body {font-size:1em;margin:0;padding:0;background:#f1f1f1;font-family:'Roboto-light';}

/* CABECERA ------------------------------------------------------------------------ */
header { width:100%;height:6em;background:#292929;/*padding:0 5% 0 5%;*/overflow:hidden;font-family:'MeathFLF';}
header a {text-decoration:none;color:#5fa01f;}
header h1 {padding:0;text-align:center;}
header h1 img  {height:1em;margin-right:0.5em;vertical-align: top;}
#zona-gestion {float:right;margin:0 5% 0 0;padding:0;list-style:none;width:20em;display:inline-block;}
#zona-gestion li {color:#fff;height:3em;margin:1.5em 0 1.5em 2em;float:left;width:4em;}
#zona-gestion li img {height:100%;}
#zona-gestion-carrito {}
#zona-gestion-usuario {}

@media screen and (max-width: 760px) {
	header {position:fixed;z-index:10;height:5em}
	header .logo {z-index:10;height:auto;width:70%;margin:0.25em 15% 0 15%;}
	#zona-gestion {float:none;width:100%;text-align:center;}
	#zona-gestion li {height:1.5em;margin:0.5em 1em 0.5em 1em;display:inline-block;float:none;}
}

/* CONTENIDO GENERAL ------------------------------------------------------------------------ */
main { padding-bottom:12vh;text-align:center;}
	a { text-decoration:none;}
h2 { text-align:center;text-transform:uppercase;letter-spacing:2px;}

#login, #registro {text-align:center;}
#login input, #registro input {border-style:solid;border-width:1px;margin:0.5em 0 0.5em 0;width:80%;text-align:center;padding:0.5em;}
#login .boton-login, #registro .boton-registro {background:#56a61e;color:#fff;font-weight:600;letter-spacing:1px;}
#login a, #login a:visited, #registro a, #registro a:visited, .enlace-destacado { text-decoration: none;color: #56a61e;}
#error_email,#error_password {color:#f00;font-style:italic;}

#promociones {height:50vh;width:100%;background:#cccccc;}
#promociones img {height: 100%;width: 100%;object-fit: cover;position: relative;top: 0;left: 0;}
#promociones a {display: inline-block;width: 10vw;margin: 0 44vw 0 44vw;text-decoration:none;color:#fff;}
#promociones .promociones-boton {
	text-align:center;border-style:solid;border-width:2px;border-color:#fff;color:#fff;background:rgba(0,0,0,0.5);font-weight:bold;letter-spacing:2px;text-transform:uppercase;
	position:relative;top:-15vh;
	padding: 0.5em 1vw 0.5em 1vw; }
#promociones .promociones-boton:hover {background:rgba(255,255,255,0.9);border-color:#000;}
#promociones .promociones-boton:hover  {color:#000;}

#categorias {display:inline-block;margin:0 10% 0 10%;width:80%;}
#categorias a { display:inline-block;float:left;width:29%;margin:1em 10% 1em 10%;border-style:solid;text-decoration:none;
	border-style:solid;border-width:2px;border-color:#fff;color:#fff;background:rgba(0,0,0,0.3);
	border-radius: 5px 5px 5px 5px; -moz-border-radius: 5px 5px 5px 5px; -webkit-border-radius: 5px 5px 5px 5px;}
#categorias a:hover {background:rgba(255,255,255,0.9);border-color:#000;}
#categorias a:hover {color:#000;}
#categorias h4 {text-align:center;text-transform:uppercase;letter-spacing:1px;}

#platos {display:inline-block;margin:0 10% 0 10%;width:80%;text-align:center;}
.plato {border-style:solid;border-width:1px 0 1px 0;border-color:#000;color:rgb(130, 133, 133);background:#fff;
	/*border-radius: 5px 5px 5px 5px; -moz-border-radius: 5px 5px 5px 5px; -webkit-border-radius: 5px 5px 5px 5px;*/
	display:inline-block;width:49%;
	/*max-height:6em;*/
	margin:0.1em 0 0.1em 0;
	}
.plato_imagen {float:left;position:relative;width:15%;height:100%;max-height:8em;}
.plato_imagen img {height:100%;width:100%;object-fit:cover;}
.plato_info {float:right;width:85%;}
.plato_info h4 {text-transform:uppercase;width:100%;letter-spacing:1px;text-align:center;margin:0;padding:0.2em;box-sizing: border-box;}
.plato_info_precio {width:100%;text-align:center;padding:0.2em 0 0 0;box-sizing: border-box;margin:0 0 1.5em 0;}
.plato_info_descripcion {clear:both;width:100%;text-align:left;padding:0.4em 0.4em 0 0.4em;box-sizing: border-box;}

.plato_info_mas {width:50%;float:left;text-align:center;}
.plato_info_pedir {width:50%;float:left;text-align:center;}
.plato_info_boton {
	border-style:solid;border-width:1px;
	border-radius: 5px 5px 5px 5px; -moz-border-radius: 5px 5px 5px 5px; -webkit-border-radius: 5px 5px 5px 5px;
	padding:4px;text-transform:uppercase;letter-spacing:2px;
	}

.boton_resaltado {background:#ebfde8; font-weight:bold;}
.alergeno {height:2em;margin: 0 5px 0 5px;}

.plato a { text-decoration:none;color:#000;}

#plato_informacion_adicional {
	display:none;
	position:fixed;width:100%;height:100%;
	top:0;padding:6em 0 0 0;z-index:2;
	background:rgba(255,255,255,0.95);
}

/* VENTANA DE INICIO DE SESION ----- */

#inicio-sesion input { width:80%;margin:0.5em 10% 0.5em 10%;padding:0.5em;box-sizing: border-box;}


.boton-inicio-sesion {background:#5fa01f;border-style:solid;border-width:1px;border-color:#5fa01f;color:#fff;font-weight:bold;}

/* VENTANA DE PLATOS-PEDIR ------- */
.plato_pedir input { text-align:center;width:20%;margin:0 1em 0 1em;padding:0.5em; }
.boton_verde {color: #fff;background: #5fa01f;display: inline-block;padding: 0.2em 0.5em 0.2em 0.5em;box-sizing: border-box;}

/* VENTANA DE VER-PEDIDO ---------- */
.pedido-linea {clear:both;display:inline-block;margin:0 0 1.5em 0;}
.pedido-linea h4 { width:60%;float:left;margin:0;padding:0;text-align:left;}
.pedido-linea-unidades { width:40%;float:left;text-align:center;}
.pedido-linea-unidades input { text-align:center;width:40%;margin:0 0.5em 0 0.5em;padding:0.5em; }
.pedido-linea-unidades span {color: #fff;background: #5fa01f;display: inline-block;padding: 0.2em 0.5em 0.2em 0.5em;box-sizing: border-box;}

#enlace_buscar_mas_platos {text-decoration:none;display:inline-block;width:80%;margin: 1em 10% 1em 10%;text-align: center;text-transform: uppercase;color:#000;}
#enlace_buscar_mas_platos:visited {color:#000;}
#enlace_buscar_mas_platos img {height:1em;margin:0 0.5em 0 0;}

/* VENTANA VER-PERFIL --------- */

#ficha-cliente-formulario {width:96%;margin:0 2% 0 2%;}
#ficha-cliente-formulario input {
width: 100%;
border-width: 0 0 2px 0;
text-align: center;
margin-bottom: 1em;
height: 2em;
background: rgba(0,0,0,0.2);
color: #fff;
font-size: 1.1em;
}

.ficha-cliente-pedido {
	position:relative;
	text-align:left;
	background:#fff;
	width:96%;margin:0 2% 0.4em 2%;
	border-radius: 0.6em 0.6em 0.6em 0.6em; -moz-border-radius: 0.6em 0.6em 0.6em 0.6em; -webkit-border-radius: 0.6em 0.6em 0.6em 0.6em;
	border-style:solid;border-width:1px;border-color:#ccc;
	box-sizing: border-box;
	padding:0.5em;
}
.ficha-cliente-pedido h4 {margin:0;padding:0;font-size:1.1em;font-weight:bold;}
.ficha-cliente-pedido p {margin:0;font-size:0.9em;color:#464646;}

.ficha-cliente-pedido-info {width:80%;}
.ficha-cliente-pedido-estado {
	float:right;z-index:2;position:absolute;top:1em;right:1em;
	height:2em;width:2em;
	border-radius: 2em 2em 2em 2em; -moz-border-radius: 2em 2em 2em 2em; -webkit-border-radius: 2em 2em 2em 2em;
	border-style:solid;border-width:1px;
	box-sizing: border-box;
	padding:0.5em;text-align:center;
	color:#f27e45;border-color:#f27e45;background:#f7d6c6;
	font-weight:bold;
}

.estado-pendiente {background-color:#ff9d9d;border-color:#ff0000;color:#ff0000}
.estado-preparacion {background-color:#ffe79d;border-color:#f2a645;color:#f2a645;}
.estado-reparto {background-color:#9dffe3;border-color:#4580f2;color:#4580f2;}
.estado-entregado {background-color:#60d75c;border-color:#26bd3e;color:#26bd3e;}

.estado-pedido h4 {background: #fff;margin: 0;padding: 0.5em 0 0.5em 0;}

@media screen and (max-width: 760px) {
	main {padding-top:5em;}
	#promociones {height:30vh;}
	#promociones a { width:80%;margin:0 10% 0 10%;}
	#categorias a {width:100%;margin:0.5em 0 0.5em 0;}
	#platos {width:100%;margin:0;}
	.plato {width:100%;max-height:none;}
	.plato_imagen {/*display:none;*/width:20%;}
	.plato_info {width:80%;}
	}
	
/* MENUS ------------------------------------------------------ */
#menu-del-dia {text-align:center;width:70%;margin: 0 15% 0 15%;display:inline-block;}
.menu-del-dia-seccion {float:left;width:50%;}
.menu-del-dia-opciones {clear:both;width:100%;}
@media screen and (max-width: 760px) {
	#menu-del-dia {width:90%;margin: 0 5% 0 5%;}
	.menu-del-dia-seccion {float:none;width:100%;}
	}

/* PIE DE PÁGINA ------------------------------------------------------------------------ */
footer {background:#292929;color:#fff;position:fixed;height:8em;width:100%;bottom:0;z-index:10;} 
footer a {color:#fdad00 !important;}
footer section {width:25%;float:left;text-align:center;position:relative;}
footer section img {height:6em;margin-top:1em;}
#pedido-cantidad-productos {
	position: relative;float: right;z-index: 50;right: 25%;margin-top: 20%;
	background: #f00;color: #fff;height: 1.2em;min-width: 1.2em;
	border-radius: 0.6em 0.6em 0.6em 0.6em; -moz-border-radius: 0.6em 0.6em 0.6em 0.6em; -webkit-border-radius: 0.6em 0.6em 0.6em 0.6em;
	overflow:hidden;font-weight:bold;padding:0.1em;
}


@media screen and (max-width: 760px) {
	footer {height:5em;}
	footer section img {height:3em;margin-top:1em;}
	}