/* //////Generales */
@media screen and (min-width:1367px){
    .title_ny p span{
        font-family: "Bootilla", Sans-serif !important;
        font-size: 42px !important;
        font-weight: 400 !important;
        font-style: italic !important; 
    }
        .title_ny h1 span{
        font-family: "Bootilla", Sans-serif !important;
        font-size: 42px !important;
        font-weight: 400 !important;
        font-style: italic !important; 
    }

    .title_ny h2 span{
        font-family: "Bootilla", Sans-serif !important;
        font-size: 28px !important;
        font-weight: 400 !important;
        font-style: italic !important; 
    }
}
@media screen and (min-width:1025px) and (max-width:1366px){
    .title_ny p span{
        font-family: "Bootilla", Sans-serif !important;
        font-size: 32px !important;
        font-weight: 400 !important;
        font-style: italic !important; 
    }
        .title_ny h1 span{
        font-family: "Bootilla", Sans-serif !important;
        font-size: 32px !important;
        font-weight: 400 !important;
        font-style: italic !important; 
    }

    .title_ny h2 span{
        font-family: "Bootilla", Sans-serif !important;
        font-size: 24px !important;
        font-weight: 400 !important;
        font-style: italic !important; 
    }
}
@media screen and (max-width:1024px) and (min-width:768px){
    .title_ny p span{
        font-family: "Bootilla", Sans-serif !important;
        font-size: 30px !important;
        font-weight: 400 !important;
        font-style: italic !important; 
    }
        .title_ny h1 span{
        font-family: "Bootilla", Sans-serif !important;
        font-size: 30px !important;
        font-weight: 400 !important;
        font-style: italic !important; 
    }
        .title_ny h2 span{
        font-family: "Bootilla", Sans-serif !important;
        font-size: 26px !important;
        font-weight: 400 !important;
        font-style: italic !important; 
    }
}
@media screen and (max-width:767px){
    .title_ny p span{
        font-family: "Bootilla", Sans-serif !important;
        font-size: 26px !important;
        font-weight: 400 !important;
        font-style: italic !important; 
    }
        .title_ny h1 span{
        font-family: "Bootilla", Sans-serif !important;
        font-size: 26px !important;
        font-weight: 400 !important;
        font-style: italic !important; 
    }
        .title_ny h2 span{
        font-family: "Bootilla", Sans-serif !important;
        font-size: 20px !important;
        font-weight: 400 !important;
        font-style: italic !important; 
    }
}

.referral_program .title_ny p span{
        font-family: "Bootilla", Sans-serif !important;
        font-size: 14px !important;
        font-weight: 400 !important;
        font-style: italic !important; 
}

.hero_programs .column_absolute_right{
    position: absolute !important;
    width: 50% !important;
    right: 0 !important;
    bottom: 0 !important;
    height: 100% !important;
}


/* ////Timeline */

.section_timeline .ue_timeline_item:nth-child(even) .ue_timeline_item_content .ue_timeline_item_content_main{
    text-align: left !important;
}

.section_timeline .ue_timeline_item:not(:has(.uc-active)) .ue_timeline_item_content_main{
    opacity: 0.5 !important;
    transition: opacity 0.3s ease; /* Opcional: añade una transición suave */
}

/* ///FIN Timeline */
/* ////Fin Generales */

/* /////MENU */

/* HEADER */
/* header.elementor-location-header{
    background: #000000 !important;
} */
.header{
    /* background: white; */
    height:105px !important;
    width: 100% !important;
    transition: all .2s linear!important;
    -webkit-transition: all .2s linear!important;
    -moz-transition: all .2s linear!important;
    /* background-color: #000000 !important; */
}

/* /////FIN GTRANSLATE */

.header-container.elementor-sticky--effects .header{
    background: #000000 !important;
        height: 80px!important;
    padding-top: 15px!important;
    padding-bottom: 15px!important;
    box-shadow: 0px 6px 30px -4px rgba(0,0,0,.05);
    transition: all .2s linear!important;
    -webkit-transition: all .2s linear!important;
    -moz-transition: all .2s linear!important;
}

.header .header-logo img {
    width: 100px!important;
    transition: all .2s linear!important;
    -webkit-transition: all .2s linear!important;
    -moz-transition: all .2s linear!important;
}


.header-container.elementor-sticky--effects .header .header-logo img {
    width: 90px!important;
    transition: all .2s linear!important;
    -webkit-transition: all .2s linear!important;
    -moz-transition: all .2s linear!important;
}


/* /////RESPONSIVE */
/* Solo aplicamos esto en pantallas de móvil y tablet (hasta 1024px) */
@media (max-width: 1024px) {
    
    /* Si el .header TIENE DENTRO un botón de menú activo, cambia el fondo */
    .header:has(.elementor-menu-toggle.elementor-active) {
        background-color: #000000 !important;
        transition: 0s linear !important;
        /* transition: background-color 0.3s ease; (Opcional: para que el cambio sea suave) */
    }
    .header .elementor-nav-menu--dropdown:not(.sub-menu){
        /* height: 100vh !important; */
        padding-top: 50px;
        padding-bottom: 100px;
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;

        height: 100dvh !important;
        max-height: 100dvh !important; 
    }

        .header .elementor-nav-menu--dropdown .elementor-nav-menu{
        margin: auto !important;
    }
    .header .sub-menu.elementor-nav-menu--dropdown .menu-item a{
        font-size: 16px !important;
    }

}
/* ////FIN RESPONSIVE */

