.card {
    background-color: #002366; /* Fondo azul oscuro */
    color: white; /* Texto blanco */
    border-radius: 50%; /* Hace la tarjeta redonda */
    text-align: center; /* Centrar contenido */
    padding: 20px;
    margin-bottom: 20px;
    overflow: hidden;
    width: 250px; /* Ajusta el tamaño de la tarjeta */
    height: 250px; /* Ajusta el tamaño de la tarjeta */
    border: 4px solid rgb(176, 126, 1); /* Borde blanco */
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
  }

  .card img {
    width: 70%; /* Ajusta el tamaño de la imagen */
    height: auto;
    object-fit: contain; /* Mantiene la proporción de la imagen */
    border-radius: 10px; /* Hace las esquinas de la imagen ligeramente redondeadas */
    
  }

  .card:hover {
    transform: scale(1.15); /* (150% zoom - Note: if the zoom is too large, it will go outside of the viewport) */
  }

  .card-title {
    font-size: 20px;
    margin-top: 15px;
  }