body {
    font-family: 'Lucida Console', 'Courier New', monospace;
    background-color: #1a1a1a; /* Fondo oscuro */
    color: #ffffff; /* Texto blanco por defecto */
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

header {
    background-color: #000000; /* Negro para el encabezado */
	padding: 20px 20px;
    border-bottom: 2px solid #33ff00; /* Borde verde fluo */
    text-align: center;
}

header h1 {
    color: #ffff00; /* Amarillo fluo para el título */
    margin-bottom: 15px;
    font-size: 2.5em;
    text-shadow: 0 0 5px #ffff00, 0 0 5px #ffff00, 0 0 5px #ffff00; /* Efecto neón */
}

#main-nav ul {
    list-style: none;
    padding: 0;
    margin: 0;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
}

#main-nav ul li {
    position: relative;
    margin: 0 10px;
}

#main-nav ul li a {
    display: block;
    padding: 10px 15px;
    color: #ffffff; /* Texto blanco para los botones */
    text-decoration: none;
    background-color: #333333; /* Fondo oscuro para los botones */
    border: 1px solid #33ff00; /* Borde verde fluo */
    border-radius: 3px;
    transition: background-color 0.3s, color 0.3s, border-color 0.3s;
    font-size: 0.9em;
    text-transform: uppercase;
}

#main-nav ul li a:hover {
    background-color: #33ff00; /* Verde fluo al pasar el ratón */
    color: #000000; /* Texto negro al pasar el ratón */
    border-color: #ffff00; /* Borde amarillo fluo al pasar el ratón */
}

.dropdown-content {
    display: none;
    position: absolute;
    background-color: #222222; /* Fondo más oscuro para el menú desplegable */
    min-width: 160px;
    box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.5);
    z-index: 1;
    border: 1px solid #ffff00; /* Borde amarillo fluo */
    border-top: none;
}

.dropdown-content a {
    color: #ffffff; /* Texto blanco para las opciones del menú */
    padding: 12px 16px;
    text-decoration: none;
    display: block;
    text-align: left;
    font-size: 0.8em;
    text-transform: none;
    border: none; /* Eliminar borde de los enlaces individuales */
    background-color: transparent; /* Fondo transparente */
}

.dropdown-content a:hover {
    background-color: #ffff00; /* Amarillo fluo al pasar el ratón */
    color: #000000; /* Texto negro al pasar el ratón */
}

.dropdown:hover .dropdown-content {
    display: block;
}

main {
    flex-grow: 1;
    padding: 20px;
    max-width: 1200px;
    margin: 20px auto;
    background-color: #0d0d0d; /* Fondo ligeramente más claro para el contenido principal */
    border: 2px solid #33ff00; /* Borde verde fluo */
    box-shadow: 0 0 10px #33ff00, 0 0 20px #33ff00; /* Efecto neón */
    overflow-y: auto; /* Para permitir el scroll del contenido */
}

main h2 {
    color: #ffff00; /* Amarillo fluo para los títulos de sección */
    text-shadow: 0 0 3px #ffff00;
}

main p {
    color: #ffffff; /* Texto blanco para el contenido */
    line-height: 1.6;
}

footer {
    background-color: #000000; /* Negro para el pie de página */
    color: #33ff00; /* Verde fluo para el texto del pie de página */
    text-align: center;
    padding: 10px 20px;
    border-top: 2px solid #ffff00; /* Borde amarillo fluo */
    font-size: 0.8em;
}

/* Estilos para iconos Unicode */
header h1 .icon, #main-nav ul li a .icon, footer .icon {
    font-family: 'Segoe UI Symbol', 'Apple Color Emoji', 'Segoe UI Emoji', 'Noto Color Emoji', sans-serif;
}