/* ////FIN MENU */


/* ////FACULTY */
.Classical .circle_container .circle_one{
    fill: none !important;
    stroke: #F9124C !important;
    transform-origin: 50% 50% !important; /* Giran sobre el centro exacto */
    stroke-dashoffset: -20;
    animation: none;
}
.Classical .especialidad{
    background: #F9124C !important;
}
.Jazz_and_Contemporary .circle_container .circle_one{
    fill: none !important;
    stroke: #4F91E0 !important;
    transform-origin: 50% 50% !important; /* Giran sobre el centro exacto */
    stroke-dashoffset: -20;
    animation: none;
}
.Jazz_and_Contemporary .especialidad{
    background: #4F91E0 !important;
}
.Classical.Jazz_and_Contemporary .circle_container .circle_one{
    fill: none !important;
    stroke: #F9124C !important;
    transform-origin: 50% 50% !important; /* Giran sobre el centro exacto */
    stroke-dashoffset: -20;
    animation: none;
}
.Classical.Jazz_and_Contemporary .especialidad{
    background: #F9124C !important;
}
.Dance .circle_container .circle_one{
    fill: none !important;
    stroke: #036439 !important;
    transform-origin: 50% 50% !important; /* Giran sobre el centro exacto */
    stroke-dashoffset: -20;
    animation: none;
}
.Dance .especialidad{
    background: #036439 !important;
}
.Musical_Theatre .circle_container .circle_one{
    fill: none !important;
    stroke: #FBB812 !important;
    transform-origin: 50% 50% !important; /* Giran sobre el centro exacto */
    stroke-dashoffset: -20;
    animation: none;
}
.Musical_Theatre .especialidad{
    background: #FBB812 !important;
}
.Dance.Musical_Theatre .circle_container .circle_one{
    fill: none !important;
    stroke: #036439 !important;
    transform-origin: 50% 50% !important; /* Giran sobre el centro exacto */
    stroke-dashoffset: -20;
    animation: none;
}
.Dance.Musical_Theatre .especialidad{
    background: #036439 !important;
}
/* //// FIN FACULTY */
/* /////Fotos circulos */
/* 1. Contenedor principal (Se queda igual, es el marco) */
.circle_container {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    max-width: 650px; 
    margin: 0 auto;
    aspect-ratio: 1 / 1 !important;
    padding: 0 !important;
}

/* 2. El widget de la imagen: REDUCIDO */
/* Bajamos el porcentaje al 68% (r=34 * 2) para crear el hueco visual que buscas */
.circle_container .elementor-widget-image {
    width: 80% !important; /* MÁS PEQUEÑO para más 'aire' */
    height: auto !important;
    aspect-ratio: 1 / 1 !important;
    margin: auto !important;
    padding: 0 !important;
    z-index: 1;
}

/* 3. La imagen real (Se queda igual) */
.circle_container .elementor-widget-image img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    border-radius: 50% !important;
}

/* 4. El widget del SVG (Se queda igual) */
.circle_container .elementor-widget-html {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    pointer-events: none;
    z-index: 2;
}

.circle_container svg.trazos-svg {
    width: 100% !important;
    height: 100% !important;
    display: block;
}

/* 5. BASE COMPARTIDA */
.circle_one, .circle_two {
    fill: none;
    stroke: #F9124C;
    transform-origin: 50% 50%; /* Giran sobre el centro exacto */
}

/* 6. circle_one: EL GRUESO (Giro simétrico) */
.circle_one {
    stroke-width: 8; 
    /* Longitud simétrica al trazo fino */
    stroke-dasharray: 40, 238; 
    animation: rotar-derecha 180s linear infinite;
}

/* 7. circle_two: EL FINO (Giro simétrico con más aire) */
.circle_two {
    stroke-width: 4; 
    /* El r=310 en el HTML con stroke-width: 4 en el CSS logran la separación visual */
    stroke-dasharray: 40, 238; 
    animation: rotar-izquierda 50s linear infinite;
}




.circle_container_two {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    max-width: 650px; 
    margin: 0 auto;
    aspect-ratio: 1 / 1 !important;
    padding: 0 !important;
}

/* 2. El widget de la imagen: REDUCIDO */
/* Bajamos el porcentaje al 68% (r=34 * 2) para crear el hueco visual que buscas */
.circle_container_two .elementor-widget-image {
    width: 70% !important; /* MÁS PEQUEÑO para más 'aire' */
    height: auto !important;
    aspect-ratio: 1 / 1 !important;
    margin: auto !important;
    padding: 0 !important;
    z-index: 1;
}

/* 3. La imagen real (Se queda igual) */
.circle_container_two .elementor-widget-image img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    border-radius: 50% !important;
}

/* 4. El widget del SVG (Se queda igual) */
.circle_container_two .elementor-widget-html {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    pointer-events: none;
    z-index: 2;
}

.circle_container_two svg.trazos-svg {
    width: 100% !important;
    height: 100% !important;
    display: block;
}
.circle_three, .circle_four {
    fill: none;
    stroke: #F9124C;
    transform-origin: 50% 50%; /* Giran sobre el centro exacto */
}

/* 6. circle_one: EL GRUESO (Giro simétrico) */
.circle_three {
    stroke-width: 8; 
    /* Longitud simétrica al trazo fino */
    stroke-dasharray: 80, 250; 
    animation: rotar-derecha 180s linear infinite;
}

