@font-face {
    font-family: SourceSansPro-Regular;
    src: url(.../fonts/SourceSansPro-Regular.otf);
  }
  
  @font-face {
    font-family: SourceSansPro-Semibold;
    src: url(../fonts/SourceSansPro-Semibold.otf);
  }
  
  @font-face {
    font-family: NunitoSans-ExtraBold;
    src: url(../fonts/NunitoSans-ExtraBold.ttf);
  }
  
  @font-face {
    font-family: NunitoSans-ExtraLight;
    src: url(../fonts/NunitoSans-ExtraLight.ttf);
  }
  
  @font-face {
    font-family: NunitoSans-Regular;
    src: url(../fonts/NunitoSans-Regular.ttf);
  }
  
  html {
    font-size: 15px;
    height: 100%;
    margin: 0;
  }
  
  body {
    background-color: #F3F2E6;
    display: flex;
    flex-direction: column;
  }
  
  
  /* 100 ANIOS DE HISTORIA */
  .introduccion {
    margin-top: 3rem;
    margin-left: 2rem;
    margin-right: 1.5rem;
    margin-bottom: 2.5rem;
  }
  
  .introduccion h1 {
    color: #3B464F;
    font-family: NunitoSans-ExtraLight;
    font-weight: 500;
    margin-top: 1rem;
    width: 13rem;
  }

  .padin_top {
   padding-top: 1rem;
  }

  
  .introduccion p {
    color: #3B464F;
    font-family: NunitoSans-ExtraLight;
    font-weight: 700;
  }
  /* 100 ANIOS DE HISTORIA */
  
  /* TIMELINE */
  ::-webkit-scrollbar {
    display: none;
  }
  .timeline {
    /* margin:0 10%;
    height: 630px;
    overflow: hidden;
    padding: 10px 0 40px 60px */
    overflow-y: scroll;
  }
  
  .cd-timeline {
    display: block;
    overflow: auto;
    padding: 2em 0;
    min-height: 80vh;
    /* background-color: #F3F2E6; */
    align-self: center;
    /* border-bottom: 2px solid #EAE0C5;
    border-top: 2px solid #EAE0C5; */
    /* padding: var(--space-lg) 0; */
    /* color: hsl(207, 10%, 55%);
    color: var(--cd-color-3);
    background-color: hsl(205, 38%, 93.45%);
    background-color: hsl(var(--cd-color-2-h), var(--cd-color-2-s), calc(var(--cd-color-2-l)*1.05));
    font-family: 'Droid Serif', serif;
    font-family: var(--font-primary) */
  }
  .cd-timeline__container {
    position: relative;
    /* background-color: #F3F2E6; */
    /* padding: 1.25em 0;
    padding: var(--space-md) 0 */
  }
  
  /* .box ul{
    list-style-type: none;
    margin: 0;
    margin-left: -1rem;
    padding: 0;
    position: relative;
    transition: all 0.5s linear;
    top:0
  } */
  
  /* .box ul:last-of-type{top:20px} */
  
  .cd-timeline__block {
    display: -ms-flexbox;
    display: block;
    position: relative;
    padding-left: 2rem;
    padding-right: 7rem;
    z-index: 1;
    margin-bottom: 2em;
  }
  
  .cd-timeline__block_imagen .cd-timeline__container:before {
    content: "";
    display: block;
    width: 0;
    height: 100%;
    border: 1px dashed #fff;
    position: absolute;
    top: 0;
    left: 30px;
  }
  
  .cd-timeline__container {
    margin: 20px 60px 60px;
    position: relative;
    padding: 0;
    border-radius: 10px;
    line-height: 20px;
    /* width: 35% */
  }
  
  /* Linea */
  .cd-timeline__container::before {
    content: "";
    display: block;
    width: 0;
    height: 100%;
    border: 1.2px solid #EAE0C5;
    position: absolute;
    top: 0;
    left: -10px;
  }
  
  /* Ciculo */
  .cd-timeline__container span::before {
    content: "";
    display: block;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: #EAE0C5;
    border: 2px solid #EAE0C5;
    position: absolute;
    left: -20px;
  }
  
  /* .box ul li > span:before{top:-10px} */
  /* .box ul li > span:after{top:95%} */
  
  .cd-timeline__block .title,
  .cd-timeline__block .title-fuera {
    text-transform: uppercase;
    font-weight: 700;
    margin-bottom: 15px;
    color: #3B464F;
    font-family: "SourceSansPro-Semibold";
    font-size: 1.3rem;
  }
  
  .cd-timeline__block .name {
    margin-top: 10px;
    /* text-transform: capitalize;
    font-style: italic;
    text-align: right;
    margin-right: 20px; */
    color: #2C503F;
    margin-bottom: 15px;
    font-weight: bold;
  }
  
  .cd-timeline__block .info {
    color: #2C503F;
  }
  /*
  /
  */
  
  /* Mis css */
  .cd-timeline__block img {
    width: 25%;
    min-width: 133px;
  }

  /* Estilos para el carrusel */
