CSS Class

I see the CSS Class form-group-section in PROFILE_ADDRESS cb_address_header
Where is the CSS Class file located if I want to change the colour of the form-group-section from light grey to light blue?
Im dot a coder but I think I might be able to change the colour code of the form-group-section?
Also is it possible to change the colour the tabs see attached from light grey to light blue? Where is the file kept?
It would be great if I could change the colour with cb fields. If the user was a girl display light pink and if the user was a boy display light blue?
Thanks

You don't modify CBs CSS directly. You use CSS overrides and provide your own CSS to override it. See the below on how to use CSS Overrides.

www.joomlapolis.com/blog/kyle/18711-template-css-overrides-made-easy

Example override as follows.

It would be great if I could change the colour with cb fields. If the user was a girl display light pink and if the user was a boy display light blue?

You'd have to dynamically generate the CSS, which I suppose you could do using CB Auto Actions and a Code action to add CSS to the header. Since substitutions are supported there I suppose you could condition the CSS based off a gender field. As for the trigger you'd need to use onAfterUserProfileDisplay and onAfterUserProfileEditDisplay.

I entered
.cb_template .form-group-section .col-form-label {
background-color: red;
}

To test what it would change In the default template css Overrides and it did nothing???

What would be the 2 css examples blue for male and pink for female

I have a gender field radio button male or female could you please explain the procedure in detail to achieve this

You said above You'd have to dynamically generate the CSS, which I suppose you could do using CB Auto Actions and a Code action to add CSS to the header.

As for the trigger you'd need to use onAfterUserProfileDisplay and onAfterUserProfileEditDisplay?

How do I do this?
Thanks

To test what it would change In the default template css Overrides and it did nothing???

It changes the style of the section label added by CB Quickstart. Works perfectly fine in my tests. Try adding !important to the style so it has more focus. Example as follows.

You said above You'd have to dynamically generate the CSS, which I suppose you could do using CB Auto Actions and a Code action to add CSS to the header.

As for the trigger you'd need to use onAfterUserProfileDisplay and onAfterUserProfileEditDisplay?

Yes, you'd have to use CB Auto Actions and yes those triggers are correct. A Code action can be used to insert CSS into the page. You should be able to leave User as Automatic and just condition for gender under the Conditions tab.

You are an expert coder... No doubt...
I am a subscriber please can you explain in detail.
I have looked at autactions thats got a lot of configuring options.....

I cant understand your short talk.
No affence.
This is a big thing to me.
Please explain the exact procedure in detail please how to achive the resault.
Thanks

If you want to load custom CSS based off a gender field on profile display and profile edit you'd have the below for example.

Global
Triggers: onAfterUserProfileDisplay, onAfterUserProfileEditDisplay
Type: Code
User: Automatic
Access: Everybody
Conditions
Field: YOUR_GENDER_FIELD
Operator: Equal To
Value: GENDER
Action
Method: CSS (Inline)
Code:
For YOUR_GENDER_FIELD of course select whatever your gender field is and for GENDER input the gender you want this auto action to output CSS for. I can't help you with writing custom CSS; that will be for you to do, but the above will load whatever custom CSS you supply it.