Hey goch,
Please try this code in the General Styling ▸ Quick CSS field or in the WordPress ▸ Customize ▸ Additional CSS field:

.single-product .av-woo-purchase-button > .product_meta {
	display: none;
}

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

Best regards,
Mike

Hi,
Thank you for sharing your solution, hopefully this will help other users.
If you have any further solutions or questions please feel free to create a new thread and we will gladly try to help you. Thank you for using Enfold.

Best regards,
Mike

Hi,
Please try as I have described above.

Best regards,
Mike

Hey ryhan,
I have compared your staging site and your live site and I don’t see any difference, but I do note that your live site is not up-to-date, it is using Version: 4.8.6.2
so if you moved the header from your staging site which is using Version: 4.9.2 to your live site that could be the issue, please update your live site.

Best regards,
Mike

Hey nicoletaenache00,o
Thanks for the login, you had the Disable jQuery Migrate option disabled in Enfold Theme Options ▸ Performance ▸ Change WordPress defaults jQuery Migrate needs to be active, I enabled, please check.

Best regards,
Mike

Hey Marco,
Thank you for your question, you can not have an auto-playing video with sound, the video must have the sound off or not auto-play. This rule has been put in place by the major browsers, Safari & Chrome, and we follow it.
Some plugins try to hack around this and the browsers try to break these with each update, so you could try one of these, but it is outside our support.
You could also try using the layerslider with a video in it, at one time this worked, but note that eventually it will not.

Best regards,
Mike

Hi,
Thank you for the link to your site, to move the cart to the topbar Try adding this code to the end of your functions.php file in Appearance ▸ Editor:

function custom_script() { ?>
    <script>
(function($){
  $( ".cart_dropdown" ).appendTo( "#header_meta .container" );
  $( ".cart_dropdown_link" ).css({'line-height':'unset'});
})(jQuery);
</script>
    <?php
}
add_action('wp_footer', 'custom_script');

the expected result for desktop is:

and for mobile is:

to hide the search icon for mobile try this code in the General Styling ▸ Quick CSS field:

@media only screen and (max-width: 767px) { 
	#header_main #menu-item-search {
		opacity: 0;
	}
}

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

Best regards,
Mike

Hi,
Glad Nikko was 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,
The script above should work correctly for mobile only, just use this css instead of the css above:

@media only screen and (max-width: 767px) { 
#header_meta.sticky-top {
	position:fixed!important;
	top:0!important;
	z-index:10000!important;
	width: 100%;
}
}

Then clear your browser cache and check.

Best regards,
Mike

Hi,
Thanks for the screenshot, but when I checked on Windows in Chrome, Firefox, & Edge the icons showed for me, try clearing your browser cache, if you are using Safari follow these steps for Safari and note step 4 where you will Clear the History.

Best regards,
Mike

Hi,
To make the background images full height add height: 100%; to the .image-main img rule.
For mobile the original site changed the orintaion from vertical to horizontal to add this to your example replace the css above to this:

@media (max-width:989px) {
	.nav-mainarea {
		max-height: 100vh;
	}
    .nav-mainarea .nav-mainarea-item {
        width:100%;
        max-height: 25vh;
        padding-left: 30px
    }
    .nav-mainarea .nav-mainarea-item:hover .nav-mainarea-text {
        transform: translateX(15vw)
    }
}
@media (min-width: 990px) {
	.nav-mainarea .nav-mainarea-item {
    width: 25%;
    height: 100%;
    padding: 30px;
	}
	.nav-mainarea .nav-mainarea-item:hover .nav-mainarea-text {
    transform: translateY(-45vh);
    
}
}
.nav-mainarea {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    display: flex;
    flex-wrap: wrap;
    z-index: 100;
}
.nav-mainarea .nav-mainarea-item {
display: flex;
    transition: all .3s ease-out;
    border-right: 1px solid rgba(255,255,255,.5);
    text-decoration: none;
}

.nav-mainarea .nav-mainarea-item .nav-mainarea-text {
    margin-top: auto;
    color: #000;
    transition: all .3s ease-out;
}
.nav-mainarea .nav-mainarea-item h2 {
    margin: 0;
    line-height: 1.6;
    color: #ca0202;
}

.nav-mainarea .nav-mainarea-item:hover {
    text-decoration: none;
}

#top.page-id-3157 #av_section_1 > .container {
	max-width: 2500px;
	width: 100%;
	padding: 0;
}
.image-main img {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    display: none;
    opacity: 0;
    z-index: 1;
    object-fit: cover;
    object-position: center;
    width: 100%;
    height: 100%;
}
.image-main img.is-visible {
    opacity: 1;
    z-index: 1;
    display:block;
}
.fade-in-image {
  animation: fadeIn 3s;
  -webkit-animation: fadeIn 3s;
  -moz-animation: fadeIn 3s;
  -o-animation: fadeIn 3s;
  -ms-animation: fadeIn 3s;
}
@keyframes fadeIn {
  0% {opacity:0;}
  100% {opacity:1;}
}

