Hotel

<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="s-ficha container mb-5">
    <div class="row">
        <div class="col-12 col-lg-6 mb-3">
            <div class=" col-6 col-lg-5 mb-3">
                <img src="../../../img/logo_brisas.png" alt="" class="img img-w">
            </div>
            <div class="captions w-100 position-relative mb-3">
                <h3 class="text text-color-primary text-size-1-5 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">
                        <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-contain mr-2">
                    <p class="text text-uppercase mb-0">Hotel Brisas</p>
                </div>
                <div class="w-100 mb-3 d-flex align-items-start">
                    <img src="../../../img/icon_flag.png" alt="" class="img img-contain mr-2">
                    <div class="col-10 p-0">
                        <p class="text text-uppercase mb-1">Varadero</p>
                        <p class="text text-uppercase mb-0">Carr, Las Morlas, Km 12 1/2 Varadero</p>
                        <p class="text text-uppercase mb-0">Matanzas, Cuba</p>
                    </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 class="col-12 col-lg-6 mb-3">
            <div class="main-carousel main-carousel-full dots dots-bullets dots-arrow dots-no-zoom dots-round border border-none w-100 pb-5">
                <div class="item col-12 px-0">
                    <img src="../../../img/dummy.png" alt="" class="img img-auto img-w img-h-lg-400 img-round">
                </div>
                <div class="item col-12 px-0">
                    <img src="../../../img/dummy.png" alt="" class="img img-auto img-w img-h-lg-400 img-round">
                </div>
                <div class="item col-12 px-0">
                    <img src="../../../img/dummy.png" alt="" class="img img-auto img-w img-h-lg-400 img-round">
                </div>
                <div class="item col-12 px-0">
                    <img src="../../../img/dummy.png" alt="" class="img img-auto img-w img-h-lg-400 img-round">
                </div>
                <div class="item col-12 px-0">
                    <img src="../../../img/dummy.png" alt="" class="img img-auto img-w img-h-lg-400 img-round">
                </div>
                <div class="item col-12 px-0">
                    <img src="../../../img/dummy.png" alt="" class="img img-auto img-w img-h-lg-400 img-round">
                </div>
                <div class="item col-12 px-0">
                    <img src="../../../img/dummy.png" alt="" class="img img-auto img-w img-h-lg-400 img-round">
                </div>
                <div class="item col-12 px-0">
                    <img src="../../../img/dummy.png" alt="" class="img img-auto img-w img-h-lg-400 img-round">
                </div>
                <div class="item col-12 px-0">
                    <img src="../../../img/dummy.png" alt="" class="img img-auto img-w img-h-lg-400 img-round">
                </div>
            </div>
        </div>
        <div class="col-12">
            <div class="w-100 mb-3">
                <p class="text">Pellentesque luctus risus efficitur lacus ultricies vulputate. Aliquam ut libero rhoncus, posuere nisl non, accumsan sem. Quisque sed nisl vel quam scelerisque suscipit nec eget lacus. Proin gravida est at enim facilisis pretium. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Aliquam bibendum non augue a ullamcorper.</p>
            </div>
            <div class="mapa">
                <img src="../../../img/dummy_mapa.png" alt="" class="img img-auto img-w">
            </div>
        </div>
    </div>
</section>

