you have choosen for the #av_section_1 a z-index of : 200
so the z-index of the flex_columns had to be bigger. (300) next – hint
do not forget to give the outer flex_columns a background-color of #172738

so if you only like to link if there are biljetservice links on the images above the titles – then take snippet two from this link

Since my backend is in German, I always have to double-check how the elements are named in English.

if you have on all Images the link to your biljetter you can do it this way.

for styling the “buttons” you may be able to do this too:
maybe a custom class on those post-sliders would be a good idea – not to influence all post-sliders

put this to your child-theme functions.php:

function custom_entry_link(){
?>
<script>
(function($){
    $(document).ready(function(){
        $('.avia-content-slider .slide-entry').each(function() {
            var readMore = $(this).find('.read-more-link'),
                biljetterLink = $(this).find('.slide-image').attr('href'),
                biljetterButton = $('<div class="biljetter"><a href="'+biljetterLink+'" >Biljetter<span class="more-link-arrow avia-svg-icon avia-font-svg_entypo-fontello" data-av_svg_icon="right-open-big" data-av_iconset="svg_entypo-fontello"><svg version="1.1" xmlns="http://www.w3.org/2000/svg" width="15" height="32" viewBox="0 0 15 32" preserveAspectRatio="xMidYMid meet" role="graphics-symbol" aria-hidden="true"><path d="M0.416 27.84l11.456-11.84-11.456-11.904q-0.832-0.832 0-1.536 0.832-0.832 1.536 0l12.544 12.608q0.768 0.832 0 1.6l-12.544 12.608q-0.704 0.832-1.536 0-0.832-0.704 0-1.536z"></path></svg></span></a></div>');
            $(this).closest('.slide-entry').find('.entry-footer').prepend($(biljetterButton));
            $(this).closest('.slide-entry').find('.entry-footer').prepend($(readMore));        
        }); 
    });
})(jQuery);
</script>
<?php
}
add_action('wp_footer', 'custom_entry_link');

with minimal styling:

.entry-footer {
  display: flex;
  flex-flow: row wrap;
  gap: 20px;
  justify-content: flex-start;
}

it looks this way:

do these buttons have always the same link? or is it an individual link?

try Mikes Solution – did not know why the content-slider.php does not rule that – see next post

try instead:
these are the bold versions

function avia_replace_default_icons($icons){
 $icons['svg__scrolldown'] =  array( 'font' =>'svg_entypo-fontello', 'icon' => 'down-open');
 $icons['svg__prev'] =  array( 'font' =>'svg_entypo-fontello', 'icon' => 'left-open');
 $icons['svg__next'] =  array( 'font' =>'svg_entypo-fontello', 'icon' => 'right-open');
 return $icons;
}
add_filter('avf_default_icons','avia_replace_default_icons', 10, 1);

ok – but even if you like to replace those icons:

.carousel-slider.arrows-outside .owl-nav svg {
  display: none
}

.carousel-slider.arrows-outside .owl-nav .owl-prev:before,
.carousel-slider.arrows-outside .owl-nav .owl-next:before {
  font-family: 'entypo-fontello';
  font-size: 52px;
}

.carousel-slider.arrows-outside .owl-nav .owl-next:before {
  content: "\E875";
}

.carousel-slider.arrows-outside .owl-nav .owl-prev:before {
  content: "\E874";
}

now the other ones …

btw. i do not see if you have set this rule yourself ( merged styles ):

@media only screen and (min-width: 485px) and (max-width: 1023px) {
  .html_av-submenu-hidden .av-submenu-indicator {
    margin-right: 175px;
    opacity: 100% !important;
    font-weight: bold !important;
  }
}

the margin-right value causes the icon to be overlaid with the text.

or – if you like to replace it by a different svg graphic – you can do it by an uploaded graphic to media-library:

function avia_replace_default_icons($icons){
 $icons['svg__scrolldown'] =  array( 'font' =>'svg_wp-media-library', 'icon' => '50913');
 return $icons;
}
add_filter('avf_default_icons','avia_replace_default_icons', 10, 1);

change the icon ID to your file id

____________________________________________________________________________________________________
you can find the attachment-ID best in media-library list-view –
or in grid-view if you open the attachment-details ( look to the url that is opened )

or the arrow thought even more demanding ;)

:root {
  --burger-main-icon-width: 40px; /* === adjust to your needs === */
}

