<style>
    /* Ensure the body takes up the full height of the viewport */
    body {
        display: flex;
        flex-direction: column;
        min-height: 100vh; /* Full height of the viewport */
        margin: 0; /* Remove default margin */
    }

    /* Ensure the container takes up available space */
    .container {
        flex: 1; /* Pushes the footer to the bottom */
    }

    /* Footer styling */
    footer {
        background-color: #f8f9fa;
        text-align: center;
        padding: 10px 0;
        font-size: 14px;
        color: #6c757d;
        width: 100%;
        position: relative;
    }
</style>