I havent been able to change the font -size of the titles of specific image boxes which are h3, I know it has to be done by adding a name in the extra class name and then refering to it in the css, but I haven’t figured it out. (I dont what to change the font size of all the h3 images boxes I just need to change some titles of some specific image boxes)

Do you know how can I do that?

Thanks in advance,

David

Simply add a css class to your element, for example “my_custom_heading”.
Then you have several options to define the CSS for this class.

1. Define it globally in your Child theme style.css file – http://blueowlcreative.com/docs/fortuna/#customization1

2. Define it globally in Theme Options – http://blueowlcreative.com/docs/fortuna/#customization2

3. Define it locally (only for the current page) under the Custom CSS Settings –

http://blueowlcreative.com/docs/fortuna/#customization3

I tried it with the optino number 2 you sent me (Custom css)

But I haven’t been able to make it work

I added this element to the image box class
my_custom_heading

And them I defined by pasting this code in the custom css

.my_custom_heading h3 {
margin: 6px 30px 0 30px;
font-size: 13px;
line-height: 16px;
color: #333;
padding: 6px 0 0 0;
}

Thanks a lot,

David

You did good, this is the way to actually make things work, the only tricky part here is (you can see this if you open Developer tools) the heading for the image boxes is defined in the main css file like this:

.boc_image_box .info_overlay h3 {
......
}

And this by default (following CSS logic) has higher precedence than for example:

.my_custom_heading h3 {
......
}

No problem, we will simply narrow down our selector so it overwrites the default one in the CSS file.

Try with this:

.my_custom_heading.boc_image_box .info_overlay h3 {
......
}

Another way would be to simply pass your value as important:

.my_custom_heading h3 {
font-size: 13px !important;
}