Best way to move top mobile menu?
 

Hello,

Currently I'm developing a bottom menu in XC 4.7.9. Wondering the best way to "move" or transition the styles from the top mobile menu to what I'm currently working on with the bottom (screenshot included). I know it's going to be a lot of JS/CSS edits, but wondering if maybe there's some X-Cart calls that I could use to speed up the process? Or the best way to start?

Been looking at a lot of the code the for mobile header and I'm assuming it's just going to be changing everything they made so it works on the bottom?

This is what I have currently:
https://i.imgur.com/ndKmFu5.png

Shrink this down in width so you can see the mobile version of this -- basically what I'm trying to mimic:
https://www.poolsuppliescanada.ca/