Change the Font Colour and Size In My Text With Image - Custom CSS

[darnellswipe]

Hey, 

I want to be able to change the size only this heading and my caption. 

I want this caption to be able to be bolder and white instead of grey. 

I also want to be able to change the size of my heading so it is a little smaller and make it the a different colour. 

The only issue is I also have code in the section currently and I don't know how to add more code to the existing code. Without changing the effect that code creates. 

Current Code:
@media only screen and (max-width: 600px) {
.image-with-text__grid.grid.grid--gapless {
flex-direction: column-reverse !important;
}
.image-with-text--overlap .image-with-text__content {
margin: -38px auto 0 !important;
padding: 30px 11px 0 !important;
}
.image-with-text__content {
padding: 11px 30px 0 !important;
}
}

Current Look: https://marketinfluence.co.uk/ 

[niraj_patel]

Hello @darnellswipe 

You can add code by following these steps

1. Go to Online Store -> Theme -> Edit code.
2. Open your theme.liquid file

3. Paste the below code before </body> on theme.liquid
<style>
  h2.image-with-text__heading.inline-richtext.h1 {
     font-size: 20px !important;
  }
  .image-with-text__text p {
     color: #fff !important;
     font-weight: 600 !important;   
 }

p.image-with-text__text.image-with-text__text--caption.subtitle.subtitle--large.subtitle {
   color: #fff !important;
   font-size: 16px !important;
   font-weight: 600 !important;
}
</style>

Was my reply helpful? Click Like to let me know!
Was your question answered? Mark it as an Accepted Solution.

[darnellswipe]

Is this only going to change this section? 

This is the top of my page and I want this heading to be different. 

I am looking for a custom CSS. 

However I already have a CSS which changes the position of my image and I want that ti stay the same. 

[niraj_patel]

Yes this work only for section.
Which kind of changes you want @darnellswipe