<section class="s-items container-fluid py-3 bg bg-color-primary px-0 mb-3">
    <div class="container">
        <div class="row">
            <div class="col-12">
                <ul class="list list-none m-0 p-0 column-lg-3">
                    <li class="item d-flex flex-wrap mb-2">
                        <img src="../../../img/icon_chulo.png" alt="" class="img img-contain img-w-2">
                        <p class="text text-w-bold text-color-white mb-0 ml-2 col-lg-10"> Servicio de despertador</p>
                    </li>
                    <li class="item d-flex flex-wrap mb-2">
                        <img src="../../../img/icon_chulo.png" alt="" class="img img-contain img-w-2">
                        <p class="text text-w-bold text-color-white mb-0 ml-2 col-lg-10"> Acceso en silla de ruedas</p>
                    </li>
                    <li class="item d-flex flex-wrap mb-2">
                        <img src="../../../img/icon_chulo.png" alt="" class="img img-contain img-w-2">
                        <p class="text text-w-bold text-color-white mb-0 ml-2 col-lg-10"> Servicios de bodas y lunas de miel</p>
                    </li>
                    <li class="item d-flex flex-wrap mb-2">
                        <img src="../../../img/icon_chulo.png" alt="" class="img img-contain img-w-2">
                        <p class="text text-w-bold text-color-white mb-0 ml-2 col-lg-10"> Botones / Portero</p>
                    </li>
                    <li class="item d-flex flex-wrap mb-2">
                        <img src="../../../img/icon_chulo.png" alt="" class="img img-contain img-w-2">
                        <p class="text text-w-bold text-color-white mb-0 ml-2 col-lg-10"> Deportes acuáticos</p>
                    </li>
                    <li class="item d-flex flex-wrap mb-2">
                        <img src="../../../img/icon_chulo.png" alt="" class="img img-contain img-w-2">
                        <p class="text text-w-bold text-color-white mb-0 ml-2 col-lg-10"> Salón de Belleza</p>
                    </li>
                    <li class="item d-flex flex-wrap mb-2">
                        <img src="../../../img/icon_chulo.png" alt="" class="img img-contain img-w-2">
                        <p class="text text-w-bold text-color-white mb-0 ml-2 col-lg-10"> Programas infantiles</p>
                    </li>
                    <li class="item d-flex flex-wrap mb-2">
                        <img src="../../../img/icon_chulo.png" alt="" class="img img-contain img-w-2">
                        <p class="text text-w-bold text-color-white mb-0 ml-2 col-lg-10">Playa</p>
                    </li>
                    <li class="item d-flex flex-wrap mb-2">
                        <img src="../../../img/icon_chulo.png" alt="" class="img img-contain img-w-2">
                        <p class="text text-w-bold text-color-white mb-0 ml-2 col-lg-10"> Secador de pelo</p>
                    </li>
                    <li class="item d-flex flex-wrap mb-2">
                        <img src="../../../img/icon_chulo.png" alt="" class="img img-contain img-w-2">
                        <p class="text text-w-bold text-color-white mb-0 ml-2 col-lg-10"> Tabla de planchar</p>
                    </li>
                    <li class="item d-flex flex-wrap mb-2">
                        <img src="../../../img/icon_chulo.png" alt="" class="img img-contain img-w-2">
                        <p class="text text-w-bold text-color-white mb-0 ml-2 col-lg-10"> Corriente alterna 220 volt</p>
                    </li>
                    <li class="item d-flex flex-wrap mb-2">
                        <img src="../../../img/icon_chulo.png" alt="" class="img img-contain img-w-2">
                        <p class="text text-w-bold text-color-white mb-0 ml-2 col-lg-10"> Baño</p>
                    </li>
                </ul>
            </div>
        </div>
    </div>
