.btn-azul{
    color: #FFF;
    background-color:#1165F6;
    padding: 7px 15px;
    border-radius: 5px;
    width: fit-content;
}

.btn-azul:hover{
    color: #1165F6;
    background-color:#FFF;
    padding: 7px 15px;
    border-radius: 5px;
    width: fit-content;
}

.btn-azul-contac{
    color: #FFF;
    font-weight: bolder;
    background-color:#1165F6;
    padding: 7px 50px;
    border-radius: 8px;
    width: fit-content;
}

.btn-azul-contac:hover{
    background-color:#2a76f8;
    color: #FFF;
}

.navbar-nav .nav-link.active, .navbar-nav .show>.nav-link {
    color: #1165F6 !important;
    font-weight: bolder;
}

.dropdown-item.active, .dropdown-item:active {
    color: #1165F6;
    background-color: transparent;
    text-decoration: underline;
}

.dropdown-item:focus, .dropdown-item:hover {
    color: #1165F6;
    background-color: transparent;
    text-decoration: underline;
}

.bannerCustom{
    height: 800px;
    color: #ffffff; 
    background-image: url('../img/homeBanner.gif');
    background-repeat: no-repeat;
    background-size: cover;     
}

.custom_tab-pane {
    transform: translateX(750px); /* Empieza desplazado hacia la derecha */
}


.custom_tab-pane>.active {
    transform: translateX(0px); /* Empieza desplazado hacia la derecha */
}

.custom-translate {
    transform: translateX(0px);
    transition: transform 0.35s ease-in;
}


.section-degradado-r{
    background-image: url('../img/degradador.png') !important;
    background-repeat: no-repeat !important;
    background-size: cover !important;  
    background-position: right !important;
}

.section-degradado-l{
    background-image: url('../img/degradadol.png') !important;
    background-repeat: no-repeat !important;
    background-size: cover !important;  
    background-position: left !important;
}

.title_banner{
    font-weight: 600;
    font-size: 4rem;
}

.form-control:focus {
    background-color: transparent;
}



@media (max-width: 485px){
    .title_banner{
        font-weight: 600;
        font-size: 3.125rem;
    }    
    
}

@media (max-width: 1024px){
    .seccion2{
        padding: 7rem 0;
    } 
    
    .title_banner{
        font-weight: 600;
        font-size: 3.5rem;
    }    
    
}

@media (min-width: 1025px) and (max-width: 1199px){
    .title_banner{
        font-weight: 600;
        font-size: 3.65rem;
    }    
    
}

@media (min-width: 1200px) and (max-width: 1300px){
    .title_banner{
        font-weight: 600;
        font-size: 4rem;
    }    
    
}

.subtitle_banner{
    font-weight: lighter;
}

.seccion2{
   
    padding: 6rem 0;
}

@media (min-width: 1024px) and (max-width: 1200px){
    .seccion2{
        padding: 7rem 0;
    }    
}

@media (min-width: 1201px){
    .seccion2{
        padding: 8rem 0;
    }    
}

.container_nav_items{
    width: 70%;
}


@media (min-width: 992px) and (max-width: 1200px){
    .container_nav_items{
        width: 80%;
    }    
}

@media (max-width: 991px){
    .container_nav_items{
        width: 100%;
    }    
}


.nav_item_custom{
    background-color: #FFF;
    border-radius: 5px;
    padding: 20px 20px;
    margin-bottom: 8px;
    color: #00215B;
    font-weight: bolder;
}

.nav_item_custom.nav-link.active{
    background-color: #E9E9E9;
}

.nav_item_custom:hover{
    background-color: #E9E9E9;
}


.nav-link.nav_item_custom {
    display: flex; 
    justify-content: space-between; 
    align-items: center;
    text-decoration: none;
    padding-right: 16px; 
    overflow: hidden;
}

.nav-link.nav_item_custom::after {
    /* content: "\2192"; */ 
    content: url(../img/ArrowNoExpand.png);
    font-size: 25px; 
    margin-left: auto; 
   
    line-height: 0; 
    font-family: system-ui;
    transition: content 0.5s ease;
}

.nav-link.nav_item_custom:hover::after {
  /* transform: translateX(5px); */ /* Mueve la flecha hacia la derecha cuando se hace hover */
  content: url(../img/ArrowExpand.png);
  font-family:serif;
  font-size:30px;
  transition: content 0.5s ease;
}


/* Contenedor de los tabs */
.tab-content {
    display: grid;  /* Usa display grid para controlar los elementos hijos */
    grid-template-rows: 1fr;  /* Esto hace que cada fila tenga la misma fracción del espacio disponible */
    height: 100%;  /* Asegúrate de que el contenedor padre tenga una altura definida */
}

/* Paneles individuales */
.tab-pane-custom {
    display: flex;
    flex-direction: column;
    overflow: auto;
    justify-content: start;
    height: 100%;
    padding-top: 6rem;
}

