Use media queries in child theme

Dear SiteOrigin support,

I am using your Vantage theme, that I really enjoy so far. Thank you for your good work !
In order to customize it, I created a child theme of the non-premium version.

I am trying to resize the tagline depending on the screen width and I am having trouble so far.

I included the “viewport” meta in the header via functions.php:

// Add viewport meta tag to head
function viewport_meta() { 
    ?>
        <meta name="viewport" content="width=device-width, initial-scale=1"/>
    <?php
}
add_filter('wp_head', 'viewport_meta');

and I also added the following line at the end of style.css:

@media (max-width: 1080px) {header#masthead .hgroup .support-text{
font-size:400%;}}
@media (max-width: 680px) {header#masthead .hgroup .support-text{
font-size:300%;}}
@media (max-width: 480px) {header#masthead .hgroup .support-text{
font-size:200%;}}

Unfortunately, I am using the website on a private work environement and therefore can’t give you a URL (well, the URL is www.euroscience.org but you would see the not-wordpress current version if you don’t update your hostfiles).

URL: http://www.euroscience.org