Well after removing the broken image link – i do not see on real mobile devices that box.
So as Yigit said – clear browser cache. This is a bit more complex on iphones –

next tip:
wenn du im Hamburger Menü nur eines der Untermenüs zeitgleich angezeigt bekommen möchtest:

das hier in die functions.php

function only_one_submenu_open_on_burger(){
?>
<script>
window.addEventListener("DOMContentLoaded", function () { 
	(function($) {
	  $('body').on( 'click touch', '.av-active-burger-items > a', function () {
	    $(this).parent('li').siblings().removeClass('av-show-submenu');
	    $(this).parent('li').siblings().find('ul').slideUp( "fast");
	  });
	  $('body').on( 'click touch', '.av-active-burger-items .av-width-submenu > a', function () {
	    $(this).closest('.sub-menu').siblings().find('li').removeClass('av-show-submenu');
	    $(this).closest('.sub-menu').siblings().find('ul').slideUp( "fast");
	  });
	})(jQuery);
});
</script>
<?php
}
add_action('wp_footer', 'only_one_submenu_open_on_burger');

in dem Zusammenhang ist eventuell besser wenn du das Menü nicht über die Höhe zentrierst.

#top #av-burger-menu-ul {
  vertical-align: top;
  padding: 150px 0 !important;
}

Just for Info – no need to read

If you inspect the DOM in Chrome, for example, and click on the grid next to the grid container, the grid layout is displayed in the frontend.
Here you can see very clearly how a grid layout is structured. These hatched lines are the “gaps” – whereby you could even distinguish between row-gap and column-gap. And an ingenious feature is that gaps are only ever set between elements; if there is no neighbour, there is no gap.

You see now with the 3 column grid that I shift the 4th and the 5th element out of the grid, by ( 50% minus half the gap value).

_________________
PS:
The numbers could also be used – e.g. by giving the first item an extension. So grid-column: 1 / 3;
would mean that the item extends from line 1 to line 3. (borrowing a little from the table layout, there is also the possibility of defining a span. Span 2 extends over 2 widths or heights.

it is much easier to select such elements if they were separated only in one surrounding container.
Means if they were alone f.e. in one color-section. – next we do not need on grid-layout or on flex-layout the need to set same height option – we can do that on different ways.
It is alway a good practice to have for special solutions a unique selector – means f.e. a unique ID or class on that surrounding container.

so now let all as it is and put this to your child-theme quick css:

#top.page-id-5864 #av_section_2 .entry-content-wrapper .flex_column_table .av-flex-placeholder {
  display: none !important
} 

#top.page-id-5864 #av_section_2 .entry-content-wrapper .flex_column_table {
  display: grid !important;
  grid-auto-flow: row;
  grid-auto-rows: 1fr;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 20px;
} 

#top.page-id-5864 #av_section_2 .entry-content-wrapper .flex_column_table .flex_column {
  width: unset !important;
  margin: 0 !important
} 

@media only screen and (min-width:560px) and (max-width: 989px){
  #top.page-id-5864 #av_section_2 .entry-content-wrapper .flex_column_table {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 20px;
  } 

  #top.page-id-5864 #av_section_2 .entry-content-wrapper .flex_column_table > .flex_column:nth-of-type(n+6) {
    left: calc(50% + 10px) /*** just if you like to center last 2 items *****/
  }
}

@media only screen and (min-width:320px) and (max-width: 559px){
  #top.page-id-5864 #av_section_2 .entry-content-wrapper .flex_column_table {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
  } 
  
  #top.page-id-5864 #av_section_2 .entry-content-wrapper .flex_column_table .flex_column:last-of-type  {
    left: calc(50% + 5px) /*** just if you like to center last item *****/
  }
  
  #top.page-id-5864 #av_section_2 .entry-content-wrapper .flex_column_table .flex_column p {
    font-size: 17px;
    line-height: 24px
  } 
}

@media only screen and (max-width: 319px){
  #top.page-id-5864 #av_section_2 .entry-content-wrapper .flex_column_table  {
    display: grid !important;
    grid-template-columns: 1fr; 
    gap: 10px;
  }   
}

5 to 3/2 to 2/2/1 screen sizes lower than 320px will end in 1 column layout.
just shrink your window size to see what happens on responsive case.

soweit ich euch verstanden habe, wolltet ihr doch direkt das Sucheingabefeld im Menu? – und nicht die Lupe.
Nun wäre es hilfreich gewesen, ihr hättet erwähnt, dass es sich um den Header mit logo top menü darunter handelt. Denn hier hat man eine ganz andere Headerstruktur vorliegen – respektive natürlich die Selektoren sind andere.

Ich werde mir mal so einen Header jetzt setzen um zu sehen, welche Selektoren hier zu nehmen sind.

_______________

as far as I understood you, you wanted directly the search input field in the menu? – and not the magnifying glass.
Now it would have been helpful, you would have mentioned that it is the header with logo top menu below. Because here you have a completely different header structure – respectively of course the selectors are different.

I will set me times such a header now to see which selectors are to be taken here.

please have a look to that color-section with ID: #color_section
it is only visible on smaller screens – i guess you have set for it a negative padding via css. Paddings are always positive – maybe that is the reason for that sign.

then there is no color : #transparent – it is only : transparent
you set it for : .text-overlay

next: justify-content is only for flex containers ( display: flex – or inline-flex )

I support the last point, but for me a button is something with a link; but you exclude that above.

So why not just go and take a 1/5 or 2/5 column – set it (or not) with background color and put heading and text in there. Done.

______
Caution now a little bit of irony
The whole thing seems to me as if you would order a pizza quattro formaggi but without cheese but with tuna.
I call it tuna pizza ;)

by the way – searching for that old topic – : in the meantime that little orthographic mistake is gone and the animation name is now: avia_masonry_show

you have to pay attention to get the correct post type – is it events or event ( events manager plugin ) or tribe-events ( The Events Calendar Plugin ) etc.

well, your description above is not exactly that clear. After all, Button implies that something should happen. Therefore it would be good to get a more detailed description of what the “button” should be. I think we already understood that it should not change its appearance on hover or active state, but without an event it is not a button from my point of view. I would rather call that a badge.

that macosx folder comes from zipping on OSX folders with mac tools – but f.e. better zip has that option to zip for pc. All invisible files OSX generates are then excluded from zipping.

did you test that mike?
on my page it does open the fallback image.

so embedding is already possible, but just individually: https://webers-testseite.de/pdf-on-website/.
you can also set an image and enter as a manual link : …/xyz.pdf?iframe=true – that would also go into the lightbox.
yes even if you create a post, and inside ( it is enough the standard editior ) only the pdf link with ?iframe=true and the post format on “link” sets. These posts are then also displayed as Lightobox.

______

also einbetten geht schon, aber eben einzeln: https://webers-testseite.de/pdf-on-website/
du kannst auch ein Bild setzen und als manuellen link eingeben : …/xyz.pdf?iframe=true – das ginge auch in die Lightbox.
ja sogar wenn du einen Post erstellst, und innerhalb ( es reicht der standard editior ) nur den pdf link mit ?iframe=true reinsetzt und das Beitragsformat auf “Link” setzt. Diese Posts werden dann auch als Lightobox angezeigt.

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

hm – i read now on Web Storage API with Window.sessionStorage or Window.localStorage – maybe there is a way to do that this manner.
Maybe we should wait here for a developer from the team to see if there are possibilities beyond a cookie.