How to bring the Cart icon to in front of the header background

Hello,

For some reason, the Cart icon falls behind the header background. We can see the number of item counts in the cart, but the cart icon is not visible. I tried the default icon and another one.

It's a little visible on mobile, but on a weird location. I would love to be able to place it somewhere little upper side.

Here is the code that I used for the header section. I grabbed this code from the demo Kravmaga's custom css field.

#Wrapper, #Content, #Header_wrapper {
    background-color: transparent;
}
#Wrapper {
    box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);
}

/* Logo */
#Top_bar #logo { padding: 25px 0 45px 0; }

#Top_bar #menu { background: none; }
.header-stack #Top_bar:not(.is-sticky) { background: url(https://tilemileflooring.com/wp-content/uploads/2016/07/main-header-4.png) no-repeat top center !important; }

/* Menu */
#Top_bar .menu > li a:after { display: none; }

@media only screen and (min-width: 1240px) {
    #Top_bar:not(.is-sticky) .menu_wrapper { text-align: center; width: 100%; }
    #Top_bar:not(.is-sticky) .menu { width: 100%; }
    #Top_bar:not(.is-sticky) .menu > li { display: inline-block; float: none; }

    #Top_bar .menu > li:last-child > a span:not(.description) { background: none; }
}


Thank you,

Comments

Sign In or Register to comment.