/* 7. circle_two: EL FINO (Giro simétrico con más aire) */
.circle_four {
    stroke-width: 4; 
    /* El r=310 en el HTML con stroke-width: 4 en el CSS logran la separación visual */
    stroke-dasharray: 180, 250; 
    animation: rotar-izquierda 50s linear infinite;
}


/* JAZZ */
.circle_container_two.jazz .circle_three, 
.circle_container_two.jazz .circle_four {
    fill: none;
    stroke: #4F91E0;
    transform-origin: 50% 50%;
}

/* DANCE */
.circle_container_two.dance .circle_three, 
.circle_container_two.dance .circle_four {
    fill: none;
    stroke: #036439;
    transform-origin: 50% 50%;
}

/* MUSICAL */
.circle_container_two.musical .circle_three, 
.circle_container_two.musical .circle_four {
    fill: none;
    stroke: #FBB812;
    transform-origin: 50% 50%;
}


.circle_container {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    max-width: 650px; 
    margin: 0 auto;
    aspect-ratio: 1 / 1 !important;
    padding: 0 !important;
}

/* 2. El widget de la imagen: REDUCIDO */
/* Bajamos el porcentaje al 68% (r=34 * 2) para crear el hueco visual que buscas */
.instruments_section .circle_container .elementor-widget-image {
    width: 80% !important; /* MÁS PEQUEÑO para más 'aire' */
    height: auto !important;
    aspect-ratio: 1 / 1 !important;
    margin: auto !important;
    padding: 0 !important;
    z-index: 1;
}

/* 3. La imagen real (Se queda igual) */
.instruments_section .circle_container .elementor-widget-image img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    border-radius: 50% !important;
}

/* 4. El widget del SVG (Se queda igual) */
.instruments_section .circle_container .elementor-widget-html {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    pointer-events: none;
    z-index: 2;
}

.instruments_section .circle_container svg.trazos-svg {
    width: 100% !important;
    height: 100% !important;
    display: block;
}

/* 5. BASE COMPARTIDA */
.instruments_section.classical .circle_one, .instruments_section.classical .circle_two, .instruments_section.classical .circle_three {
    fill: none;
    stroke: #F9124C;
    transform-origin: 50% 50%; /* Giran sobre el centro exacto */
}
.instruments_section.jazz .circle_one, .instruments_section.jazz .circle_two, .instruments_section.jazz .circle_three {
    fill: none;
    stroke: #4F91E0;
    transform-origin: 50% 50%; /* Giran sobre el centro exacto */
}

.classical_music .circle_container_two.musical .circle_three, 
.classical_music .circle_container_two.musical .circle_four {
    fill: none;
    stroke: #F9124C;
    transform-origin: 50% 50%;
}
.jazz_music .circle_container_two .circle_three, 
.jazz_music .circle_container_two .circle_four {
    fill: none;
    stroke: #4F91E0;
    transform-origin: 50% 50%;
}

.dance_music .circle_container_two .circle_three, 
.dance_music .circle_container_two .circle_four {
    fill: none;
    stroke: #036439;
    transform-origin: 50% 50%;
}
.musical_music .circle_container_two .circle_three, 
.musical_music .circle_container_two .circle_four {
    fill: none;
    stroke: #FBB812;
    transform-origin: 50% 50%;
}
/* ---------------------------------------------------
   1. ARCO ARRIBA DERECHA (Línea media, corto)
   --------------------------------------------------- */
.instruments_section .circle_one {
  stroke-width: 2; 
  /* Trazo de 60px, resto vacío (asumiendo r="48" -> circunferencia ~301) */
  stroke-dasharray: 50, 310; 
  animation: rotar-arriba-der 20s linear infinite;
}

/* ---------------------------------------------------
   2. ARCO ABAJO IZQUIERDA (Línea media, largo)
   --------------------------------------------------- */
.instruments_section .circle_two {
  stroke-width: 4;
  /* Trazo más largo de 100px */
  stroke-dasharray: 40, 310; 
  animation: rotar-abajo-izq 25s linear infinite;
}

/* ---------------------------------------------------
   3. ARCO ABAJO DERECHA (Línea MUY gruesa, corto)
   --------------------------------------------------- */
.instruments_section .circle_three {
  stroke-width: 8; /* Grosor destacado para igualar tu imagen */
  stroke-dasharray: 30, 310; 
  animation: rotar-abajo-der 22s linear infinite;
}




.info_section .circle_container {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    max-width: 650px; 
    margin: 0 auto;
    aspect-ratio: 1 / 1 !important;
    padding: 0 !important;
}

/* 2. El widget de la imagen: REDUCIDO */
/* Bajamos el porcentaje al 68% (r=34 * 2) para crear el hueco visual que buscas */
.info_section .circle_container .elementor-widget-image {
    width: 75% !important; /* MÁS PEQUEÑO para más 'aire' */
    height: auto !important;
    aspect-ratio: 1 / 1 !important;
    margin: auto !important;
    padding: 0 !important;
    z-index: 1;
}

/* 3. La imagen real (Se queda igual) */
.info_section .circle_container .elementor-widget-image img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    border-radius: 50% !important;
}

/* 4. El widget del SVG (Se queda igual) */
.info_section .circle_container .elementor-widget-html {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    pointer-events: none;
    z-index: 2;
}

