Can't find CSS to control JS line breaks

I’ve added JS for the line breaks in my Stopped Header Slider. But now I need to close up the letter spacing and add weight to the font. I can’t find the CSS sheet that control this. Appearance>Customize>Add’lCSS doesn’t seem to control it. Nor does Appearance>Editor.

My website: http://www.dev.lilyrosechildrensmusic.com/landingpage2
Want to close letter space & add font weight like these 3 lines: www.fluidrank.com

I added this JS to get the line breaks:

  (function($){
        
      "use strict"

    if( $('body').hasClass('home') ) {
      
      var mainTitle    = 'DESIGN AS CATALYST';
      var subTitle     = '<b>capture attention</br>energize your messages</br>build your brand</b>'
      var buttonURL    = '#whatwedo';
      var buttonLabel  = 'Learn More';
      
      var heroContent  = '<div class="slide-inner">';
          heroContent += '<div class="contain text-slider">';
      	heroContent += '<h2 class="maintitle">'+mainTitle+'</h2>';
          heroContent += '<p class="subtitle">'+subTitle+'</p>';
         	heroContent += '</div>';
          heroContent += '<a href="'+buttonURL+'" class="roll-button button-slider" target="_top">'+buttonLabel+'</a>';
          heroContent += '</div>';

      $('.sydney-hero-area').append(heroContent);

    }  

  })(jQuery);

Hsello there,

Please try adding the below CSS code to Appearance > Customize > Additional CSS from dashboard.

    .text-slider .subtitle  {
      line-height: 65px;
      font-weight: bold;
    }

Regards,
Kharis

Hi Kharis,

No matter what I type in: bold, 200, 700, 800, the weight remains the same. I know here’s an 800 (black) weight that is heavier then the bold but when I try it looks the same as 200. Is the weight limited somewhere else, like does Sydney recognize regular and bold but not “black” (800) which is heavier then bold. Maybe the problem is when I selected Raleway as the web font and did not specify all the font weights? If so I don’t know how to check that.

There is also one other problem, when I added my own JS for the line breaks, now the header doesn’t display right in mobile and tablet views. I should do a media query so the type scales down, but I don’t know how,

Thanks for all you help, I truly appreciate it.

Hello there,

In the Body Fonts options under Appearance > Customize, enter

   Source+Sans+Pro:400,400i,600,700,900

for Font name/style/sets.

38

Regards,
Kharis