/* .nav-link.nav_item_custom {
    display: flex; 
    justify-content: space-between;
    align-items: center; 
    text-decoration: none; 
    padding-right: 16px; 
}

.nav-link.nav_item_custom::after {
    content: "\2192"; 
    margin-left: auto; 
} */

/* .nav-link.nav_item_custom::after {
    content: "\2192"; 
    display: inline-block;
    margin-left: 8px; 
}

.nav-link.nav_item_custom {
    white-space: nowrap; 
    overflow: hidden;
    text-overflow: ellipsis;
} */

.input_contact{
    background-color: transparent;
    border: 0;
    border-bottom: 1px solid #FFF;
    border-radius: 0;
}


@media (min-width: 857px) and (max-width: 1200px){
    
}

@media (min-width: 576px) and (max-width: 856px){
    .tab-pane-custom {
        padding-top: 2rem;
    }
}

@media (min-width: 409px) and (max-width: 575px) {
    .tab-pane-custom {
        padding-top: 0rem;
    }
}

@media (min-width: 10px) and (max-width: 408px) {
    .title_banner{
        font-weight: 600;
        font-size: 40px;
    }

    .bannerCustom{
        height: 650px;
    }

    .container_nav_items{
        width: 100%;
    }

    .tab-pane-custom {
        padding-top: 0rem;
    }
}





@media (min-width: 768px){
    
    .div-con-degradado {
        padding-top:40px;
        padding-bottom:40px;
        padding-right: 50px; /* Asegura espacio para la imagen */
        background: url('../../assets/img/border.png') no-repeat right center;
        background-size: 40px 100%; /* Ajusta al tamaño deseado */
    }    
    
}



.gradient-text-original {
  background: linear-gradient(to right, #1165F6, #25C7D9); /* Colores del degradado */
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent; /* Hace el texto transparente para mostrar el fondo */
  display: inline; /* O inline-block, dependiendo de tu layout */
}

@keyframes animate-gradient {
  0% {
    background-size: 100% 100%;
  }
  100% {
    background-size: 200% 200%;
  }
}

.gradient-text {
  background: linear-gradient(to right, #1165F6, #25C7D9);
  background-repeat: no-repeat;
  background-size: 100% 100%;
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent; /* Hace el texto transparente para mostrar el fondo */
  display: inline; /* O inline-block, dependiendo de tu layout */
  animation: animate-gradient 2s ease-in-out infinite alternate;
}


/* otro otro otro */
@keyframes animate-gradient {
  0%, 42.86% { /* 3/7 aproximadamente 42.86%, donde 3s es la duración activa y 7s es la duración total */
    color: #1165F6;
    background-size: 0% 100%;
  }
  42.86%, 100% {
    color: transparent;
    background-size: 100% 100%;
  }
}

.gradient-text {
  background: linear-gradient(to right, #1165F6, #25C7D9);
  background-repeat: no-repeat;
  background-size: 0% 100%;
  -webkit-background-clip: text;
  background-clip: text;
  color: #1165F6;
  display: inline;
}

.gradient-text.active {
  animation: animate-gradient 7s ease-in-out infinite; /* Total duration including pause */
}



/*********/



.navbar-dark .navbar-toggler-icon {
    background-image: url(../../assets/img/icon-burger.webp);
    width: 2rem;
}


.fondo-azul{
    background:#1165F6 !important;
}

@media (min-width: 576px) and (max-width: 580px){
    .padding-x-how{
        padding-left: 1.6rem!important;
        padding-right: 1.6rem!important;
    }
    
  
}

@media (min-width: 581px) and (max-width: 765px){
    .padding-x-how{
        padding-left: 2.5rem!important;
        padding-right: 2.5rem!important;
    }
    
  
}

@media (min-width: 766px) and (max-width: 800px){
    .padding-x-how{
        padding-left: 3rem!important;
        padding-right: 3rem!important;
    }
    
  
}

@media (min-width: 1025px) and (max-width: 1450px){
    .padding-x-how{
        padding-left: 6rem!important;
        padding-right: 6rem!important;
    }
    
    .padding-y-how{
        padding-top: 4rem!important;
        padding-bottom: 4rem!important;        
    }    
  
}

@media (min-width: 1450px) and (max-width: 1550px){
    .padding-x-how{
        padding-left: 7rem!important;
        padding-right: 7rem!important;
    }
    
    .padding-y-how{
        padding-top: 5rem!important;
        padding-bottom: 5rem!important;        
    }     
  
}
@media (min-width: 1550px) and (max-width: 1800px){
    .padding-x-how{
        padding-left: 11rem!important;
        padding-right: 11rem!important;
    }
    
    .padding-y-how{
        padding-top: 6rem!important;
        padding-bottom: 6rem!important;        
    }
  
}

@media (min-width: 1801px){
    .padding-x-how{
        padding-left: 13rem!important;
        padding-right: 13rem!important;
    }
    
    .padding-y-how{
        padding-top: 8rem!important;
        padding-bottom: 8rem!important;        
    }   
}