.info_section .circle_container svg.trazos-svg {
    width: 100% !important;
    height: 100% !important;
    display: block;
}

/* 5. BASE COMPARTIDA */
.info_section.dance .circle_one, .info_section.dance .circle_two {
    fill: none;
    stroke: #036439;
    transform-origin: 50% 50%; /* Giran sobre el centro exacto */
}
.info_section.musical .circle_one, .info_section.musical .circle_two {
    fill: none;
    stroke: #FBB812;
    transform-origin: 50% 50%; /* Giran sobre el centro exacto */
}

/* 6. circle_one: EL GRUESO (Giro simétrico) */
.info_section .circle_one {
    stroke-width: 8; 
    /* Longitud simétrica al trazo fino */
    stroke-dasharray: 80, 238; 
    animation: rotar-derecha 180s linear infinite;
}

/* 7. circle_two: EL FINO (Giro simétrico con más aire) */
.info_section .circle_two {
    stroke-width: 3; 
    /* El r=310 en el HTML con stroke-width: 4 en el CSS logran la separación visual */
    stroke-dasharray: 180, 238; 
    animation: rotar-izquierda 50s linear infinite;
}


/* ////////Faculty,etc */
.info_section_two .circle_container {
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    max-width: 650px; 
    margin: 0 auto;
    aspect-ratio: 1 / 1 !important;
    padding: 0 !important;
}

/* 2. El widget de la imagen: REDUCIDO */
/* Bajamos el porcentaje al 68% (r=34 * 2) para crear el hueco visual que buscas */
.info_section_two .circle_container .elementor-widget-image {
    width: 80% !important; /* MÁS PEQUEÑO para más 'aire' */
    height: auto !important;
    aspect-ratio: 1 / 1 !important;
    margin: auto !important;
    padding: 0 !important;
    z-index: 1;
}

/* 3. La imagen real (Se queda igual) */
.info_section_two .circle_container .elementor-widget-image img {
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
    border-radius: 50% !important;
}

/* 4. El widget del SVG (Se queda igual) */
.info_section_two .circle_container .elementor-widget-html {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
    pointer-events: none;
    z-index: 2;
}

.info_section_two .circle_container svg.trazos-svg {
    width: 100% !important;
    height: 100% !important;
    display: block;
}

/* 5. BASE COMPARTIDA */
.info_section_two .circle_one, .info_section_two .circle_two {
    fill: none;
    stroke: #F9124C;
    transform-origin: 50% 50%; /* Giran sobre el centro exacto */
}

/* 6. circle_one: EL GRUESO (Giro simétrico) */
.info_section_two .circle_one {
    stroke-width: 4; 
    /* Longitud simétrica al trazo fino */
    stroke-dasharray: 100, 250; 
    animation: rotar-derecha-info 180s linear infinite;
}

/* 7. circle_two: EL FINO (Giro simétrico con más aire) */
.info_section_two .circle_two {
    stroke-width: 8; 
    /* El r=310 en el HTML con stroke-width: 4 en el CSS logran la separación visual */
    stroke-dasharray: 70, 250; 
    animation: rotar-izquierda-info 50s linear infinite;
}




/* 8. Animaciones Mágicas Unificadas (Giro Opuesto Simétrico) */
@keyframes rotar-derecha {
    0% { transform: rotate(80deg); }
    100% { transform: rotate(-300deg); } 
}

@keyframes rotar-izquierda {
    0% { transform: rotate(220deg); }
    100% { transform: rotate(540deg); } 
}

/* ///FACUTLY ETC */
@keyframes rotar-derecha-info {
    0% { transform: rotate(80deg); }
    100% { transform: rotate(-300deg); } 
}

@keyframes rotar-izquierda-info {
    0% { transform: rotate(280deg); }
    100% { transform: rotate(540deg); } 
}

/* ///FIN FACULTY ETC */

@keyframes rotar-arriba-der {
  /* Empieza un poco antes de las 12 y dibuja hacia las 2 */
  0%   { transform: rotate(-180deg); }
  100% { transform: rotate(285deg); } /* Gira a la derecha */
}

@keyframes rotar-abajo-izq {
  /* Empieza pasadas las 6 y dibuja hacia las 9 */
  0%   { transform: rotate(100deg); }
  100% { transform: rotate(-260deg); } /* Gira a la izquierda */
}

@keyframes rotar-abajo-der {
  /* Empieza a las 4 y dibuja hacia las 6 */
  0%   { transform: rotate(35deg); }
  100% { transform: rotate(395deg); } /* Gira a la derecha */
}
/* /////FIN FOTOS CIRCULOS */


/* ///form NY */
/* ////FORMULARIO NY */
/* ///FORM CONTACT */
.form_nycenter input:focus:not([type="submit"]),
.form_nycenter textarea:focus,
.form_nycenter select:focus{
    outline: none ;         /* Desactiva el contorno */
    box-shadow: none !important;      /* Desactiva sombras */
    border: none ;        /* Elimina bordes */
    background: #ffffff !important;
    border: 0px solid #09304A !important;
    color: #09304A !important;
		outline: none !important; /* Quita el borde de resaltado */
			box-shadow: none !important; /* Quita posibles sombras externas (común en Chrome) */
	border-color: transparent !important;
}
.form_nycenter p{
    margin-bottom: 0;
}
.form_nycenter label{
    width: 100%;
    font-family: "League Spartan", Sans-serif;
    font-weight: 600;
    font-size: 18px;
    color: #ffffff;
}
.form_nycenter label:not(:first-child){
    margin-top: 20px;
}
@media screen and (min-width:1025px){
    .form_nycenter .input_row p{
        display: flex;
        gap: 10px;
    }
}
.form_nycenter .input_row.last{
    margin-bottom: 20px;
}
.form_nycenter .input_row p label{
    margin-top: 20px;
}

