.navbar {
    position: fixed; /* Fija el navbar en la parte superior */
    top: 0px; /* Colócalo en la parte superior */
    left: 0; /* Alineado al lado izquierdo */
    width: 100%; /* Abarca todo el ancho de la pantalla */
    background-color: black; /* Color de fondo */
    opacity: 0.95;
    color: white; /* Color del texto */
    z-index: 1000; /* Asegura que el navbar esté encima del contenido */
    padding: 10px 0; /* Espaciado interno */
    transition: top 0.8s ease-in-out; /* Transición suave para el movimiento del navbar */
  }


  /* Contenedor de la imagen */
  .imagen-contenedor {
      display: flex;
      justify-content: center; /* Centra la imagen horizontalmente */
      align-items: center; /* Centra la imagen verticalmente */
      height: 100vh; /* Esto hace que el contenedor ocupe toda la altura de la ventana */
    }


  .imagen {
    width: 500px; /* Ancho de 500px */
    height: 500px; /* Alto de 500px */
  }



  #selectedFlagContainer {
    cursor: pointer;
    width: 80px;
    height: 40px;
    margin: 0px;
  }

  /* Estilo del contenedor donde se muestran las banderas */
  #flagDropdown {
    display: none;  
    position: fixed;
    top: 108px;  
    left: 1517px;
    /*background-color: white;*/
    border: 0px solid #ccc;
    /*border-radius: 5px;*/
    box-shadow: 0 0 10px rgba(0,0,0,0.2);
    padding: 0px;
    z-index: 2000;
  }

  /* Estilo para las banderas en la lista desplegable */
  .flag-option {
    width: 80px;
    height: 40px;
    display: block;
    margin: 0;
    cursor: pointer;
  }

  /* Al pasar el mouse sobre las banderas */
  .flag-option:hover {
    opacity: 0.7;
  }