/* Add here all your CSS customizations */
.ocultar{
    display: none;
}

@media (min-width: 768px) {
  #mainNav {
    display: flex;
    align-items: center;
  }

  .btn-contact {
    display: flex;
    align-items: center;
    height: 100%;
  }
    
  .btn-contact a.btn.btn-primary {
    border-radius: 30px !important;
  }
}

.btn-contact a.btn.btn-primary{
    padding: 10px 10px 10px !important; display: flex;
  align-items: center;  /* centra verticalmente */
  height: 100%; 
}
.mb20{
    margin-bottom: 20px;
}
.mt20{
    margin-top: 20px;
}
.mt30{
    margin-top: 30px;
}
.mt40{
    margin-top: 40px;
}
.borderRadius7{
    border-radius: 7px !important;
}

.minHei{
    min-height: 40px;
}

.quienes_somos {
	font-size: 2.4em;
	font-weight: 400;
	letter-spacing: normal;
	line-height: 47px;
	margin: 0 0 14px 0;
}

.quienes_somos_parrafo {
	color: #777;
	line-height: 24px;
	margin: 0 0 20px;
	font-size:14px;
}

h4.titulo_programa{
	font-size:26px;
	color: #a35aa4;
	line-height:26px;
	margin-bottom:40px;
}

.list.list-icons li .fa, .list.list-icons li .icons {
    color: #000;
    border-color: #ffffff;
    background-color: #ff0090;
}

.ver_videos{
	padding-top:30px; 
	color:#ec008c; text-align: center;
}

.text_ver_videos {
	 color:#ec008c;
	 font-size:25px;
}

.margen_programa{
	 margin-bottom:25px;
}

.lbl_input{
	 font-size:18px; 
	 color:#FFFFFF;
}

.padding_div_footer{
	 padding-top:5px;
}

.title_fb{
	 color:#FFFFFF; 
	 font-size:16px;
}

.icon_fb{
	 color:#D82ED2; 
	 font-size:20px;
}

/* Estilos por defecto (para MÓVIL) */
.padding-logo {
    padding-right: 0;
}

.icono-first a {
    margin-left: 0 !important;
}

.icono-red-social{
    display: inline-block !important;
}

/* Estilos para TABLET y DESKTOP */

@media (min-width: 768px) {
    
    .padding-logo {
        padding-right: 40px;
    }

    .icono-first a {
        margin-left: 30px !important;
    }
    
    .icono-red-social{
        display: block !important;
    }
    
}

.icono-red-social a{
     padding-left: 8px; padding-right: 8px;
}

.icono-red-social i{
     color: #ec008c; font-size: 2.2rem;
}

.title_contacto{
	color:#FFFFFF;
}

h4.title_information{
	color:#ec008c;
}

.lista_footer{
	color:#fff; 
	font-size:14px;
}

.lista_datos{
	color:#777; 
	font-size:14px;
}

.size_title{
	font-size:14px;
}

#footer h4{
	color:#ec008c;
}
.list.list_db li .fa, .list.list_db li .icons
{
    color: #ec008c;
    border-color:transparent;
    background-color:transparent;
}

.dropdown-menu > li > a:focus, .dropdown-menu > li > a:hover {
    color: #262626;
    text-decoration: none;
    background-color: #FFEEF8;
}

#header .header-logo img{
    width: 176px !important;
}

html #header.header-semi-transparent .header-body, html #header.header-semi-transparent-light .header-body {
	background: rgba(255, 255, 255, 0.7);
    backdrop-filter: blur(6px); 
    -webkit-backdrop-filter: blur(6px); 
}

.home-intro p.texto-blanco{
    color: #fff !important;
}
.texto-primario {
	color: #6768ab !important; 
}
.texto-blanco{
    color: #fff;
}
.text-light {
	color: #6768ab !important; 
}
.bgVerde a{
    background-color: #d2f55b; color: #333 !important; border: none;
}
.bgPurple a{
    background-color: #6958ca; color: #fff !important; border: none;
}
.boxesRedondeadas div.featured-box{
    border-radius: 32px; border: none; box-shadow: 0px 0px 20px rgba(0,0,0,0.10);
}
html .featured-box-primary .box-content { border: none; }

