Hi,
The margin top set to -200 is what is making that bottom section riding up and over the slider.
The tablet views show the changed code, but not the phone view.
It being hard to read, may have to do with too much text for the small screens?
How do you feel about changing the size of the slider?

Best regards,
Mike

Hi,
To put the line behind, try this:

#top .av_header_transparency #header_meta {position: relative!important; z-index: -1 !important; }

Not sure what to do with the mobile view (425px)

Best regards,
Mike

Hey Goedkoopvervoeren,
I added this to your css:

.flex_column_table.av-equal-height-column-flextable {margin-top: -100px!important; }

and turned your grid rows into columns to show your background image. Hope you like it.

Best regards,
Mike

Hey HB-2015,
Have you already added the google font? https://kriesi.at/support/topic/new-custom-font/

Best regards,
Mike

Hey Tima,
The S2member plugin has many of these options, you can see the difference in the free and pro edition, https://s2member.com/
We don’t have a compatibility chart for plugins, so we can only say to try it.
On the most part, your project sounds like it is going to need some customization to bring it all together, since it’s not a very typical project. We can recommend Enfold customization here

Best regards,
Mike

Hi,
Glad we were able to help, we will close this now. Thank you for using Enfold.

Best regards,
Mike

Hi,
Can you see if the flex column has a top padding set to -160px?

To address the slider, Try this code in the General Styling > Quick CSS field:

@media only screen and (max-width: 767px){
#top .avia-slideshow-button {
    margin-top: -20px!important; 
}
}
@media only screen and (max-width: 1020px) and (min-width: 767px) { 
.avia-caption-title {font-size: 22px !important; }
.avia-caption-content {font-size: 14px !important; }
.slideshow_caption {padding: 10px !important; }
.slideshow_inner_caption {width: 150% !important; }
}

@media only screen and (min-width: 1021px) { 
.slideshow_caption {padding: 10px !important; }
.slideshow_inner_caption {width: 150% !important; }
}

Please clear your cache :)

Best regards,
Mike

Hi,
I believe this was due to the single 1/2 column at the top of tab 2, but try this code in the General Styling > Quick CSS field:

.avia-builder-el-18.av_one_half {
    margin-left: 0px !important;}

Best regards,
Mike

Hey julianyoung,
Please include the url to the page in question so we can take a closer look, have you tried disabling your plugins since the update to see if that was also an issue?

Best regards,
Mike

Hi,
Try this code in the General Styling > Quick CSS field:

.html_header_transparency #top .avia-builder-el-0 .container {padding-top: 0px!important; }

Best regards,
Mike

Hi,
Try this code in the General Styling > Quick CSS field:

.page-id-236 .form-row-first {float: none!important; }

Please clear your cache :)

Best regards,
Mike

Hey yaelbar,
Sorry, It is not possible to display add thumbnails that appear when hovering, Please feel free to request – or vote if already requested – such feature on Enfold feature request form.

Best regards,
Mike

Hi,
Glad we were able to help, we will close this now. Thank you for using Enfold.

Best regards,
Mike

Hi,
It’s working now, Please clear your cache :)
I added a missing curly bracket in your css for a different rule.

Best regards,
Mike

Hey Neverlands,
Try disabling your plugins. If that resolves the issue, reactivate each one individually until you find the cause.

Best regards,
Mike