Hi,
Thank you for the feedback, from what I see on your page /angebote/ last element is centered in all languages when the sort is “ALLE” or on page load, on Windows 10 this is true in Chrome, Firefox, & Edge, so the last image is not centered only in the DE version, I didn’t find why this is other that the javascript css:

element.style {
    position: absolute;
    left: 33.2994%;
    top: 832.6px;
}

the masonry container is using float: left;
only one of the other pages you linked to shows a single item at the end and that one is set to landscape mode which takes 2/3 of the screen. If you plan on adding more items, try adding one more now and see if that helps. Also try disabling your cache plugin and any minification, I recall a multiple layer caching & minification that caused some odd masonry behavior in the past.

Best regards,
Mike

Hi,
Thank you for the feedback, I added this script to your child theme functions.php and it seems to work for both of your portfolio grid item, with the default linking or the custom linking, please check.

function portfolio_grid_content_linked() { ?>
    <script>
(function($) {
  $(".grid-content").click(function(){
      window.location = $(this).closest('.inner-entry').find("a:first").attr("href");
      return false;
  });
}(jQuery));
</script>
    <?php
}
add_action('wp_footer', 'portfolio_grid_content_linked');

Best regards,
Mike

Hi,
Glad we were able to help, if you have any further questions please create a new thread and we will gladly try to help you. Thank you for using Enfold.

Best regards,
Mike

Hi,
Thank you, glad we were able to help, if you have any further questions please create a new thread and we will gladly try to help you. Thank you for using Enfold.

Best regards,
Mike

Hey Fabian J.,
Thank you for your patience and the link to your site, when I check your page the last element is centered in all languages when the sort is “ALLE”. What is happening is the css for all of the items is set by javascript and uses absolute positioning, when the sort options are used the other items are still there in the source, just not shown, so it may look like there is one item to the left, but there is really more. Anyways I was able to put together a solution for you with this css:

.av-masonry-container:not([id]) #av-masonry-1-item-9759,
.av-masonry-container#masonry_id_all_sort #av-masonry-1-item-9759 {
	left: 0 !important;
}

it sets the last item to left zero if no sort is clicked, like on page load, and when the “ALLE” sort is clicked.

Best regards,
Mike

Hi,
Thank you for your patience, and for the login to your site, your issue was with your Quick CSS custom css, I started by removing all of your css and adding it back a little at a time, I found some errors and tried correcting them, in the end these are the two rules that seemed to be cuasing the problem:

#header .main_menu {
/*background: gold;*/
width: 100%;
left: 50%;
transform: translateX(-50%);
}

.av-main-nav-wrap {
left: 50%;
transform: translateX(-50%);
}

Please clear your browser cache and check.

For your information, this was your original css:

/* HEADER */

.navbar, .page-title-section {
display: none;
}

.inner-container {
	position: relative;
	height: 150%;
	width: 100%;
	margin-top: 0px;
}

.responsive .logo img {
	margin: 45px 0 10px 0;
}

.header-introduction-small .section-head h1 {
	letter-spacing: 0;
	font-size: 40px !important;
	font-weight: 100;
	opacity: 0.6;
	padding: 150px 0px 0px 0px;
}

#top .av-main-nav ul a {
	width: 100%;
	height: auto;
	float: left;
	text-align: left;
	line-height: 23px;
	padding: 8px 15px;
	font-size: 17px;
	min-height: 23px;
	max-width: none;
	text-decoration: none;
	font-family: inherit;
	text-transform: uppercase;
}

#top #wrap_all .av_header_transparency {
	background-color: transparent;
	color: #131313;
	border-color: #ebebeb;
}

.header_color .header_bg, .header_color .main_menu ul ul, .header_color .main_menu .menu ul li a, .header_color .pointer_arrow_wrap .pointer_arrow, .header_color .avia_mega_div, .header_color .av-subnav-menu > li ul, .header_color .av-subnav-menu a {
	background-color: #000;
	color: #fff;
}

.av-main-nav ul li:last-child > a {
	border-bottom-style: solid;
	border-bottom-width: 0px;
}

