Changing mobile font size

[HjalmarCarlson]

I want the page heading font size to be smaller on mobile but none of my mobile breakpoints seem to be working. Is there something in the Atelier CSS that would be overriding my CSS?

Below is the CSS i have in the Custom CSS/JS section in the admin:

/* mobile */
@media only screen and (max-width: 767px){
    #intro-box h1{
        font-size:50px !important;
    }
    
    .sectionlinks{
        padding: 2% 5%;
    }

}

I’ve also attached a screenshot of the section i’m referring to.

Attachments:

You must be logged in to view attached files.

[Rui Guerreiro – SUPPORT]

Hi,

When you use css class you should use the dot . an not the cardinal #

try this one.

/* mobile */
@media only screen and (max-width: 767px){
    .intro-box h1{
        font-size:50px !important;
    }
    
    .sectionlinks{
        padding: 2% 5%;
    }

}

-Rui