@-moz-keyframes fadeIn {
  0% {opacity:0;}
  100% {opacity:1;}
}

@-webkit-keyframes fadeIn {
  0% {opacity:0;}
  100% {opacity:1;}
}

@-o-keyframes fadeIn {
  0% {opacity:0;}
  100% {opacity:1;}
}

@-ms-keyframes fadeIn {
  0% {opacity:0;}
  100% {opacity:1;}
}

Best regards,
Mike

Hi,
Glad Guenni007 was 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,
Thanks for the feedback I added a fadeIn keyframe set to 3 seconds to the code below, please give this a try.

<script>
window.addEventListener('DOMContentLoaded', function() {
(function($){
$('.image-main .nav-mainarea-item').bind('mouseover', function(){
    var myEm = $(this).attr('data-img');
    $('.image-main img').removeClass('is-visible');
    $('.image-main img[data-img = '+myEm+']').addClass('is-visible');
});
})(jQuery);
 });
</script>
<style>
.nav-mainarea {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    display: flex;
    flex-wrap: wrap;
    z-index: 100;
}
.nav-mainarea .nav-mainarea-item {
display: flex;
    transition: all .3s ease-out;
    width: 25%;
    height: 100%;
    border-right: 1px solid rgba(255,255,255,.5);
    padding: 30px;
    text-decoration: none;
}
.nav-mainarea .nav-mainarea-item .nav-mainarea-text {
    margin-top: auto;
    color: #000;
    transition: all .3s ease-out;
}
.nav-mainarea .nav-mainarea-item h2 {
    margin: 0;
    line-height: 1.6;
    color: #ca0202;
}
.nav-mainarea .nav-mainarea-item:hover .nav-mainarea-text {
    transform: translateY(-45vh);
    
}
.nav-mainarea .nav-mainarea-item:hover {
    text-decoration: none;
}

#top.page-id-3157 #av_section_1 > .container {
	max-width: 2500px;
	width: 100%;
	padding: 0;
}
.image-main img {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    display: none;
    opacity: 0;
    z-index: 1;
    object-fit: cover;
    object-position: center;
    width: 100%;
}
.image-main img.is-visible {
    opacity: 1;
    z-index: 1;
    display:block;
}
.fade-in-image {
  animation: fadeIn 3s;
  -webkit-animation: fadeIn 3s;
  -moz-animation: fadeIn 3s;
  -o-animation: fadeIn 3s;
  -ms-animation: fadeIn 3s;
}
@keyframes fadeIn {
  0% {opacity:0;}
  100% {opacity:1;}
}

@-moz-keyframes fadeIn {
  0% {opacity:0;}
  100% {opacity:1;}
}

@-webkit-keyframes fadeIn {
  0% {opacity:0;}
  100% {opacity:1;}
}

@-o-keyframes fadeIn {
  0% {opacity:0;}
  100% {opacity:1;}
}

@-ms-keyframes fadeIn {
  0% {opacity:0;}
  100% {opacity:1;}
}
</style>

<div class="image-main">
<img class="nav fade-in-image is-visible" data-img="1" src="../wp-content/uploads/2022/03/PhotoRag_Metallic_Mood.jpg">
<img class="nav fade-in-image" data-img="2" src="../wp-content/uploads/2022/03/RS171_Hahnemuehle__3_-lpr.jpg">
<img class="nav fade-in-image" data-img="3" src="../wp-content/uploads/2022/03/Hahnemuehle_Notebook_Iconic_A5_Schwarz-black_and_taupe_mood_web.jpg">
<img class="nav fade-in-image" data-img="4" src="../wp-content/uploads/2022/03/hfa_filtration.jpg">

<div class="nav-mainarea">                                 
    <a class="nav-mainarea-item nav" data-img="1" href="#">
        <div class="nav-mainarea-text">
            
                    <h2>Digital FineArt</h2>
                
            Turning images into Art
        </div>
    </a>

    <a class="nav-mainarea-item nav" data-img="2" href="#">
        <div class="nav-mainarea-text">
            
                    <h2>Artist Papers</h2>
                
            The Art of Expression
        </div>
    </a>

    <a class="nav-mainarea-item nav" data-img="3" href="#">
        <div class="nav-mainarea-text">
            
                    <h2>Stationery</h2>
                
            Notebooks & Writing Instruments
        </div>
    </a>

    <a class="nav-mainarea-item nav" data-img="4" href="#">
        <div class="nav-mainarea-text">
            
                    <h2>Filtration</h2>
                
            Technical Applications
        </div>
    </a>             
</div>
</div>

Best regards,
Mike

Hi,
Glad Rikard could 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,
Glad Nikko was 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