.elementor-620 .elementor-element.elementor-element-434180d{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--margin-top:-4em;--margin-bottom:0em;--margin-left:0em;--margin-right:0em;--padding-top:0em;--padding-bottom:0em;--padding-left:0em;--padding-right:0em;}.elementor-620 .elementor-element.elementor-element-434180d:not(.elementor-motion-effects-element-type-background), .elementor-620 .elementor-element.elementor-element-434180d > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-text );}.elementor-620 .elementor-element.elementor-element-528a618{--display:flex;--justify-content:center;--padding-top:2em;--padding-bottom:2em;--padding-left:2em;--padding-right:2em;}.elementor-620 .elementor-element.elementor-element-528a618.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-620 .elementor-element.elementor-element-b741b2d{--display:flex;--padding-top:0px;--padding-bottom:300px;--padding-left:0px;--padding-right:0px;}.elementor-620 .elementor-element.elementor-element-d0c3ff8 .elementor-heading-title{font-size:37px;color:var( --e-global-color-secondary );}.elementor-620 .elementor-element.elementor-element-5f77831{font-family:"Trebuchet MS", Sans-serif;color:var( --e-global-color-accent );}.elementor-620 .elementor-element.elementor-element-63d9dee{--display:flex;}.elementor-620 .elementor-element.elementor-element-1423d2c{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--margin-top:0em;--margin-bottom:0em;--margin-left:0em;--margin-right:0em;--padding-top:0em;--padding-bottom:0em;--padding-left:0em;--padding-right:0em;}.elementor-620 .elementor-element.elementor-element-1423d2c:not(.elementor-motion-effects-element-type-background), .elementor-620 .elementor-element.elementor-element-1423d2c > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-text );}.elementor-620 .elementor-element.elementor-element-975d5f5{--display:flex;}.elementor-620 .elementor-element.elementor-element-f22782c{--display:flex;--justify-content:center;--padding-top:2em;--padding-bottom:2em;--padding-left:2em;--padding-right:2em;}.elementor-620 .elementor-element.elementor-element-f22782c.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-620 .elementor-element.elementor-element-1abb07a{--display:flex;--padding-top:0px;--padding-bottom:300px;--padding-left:0px;--padding-right:0px;}.elementor-620 .elementor-element.elementor-element-eb411e8 .elementor-heading-title{font-size:37px;color:var( --e-global-color-secondary );}.elementor-620 .elementor-element.elementor-element-e99fcbb{font-family:"Trebuchet MS", Sans-serif;color:var( --e-global-color-accent );}.elementor-620 .elementor-element.elementor-element-6b3d315{--display:flex;--flex-direction:row;--container-widget-width:initial;--container-widget-height:100%;--container-widget-flex-grow:1;--container-widget-align-self:stretch;--flex-wrap-mobile:wrap;--margin-top:-4em;--margin-bottom:0em;--margin-left:0em;--margin-right:0em;--padding-top:0em;--padding-bottom:0em;--padding-left:0em;--padding-right:0em;}.elementor-620 .elementor-element.elementor-element-6b3d315:not(.elementor-motion-effects-element-type-background), .elementor-620 .elementor-element.elementor-element-6b3d315 > .elementor-motion-effects-container > .elementor-motion-effects-layer{background-color:var( --e-global-color-text );}.elementor-620 .elementor-element.elementor-element-18c4a2b{--display:flex;--justify-content:center;--padding-top:2em;--padding-bottom:2em;--padding-left:2em;--padding-right:2em;}.elementor-620 .elementor-element.elementor-element-18c4a2b.e-con{--flex-grow:0;--flex-shrink:0;}.elementor-620 .elementor-element.elementor-element-3c36151{--display:flex;--padding-top:0px;--padding-bottom:300px;--padding-left:0px;--padding-right:0px;}.elementor-620 .elementor-element.elementor-element-4973aec .elementor-heading-title{font-size:37px;color:var( --e-global-color-secondary );}.elementor-620 .elementor-element.elementor-element-21c0f4d{font-family:"Trebuchet MS", Sans-serif;color:var( --e-global-color-accent );}.elementor-620 .elementor-element.elementor-element-0d577c9{--display:flex;}@media(min-width:768px){.elementor-620 .elementor-element.elementor-element-528a618{--width:29.707%;}.elementor-620 .elementor-element.elementor-element-f22782c{--width:29.707%;}.elementor-620 .elementor-element.elementor-element-18c4a2b{--width:29.707%;}}/* Start custom CSS for html, class: .elementor-element-175848e */<style>
        /* Estilos generales para la demo */
        body {
            margin: 0;
            padding: 0;
            font-family: sans-serif;
            background-color: black !important;
            
        }

        .spacer {
            height: 100vh;
            display: flex;
            align-items: center;
            justify-content: center;
            background: #333;
            color: white;
            font-size: 2rem;
        }

        /* 
         * ESTILOS CRÍTICOS PARA ELEMENTOR 
         * Copia desde aquí para tu widget HTML
         */

        /* Contenedor principal que define la "pista" de scroll */
        #hamburguesa-scroll-track {
            height: 300vh;
            /* Ajusta esto para hacer la animación más lenta o rápida (más altura = más lento) */
            position: relative;
            background-color: #fff;
            /* Opcional: color de fondo */
        }

        /* Contenedor pegajoso que mantiene la imagen centrada */
        .hamburguesa-sticky-container {
            position: sticky;
            top: 0;
            left: 0;
            width: 100%;
            height: 100vh;
            display: flex;
            align-items: center;
            justify-content: center;
            overflow: hidden;
            background: black;
        }

        /* El canvas donde se dibuja la imagen */
        #hamburguesa-canvas {
            max-width: 100%;
            max-height: 100%;
            object-fit: contain;
        }

        /* Cargador opcional */
        #hamburguesa-loader {
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            font-size: 1.2rem;
            color: #666;
            z-index: 10;
        }
    </style>/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-c0d5d96 */<style>
        /* Estilos generales para la demo */
        body {
            margin: 0;
            padding: 0;
            font-family: sans-serif;
            background-color: black !important;
            
        }

        .spacer {
            height: 100vh;
            display: flex;
            align-items: center;
            justify-content: center;
            background: #333;
            color: white;
            font-size: 2rem;
        }

        /* 
         * ESTILOS CRÍTICOS PARA ELEMENTOR 
         * Copia desde aquí para tu widget HTML
         */

        /* Contenedor principal que define la "pista" de scroll */
        #granvia-scroll-track {
            height: 300vh;
            /* Ajusta esto para hacer la animación más lenta o rápida (más altura = más lento) */
            position: relative;
            background-color: #fff;
            /* Opcional: color de fondo */
        }

        /* Contenedor pegajoso que mantiene la imagen centrada */
        .granvia-sticky-container {
            position: sticky;
            top: 0;
            left: 0;
            width: 100%;
            height: 100vh;
            display: flex;
            align-items: center;
            justify-content: center;
            overflow: hidden;
            background: black;
        }

        /* El canvas donde se dibuja la imagen */
        #granvia-canvas {
            max-width: 100%;
            max-height: 100%;
            object-fit: contain;
        }

        /* Cargador opcional */
        #granvia-loader {
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            font-size: 1.2rem;
            color: #666;
            z-index: 10;
        }
    </style>/* End custom CSS */
