Destinos Detalle

<header class="container-fluid fixed-top bg bg-color-white px-0 position position-z-3">
    <div class="container py-lg-2">
        <div class="row align-items-center justify-content-between">
            <div class="col-7 col-lg-2">
                <img src='../../../img/logo.png' alt="logo" class="img img-auto img-w" />
            </div>
            <div class="menu col-12 col-lg-10 p-0 d-lg-flex flex-lg-wrap">
                <nav class="list list-none d-flex flex-wrap align-items-center col-12 col-lg-7 order-lg-1">
                    <li class="item px-3 px-lg-2 col-12 col-lg-auto text-center">
                        <p class="text text-size-1-2 text-size-lg-1 m-0">Inicio</p>
                    </li>
                    <li class="item px-3 px-lg-2 col-12 col-lg-auto text-center active">
                        <p class="text text-size-1-2 text-size-lg-1 m-0">Hoteles</p>
                    </li>
                    <li class="item px-3 px-lg-2 col-12 col-lg-auto text-center">
                        <p class="text text-size-1-2 text-size-lg-1 m-0">Destinos</p>
                    </li>
                    <li class="item px-3 px-lg-2 col-12 col-lg-auto text-center">
                        <p class="text text-size-1-2 text-size-lg-1 m-0">Motivos de viaje</p>
                    </li>
                </nav>
                <div class="booking col-12 align-self-end col-lg-2 px-5 px-lg-1 mb-3 mb-lg-0 order-lg-4">
                    <button class="btn btn-round btn-round-primary text text-size-1-2 text-size-lg-1 px-3 px-lg-2 py-2 py-lg-1 mb-2 mb-lg-0 w-100 text text-uppercase text-w-bold">tus reservas</button>
                </div>
                <div class="social d-flex flex-wrap align-self-end align-self-lg-center px-4 justify-content-between pt-2 pt-lg-0 px-lg-1 order-lg-2">
                    <a href="" class="d-inline-block btn btn-reset ml-lg-1">
                        <img src="../../../img/icon_ins.png" alt="" class="img img-auto img-h-1-5">
                    </a>
                    <a href="" class="d-inline-block btn btn-reset ml-lg-1">
                        <img src="../../../img/icon_tw.png" alt="" class="img img-auto img-h-1-5">
                    </a>
                    <a href="" class="d-inline-block btn btn-reset ml-lg-1">
                        <img src="../../../img/icon_fb.png" alt="" class="img img-auto img-h-1-5">
                    </a>
                </div>
                <div class="c-menu-lenguage col-1 d-none d-lg-block order-lg-3 mr-0 ml-2 position-relative">
                    <span class="btn text ">
                        <i class="icon fas fa-globe-americas mr-2 d-none"></i> ES <i class="icon fas fa-chevron-down mr-2 "></i>
                    </span>
                    <div class="wrapper position-absolute bg bg-color-white">
                        <ul class="list list-none m-0 p-0 pl-0">
                            <li class="item ">
                                <a href="#" class="btn text ">EN</a>
                            </li>
                            <li class="item ">
                                <a href="#" class="btn text ">FR</a>
                            </li>
                            <li class="item ">
                                <a href="#" class="btn text ">DE</a>
                            </li>
                        </ul>
                    </div>
                </div>
            </div>
            <div class="icons col-auto ml-auto d-lg-none">
                <button class="btn btn-reset text text-size-1-5 btn-open-menu">
                    <span class="icon icon-size-1-5 open">
                        <i class="fa fa-bars"></i>
                    </span>
                    <span class="icon icon-size-1-5 icon-color-primary close">
                        <i class="fa fa-times"></i>
                    </span>
                </button>
            </div>
        </div>
    </div>
