                * {
                    margin: 0;
                    padding: 0;
                    -webkit-box-sizing: border-box;
                    -moz-box-sizing: border-box;
                    box-sizing: border-box;
                }
                
                body {
                    font-family: 'Roboto', sans-serif;
                    font-size: 16px;
                }
                
                .contenedor {
                    width: 90%;
                    max-width: 1000px;
                    margin: auto;
                    overflow: hidden;
                }
                /*---------------HEADER-----------*/
                
                header {
                    width: 100%;
                    background: url('../img/bg.jpg') #281a0c;
                    background-size: cover;
                    background-attachment: fixed;
                    background-position: center 0;
                }
                
                header .contenedor {
                    position: relative;
                    height: 700px;
                }
                
                header .menu {
                    width: 100%;
                    text-align: right;
                }
                
                header .menu a {
                    color: white;
                    font-size: 20px;
                    font-weight: 300px;
                    display: inline-block;
                    margin: 40px 20px;
                    text-decoration: none;
                    position: relative;
                }
                
                header .menu a:hover {
                    text-decoration: underline;
                }
                
                header .textos {
                    width: 100%;
                    color: white;
                    position: absolute;
                    top: 50%;
                    margin-top: -52px;
                }
                
                header .textos .nombre {
                    font-size: 50px;
                    font-weight: 700px;
                }
                
                header .textos .nombre span {
                    font-weight: 400px;
                    color: yellow;
                }
                
                header .textos h3 {
                    font-size: 25px;
                    font-weight: 300px;
                    font-style: italic;
                }
                /*--------MAIN-------*/
                
                .main {
                    background: url('../img/bg-textura.png');
                    background-repeat: repeat;
                }
                
                .main .acerca-de .contenedor {
                    overflow: visible;
                    position: relative;
                }
                
                .main .acerca-de .foto {
                    width: 80%;
                    position: absolute;
                    left: 0;
                    top: -50px;
                    z-index: 0;
                    box-shadow: 0px 0px 15px rgba(0, 0, 0, .35);
                }
                
                .main .acerca-de .foto img {
                    vertical-align: top;
                    width: 100%;
                }
                
                .main .acerca-de article {
                    background: white;
                    padding: 40px;
                    width: 50%;
                    position: relative;
                    top: 400px;
                    z-index: 1;
                    box-shadow: 0px 0px 15px rgba(0, 0, 0, .35);
                    float: right;
                }
                
                .main .acerca-de article h3 {
                    font-size: 35px;
                    font-weight: 300px;
                    margin-bottom: 30px;
                }
                
                .main .acerca-de article p {
                    line-height: 25px;
                    margin-bottom: 30px;
                }
                
                .main .menu {
                    padding-top: 570px;
                    margin-bottom: 50px;
                }
                
                .main .menu .titulo {
                    font-size: 40px;
                    font-weight: 300px;
                    text-align: center;
                    margin-bottom: 40px;
                }
                
                .main .menu .contenedor-menu,
                .main .menu .contenedor-menu2 {
                    border: 1px solid black;
                    background: transparent;
                    padding: 10px;
                    overflow: hidden;
                }
                
                .main .menu article {
                    width: 50%;
                    float: left;
                    padding: 20px;
                }
                
                .main .menu .categoria {
                    font-size: 22px;
                    font-weight: 700px;
                    margin-bottom: 40px;
                    text-align: center;
                }
                
                .main .menu .platillo {
                    margin-bottom: 30px;
                    padding-bottom: 20px;
                    border-bottom: 4px dotted black;
                    overflow: hidden;
                    height: 120px;
                }
                
                .main .menu .nombre {
                    font-size: 20px;
                    margin-bottom: 15px;
                    float: left;
                }
                
                .main .menu .precio {
                    float: right;
                    font-size: 20px;
                    margin-bottom: 15px;
                }
                
                .main .menu .descripcion {
                    font-size: 16px;
                    color: #676767;
                    clear: both;
                }
                
                .main .galeria {
                    overflow: hidden;
                }
                
                .main .galeria .foto {
                    width: 25%;
                    float: left;
                }
                
                .main .galeria .foto img {
                    width: 100%;
                    vertical-align: top;
                    opacity: .7;
                    cursor: pointer;
                }
                
                .main .galeria .foto:hover img {
                    opacity: 1;
                    -webkit-transition: all .3s ease;
                    -o-transition: all .3s ease;
                    transition: all .3s ease;
                }
                
                .main .ubicacion {
                    background: white;
                    padding: 60px 0;
                    overflow: hidden;
                }
                
                .main .ubicacion .titulo {
                    text-align: center;
                    font-size: 40px;
                    line-height: 40px;
                    font-weight: 300px;
                    margin-bottom: 40px;
                }
                
                .main .ubicacion .direccion {
                    float: left;
                    width: 50%;
                    text-align: left;
                }
                
                .main .ubicacion .horario {
                    float: right;
                    width: 50%;
                    text-align: right;
                    overflow: hidden;
                }
                
                .main .ubicacion .direccion .calle {
                    margin-bottom: 15px;
                }
                
                .main .ubicacion .horario h4 {
                    margin-bottom: 20px;
                    text-align: center;
                }
                
                .main .ubicacion .horario .entre-semana,
                .main .ubicacion .horario .fin-semana {
                    width: 50%;
                    float: left;
                    text-align: center;
                }
                
                .main .mapa {
                    width: 100%;
                    overflow: hidden;
                }
                
                .main .mapa iframe {
                    width: 100%;
                    max-height: 600px;
                }
                /*------------FOOTER-----------*/
                
                footer {
                    background: black;
                }
                
                footer .copyright {
                    text-align: center;
                    padding: 15px 0;
                    color: white;
                }
                
                footer .copyright p {
                    margin-bottom: 15px;
                }
                /*------MEDIA QUERIES------*/
                
                @media screen and (max-width: 800px) {
                    header .contenedor {
                        position: static;
                        height: auto;
                    }
                    header .textos {
                        position: static;
                        margin: 100px 0;
                    }
                    header .menu {
                        text-align: center;
                    }
                    header .menu a {
                        margin: 10px 10px;
                    }
                    header .textos .nombre {
                        font-size: 30px;
                    }
                    header .textos h3 {
                        font-size: 18px;
                    }
                    .main .acerca-de .foto {
                        width: 100%;
                        position: relative;
                    }
                    .main .acerca-de article {
                        position: relative;
                        width: 100%;
                        top: -50px;
                        transform: translate(0px, 0);
                    }
                    .main .menu {
                        padding-top: 300px;
                    }
                    .main .menu article {
                        width: 100%;
                    }
                    .main .galeria .foto {
                        width: 50%;
                    }
                    .main .mapa {
                        width: 80%;
                        margin: auto;
                    }
                }
                
                @media screen and (max-width: 400px) {
                    header .menu a {
                        font-size: 15px;
                        margin: 10px 10px;
                        text-align: center;
                    }
                    .main .acerca-de article h3 {
                        font-size: 20px;
                        margin: 10px;
                    }
                    .main .acerca-de article p {
                        font-size: 15px;
                    }
                    .main .menu .nombre,
                    .main .menu .precio,
                    .main .menu .descripcion {
                        font-size: 15px;
                        line-height: 15px;
                    }
                    .main .ubicacion .direccion {
                        margin-bottom: 15px;
                    }
                    .main .ubicacion .direccion,
                    .main .ubicacion .horario {
                        width: 100%;
                        text-align: center;
                    }
                }