.av-main-nav ul li a {
	border-right-style: solid;
	border-right-width: 0px;
	border-left-style: solid;
	border-left-width: 0px;
}

/* BODY */

#top .av_inherit_color a {
	text-decoration: none;
}

.html_av-overlay-full #top #wrap_all #av-burger-menu-ul li a {
	color: #fff;
	line-height: inherit;
	font-size: 26px;
	font-family: 'cormorant-garamond','HelveticaNeue','Helvetica Neue','Helvetica-Neue',Helvetica,Arial,sans-serif;
	text-transform: uppercase;
}

#top #wrap_all .error .text_input, #top #wrap_all .error .text_area, #top #wrap_all .error .select {
	border: 1px solid #F00;
}

#top #wrap_all .error .input_checkbox_label {
	color: #F00;
}

.avia-cookie-consent a.avia_cookie_infolink, .avia-cookie-consent p, .avia-cookie-consent .avia-cookie-consent-button {
	display: inline-block;
	vertical-align: middle;
	font-size: 18px !important;
	letter-spacing: 0.05em;
}

.avia-button.avia-size-medium {
	font-size: 16px;
}

strong, b {
	font-weight: normal;
}

#top .av-flex-placeholder {
	display: table-cell;
	width: 1%;
}


/* FOOTER*/


/* SOCKET*/

#socket .copyright {
	float: left;
	font-size: 16px;
}

.socket_color a, .socket_color .widget_first, .socket_color strong, .socket_color b, .socket_color b a, .socket_color strong a, .socket_color #js_sort_items a:hover, .socket_color #js_sort_items a.active_sort, .socket_color .av-sort-by-term a.active_sort, .socket_color .special_amp, .socket_color .taglist a.activeFilter, .socket_color #commentform .required, #top .socket_color .av-no-color.av-icon-style-border a.av-icon-char, .html_elegant-blog #top .socket_color .blog-categories a, .html_elegant-blog #top .socket_color .blog-categories a:hover {
	color: #ffffff;
	font-size: 16px;
}



.av-main-nav > li > a {
	padding: 0 23px;
	font-size: 18px;
        text-transform: uppercase;
       font-family: 'cormorant-garamond','HelveticaNeue','Helvetica       Neue','Helvetica-Neue',Helvetica,Arial,sans-serif;
	}



 @media only screen and (min-width: 780px) {
/*In the below code nth-child(x) the value of x should be half the number of total menu items*/
#top #header .av-main-nav li:nth-child(2) {
/* Adjust the width of the logo */
margin-right:15%;
}

#top #header .av-main-nav li:nth-child(3) {
/* Adjust the width of the logo */
margin-left:15%;
}



#header .main_menu {
/*background: gold;*/
width: 100%;
left: 50%;
transform: translateX(-50%);
}

.av-main-nav-wrap {
left: 50%;
transform: translateX(-50%);
}

#header .logo {
left: 50%;
transform: translateX(-50%);
z-index:999;
}

#header .logo img {
top: 20%;
transform: translateY(-50%);
max-width: 250px;
}
}


/* Top Bar content alignment */

#top #header_meta .container {
           display: flex;
           justify-content: center;
}

#top #header_meta .sub_menu {
           top:0;
}
#top #header_meta .sub_menu,
#top #header_meta .social_bookmarks {
           align-self: center;
}

#top #header_meta .phone-info {
           order: 2;
}

#top #header_meta .phone-info span {
           display: flex;
           align-items: center;
}

#top #header_meta .sub_menu {
           order: 1;
}
#top #header_meta .social_bookmarks {
           order: 3;
}


#avia-menu {
width:1300px !important;
}

#menu-item-551 {
    margin-left: 0 !important;
}

/*fabio burger menu */
 @media only screen and (max-width: 1199px) {
#top #header .av-main-nav > li.menu-item  {
    display: none!important;
}
#top #header .av-burger-menu-main {
    cursor: pointer;
    display: block!important;
}
.container.av-logo-container .header_main_alternate .container{
left:70%!important;
}
#avia-menu {
  float: right; 
   width: auto !important;
}
}