</header>
<div class="s-hero container-fluid mb-5 px-0 overflow-hidden">
    <div class="row align-content-center align-items-center">
        <div class="main-carousel main-carousel-full dots dots-bullets dots-no-zoom dots-no-arrow col-12 px-0">
            <div class="item w-100 overflow-hidden">
                <img src="../../../img/dummy.png" alt="" class="img img-w img-auto img-h">
                <div class="circle position position-absolute position-z-1 bg bg-color-primary col-12 col-lg-3 pt-5 px-4 d-lg-flex flex-lg-wrap align-items-center text text-center text-lg-left">
                    <div class="wrapper position position-relative position-z-1 pt-3">
                        <p class="text text-w-light text-color-white text-uppercase text-size-2-5 mb-0">Descubre</p>
                        <p class="text text-w-bold text-color-white text-uppercase text-size-2-3 text-size-lg-4 text-lh-100 mb-3 mid">nuestros hoteles</p>
                        <p class="text text-w-light text-color-white text-size-1-5 px-3">Una oportunidad unica de conocer cuba</p>
                    </div>
                </div>
            </div>
            <div class="item w-100 overflow-hidden">
                <img src="../../../img/dummy.png" alt="" class="img img-w img-auto img-h">
                <div class="circle position position-absolute position-z-1 bg bg-color-primary col-12 col-lg-3 pt-5 px-4 d-lg-flex flex-lg-wrap align-items-center text text-center text-lg-left">
                    <div class="wrapper position position-relative position-z-1 pt-3">
                        <p class="text text-w-light text-color-white text-uppercase text-size-2-5 mb-0">Descubre</p>
                        <p class="text text-w-bold text-color-white text-uppercase text-size-2-3 text-size-lg-4 text-lh-100 mb-3 mid">nuestros hoteles</p>
                        <p class="text text-w-light text-color-white text-size-1-5 px-3">Una oportunidad unica de conocer cuba</p>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
<section class="container-fluid py-3 bg bg-color-primary px-0 d-none d-lg-block mb-5">
    <div class="container">
        <div class="row">
            <div class="col-2 text-center">
                <p class="text text-color-ten text-size-1-2 mb-1">Pais</p>
                <img src="../../../img/icon_bar_1.svg" alt="" class="img img-contain img-w-3 img-h-3 mb-1">
                <p class="text text-color-white text-size-1-5 text-w-bold m-0">Cuba</p>
            </div>
            <div class="col-2 text-center">
                <p class="text text-color-ten text-size-1-2 mb-1">Hora Local</p>
                <img src="../../../img/icon_bar_2.svg" alt="" class="img img-contain img-w-3 img-h-3 mb-1">
                <p class="text text-color-white text-size-1-5 text-w-bold m-0">3:32am</p>
            </div>
            <div class="col-2 text-center">
                <p class="text text-color-ten text-size-1-2 mb-1">Temperatura</p>
                <img src="../../../img/icon_bar_3.svg" alt="" class="img img-contain img-w-3 img-h-3 mb-1">
                <p class="text text-color-white text-size-1-5 text-w-bold m-0">29C</p>
            </div>
            <div class="col-2 text-center">
                <p class="text text-color-ten text-size-1-2 mb-1">Moneda</p>
                <img src="../../../img/icon_bar_4.svg" alt="" class="img img-contain img-w-3 img-h-3 mb-1">
                <p class="text text-color-white text-size-1-5 text-w-bold m-0">Peso Cub</p>
            </div>
            <div class="col-2 text-center">
                <p class="text text-color-ten text-size-1-2 mb-1">Idioma</p>
                <img src="../../../img/icon_bar_5.svg" alt="" class="img img-contain img-w-3 img-h-3 mb-1">
                <p class="text text-color-white text-size-1-5 text-w-bold m-0">Espanol</p>
            </div>
            <div class="col-2 text-center">
                <p class="text text-color-ten text-size-1-2 mb-1">Habitaciones</p>
                <img src="../../../img/icon_bar_6.svg" alt="" class="img img-contain img-w-3 img-h-3 mb-1">
                <p class="text text-color-white text-size-1-5 text-w-bold m-0">10.500</p>
            </div>
        </div>
    </div>
</section>