</section>
<section class="container mb-5">
    <div class="row">
        <div class="col-12 mb-3">
            <h2 class="text text-w-bold text-color-primary text-size-1-5 text-size-lg-2 mb-0">Tipo de Habitacion</h2>
        </div>
        <div class="col-12 px-2 d-flex flex-wrap px-lg-0">
            <div class="c-room col-12 col-lg-6 mb-3 position-relative px-lg-2">
                <div class="w-100 d-flex flex-wrap bg bg-color-fourteen px-3 pb-3 pt-9 pt-lg-3">
                    <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>
                    <h2 class="text text-color-primary text-w-bold text-size-1-2 col-12 p-0 mb-1">Estandar</h2>
                    <div class="col-12 col-md-6 col-lg-5 p-0 mb-3">
                        <p class="text text-black text-size-lg-1-1 mb-0">
                            <img src="../../../img/icon_personas.png" alt="" class="img img-auto img-w-1-5 mr-1"> Hasta 3 Huespedes
                        </p>
                        <p class="text text-black text-size-lg-1-1 mb-0">
                            <img src="../../../img/icon_superficie.png" alt="" class="img img-auto img-w-1-5 mr-1"> 12 mt2
                        </p>
                        <p class="text text-black text-size-lg-1-1 mb-0">
                            <img src="../../../img/icon_camas.png" alt="" class="img img-auto img-w-1-5 mr-1"> 1 Cama doble
                        </p>
                        <p class="text text-black text-size-lg-1-1 mb-0">
                            <img src="../../../img/icon_camas.png" alt="" class="img img-auto img-w-1-5 mr-1"> 2 camas
                        </p>
                        <p class="text text-black text-size-lg-1-1 mb-0">
                            <img src="../../../img/icon_vista.png" alt="" class="img img-auto img-w-1-5 mr-1"> Vista Jardin
                        </p>
                    </div>
                    <div class="main-carousel main-carousel-full dots dots-arrow dots-no-bullets dots-zoom col-12 col-md-6 col-lg-7 p-0 mb-3">
                        <img src="../../../img/dummy.png" alt="" class="img img-w img-auto img-h-200 img-h-lg-250">
                        <img src="../../../img/dummy.png" alt="" class="img img-w img-auto img-h-200 img-h-lg-250">
                        <img src="../../../img/dummy.png" alt="" class="img img-w img-auto img-h-200 img-h-lg-250">
                        <img src="../../../img/dummy.png" alt="" class="img img-w img-auto img-h-200 img-h-lg-250">
                    </div>
                    <ul class="list list-none m-0 p-0 column-lg-2 w-100">
                        <li class="item d-flex flex-wrap">
                            <img src="../../../img/icon_chulo.png" alt="" class="img img-contain img-w-1-5">
                            <p class="text text-color-primary mb-0 ml-1">item</p>
                        </li>
                        <li class="item d-flex flex-wrap">
                            <img src="../../../img/icon_chulo.png" alt="" class="img img-contain img-w-1-5">
                            <p class="text text-color-primary mb-0 ml-1">item</p>
                        </li>
                        <li class="item d-flex flex-wrap">
                            <img src="../../../img/icon_chulo.png" alt="" class="img img-contain img-w-1-5">
                            <p class="text text-color-primary mb-0 ml-1">item</p>
                        </li>
                        <li class="item d-flex flex-wrap">
                            <img src="../../../img/icon_chulo.png" alt="" class="img img-contain img-w-1-5">
                            <p class="text text-color-primary mb-0 ml-1">item</p>
                        </li>
                        <li class="item d-flex flex-wrap">
                            <img src="../../../img/icon_chulo.png" alt="" class="img img-contain img-w-1-5">
                            <p class="text text-color-primary mb-0 ml-1">item</p>
                        </li>
                        <li class="item d-flex flex-wrap">
                            <img src="../../../img/icon_chulo.png" alt="" class="img img-contain img-w-1-5">
                            <p class="text text-color-primary mb-0 ml-1">item</p>
                        </li>
                    </ul>
                </div>
            </div>
            <div class="c-room col-12 col-lg-6 mb-3 position-relative px-lg-2">
                <div class="w-100 d-flex flex-wrap bg bg-color-fourteen px-3 pb-3 pt-9 pt-lg-3">
                    <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>
                    <h2 class="text text-color-primary text-w-bold text-size-1-2 col-12 p-0 mb-1">Estandar</h2>
                    <div class="col-12 col-md-6 col-lg-5 p-0 mb-3">
                        <p class="text text-black text-size-lg-1-1 mb-0">
                            <img src="../../../img/icon_personas.png" alt="" class="img img-auto img-w-1-5 mr-1"> Hasta 3 Huespedes
                        </p>
                        <p class="text text-black text-size-lg-1-1 mb-0">
                            <img src="../../../img/icon_superficie.png" alt="" class="img img-auto img-w-1-5 mr-1"> 12 mt2
                        </p>
                        <p class="text text-black text-size-lg-1-1 mb-0">
                            <img src="../../../img/icon_camas.png" alt="" class="img img-auto img-w-1-5 mr-1"> 1 Cama doble
                        </p>
                        <p class="text text-black text-size-lg-1-1 mb-0">
                            <img src="../../../img/icon_camas.png" alt="" class="img img-auto img-w-1-5 mr-1"> 2 camas
                        </p>
                        <p class="text text-black text-size-lg-1-1 mb-0">
                            <img src="../../../img/icon_vista.png" alt="" class="img img-auto img-w-1-5 mr-1"> Vista Jardin
                        </p>
                    </div>
                    <div class="main-carousel main-carousel-full dots dots-arrow dots-no-bullets dots-zoom col-12 col-md-6 col-lg-7 p-0 mb-3">
                        <img src="../../../img/dummy.png" alt="" class="img img-w img-auto img-h-200 img-h-lg-250">
                        <img src="../../../img/dummy.png" alt="" class="img img-w img-auto img-h-200 img-h-lg-250">
                        <img src="../../../img/dummy.png" alt="" class="img img-w img-auto img-h-200 img-h-lg-250">
                        <img src="../../../img/dummy.png" alt="" class="img img-w img-auto img-h-200 img-h-lg-250">
                    </div>
                    <ul class="list list-none m-0 p-0 column-lg-2 w-100">
                        <li class="item d-flex flex-wrap">
                            <img src="../../../img/icon_chulo.png" alt="" class="img img-contain img-w-1-5">
                            <p class="text text-color-primary mb-0 ml-1">item</p>
                        </li>
                        <li class="item d-flex flex-wrap">
                            <img src="../../../img/icon_chulo.png" alt="" class="img img-contain img-w-1-5">
                            <p class="text text-color-primary mb-0 ml-1">item</p>
                        </li>
                        <li class="item d-flex flex-wrap">
                            <img src="../../../img/icon_chulo.png" alt="" class="img img-contain img-w-1-5">
                            <p class="text text-color-primary mb-0 ml-1">item</p>
                        </li>
                        <li class="item d-flex flex-wrap">
                            <img src="../../../img/icon_chulo.png" alt="" class="img img-contain img-w-1-5">
                            <p class="text text-color-primary mb-0 ml-1">item</p>
                        </li>
                        <li class="item d-flex flex-wrap">
                            <img src="../../../img/icon_chulo.png" alt="" class="img img-contain img-w-1-5">
                            <p class="text text-color-primary mb-0 ml-1">item</p>
                        </li>
                        <li class="item d-flex flex-wrap">
                            <img src="../../../img/icon_chulo.png" alt="" class="img img-contain img-w-1-5">
                            <p class="text text-color-primary mb-0 ml-1">item</p>
                        </li>
                    </ul>
                </div>
            </div>
        </div>
    </div>