h2 {
	font-size: 2.6em;
	font-weight: 300;
	line-height: 42px;
	margin: 0 0 32px 0;
}
html .btn-purple {
	color: #ffffff;
	text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
	background-color: #6958ca;
	border-color: #6958ca #6958ca #006699; border-radius: 5px;
}

html .btn-purple:hover {
	border-color: #0099e6 #0099e6 #0077b3;
	background-color: #0099e6;
}

html .btn-purple:active,
html .btn-purple:focus,
html .btn-purple:active:hover,
html .btn-purple:active:focus {
	border-color: #0077b3 #0077b3 #0077b3;
	background-color: #0077b3;
}

html .btn-purple.dropdown-toggle {
	border-left-color: #0077b3;
}

html .btn-purple[disabled] {
	border-color: #33bbff;
	background-color: #33bbff;
}

html .btn-purple:hover,
html .btn-purple:focus,
html .btn-purple:active:hover,
html .btn-purple:active:focus {
	color: #ffffff;
}

.textosSubtitulos h4.titulo_programa{
    color: #0f0d1d;
}
.tituloConDivisor img.img-responsive{
    height: 26px; margin-top: -8px;
}
.tituloConDivisorBlanco img.img-responsive{
    height: 26px; margin-top: -12px; margin-bottom: 24px;
}
html section.section-default.section-default-programas2 {
	background-image:url(../../img/fondo_videos.jpg) !important; 
}

.contact-item {
    display: flex;
    align-items: flex-start;
    gap: 10px;
    margin-bottom: 20px;
    color: #fff;
    font-size: 14px;
}

.contact-item span {
    margin-top: -4px;
}

/* textos slider BEGIN */
html .slider-container .tp-caption-overlay-primary {
	/*background: rgba(255, 255, 255, 0.9);*/
	background: rgba(255, 255, 255, 0.5);
}

html .slider-container .tp-caption-overlay-opacity-primary {
	/*background: rgba(137, 184, 55, 0.4);*/
	background: rgba(255, 255, 255, 0.5);
}
.slider-container .main-label {
	color: #6768ab; /*JM*/
	font-size: 62px;
	line-height: 62px;
	font-weight: 800;
	text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.15);
}
/* textos slider END */

/* animacion mariposa BEGIN */
/* Vuelo amplio y lento para mariposa grande */
@keyframes vueloMariposaGrande {
  0%   { transform: translate(0, 0) rotate(0deg); }
  25%  { transform: translate(20px, -20px) rotate(5deg); }
  50%  { transform: translate(0px, -40px) rotate(-5deg); }
  75%  { transform: translate(-20px, -20px) rotate(5deg); }
  100% { transform: translate(0, 0) rotate(0deg); }
}

/* Vuelo más rápido y con más cambios para mariposa pequeña */
@keyframes vueloMariposaPequena {
  0%   { transform: translate(0, 0) rotate(0deg) scale(0.8); }
  20%  { transform: translate(10px, -10px) rotate(-10deg) scale(0.8); }
  40%  { transform: translate(-5px, -20px) rotate(10deg) scale(0.8); }
  60%  { transform: translate(15px, -30px) rotate(-5deg) scale(0.8); }
  80%  { transform: translate(-10px, -15px) rotate(8deg) scale(0.8); }
  100% { transform: translate(0, 0) rotate(0deg) scale(0.8); }
}

/* Base común */
.mariposa-animada {
  position: absolute;
  z-index: 10;
  pointer-events: none; /* para que no interfiera con clics */
}

/* Mariposa grande */
.mariposa1 {
  right: 20px;
  bottom: 5px;
  animation: vueloMariposaGrande 5s ease-in-out infinite;
    margin-bottom: -10px;
}

/* Mariposa pequeña */
.mariposa2 {
  top: 20px;
  left: 20px;
  animation: vueloMariposaPequena 6s ease-in-out infinite;
}
/* animacion mariposa END */

.inputControl{
    height: 43px;
}