<section class="container mb-5">
    <div class="row">
        <div class="col-12 text-center mb-3">
            <h2 class="text text-size-2 text-size-lg-3-5 text-color-primary text-w-bold m-0">Hoteles en Guardalavaca</h2>
        </div>
        <div class="col-12 px-0 d-flex flex-wrap">
            <div class="card thumb col-12 col-md-6 col-lg-4 col-xl-3 position-relative px-3 mb-5 align-self-end">
                <div class="pb-3 wrapper overflow-hidden">
                    <div class="images w-100 mb-2 overflow-hidden">
                        <img src="../../../img/dummy.png" alt="Guardalavaca" class="img img-auto img-w img-h-250">
                    </div>
                    <div class="captions w-100 px-2">
                        <h3 class="text text-color-primary text-size-1-5 text-size-lg-1-3 text-w-bold mb-0">Brisas del Caribe</h3>
                        <div class="d-flex flex-wrap w-100 mb-2">
                            <button class="btn btn-reset">
                                <img src="../../../img/star_active.png" alt="" class="img img-auto img-w">
                            </button>
                            <button class="btn btn-reset">
                                <img src="../../../img/star_active.png" alt="" class="img img-auto img-w">
                            </button>
                            <button class="btn btn-reset">
                                <img src="../../../img/star_active.png" alt="" class="img img-auto img-w">
                            </button>
                            <button class="btn btn-reset">
                                <img src="../../../img/star_active.png" alt="" class="img img-auto img-w">
                            </button>
                            <button class="btn btn-reset p-1">
                                <img src="../../../img/star.png" alt="" class="img img-auto img-w">
                            </button>
                        </div>
                        <div class="w-100 mb-2 d-flex align-items-center">
                            <img src="../../../img/icon_hotel.png" alt="" class="img img-auto mr-1">
                            <p class="text text-uppercase mb-0">Hotel Brisas</p>
                        </div>
                        <div class="w-100 mb-3 d-flex align-itemsntent-center">
                            <img src="../../../img/icon_flag.png" alt="" class="img img-auto mr-1">
                            <p class="text text-uppercase mb-0">Varadero</p>
                        </div>
                        <div class="action">
                            <button class="btn btn-round btn-round-mix text text-color-white px-5 px-lg-2 py-2 w-100 text-size-lg-1-2">Seleccionar</button>
                        </div>
                    </div>
                </div>
                <div class="c-flag position position-absolute position-z-2">
                    <img src="../../../img/flag.png" alt="flag-background" class="img img-auto">
                    <p class="value text text-color-white m-0 text-center text-size-0-8 text-lh-100 position-absolute">Desde<span class="d-block text text-size-1-5 text-color-white text-family-primary text-w-bold">41,00€</span></p>
                </div>
            </div>
            <div class="card thumb col-12 col-md-6 col-lg-4 col-xl-3 position-relative px-3 mb-5 align-self-end">
                <div class="pb-3 wrapper overflow-hidden">
                    <div class="images w-100 mb-2 overflow-hidden">
                        <img src="../../../img/dummy.png" alt="Guardalavaca" class="img img-auto img-w img-h-250">
                    </div>
                    <div class="captions w-100 px-2">
                        <h3 class="text text-color-primary text-size-1-5 text-size-lg-1-3 text-w-bold mb-0">Brisas del Caribe</h3>
                        <div class="d-flex flex-wrap w-100 mb-2">
                            <button class="btn btn-reset">
                                <img src="../../../img/star_active.png" alt="" class="img img-auto img-w">
                            </button>
                            <button class="btn btn-reset">
                                <img src="../../../img/star_active.png" alt="" class="img img-auto img-w">
                            </button>
                            <button class="btn btn-reset">
                                <img src="../../../img/star_active.png" alt="" class="img img-auto img-w">
                            </button>
                            <button class="btn btn-reset">
                                <img src="../../../img/star_active.png" alt="" class="img img-auto img-w">
                            </button>
                            <button class="btn btn-reset p-1">
                                <img src="../../../img/star.png" alt="" class="img img-auto img-w">
                            </button>
                        </div>
                        <div class="w-100 mb-2 d-flex align-items-center">
                            <img src="../../../img/icon_hotel.png" alt="" class="img img-auto mr-1">
                            <p class="text text-uppercase mb-0">Hotel Brisas</p>
                        </div>
                        <div class="w-100 mb-3 d-flex align-itemsntent-center">
                            <img src="../../../img/icon_flag.png" alt="" class="img img-auto mr-1">
                            <p class="text text-uppercase mb-0">Varadero</p>
                        </div>
                        <div class="action">
                            <button class="btn btn-round btn-round-mix text text-color-white px-5 px-lg-2 py-2 w-100 text-size-lg-1-2">Seleccionar</button>
                        </div>
                    </div>
                </div>
                <div class="c-flag position position-absolute position-z-2">
                    <img src="../../../img/flag.png" alt="flag-background" class="img img-auto">
                    <p class="value text text-color-white m-0 text-center text-size-0-8 text-lh-100 position-absolute">Desde<span class="d-block text text-size-1-5 text-color-white text-family-primary text-w-bold">41,00€</span></p>
                </div>
            </div>
            <div class="card thumb col-12 col-md-6 col-lg-4 col-xl-3 position-relative px-3 mb-5 align-self-end">
                <div class="pb-3 wrapper overflow-hidden">
                    <div class="images w-100 mb-2 overflow-hidden">
                        <img src="../../../img/dummy.png" alt="Guardalavaca" class="img img-auto img-w img-h-250">
                    </div>
                    <div class="captions w-100 px-2">
                        <h3 class="text text-color-primary text-size-1-5 text-size-lg-1-3 text-w-bold mb-0">Brisas del Caribe</h3>
                        <div class="d-flex flex-wrap w-100 mb-2">
                            <button class="btn btn-reset">
                                <img src="../../../img/star_active.png" alt="" class="img img-auto img-w">
                            </button>
                            <button class="btn btn-reset">
                                <img src="../../../img/star_active.png" alt="" class="img img-auto img-w">
                            </button>
                            <button class="btn btn-reset">
                                <img src="../../../img/star_active.png" alt="" class="img img-auto img-w">
                            </button>
                            <button class="btn btn-reset">
                                <img src="../../../img/star_active.png" alt="" class="img img-auto img-w">
                            </button>
                            <button class="btn btn-reset p-1">
                                <img src="../../../img/star.png" alt="" class="img img-auto img-w">
                            </button>
                        </div>
                        <div class="w-100 mb-2 d-flex align-items-center">
                            <img src="../../../img/icon_hotel.png" alt="" class="img img-auto mr-1">
                            <p class="text text-uppercase mb-0">Hotel Brisas</p>
                        </div>
                        <div class="w-100 mb-3 d-flex align-itemsntent-center">
                            <img src="../../../img/icon_flag.png" alt="" class="img img-auto mr-1">
                            <p class="text text-uppercase mb-0">Varadero</p>
                        </div>
                        <div class="action">
                            <button class="btn btn-round btn-round-mix text text-color-white px-5 px-lg-2 py-2 w-100 text-size-lg-1-2">Seleccionar</button>
                        </div>
                    </div>
                </div>
                <div class="c-flag position position-absolute position-z-2">
                    <img src="../../../img/flag.png" alt="flag-background" class="img img-auto">
                    <p class="value text text-color-white m-0 text-center text-size-0-8 text-lh-100 position-absolute">Desde<span class="d-block text text-size-1-5 text-color-white text-family-primary text-w-bold">41,00€</span></p>
                </div>
            </div>
            <div class="card thumb col-12 col-md-6 col-lg-4 col-xl-3 position-relative px-3 mb-5 align-self-end">
                <div class="pb-3 wrapper overflow-hidden">
                    <div class="images w-100 mb-2 overflow-hidden">
                        <img src="../../../img/dummy.png" alt="Guardalavaca" class="img img-auto img-w img-h-250">
                    </div>
                    <div class="captions w-100 px-2">
                        <h3 class="text text-color-primary text-size-1-5 text-size-lg-1-3 text-w-bold mb-0">Brisas del Caribe</h3>
                        <div class="d-flex flex-wrap w-100 mb-2">
                            <button class="btn btn-reset">
                                <img src="../../../img/star_active.png" alt="" class="img img-auto img-w">
                            </button>
                            <button class="btn btn-reset">
                                <img src="../../../img/star_active.png" alt="" class="img img-auto img-w">
                            </button>
                            <button class="btn btn-reset">
                                <img src="../../../img/star_active.png" alt="" class="img img-auto img-w">
                            </button>
                            <button class="btn btn-reset">
                                <img src="../../../img/star_active.png" alt="" class="img img-auto img-w">
                            </button>
                            <button class="btn btn-reset p-1">
                                <img src="../../../img/star.png" alt="" class="img img-auto img-w">
                            </button>
                        </div>
                        <div class="w-100 mb-2 d-flex align-items-center">
                            <img src="../../../img/icon_hotel.png" alt="" class="img img-auto mr-1">
                            <p class="text text-uppercase mb-0">Hotel Brisas</p>
                        </div>
                        <div class="w-100 mb-3 d-flex align-itemsntent-center">
                            <img src="../../../img/icon_flag.png" alt="" class="img img-auto mr-1">
                            <p class="text text-uppercase mb-0">Varadero</p>
                        </div>
                        <div class="action">
                            <button class="btn btn-round btn-round-mix text text-color-white px-5 px-lg-2 py-2 w-100 text-size-lg-1-2">Seleccionar</button>
                        </div>
                    </div>
                </div>
                <div class="c-flag position position-absolute position-z-2">
                    <img src="../../../img/flag.png" alt="flag-background" class="img img-auto">
                    <p class="value text text-color-white m-0 text-center text-size-0-8 text-lh-100 position-absolute">Desde<span class="d-block text text-size-1-5 text-color-white text-family-primary text-w-bold">41,00€</span></p>
                </div>
            </div>
        </div>
    </div>
