Tagged: transparent header
-
AuthorPosts
-
January 15, 2023 at 7:38 pm #1378777
Hello,
When using “Transparent Header”, I’d like to make the top menu text color and phone number black.
I tried this – but it’s not working. I’m using the latest version. Here is a test page..
#top #header.av_header_transparency #header_main .phone_number a {
color: #000 !important;
}
Thanks for your support
AxelJanuary 15, 2023 at 7:53 pm #1378782Hey Axel,
Try this css:#top #header.av_header_transparency .phone-info { color: #000; }
After applying the css, please clear your browser cache and check.
Best regards,
MikeJanuary 15, 2023 at 8:18 pm #1378788Hey Mike,
Wow – thanks for your weekend support :)
Unfortunately, it didn’t make a difference.
We use the paid version of LayerSlider 7
Also WPRocket and cleared that too.Here is my complete CSS List. It’s at the top but also tried at the very end.
/* –AS– Menu font color for transparent header */
#top #header.av_header_transparency #header_main .phone_number a {
color: #000 !important;
}/* –AS– Shortcode Ultimate button text style */
.su-button-text-xl {
font-weight:800,, font-size:18px;
}
/* –AS– Making font “normal” for the main menu */
#top .av-main-nav > li > a {
font-weight: normal !important;
}
/* — AS — SHOWS ACTIVE PAGE IN MENU — */
.av-main-nav>li.current-menu-item>a>.avia-menu-text,.av-main-nav>li.current-page-ancestor>a>.avia-menu-text {
color: #00CCFF !important;
}/* –AS– Making sub-menu font 15px */
#top .av-subnav-menu li a {
font-size: 30x;
}/* –AS– Making active sub menu blue */
ul.sub-menu .current-menu-item .avia-menu-text span {
color: #049bd6 !important;
}/* –AS– stretching the pulldown menu to 280 px */
.main_menu .menu ul { width: 280px; }/* — AS — MAX MENU SIZE ADJUSTMENTS —
#top #header .avia_mega_div > .sub-menu.avia_mega_hr {
padding-top: 5px;
}
#top #header .avia_mega_div > .sub-menu {
padding: 20px 20px 20px;
}
*//* — AS — REMOVE CAPITAL FROM H1-H2 */
h1, h2, h3 {
text-transform: none !important;
}/* — AS — TABLE ALIGN LEFT SET — */
.avia-data-table td {
text-align: left !important;
}/* –AS– Reducing spaces between columns */
#top .av-flex-placeholder {
width: 1%!important;
}/* –AS– HR HTML code in red */
hr { display: block; height: 2px;
border: 0; border-top: 1px solid #00CCFF;
margin: 1em 0; padding: 0;
}/* — AS — DRAW A VERTICAL LINE — */
div.vr-right{
width: 1px; /* Line width */
background-color: red; /* Line color */
height: 100%; /* Override in-line if you want specific height. */
margin-left: 7px;
margin-right: 7px;
float: right; /* Causes the line to float to left of content.
You can instead use position:absolute or display:inline-block
if this fits better with your design */
}div.vr-left{
width: 1px; /* Line width */
background-color: red; /* Line color */
height: 100%; /* Override in-line if you want specific height. */
margin-left: 7px;
margin-right: 7px;
float: left; /* Causes the line to float to left of content.
You can instead use position:absolute or display:inline-block
if this fits better with your design */
}/* — AS — SLIDER ADJUSTMENT — */
.caption_framed .slideshow_caption .avia-caption-content p, .caption_framed .slideshow_caption .avia-caption-title, .avia-caption .avia-caption-content p, .avia-caption .avia-caption-title {
background: transparent;
}/* — AW — IMA COURSE TABLE — */
.ima-courses .pricing-table-wrap:nth-child(1) .avia-heading-row { background-color: #00CCFF !important; font-size: 18px;}.ima-courses .pricing-table-wrap:nth-child(2) .avia-heading-row { background-color: #00A0D0 !important; font-size: 18px;}
.ima-courses .pricing-table-wrap:nth-child(3) .avia-heading-row { background-color: #004080 !important; font-size: 18px;}
.ima-courses .pricing-table-wrap:nth-child(4) .avia-heading-row { background-color: #002C50 !important; font-size: 18px;}
.ima-courses .pricing-table { margin-left: 0 !important; padding: 0px 0 !important; }
.ima-courses .pricing-table>li { min-height: 70px; }
/* — AW — Hide Full-Width Menu on Mobile
@media only screen and (max-width: 768px) {
#top .av-submenu-container { display: none !important; }}
— *//* –AS– Menu font color for transparent header */
#top #header.av_header_transparency #header_main .phone_number a {
color: #000 !important;
}/* — AW — Mobile Friendly Likert Scale WP Forms — */
@media only screen and (max-width: 760px),
(min-device-width: 768px) and (max-device-width: 1024px) {.wpforms-field-likert_scale table,
.wpforms-field-likert_scale thead,
.wpforms-field-likert_scale tbody,
.wpforms-field-likert_scale th,
.wpforms-field-likert_scale td,
.wpforms-field-likert_scale tr {
display: block !important;
}
.wpforms-field-likert_scale th {
padding-left: 6px !important;
font-weight: bold !important;
}
.wpforms-form thead tr {
position: absolute !important;
top: -9999px;
left: -9999px;
text-align: left !important;
}
.wpforms-field-likert_scale tr {
border: 1px solid #ccc !important;
}
.wpforms-field-likert_scale td {
border: none !important;
border-bottom: 1px solid #eee !important;
position: relative !important;
padding-left: 50% !important;
}
.wpforms-field-likert_scale td:before {
position: absolute !important;
top: 6px !important;
left: 6px !important;
width: 45% !important;
padding-right: 10px !important;
white-space: nowrap !important;
}
.wpforms-field-likert_scale td:nth-of-type(1):before {
content: “Not yet”;
}
.wpforms-field-likert_scale td:nth-of-type(2):before {
content: “Planning stage”;
}
.wpforms-field-likert_scale td:nth-of-type(3):before {
content: “In developing”;
}
.wpforms-field-likert_scale td:nth-of-type(4):before {
content: “Yes, for 1-3 years”;
}
.wpforms-field-likert_scale td:nth-of-type(5):before {
content: “Yes for more than 3 years”;
}/* –AS– Menu font color for transparent header */
#top #header.av_header_transparency #header_main .phone_number a {
color: #000 !important;
}
Not sure what else I can try.
Thanks a lot
AxelJanuary 15, 2023 at 8:55 pm #1378792Hi,
Thanks for the feedback but the css I posted in not in your post#top #header.av_header_transparency .phone-info { color: #000; }
You have the same incorrect css twice in your post at the top and bottom, try adding my css at the very top.
If you still have trouble please include an admin login in the Private Content area so we can help.Best regards,
MikeJanuary 15, 2023 at 9:47 pm #1378796Sorry, Mike – I tried a few other things but couldn’t get it to work and had my old code back in.
I now put your code back in again.January 15, 2023 at 9:50 pm #1378797Ahhh – I just saw the phone number comes up black – but not the navigation and the social link (LinkedIn)
- This reply was modified 1 year, 10 months ago by AxelSchultze.
January 15, 2023 at 10:38 pm #1378801Hi,
Sorry, I didn’t know you wanted the social link black also, I couldn’t login because it asked for a code.
Try this css:#top #header.av_header_transparency .phone-info, #top #header.av_header_transparency .social_bookmarks li a { color: #000; }
After applying the css, please clear your browser cache and check.
Best regards,
MikeJanuary 15, 2023 at 10:49 pm #1378803Thanks so much MIke for this Sunday support. Really appreciate it.
It worked all out.
Have a great day
AxelJanuary 16, 2023 at 4:33 am #1378815 -
AuthorPosts
- The topic ‘text color setting when using transparent header’ is closed to new replies.