X Theme Pro How to make Footer background transparent?

Hello I have the footer created through the Pro footer interface but can’t seem to get the white background to become transparent for it.

https://www.freeksngeaks.com/

Also the current CSS we have active is listed below.

Global CSS
.home .entry-wrap {
background-color: transparent
}.entry-title {
display: none;
}.x-btn-navbar.collapsed,
.x-btn-navbar.collapsed:hover {
background-color: transparent;
}.x-navbar .desktop .x-nav li > a > span:after {
content: “” !important;
}
.x-navbar .sub-menu a{
font-size:20px;
}

Additional CSS
.product .count {
display:none;
}.archive .x-header-landmark {
display: none;
}li.product-category.product a{display: flex;
flex-direction: column;
align-items: center;
}.x-topbar, .x-navbar, .x-logobar {
border: medium none !important;
box-shadow: none !important;
}
.x-colophon.bottom {
border: medium none !important;
box-shadow: none !important;
}.home .entry-wrap {
padding: 0px;
-webkit-box-shadow: none;
box-shadow: none;
border: 0px;
}
.home .entry-wrap .entry-content > #x-content-band-1 {
padding-top: 0px;
}footer.x-colophon.bottom {
background-color: transparent;
}

Thank you for your time. :slight_smile:

Hello, @JittWolfProductions,

Thanks for writing to us.

It seems that your selector is not correct since there is no “bottom” class. I would suggest you remove this code and add the given CSS code.

Remove this code

footer.x-colophon.bottom {
background-color: transparent;
}

Add this code

footer.x-colophon {
background-color: transparent !important;
}

The purpose of providing the custom CSS to show you how to add CSS code to your site. Writing custom CSS is outside the scope of our theme support. If you need more customization, you need to learn CSS and learn how to use the browser’s element inspector.

Hope it helps.
Thanks

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.