/* menudo BEGIN */
    #header .header-nav.header-nav-stripe nav > ul > li:not(:hover).active > a {
        color: #6768ab; 
    }

    #header .header-nav.header-nav-stripe nav > ul > li:hover {
        color: #fff; 
    }

    #header .header-nav.header-nav-stripe nav > ul > li:hover > a {
        background-color: #6768ab; 
    }

    #header .header-nav.header-nav-top-line nav > ul li.active > a,
    #header .header-nav.header-nav-top-line nav > ul li:hover > a {
        color: #89b837;
    }

	html #header.header-semi-transparent .header-nav-main nav > ul > li:not(.active) > a {
		font-weight: 500; border:none !important;
	}
/* menudo END */

html .btn-primary {
	color: #ffffff;
	text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
	background-color: #6958ca;
	border-color: #6958ca #6958ca #6958ca;
	border-radius: 5px;
	font-size: 26px;
}

.cajas-dontativos{
    box-shadow: 0px 0px 20px rgba(0,0,0,0.10); padding: 20px 12px 8px 12px; min-height: 150px;
    /* Centrado vertical */
    display: flex;
    flex-direction: column;
    justify-content: center;

    /* Si también quieres centrar horizontalmente: */
    align-items: center;
    text-align: center;
    
    margin-bottom: 16px;
}

.cajas-donativos2{
    border-radius: 32px;
    border: none;
    box-shadow: 0px 0px 20px rgba(0,0,0,0.10); padding: 20px;
}

h4.titulo-pregunta{
    font-size: 20px;  
}
h4.titulo-pregunta a{
    color: #3a405b !important; 
}
.titulo-pregunta a img{
    width: 26px; margin-right: 8px; margin-bottom: -5px;
}

div.panel.panel-default.bg-pregunta{
    background-color: #f8f8f8 !important; padding: 10px 20px; border-bottom: none; margin-bottom: 10px; border-radius: 10px;
}
div.panel.panel-default.bg-pregunta div.panel-body p{
    padding-left:44px;
}

.cajas-patronato{
    border-radius: 10px !important; background-color: #f8f8f8; margin-bottom: 14px !important;
}

/* para acomodar paypal BEGIN */
#paypal-form-fields-container-V5UEWKQDLAXD6 .hero-img {
    object-fit: cover !important;
}
#paypal-form-fields-container-V5UEWKQDLAXD6 .thumbnail-button {
     width: 5.5rem !important; height: 5.5rem !important;
}
#paypal-form-fields-container-V5UEWKQDLAXD6 .thumbnail-container {
    grid-template-columns: repeat(auto-fit, 5.5rem) !important; margin-top: 1.4rem !important;
}
    
#paypal-form-fields-container-V5UEWKQDLAXD6 .thumbnail {
    width: 5.5rem !important;
    height: 5.5rem !important;
}

@media (min-width: 768px) {
    #paypal-form-fields-container-V5UEWKQDLAXD6 .thumbnail-button {
        width: 8.5rem !important;
        height: 8.5rem !important;
    }
    #paypal-form-fields-container-V5UEWKQDLAXD6 .thumbnail-container {
        grid-template-columns: repeat(auto-fit, 8.5rem) !important;
    }
    #paypal-form-fields-container-V5UEWKQDLAXD6 .thumbnail {
        width: 8.5rem !important;
        height: 8.5rem !important;
    }
}

.container-paypal div.css-178qcrb{
     max-width: 100% !important;
}

.item-description{
    text-align: justify !important;
}

#form-container-V5UEWKQDLAXD6 form{
     max-width: 400px !important;
}

/* para acomodar paypal END */

@media (min-width: 992px) {
	
}

@media (max-width: 991px) {
	.home-intro p {
		font-size: 2em;
		font-weight: 200;
	}
	
	html .btn-primary {
		font-size: 20px;
	}
	
	h4.titulo_programa {
		font-size: 25px;
	}
	
	.title_fb{
		font-size:13px;
	}
	
	#footer h4{
		font-size:1.5em;
	}
	
}

@media (min-width: 768px) {
	
}

@media (max-width: 479px) {

	html #header.header-semi-transparent .header-body:before, html #header.header-semi-transparent-light .header-body:before {
		opacity: 0; /*JM*/
	}
}

