{"id":2541,"date":"2024-10-29T22:57:33","date_gmt":"2024-10-29T22:57:33","guid":{"rendered":"https:\/\/uccap.net\/?page_id=2541"},"modified":"2024-10-30T00:02:51","modified_gmt":"2024-10-30T00:02:51","slug":"galerias","status":"publish","type":"page","link":"https:\/\/uccap.net\/?page_id=2541","title":{"rendered":"Galerias"},"content":{"rendered":"<div id=\"pl-2541\"  class=\"panel-layout\" ><div id=\"pg-2541-0\"  class=\"panel-grid panel-has-style\" ><div class=\"siteorigin-panels-stretch panel-row-style panel-row-style-for-2541-0\" data-stretch-type=\"full-stretched\" ><div id=\"pgc-2541-0-0\"  class=\"panel-grid-cell panel-grid-cell-empty\" ><\/div><\/div><\/div><div id=\"pg-2541-1\"  class=\"panel-grid panel-has-style\" ><div class=\"siteorigin-panels-stretch panel-row-style panel-row-style-for-2541-1\" data-stretch-type=\"full-stretched\" ><div id=\"pgc-2541-1-0\"  class=\"panel-grid-cell\" ><div id=\"panel-2541-1-0-0\" class=\"so-panel widget widget_sow-hero panel-first-child panel-last-child\" data-index=\"0\" ><div\n\t\t\t\n\t\t\tclass=\"so-widget-sow-hero so-widget-sow-hero-default-6e283e92799f-2541 so-widget-fittext-wrapper\"\n\t\t\t data-fit-text-compressor=\"0.85\"\n\t\t>\t\t\t\t<div class=\"sow-slider-base\" style=\"display: none\" tabindex=\"0\">\n\t\t\t\t\t<ul\n\t\t\t\t\tclass=\"sow-slider-images\"\n\t\t\t\t\tdata-settings=\"{&quot;pagination&quot;:true,&quot;speed&quot;:800,&quot;timeout&quot;:8000,&quot;paused&quot;:false,&quot;pause_on_hover&quot;:false,&quot;swipe&quot;:true,&quot;nav_always_show_desktop&quot;:&quot;&quot;,&quot;nav_always_show_mobile&quot;:&quot;&quot;,&quot;breakpoint&quot;:&quot;780px&quot;,&quot;unmute&quot;:false,&quot;anchor&quot;:null}\"\n\t\t\t\t\t\t\t\t\t\tdata-anchor-id=\"\"\n\t\t\t\t>\t\t<li class=\"sow-slider-image\" style=\"visibility: visible;;background-color: #333333\" >\n\t\t\t\t\t<div class=\"sow-slider-image-container\">\n\t\t\t<div class=\"sow-slider-image-wrapper\">\n\t\t\t\t<h1 style=\"text-align: center\">Galer\u00eda<\/h1>\n\t\t\t<\/div>\n\t\t<\/div>\n\t\t\t\t<\/li>\n\t\t<\/ul>\t\t\t\t<ol class=\"sow-slider-pagination\">\n\t\t\t\t\t\t\t\t\t\t\t<li><a href=\"#\" data-goto=\"0\" aria-label=\"mostrar diapositiva 1\"><\/a><\/li>\n\t\t\t\t\t\t\t\t\t<\/ol>\n\n\t\t\t\t<div class=\"sow-slide-nav sow-slide-nav-next\">\n\t\t\t\t\t<a href=\"#\" data-goto=\"next\" aria-label=\"diapositiva siguiente\" data-action=\"next\">\n\t\t\t\t\t\t<em class=\"sow-sld-icon-thin-right\"><\/em>\n\t\t\t\t\t<\/a>\n\t\t\t\t<\/div>\n\n\t\t\t\t<div class=\"sow-slide-nav sow-slide-nav-prev\">\n\t\t\t\t\t<a href=\"#\" data-goto=\"previous\" aria-label=\"diapositiva anterior\" data-action=\"prev\">\n\t\t\t\t\t\t<em class=\"sow-sld-icon-thin-left\"><\/em>\n\t\t\t\t\t<\/a>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div><\/div><\/div><\/div><\/div><\/div><div id=\"pg-2541-2\"  class=\"panel-grid panel-has-style\" ><div class=\"siteorigin-panels-stretch panel-row-style panel-row-style-for-2541-2\" id=\"comite\" data-stretch-type=\"full\" ><div id=\"pgc-2541-2-0\"  class=\"panel-grid-cell panel-grid-cell-empty\" ><\/div><div id=\"pgc-2541-2-1\"  class=\"panel-grid-cell panel-grid-cell-mobile-last\" ><div id=\"panel-2541-2-1-0\" class=\"so-panel widget widget_siteorigin-panels-postloop panel-first-child panel-last-child\" data-index=\"1\" >\n\n<style>\n    \/* Estilos para la galer\u00eda *\/\n    .gallery {\n        display: flex;\n        flex-wrap: wrap;\n        gap: 10px;\n        justify-content: center;\n    }\n\n    .gallery-item {\n        flex: 1 1 calc(33.333% - 10px); \/* Tres columnas por defecto *\/\n        max-width: calc(33.333% - 10px); \/* Mantiene la misma proporci\u00f3n *\/\n        cursor: pointer;\n        position: relative;\n        overflow: hidden; \/* Asegura que el contenido no desborde el contenedor *\/\n    }\n\n    .gallery-item img {\n        width: 100%;\n        height: 200px; \/* Altura fija *\/\n        object-fit: cover; \/* Mantiene la relaci\u00f3n de aspecto *\/\n        display: block;\n        transition: transform 0.3s ease, box-shadow 0.3s ease; \/* Efecto suave en transformaciones *\/\n        box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2); \/* Sombra por defecto *\/\n    }\n\n    .gallery-item:hover img {\n        transform: translateY(10px) scale(1.05); \/* Desplaza hacia abajo y aumenta el tama\u00f1o de la imagen *\/\n        box-shadow: 0 8px 16px rgba(0, 0, 0, 0.3); \/* Sombra m\u00e1s pronunciada al pasar el rat\u00f3n *\/\n    }\n\n    \/* Estilos para el Lightbox *\/\n    .lightbox {\n        display: none;\n        position: fixed;\n        top: 0;\n        left: 0;\n        width: 100%;\n        height: 100%;\n        background-color: rgba(0, 0, 0, 0.9);\n        justify-content: center;\n        align-items: center;\n        z-index: 1000; \/* Asegura que est\u00e9 sobre el contenido de la p\u00e1gina *\/\n    }\n\n    .lightbox-image {\n        max-width: 72%; \/* Ajuste del 10% menos *\/\n        max-height: 72%; \/* Manteniendo proporci\u00f3n *\/\n    }\n\n    .close {\n        position: absolute;\n        top: 20px;\n        right: 30px;\n        color: white;\n        font-size: 40px;\n        cursor: pointer;\n    }\n\n    .prev, .next {\n        position: absolute;\n        top: 50%;\n        color: white;\n        font-size: 40px;\n        cursor: pointer;\n        transform: translateY(-50%);\n    }\n\n    .prev {\n        left: 25px;\n    }\n\n    .next {\n        right: 25px;\n    }\n\n    \/* Ajustes para dispositivos m\u00f3viles *\/\n    @media (max-width: 768px) {\n        .gallery-item {\n            flex: 1 1 calc(50% - 10px); \/* Dos columnas *\/\n            max-width: calc(50% - 10px);\n        }\n    }\n\n    @media (max-width: 480px) {\n        .gallery-item {\n            flex: 1 1 100%; \/* Una columna *\/\n            max-width: 100%;\n            margin: 0 10px; \/* Margen izquierdo y derecho *\/\n        }\n\n        \/* Opcional: Ajustar la galer\u00eda para evitar el espacio adicional *\/\n        .gallery {\n            padding: 0 20px; \/* A\u00f1adir un poco de padding a la galer\u00eda *\/\n        }\n\n        .prev {\n        left: 25px;\n    }\n\n    .next {\n        right: 25px;\n    }\n\n    }\n<\/style>\n\n\n\n\n\n\n<div class=\"gallery\">\n    <div class=\"gallery-item\" onclick=\"openLightbox(0)\">\n        <img decoding=\"async\" src=\"http:\/\/uccap.net\/wp-content\/uploads\/2023\/06\/314.jpg\" alt=\"Imagen 1\">\n    <\/div>\n    <div class=\"gallery-item\" onclick=\"openLightbox(1)\">\n        <img decoding=\"async\" src=\"http:\/\/uccap.net\/wp-content\/uploads\/2023\/06\/313.jpg\" alt=\"Imagen 2\">\n    <\/div>\n    <div class=\"gallery-item\" onclick=\"openLightbox(2)\">\n        <img decoding=\"async\" src=\"http:\/\/uccap.net\/wp-content\/uploads\/2023\/06\/312.jpg\" alt=\"Imagen 3\">\n    <\/div>\n    <div class=\"gallery-item\" onclick=\"openLightbox(3)\">\n        <img decoding=\"async\" src=\"http:\/\/uccap.net\/wp-content\/uploads\/2021\/02\/thmb-panama.jpg\" alt=\"Imagen 4\">\n    <\/div>\n    <div class=\"gallery-item\" onclick=\"openLightbox(4)\">\n        <img decoding=\"async\" src=\"http:\/\/uccap.net\/wp-content\/uploads\/2021\/02\/thmb-nicaragua.jpg\" alt=\"Imagen 5\">\n    <\/div>\n    <div class=\"gallery-item\" onclick=\"openLightbox(5)\">\n        <img decoding=\"async\" src=\"http:\/\/uccap.net\/wp-content\/uploads\/2021\/02\/thmb-honduras.jpg\" alt=\"Imagen 6\">\n    <\/div>\n    <div class=\"gallery-item\" onclick=\"openLightbox(6)\">\n        <img decoding=\"async\" src=\"http:\/\/uccap.net\/wp-content\/uploads\/2021\/02\/thmb-guate.jpg\" alt=\"Imagen 7\">\n    <\/div>\n    <div class=\"gallery-item\" onclick=\"openLightbox(7)\">\n        <img decoding=\"async\" src=\"http:\/\/uccap.net\/wp-content\/uploads\/2021\/02\/thmb-salvador.jpg\" alt=\"Imagen 8\">\n    <\/div>\n    <div class=\"gallery-item\" onclick=\"openLightbox(8)\">\n        <img decoding=\"async\" src=\"http:\/\/uccap.net\/wp-content\/uploads\/2021\/04\/SAM_0028.jpg\" alt=\"Imagen 9\">\n    <\/div>\n    <div class=\"gallery-item\" onclick=\"openLightbox(9)\">\n        <img decoding=\"async\" src=\"http:\/\/uccap.net\/wp-content\/uploads\/2021\/04\/77279955_2702531959786062_433278693117263872_n.jpg\" alt=\"Imagen 10\">\n    <\/div>\n    <div class=\"gallery-item\" onclick=\"openLightbox(10)\">\n        <img decoding=\"async\" src=\"http:\/\/uccap.net\/wp-content\/uploads\/2023\/06\/314.jpg\" alt=\"Imagen 11\">\n    <\/div>\n<\/div>\n\n<div id=\"lightbox\" class=\"lightbox\">\n    <span class=\"close\" onclick=\"closeLightbox()\">&times;<\/span>\n    <img decoding=\"async\" id=\"lightbox-image\" class=\"lightbox-image\" src=\"\" alt=\"\">\n    <a class=\"prev\" onclick=\"changeImage(-1)\">&#10094;<\/a>\n    <a class=\"next\" onclick=\"changeImage(1)\">&#10095;<\/a>\n<\/div>\n\n<script>\n    let currentIndex = 0;\n    const images = [\n        \"http:\/\/uccap.net\/wp-content\/uploads\/2023\/06\/314.jpg\",\n        \"http:\/\/uccap.net\/wp-content\/uploads\/2023\/06\/313.jpg\",\n        \"http:\/\/uccap.net\/wp-content\/uploads\/2023\/06\/312.jpg\",\n        \"http:\/\/uccap.net\/wp-content\/uploads\/2021\/02\/thmb-panama.jpg\",\n        \"http:\/\/uccap.net\/wp-content\/uploads\/2021\/02\/thmb-nicaragua.jpg\",\n        \"http:\/\/uccap.net\/wp-content\/uploads\/2021\/02\/thmb-honduras.jpg\",\n        \"http:\/\/uccap.net\/wp-content\/uploads\/2021\/02\/thmb-guate.jpg\",\n        \"http:\/\/uccap.net\/wp-content\/uploads\/2021\/02\/thmb-salvador.jpg\",\n        \"http:\/\/uccap.net\/wp-content\/uploads\/2021\/04\/SAM_0028.jpg\",\n        \"http:\/\/uccap.net\/wp-content\/uploads\/2021\/04\/77279955_2702531959786062_433278693117263872_n.jpg\",\n        \"http:\/\/uccap.net\/wp-content\/uploads\/2023\/06\/314.jpg\"\n    ];\n\n    function openLightbox(index) {\n        currentIndex = index;\n        document.getElementById(\"lightbox-image\").src = images[currentIndex];\n        document.getElementById(\"lightbox\").style.display = \"flex\";\n    }\n\n    function closeLightbox() {\n        document.getElementById(\"lightbox\").style.display = \"none\";\n    }\n\n    function changeImage(direction) {\n        currentIndex += direction;\n        if (currentIndex < 0) {\n            currentIndex = images.length - 1;\n        } else if (currentIndex >= images.length) {\n            currentIndex = 0;\n        }\n        document.getElementById(\"lightbox-image\").src = images[currentIndex];\n    }\n<\/script>\n<\/div><\/div><div id=\"pgc-2541-2-2\"  class=\"panel-grid-cell panel-grid-cell-empty\" ><\/div><\/div><\/div><\/div>","protected":false},"excerpt":{"rendered":"<p>Galer\u00eda &times; &#10094; &#10095;<\/p>\n","protected":false},"author":2,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"acf":[],"_links":{"self":[{"href":"https:\/\/uccap.net\/index.php?rest_route=\/wp\/v2\/pages\/2541"}],"collection":[{"href":"https:\/\/uccap.net\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/uccap.net\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/uccap.net\/index.php?rest_route=\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/uccap.net\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=2541"}],"version-history":[{"count":3,"href":"https:\/\/uccap.net\/index.php?rest_route=\/wp\/v2\/pages\/2541\/revisions"}],"predecessor-version":[{"id":2544,"href":"https:\/\/uccap.net\/index.php?rest_route=\/wp\/v2\/pages\/2541\/revisions\/2544"}],"wp:attachment":[{"href":"https:\/\/uccap.net\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=2541"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}