</section>

<section class="contanier-fluid mb-5 overflow-hidden">
    <div class="row">
        <div class="col-12 text-center bg bg-color-grade-1 py-1">
            <h2 class="text text-color-white text-size-1-5 text-size-lg-2 m-0">Fotos</h2>
        </div>
        <div class="col-12 main-carousel main-carousel-full dots dots-arrow dots-zoom dots-arrow-center pb-5 px-0">
            <div class="col-12 px-0">
                <img src="../../../img/dummy.png" alt="" class="img img-w img-auto img-h-250 img-h-lg-500">
            </div>
            <div class="col-12 px-0">
                <img src="../../../img/dummy.png" alt="" class="img img-w img-auto img-h-300 img-h-lg-500">
            </div>
            <div class="col-12 px-0">
                <img src="../../../img/dummy.png" alt="" class="img img-w img-auto img-h-300 img-h-lg-500">
            </div>
            <div class="col-12 px-0">
                <img src="../../../img/dummy.png" alt="" class="img img-w img-auto img-h-300 img-h-lg-500">
            </div>
            <div class="col-12 px-0">
                <img src="../../../img/dummy.png" alt="" class="img img-w img-auto img-h-300 img-h-lg-500">
            </div>
        </div>
    </div>
</section>

<section class="container-fluid mb-5" style="border-top: .5rem solid #dc0155; border-bottom: .5rem solid #dc0155;">
    <div class="row">
        <div class="col-12 px-0">
            <img src="../../../img/dummy_mapa.png" alt="" class="img img-w img-auto">
        </div>
    </div>
