:root { --primary: #428bca; --dark: #111; --bg: #0f0f0f; --text: #eee; }
    * { box-sizing: border-box; }
    body { font-family: 'Arial', sans-serif; background: #000; color: var(--text); margin: 0; line-height: 1.6; }
    a { color: #428bca; text-decoration: none; }
    .container { max-width: 1200px; margin: 0 auto; padding: 20px; }
    
    /* Header & Nav */
    #main-navbar { background: #000; padding: 20px 0; border-bottom: 2px solid var(--primary); display: flex; justify-content: space-between; align-items: center; }
    .logofix img { height: 60px; }
    .main-nav ul { list-style: none; display: flex; gap: 20px; margin: 0; }
    .main-nav a { color: #fff; text-transform: uppercase; font-weight: bold; }
    
    /* Hero */
    #home3 { background: linear-gradient(rgba(0,0,0,0.8), rgba(0,0,0,0.8)), url('/assets/20151209.jpg'); background-size: cover; background-position: center; min-height: 60vh; display: flex; align-items: center; text-align: center; justify-content: center; }
    .basic-info { background: rgba(0,0,0,0.7); padding: 40px; border: 1px solid var(--primary); }
    
    /* Footer */
    #footer { background: #111; padding: 50px 0; margin-top: 50px; text-align: center; border-top: 5px solid var(--primary); }
    .social-icon { list-style: none; padding: 0; display: flex; justify-content: center; gap: 15px; }
    .social-icon a { font-size: 24px; color: var(--primary); }
    
    /* Responsive Helpers */
    .visible-xs { display: none; }
    @media (max-width: 768px) {
        .hidden-xs { display: none; }
        .visible-xs { display: block; }
        #main-navbar { display: none; }
    }
    
    #preloader { position: fixed; top:0; left:0; width:100%; height:100%; background: #000; z-index: 9999; display: flex; justify-content: center; align-items: center; }