.form_nycenter input[type="text"],
.form_nycenter input[type="email"],
.form_nycenter input[type="tel"]{
    margin-bottom: 0px;
    width: 100%;
    font-family: "Inter", Sans-serif !important;
}
.form_nycenter input[type="text"],
.form_nycenter input[type="date"],
.form_nycenter input[type="email"],
.form_nycenter input[type="tel"]{
    background-color: #ffffff;
    color: #000000;
    font-weight: 300;
    font-size: 17px;
    border: 0;
    border: 0px solid #09304A !important;
    border-radius: 100px !important;
    padding: 6px 20px;
    width: 100%;
	  font-family: "Inter", Sans-serif !important;
		border-radius:0;
		box-shadow: none !important;
        margin-top: 5px;
}
@media screen and (max-width:767px){
    .form_nycenter input[type="text"],
    .form_nycenter input[type="email"],
    .form_nycenter input[type="tel"]{
        background-color: #ffffff;
        color: #000000;
        font-weight: 300;
        font-size: 17px;
        border: 0;
        border: 0px solid #09304A !important;
        border-radius: 100px !important;
        padding: 6px 20px;
        width: 100%;
        font-family: "Inter", Sans-serif !important;
            border-radius:0;
            box-shadow: none !important;
        /* margin-top: 24px; */
    }
}

/* Estilos base para el campo select */
.wpcf7-form select,
.wpcf7-select {
    background-color: #ffffff !important;
    color: #000000 !important;
    font-weight: 300 !important;
    font-size: 17px !important;
    border: 0px solid #09304A !important;
    border-radius: 100px !important; /* Bordes redondeados para igualar los otros campos */
    padding: 6px 20px !important;
    width: 100% !important;
    font-family: "Inter", Sans-serif !important;
    box-shadow: none !important;
    margin-top: 5px !important;
    
    /* Elimina el estilo nativo del navegador */
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    appearance: none !important;
    
    /* Flecha personalizada */
    background-image: url("arrowselect.svg") !important;
    background-repeat: no-repeat !important;
    background-position: right 20px center !important;
    background-size: 12px auto !important; /* Tamaño fijo de la flecha */
    
    padding-right: 45px !important; /* Espacio para que el texto no pise la flecha */
}

/* LA SOLUCIÓN: Mantener todos los valores (incluido el tamaño) al hacer clic */
.wpcf7-form select:focus,
.wpcf7-select:focus,
.wpcf7-form select:active,
.wpcf7-select:active {
    outline: none !important;
    background-image: url("arrowselect.svg") !important;
    background-repeat: no-repeat !important;
    background-position: right 20px center !important;
    background-size: 12px auto !important; /* Esto evita el triángulo gigante */
}

/* Limpiar opciones nativas por si acaso */
.wpcf7-form select option,
.wpcf7-select option {
    background-image: none !important;
}

.form_nycenter textarea{
    background-color: #ffffff;
    color: #000000;
    font-weight: 300;
    font-size: 17px;
    border: 0;
    border: 0px solid #09304A !important;
    border-radius: 20px !important;
    padding: 6px 20px;
    width: 100%;
	font-family: "Inter", Sans-serif !important;
    border-radius:0;
	box-shadow: none !important;
    margin-top: 5px;
    height: 100px;
}

.form_nycenter ::placeholder{
    color:#09304A;
    font-family: "Inter", Sans-serif !important;
}
@media screen and (max-width:1024px){
    .form_nycenter input[type="text"],
    .form_nycenter input[type="email"],
    .form_nycenter input[type="tel"]{

        max-width: 100%;
        width: 100%;
    }
    .form_nycenter textarea{

        max-width: 100%;
        width: 100%;
    }
}
/* Legal */
.form_nycenter .wpcf7-acceptance .wpcf7-list-item {
	margin: 0;
}
.form_nycenter .wpcf7-acceptance .wpcf7-list-item label {
	display: flex;
	align-items: center;
}
.form_nycenter .wpcf7-acceptance .wpcf7-list-item .wpcf7-list-item-label {
	font-size: 16px;
	font-family: "Inter", Sans-serif !important;
	font-weight: 300 !important;
	color: #09304A;
	line-height: 21px;
	margin-left: 32px;
}
.form_nycenter .wpcf7-acceptance .wpcf7-list-item .wpcf7-list-item-label a {
	color: #09304A;
	text-decoration: none;
}
.form_nycenter .part2{
    margin-top: 32px;
}
.form_nycenter .wpcf7-acceptance .wpcf7-list-item .wpcf7-list-item-label, .form_nycenter .wpcf7-acceptance .wpcf7-list-item .wpcf7-list-item-label a {
	color: #ffffff;
    font-size: 17px;
    font-weight: 300;
}
/* Ocultar el checkbox por defecto */
.form_nycenter input[type="checkbox"] {
    opacity: 0;
    position: absolute;
    width: 0;
    height: 0;
}
/* Nuevo checkbox personalizado */
.form_nycenter .wpcf7-list-item-label::before {
    content: '';
    position: absolute;
    left: 0;
    top: 2px;
    width: 16px;
    height: 16px;
    border: solid 1px #ffffff;
    border-radius: 0;
}
/* Estilo checkbox checked */
.form_nycenter input[type="checkbox"]:checked + .wpcf7-list-item-label::before {
  border: solid 1px #ffffff;
}
/* Icono de check */
.form_nycenter input[type="checkbox"]:checked + .wpcf7-list-item-label::after {
    content: '';
    position: absolute;
    left: 3px;
    top: 5px;
    width: 10px;
    height: 6px;
    border: solid 1px #ffffff;
    border-width: 0 0 2px 2px;
    transform: rotate(-45deg);
}
.form_nycenter .wpcf7-list-item-label::before, .form_nycenter input[type="checkbox"]:checked + .wpcf7-list-item-label::before, .form_nycenter input[type="checkbox"]:checked + .wpcf7-list-item-label::after {
	border-color: #ffffff;
}