</section>

<section class="s-iconos container">
    <div class="row">
        <div class="col-12 text-center mb-3 px-5">
            <h3 class="text text-w-bold text-size-1-5 text-size-lg-2 text-color-six m-0">Reserva directamente en Hoteles Cubanacan y Benefíciate</h3>
        </div>
        <div class="col-12 col-lg-10 mx-auto d-flex flex-wrap">
            <div class="card thumb col-10 mx-auto col-lg-3 mb-5">
                <div class="images col-7 px-0 mx-auto mb-3 mb-lg-1">
                    <img src="../../../img/flag.png" class="img img-auto img-w img">
                </div>
                <div class="captions w-100 text-center p-2">
                    <p class="text text-family-secondary text-size-1-2 m-0">Mejor precio online a clientes fidelizados</p>
                </div>
            </div>
            <div class="card thumb col-10 mx-auto col-lg-3 mb-5">
                <div class="images col-7 px-0 mx-auto mb-3 mb-lg-1">
                    <img src="../../../img/flag.png" class="img img-auto img-w img">
                </div>
                <div class="captions w-100 text-center p-2">
                    <p class="text text-family-secondary text-size-1-2 m-0">Mejor precio online a clientes fidelizados</p>
                </div>
            </div>
            <div class="card thumb col-10 mx-auto col-lg-3 mb-5">
                <div class="images col-7 px-0 mx-auto mb-3 mb-lg-1">
                    <img src="../../../img/flag.png" class="img img-auto img-w img">
                </div>
                <div class="captions w-100 text-center p-2">
                    <p class="text text-family-secondary text-size-1-2 m-0">Mejor precio online a clientes fidelizados</p>
                </div>
            </div>
            <div class="card thumb col-10 mx-auto col-lg-3 mb-5">
                <div class="images col-7 px-0 mx-auto mb-3 mb-lg-1">
                    <img src="../../../img/flag.png" class="img img-auto img-w img">
                </div>
                <div class="captions w-100 text-center p-2">
                    <p class="text text-family-secondary text-size-1-2 m-0">Mejor precio online a clientes fidelizados</p>
                </div>
            </div>
        </div>
    </div>
</section>
<section class="container-fluid py-4 bg bg-color-quaternary mb-5">
    <div class="container">
        <div class="row">
            <div class="col-12 text-center mb-5 mb-lg-1 px-5">
                <h3 class="text text-w-bold text-size-2 text-color-six mb-1 mb-lg-3">Grupo Hotelero Cubanacan S.A.</h3>
                <p class="text text-color-gray">Nuestras marcas, la mejor forma de conocer y disfrutar Cuba.</p>
            </div>
            <div class="col-12 col-lg-7 mx-auto">
                <img src="../../../img/multiLogo.png" alt="logo" class="img img-auto img-w">
            </div>
        </div>
    </div>
</section>

