@charset "UTF-8";
#user-menu {
	display: none;

        }
#menu_user_admin{
	display: none;
	}

body {
    font-family: Arial, sans-serif;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}
		
header {
    width: 100%;
    max-width: 963px; /* Limitar el ancho en pantallas grandes */
    margin: auto; /* Centrar en pantallas grandes */
}
        #menu-usuario {
	background-color: #FFF;
        }
 main {
	flex: 1; /* Permite que el main ocupe el espacio restante */
}
#contenido{
	width: 100%;
	max-width: 963px; /* Limitar el ancho en pantallas grandes */
	margin: auto; /* Centrar en pantallas grandes */
	}
  .login-container {
	background-color: #EEEEEE;
	box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);
	border-radius: 2px;
	display: none;
	max-width: 400px;
	margin: auto;
	padding: 5px;
        }

  .login-container input[type="text"],
  .login-container input[type="password"] {
	width: 100%; /* Hacer que el input ocupe todo el ancho disponible */
	max-width: 200px; /* Limitar el ancho máximo */
	padding: 10px;
	border: 1px solid #ccc;
	border-radius: 4px;
	margin: 10px 0;
}

.login-container button {
    background-color: #4CAF50;
    color: white;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    padding: 10px 15px; /* Mejorar el espaciado */
    font-size: 16px;
    font-style: italic;
    display: block; /* Hacer que el botón ocupe todo el ancho disponible */
    width: 100%;
    max-width: 200px; /* Limitar el ancho máximo del botón */
    margin: auto; /* Centrar el botón */
}

        .login-container button:hover {
            background-color: #45a049;
        }

footer {
	background-image: url(../archivos/pie.png);
	width: 100%;
	max-width: 963px; /* Limitar el ancho en pantallas grandes */
	margin: auto; /* Centrar en pantallas grandes */
	text-align: center;
	background-repeat: no-repeat;
	background-position: center;
	vertical-align: text-top;
}
		
		@media (max-width: 600px) {
    header, footer {
        width: 100%; /* Asegurar que ocupen el ancho completo en móviles */
    }

    .login-container {
        padding: 15px; /* Ajustar el padding en móviles */
    }
}