</section>

<section class="container-fluid px-0 mb-5">
    <div class="row mb-3 mx-0">
        <div class="col-12 text-center">
            <p class="text text-uppercase text-size-2 text-size-lg-3-5 text-w-bold text-color-twelve mb-0">Lugares de interes</p>
        </div>
    </div>
    <div class="w-100 bg bg-color-twelve px-3 py-5">
        <div class="container">
            <div class="row">
                <div class="col-12 col-lg-6">
                    <h3 class="text text-uppercase text-size-1-5 text-size-lg-2-5 text-color-white text-w-bold mb-2">Ciudad de Matanzas</h3>
                    <p class="text text-color-white text-w-bold text-uppercase mb-3"><img src="../../../img/icon_hotel.png" alt="" class="img img-contain mr-1"> distancia del hotel: 20km</p>
                    <p class="text text-color-white">Pellentesque luctus risus efficitur lacus ultricies vulputate. Aliquam ut libero rhoncus, posuere nisl non, accumsan sem. Quisque sed nisl vel quam scelerisque suscipit nec eget lacus. Proin gravida est at enim facilisis pretium. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Aliquam bibendum non augue a ullamcorper.</p>
                </div>
                <div class="col-12 col-lg-6">
                    <img src="../../../img/dummy.png" alt="" class="img img-auto img-w img-h-250">
                </div>
            </div>
        </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="s-brands container-fluid py-4 mb-5">
    <div class="container">
        <div class="row">
            <div class="col-12 px-5">
                <h3 class="text text-w-bold text-size-1-5 text-size-lg-2 text-color-secondary mb-2 mb-lg-3">Grupo Hotelero Cubanacan S.A. <span class="text text-size-1-2 text-size-lg-1 text-color-secondary pl-2 border-left">Nuestras marcas, la mejor forma de conocer y disfrutar Cuba.</span></h3>
            </div>
            <div class="col-12 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>
{{> @s-header }}
{{> @s-hero
    s_hero_class="container-fluid my-5 my-lg-7"
}}

{{> @s-ficha }}

{{> @s-items }}

<section class="container mb-5">
    <div class="row">
        <div class="col-12 mb-3">
            <h2 class="text text-w-bold text-color-primary text-size-1-5 text-size-lg-2 mb-0">Tipo de Habitacion</h2>
        </div>
        <div class="col-12 px-2 d-flex flex-wrap px-lg-0">
            {{> @c-room }}
            {{> @c-room }}
        </div>
    </div>
</section>

<section class="container-fluid px-0 mb-5">
    <div class="row mb-3 mx-0">
        <div class="col-12 text-center">
            <p class="text text-uppercase text-size-2 text-size-lg-3-5 text-w-bold text-color-twelve mb-0">Lugares de interes</p>
        </div>
    </div>
    <div class="w-100 bg bg-color-twelve px-3 py-5">
        <div class="container">
            <div class="row">
                <div class="col-12 col-lg-6">
                    <h3 class="text text-uppercase text-size-1-5 text-size-lg-2-5 text-color-white text-w-bold mb-2">Ciudad de Matanzas</h3>
                    <p class="text text-color-white text-w-bold text-uppercase mb-3"><img src="../../../img/icon_hotel.png" alt="" class="img img-contain mr-1"> distancia del hotel: 20km</p>
                    <p class="text text-color-white">Pellentesque luctus risus efficitur lacus ultricies vulputate. Aliquam ut libero rhoncus, posuere nisl non, accumsan sem. Quisque sed nisl vel quam scelerisque suscipit nec eget lacus. Proin gravida est at enim facilisis pretium. Pellentesque habitant morbi tristique senectus et netus et malesuada fames ac turpis egestas. Orci varius natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Aliquam bibendum non augue a ullamcorper.</p>
                </div>
                <div class="col-12 col-lg-6">
                    <img src="../../../img/dummy.png" alt="" class="img img-auto img-w img-h-250">
                </div>
            </div>
        </div>
    </div>
</section>

{{> @s-iconos }}

{{> @s-brands }}

{{> @s-footer }}
/* No context defined. */

No notes defined.