Link:

The text block blinks at the end of the transition. The images that are cross fading are backgrounds in each of the 3 slides.

The text block is the same for each slide with all transition settings at 0 to make it stay on screen over top of the transitioning backgrounds.

Thanks

Yes! That’s perfect! Thanks so much!

Just one or two more minor things:
1. Currently the cross logo is not quite centered. I think it’s because the entire menu (the whole block) is centered. Is there a way to center the cross, and then arrange the other menu items around it?

2. When I scroll down, the menu items get a little bit closer together (you can see this at the website, which is in the private data). I assume there’s a padding code somewhere that’s affecting this? How can I avoid this?
Here’s all the menu css code I have affecting the header, if it helps:

/* increases spacing between top menu items */
#top #header .av-main-nav > li {
	margin-right: 15px;
}

/* eliminates space above menu */
.container.av-logo-container {
	max-height: 0 !important;
}

#header_main {
	padding: 10px 0;
}

/* changes logo to blue in menu when scrolling down */
.header-scrolled-full #menu-item-914 a {
	background-image: url(https://middlestreetnh.com/wp-content/uploads/2016/09/CROSS-BLUE-50-50.png);
	background-size: 50px 50px;
	background-repeat: no-repeat;
	width: 50px;
}

.header-scrolled-full #menu-item-914 .avia-menu-text {
	display: none;
}

.header-scrolled-full #menu-item-914 a:hover {
	background: transparent !important;
	background-image: url(https://middlestreetnh.com/wp-content/uploads/2016/09/CROSS-BLUE-50-50-75.png) !important;
}

Thanks so much for all your help!

Hi,
I’ve already run successfully that procedure.
If you read the previous answers at the top, you can see them.

In fact, the problem only affects the resolution of the tablet.

Hi support team,
i added a background image to my header with this css:
#header_meta {
background-image: url(‘http://voltaris.de/wp-content/uploads/2016/05/square.jpg’) !important;
height: 65px !important;
background-repeat: repeat !important;
background-position: top !important;
border-bottom-style: none;
}

It works very well on Mac-Browsers. But in windows firefox and explorer the Background image doesn`t scale down when i minimize the browser width. So the menu does overlap the background image logo. Is there an css trick to force the background-image to scale down on windows?

Thanks a lot! I solved the problem myself. Thanks for the tips.
As I’m talking to you…can you help me solve the original problem with the button? As I said I was following this instructions
https://kriesi.at/support/topic/open-form-in-a-lightbox-popup/#post-378103
I did everything but when I click to the button there is still something not working. I need it to open a contact form on a popup window on the same page. Could you please give a look to it? I have tryed everything so I don’t know what alse to do.
Here’s the link http://www.simonasantaera.it/servizi/ button is the first on the right below the text “TRATTAMENTO CORPO”

hi Andy
sure – the link you provide works for me too – please remember my original issue right at the top of this thread was related to customisation of the audio payer with CSS not the default audio player you link to.

Please add this quick CSS to your business flat installation and see what happens. this should remove the volume slider and the mute button.

.mejs-controls .mejs-volume-button {display: none !important;}
.mejs-controls .mejs-horizontal-volume-slider {display: none !important;}

Your own screenshot from September 16th on IMGR shows one of the problems – i.e. the total time counter collapsing back into the current time area. here it is marked up. http://screencast.com/t/FwB5FJtJof

The black line showing on Chrome browser only is the second problem – when audio player sits inside the icon block.
http://screencast.com/t/ZBU8gwRa

thanks
Pete