#carouselClinica .carousel-item img {
    width: 100%; /* Asegura que la imagen cubra el 100% del ancho del contenedor */
    height: 500px; /* Altura fija para las imágenes del carrusel */
    object-fit: cover; /* Asegura que las imágenes cubran el área sin distorsionarse */
}

#carouselClinica {
    max-width: 1200px; /* Máximo ancho del carrusel */
    margin: auto; /* Centra el carrusel horizontalmente */
}

@media (max-width: 768px) {
    #carouselClinica .carousel-item img {
        height: 300px; /* Altura más pequeña para dispositivos móviles */
    }
}
  
  /* TIMELINE */
  
  
  /* EMPIEZAN LOS MEDIA QUERIES */
  @media (min-width: 768px) {
    html {
      font-size: 16px;
    }
  
    button.turno {
      display: initial;
    }
    button.turno {
      border: #EAE0C5 2px solid;
      border-radius: 5px;
      font-family: NunitoSans-Regular;
      color: #3B464F;
      background-color: #F3F2E6;
      font-weight: 400;
      font-size: 0.9rem;
      padding: 0.8rem;
    }
    button.turnoMobile {
      display: none;
    }
    .introduccion h1 {
      width: fit-content;
      margin: 0;
    }
    .textoIntroduccion {
      -webkit-column-count: 2; /* Chrome, Safari, Opera */
      -moz-column-count: 2; /* Firefox */
      column-count: 2;
      line-height: 1.8rem;
      margin-top: 2rem;
    }
    .textoIntroduccion1 {
      margin-right: 1.5rem;
    }
    .textoIntroduccion2 {
      margin-right: 1.5rem;
    }
  
    /*TIMELINE*/
    .cd-timeline__block_impar img {
      width: 30%;
      position: relative;
      top: -2rem;
      left: 2.5rem;
    }
  
    .cd-timeline__block_par img {
      width: 30%;
      position: relative;
      top: -2rem;
      left: 7.5rem;
    }
  
    /* .cd-timeline__block_par img {
      width: 30%;
      position: relative;
      top: -2rem;
      left: 4.5rem;
    } */
  
    /*LINEA*/
    .cd-timeline__container::before {
      left: 41%;
      -webkit-transform: translateX(-50%);
      -ms-transform: translateX(-50%);
      transform: translateX(-50%);
    }
    /*CIRCULO*/
    .cd-timeline__container span::before {
      left: 41%;
      -webkit-transform: translateX(-50%);
      -ms-transform: translateX(-50%);
      transform: translateX(-50%);
    }
    .impar .title {
      -webkit-transform: translateX(50%);
      -ms-transform: translateX(50%);
      transform: translateX(50%);
    }
    .par .name,
    .par .info {
      -webkit-transform: translateX(50%);
      -ms-transform: translateX(50%);
      transform: translateX(50%);
      top: -2rem;
      position: relative;
      width: 14rem;
      left: 10.5rem;
    }
    .par .title,
    .par .title-fuera {
      -webkit-transform: translateX(33%);
      -ms-transform: translateX(33%);
      transform: translateX(33%);
    }
  
    .impar .info {
      width: 14rem;
      top: -2rem;
      position: relative;
      text-align: right;
      left: 0.4rem;
    }
    .impar .name {
      width: 14rem;
      top: -2rem;
      position: relative;
      text-align: right;
      left: 0.4rem;
    }
  
    .par img {
      top: -2rem;
      position: relative;
      /* width: 14rem; */
      left: 17.5rem;
    }
  
    .impar img {
      top: -2rem;
      position: relative;
      /* width: 14rem; */
      left: 4.5rem;
    }
  
    .title-fuera {
      position: relative;
      left: -3.5rem;
    }
  
  
  
  @media (min-width: 1280px) {
  
    header nav {
      width: 90%;
      position: relative;
      left: 6%;
    }
    button.contacto{
      margin-right: 5rem;
    }
    .contenedorIntroduccion {
      position: relative;
      left: 9%;
    }
    .textoIntroduccion {
      line-height: 2rem;
      width: 80%;
    }
  
    .cd-timeline__block img {
      width: 30%;
    }
  
  }