{HEADER}



<link href="assets2/css/home2.min.css" rel="stylesheet" />



<main>



    <div class="section-welcome position-relative">

        <div id="carouselExampleIndicators" class="carousel slide" data-bs-ride="carousel">

            <div class="carousel-indicators">

                <button type="button" data-bs-target="#carouselExampleIndicators" data-bs-slide-to="0" class="active"

                    aria-current="true" aria-label="Slide 1"></button>

                <button type="button" data-bs-target="#carouselExampleIndicators" data-bs-slide-to="1"

                    aria-label="Slide 2"></button>

                <button type="button" data-bs-target="#carouselExampleIndicators" data-bs-slide-to="2"

                    aria-label="Slide 3"></button>

                <button type="button" data-bs-target="#carouselExampleIndicators" data-bs-slide-to="3"

                    aria-label="Slide 4"></button>

            </div>

            <div class="carousel-inner">

                <div class="carousel-item active"

                    style="background-image: url(assets2/images/home/welcome/slide-1.jpg);">

                    <div class="content-card">

                        <div class="row">

                            <div class="col-12 col-lg-8 col-xl-6 cuadro-welcome">

                                <img src="assets2/images/home/welcome/mancha.png" alt="mancha">

                                <h1>{TITLE_SLIDER_1}</h1>

                                <p class="mb-0">{DESC_SLIDER_1}</p>

                            </div>

                        </div>

                    </div>

                </div>

                <div class="carousel-item" style="background-image: url(assets2/images/home/welcome/slide-2.jpg);">

                    <div class="content-card">

                        <div class="row">

                            <div class="col-12 col-lg-8 col-xl-6 cuadro-welcome">

                                <img src="assets2/images/home/welcome/mancha.png" alt="mancha">

                                <h1>{TITLE_SLIDER_2}</h1>

                                <p class="mb-0">{DESC_SLIDER_2}</p>

                                <div class="text-end">

                                    <a class="btn btn-custom btn-rounded btn-blue-white btn-center-out mt-3"

                                        href="/menu">mostrar</a>

                                </div>

                            </div>

                        </div>

                    </div>

                </div>

                <div class="carousel-item" style="background-image: url(assets2/images/home/welcome/slide-3.jpg);">

                    <div class="content-card">

                        <div class="row">

                            <div class="col-12 col-lg-8 col-xl-6 cuadro-welcome">

                                <img src="assets2/images/home/welcome/mancha.png" alt="mancha">

                                <h1>{TITLE_SLIDER_3}</h1>

                                <p class="mb-0">{DESC_SLIDER_3}</p>

                                <div class="text-end">

                                    <a class="btn btn-custom btn-rounded btn-blue-white btn-center-out mt-3"

                                        href="/catering">mostrar</a>

                                </div>

                            </div>

                        </div>

                    </div>

                </div>

                <div class="carousel-item" style="background-image: url(assets2/images/home/welcome/slide-4.jpg);">

                    <div class="content-card">

                        <div class="row">

                            <div class="col-12 col-lg-8 col-xl-6 cuadro-welcome">

                                <img src="assets2/images/home/welcome/mancha.png" alt="mancha">

                                <h1>{TITLE_SLIDER_4}</h1>

                                <p class="mb-0">{DESC_SLIDER_4}</p>

                                <div class="text-end">

                                    <a class="btn btn-custom btn-rounded btn-blue-white btn-center-out mt-3"

                                        href="/tienda">mostrar</a>

                                </div>

                            </div>

                        </div>

                    </div>

                </div>

            </div>

            <button class="carousel-control-prev" type="button" data-bs-target="#carouselExampleIndicators"

                data-bs-slide="prev">

                <span class="carousel-control-prev-icon" aria-hidden="true"></span>

                <span class="visually-hidden">Previous</span>

            </button>

            <button class="carousel-control-next" type="button" data-bs-target="#carouselExampleIndicators"

                data-bs-slide="next">

                <span class="carousel-control-next-icon" aria-hidden="true"></span>

                <span class="visually-hidden">Next</span>

            </button>

        </div>

        <div class="curva">

            <img src="assets2/images/home/welcome/curva-welcome.svg" alt="curva">

        </div>

        <!--<div class="mancha d-none d-md-block">

            <img src="assets2/images/home/welcome/manchaonda.png" alt="mancha">

        </div> -->

        <a href="#section2" class="box">

            <span></span>

            <span></span>

        </a>

    </div>

    <div id="section2" class="section2 py-5">

        <div class="container">

            <div class="row">

                <div class="col-12 col-lg-6 mb-5 mb-lg-0">

                    <div class="content-img">

                        <img class="img-fluid wow fadeInLeft delay-800" src="assets2/images/home/sec2-5.png"

                            alt="foto5">

                        <img class="img-fluid wow fadeInLeft delay-600" src="assets2/images/home/sec2-4.png"

                            alt="foto4">

                        <img class="img-fluid wow fadeInLeft delay-400" src="assets2/images/home/sec2-1.png"

                            alt="foto1">

                        <img class="img-fluid wow fadeInLeft delay-200" src="assets2/images/home/sec2-2.png"

                            alt="foto2">

                        <img class="img-base img-fluid wow fadeInLeft" src="assets2/images/home/sec2-3.png" alt="foto3">

                    </div>

                </div>

                <div class="col-12 col-lg-5 offset-lg-1 col-right">

                    <div>

                        <p class="title wow fadeInRight">{BANNER_1_TITLE}</p>

                        <h2 class="subtitle wow fadeInRight">Medialuna</h2>

                        <p class="text wow fadeInRight">{BANNER_1_DESC}</p>

                    </div>

                </div>

            </div>

        </div>

    </div>

    <section class="banner-menu py-5">

        <div class="container">

            <div class="text-center">

                <h2 class="title wow fadeInUp">{BANNER_2_TITLE}</h2>

                <p class="text wow fadeInUp">{BANNER_2_DESC}</p>

            </div>

        </div>

    </section>



    <section class="section-menu py-5">

        <div class="container">



            <div style="display: flex; flex-flow: row wrap;justify-content: space-around;">

                <style>

                    .btnlinks {

                        padding: 2px 2rem;

                        /* border: 1px solid #C4E8E4; */

                        border: none !important;

                        background-color: #FFFFFF;

                        color: #828282;

                        outline: 0;

                        cursor: pointer;

                        transition: all .3s;

                        border-top-left-radius: 5px;

                        border-top-right-radius: 5px;

                    }



                    .btnlinks:hover {

                        color: #90ccc6;

                    }



                    /* .btnlinks.active {

                        color: blue;

                    } */

                </style>



                <!--/categorias-->

                <button id="btn{ID}" class="btnlinks mb-2" onclick="openCity(event, 'Categoría{ID}')">{NOMBRE}</button>

                <!--categorias/-->

            </div>



            <hr class="hr-tab">



            <div id="Categoría1" class="tabcontent tab-ppal">

                <div class="content-cards-menu row mt-5 wow fadeIn slow">

                    <!--/categoria_1-->

                    <div class="col-12 col-md-6 col-lg-3 mb-4 d-flex align-items-stretch">

                        <div class="card text-center">

                            <div class="row">

                                <div class="col-6 col-md-12" data-bs-toggle="modal" data-bs-target="#modalPlato"

                                    onclick="run('web-plato-{ID}','ModalPlato');">

                                    <img src="/fotos/plato_{ID}.jpg" class="card-img-top" alt="plato">

                                </div>

                                <div class="col-6 col-md-12">

                                    <div class="card-body">

                                        <h5 class="card-title"

                                            style="display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;overflow: hidden;">

                                            {NOMBRE}

                                        </h5>

                                        <p class="card-text">{PRECIO}€</p>

                                        <a href="javascript:void(0)" onclick="run('menu-add2-{ID}','Seleccionados')"

                                            class="btn btn-custom btn-rounded btn-blue-white btn-center-out mb-2">Añadir</a>

                                    </div>

                                </div>

                            </div>

                        </div>

                    </div>

                    <!--categoria_1/-->

                </div>

            </div>



            <div id="Categoría2" class="tabcontent">

                <div class="content-cards-menu row mt-5 wow fadeIn slow">

                    <!--/categoria_2-->

                    <div class="col-12 col-md-6 col-lg-3 mb-4 d-flex align-items-stretch">

                        <div class="card text-center">

                            <div class="row">

                                <div class="col-6 col-md-12" data-bs-toggle="modal" data-bs-target="#modalPlato"

                                    onclick="run('web-plato-{ID}','ModalPlato');">

                                    <img src="/fotos/plato_{ID}.jpg" class="card-img-top" alt="plato">

                                </div>

                                <div class="col-6 col-md-12">

                                    <div class="card-body">

                                        <h5 class="card-title"

                                            style="display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;overflow: hidden;">

                                            {NOMBRE}

                                        </h5>

                                        <p class="card-text">{PRECIO}€</p>

                                        <a href="javascript:void(0)" onclick="run('menu-add2-{ID}','Seleccionados')"

                                            class="btn btn-custom btn-rounded btn-blue-white btn-center-out">Añadir</a>

                                    </div>

                                </div>

                            </div>

                        </div>

                    </div>

                    <!--categoria_2/-->

                </div>

            </div>



            <div id="Categoría3" class="tabcontent">

                <div class="content-cards-menu row mt-5 wow fadeIn slow">

                    <!--/categoria_3-->

                    <div class="col-12 col-md-6 col-lg-3 mb-4 d-flex align-items-stretch">

                        <div class="card text-center">

                            <div class="row">

                                <div class="col-6 col-md-12" data-bs-toggle="modal" data-bs-target="#modalPlato"

                                    onclick="run('web-plato-{ID}','ModalPlato');">

                                    <img src="/fotos/plato_{ID}.jpg" class="card-img-top" alt="plato">

                                </div>

                                <div class="col-6 col-md-12">

                                    <div class="card-body">

                                        <h5 class="card-title"

                                            style="display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;overflow: hidden;">

                                            {NOMBRE}

                                        </h5>

                                        <p class="card-text">{PRECIO}€</p>

                                        <a href="javascript:void(0)" onclick="run('menu-add2-{ID}','Seleccionados')"

                                            class="btn btn-custom btn-rounded btn-blue-white btn-center-out">Añadir</a>

                                    </div>

                                </div>

                            </div>

                        </div>

                    </div>

                    <!--categoria_3/-->

                </div>

            </div>



            <div id="Categoría4" class="tabcontent">

                <div class="content-cards-menu row mt-5 wow fadeIn slow">

                    <!--/categoria_4-->

                    <div class="col-12 col-md-6 col-lg-3 mb-4 d-flex align-items-stretch">

                        <div class="card text-center">

                            <div class="row">

                                <div class="col-6 col-md-12" data-bs-toggle="modal" data-bs-target="#modalPlato"

                                    onclick="run('web-plato-{ID}','ModalPlato');">

                                    <img src="/fotos/plato_{ID}.jpg" class="card-img-top" alt="plato">

                                </div>

                                <div class="col-6 col-md-12">

                                    <div class="card-body">

                                        <h5 class="card-title"

                                            style="display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;overflow: hidden;">

                                            {NOMBRE}

                                        </h5>

                                        <p class="card-text">{PRECIO}€</p>

                                        <a href="javascript:void(0)" onclick="run('menu-add2-{ID}','Seleccionados')"

                                            class="btn btn-custom btn-rounded btn-blue-white btn-center-out">Añadir</a>

                                    </div>

                                </div>

                            </div>

                        </div>

                    </div>

                    <!--categoria_4/-->

                </div>

            </div>



            <div id="Categoría5" class="tabcontent">

                <div class="content-cards-menu row mt-5 wow fadeIn slow">

                    <!--/categoria_5-->

                    <div class="col-12 col-md-6 col-lg-3 mb-4 d-flex align-items-stretch">

                        <div class="card text-center">

                            <div class="row">

                                <div class="col-6 col-md-12" data-bs-toggle="modal" data-bs-target="#modalPlato"

                                    onclick="run('web-plato-{ID}','ModalPlato');">

                                    <img src="/fotos/plato_{ID}.jpg" class="card-img-top" alt="plato">

                                </div>

                                <div class="col-6 col-md-12">

                                    <div class="card-body">

                                        <h5 class="card-title"

                                            style="display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;overflow: hidden;">

                                            {NOMBRE}

                                        </h5>

                                        <p class="card-text">{PRECIO}€</p>

                                        <a href="javascript:void(0)" onclick="run('menu-add2-{ID}','Seleccionados')"

                                            class="btn btn-custom btn-rounded btn-blue-white btn-center-out">Añadir</a>

                                    </div>

                                </div>

                            </div>

                        </div>

                    </div>

                    <!--categoria_5/-->

                </div>

            </div>



        </div>

    </section>

    <div class="section-delivery">

        <div class="text-center">

            <p class="title-delivery wow fadeInUp">¿en casa o en oficina?</p>

            <div class="content-text wow fadeInUp">

                <p class="text-delivery mb-0">llegamos a donde lo necesites</p>

            </div>

            <div class="d-flex justify-content-center w-75 mx-auto">

                <div class="me-5">

                    <a class="dish"

                        href="https://www.just-eat.es/restaurants-la-cocina-de-medialuna-palmas-de-gran-canaria-las"

                        target="_blank" rel="noopener noreferrer">

                        <img class="wow fadeInRight img-fluid" src="assets2/images/home/delivery1.png" alt="Delivery">

                    </a>

                    <p class="text-gray-light mt-2 wow fadeInRight">Just Eat te lo lleva</p>

                </div>

                <div class="ms-5">

                    <a class="dish" href="#!">

                        <img class="wow fadeInLeft img-fluid" src="assets2/images/home/delivery2.png" alt="Delivery">

                    </a>

                    <p class="text-gray-light mt-2 wow fadeInLeft">Te lo llevamos nosotros</p>

                </div>

            </div>

        </div>

    </div>

    <div class="section-hablamos pt-5">

        <div class="container">

            <div class="row content-map">

                <div class="col-md-7 col-lg-8 p-0">

                    <iframe

                        src="https://www.google.com/maps/embed?pb=!1m18!1m12!1m3!1d3519.5093437663604!2d-15.456290149150247!3d28.10050571462516!2m3!1f0!2f0!3f0!3m2!1i1024!2i768!4f13.1!3m3!1m2!1s0xc40944d343e5711%3A0xa330b85a403c9199!2sLa%20Cocina%20de%20MediaLuna!5e0!3m2!1ses!2ses!4v1626798000993!5m2!1ses!2ses"

                        frameborder="0" style="border: 0; width: 100%; height: 350px" allowfullscreen=""></iframe>

                </div>

                <div class="col-md-5 col-lg-4 p-0 content-text-map">

                    <div class="px-5 py-1 text-center">

                        <h3 class="title-map">¿hablamos?</h3>

                        <p class="text-map">

                            <a href="#!">

                                Teléfono local y pedidos

                                <br><span style="font-size: small;">(Horario de lunes a viernes de 8.00 a 16.00)</span>

                            </a>

                        </p>

                        <p class="text-map">

                            <a href="tel:828048232">828 04 82 32</a> - <a href="tel:615054511">615 054511</a>

                        </p>

                        <p class="text-map">

                            <a href="tel:645742697">Teléfono administración:<br>645 742 697</a>

                        </p>

                        <p class="text-map">

                            <a href="mailto:info@medialunacatering.es" class="enlace2">info@medialunacatering.es</a>

                            <br>

                            <a href="mailto:pedidoslacocinademedialuna@gmail.com" class="enlace2"

                                style="font-size: 16px;">pedidoslacocinademedialuna@gmail.com</a>

                        </p>

                    </div>

                </div>

            </div>

            <div class="text-instagram text-center">

                <p class="text-ig">sigue nuestro día a día en Instagram</p>

            </div>

            <div class="galeria">

                <a href="https://www.instagram.com/p/CRpHEqlFEQH/" target="_blank" rel="noopener noreferrer"

                    class="img-fluid wow fadeIn">

                    <img class="img-fluid wow fadeIn" style="width: 90%;" src="assets2/images/home/galeria-ig/1.jpeg"

                        alt="foto1">

                </a>

                <a href="https://www.instagram.com/p/CShqWJBH76u/" target="_blank" rel="noopener noreferrer">

                    <img class="img-fluid wow fadeIn" style="width: 90%;" src="assets2/images/home/galeria-ig/2.jpeg"

                        alt="foto2">

                </a>

                <a href="https://www.instagram.com/p/CScmXCGoPxC/" target="_blank" rel="noopener noreferrer">

                    <img class="img-fluid wow fadeIn" style="width: 90%;" src="assets2/images/home/galeria-ig/3.jpeg"

                        alt="foto3">

                </a>

                <a href="https://www.instagram.com/p/CR9T-xwoy8H/" target="_blank" rel="noopener noreferrer">

                    <img class="img-fluid wow fadeIn" style="width: 90%;" src="assets2/images/home/galeria-ig/4.jpeg"

                        alt="foto4">

                </a>

                <a href="https://www.instagram.com/p/CRHHTQRFgKn/" target="_blank" rel="noopener noreferrer">

                    <img class="img-fluid wow fadeIn" style="width: 90%;" src="assets2/images/home/galeria-ig/5.jpeg"

                        alt="foto5">

                </a>

                <a href="https://www.instagram.com/p/CRZTByGFoyf/" target="_blank" rel="noopener noreferrer">

                    <img class="img-fluid wow fadeIn" style="width: 90%;" src="assets2/images/home/galeria-ig/6.jpeg"

                        alt="foto6">

                </a>

            </div>

        </div>

    </div>



    {FOOTER} {SHOPPING} {SUSCRIBE}



</main>