Hello,

Found this topic yesterday and tried solutions from Kriesi. None of them worked, so I spent the last 3 hours solving this problem. Here’s my solution.

The fact that the viewport is 480px and not 320px is linked that the menu is scaled at 50% when hidden on the right, adding 160px to the width.

There are 2 rules which were not abided by ENFOLD linked to this problem

1) Size tap targets appropriately

This one is easy to fix. Just need to change all the scale(0.5) by scale (0.1) in CSS.

2) Size content to viewport

To fix this one, you need to hide the menu on the top of the screen, not on the right.
Google does not seem to care that content is hidden above the screen.

so instead of having thing like:

width:100%
right:-100%

and
-webkit-transform: translate(-100%, 0);

you will have

height:100%
top:-100%

and
-webkit-transform: translate(0,100%);

Final code

#mobile-advanced{
width:100%;
top:-100%;
height:100%;
position: absolute;
z-index: 1000;
padding:89px 0;
overflow: hidden;
border-left-style: solid;
border-left-width: 1px;
margin:0 0 0 -2px;
-webkit-transform: 	scale(1);
-moz-transform: 	scale(1);
-ms-transform: 		scale(1);
transform: 			scale(1);
-webkit-transition: all 0.6s ease;
-moz-transition: 	all 0.6s ease;
transition: 		all 0.6s ease;
-webkit-transform-origin: 0% 0%;
-moz-transform-origin: 0% 0%;
-ms-transform-origin: 0% 0%;
transform-origin: 0% 0%;
display:none;
}

#mobile-advanced.large-sceen{
height: 34%;
top: -34%;
}

.show_mobile_menu{
overflow: hidden;
}

.avia_transform3d #mobile-advanced{
-webkit-transform: 	scale3d(1);
-moz-transform: 	scale3d(1);
transform: 			scale3d(1);
}

.show_mobile_menu #mobile-advanced{
-webkit-transform: 	scale(1);
-moz-transform: 	scale(1);
-ms-transform: 		scale(1);
transform: 			scale(1);
-webkit-transform: 	translate(0,100%);
-moz-transform: 	translate(0,100%);
-ms-transform: 		translate(0,100%);
transform: 			translate(0,100%);
}

.avia_transform3d .show_mobile_menu #mobile-advanced{
-webkit-transform: 	scale3d(1);
-moz-transform: 	scale3d(1);
transform: 			scale3d(1);
-webkit-transform: 	translate3d(0, 100%, 0);
-moz-transform: 	translate3d(0, 100%, 0);
transform: 			translate3d(0, 100%, 0);
}