Text crossing into a picture

Hey carstenstrandvad,

I think the layout can be done with Enfold but would need some css tweaks to do it.
You need to enable first custom css class first by going to Enfold > Layout Builder > check Show element options for developers.
Then create 2 1/2 column for the image and text, then give us a link to the page you created so we can check further.
You can post the link in private content, so only the moderators can view it.

Best regards,
Nikko

Hi carstenstrandvad,

Try adding this css code in QUick CSS (located in Enfold > General Styling):

.home #after_full_slider_1 .flex_column.av_one_half.first {
    position: relative;
    z-index: 20;
}

.home #after_full_slider_1 .flex_column.av_one_half.first .av-special-heading {
    margin-left: 28% !important;
    margin-top: 80px !important;
    text-align: right;
}

Hope it helps :)

Best regards,
Nikko

Hi carstenstrandvad,

Can you try replacing this code I gave:

.home #after_full_slider_1 .flex_column.av_one_half.first .av-special-heading {
    margin-left: 28% !important;
    margin-top: 80px !important;
    text-align: right;
}

with this:

.home #after_full_slider_1 .flex_column.av_one_half.first .av-special-heading {
    margin-left: 14% !important;
    margin-top: 80px !important;
    text-align: right;
}

then add this css code also:

.home #after_full_slider_1 .flex_column.av_one_half.avia-builder-el-last .avia-image-container {
    margin-left: -14%;
}

@media only screen and (max-width:1024px) {
  .home #after_full_slider_1 .flex_column.av_one_half.first .av-special-heading h1 {
    font-size: 47px !important;
  }
}

@media only screen and (max-width:959px) {
  .home #after_full_slider_1 .flex_column.av_one_half.first .av-special-heading {
    margin-left: 0 !important;
    margin-top: 30px !important;
    width: 125%;
  }

  .home #after_full_slider_1 .flex_column.av_one_half.first .av-special-heading h1 {
    font-size: 42px !important;
  }

  .home #after_full_slider_1 .flex_column.av_one_half.avia-builder-el-last .avia-image-container {
    margin-left: 0;
  }
}

@media only screen and (max-width:767px) {
  .home #after_full_slider_1 .flex_column.av_one_half.first .av-special-heading {
    width: 100%;
  }
}

Let us know if this helps. :)

Best regards,
Nikko