@charset "utf-8";
@import url(https://fonts.googleapis.com/css?family=Roboto);

#inicio{
    background-image: url(../img/fondo-inicio2.png);
    background-attachment: fixed;
    background-size: cover;
    background-position: center;
    }

body{background-image: url(../img/fondo-liso-02.png);
    background-attachment: fixed;
    background-size: cover;
    background-position: center; }

#portada {display: flex;}

img {width: 100%;}

#titulos {display: flex;
justify-content: center;}

#titulos h3 {
    color:#D40E0D;
    margin: 0.5em 0 0 0;
    width: 8em;
    font-family: 'Roboto';
    display: flex;
    justify-content: center;}

/*----------------------------------------------------------------------INDEX*/

#botones-inicio nav div ul

    {display: flex;
    
    flex-direction: row;
    flex-wrap: nowrap;
    width: 16em;
    list-style: none;
    margin: 4em 1em 1em 2em;
    padding: 0;}

#botones-inicio nav div ul li {
    margin: 0 0.5em 0 0;}

#iniciar {display: flex;}

h4{ display: flex;

   padding: 0.75em;
   color: white;
   font-family: 'Roboto';
    margin: 16em 11.5em 0em 0em 
}

#iniciar .row2{
    width: 5em;
    list-style: none;
    display: flex;
    margin: 0 0 0.2em 0;
    }
#iniciar .rowt{
    list-style: none;
    display: flex;
    justify-content: center;
    flex-direction: column;
    margin: 0 0 0.2em 0.7em;
    padding: 0;
    
    }
form{
    color: #E0BE72;
    list-style: none;
    display: flex;
    justify-content: center;
    flex-direction: column;
    margin: 0 0 0 0;
    padding: 0;
    font-family: 'Roboto'; font-weight: 400;
    
   }
legend{font-family: 'Roboto'; font-weight: 600;
       text-align: center;
margin: 0 0 1em 0;}

input{
    margin:0 0 0 0;
    padding: 0.3em;
    border: 0;
    border-radius: 16px;
    background-color:#F9E120;
    font-family: 'Roboto'; font-weight: 400;
    color: #7b400d;
    width: 10em;
   
}


#ingresar {display: flex;
flex-direction: row;
margin:0 0 0 0}

#ingresar nav div ul {
    display: flex;
    margin-left: -2em;
    font-family: 'Roboto'; font-weight: 400;
    }

#ingresar nav div ul li {
    display: flex;
    justify-content: center;
    padding: 1em;
    width: 6em;
    margin: 0 0 0 0;
    background-color: #54A891; 
    border-radius: 16px;  }

#ingresar nav div ul li a {
    display: flex;
    text-decoration: none;
    list-style: none;
    color:#7b400d;
    }

/*-------------------------------------------------  pantalla registrarse*/
#fondoespecial{
    background-image: url(../img/fondorojo-03.png)
}

#formularioregistrarse{
    display: flex;
    justify-content: center;
}

#formularioregistrarse form{
    color: #F9E120;
    list-style: none;
    display: flex;
    justify-content: center;
    flex-direction: column;
    margin: 4em 0 0 0;
    padding: 0;
    font-family: 'Roboto'; font-weight: 400;
    
 }

legend{font-family: 'Roboto'; 
font-weight: 600;
text-align: center;
margin: 0 0 1em 0;
color:#ffffff;}

input{
    
    justify-content: center;
    margin: 0 0 0 0;
    width: 17em;
    padding: 0.3em;
    border: 0;
    background-color:#F9E120;
    font-family: 'Roboto'; 
    font-weight: 400;
    color: #7b400d;
    border-radius: 10px;
}

#campo3{
    margin: 1em 0 0 0em;
    background-color: #54A891;
    padding: 1em;
    border: 0;
    border-radius: 16px;
    color:#7b400d;
    font-family: 'Roboto'; font-weight: 400;
    width: 10.7em;
}

#enviar nav div ul li {
    list-style: none;

}

/*---------------------------------------------------EXITO*/



 #fondoespecial{background-color: #D40E0D;
}

#manito {padding: 3em;}

#comenzar{
 display: flex;
 justify-content: center;
 }

#comenzar img{
    width: 7em;
}

#h2amarillo h2 {font-family: 'Roboto'; 
   font-weight: 600;
   text-align: center;
   padding: 0.30em;
   margin: -1.5em 0 0 0;
   color:#F9E120;
}

#h5amarillo h5{text-align: center;
color: #F9E120;
font-family: 'Roboto';
font-weight: 100;    
font-size: smaller;
margin: 0 em 0 4em;
}

/*--------------------------------------------------BOTONERA*/


#botonera {display: flex;}

#botonera nav div ul
    {
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin: 5em 0em 0em 0em;
    padding: 0;}


#botones1 {display: flex;}

