body{
    margin: 0;
    font-family: 'Montserrat', sans-serif;

    background: #eee;
}

main {
    height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
  }
  
  .bienvenida {
    display: flex;
    align-items: center;
  }
  

  
  .logo {
    margin-right: 75px;
    margin-left: 15px;
    animation: fadeIn 2s ease-in-out;

  }
  
  .logo img {
    max-width: 100%;
    height: auto;
  }
  
  .sucursales {
    text-align: left;
  }

  .sucursales h3{
    font-family: 'Montserrat', sans-serif;
    margin-bottom: 22px;
    font-size: 1.5rem;
  }
  
  .sucursales ul {
    list-style: none;
    padding: 0;
    margin: 0;
  }
  
  .sucursales ul li {
    margin-bottom: 10px;
    animation: slideInRight 1s ease-in-out 1s forwards;
  }
  
  .sucursales ul li a {
    text-decoration: none;
    color: #00957a;
    font-size: 20px;
    display: flex;
    align-items: center;
    transition: color 0.3s, font-size 0.3s;
  }

  .sucursales ul li a:hover {
    color: #006f5a; 
    font-size: 22px; 
  }

  .sucursales ul li a::before {
    content: "•"; /* Carácter de viñeta */
    color: #000; /* Color de la viñeta */
    font-size: 24px; /* Tamaño de la viñeta */
    margin-right: 10px; /* Espacio entre la viñeta y el texto */
  }



  @keyframes fadeIn {
    from {
      opacity: 0;
    }
    to {
      opacity: 1;
    }
  }

  @keyframes slideInRight {
    from {
      opacity: 0;
      transform: translateX(100%);
    }
    to {
      opacity: 1;
      transform: translateX(0);
    }
  }
  

@media (max-width: 768px) {
  .bienvenida {
    flex-direction: column;
    text-align: center;
  }
  
  .logo {
    margin-right: 0;
    margin-bottom: 20px; /* Espacio entre el logo y la lista de sucursales */
  }

  .sucursales {
    text-align: center;
  }

  .sucursales ul {
    padding: 0;
  }

  .sucursales ul li a {
    justify-content: center;
  }
}