remove your css code please and change the rule to !imporant:

  #main > div {
      z-index: 3;
      position: relative !important;
  }

And look above on #main #vidde {

the width is not as on color sections. because you gave to the grid-cells a padding.
– the padding of the border cells should have no padding to the border:
left cell
padding: 0px 15px 0px 0 ;
right cell:
padding: 0px 0 0px 15px;

EDIT : i try to find now a simpler solution. – As i studied your example page above – i checked another way.

Edit Edit: i did recognized now that the sections etc. are set to position static – with that it does not work
if you can live with a given height to your footer ( not calculated ) then this will be the easiest way:

• This reply was modified 5 years, 5 months ago by Guenni007.

so this is done?

or you can use the pseudo container after:

#top .scroll-down-link:after {
  content:"click here";
  font-size: 15px;
  text-align: left;
  line-height: 10px !important;
  position: absolute;
  top: 0;
  left: 8px;
  color: cyan;
}

on slider you need to shift the avia-slideshow-dots

To be honest, I really don’t understand it anymore.
There is a call to hurry, it can’t go fast enough. It is clear that we could have easily made the appointment, but now there is no hurry anymore and I don’t get an answer anymore.
Is that super grateful?
I really don’t want any thanks, but at least the haste demanded at the beginning should then also find an equivalent from you.

see again : https://webers-testseite.de/pureinstall/impressum/

just create a top navigation on dashboard – menus ( do not forget to check on the bottom that field: “Enfold Child Secondary Menu ”
then click on the link “Will be displayed if you selected a header layout that supports a submenu” you will be redirected to the header – header extra elements – Header Secondary Menu.

then this comes to your quick css:

/******** Tabs in top-menu *************/
#header_meta.container_wrap {
    background-color: #000f36 !important;
}

.responsive #header_meta .container {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0;
    margin: 0;
}

#header_meta .sub_menu {
    padding: 0 10px 0 50px !important;
}

ul#avia2-menu {
    margin: 0;
    margin-top: 2px !important;
    padding: 0;
    height: 40px;
    float:left;
}
 
ul#avia2-menu li {
    list-style: none;
    float:left;
    padding: 0 1px !important;
    height: 40px;
    border: none !important;
    text-align: center;
    background: -webkit-gradient(radial, 50% 100%, 10, 50% 50%, 90, from(rgba(31,169,244,1)), to(rgba(0,28,78, 1)) );
    background: -moz-radial-gradient(center 80px 45deg, circle cover, rgba(31,169,244,1) 0%, rgba(0,28,78, 1) 100%);
}
 
ul#avia2-menu li a,
#top #wrap_all .av_header_transparency .sub_menu ul#avia2-menu li a {
    border-radius:  20px 20px 0 0 !important;
    color: #fff;
    display: block;
    padding: 0 20px;
    text-align: center;
    text-decoration: none;
    line-height: 40px;
    background : -webkit-gradient(linear, left top, left bottom, from(rgb(168,168,168)), to(rgb(69,69,69)));
    background : -moz-linear-gradient(top, rgb(168,168,168), rgb(69,69,69));
    -webkit-transition-property: background;
    -webkit-transition-duration: 700ms;
    -moz-transition-property: background;
    -moz-transition-duration: 700ms;
}

ul#avia2-menu li a:hover,
#top #wrap_all .av_header_transparency .sub_menu ul#avia2-menu li a:hover,
ul#avia2-menu li.current-menu-item a,
#top #wrap_all .av_header_transparency .sub_menu ul#avia2-menu li.current-menu-item a {
    opacity: 1;
    background: -webkit-gradient(radial, 50% 100%, 10, 50% 50%, 90, from(rgba(31,169,244,1)), to(rgba(0,28,78, 1)) );
    background: -moz-radial-gradient(center 80px 45deg, circle cover, rgba(31,169,244,1) 0%, rgba(0,28,78, 1) 100%);
}

