Change color scheme of Inspiro theme

Themes Inspiro
#1

Hi Everyone,

maybe someone knows how to change the color scheme of an Inspiro lite theme?
More specifically I need to change the collors of the header-line, navigationbar and on the bottom the site-information (See picture below)
without losing the function to getting transparency by scrolling up.

image
image343×518 3.01 KB

Thank you and take care
Nico

#2

Did you ever figure this out?

#3

Here’s some CSS code that will help you change some colors:

/* Header bar at the top */
.navbar {
    background: #101010;
}

/* Header bar when scrolling */
@media screen and (min-width: 48em)
.headroom--not-top .navbar {
    background: rgba(0,0,0,.9);
}


/* Header bar on he homepage */
@media screen and (min-width: 48em) {

    .has-header-image.home.blog .headroom--not-top .navbar, .has-header-image.inspiro-front-page .headroom--not-top .navbar, .has-header-video.home.blog .headroom--not-top .navbar, .has-header-video.inspiro-front-page .headroom--not-top .navbar {
        background: rgba(0,0,0,.9);
    }

}


/* Footer bar */
.site-footer {
    background: #101010;
}

You can adjust the colors and then insert this code in the Customizer > Additional CSS.

Here’s a quick video to learn how to use the Inspector in Google Chrome and customize different elements:

Here’s a tutorial with more details: