Your skin resource definition probably looks something like:

'skins.vector' => array(
'styles' => array(

		'common/commonElements.css' => array( 'media' => 'screen' ),
		'common/commonContent.css' => array( 'media' => 'screen' ),
		'common/commonInterface.css' => array( 'media' => 'screen' ),
		'vector/screen.css' => array( 'media' => 'screen' ),

),
'scripts' => 'vector/vector.js',
'remoteBasePath' => $GLOBALS['wgStylePath'],
'localBasePath' => $GLOBALS['wgStyleDirectory'],
),

As you can see, each file is already assigned a media type. Trying to use @media blocks in those files will result in nested @media blocks, so obviously that doesn't work. If you're in a skin and you want something to apply to a specific media type, put it in a separate file and declare the media type in the resource definition. Either that or omit the media type in the resource definition and you'll be able to use @media blocks.

m33tar wrote:

Understood, thank you.

Is this resolved or does this still occur.