:root {
        --primary: #004d99;
        --secondary: #00a99d;
        --text: #333;
        --light: #f4f4f4;
    }
    body { font-family: Arial, Helvetica, sans-serif; line-height: 1.6; color: var(--text); margin: 0; padding: 0; }
    #container { max-width: 1100px; margin: auto; padding: 20px; }
    header { display: flex; justify-content: space-between; align-items: center; border-bottom: 3px solid var(--primary); padding-bottom: 10px; }
    .logo img { max-height: 80px; }
    nav ul { list-style: none; display: flex; padding: 0; gap: 20px; background: var(--primary); padding: 10px; }
    nav a { color: white; text-decoration: none; font-weight: bold; }
    .main-grid { display: grid; grid-template-columns: 2fr 1fr; gap: 30px; margin-top: 20px; }
    .banner { background: var(--secondary); color: white; padding: 15px; margin-bottom: 10px; text-decoration: none; display: block; border-radius: 4px; }
    .photo { width: 100%; border-radius: 5px; box-shadow: 0 4px 6px rgba(0,0,0,0.1); margin: 10px 0; }
    #sidebar ul { padding: 0; list-style: none; }
    #sidebar li { padding: 10px; border-bottom: 1px solid #ddd; font-weight: bold; }
    footer { margin-top: 40px; text-align: center; font-size: 0.9em; border-top: 1px solid #ccc; padding: 20px; }
    
    @media (max-width: 768px) {
        .main-grid { grid-template-columns: 1fr; }
        header { flex-direction: column; }
    }