CSSをデバイスサイズによって切り替える際はMedia Queriesを使って書き分けることがほとんどだと思います。
CSS内でMedia Queriesを使って書き分けるのではなく、そもそもCSSを読み込む際にデバイスサイズによって読み込むCSSを変更する方法があったので忘れないようにメモ。
<link rel="stylesheet" href="css/midium.css" media="only screen and (min-width:480px) and (max-width:768px)">
<link rel="stylesheet" href="css/small.css" media="only screen and (max-width:479px)">
この記述だと480px~768pxまでは『midium.css』。479px以下は『small.css』を読み込みます。
あまり使うこともないかもしれませんが、もしかしたら役に立つかも。