/* 1. Ocultar el checkbox nativo */
.form_nycenter .checkbox_ny input[type="checkbox"] {
    opacity: 0;
    position: absolute;
    z-index: -1;
}

/* 2. Alinear las opciones en horizontal */
.form_nycenter .checkbox_ny .wpcf7-list-item {
    display: inline-block;
    margin-right: 20px;
}

/* 3. Preparar el texto */
.form_nycenter .checkbox_ny .wpcf7-list-item-label {
    position: relative;
    padding-left: 25px; 
    cursor: pointer;
    display: inline-block;
}

/* 4. Dibujar el recuadro blanco */
.form_nycenter .checkbox_ny .wpcf7-list-item-label::before {
    content: '';
    position: absolute;
    left: 0;
    top: -1px; 
    width: 16px;
    height: 16px;
    border: solid 1px #ffffff;
    border-radius: 0;
    box-sizing: border-box;
}

/* 5. Dibujar la palomita (check) */
.form_nycenter .checkbox_ny input[type="checkbox"]:checked + .wpcf7-list-item-label::after {
    content: '';
    position: absolute;
    left: 4px;
    top: 3px;
    width: 9px;
    height: 5px;
    border: solid 1px #ffffff;
    border-width: 0 0 2px 2px;
    transform: rotate(-45deg);
}
.form_nycenter .checkbox_ny{
    margin-top: 20px;
    margin-bottom: 20px;
}

.form_nycenter input[type="submit"]{
    
    padding: 15px 30px 11px 30px !important;
    border-radius: 100px;
    background: #F9124C !important;

    font-family: "League Spartan", Sans-serif;
    font-weight: 500;
    font-size: 18px;
    line-height: 24px;
    text-transform: uppercase;
    color: #ffffff;
    margin-top: 30px;
	transition: 0.3s;
}
.form_nycenter input[type="submit"]:hover{
    background: #D80037 !important;
    color: #ffffff;
}


/* @media screen and (max-width:767px){
    .form_nycenter input[type="submit"]{
        width: 100%;
    }
} */

.form_nycenter .wpcf7-not-valid-tip{
    margin-top: 4px;
    font-size: 14px !important;
    color: #ffffff !important;
		background: transparent !important;
		box-shadow:none !important;
		font-family: "Inter", Sans-serif !important;
}

.wpcf7-response-output{
    color: #ffffff;
    font-family: "Inter", Sans-serif !important;
    font-size: 17px;
    font-weight: 500;
    border: 0 !important;
    padding: 0 !important;
}

/* ///FORM NY */

/* ///FORM REFERRAL */
 
.form_nycenter_referral input:focus:not([type="submit"]),
.form_nycenter_referral textarea:focus,
.form_nycenter_referral select:focus{
    outline: none ;         /* Desactiva el contorno */
    box-shadow: none !important;      /* Desactiva sombras */
    border: none ;        /* Elimina bordes */
    background: #105572 !important;
    border: 0px solid #09304A !important;
    color: #FAFAFA !important;
		outline: none !important; /* Quita el borde de resaltado */
			box-shadow: none !important; /* Quita posibles sombras externas (común en Chrome) */
	border-color: transparent !important;
}
.form_nycenter_referral p{
    margin-bottom: 0;
}
.form_nycenter_referral label{
    width: 100%;
    font-family: "League Spartan", Sans-serif;
    font-weight: 600;
    font-size: 18px;
    color: #105572;
}
.form_nycenter_referral label:not(:first-child){
    margin-top: 20px;
}
@media screen and (min-width:1025px){
    .form_nycenter_referral .input_row p{
        display: flex;
        gap: 10px;
    }
}
.form_nycenter_referral .input_row.last{
    margin-bottom: 20px;
}
.form_nycenter_referral .input_row p label{
    margin-top: 20px;
}

