Hi,

We replied here: https://kriesi.at/support/topic/popup-missing-form/#post-1480177

Best regards,
Ismael

Hi!

Thank you for the update.

Try adjusting the margin of the iframe container to align it to the center.

#top .mfp-iframe-scaler {
    width: 60%;
    margin: 0 auto;
}

View post on imgur.com

Cheers!
Ismael

Hey Loveronika,

Thank you for the inquiry.

We set the first row to have an equal height so it’s the same as the next rows. We also removed the custom top and bottom margins.

View post on imgur.com

If you need to adjust the spacing on mobile view, please add this css code:

@media only screen and (max-width: 767px) {

  /* Add your Mobile Styles here */
  #top .flex_column_table.av-equal-height-column-flextable:not(:first-child) {
    margin-top: 0;
  }
}

Best regards,
Ismael

Hi,

We adjusted the css code and added another for mobile view.

@media only screen and (min-width: 768px) {

  /* Add your Desktop Styles here */
  #top .av-m8dhdoo2-9be497766191be21636491354eb51ed0 .avia-content-slider-inner {
    max-height: 180px !important;
    overflow: hidden;
  }
}

@media only screen and (max-width: 767px) {

  /* Add your Mobile Styles here */
  #top .av-m8dhdoo2-9be497766191be21636491354eb51ed0 .avia-content-slider-inner .slide-entry {
    max-height: 115px !important;
    overflow: hidden;
  }
}

View post on imgur.com

Best regards,
Ismael

Hi,

Thank you for the screenshot.

Looks like you managed to add spacing above the button with this css code.

#package-section .avia-button-wrap {
    padding-top: 3.5em !important;
    padding-bottom: .2em !important;
}

View post on imgur.com

Best regards,
Ismael

Hey nicolealbaek,

Thank you for the inquiry.

There is no overlay option for the Column element, but you can apply a background in the Styling > Background panel. For the gradient effect, you can use the Color Section element, toggle the Styling > Background Overlay > Enable Overlay? option, then apply the class name “av-custom-gradient-section” in the Advanced > Developer Settings > Custom CSS Class field. Add this code to override the default overlay color with a gradient.

#top #wrap_all .avia-section.av-custom-gradient-section {
  background-color: transparent;
  background-image: linear-gradient(180deg, #FFFFFF21 23%, #FFCBA4 93%);
  opacity: 1;
  transition: background 0.3s, border-radius 0.3s, opacity 0.3s;
}

Best regards,
Ismael

Hi,

Thank you for the info.

You can add this css code to adjust the padding around the menu button:

#top #wrap_all #header #menu-item-848 {
    padding: 0 20px;
}

You may need to toggle or temporarily disable the Enfold > Performance > File Compression settings, then purge the cache afterward.

View post on imgur.com

Best regards,
Ismael

Hi,

What is the screen resolution of your laptop? If it has a lower screen resolution, you could decrease the max-width value, then adjust the Enfold > General Layout > Maximum Container Width. Make sure to purge the cache or remove the browser history before checking.

Best regards,
Ismael

Hi,

Thanks for the update. Please let us know if you should need any further help on the topic, or if we can close it.

Best regards,
Rikard

Hey WorldinColor,

Thank you for the inquiry.

You can add this css code to adjust the space between the iconbox icon and title:

#top .av-m868o6fq-2209228544dca5bbf34baf8f38fdb81c .iconbox .iconbox_content_title {
    margin-top: 50px;
}

Best regards,
Ismael

Hi,

You can try this css code to adjust the display of the header on mobile view:

@media only screen and (max-width: 767px) {

  /* Add your Mobile Styles here */
  .responsive #header_main .container {
    height: 130px !important;
  }

  #top .avia_search_element.av-m8j6ucsp-f1ed25db4fcf2e1d4ba1dd7653626aed #s.av-input-field {
    line-height: 33px;
    height: 33px;
    color: #bed028;
    font-size: 14px;
  }

  #top #searchform_element {
    margin-bottom: 0;
  }

  #top .avia-section.av-m8h8o2m6-a6ff6f0926c56ce5cb244fa93948b320 {
    background-color: transparent;
    background-image: unset;
    margin-top: 5px;
    margin-bottom: 0px;
    position: absolute !important;
    margin-top: 0;
    z-index: 5000;
    margin-top: -40px;
  }

  #top .av-main-nav-wrap ul {
    margin: 0;
    padding: 0;
  }
}

View post on imgur.com

Best regards,
Ismael

Hey ilona-l,

Thank you for the inquiry.

We are not yet sure why the slider resizes like that, but to temporarily adjust it, we added this css code:

#top .av-m8dhdoo2-9be497766191be21636491354eb51ed0 .avia-content-slider-inner {
  max-height: 180px !important;
  overflow: hidden;
}

Please make sure to purge the cache before checking.

Best regards,
Ismael

Hey hisdi,

Thank you for the inquiry.

You can start with this css code:

.html_header_top.html_header_sticky #header {
    max-width: 1310px;
    left: 50%;
    transform: translateX(-50%);
}

#main, .avia-msie-8 .av_header_sticky_disabled#header {
    background-color: #000000;
}

.html_header_top.html_header_sticky #main {
    padding-top: 0;
}

View post on imgur.com

Best regards,
Ismael

Hi,

As mentioned above, background videos are disabled on mobile views by default. We are not sure how you managed to keep the slider video on mobile view, but for the other page, you can try this css code:

.avia_mobile #top .av-section-mobile-video-disabled .av-section-video-bg {
    display: block;
}

Best regards,
Ismael

Hey northorie,

Thank you for the inquiry.

The space is due to the padding of the first cell in the grid row. To hide this space, try using this css code:

@media only screen and (max-width: 767px) {

  /* Add your Mobile Styles here */
  .responsive #top #wrap_all .av-1v2pat2-53d1a210d34319a1e3263b9b4acfe09f .av-1tepg6e-5d320ae52f7edb1070659a131dbdac1d {
    display: none;
  }
}

Best regards,
Ismael

Hi,

Thanks for the update. Please let us know if you should need any further help on the topic, or if we can close it.

Best regards,
Rikard