and this is what you have now:

/* BODY */

#top .av_inherit_color a {
    text-decoration: none;
}

.html_av-overlay-full #top #wrap_all #av-burger-menu-ul li a {
    color: #fff;
    line-height: inherit;
    font-size: 26px;
    font-family: 'cormorant-garamond','HelveticaNeue','Helvetica Neue','Helvetica-Neue',Helvetica,Arial,sans-serif;
    text-transform: uppercase;
}

#top #wrap_all .error .text_input, #top #wrap_all .error .text_area, #top #wrap_all .error .select {
    border: 1px solid #F00;
}

#top #wrap_all .error .input_checkbox_label {
    color: #F00;
}

.avia-cookie-consent a.avia_cookie_infolink, .avia-cookie-consent p, .avia-cookie-consent .avia-cookie-consent-button {
    display: inline-block;
    vertical-align: middle;
    font-size: 18px !important;
    letter-spacing: 0.05em;
}

.avia-button.avia-size-medium {
    font-size: 16px;
}

strong, b {
    font-weight: normal;
}

#top .av-flex-placeholder {
    display: table-cell;
    width: 1%;
}


/* FOOTER*/


/* SOCKET*/

#socket .copyright {
    float: left;
    font-size: 16px;
}

.socket_color a, .socket_color .widget_first, .socket_color strong, .socket_color b, .socket_color b a, .socket_color strong a, .socket_color #js_sort_items a:hover, .socket_color #js_sort_items a.active_sort, .socket_color .av-sort-by-term a.active_sort, .socket_color .special_amp, .socket_color .taglist a.activeFilter, .socket_color #commentform .required, #top .socket_color .av-no-color.av-icon-style-border a.av-icon-char, .html_elegant-blog #top .socket_color .blog-categories a, .html_elegant-blog #top .socket_color .blog-categories a:hover {
    color: #ffffff;
    font-size: 16px;
}
/*fabio burger menu */
 @media only screen and (max-width: 1199px) {
#top #header .av-main-nav > li.menu-item  {
    display: none!important;
}
#top #header .av-burger-menu-main {
    cursor: pointer;
    display: block!important;
}
.container.av-logo-container .header_main_alternate .container{
left:70%!important;
}
#avia-menu {
  float: right; 
   width: auto !important;
}
}
/* Top Bar content alignment */

#top #header_meta .container {
        display: flex;
        justify-content: center;
}

#top #header_meta .sub_menu {
        top:0;
}
#top #header_meta .sub_menu,
#top #header_meta .social_bookmarks {
        align-self: center;
}

#top #header_meta .phone-info {
        order: 2;
}

#top #header_meta .phone-info span {
        display: flex;
        align-items: center;
}

#top #header_meta .sub_menu {
        order: 1;
}
#top #header_meta .social_bookmarks {
        order: 3;
}
#menu-item-551 {
    margin-left: 0 !important;
}

/* HEADER */

.navbar, .page-title-section {
    display: none;
}
    
.inner-container {
    position: relative;
    height: 150%;
    width: 100%;
    margin-top: 0px;
}

.responsive .logo img {
    margin: 45px 0 10px 0;
}

.header-introduction-small .section-head h1 {
    letter-spacing: 0;
    font-size: 40px !important;
    font-weight: 100;
    opacity: 0.6;
    padding: 150px 0px 0px 0px;
}

#top .av-main-nav ul a {
    width: 100%;
    height: auto;
    float: left;
    text-align: left;
    line-height: 23px;
    padding: 8px 15px;
    font-size: 17px;
    min-height: 23px;
    max-width: none;
    text-decoration: none;
    font-family: inherit;
    text-transform: uppercase;
}

#top #wrap_all .av_header_transparency {
    background-color: transparent;
    color: #131313;
    border-color: #ebebeb;
}

