Custom CSS for mobile font size

Question

I am working with a Squarespace template and would like to fix up a few things while viewing my website on a mobile device (iPhone). www.jobspark.ca is my website.

Here is the code I tried and didnt have any luck with.

/* ----------Add your custom styles here for Mobile---------- */
@media only screen and (max-width: 640px) {
.desc-wrapper { font-size:24px;  
} 
}

I have attached an image to help demonstrate what I am trying to fix. Thanks

Answer 1

The font size is set with

.desc-wrapper p

so would need to change the size with:

@media only screen and (max-width: 640px) {
    .desc-wrapper p {
        font-size: 24px;  
    }

    /* Changes bottom headline */
    .sqs-block-content h1 {
        fonts-size: 18px;
    }
}