<footer class="container-fluid px-0 overflow-hidden">
    <div class="container">
        <div class="row">
            <div class="col-12 px-5 px-lg-0 mb-2 openmodal text-center">
                <img src='../../../img/logo.png' alt="logo" class="img img-auto col-10 col-md-3" />
            </div>
            <div class="col-12 col-md-6 col-lg-3 px-5 px-lg-3 mb-5 mb-lg-0">
                <p class='text text-family-secondary text-lh-150 text-color-gray m-0'>En compañía de experimentados profesionales del turismo y una acertada calidad en los servicios, el Grupo Hotelero de Cubanacan harán que sus vacaciones en Cuba tengan un encanto único al que le acompañarán modalidades diversas en hoteles de playa, ciudad y campos de Cuba.</p>
            </div>
            <div class="col-12 col-md-6 col-lg-3 px-5 px-lg-3 mb-5 mb-lg-0">
                <p class='text text-family-secondary text-w-bold'>Grupo Hotelero Cubanacan S.A.</p>
                <p class='text text-family-secondary text-color-gray'>Política de Privacidad</p>
                <p class='text text-family-secondary text-color-gray'>Términos y Condiciones</p>
                <p class='text text-family-secondary text-color-gray'>Sobre Nosotros</p>
                <p class='text text-family-secondary text-color-gray'>Contáctenos</p>
            </div>
            <div class="col-12 col-md-6 col-lg-3 px-5 px-lg-3 mb-5 mb-lg-0">
                <p class='text text-family-secondary text-w-bold text-color-six mb-1'>Descargue nuestra App</p>
                <p class='text text-family-secondary text-color-gray'>Contáctenos</p>
                <img src='../../../img/logo_store.png' alt="logo store" class="img img-auto col-3 col-lg-6" />
            </div>
            <div class="col-12 col-md-6 col-lg-3 px-5 px-lg-3 mb-5 mb-lg-0">
                <p class='text text-family-secondary text-w-bold text-color-six mb-1'>Contactenos</p>
                <div class="w-100 d-flex flex-wrap">
                    <i class="icon fas fa-map-marker-alt d-inline-block mt-1 col-1"></i>
                    <p class='text text-family-secondary text-lh-150 col-11 m-0 pl-1 text-color-gray'>Calle 23, Nº 156 N Y O. Vedado, Plaza de la Revolución La Habana, Cuba</p>
                </div>
                <div class="w-100 d-flex flex-wrap">
                    <i class="icon fas fa-phone d-inline-block mt-1 col-1"></i>
                    <p class='text text-family-secondary text-lh-150 col-11 m-0 pl-1 text-color-gray'>(+53) 7 838 5252</p>
                </div>
                <div class="w-100 d-flex flex-wrap">
                    <i class="icon fas fa-envelope d-inline-block mt-1 col-1"></i>
                    <p class='text text-family-secondary text-lh-150 col-11 m-0 pl-1 text-color-gray'>callcenter@cubanacan.tur.cu</p>
                </div>
            </div>
        </div>
    </div>
    <div class="w-100 bg bg-color-quintary py-3 mt-lg-5">
        <div class="container">
            <div class="row">
                <div class="col-12 d-lg-flex flex-lg-wrap align-items-center">
                    <p class="text text-family-secondary text-color-gray mb-3 mb-lg-0 col-lg-8">© 2022 SISTEMA DE RESERVAS ON LINE S.L. Todos los Derechos Reservados</p>
                    <img src='../../../img/logos_footer.png' alt="logo footer" class="img img-auto col-12 col-lg-4" />
                </div>
            </div>
        </div>
    </div>
</footer>

<div class="c-modal w-100 h-100 position position-fixed position-z-5 p-4">
    <span class="mask w-100 h-100 position-fixed position-z-2 openmodal"></span>
    <div class="wrapper col-11 col-md-7 col-lg-5 mx-auto position position-50-50 position-absolute position-z-3 p-4 bg bg-color-white">
        <p class="text text-w-bold text-size-1-5 text-size-lg-2 mb-2">Titulo</p>
        <p class="text">Texto</p>
        <form class="c-form">
            <div class="form-group text-center mb-3">
                <input type="text" class="form-control border" placeholder="texto">
            </div>
            <div class="form-group text-center mb-3">
                <input type="text" class="form-control border" placeholder="texto">
            </div>
            <div class="form-group text-center mb-3">
                <input type="submit" class="btn btn-solid btn-solid-primary px-4 py-2 w-100 d-block" value="texto">
            </div>
        </form>
    </div>
</div>