Hey all, this is hopefully a quick one and likely to be a typo, but I can't see where the error is myself and I'm hoping some fresh eyes will help pick it out!

I've got an image:
Code:
<img class="hideable" src="http://placehold.it/369x42" alt="" title="mastheadimages" style="max-width:369px; max-height:42px; margin-bottom:0px;">
And I've applied this style to it:
Code:
@media only screen and (max-width: 480px) {
img[class=hideable]{
	display:none;
	}
}
...which should make the image disappear when the screen is less than 480px wide. Except it isn't. I've applied this successfully to other images on the same page so I figure I've either got a typo somewhere that I'm missing, or there's something particular about the context of this image tag that's affecting it's ability to display: none.

Thoughts?