html, body {
            height: 100%;
            margin: 0;
        }
        
        body {
            display: flex;
            flex-direction: column;
            min-height: 100vh; /* Use viewport height as minimum */
        }
        
        .content {
            flex: 1; /* This makes the content expand to push footer down */
        }
        
        /* Footer Styles */
        footer {
            background-color: #333;
            color: white;
            text-align: center;
            padding: 20px 0;
            margin-top: auto; /* Ensures footer stays at bottom */
        }
        
        footer a {
            color: white;
            text-decoration: none; /* Removed underline */
        }
        
        footer a:hover {
            color: #ffcc00;
            text-decoration: underline; /* Optional: underline only on hover */
        }

    