.form_nycenter_referral input[type="text"],
.form_nycenter_referral input[type="email"],
.form_nycenter_referral input[type="tel"]{
    margin-bottom: 0px;
    width: 100%;
    font-family: "Inter", Sans-serif !important;
}
.form_nycenter_referral input[type="text"],
.form_nycenter_referral input[type="date"],
.form_nycenter_referral input[type="email"],
.form_nycenter_referral input[type="tel"]{
    background-color: #105572;
    color: #FAFAFA;
    font-weight: 300;
    font-size: 17px;
    border: 0;
    border: 0px solid #09304A !important;
    border-radius: 100px !important;
    padding: 6px 20px;
    width: 100%;
	  font-family: "Inter", Sans-serif !important;
		border-radius:0;
		box-shadow: none !important;
        margin-top: 5px;
}
@media screen and (max-width:767px){
    .form_nycenter_referral input[type="text"],
    .form_nycenter_referral input[type="email"],
    .form_nycenter_referral input[type="tel"]{
        background-color: #105572;
        color: #FAFAFA;
        font-weight: 300;
        font-size: 17px;
        border: 0;
        border: 0px solid #09304A !important;
        border-radius: 100px !important;
        padding: 6px 20px;
        width: 100%;
        font-family: "Inter", Sans-serif !important;
            border-radius:0;
            box-shadow: none !important;
        /* margin-top: 24px; */
    }
}

/* Estilos base para el campo select */
.form_nycenter_referral .wpcf7-form select,
.form_nycenter_referral .wpcf7-select {
    background-color: #105572 !important;
    color: #FAFAFA !important;
    font-weight: 300 !important;
    font-size: 17px !important;
    border: 0px solid #09304A !important;
    border-radius: 100px !important; /* Bordes redondeados para igualar los otros campos */
    padding: 6px 20px !important;
    width: 100% !important;
    font-family: "Inter", Sans-serif !important;
    box-shadow: none !important;
    margin-top: 5px !important;
    
    /* Elimina el estilo nativo del navegador */
    -webkit-appearance: none !important;
    -moz-appearance: none !important;
    appearance: none !important;
    
    /* Flecha personalizada */
    background-image: url("arrowselectwhite.svg") !important;
    background-repeat: no-repeat !important;
    background-position: right 20px center !important;
    background-size: 12px auto !important; /* Tamaño fijo de la flecha */
    
    padding-right: 45px !important; /* Espacio para que el texto no pise la flecha */
}

/* LA SOLUCIÓN: Mantener todos los valores (incluido el tamaño) al hacer clic */
.form_nycenter_referral .wpcf7-form select:focus,
.form_nycenter_referral .wpcf7-select:focus,
.form_nycenter_referral .wpcf7-form select:active,
.form_nycenter_referral .wpcf7-select:active {
    outline: none !important;
    background-image: url("arrowselectwhite.svg") !important;
    background-repeat: no-repeat !important;
    background-position: right 20px center !important;
    background-size: 12px auto !important; /* Esto evita el triángulo gigante */
}

/* Limpiar opciones nativas por si acaso */
.form_nycenter_referral .wpcf7-form select option,
.form_nycenter_referral .wpcf7-select option {
    background-image: none !important;
}

.form_nycenter_referral textarea{
    background-color: #105572;
    color: #FAFAFA;
    font-weight: 300;
    font-size: 17px;
    border: 0;
    border: 0px solid #09304A !important;
    border-radius: 20px !important;
    padding: 6px 20px;
    width: 100%;
	font-family: "Inter", Sans-serif !important;
    border-radius:0;
	box-shadow: none !important;
    margin-top: 5px;
    height: 100px;
}

.form_nycenter_referral ::placeholder{
    color:#FAFAFA;
    font-family: "Inter", Sans-serif !important;
}
@media screen and (max-width:1024px){
    .form_nycenter_referral input[type="text"],
    .form_nycenter_referral input[type="email"],
    .form_nycenter_referral input[type="tel"]{

        max-width: 100%;
        width: 100%;
    }
    .form_nycenter_referral textarea{

        max-width: 100%;
        width: 100%;
    }
}
/* Legal */
.form_nycenter_referral .wpcf7-acceptance .wpcf7-list-item {
	margin: 0;
}
.form_nycenter_referral .wpcf7-acceptance .wpcf7-list-item label {
	display: flex;
	align-items: center;
}
.form_nycenter_referral .wpcf7-acceptance .wpcf7-list-item .wpcf7-list-item-label {
	font-size: 16px;
	font-family: "Inter", Sans-serif !important;
	font-weight: 300 !important;
	color: #09304A;
	line-height: 21px;
	margin-left: 32px;
}
.form_nycenter_referral .wpcf7-acceptance .wpcf7-list-item .wpcf7-list-item-label a {
	color: #09304A;
	text-decoration: none;
}
.form_nycenter_referral .part2{
    margin-top: 32px;
}
.form_nycenter_referral .wpcf7-acceptance .wpcf7-list-item .wpcf7-list-item-label, .form_nycenter_referral .wpcf7-acceptance .wpcf7-list-item .wpcf7-list-item-label a {
	color: #105572;
    font-size: 17px;
    font-weight: 300;
}
/* Ocultar el checkbox por defecto */
.form_nycenter_referral input[type="checkbox"] {
    opacity: 0;
    position: absolute;
    width: 0;
    height: 0;
}
/* Nuevo checkbox personalizado */
.form_nycenter_referral .wpcf7-list-item-label::before {
    content: '';
    position: absolute;
    left: 0;
    top: 2px;
    width: 16px;
    height: 16px;
    border: solid 1px #105572;
    border-radius: 0;
}
/* Estilo checkbox checked */
.form_nycenter_referral input[type="checkbox"]:checked + .wpcf7-list-item-label::before {
  border: solid 1px #105572;
}
/* Icono de check */
.form_nycenter_referral input[type="checkbox"]:checked + .wpcf7-list-item-label::after {
    content: '';
    position: absolute;
    left: 3px;
    top: 5px;
    width: 10px;
    height: 6px;
    border: solid 1px #105572;
    border-width: 0 0 2px 2px;
    transform: rotate(-45deg);
}
.form_nycenter_referral .wpcf7-list-item-label::before, .form_nycenter_referral input[type="checkbox"]:checked + .wpcf7-list-item-label::before, .form_nycenter_referral input[type="checkbox"]:checked + .wpcf7-list-item-label::after {
	border-color: #105572;
}
.form_nycenter_referral input[type="submit"]{
    
    padding: 15px 30px 11px 30px !important;
    border-radius: 100px;
    background: #F9124C !important;

    font-family: "League Spartan", Sans-serif;
    font-weight: 500;
    font-size: 18px;
    line-height: 24px;
    text-transform: uppercase;
    color: #ffffff;
    margin-top: 30px;
	transition: 0.3s;
}
.form_nycenter_referral input[type="submit"]:hover{
    background: #D80037 !important;
    color: #ffffff;
}