/* Start custom CSS for html, class: .elementor-element-5f2218d */<style>
        /* Estilos generales para la demo */
        body {
            margin: 0;
            padding: 0;
            font-family: sans-serif;
            background-color: black !important;
            
        }

        .spacer {
            height: 100vh;
            display: flex;
            align-items: center;
            justify-content: center;
            background: #333;
            color: white;
            font-size: 2rem;
        }

        /* 
         * ESTILOS CRÍTICOS PARA ELEMENTOR 
         * Copia desde aquí para tu widget HTML
         */

        /* Contenedor principal que define la "pista" de scroll */
        #betis-scroll-track {
            height: 300vh;
            /* Ajusta esto para hacer la animación más lenta o rápida (más altura = más lento) */
            position: relative;
            background-color: #fff;
            /* Opcional: color de fondo */
        }

        /* Contenedor pegajoso que mantiene la imagen centrada */
        .betis-sticky-container {
            position: sticky;
            top: 0;
            left: 0;
            width: 100%;
            height: 100vh;
            display: flex;
            align-items: center;
            justify-content: center;
            overflow: hidden;
            background: black;
        }

        /* El canvas donde se dibuja la imagen */
        #betis-canvas {
            max-width: 100%;
            max-height: 100%;
            object-fit: contain;
        }

        /* Cargador opcional */
        #betis-loader {
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            font-size: 1.2rem;
            color: #666;
            z-index: 10;
        }
    </style>/* End custom CSS */