body { 
    font-family: 'Segoe UI', Arial, sans-serif; 
    line-height: 1.6; 
    margin: 0; 
    background-color: #f4f4f4; 
    color: #333; 
}

header { 
    background: #1a252f; 
    color: #ffffff; 
    padding: 2rem 0; 
    text-align: center; 
    border-bottom: 4px solid #f1c40f;
}

header h1 {
    margin: 0;
    color: #ffffff !important; 
    text-transform: uppercase;
    letter-spacing: 2px;
}


nav { 
    background: #2c3e50; 
    padding: 15px; 
    text-align: center; 
    position: sticky;
    top: 0;
}

nav a { 
    color: #ecf0f1; 
    margin: 0 15px; 
    text-decoration: none; 
    font-weight: bold; 
}

nav a:hover { 
    color: #f1c40f; 
}


.container { 
    width: 85%; 
    max-width: 1000px;
    margin: 30px auto; 
    background: white; 
    padding: 30px; 
    box-shadow: 0 4px 15px rgba(0,0,0,0.1); 
    border-radius: 8px; 
}

h2 { 
    color: #2c3e50; 
    border-bottom: 2px solid #34495e;
    padding-bottom: 10px;
}


table { width: 100%; border-collapse: collapse; margin: 20px 0; }
th, td { border: 1px solid #ddd; padding: 12px; text-align: left; }
th { background-color: #34495e; color: white; }
tr:nth-child(even) { background-color: #f9f9f9; }

img { max-width: 100%; height: auto; border-radius: 5px; display: block; margin: 20px auto; }