.header_color .header_bg, .header_color .main_menu ul ul, .header_color .main_menu .menu ul li a, .header_color .pointer_arrow_wrap .pointer_arrow, .header_color .avia_mega_div, .header_color .av-subnav-menu > li ul, .header_color .av-subnav-menu a {
    background-color: #000;
    color: #fff;
}

.av-main-nav ul li:last-child > a {
    border-bottom-style: solid;
    border-bottom-width: 0px;
}

.av-main-nav ul li a {
    border-right-style: solid;
    border-right-width: 0px;
    border-left-style: solid;
    border-left-width: 0px;
}
.av-main-nav > li > a {
    padding: 0 23px;
    font-size: 18px;
    text-transform: uppercase;
    font-family: 'cormorant-garamond','HelveticaNeue','Helvetica       Neue','Helvetica-Neue',Helvetica,Arial,sans-serif;
}
/* HEADER */

.navbar, .page-title-section {
    display: none;
}
    
.inner-container {
    position: relative;
    height: 150%;
    width: 100%;
    margin-top: 0px;
}

.responsive .logo img {
    margin: 45px 0 10px 0;
}

.header-introduction-small .section-head h1 {
    letter-spacing: 0;
    font-size: 40px !important;
    font-weight: 100;
    opacity: 0.6;
    padding: 150px 0px 0px 0px;
}

#top .av-main-nav ul a {
    width: 100%;
    height: auto;
    float: left;
    text-align: left;
    line-height: 23px;
    padding: 8px 15px;
    font-size: 17px;
    min-height: 23px;
    max-width: none;
    text-decoration: none;
    font-family: inherit;
    text-transform: uppercase;
}

#top #wrap_all .av_header_transparency {
    background-color: transparent;
    color: #131313;
    border-color: #ebebeb;
}

.header_color .header_bg, .header_color .main_menu ul ul, .header_color .main_menu .menu ul li a, .header_color .pointer_arrow_wrap .pointer_arrow, .header_color .avia_mega_div, .header_color .av-subnav-menu > li ul, .header_color .av-subnav-menu a {
    background-color: #000;
    color: #fff;
}

.av-main-nav ul li:last-child > a {
    border-bottom-style: solid;
    border-bottom-width: 0px;
}

.av-main-nav ul li a {
    border-right-style: solid;
    border-right-width: 0px;
    border-left-style: solid;
    border-left-width: 0px;
}

@media only screen and (min-width: 766px) {
#top #header .av-main-nav li:nth-child(2) {
/* Adjust the width of the logo */
margin-right:15%;
}
#top #header .av-main-nav li:nth-child(3) {
/* Adjust the width of the logo */
margin-left:15%;
}
#header .logo img {
top: 20%;
transform: translateY(-50%);
max-width: 250px;
}
#header .logo {
left: 50%;
transform: translateX(-50%);
z-index:999;
}
}

@media only screen and (min-width: 1200px) {
#avia-menu {
    width:1200px !important;
}
}

Best regards,
Mike

Hey Reut Rachel,
Thank you for your patience and for the login, you were missing a little code pointing to the image you wanted to use in the Quick CSS field, so I added it for you, but I was not sure which image to use so I guessed, you can check and change if you want. If you still have problems please tell us which image to use and I will change.
Please clear your browser cache and check.

Best regards,
Mike

Hi,
Sorry for the late reply and thank you for your patience and the link to your site. I believe the question now is:

Is there a way to make the menu and logo shrink to fit the screen before it finally switches to tablet/mobile menu?

and I see the switch occurs at 1449px, but at 1450px the logo and menu both seem to fit fine, please see the screenshot in the Private Content area.
There is a min-width of 90px that you could remove that would help with the smaller menu items:

.av_seperator_big_border .av-main-nav > li > a {
    min-width: 0 !important;
}

see second screenshot. There is also 13px of padding, but I don’t think you will want to remove that.
What did you have in mind?

Best regards,
Mike

Hi,
Thank you for your patience, on the demo the portfolio grid element is set to “open a preview (aka AJAX Portfolio)” but in comparing your page I notice that your portfolio item doesn’t link to a portfolio page, it is only http:// and the title doesn’t have a link either. In this screenshot your page is on to and my test page is below.

