@media only screen and (max-width: 768px) {
    .footer-basic {
      font-size: 1.2em !important; /* Aumenta el tamaño del texto */
    }
    .footer-basic ul {
      font-size: 1.3em !important; /* Aumenta el tamaño del texto en la lista */
    }
    .footer-basic .social > a {
      max-width: 100% !important; /* Aumenta el tamaño de los iconos sociales */
      max-height: 40px !important; /* Aumenta el tamaño de los iconos sociales */
      font-size: 20px !important; /* Aumenta el tamaño del texto en los iconos sociales */
    }
    .desplegable-container {
      padding-right: 0;
      margin-right: 0;
    }
    .textos-especialidades {
      padding: 1rem;
      display: table-row-group;
    }
    .especialidades {
      margin: 0 auto;
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
      max-width: 100%;
      flex-direction: column; /* Cambiamos la dirección del flexbox a columna */
    }
    .especialidad {
      width: 100%; /* Ancho del 100% para que ocupe toda la pantalla */
      margin-top: 0;
      margin-bottom: 20px; /* Agregamos un margen inferior para separar las especialidades */
    }
    .especialidad:nth-child(odd) {
      text-align: right; /* Texto a la derecha para las especialidades impares */
    }
    .especialidad:nth-child(even) {
      text-align: left; /* Texto a la izquierda para las especialidades pares */
    }
    .especialidad img {
      width: 50%; /* Ancho del 50% para que la imagen no ocupe toda la pantalla */
      margin: 0 auto; /* Centramos la imagen horizontalmente */
    }
    .especialidad h1 {
      font-size: 0.5rem;
      margin-bottom: 1rem;
    }
    .especialidad p {
      font-size: 0.1rem;
      margin-bottom: 2rem;
    }
  }
  
  @media only screen and (max-width: 50rem) {
    .nav-oculto_container {
      display: flex;
    }
    #navbar {
      display: none;
    }

    .textos-especialidades {
      padding: 1rem;
      display: table-row-group;
    }
    .especialidades {
      margin: 0 auto;
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
      max-width: 100%;
      flex-direction: column; /* Cambiamos la dirección del flexbox a columna */
    }
    .especialidad {
      width: 100%; /* Ancho del 100% para que ocupe toda la pantalla */
      margin-top: 0;
      margin-bottom: 20px; /* Agregamos un margen inferior para separar las especialidades */
    }
    .especialidad:nth-child(odd) {
      text-align: right; /* Texto a la derecha para las especialidades impares */
    }
    .especialidad:nth-child(even) {
      text-align: left; /* Texto a la izquierda para las especialidades pares */
    }
    .especialidad img {
      width: 50%; /* Ancho del 50% para que la imagen no ocupe toda la pantalla */
      margin: 0 auto; /* Centramos la imagen horizontalmente */
    }
    .especialidad h1 {
      font-size: 0.5rem;
      margin-bottom: 1rem;
    }
    .especialidad p {
      font-size: 0.1rem;
      margin-bottom: 2rem;
    }
  }
  

  /* Pantalla pequeña (mobile) */
  @media only screen and (max-width: 767px) {
    .info {
      text-align: none;
      margin-inline: 2%;
      font-size: 20px;
    }
    header {
      height: 25em;
    }

    .textos-especialidades {
      padding: 1rem;
      display: table-row-group;
    }
    .especialidades {
      margin: 0 auto;
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
      max-width: 100%;
      flex-direction: column; /* Cambiamos la dirección del flexbox a columna */
      animation-range: entry 30% cover 35%;
    }
    .especialidad {
      width: 100%; /* Ancho del 100% para que ocupe toda la pantalla */
      margin-top: 0;
      margin-bottom: 20px; /* Agregamos un margen inferior para separar las especialidades */
    }
    .especialidad:nth-child(odd) {
      text-align: right; /* Texto a la derecha para las especialidades impares */
    }
    .especialidad:nth-child(even) {
      text-align: left; /* Texto a la izquierda para las especialidades pares */
    }
    .especialidad img {
      width: 50%; /* Ancho del 50% para que la imagen no ocupe toda la pantalla */
      margin: 0 auto; /* Centramos la imagen horizontalmente */
    }
    .especialidad h1 {
      font-size: 0.5rem;
      margin-bottom: 1rem;
    }
    .especialidad p {
      font-size: 0.1rem;
      margin-bottom: 2rem;
    }
    .prev-btn,
    .next-btn {
      display: none;
  }