Problem with mobile woocommerce page

Hi, I just noticed when I checked the mobile page. My Woocommerce
product page is off centred resulting to the screen being extended and the
footer to be off.

Please see the screenshot here: http://i.imgur.com/eNPLj8Z.jpg

I’m thinking it might be the custom CSS I put:

.lay1 .product
{
margin-left: 0;
margin-right: 0;
}

How can I centre the product page on the mobile now so it’s within the mobile size while also keeping the products page centred on mobile?
The same thing also happens to the tablet view.

Thank you.