@media Breaks Gmail CSS
===

I am making custom template with MailChimp.  I have yet to test it across several email clients, but so far my tests with gmail reveal that when I add this media query, not only does it not work, but it causes the entire html email to render without css.  The other CSS works fine for gmail without the query.  On other clients the media query works, and does not prevent the other CSS from working.

Is this a known issue with gmail (and others), or is there a way to accomplish this?


        @media only screen 
        and (max-device-width : 480px) {
	       .bodyContent div{
                font-size:24px;
            }
            h1, .h1{
                font-size:36px;
            } 
            h2, .h2{
				font-size:28px;
            }
			h4, .h4{
				font-size:28px;
            }
            .preheaderContent div{
                font-size:24px;
            } 
        }