How to change title on element

Hi. I have changed the css so that

1. The H1, H2, H3 sizes are different on mobile than on desktop;

2. The H1, H2, H3 have a specific font that I uploaded.

These changes are manifested throughout the site.

However, the template I chose had an element (I don't know the proper term) already created. When I am in "edit" mode, it gives me the option to "Edit Content" and then I can edit "Element", "Content", "Design". I checked, and "Title" element is H3. However, It does not honor the CSS changes I made above. I cannot figure out how to get this title to honor my CSS changes.

In the screenshots below, you can see the different "CSS" changes I have made. You can also see the "Locally Owned & Operated" Header is honoring the CSS, but he "Our Services" is completely ignoring. I changed the H3 to 5rem just to prove a point that it is not honoring the css.

Th@disR@d is the password to view the site if needed.

I have exactly the same issue. I hope someone can help out

The title "meet the team" is weirdly following the paragraph re-sizing rules and not the Headline even if it is set as a headline

@Cristina_Rosebud

I just played around with ChatGPT until it told me what to do. I can show you my code, but I can't comment beyond that, as I don't know how to code, so it is foreign to me. Hopefully this helps though. The highlighted section is what it had me add.

 

/* CSS FOR TABLET */
@media only screen and (min-width: 641px) and (max-width: 949px){
/* Start Insert Code for Tablet*/

// Header h1
 h1 {font-size:2.1rem !important} 

// Header h2
 h2 {font-size:1.9rem!important} 

 // Header h4
 h4 {font-size:2.5rem !important} 
  
// Header h3
 h3 {font-size:1.5rem !important} 

     /* Header h4 */
  .list-section-title p {
    font-size: 2.2rem !important;
    font-family: 'DMSerifDisplay-Regular', serif;
    font-weight: normal;
  }
  
// Paragraph
 p {font-size:1.25rem !important} 

/* End Insert Code for Tablet */
}

/* CSS FOR MOBILE */
@media only screen and (max-width: 640px) {
/* Start Insert Code for Mobile*/

// Header h1
 h1 {font-size:1.8rem !important} 

// Header h2
 h2 {font-size:1.5rem!important} 

// Header h3
 h3 {font-size:1.25rem !important} 
  
  // Header h4
 h4 {font-size:2rem !important} 

// Paragraph
 p {font-size:1rem !important} 
  
   /* Header h4 */
  .list-section-title p {
    font-size: 1.8rem !important;
    font-family: 'DMSerifDisplay-Regular', serif;
    font-weight: normal;
  }

/* End Insert Code for Mobile*/
}

@font-face {

    font-family: 'DMSerifDisplay-Regular';

       src: url('https://static1.squarespace.com/static/641f2453b1e276423f86b6de/t/6420e59ac95fa64f3a7b3c32/1679877530490/DMSerifDisplay-Regular.ttf');

  }

h1 {font-family: 'DMSerifDisplay-Regular';}
h2 {font-family: 'DMSerifDisplay-Regular';}
h3 {font-family: 'DMSerifDisplay-Regular';}
h4 {font-family: 'DMSerifDisplay-Regular';}

.list-section-title p {
  font-size: 3rem;
  font-family: 'DMSerifDisplay-Regular', serif;
  font-weight: normal;
}

Th@disR@d

What is your site url? We can check easier