Maquetación (Layout) Header, menú en dispositivos móviles y Footer de una tienda online

Hacer la maquetación, ubicar los elementos del Header, menú en dispositivos móviles y el footer de una tienda online en una posición en la que se vea bien, que el diseño quede bien hecho y los elementos bien ubicados, ocupando el menor espacio posible y tiene que hacerse y probarse para las resoluciones de dispositivos móviles más importantes. Es imprescindible tener experiencia previa con maquetación y prestashop, saber editar el custom.css del tema (themebenito1) de prestashop, poder editar el html del footer que agrega un módulo del tema llamado pos static footer y modificar o agregar código javascript en el custom.js para modificar el menú en dispositivos móviles. Adjunto capturas de pantalla de los defectos que hay ahora en las diferentes resoluciones, para que se vea lo que hay que hacer en la práctica.