How to make text scale with mobile?

Hi,

I noticed that my text becomes smaller when I go into a lower screen size(namely smart phones).

I tried this for multiple screen sizes but doesn't seem to work -

@media screen and (max-width: 350px) {
    h1,h2,h3,h3,p {
        font-size: 2em;
    }
}

Code (markup):

I read this from here - http://stackoverflow.com/questions/15649244/responsive-font-size

I'm not sure if using em causes any problems, but whenever I access the site, I am automatically zoomed in.

Thanks!

 

I found the answer. It has got to do with specificity... Totally missed that.