/* Fixed footer navbar */
#page-footer .navbar {
    position: fixed;
    bottom: 0;
    left: 0;
    width: 100%;
    max-width: 100%;
    margin: -1px 0;
    border-radius: 0;
    box-shadow: none;
    animation: fadein 2s;
    z-index: 9; 
}

#page-footer {
    margin-bottom: 10px;
}

/* CSS to initially hide the footer */
#page-footer .navbar {
    opacity: 0;
    pointer-events: none; /* To prevent interactions with the hidden footer */
    transition: opacity 1s; /* Add a smooth transition effect */
}

/* CSS to make the footer visible once it's fully loaded */
#page-footer.loaded .navbar {
    opacity: 1;
    pointer-events: auto; /* Allow interactions with the visible footer */
}

@media (max-width: 768px) {
    #page-footer .navbar {
        padding-left: 10px;
        padding-right: 10px;
    }
    #page-footer {
        margin-bottom: 35px;
    }
}