I Need More Control Over the Fonts on this Template - Sofia

I am seeking deeper access to my Templates fonts. Should be universal through CSS, but for the record, I am using Sofia.

1 - How do I view the CSS page that my site is generates without going live? If I'm adding Custom CSS, I would feel more comfortable seeing how the generated CSS is put together, naming conventions, etc.

2 - Is page specific CSS injection a higher tier paid function? Or is that for Javascript?

3 - How do I get granular with font size?

This template includes the following options for font from the pulldown menu:

Normal, Heading 1, Heading 2, Heading 3, Heading 4, Code

This limit across the site is killing my design. Each page has text and overall I need about 10 options on font size for the full site. So what I'd like to do is add more Heading slots to the template - what I believe the original templatemaker did. Is this possible?

Or do I need to pay more, get page specific, and add fonts through the css -"SiteWrapper" style?

Forgive me if this all seems rather basic. It's been awhile since I've messed around with html/css.

Cheers

Bump.

Anyone? Bueller..? Bueller..? Anyone..?

I would also love to know the answer!

1 - How do I view the CSS page that my site is generates without going live? If I'm adding Custom CSS, I would feel more comfortable seeing how the generated CSS is put together, naming conventions, etc.

Editing Mode - Live Mode use different class for body tag. (.sqs-edit-mode)

You can add this tag to before CSS, to apply on only Editing Mode.

2 - Is page specific CSS injection a higher tier paid function? Or is that for Javascript?

With Personal Plan, you can target Page ID. Each page has differrent Page ID. See how to.

eg. body#abc123xys h1 {font-size: 20px;} 

this code will set font size 20px for heading 1 on page with ID #abcy123xyz