Transparent Mobile Header & Logo

Hi,

I have a transparent logo set in theme options, and a sticky header. I currently only use a transparent header on my homepage (but would prefer if it was available on any page with a transparent header). Transparent header works fine on desktop and large tablets, and I added the following code I found in your docs, to use a transparent header on mobile and smaller tablets. I would also like the transparent logo to show on any page with the transparent header, so added the second part of the css that I found in the forum:

/* Transparent Header For Mobile */
@media only screen and (max-width: 990px) {
.responsive.html_mobile_menu_tablet #top #wrap_all #header { 
        position: absolute;
}
.html_mobile_menu_tablet #top #wrap_all .av_header_transparency {
	background: transparent;
}
}
/* Transparent Logo on Header */
@media only screen and (max-width: 990px) {
.responsive #top .av_header_transparency.av_alternate_logo_active .logo a > img {
  opacity: 0;
}
.responsive #top .av_header_transparency .logo img.alternate {
  display: block;
}}

This was working at one stage, but isn’t now and it doesn’t use the transparent logo on anything below the breakpoint when the burger menu appears.

Any ideas why it isn’t working please?

Thanks,
Matt