@media only screen and (max-width:1150px) {
  .av-hamburger {display: none}

  #header #avia-menu li.av-burger-menu-main.menu-item-avia-special,
  #top #wrap_all #header .av-small-burger-icon a:before{
    width: var(--burger-main-icon-width);  
  }
  
  #top #wrap_all #header .av-small-burger-icon a {
    display: flex; 
    justify-content: center;
    align-content: center;
    align-items: center;
  }

  #top #wrap_all #header .av-small-burger-icon a:before {
    content: "\e873";
    font-family: "entypo-fontello";
    font-size: var(--burger-main-icon-width);  
    color: var(--enfold-main-color-primary);
    text-align: center;
  }

  .av-burger-overlay-active #top #wrap_all #header .av-small-burger-icon a:before{
    font-size: calc(1.5 * var(--burger-main-icon-width));  /* === only if you like it === */
    color: #FFF;
    content: "\e877 \A \e873";
    line-height: 0.35em;
    animation: avia_fade_move_down 2s ease-in-out infinite;
  }
}

on my installation it works without any problem – if you use the webp images from media-library!
https://webers-testseite.de/webp-lightbox/

or: next suggestion – you are using a plugin that replaces jpgs by webp images ( f.e. from shortpixel – automatic calculation of jpgs to webp- and replacement in DOM )

As mentioned above

var defaults = {
	groups :	['.avia-slideshow', '.avia-gallery', '.av-horizontal-gallery', '.av-instagram-pics', '.portfolio-preview-image', '.portfolio-preview-content', '.isotope', '.post-entry', '.sidebar', '#main', '.main_menu', '.woocommerce-product-gallery'],
	autolinkElements : 'a.lightbox, a[rel^="prettyPhoto"], a[rel^="lightbox"], a[href$=jpg], a[href$=webp], a[href$=png], a[href$=gif], a[href$=jpeg], a[href*=".jpg?"], a[href*=".png?"], a[href*=".gif?"], a[href*=".jpeg?"], a[href$=".mov"] , a[href$=".swf"] , a:regex(href, .vimeo\.com/[0-9]) , a[href*="youtube.com/watch"] , a[href*="youtube.com/shorts"] , a[href*="screenr.com"], a[href*="iframe=true"]',
	videoElements  : 'a[href$=".mov"] , a[href$=".swf"] , a:regex(href, .vimeo\.com/[0-9]) , a[href*="youtube.com/watch"] , a[href*="youtube.com/shorts"] , a[href*="screenr.com"], a[href*="iframe=true"]',
	exclude  :	'.noLightbox, .noLightbox a, .fakeLightbox, .lightbox-added, a[href*="dropbox.com"], .pagination a'
},

a[href$=webp] is an autolinkElement – so there must be something that hampers this on your installation.

ok – you are right that on that icon the down-open-mini is used ! – you can change it by code snippet inside your child-theme functions.php:

function avia_replace_default_icons($icons){
 $icons['svg__scrolldown'] =  array( 'font' =>'svg_entypo-fontello', 'icon' => 'down-open');
 return $icons;
}
add_filter('avf_default_icons','avia_replace_default_icons', 10, 1);

you find those settings including the filter in init-base-data.php
there you see that the scrolldown icon is correlated with the down-open-mini svg.

charmap can be found in: charmap-svg.php

Isn’t it just a question of size? Wouldn’t specifying the width/height alone lead to the same result?
PS: in your case you are already use the svg icons. if someone uses the font-icons the snippet will be different –
and correlation is on default by:
'scrolldown' => array( 'font' => 'entypo-fontello', 'icon' => 'ue877' ),

try f.e.:

#top .scroll-down-link {
  height: 50px;
  width: 50px;
  bottom: 50px;
  background-color: rgba(255,255,255,0.3);
  border: 1px solid var(--enfold-socket-color-border);
  backdrop-filter: blur(4px);
  border-radius: 10px;
  /*** animation: none; ***/
}
#top .scroll-down-link.avia-svg-icon svg:first-child {
  height: 50px;
}

#top .scroll-down-link:hover {
  background-color: rgba(255,255,255,0.8);
}

#top .scroll-down-link svg path {
  fill: var(--enfold-main-color-primary);
}

if you do not like the animation – just get rid of the outcommenting /*** ***/