/* @media screen and (max-width:767px){
    .form_nycenter_referral input[type="submit"]{
        width: 100%;
    }
} */

.form_nycenter_referral .wpcf7-not-valid-tip{
    margin-top: 4px;
    font-size: 14px !important;
    color: #105572 !important;
		background: transparent !important;
		box-shadow:none !important;
		font-family: "Inter", Sans-serif !important;
}

.form_nycenter_referral .wpcf7-response-output{
    color: #105572;
    font-family: "Inter", Sans-serif !important;
    font-size: 17px;
    font-weight: 500;
    border: 0 !important;
    padding: 0 !important;
}

/* ////FIN FORM REFERRAL */


/* ///PROGRAMS Botones */
.programs_seccion #e-n-tab-title-1570260031{
    color:#F9124C !important;
}
.programs_seccion #e-n-tab-title-1570260032{
    color:#4F91E0 !important;
}
.programs_seccion #e-n-tab-title-1570260033{
    color:#036439 !important;
}
.programs_seccion #e-n-tab-title-1570260034{
    color:#FBB812 !important;
}
/* ///Fin PROGrams botones */
/* ////DONATION */
.section_donation .givewp-donation-form{
    width: 100% !important;
    max-width: 100% !important;
    margin: 0;
}

.section_donation *{
    font-family: "Inter", Sans-serif !important;
}
.section_donation button .givewp-fields-amount__level--selected{
        padding: 15px 30px 11px 30px !important;
    border-radius: 100px;
    background: #F9124C !important;

    font-family: "League Spartan", Sans-serif;
    font-weight: 500;
    font-size: 18px;
    line-height: 24px;
    text-transform: uppercase;
    color: #ffffff;
    margin-top: 30px;
	transition: 0.3s;
}
/* ////Fin donation */

/* Cambiar tipografía de la página de pedido recibido de WooCommerce */
.woocommerce-order-details, 
.woocommerce-customer-details,
.woocommerce-order-overview {
    font-family: "Inter", Sans-serif !important;
}

/* Cambiar el color y fuente de los títulos "Order details" y "Billing address" */
.woocommerce-order-details h2, 
.woocommerce-customer-details h2 {
    font-family: "Inter", Sans-serif !important;
    color: #000000 !important; /* Puedes cambiar este código por el color de tu marca */
}

/* Cambiar la tipografía de las etiquetas (Payment method, Subtotal, Total...) */
.woocommerce-table--order-details tfoot th {
    font-family: "Inter", Sans-serif !important;
    color: #000000 !important; /* Cambia el color si lo deseas (ahora es negro) */
    font-size: 15px !important;
    font-weight: 600 !important; /* Grosor de la letra */
}

/* Cambiar la tipografía de los valores (Pay in Store, $34.99...) */
.woocommerce-table--order-details tfoot td {
    font-family: "Inter", Sans-serif !important;
    color: #333333 !important; 
    font-size: 15px !important;
}

/* De paso, aplicar la misma fuente a los productos de arriba (Backpack x 1) */
.woocommerce-table--order-details tbody th,
.woocommerce-table--order-details tbody td {
    font-family: "Inter", Sans-serif !important;
}
.woocommerce-customer-details address{
	padding:0 !important;
	border:0 !important;
}
.woocommerce-order .woocommerce-order-overview.woocommerce-thankyou-order-details.order_details{
	padding:0 !important;
}

/* Mantener los bordes redondeados incluso cuando el desplegable está abierto */
.woocommerce form .form-row .select2-container--default.select2-container--open .select2-selection--single {
    border-bottom-left-radius: 30px !important; /* Ajusta este número al redondeo de tus otros campos */
    border-bottom-right-radius: 30px !important;
}

/* Fijar la altura para que no se deforme ni expanda al hacer clic */
.woocommerce form .form-row .select2-container--default .select2-selection--single {
    height: 50px !important; /* Ajusta a la altura que tengan los demás campos */
    display: flex !important;
    align-items: center !important;
}

/* Ajustar el texto interno para que no salte al fijar la altura */
.select2-container--default .select2-selection--single .select2-selection__rendered {
    line-height: normal !important;
    padding-top: 0 !important;
    padding-bottom: 0 !important;
}