body {
margin: 0;
font-family: 'Bell MT', Bell MT;
background: linear-gradient(to bottom right, #003300, #006600, #009900, #00cc00, #00ff00);
color: white;
}
header {
background: rgba(0, 50, 0, 0.7);
padding: 20px;
text-align: center;
font-size: 2rem;
border-bottom: 3px solid #00ff00;
}
.highlight {
color: #00ff88;
}
#container {
display: flex;
}
aside {
width: 200px;
background: rgba(0, 100, 0, 0.4);
padding: 20px;
border-right: 2px solid #009900;
}
aside ul li {
padding: 8px 0;
cursor: pointer;
transition: 0.3s;
}
aside ul li:hover {
color: #00ff00;
transform: translateX(5px);
}
main {
flex: 1;
padding: 20px;
background: rgba(0, 150, 0, 0.2); /* Reverted: light transparent green */
backdrop-filter: blur(5px);
min-height: 500px;
font-size: 1.4rem;
}
footer {
background: rgba(0, 50, 0, 0.6);
padding: 15px;
text-align: center;
border-top: 3px solid #00ff00;
}
footer a {
margin: 0 10px;
color: #00ff00;
text-decoration: none;
transition: 0.3s;
}
footer a:hover {
color: white;
text-shadow: 0 0 10px #00ff00;
}
.glow-text {
text-shadow: 0 0 5px #00ff00, 0 0 15px #00cc00, 0 0 25px #009900;
}
.fade-in {
animation: fadeIn 1s ease forwards;
opacity: 0;
}
@keyframes fadeIn {
to { opacity: 1; }
}
.cool-btn {
padding: 10px 20px;
background: rgba(0, 255, 0, 0.2);
border: 2px solid #00ff00;
border-radius: 10px;
font-size: 1.2rem;
cursor: pointer;
transition: 0.3s;
}
.cool-btn:hover {
background: rgba(0, 255, 0, 0.4);
transform: scale(1.1);
}