#botones1 nav div ul{
     display: flex;
     justify-content: center;}

#botones2 {display: flex;}



#botones1 a img {width: 80%;
margin:0 0 0 1em;}

#botones2 a img {width: 80%;
margin:0 0 0 1em;}

#botonera nav div ul li a{ 
display: block;
margin: 0 0 1.5em 0;}


/*----------------------------------------------------------pantalla plato del dia*/



#platodeldiaacp {
    width: 100%;
    
}

#platodeldiaacp img{
    width: 100%;
}

#titulos {display: flex;
justify-content: center;}

#titulos h3 {
    color:#D40E0D;
    margin: 0.5em 0 0.5em 0;
    width: 8em;
    font-family: 'Roboto';
    display: flex;
    justify-content: center;}

#especificaciones h3{
    width: 100%;
    color: #D40E0D;
    font-family: 'Roboto';
}

#especificaciones2{
    display: flex;
    flex-direction: row;
    margin: -1.8em 0 0 0;
    
}

#especificaciones2 p{
    display: flex;
    width: 100%;
    color: #D40E0D;
    font-family: 'Roboto';
    display: block;
}


#especificaciones2 aside{
    color: #D40E0D;
    font-family: 'Roboto';
    display: block;
    text-align-last: right;
    
    
}

#especificaciones2 aside h1 input{
    color: #D40E0D;
    font-family: 'Roboto';
    display: block;
    margin-left: 0.5em;
    font-weight: bold;
}
#especificaciones2 input{ 
    margin-left: 3em;
    border: none;
    width: 1em;
    }

#estrellitas{ 
width: 40%;
margin: -0.5em 0 1.5em 0;
}


#cancelar {display: flex;
justify-content: center;
}

#campobebida3{
    display: flex;
    justify-content: center;
    margin: 0em 0 0 0em;
    background-color: #54A891;
    padding: 1em;
    border: 0;
    border-radius: 16px;
    color:#7b400d;
    font-family: 'Roboto'; font-weight: 400;
    width: 10.7em;
}


#agregar{
    width: 30%;
    margin: 0 0 1em 0;
}
    
#agregar img{
    width: 100%;
}


/* --------------------------------------------------------------BEBIDAS */

#botonerabebida {display: flex;}

#botonerabebida nav div ul
    {
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    margin: 0em 0em 0em 0em;
    padding: 0;}


#botonesbebida1 {display: flex;}

#botonesbebida1 nav div ul{
     display: flex;
     justify-content: center;}

#botonesbebida2 {display: flex;}



#botonesbebida1 a img {width: 80%;
margin:0 0 0 1em;}

#botonesbebida2 a img {width: 80%;
margin:0 0 0 1em;}

#botonerabebida nav div ul li a{ 
display: block;
margin: 0 0 1.5em 0;}

#cancelarconfirmar{display: flex;
justify-content: center;
}

#cancelarconfirmar nav div ul {
    display: flex;
    margin: 1em 2em 0 0;
    flex-direction: row;
    font-family: 'Roboto'; font-weight: 400;
    text-align: center;}

#cancelarconfirmar nav div ul li {
    display: flex;
    justify-content: center;
    padding: 1em;
    width: 6em;
    margin: 0 0.5em 0 0;
    background-color: #54A891; 
    border-radius: 16px;  }

#cancelarconfirmar nav div ul li a {
    display: flex;
    text-decoration: none;
    list-style: none;
    color:#7b400d;
    }

/*----------------------------------------------------------MENÚ*/
    
    
#informacionextra {display: flex;
justify-content: center;}
#informacionextra nav div ul{
    display: flex;
    flex-direction: row;
    margin: 0em 0 0 0;
    list-style: none;
    flex-wrap: nowrap;
    padding: 0;
    width: 21em;
   
}

#informacionextra img{
    width: 100%;
    display: block;
}
#carta {display: flex;
justify-content: center;}

#carta nav div ul{
    margin: 1em 3em 0 0;
    display: flex;
    flex-direction: column;
    list-style: none;
    width: 14.5em;
   
}

/*-------------------------------------------------MENÚ 2DA PARTE*/

#botoneracomida {display: flex;}

#botoneracomida nav div ul
    {
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    margin: 1em 0em 0em 0em;
    padding: 0;
    }


#botonescomida1 {display: flex;}

#botonescomida1 nav div ul{
     display: flex;
     justify-content: center;}

#botonescomida2 {display: flex;}



#botonescomida1 a img {width: 80%;
margin:0 0 0 1em;}

#botonescomida2 a img {width: 80%;
margin:0 0 0 1em;}

#botoneracomida nav div ul li a{ 
display: block;
margin: 0 0 1.5em 0;}


/*----------------------------------------------------COMENTARIOS*/

#comentariosfondo{
    background-image: url(../img/fondo-liso-02.png)
}

+