CSS changes messed up mobile version

I’ve been trying to change the #primary and #secondary container widths by using the following CSS changes (I made sure the percentages still added up to the same as the default settings):

#primary {
width: 75.64%;
}

#secondary {
width: 21.28%;
}

This works brilliantly in the web version and gives me exactly what I want, but the mobile version does not gracefully implement these changes and squishes the containers. I am using your theme on http://www.fashionfindsonadime.com. Can you please tell me if what I’m trying to do can be done in such a way as to maintain the great look and feel of the mobile version? Thank you!