how to reduce my footer page on mobile device

Site URL: https://millimetrearchitecture.com/

Hi, I have made my footer to be the all width of my website which is perfect ont he desktop version. I used the following CSS:

footer#footer {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 999;
}
.main-content {
    padding-bottom: 5vw;
}

however when on the mobile version the footer covers the all bottom of my page and some text and button. does someone know how to solve this?

Just now, tuanphan said:

Hi. Remove your code & add new code

@media screen and (min-width:641px) {
footer#footer {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 999;
}
.main-content {
    padding-bottom: 5vw;
}
}

 

thank you i did fix it already 🙂

thanks a lot!

When clicking Services, all menu move left a few pixels. Do you want to fix this?

Oh I didnt notice that! But I might change the top menu so dont waste time on that but thank you so much! 🙂 you are amazing and so helpful!