Hi,

Thank you for the inquiry.

You may need to remove the css rules that define specific dimension to the video on different screens sizes such as this:

.bheAnimation {
    background-color: #fff !important;
    width: 807px !important;
    height: 504px !important;
}

Then, try to add this to make sure that the whole video is visible within the container:

#top .avia-video .mejs-container, #top .avia-video .mejs-container video {
    object-fit: contain;
}

This might create black spaces around the video.

Best regards,
Ismael

Hi,

Thank you for the info.

The breadcrumb container is present but is being covered by the header. Try to add this css code to adjust the top padding of the main container.

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

  /* Add your Mobile Styles here */
  .html_header_top.html_header_sticky #top #wrap_all #main {
    padding-top: 65px !important;
  }
}

(removed screenshot)

Best regards,
Ismael

Hey fanlokbun,

Thank you for the inquiry.

We should be able to define a different color for the menu on a specific page using css. Please provide a link to the page where you need a different menu color so we can inspect it.

Best regards,
Ismael

Hi,

Thank you for the update.

The site is still using an older version of the theme. It’s possible that the automatic update is no longer working as expected. You may need to download the latest version (7.0.1) from your ThemeForest account and update the theme manually via FTP. Please check the documentation below for more info.

— https://kriesi.at/documentation/enfold/theme-update/#update-via-ftp

Best regards,
Ismael

Hey melanie308,

Thank you for the inquiry.

Have you tried moving the button element inside the column where the PASSOVER SERVICE SCHEDULE is located? To increase the number of columns, try to use the 1/3 Column element.

Best regards,
Ismael

Hi,

Thank you for the screenshot.

You may need to disable the parallax effect and set the Background Repeat to “Scale to Fit” to make sure that the entire image is visible within the background positioning area.

Best regards,
Ismael

Hi,

Looks like the nav animation doesn’t run on mobile view, rendering it invisible. Try to include this css code:

.responsive #top #wrap_all .av-flex-cells .avia-slideshow-arrows a {
    opacity: 1;
}

Best regards,
Ismael

Hey rixi,

Thank you for the inquiry.

You can try this css code:

#top #wrap_all .social_bookmarks li {
    color: #000;
    background-color: #fff !important;
}

#top #wrap_all .social_bookmarks li a {
    color: #000;
}

Screenshot: https://imgur.com/cCzmGAe

Best regards,
Ismael

Hey PFreimann,

Thank you for the inquiry.

Looks like the milestone title has been placed in the date field. Please move the title of the milestones to the correct field to keep it visible on mobile view. We also recommend creating another milestone element specifically for mobile view with Styling > General Styling > Milestone Placement set to Left or Right, not Alternate. You can use the Advanced > Responsive > Element Visibility settings to control the display of the elements on different screen sizes.

Best regards,
Ismael

Hi,

Glad to know it’s working. Yes, you can use it with the Grid Row element, but you may need to adjust the css a bit.

#top #wrap_all .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;
}

To apply different gradient colors, add another Custom CSS Class name to the element, such as “av-custom-gradient-section av-gradient-black-to-white” or “av-custom-gradient-section av-gradient-red-to-white”, then specify the gradient with this css:

#top #wrap_all .av-gradient-black-to-white {
  background: rgb(0,0,0);
  background: linear-gradient(0deg, rgba(0,0,0,1) 0%, rgba(255,255,255,1) 65%);
}

#top #wrap_all .av-gradient-red-to-white {
  background: rgb(255,0,0);
  background: linear-gradient(0deg, rgba(255,0,0,1) 0%, rgba(255,255,255,1) 65%);
}

You can use this tool to generate the gradient CSS properties: https://cssgradient.io/

To apply a background image with a gradient, you’ll need to use the Color Section element. As instructed above, you need to enable the color overlay.

Best regards,
Ismael

Hi,

That is possible, but it would require significant modifications to the theme, which is beyond the scope of support. You may need to hire a freelance developer or contact someone on Codeable.

— https://kriesi.at/contact/customization

You can try overriding the avia_woocommerce_overwrite_catalog_ordering function in the enfold/config-woocommerce/config.php file.

Best regards,
Ismael

Hi,

We adjusted the css code in the Quick CSS field. Please make sure to purge the cache before checking the page.

View post on imgur.com

Best regards,
Ismael

Hey bensondesign,

Thank you for the inquiry.

Did you override the footer.php or header.php file in the child theme? Please make sure the template files are updated and using the latest version from the parent theme. Let us know the result.

Best regards,
Ismael

Hey hisdi,

Thanks for reaching out.

You can add this css code to adjust the position of the scroll down arrow:

#top .scroll-down-link {
    bottom: 100px;
    margin: 0;
}

#top .av-section-color-overlay-wrap {
    position: relative;
}

Best regards,
Ismael

Hey tdatalab,

Thank you for the inquiry.

Have you tried adding the Product Category widget in the Appearance > Widgets panel? Please provide a link to the product page so we can check it. To upload a screenshot, you can use platforms like Savvyify, Imgur or Dropbox.

Best regards,
Ismael