How can I make the top menu on the homepage transparent, like in the Krystal theme?
M
Michiel
Original poster
Member
How can I make the top menu on the homepage transparent, like in the Krystal theme?
Hi Michiel,
Try the following CSS
header {
position: absolute;
top: 0;
left: 0;
right: 0;
z-index: 99;
color: #fff;
border-bottom: none;
}
header #soma-main-menu-wrapper .nav>li>a {
color: #fff;
}
.soma-top-bar .top-social a, .soma-top-header .top-social a {
padding-right: 10px;
color: #fff;
}
#soma-main-menu-wrapper .navbar-toggle .icon-bar {
background: #fff;
}
#page-title h1 {
margin-top: 150px;
}
@media only screen and (max-width: 767px) {
.scroll-fix {
position: relative !important;
border: 0;
}
header #soma-main-menu-wrapper .nav>li>a {
color: #555;
}
}
/* sticky header */
header.fixed {
color: #555;
}
header.fixed #soma-main-menu-wrapper .nav>li>a {
color: #555;
}
header.fixed .soma-top-bar .top-social a,
header.fixed .soma-top-header .top-social a {
padding-right: 10px;
color: #555;
}
Copy and paste it in Appearance -> Customize -> Additional CSS
Let us know if this works for you 🙂
Best Regards