:root {
    --color_principal: #124857; /*color del evento*/
    --color_contraste: #ffffff;
    --color_complementario: #ea7d2f;
    --color_fondo_body: #ffffff;
    --color_fondo_bloques: #ffffff;
    --color_fondo_footer: #124857;
    --color_texto_footer: #ffffff;
    --color_transparente: #ffffff00;
    --color_principal_transparente: #27a3c346;
    --color_sombras_principal: #808080;
    --color_texto_general: #5c5c5c;
    --color_texto_resaltado: #434343;
    --fuente_especial: PT Sans, sans-serif;
    --fuente_general: Open Sans, sans-serif;
    --color_span_titulo_seccion: #124857;

    --color_fondo_titulo_evento: #124857;
    --color_texto_titulo_evento: #ffffff;
    --color_sombra_titulo_evento: #000000;

    --color_fondo_svg_item_fecha_lugar: #124857;
    --color_svg_item_fecha_lugar: #ffffff;
    --color_fondo_section_fecha_lugar: #ffffff;
    --color_fondo_item_fecha_lugar: #124857;
    --color_texto_general_fecha_lugar: #d0dadd;
    --color_texto_resaltado_fecha_lugar: #ffffff;

    --color_texto_boton_registro: #ffffff;
    --color_sombra_texto_boton_registro: #000000;
    --color_fondo_boton_registro: #124857;
    --color_texto_caja_registro_fecha_lugar: #124857;

    --color_caja_transmision: #124857;
    --color_texto_caja_transmision: #ffffff;
    --color_fondo_boton_transmision: #124857;
    --color_texto_boton_transmision: #ffffff;

    --color_fondo_section_empresa: #d0dadd;
    --color_texto_nombre_empresa: #124857;
    --color_sombra_texto_nombre_empresa: #000000;
    --color_texto_descripcion_empresa: #434343;
    --color_fondo_boton_perfil_empresa: #124857;
    --color_texto_boton_perfil_empresa: #ffffff;

    --color_cajas_temporizador: #124857;
    --color_fondo_caja_texto_temporizador: #ffffff;
    --color_numerico_temporizador: #ffffff;
    --color_texto_general_temporizador: #124857;
    --color_texto_resaltado_temporizador: #434343;

    --color_titulo_descripcion: #124857;

    --color_titulo_detalles: #124857;
    --color_texto_resaltado_detalles: #124857;
    --color_fondo_section_detalles: #d0dadd;
    --color_texto_general_detalles: #434343;

    --color_titulo_conferencistas: #124857;
    --color_border_caja_conferencista: #124857;
    --color_icono_conferencista: #124857;
    --color_fondo_span_cargo: #ffffff;
    --color_texto_trayectoria: #e7f9f8;
    --color_fondo_texto_trayectoria: #124857;
    --color_fondo_section_conferencistas: #ffffff;
    --color_fondo_caja_conferencista: #124857;
    --color_nombre_conferencistas: #ffffff;
    --color_texto_span_cargos: #124857;

    --color_fondo_section_cronograma: #ffffff;
    --color_bordes_section_cronograma: #124857;
    --color_fondo_boton_ver_cronograma: #124857;
    --color_texto_boton_ver_cronograma: #ffffff;
    --color_titulo_cronograma: #124857;
}                
    html {
        box-sizing: border-box;
        font-size: 62.5%; /* 1 rem = 10px */    
    }
    *, *:before, *:after {
        box-sizing: inherit;
    }


    body{
        width: 100%;
        margin:0;
        padding:0;
        font-size: 1.5rem;
        font-family: var(--fuente_general);

        display:flex;
        flex-direction: column;
        align-items: center;
        background-color: var(--color_fondo_body);

    }

    @keyframes palpitar{
        0%, 100% {
        transform: scale(1);
        opacity: 1;


        }
        50% {
        transform: scale(1.02);
        opacity: 0.95;
        }
    }

    /*para el editor*/
    @keyframes blinkBorder{
        0%, 100% {
        border-color: transparent;
        box-shadow: none;
        }
        50% {
        border-color: #42f3de;
        /* box-shadow: 0 0 10px #0d0d0d, 1px 1px 5px inset black;  */
        }
    }

    .section{
        position: relative;
    }

    .section.active::before{
        content: "";
        position: absolute;
        top: -4px;
        left: -4px;
        right: -4px;
        bottom: -4px;
        border: 10px dashed transparent;
        border-radius: 8px;
        pointer-events: none;
        animation: blinkBorder 3s infinite;
        z-index: 100;
    }

    .etiqueta_ref{
        display: none !important;
        padding:0px;
        margin:0px
    }
    /*fin css editor*/



    /******************************Genericos**************************/

        .resaltar{
            font-size: 1.7rem;
            font-weight:bolder;
        }
        .subtitulo{
            color: var(--color_principal);
            font-size: 20px;
            font-weight:bold;
            padding: 1rem;
            text-shadow: 1px 1px 2px color-mix(in srgb, var(--color_principal), var(--color_sombras_principal) 50%);
            text-align: center;
            position: relative;
            .burbuja{
                position: absolute;
                top: 10px;
                left: -5%;
                width: 110%;
                height: 60px;

                background-image: linear-gradient(to right, rgba(255, 255, 255, 0.391), rgba(255, 255, 255, 0.214),  rgba(255, 255, 255, 0.58) );
                border-radius: 6px;
                box-shadow: 1px 1px 3px gray ;

            }
        }
        .salto_linea-1{
            width: 100%;
            height: 2rem
        }
        .salto_linea-2{
            width: 100%;
            height: 5rem;
        }

        .svg_dinamic{
            fill: rgba(255, 255, 255, 0);         /* Color de relleno de las formas */
            background-color: #ffffff00; /* Fondo del contenedor SVG (visible si defines width/height) */
            stroke: var(--color_complementario);        /* Color del trazo de las líneas */
            stroke-width: 2px;     /* Ancho del trazo */
        }

        .boton_red_social{
            border: 2px outset rgba(192, 192, 192, 0.555);
            padding: 0.4rem;
            border-radius: 4px;
            display:flex;
            justify-content: center;
            text-decoration: none;
            width: 35px;
            background-color:#f1f1f1; 
            border: 2px outset rgba(192, 192, 192, 0.363);
            box-shadow: 2px 2px 4px gray, 2px 2px 5px 2px white inset;
            /*
            border: 1px inset rgba(192, 192, 192, 0.555);
            box-shadow: 2px 2px 2px gray, 2px 2px 5px 5px white inset;
            */

            svg{
                fill: #ffffff;         /* Color de relleno de las formas */
                background-color: #f1f1f1; /* Fondo del contenedor SVG (visible si defines width/height) */
                stroke: var(--color_principal);        /* Color del trazo de las líneas */
                stroke-width: 2px;     /* Ancho del trazo */
                width: 20px;
                height: 20px;
            }

            &:hover{
                border: 1px inset rgba(192, 192, 192, 0.363);
                box-shadow: 2px 2px 2px gray, 2px 2px 5px 5px white inset;
            }
        }
    /******************************Genericos**************************/

    header{
        width: 100%;
        height: auto;
        padding:0px;
        background-color: rgb(255, 255, 255);
        border: 1px outset white;

        nav{
            width: 100%;
            display: flex;
            flex-direction: row;
            justify-content: space-between;
            .logo_medio{
                display:inline-block;
                width: 6rem;
                height: 6rem;
            }
        
        }
    }

    .section_titulo_afiche{
        display:flex;
        justify-content: center;
        align-items:top;
        width:100%;
        min-height: 15rem;

        gap: 2px;

        .contenedor_afiche{
            display:flex;
            flex-direction: column;
            justify-content: top;
            align-items: center;
            width: 80%;
            padding: 0rem 0rem;
            gap: 3px;

            .caja_afiche{
                position: relative;
                display:flex;
                justify-content: left;
                align-items: center;
                flex-grow: 1;
                background-color: var(--color_fondo_titulo_evento);
                width: 100%;
                padding: 4rem;
                padding-left: 12rem;
                .titulo_evento{
                    color: var(--color_texto_titulo_evento);
                    font-size: 5rem;
                    text-shadow: 1px 3px 1px var(--color_sombra_titulo_evento);
                    width: 50%;
                    max-width: 350px;
                    font-weight: bolder;

                    .estilo_especial{
                        font-size: 8.5rem;
                    }
                }
                .logo_empresa{
                    position: absolute;
                    top: 10px;
                    right: 10px;
                    width: 20%;
                    max-width: 120px;
                    height: auto;
                    background-color: rgba(255, 255, 255, 0.456);
                    background-color: white;
                    border-radius: 4px;
                    padding: 1rem;
                }
            }

            @media(max-width: 768px){
                &{/*contenedor_afiche*/
                    width: 90%;

                    .caja_afiche{
                        padding-left: 4rem;

                        .titulo_evento{
                            font-size: 3rem;

                            .estilo_especial{
                                font-size: 3.5rem;
                            }
                        }
                    }
                }
            }
        }
    }

    .section_fecha_lugar{
        display: flex;
        width: 80%;
        background-color: var(--color_fondo_section_fecha_lugar);
        padding: 2rem 0.5rem 3rem 2rem;
        gap: 0.5rem;
        .caja_info{
            display:flex;
            flex-direction: column;
            justify-content: center;
            gap: 1rem;
            width: 65%;
            /* margin-right:1rem; */
            .caja_item{
                display:flex;
                align-items: center;
                gap: 4px;
                background-color: var(--color_fondo_item_fecha_lugar);
                padding: 1rem;
                border-radius: 8px;
                padding-left: 2rem;
            }
            .svg_item{
                fill: #ffffff00;  
                background-color: var(--color_fondo_svg_item_fecha_lugar);/*se requiere SIN transparencia*/
                stroke: var(--color_svg_item_fecha_lugar);
                stroke-width: 2px;     
                width: 30px;
                height: 30px;
                min-width: 30px;
                padding: 3px;
                border-radius: 6px;
                /* margin-right: 1rem; */
            }
            .resaltar{
                font-weight: bold;
                color: var(--color_texto_resaltado_fecha_lugar);
                text-shadow: 1px 1px 3px black;
            }
            span{
                color: var(--color_texto_general_fecha_lugar);
            }
        }
        .caja2{
            width: 35%;
            display:flex;
            flex-direction: column;
            align-items: center;
            justify-content: center;
            gap: 3rem;

            .caja_registro{
                display:flex;
                flex-direction: column;
                align-items: center;
                gap: 1rem;
                padding :1rem;
                text-align:center;

                span{
                    color: var(--color_texto_caja_registro_fecha_lugar);
                    font-weight: bolder;
                    font-size: 30px;
                }
                button{
                    padding: 1rem 2rem;
                    width: 200px;
                    color: var(--color_texto_boton_registro);
                    text-shadow: 1px 1px 1px var(--color_sombra_texto_boton_registro);
                    cursor: pointer;
                    display:flex;
                    justify-content: center;
                    align-items:center;
                    gap: 2rem;
                    font-size: 18px;
                    font-weight:bold;
                    animation: palpitar 1.5s infinite ease-in-out;
                    border-radius: 3px;
                    background-image: linear-gradient(to bottom, color-mix(in srgb, var(--color_fondo_boton_registro) , white 42%), 
                    var(--color_fondo_boton_registro),
                    color-mix(in srgb, var(--color_fondo_boton_registro) , black 25%));
                    border: 2px outset color-mix(in srgb, var(--color_fondo_boton_registro) , white 28%);
                    border-radius: 6px;
                    box-shadow: -2px -2px 4px inset color-mix(in srgb, var(--color_fondo_boton_registro) , black 20%),
                    1px 2px 4px inset color-mix(in srgb, var(--color_fondo_boton_registro) , white 40%),
                    1px 1px 5px #232323;

                    .svg_item{
                        stroke: var(--color_texto_boton_registro);
                    }
        
                    &:hover{
                        animation:none;

                        transform: scale(1.02);
                        background-image: linear-gradient(
                            to right,
                            var(--color_fondo_boton_registro),
                            color-mix(in srgb, var(--color_fondo_boton_registro), black 0%)
                        );
                    }
                }
            }
        }
        @media(max-width: 920px){
            &{/*section_fecha_lugar*/
                width:90%;
            }
        }
        @media(max-width: 768px){
            &{ /*section_fecha_lugar*/
                width:90%;
                flex-direction: column;
                gap: 2rem;
                padding-left: 0px;
                padding: 1rem;
                align-items: center;

                .caja_info{
                    width: 100%;
                    font-size: 12px;
                    .caja_item{
                        padding-left: 0px;
                        padding: 1rem 0.5rem;

                    }
                }
                .caja2{
                    width: 90%;
                    align-items: center;
                }
            }
        }
    }

    main{
        width: 90%;
        display:flex;
        flex-direction: column;
        align-items: center;
        gap: 0rem;
        background-color: #ffffff00;  /*Transparencia*/

        &{
            @media(max-width: 768px){
                width: 90%;
                width: 100%;
            }
        }
    }

    .wrapper_sections{ /*contiene la 'sección temporizador' y la 'sección empresa'*/
        display: flex;
        flex-wrap: wrap-reverse;
        justify-content: space-around;
        align-items: center;
        width: 100%;
        padding: 5rem 2rem;
        gap: 4rem;
        background-color: var(--color_fondo_section_empresa);
        
        .wrapper_son{
            width:auto;
            display:flex;
            flex-wrap:wrap;
            justify-content: space-evenly;
            align-items: center;
            gap: 4rem;
            width:100%;
        }

        .celda_transmision{
            max-height: 200px;
            display:flex;
            flex-direction: column;
            justify-content:space-between; 
            align-items: center;
            gap: 2rem;
            border: 3px solid var(--color_caja_transmision); 
            padding:0px; 
            padding-bottom: 2rem;
            border-radius: 8px;
            .span_transmision{
                color: var(--color_texto_caja_transmision);
                font-weight: bolder;
                font-size: 20px;
                max-width: 300px;
                text-align: center;
                width: 100%;
                padding:2rem 0rem;
                background-color: var(--color_caja_transmision);
            }
            button{
                padding: 1rem 2rem;
                width: 200px;
                border: 1px outset var(--color_fondo_boton_transmision);
                color: var(--color_texto_boton_transmision);
                cursor: pointer;
                display:flex;
                justify-content: center;
                align-items:center;
                gap: 2rem;
                font-size: 18px;
                font-weight:bold;
                background-color: var(--color_fondo_boton_transmision);

                box-shadow: 1px 1px 8px inset color-mix(in srgb, var(--color_fondo_boton_transmision), black 40%), 1px 1px 3px color-mix(in srgb, var(--color_fondo_boton_transmision), black 60%);
                border-radius: 3px;
                animation: palpitar 1.5s infinite ease-in-out;
                transition: transform 0.4s ease-in-out;

                .svg_item{
                    stroke: var(--color_texto_boton_transmision);
                }

                &:hover{
                    animation: none;
                    transform: scale(1.02);
                    background-image: linear-gradient(
                        to right,
                        var(--color_fondo_boton_transmision),
                        color-mix(in srgb, var(--color_fondo_boton_transmision), var(--color_sombras_principal) 10%)
                        );
                }
            }
        }

        .section_empresa{
            display: flex;
            justify-content: center;
            padding-bottom: 2rem;

            .contenedor_detalles_empresa{
                display: flex;
                flex-direction: column;
                justify-content: space-between;
                position: relative;
                min-width: 280px;
                width: 100%;
                max-width: 400px;
            
                .titulo{
                    display:flex;
                    flex-direction: column;
                    justify-content: center;
                    align-items: center;
                    font-weight: bolder;
        
                    .wrapper{
                        width: 100%;
                        font-size: 12px;
                        display:flex;
                        flex-direction: row;
                        justify-content: left;
                        align-items: center;
        
                        span{
                            color: var(--color_principal);
                            font-weight: bolder;
                        }
                    }
                    .renglon_titulo{
                        font-size: 18px;
                        width: 100%;
        
                        h2{
                            padding:0px;
                            margin: 0px;
                            text-align: left;
                            color: var(--color_texto_nombre_empresa);
                            text-shadow: 1px 1px 2px var(--color_sombra_texto_nombre_empresa);

                            @media(max-width: 768px){
                                &{
                                    font-size: 16px;
                                }

                            }
                        }

                    }
                }
        
                .descripcion_empresa{
                    display:flex;
                    flex-direction: column;
                    justify-content: left;
                    align-items: center;
        
                    .contenido_descripcion{
                        padding-right: 2rem;
                        text-align: justify;
                        color: var(--color_texto_descripcion_empresa);
                        font-size: 12px;
                        margin: 0px;
                        margin-top: 1rem;
                        margin-bottom: 1rem;
                        b{
                            font-size: 14px;
                            font-weight: 600;
                            color: var(--color_texto_resaltado);

                        }

                    }
                    .texto_pie{
                        width: 100%;
                        text-align: left;
                        font-size: 12px;
                        color: var(--color_texto_descripcion_empresa);
                        font-weight: bold;
                        padding: 5px;
                    }
                }
        
                .caja_perfil_empresa{
                    width: 100%;
                    margin: 0 auto;
                    height: auto;
                    margin-top: 1rem;
                    display:flex;
                    flex-wrap: wrap;
                    justify-content: left;
                    align-items: stretch;
                    padding: 5px;
                    gap: 2rem;
        
                    .btn_web_empresa{
                        display:flex;
                        align-items: center;
                        justify-content: center;
                        gap: 1rem;
                        text-decoration: none;
                        color: var(--color_texto_boton_perfil_empresa);
                        font-weight: bolder;
                        padding: 0.5rem 1rem;
                        background-color: var(--color_fondo_boton_perfil_empresa);
                        box-shadow: 1px 2px 4px black;
                        border: 2px outset var(--color_fondo_boton_perfil_empresa);
                        transition: transform 0.5s ease-in-out;
                        animation: palpitar 2.5s infinite ease-in-out;
                        background-image: linear-gradient(to bottom, color-mix(in srgb, var(--color_fondo_boton_perfil_empresa) , white 42%), 
                        var(--color_fondo_boton_perfil_empresa),
                        color-mix(in srgb, var(--color_fondo_boton_perfil_empresa) , black 25%));
                        border: 2px outset color-mix(in srgb, var(--color_fondo_boton_perfil_empresa) , white 28%);
                        border-radius: 6px;
                        box-shadow: -2px -2px 4px inset color-mix(in srgb, var(--color_fondo_boton_perfil_empresa) , black 20%),
                        1px 2px 4px inset color-mix(in srgb, var(--color_fondo_boton_perfil_empresa) , white 40%),
                        1px 1px 5px #232323;
                        
                        .svg_dinamic{
                            width: 20%;
                            fill: #ffffff00;        /* Color de relleno de las formas */
                            background-color: #f0f0f000; /* Fondo del contenedor SVG (visible si defines width/height) */
                            stroke: var(--color_texto_boton_perfil_empresa);       /* Color del trazo de las líneas */
                            stroke-width: 2px;     /* Ancho del trazo */
                        }
        
                        &:hover{
                            animation:none;
                            transform: scale(1.01);
                        }
                    }
        
                    .btn_perfil_empresa{
                        display:flex;
                        justify-content: center;
                        align-items: center;
                        text-decoration: none;
                        color: var(--color_fondo_boton_perfil_empresa);
                        padding: 0.5rem 1rem;
                        gap: 1rem;
                        font-weight: bold;
                        background-color: var(--color_texto_boton_perfil_empresa);
                        transition: transform 0.5s ease-in-out;
                        background-image: linear-gradient(to bottom, color-mix(in srgb, var(--color_texto_boton_perfil_empresa) , white 42%), 
                        var(--color_texto_boton_perfil_empresa),
                        color-mix(in srgb, var(--color_texto_boton_perfil_empresa) , black 25%));
                        border: 2px outset color-mix(in srgb, var(--color_texto_boton_perfil_empresa) , white 28%);
                        border-radius: 6px;
                        box-shadow: -2px -2px 4px inset color-mix(in srgb, var(--color_texto_boton_perfil_empresa) , black 20%),
                        1px 2px 4px inset color-mix(in srgb, var(--color_texto_boton_perfil_empresa) , white 40%),
                        1px 1px 5px #232323;
            
                        &:hover{
                        border: 1px outset rgba(192, 192, 192, 0.466);
                        box-shadow: 1px 1px 5px gray;
                        transform: scale(1.08);
                        }
                        svg{
                            width: 20px;
                            height: 20px;
                        }
                    }
                } 
            }
        }

        .section_temporizador{
            width: 100%;
            max-width: 500px;
            display:flex; 
            flex-direction: column;
            align-items: center;
            justify-content: center;
            padding: 4rem 2rem;

            .span_titulo_temporizador{
                color: var(--color_texto_general_temporizador);
                font-weight: bolder;
                font-size: 24px;
                display:flex;
                justify-content: center;
                align-items: center;
                gap: 1rem;
                margin-bottom: 2rem;
                
                svg{
                    fill: #ffffff00;
                    background-color: #ffffff00;
                    stroke: var(--color_texto_general_temporizador);
                    stroke-width: 2px;
                }
            }
        
            .caja_temporizador{
                display: flex;
                justify-content: center;
                gap: 1rem;
        
                .caja{
                    width: 100px;
                    height: 100px;
                    display: flex;
                    flex-direction: column;
                    align-items: center;
                    justify-content: space-between;
                    border-radius: 4px;
                    box-shadow: 3px 6px 8px 1px var(--color_sombras_principal);
                    .texto{
                        width: 100%;
                        background-color: var(--color_fondo_caja_texto_temporizador);
                        color: var(--color_texto_resaltado_temporizador);
                        text-align: center;
                        border-bottom-left-radius: 4px;
                        border-bottom-right-radius: 4px;
                        padding: 0.5rem;
                        display:flex;
                        align-items: center;
                        justify-content: center;
                        flex:1;
                    }
                    .numerico{
                        width: 100%;
                        font-size: 30px;
                        font-weight: bolder;
                        text-align: center;
                        padding: 2rem 1.5rem;
                        color: var(--color_numerico_temporizador);
                        border-radius:0;
                        background-color: var(--color_cajas_temporizador);
                        text-shadow: 1px 1px 2px black;
                    }
                }
                @media(max-width: 768px){
                    .caja{
                        width: 70px;
                        span{
                            font-size: 10px;
                            font-weight: bold;
                        }
                        .numerico{
                            font-size: 24px;
                            padding: 2rem 0.5rem;
                        }
                    }
                }
            }
        }
    }

    .section_descripcion_evento{
        padding: 3rem 6rem 0rem 6rem; 
        font-size: 20px;
        .caja_titulo_seccion{
            .span_titulo{ 
                display: inline-flex;
                justify-content: center;
                align-items:center;
                gap: 1rem;
                width:auto;
                border-bottom: 2px solid var(--color_titulo_descripcion);
                margin-bottom: 2rem;
                color: var(--color_titulo_descripcion);
            }

            .svg_dinamic{
                fill: #ffffff00;         /* Color de relleno de las formas */
                background-color: #f0f0f000; /* Fondo del contenedor SVG (visible si defines width/height) */
                /* stroke: #000000;         */
                stroke: var(--color_titulo_descripcion);        
                stroke-width: 2px;     /* Ancho del trazo */
                width: 30px;
                height: 30px;
            }

        }
        img{
            width: 100%; max-width: 800px;
        }

        @media(max-width: 768px){
            &{
                padding: 4rem 1.5rem 1rem 1.5rem;
                font-size: 18px;
            }

        }
    }

    .section_detalles{
        background-color: var(--color_fondo_section_detalles);
        padding: 4rem 6rem;
        font-size: 20px;

        .caja_titulo_seccion{
            text-align: center;

            .span_titulo_seccion{
                display: inline-flex;
                justify-content: center;
                align-items:center;
                width:auto;
                padding: 1rem 1rem;
                border-bottom: 2px solid var(--color_titulo_detalles);
                margin-bottom: 2rem;
                color: var(--color_titulo_detalles);
                gap: 1rem;
            }
            .svg_dinamic{
                fill: #ffffff00;         /* Color de relleno de las formas */
                background-color: rgba(240, 240, 240, 0); /* Fondo del contenedor SVG (visible si defines width/height) */
                stroke: var(--color_titulo_detalles);        /* Color del trazo de las líneas */
                stroke-width: 2px;     /* Ancho del trazo */
            }
        }

        .caja_contenido_detalles{
            display:flex;
            flex-direction: column;
            gap: 3rem;
            padding: 1rem 2rem 1rem 0.2rem;
            
            font-size: 18px;
            width: 85%;

            .caja_detalle{
                display: flex;
                flex-direction: column;
                justify-content: center;
                align-items:baseline;
                padding-left: 20px;
                color: var(--color_texto_general_detalles);
                gap: 1rem;
                

                .subtitulo_detalle{
                    font-weight: bold;
                    color: var(--color_texto_resaltado_detalles);
                    text-shadow: 1px 1px 1px rgb(56, 56, 56);
                }

                span{
                    text-align: justify;
                }
                .especial{
                    font-style: italic;
                    font-weight: bolder;
                }
                .item{
                    position: relative;
                    padding-left:5px;
                    text-align: justify;
                    display:flex;
                    align-items: center;
                    gap: 0.5rem;

                    .svg_point{
                        stroke: var(--color_principal);
                        fill: var(--color_principal);
                        width: 12px;
                        height: 12px;
                        min-width: 12px;
                        margin-left: 0.4rem;
                        stroke-width: 4;
                    }
                }
            }
        }
        
        @media(max-width: 768px){
            &{/*section_Detalles*/
                padding: 3rem 1.5rem; 
                font-size: 14px;
                .caja_contenido_detalles{
                    width: 100%;

                }
            }
        }
    }

    .bloque_section_conferencistas{
        display: flex;
        flex-direction: column;
        align-items: center;
        background-color: var(--color_fondo_section_conferencistas);
        padding: 3rem 1rem;
        padding-bottom: 5rem;
        width: 100%;

        .caja_titulo_seccion{
            .span_titulo_seccion{
                display: inline-flex;
                justify-content: center;
                align-items:center;
                width:auto;
                padding: 1rem;
                border-bottom: 2px solid var(--color_titulo_conferencistas);
                margin-bottom: 4rem;
                color: var(--color_titulo_conferencistas);
                gap: 1rem;
            }
            .svg_dinamic{
                fill: #fff;         /* Color de relleno de las formas */
                background-color: #ffffff00; /* Fondo del contenedor SVG (visible si defines width/height) */
                stroke: var(--color_titulo_conferencistas);        /* Color del trazo de las líneas */
                stroke-width: 2px;     /* Ancho del trazo */
            }
        }

        .wrapper_invitado_especial{
            display:flex;
            flex-wrap: wrap;
            justify-content: space-around;
            gap: 6rem;
            padding: 4rem;

            .caja_conferencista.especial{
                display:flex;
                flex-direction: column;
                justify-content: center;
                background-color: var(--color_fondo_caja_conferencista);
                /* border: 4px solid var(--color_border_caja_conferencista); */
                border-radius: 10px;
                min-height: 200px;
                width: 250px;
                position: relative;
        
                .contenido{
                    width: 100%;
                    height: 100%;
                    display:flex;
                    flex-direction: column;
                    justify-content: space-between;
                    margin-top: 6.5rem;
                    font-size: 18px;

        
                    .renglon{
                        display:flex;
                        justify-content: center;
                    }
                    .icono_conferencista{
                        display:block;
                        fill: rgba(255, 255, 255, 0);    /* Color de relleno de las formas */
                        background-color: white;
                        stroke: var(--color_icono_conferencista);        /* Color del trazo de las líneas */
                        stroke-width: 1.2;     /* Ancho del trazo (en % o algo asi :v) */
                        width: 120px;
                        height: 120px;
                        position: absolute;
                        top: -50px;
                        left: 50%;
                        transform: translateX(-50%);
                        border: 4px solid white;
                        border-radius: 25%;
                    }
        
                    .span_nombre_conferencista{
                        color: var(--color_nombre_conferencistas);
                        max-width: 165px;
                        text-shadow: 1px 1px 2px black;
                        font-weight: bolder;
                        text-transform: capitalize;
                        text-align: center;
                        padding: 0.2rem 0.5rem;
                        padding-top: 1rem;
                    }

                    
                    .span_cargo{
                        color: var(--color_texto_span_cargos);
                        background-color: var(--color_fondo_span_cargo);
                        /* text-transform: capitalize; */
                        text-align: center;
                        padding:1rem;
                        border-radius: 4px;
                        max-width: 180px;
                        font-size: 14px;
                        font-weight:bolder;
                    }

                    .span_trayectoria{
                        color: var(--color_texto_trayectoria);
                        background-color: var(--color_fondo_texto_trayectoria);
                        text-align: center;
                        padding:1rem;
                        border-top-left-radius: 8px;
                        border-top-right-radius: 8px;
                        max-width: 180px;
                        font-size: 14px;
                    }
                }

                @media(max-width: 768px){
                    &{
                        .contenido{

                            .icono_conferencista{
                                width: 100px;
                                height: 100px;
                                top: -42px;

                            }
                            .span_nombre_conferencista{
                                font-size: 14px;
                            }
            
                            
                            .span_cargo{
                                font-size: 12px;
                            }
                            .span_trayectoria{
                                font-size: 14px;
                            }
                        }
                    }

                }
            }
        }

        .contenido_conferencistas{
            display: flex;
            flex-wrap: wrap;
            justify-content: center;
            align-items: stretch;
            gap: 6rem;
            width:90%;
        
            .caja_conferencista{
                display:flex;
                flex-direction: column;
                justify-content: center;
                background-color: var(--color_fondo_caja_conferencista);
                /* border: 4px solid var(--color_border_caja_conferencista); */
                border-radius: 10px;
                min-height: 80px;
                width: 210px;
                position: relative;
        
                .contenido{
                    width: 100%;
                    height: 100%;
                    display:flex;
                    flex-direction: column;
                    justify-content: space-between;
                    padding-left: 30px;

        
                    .renglon{
                        display:flex;
                        justify-content: center;
                    }
                    .icono_conferencista{
                        display:block;
                        fill: rgba(255, 255, 255, 0);    /* Color de relleno de las formas */
                        background-color: white;
                        stroke: var(--color_icono_conferencista);        /* Color del trazo de las líneas */
                        stroke-width: 1.2;     /* Ancho del trazo (en % o algo asi :v) */
                        width: 80px;
                        height: 80px;
                        position: absolute;
                        top: -15px;
                        left: -40px;
                        border: 4px solid white;
                        border-radius: 25%;
                        /* box-shadow: 1px 1px 3px black; */
                    }
        
                    .span_nombre_conferencista{
                        color: var(--color_nombre_conferencistas);
                        max-width: 165px;
                        text-shadow: 1px 1px 2px black;
                        font-weight: bolder;
                        text-transform: capitalize;
                        text-align: center;
                        padding: 0.2rem 0.5rem;
                        padding-top: 1rem;
                    }

                    
                    .span_cargo{
                        color: var(--color_texto_span_cargos);
                        text-transform: capitalize;
                        text-align: center;
                        padding:1rem;
                        border-radius: 4px;
                        background-color: var(--color_fondo_span_cargo);
                        max-width: 180px;
                        font-size: 14px;
                    }
                    .span_trayectoria{
                        color: var(--color_texto_trayectoria);
                        background-color: var(--color_fondo_texto_trayectoria);
                        text-transform: capitalize;
                        text-align: center;
                        padding:1rem;
                        border-radius: 4px;
                        max-width: 180px;
                        font-size: 14px;
                    }
                }

                @media(max-width: 768px){
                    &{
                        .contenido{

                            .icono_conferencista{
                                width:68px;
                                height:68px;
                                top: -12px;
                                left: -32px;

                            }
                            .span_nombre_conferencista{
                                font-size: 14px;
                            }
            
                            
                            .span_cargo{
                                font-size: 14px;
                            }
                            .span_trayectoria{
                                font-size: 14px;
                            }
                        }
                    }

                }
            }
        }

        .wrapper{
            display:flex; justify-content: space-around; flex-wrap: wrap; margin-top: 6rem; 
            width: 100%;
            row-gap: 8rem;
            /* border: 1px dotted red; */

            .celda1{
                min-width: 350px; max-width: 768px;
                /* border: 1px solid silver; */
                .caja_titulo_seccion{
                    display: flex;
                    justify-content: center;
                    .span_titulo_seccion{
                        margin-bottom: 3rem;
                    }
                }
                .contenido_conferencistas{
                    display:flex;
                    flex-wrap: wrap;
                    justify-content:center;
                }
            }
            .celda2{
                min-width: 350px; max-width: 768px;

                .caja_titulo_seccion{
                    display: flex;
                    justify-content: center;
                    .span_titulo_seccion{
                        margin-bottom: 3rem;
                    }
                }
                .contenido_conferencistas{
                    display:flex;
                    flex-wrap: wrap;
                    justify-content:flex-end;
                }
                /* border: 1px solid silver; */

            }
            @media(max-width: 768px){
                &{
                    .celda1{
                        padding-left: 3rem;
                        .caja_titulo_seccion{
                            justify-content: flex-start;
                        }
                        .contenido_conferencistas{
                            justify-content: flex-start;
                        }
                    }
                        .celda2{
                            padding-right: 1rem;

                            .caja_titulo_seccion{
                                justify-content: flex-end;
                                padding-right: 3.5rem;

                            }
                            .contenido_conferencistas{
                                justify-content: flex-end;
                            }

                        }
                }
            }
        }
    }


    .section_cronograma2{
        width: 90%;
        min-width: 340px;
        max-width: 340px;
        display:flex;
        justify-content: center;
        align-items: center;
        background-color: var(--color_fondo_section_cronograma);
        border: 4px solid var(--color_bordes_section_cronograma);
        border-radius: 12px;
        padding: 2rem;

        .caja_titulo_seccion{
            display: flex;
            flex-direction: column;
            align-items: center;
            gap: 1rem;
            max-width: 300px;
            .span_titulo_seccion{
                display: inline-flex;
                justify-content: center;
                align-items:center;
                width:auto;
                padding: 1rem;
                color: var(--color_titulo_cronograma);
                gap: 1rem;
            }
            .btn_ver_cronograma{
                padding: 1rem 2rem;
                display:flex;
                align-items: center;
                gap: 1rem;
                font-size: 18px;
                font-weight: bolder;
                text-shadow: 1px 1px 1px black;
                color: var(--color_texto_boton_ver_cronograma);
                background-color: var(--color_fondo_boton_ver_cronograma);
                
                background-image: linear-gradient(to bottom, color-mix(in srgb, var(--color_fondo_boton_ver_cronograma) , white 42%), 
                    var(--color_fondo_boton_ver_cronograma),
                    color-mix(in srgb, var(--color_fondo_boton_ver_cronograma) , black 25%));
                
                border: 2px outset color-mix(in srgb, var(--color_fondo_boton_ver_cronograma) , white 28%);
                border-radius: 6px;
                box-shadow: -2px -2px 4px inset color-mix(in srgb, var(--color_fondo_boton_ver_cronograma) , black 20%),
                1px 2px 4px inset color-mix(in srgb, var(--color_fondo_boton_ver_cronograma) , white 40%),
                1px 1px 5px #232323;
                cursor: pointer;
                svg{
                    width: 40px;
                    height: 40px;
                    stroke: var(--color_texto_boton_ver_cronograma);
                    stroke-width: 2px;
                }

                &:hover{
                    box-shadow: 1px 1px 3px #232323;
                    /* text-shadow: 1px 1px black; */
                }

                @media(max-width: 768px){
                    &{
                        padding: 1rem;
                        font-size: 14px;
                        svg{
                            width: 26px;
                            height: 26px;
                        }
                    }
                }
            }
        }

        @media(max-width: 360px){
            &{
                max-width: 320px;
                .caja_titulo_seccion{
                    padding-bottom: 1rem;
                }
            }
        }
    }



    /*FOOTER*/
    footer{
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center;
        position: relative;
        background-color: var(--color_fondo_footer);
        width: 100%;
        padding: 2rem 0rem 0rem 0rem;

        .footer__caja{
            color: var(--color_texto_footer);
            font-weight: 400;
            font-family: "panton-bold", sans-serif;
            display: flex;
            flex-direction: column;
            justify-content: space-around;
            align-items: center;
            gap: 2rem;
            width: 100%;
            height: auto;
            padding: 0px;

            .footer__resena{
                display: flex;
                width: 100%;
                flex-direction: column;
                align-items: center;
                gap: 1rem;
                font-size: 1.2rem;


                .footer__resena__div {
                    border-radius: 4px;
                    height: auto;
                    display: flex;
                    align-items: center;
                    gap: 10px;
                    padding: 2px 10px;


                    span{
                        flex-grow: 1;
                        padding-left: 10px;
                    }
                }
            }

            hr {
                margin-top: 0;
                width: 60%;
                border-top: 1px solid var(--color_texto_footer);
            }

            .footer__redes{
                padding: 2rem;
                display: flex;
                flex-direction: column;
                gap: 1rem;

                .div__redes{
                    display: flex;
                    justify-content: space-evenly;

                    .redes__logo{
                        padding: 0.2rem;
                        /* border: 3px solid #00d9fb; */
                        border: 3px solid var(--color_texto_footer);
                        border-radius: 20%;
                        transition: transform 0.8s;
                        width: 35px;
                        height: 35px;

                        .footer__svg{
                            background-color: transparent;
                            /* stroke: #00d9fb; */
                            stroke: var(--color_texto_footer);
                            stroke-width: 1.5;
                            width: 2.5rem;
                            height: 2.5rem;
                        }
                    }
                }
            }

            .footer__pie {
                display: flex;
                justify-content: center;
                align-items: center;
                text-align: center;
                font-size: 1rem;
                font-weight: bold;
                gap: 1rem;
                padding: 0px 0px 1rem 0px;

                .footer__logo_empresa {
                    width: 40px;
                    height: 40px;
                    border-radius: 5px;
                    padding: 3px;
                    background-color: #ffffff;
                    box-shadow: 1px 1px rgb(52, 53, 72), -1px -1px rgb(78, 77, 77);
                }
                .sub_caja{
                    display: flex;
                    flex-direction: column;
                    gap: 3px;

                    h3{
                        margin: 0;
                    }
                }

            }
        }

    }

    .modal_estandar{
        display:none;
        flex-direction: column;
        width:100%;
        height:100%;
        position: absolute;
        top:0; left:0;
        background-color: rgba(73, 70, 70, 0.975);
        z-index: 501;

        .btn_cerrar_modal{
            color: white;
            text-shadow: 1px 2px rgb(0, 0, 0);
            font-weight: bold;
            font-size: 20px;
            background-color:rgb(107, 16, 16);
            box-shadow: 2px 2px 1px black;
            border:1px outset rgb(143, 75, 15);
            border-radius: 5px;
            position: absolute;
            top: 15px;
            right: 10px;
            padding: 10px 15px;
            cursor:pointer;
            transition: transform 0.3s ease;
            z-index:5;
        }
        .btn_cerrar_modal:hover{
            background-color:rgb(142, 30, 30);
            transform: scale(1.1);
        }

        .body_modal{
            height: 90dvh;
            min-width: 320px;
            width: 80%;
            max-width: 890px;
            background-color: #f1f1f1;
            border: 2px outset #f1f1f1;
            border-radius: 4px;
            padding: 1rem;
            color: var(--azul);

            iframe{
                width:100%;
                height:auto;
                height: 89dvh;

            }
        }

        &.active{
            display:flex;
            flex-direction: column;
        
            align-items: center;
            justify-content: center;
            position:fixed;
        }
    }

    .ventana_flotante{
        position: fixed;
        width: 100%;
        height: 100dvh;
        background-color: #030518c0;
        display:none;
        align-items: center;
        justify-content: center;

        .body{
            position: relative;
            width: 100%;
            max-width: 1000px;
            height: 90dvh;
            display:flex;
            align-items:center;
            justify-content: center;
            padding-top: 4rem;
            overflow: hidden;

            .btn_cerrar{
                position: absolute;
                top: 0px;
                right: 0px;
                background-color:brown;
                border: 3px outset brown;
                color: white;
                display: flex;
                justify-content: center;
                align-items: center;
                border-radius: 8px;
                padding: 0.8rem 1rem ;
                cursor: pointer;
                font-weight: bolder;
            }
            .iframe_emergente{
                background-color: white;
                width: 100%;
                height: 90dvh;
                border: none;
            }
        }

        &.activar{
            display:flex;
        }
    }