Top menu displays vertically with Cassopeia

Hello, 
I have attached the settings of the advanced and mobile menu. The hamburger menu doesn't appear with the Cassiopeia template. It displays vertically. Any idea why?
Thank you

Hi
give me the url of the page so that I can check the problem
CEd

ok, email received
you are using the "metis menu" layout which is not made in the same way as the standard layout unfortunately

in the menu class field, add " nav", and tell me if the mobile menu is activated

It is working but it a bit out of position. Please see screenshot attached.

the problem is that your menu is in a container ".card-body" on which you have added some padding, border and background
of course it will apply to the mobile menu if you put it in the same place
the solution that I would suggest is to use the menu place "top fixed" and menu behavior "top fixed" too
to that it will not take place in the menu area and this problem will not occur

Thank you so much CEd, it is working now. Have a lovely festive holiday.

great!
thank you, Merry Christmas to you too!