Changing Services box background and hover color.

[herman]

Hi.

In SKT-Black, how do I change the individual services boxes background color and how do I change the hover color.?

Cheers
Herman

[Sonnal S Sinha]

Hi,

Kindly show us your website URL so that we can assist further.

Regards,
Chris

[herman]

Hi Chris.

Website URL is:
http://www.virtualflight.co.nz

Cheers
Herman

[Sonnal S Sinha]

Hi,

Which color scheme do you want to use background and hover.

Regards,
Chris

[herman]

Hi Chris.

When a voucher is active I would like the box background to be green, text to be black, both for normal and hover over.
When hovering only the link box to be changed to black with white lettering, to stay in tune with the SKT Black Pro Theme.

Cheers
Herman

[Sonnal S Sinha]

Hi,

Kindly go to Appearance >> Theme Options >> Basic Settings >> Custom CSS Box:

Add this code there:

#services-box { background-color: #83b646 !important;}
#services-box h2, #services-box p { color:#000 !important;}
#services-box:hover { background-color: #000 !important;}
#services-box:hover h2, #services-box:hover p { color:#fff !important;}

Regards,
Chris

[herman]

Hi Chris.
That is half of what I wanted.
When I hover over the service box, the background has to stay green, just the clickable link has to change into black with white lettering.

Cheers
Herman

[Sonnal S Sinha]

Hi,

This is working fine.

See screenshot: https://imgur.com/a/Ow30r

Regards,
Chris

[herman]

Hi Chris.

The services box background color is green. That’s good.
When I hover over the service box the whole box is turning Black and the clickable link turns white with black color text. that’s not good.
I want the services box to stay green at all times, only the clickable link box need to change into black with white lettering when I hover the mouse over the services box.

Cheers
Herman

[herman]

Hi Chris

I have it worked out now, somewhat.
You put me on the right path.

Thanks
Herman

[Sonnal S Sinha]

Hi,

Kindly go to Appearance >> Theme Options >> Basic Settings >> Custom CSS Box:

Add this code there:

Remove

#services-box { background-color: #83b646 !important;}
#services-box h2, #services-box p { color:#000 !important;}
#services-box:hover { background-color: #000 !important;}
#services-box:hover h2, #services-box:hover p { color:#fff !important;}

Add this new code there

#services-box { background-color: #83b646 !important;}
#services-box h2, #services-box p { color:#000 !important;}
#services-box:hover { background-color: #83b646 !important;}
#services-box:hover h2, #services-box:hover p { color:#000 !important;}
#services-box:hover .read-more {background-color: #000 !important; color: #fff !important;  border: #000;}

Regards,
Chris

[herman]

Perfect

Thanks.

Heran

[Sonnal S Sinha]

Hi Herman,

If you found our service good kindly review us here: https://www.sktthemes.org/forums/topic/reviews-and-testimonials/page/14/

Regards,
Chris

[Author]

Posts