
.banner-container .banner img {
  filter: brightness(90%);
}

.banner-container .text-container{
    position: absolute;
    top: 50%;
    margin-top: -80px;
  }
  
  .banner-container .text-container h2{
    display: inline-block;
    border-bottom: 8px solid #f1ef9a;
    height: 73px;
    margin-bottom: 24px;
    font-size: 50px;
  }
  
  .banner-container .text-container p{
    width: 650px;
    margin-bottom: 24px;
    font-size: 19px;
  }


/* CARDS */

.fondo-rayas{
  background-image: url('../img/fondo_informes_rayas.PNG');
  z-index: -1;
  height: 245px;
  margin-bottom: 180px;
}

.container-cards{
  top: -150px;
  z-index: 2;
}

.container-cards button.btn{
  background: #f1ef9a;
  color: black;
  border-radius: 50%;
  font-size: 36px;
  padding: 0px 14px;
}

.card-slider-container {
    display: flex;
    overflow-x: hidden !important;
    gap: 90px;
    max-width: 70%;
    padding-bottom: 18px; 
  }

  .card {
    flex: 0 0 auto; /* No se expanden ni se contraen */
    width: 33.33%; /* Ancho de cada card */
    max-width: 355px;
    min-width: 264px;
  }
  .card .card-body{
    display: flex;
    flex-direction: column;
  }

  .card-body h2,.card-body h5{
    font-weight: 600;
  }

  .fondo-rayas div.texto {
    background: #517733;
    margin: -21px;
    padding-bottom: 60px !important;
    flex-grow: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    /* font-size: 18px;
    margin-bottom: 24px; */
  }

  /* .card-body p.card-text{
    font-size: 13px;
  } 

  .card-body p.fecha{
    font-size: 10px;
  }  */

  .btn-left {
    left: 10px;
    position: relative;
    z-index: 1;
    left: 16px;
  }
  .btn-right {
    right: 10px;
    position: relative;
    z-index: 1;
    right: 16px;
  }

  
  .card-body a{
      background-color: #f1ef9a;
      color: black;
      font-weight: 700;
      padding: 6px 30px;


      position: absolute;
      bottom: -15px;
      transform: translateX(-50%);
    left: 50%;
      z-index: 1000;
  }





  @media only screen and (max-width: 768px ) {
    .banner-container .text-container{
      margin-top: -140px;
    }
  
    .banner-container .text-container p{
      width: 100%;
      padding-right: 8px;
      font-size: 16px;
    }
  }