I believe the issue is that for your portfolio items you have set a custom link in the Overwrite Portfolio Link setting

Please try changing this back to the default setting.

Best regards,
Mike

Hi,
For an oversized logo like this you will need to add this css to the General Styling > Quick CSS field or in the WordPress > Customize > Additional CSS field:

.logo, .logo a {
    width: 100%;
}

Best regards,
Mike

Hi,
Thank you for your patience, if you go to Enfold Theme Options > Header > Header Layout > Header Size and choose custom pixel value you can enter your own value.

Best regards,
Mike

Hi,
Sorry for the late reply and thank you for your patience. Unfortunately, I didn’t find a way to show the video controls on a background video, but I did come up with this css to make your video element show fullscreen for mobile.
Please try this code in the General Styling > Quick CSS field or in the WordPress > Customize > Additional CSS field:

@media only screen and (max-width: 767px) {
.responsive #top.home #wrap_all #av_section_1 > .container {
    width: 100%!important;
    max-width: 100%!important;
}
.responsive #top.home #wrap_all #av_section_1 > .container > .content {
	padding: 0px !important;
}
.responsive #top.home #wrap_all #av_section_1 > .container > .content > div > div > .avia-video {
	    margin-bottom: 0 !important;
}
}

After applying the css, please clear your browser cache and check.

Best regards,
Mike

Hi,
Thank you for the feedback, in order to do this you will need several different css rules. Please try these for sizes up to 1024px:

@media only screen and (max-width: 374px) { 
#top.home #home-content-slider {
    background-size: contain !important;
}
#top.home #home-content-slider > .container {
	max-height: 140px !important;
}
#top.home #home-content-slider > .container > .content {
	padding: 0 !important;
}
#top.home #home-content-slider h3.entry-title {
	font-size: 14px !important;
}
#top.home #home-content-slider .groot {
	padding: 10px;
}
}

@media only screen and (min-width: 375px) and (max-width: 480px) { 
#top.home #home-content-slider {
    background-size: cover !important;
}
#top.home #home-content-slider > .container {
	height: 185px !important;
}
#top.home #home-content-slider h3.entry-title {
	font-size: 24px !important;
}
#top.home #home-content-slider > .container > .content {
	padding: 0 !important;
}
}

@media only screen and (min-width: 481px) and (max-width: 767px) { 
#top.home #home-content-slider {
    background-size: cover !important;
}
#top.home #home-content-slider > .container {
	height: 300px !important;
}
}

@media only screen and (min-width: 767px) and (max-width: 988px) { 
#top.home #home-content-slider {
    background-size: cover !important;
}
#top.home #home-content-slider > .container {
	height: 345px !important;
}
}

@media only screen and (min-width: 989px) and (max-width: 1024px) { 
#top.home #home-content-slider {
    background-size: cover !important;
}
#top.home #home-content-slider > .container {
	height: 420px !important;
}
}

Then clear your browser cache and check.

Best regards,
Mike

Hi,
Thank you for your patience, I have tested two of your video pages with Chrome, Firefox & Edge and they are not auto-playing, I assume that you do not have the player option: Enable Autoplay set, because in my test with this option set the video will autoplay, but you will also need to note the comment next to the setting:

Check if you want to enable video autoplay when page is loaded. Videos will be muted by default.

This is to follow the recommended browser standards and good practices, you can override this by editing the file:
\wp-content\themes\enfold\config-templatebuilder\avia-shortcodes\video\video.php on line 425 change $video_mute to zero:

You can see on my test page that this works, but I’m not sure that this will work for Safari, nor can we force it to work in all browsers in all cases, it is considered bad practice.
If this works for you and you wish to add it to your child theme, create a directory /shortcodes/video/ and copy the edited video.php there.

Best regards,
Mike

Hi,
Glad to hear that helped, your last screenshot didn’t work please try again, when I look on your homepage the Vimeo video has controls, please see the screenshot in the Private Content area.

Best regards,
Mike