.logo, .logo a {
    overflow: visible !important;
}

and – sorry Victoria – maybe this is a little more elegant:
– so get rid of :

.subtext {
    display: block;
    left: 120px;
    position: relative;
    top: -65px;
}

.header-scrolled .subtext h1 {
    font-size: 18px;
}

and instead – and maybe only for non-responsive case

@media only screen and (min-width: 768px) {
  .logo img {
    float:left
  }

  #top .logo,
  #top .logo a {
    overflow: visible !important;
  }

  #top .subtext {
    float:left;
    position:relative;
    padding-left: 18px;
    top:50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
  }

  #top .subtext .logo-title h1 {
    margin-bottom: 0;
  }

  .header-scrolled .subtext h1 {
    font-size: 18px;
    transition: all 0.3s ease
  }
}

after that we will see how to style the small screens.

best would be to include the heading font-size with shrinking amount – but that will be done only with a child-theme avia-snippet-sticky-header.js file

This here is the title of your start posting – and the title of your topic: Gallery with four thumbnails above and one big image below

On your testpage https://webers-testseite.de/4on1-flexbox-model/, you have four thumbnails in a row. But on my page, I only want to have two thumbnails in a row.

So this was described correctly but inadequately.
Also this one: “Two galleries, one above with four thumbnails and one below with one big image” doesn’t exactly lead me to assume it could be 2 rows and 2 lines. Anyway –

That my approach is not only theoretically correct but also works practically can be seen on my test page.
If you like to have the behavior of 2 small images in two rows and then one big your can see on the media-query with the 50%.
just get rid of that media query on 989px and set the first rule to :

.flex4on1 .avia-image-container {
	flex: 0 1 calc(50% - 2px);
	margin: 0 0 4px;
}

Why : on two containers there should be a distance of 4px. Both containers are set to space-between – So outer edges are left resp. right-justified. You have then for both containers a width of : (100%-4px) so each Container has a width of : (50%-2px)

on 4 images besides ( and I apologize for any inaccuracy ) you have there you have three spaces all should have 4px ( 12px )
same play: (100%-12px) each image then : (25%-3px)

I just switched my test page now to that setting – and changed the code-block content too.

I hope you can recreate my situation on your testpage and find a way to correct the vertical white space.

No i can’t – because i do not have this issue

So if something doesn’t work on your installation, i would have now to look for the reason on this page;
since I can’t do that, you will have to wait for mods.

But i guess your 50% – 4px is the reason for

• This reply was modified 8 hours, 54 minutes ago by  Guenni007.
• This reply was modified 8 hours, 22 minutes ago by  Guenni007.

ne heute nicht mehr – der Büro Rechner ist aus.
Das hier läuft alles über mein Arbeitstier: den Mac. – Da rufe ich keine E-Mails ab.

PS: ja mach mal, kann ich ja im Web-Client einloggen!

• This reply was modified 9 hours, 28 minutes ago by  Guenni007.

But the initial open setting on behavior is set to “0” ?
And the link to that page does not go to with including toggle-id like : /boligforeninger/#toggle-id-1

And why two times opening a new post on similar thing: https://kriesi.at/support/topic/change-color-text-input_checkbox_label-form-with-background/

my answer is there

since the existing rule is also set to important – we must then do the same with even more selectivity
The Link inside had to be influenced too.

#top.page-id-519 .input_checkbox_label {
  color: #fff !important;
}

#top.page-id-519 .input_checkbox_label a {
  color: #f1c20c !important;
}

And you love me too? ;) – because i’m not part of that team.

i do not see your page – but you can use the filter in this case: avf_customize_heading_settings

This filter exists in a lot of ALB Elements to change the heading tag: Link

on time line there are two possibilites to influence the date and the title
And you can even add an additional Class to these tags:
Put this to your child-theme functions.php

function my_avf_customize_heading_settings( array $args, $context, array $extra_args = array()){

// this is for the date 
  if( $context == 'avia_sc_timeline' && is_array( $extra_args ) && in_array( 'date', $extra_args ) )
  {
    $args['heading'] = 'h3';            
    $args['extra_class'] = 'custom-date-class';   
  }

// this is for the title 
  if( $context == 'avia_sc_timeline' && is_array( $extra_args ) && in_array( 'title', $extra_args ) )
  {
    $args['heading'] = 'h2';            
    $args['extra_class'] = 'custom-title-class';   
  } 
  
  return $args;
}
add_filter( 'avf_customize_heading_settings', 'my_avf_customize_heading_settings', 10, 3 );

add this to the whole code:

.flex4on1::before,
.flex4on1::after {
    display: none !important;
}

i had to see your site ! – no images

are your images the same size! if they got different aspect ratio it will be nearly impossible to get that result.
You can see my testpage that it works on all screen width.
otherwise look for a mod

Next Question: these are only images ( with maybe a link to lightbox or other pages) ?
It must be a masonry effect? ( Masonry Gallery ALB Element ) ?

This is a different approach.
The Masonry Containers are a list of anchor elements.
Anchors are always block-level element.
https://webers-testseite.de/4on1-flexbox-model/

PS: Du kannst natürlich auch jedem slide einen Link geben!

you have set on your css :

.entry-content-wrapper div li {
    text-indent: 0;
    position: relative;
    left: 20px;
}

this influences the slideshow li’s too. because the images are in li containers the whole slideshow is an unordered list !

but on the slideshow they had to be in an absolute positioning

so get rid of that code – and style your list with :

.avia_textblock li {
    padding-left: 20px;
    list-style: inside;
}

that shifts your list on the left a bit more to the right.

well first it is not the enfold silder : soliloquy-slider
guess it is hard to say from the team here.

why don’t you use the Enfold Simple Slider instead?
You can have a very similiar Outlook of that
I wouldn’t make such a long list as in slider 1 but you can style it like slider 2 on my example:
https://webers-testseite.de/simple-slider/

____________
Die Anpassung für den Caption Hintergrund sage ich dir dann wenn du es übernehmen möchtest.
ich nehme mir mal kurz deine Bilder raus und setze Sie ein. Dann kannst du vergleichen.
du sparst dir dadurch das laden eines zusätzlichen Plugins, welches überhaupt nicht nötig ist. Das bringt auch Performance Vorteile.
Die Bilder ersetze ich dann sobald du es gesehen hast.

• This reply was modified 2 days, 9 hours ago by  Guenni007.
• This reply was modified 2 days, 9 hours ago by  Guenni007.

just a bit like this on both:

#top .social_bookmarks {
  margin: 0;
}

.fallback_menu + .social_bookmarks {
  padding-left: 9px;
}

#header_main::before {
    content: '';
    position: absolute;
    left: auto;
    top: 50%;
    transform: translateY(-50%);
    background-color: #fff;
    border: 14px solid #d1b1a7; 
}

#header_main::before {
    width: 145px;
    height: 40px; 
    right: 5px;
}

@media only screen and (max-width:767px) {
    #header_main::before {
      width: 140px;
      height: 30px; 
      right: 20px;
    } 
}

@media only screen and (max-width:479px) {
    #header_main::before {
      width: 50px;
      height: 30px; 
      right: 5px;
    } 
}