Color Change of Slider and Buttons

Isn’t it this:

#controllers a:hover,
#controllers a.active

Thanks for your quick response ?? I put that in the Custom CSS and it didn’t do anything…I’m not quite sure how that code has anything to do with changing colors (i’m new to css)

It wouldn’t have done anything by itself. You need to change the ‘background-color‘ and ‘color‘ styles:

#controllers a:hover,
#controllers a.active {
 background-color: red;
 color: red;
}

https://www.w3schools.com/cssref/css_colornames.asp

Some CSS-specific resources:

• https://developer.mozilla.org/en-US/learn/css
• https://css.maxdesign.com.au/selectutorial/
• https://www.cssforum.com.pk/

That did the trick for the dots on the slider ?? Thanks! But now do you happen to know how to change the cyan box on the slider itself? Also do you know the code for the cyan line on the Nav Bar pop down menu that displays sub menu? (If you highlight over the Activities & Events page you will see the same cyan color line in the submenu)

To clarify, what box are you referring to?

The semi transparent cyan color box on the slider on the homepage…(It says “About Us”on it)

Try using a browser developer tool to find this stuff out. Chrome’s built-in developer tool is the one I use.

It exposes the CSS applied to elements, like the blue box you’re referring to, so that you know what CSS you need to use in your Custom CSS.

See: https://snag.gy/Ng437.jpg ?
On the developer toolbar it shows the HTML to the left, and CSS to the right. Seeing that CSS should be sufficient enough to indicate the CSS you need to use. You’ll need to apply the CSS to this:

.featured-text .featured-title

Use this CSS generator to create the CSS you need to use to create that transparency effect: https://www.css3maker.com/css-3-rgba.html
Then copy the code generated and put it into your Custom CSS along with that CSS exposed by Chrome’s developer tools:

.featured-text .featured-title

To make something like this:

.featured-text .featured-title {
 background-color: rgba(215, 44, 44, 0.7);
 background: rgba(215, 44, 44, 0.7);
 color: rgba(215, 44, 44, 0.7);
}

Edit:
You don’t actually need the ‘color‘ styling, if you don’t want to change it. So, your style would be something like this (with ‘color‘ removed):

.featured-text .featured-title {
 background-color: rgba(215, 44, 44, 0.7);
 background: rgba(215, 44, 44, 0.7);
}

• https://developers.google.com/chrome-developer-tools/
• https://developers.google.com/chrome-developer-tools/docs/dom-and-styles

Thanks it worked! ?? Do you know the code for the drop down sub page menu…For example if you hover over Activities and Events you will see the cyan line and the cyan text…do you know the code to change that? I used Chrome View Source and hovered over it…i just can’t pick out the class in all that code. I’m completely new at CSS..sorry

Do you see it now https://snag.gy/RPKXK.jpg ?

Thank you for your help…I have learned a lot…now one more thing…

I can’t seem to find the class for the hover color of the sub menu…for example when you hover over Activities & Events and then hover over Supplemental Classes you get the same cyan color…I went searching and can’t find any hover class or cyan color…

https://snag.gy/GVjtz.jpg

On the CSS side (to the right of the HTML) press on the dotted rectangle icon and then tick the ‘hover’ checkbox (I’ve outlined in red): https://snag.gy/rLJUp.jpg

Thank you SO much! I have learned so much ?? I think thats all…you were a great help! Thanks again…