How to use css media querys & viewport

How can i make it so my website is displayed 1080px on all devices except anything less than a width of 480px.

Im using the viewport meta tag, which works fine for all devices:

Code:

<meta name="viewport" content="width=1080">

However i would like to be able to override the meta tag only on devices less than 480px.

Code:

@media (max-width: 480px){ //my mobile site css }

Ive searched the internet and found this code, but im not sure how to use it.

Code:

@viewport{ width:1080px;} @-ms-viewport{width:1080px;}

Any ideas?