ul#avia2-menu li.current-menu-item a,
#top #wrap_all .av_header_transparency .sub_menu ul#avia2-menu li.current-menu-item a,
ul#avia2-menu li.current-menu-item a:hover,
#top #wrap_all .av_header_transparency .sub_menu ul#avia2-menu li.current-menu-item a:hover  {
    background: #fff;
    color: #000 !important;
}

ul#avia2-menu li a:hover {
    color: #fff !important;
}

@media only screen and (max-width: 767px) {
   #header_meta .sub_menu {
       padding: 0  !important;
   }

    ul#avia2-menu li a {
        padding: 0 10px;
    }

   ul#avia2-menu {
       margin-top: 0 !important;
    }
}

i like this glooming hover effect – but you can change it to a background-color.
that it has that tab feeling the active state ( current item ) should have the same color as header bg-color.
On transparency header it is hard to find a similar effect.

If it does not work at the moment – a mod is in that installation to look for a little bug with google recaptcha.

BUT : my advice is to hamper that behavior on small screens – because you can not scroll inside the footer content.
If the height of the footer content is higher than the given f.e. mobile-device height – then you can not see all content !!!

It seems that this is not the right understanding of fixed or parallax background.

On your example page that effect is called “curtain-effect” and is commonly used on the footer.
how to achieve this. the main point is that the footer position is set to fixed and bottom: 0 – and has a z-index less than the content scrolling over it.
But: On Enfold it is difficult to obtain , because #footer is part of #main. But there are ways to get the right solution for it in a different way.
But to give you better support it might be usefull to see your page.

Thats what i said – set .av-outer-tab-title to display none

Hi Mike and dear participants – i see there is a fix on github : https://github.com/KriesiMedia/enfold-library/tree/master/temp_fixes/Enfold_4_7_6_1/template_builder
concerning to : avia-tab-section.js : i don’t know if this is related to your problems – but maybe you test that new js file.

Edit: must be something different. I can not reproduce the “flickering” on tab change.

PS : i changed the code above on this: https://kriesi.at/support/topic/closed-tabs-on-mobil/#post-1234335

Well you can use the top-header on that :
Enfold Child – Header – Extra Elements Tab and : Header Secondary Menu
you have to define one menu as: Enfold (Child) Secondary Menu ( don’t know if you are using a child-theme)
to style them as “tabs” like in your example page should be possible

but if you can make it happen in the next few hours I will be super grateful!

How much does your gratitude look like?
If you want to do me a big favor, don’t vote for Trump ;)
Best whishes to you all from Germany.

Image

in the ai doc there are some vector datas – but the most patterns are embedded images.
So here we go with png files: https://webers-testseite.de/tagood.zip

• Give a custom class to your icon-list : tagood-icons
• upload all the png files to your media library
• put this to your quick css: ( if you like to colorize the icons as i do )
• adjust the file path to yours

.tagood-icons .avia-icon-list li .iconlist-char:before {
  content: "";
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center ;
  left:0;
  top: 0;
  width: 100%;
  height: 100%;
  position: absolute;
  border-radius: 50%
}

.tagood-icons .avia-icon-list li:nth-of-type(1) .iconlist-char:before {
  background-image: url(/wp-content/uploads/art01.png);
  background-color: red;
}
.tagood-icons .avia-icon-list li:nth-of-type(2) .iconlist-char:before {
  background-image: url(/wp-content/uploads/art02.png);
  background-color: blue;
}
.tagood-icons .avia-icon-list li:nth-of-type(3) .iconlist-char:before {
  background-image: url(/wp-content/uploads/art03.png);
  background-color: green;
}
.tagood-icons .avia-icon-list li:nth-of-type(4) .iconlist-char:before {
  background-image: url(/wp-content/uploads/art04.png);
  background-color: yellow;
}
.tagood-icons .avia-icon-list li:nth-of-type(5) .iconlist-char:before {
  background-image: url(/wp-content/uploads/art05.png);
  background-color: darkmagenta;
}

you see how this works : the first settings are the same for all icons – and then you count to your list items 1, 2, 3 etc
if you colorize you had to set a border-radius for them too
in the zip there are 6 files – but you can have more