Hi,

Great, glad we could help :-)

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

Best regards,
Rikard

Hi,

Please add following code to Quick CSS in Enfold theme options under General Styling tab

#top #wrap_all .av-social-link-snapchatghost:hover a {
    background-color: yellow;
    color: #555555;
}

I can see both Snapchat and Instagram icons just fine :)

Best regards,
Yigit

Hi Martin,

Great, glad we could help. Please let us know if you should need any further help on the topic or if we can close it.

Best regards,
Rikard

Hi,

Please change the code to following one

@media only screen and (max-width: 767px) {
.responsive #top .avia-slideshow-controls a {
    display: block;
    top: 50%;
}}

Best regards,
Yigit

Hi,

Glad we could help :-)

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

Best regards,
Rikard

Hi @havi,

Glad you found the thread useful, please contribute if you should have any additional information on the topic.

Best regards,
Rikard

Hi,

Great, glad we could help. Please let us know if you should need any further help on the topic or if we can close it.

Best regards,
Rikard

Hey mleite1,

Please try the following in Quick CSS under Enfold->General Styling:

@media only screen and (max-width: 767px) {
.responsive #header .social_bookmarks li {
  border-color:yellow !important;
}
.responsive #top #header_meta .social_bookmarks li a {
  background: purple !important
}
}

Best regards,
Rikard

• This reply was modified 8 years, 10 months ago by Rikard.

Hi,

Glad we could help. Please let us know if you should need any further help on the topic or if we can close it.

Best regards,
Rikard

Hi,

Thank you for the update.

Please replace the css code with the following.

#top .av-related-style-full .av-related-title, #top .av-related-style-full .related-excerpt {
    display: block;
    position: relative;
    top: -20px;   
}

#top .av-related-style-full .related-excerpt {
    color: #444444;
    font-size: 13px;
    line-height: 140%;
    padding: 5px 15px;
}

Best regards,
Ismael

Hi,

Please adjust the top position.

#bonuses .av-styling-no-styling .avia_image {
   top: 300px;
   -webkit-transition: all 0.5s;
   transition: all 0.5s;
}

And then add this code in the functions.php file:

// image position adjustment
function ava_custom_script_mod(){
?>
<script>
(function($){
	function a() {
			var image  = $('#bonuses .av-styling-no-styling .avia_image'),
					pos    = image.scrollTop() + 100,
					win    = $(window).scrollTop();
			
			if(win >= pos) {
					image.css('top', '100px');
			} else {
					image.css('top', '300px');
			}
			
	}

	$(window).on('scroll load', function() {
			a();
	});
})(jQuery);
</script>
<?php
}
add_action('wp_footer', 'ava_custom_script_mod');

Best regards,
Ismael

Hi,

Great, please let us know if you should need any further help on the topic or if we can close it.

Best regards,
Rikard

Hey emanuelecocchiaro,

Thank you for using Enfold.

1.)What are the sizes of the images? The lightbox is small because the images are too small.

2.) Please use the following css code to adjust the width and font size of the image and content container.

.portfolio-preview-image {
    width: 50%;
}

.portfolio-preview-content {
    width: 50%;
}

#top .fullsize .template-blog .post .entry-content-wrapper {
    text-align: justify;
    font-size: 1em;
    line-height: 1.7em;
    max-width: 800px;
    margin: 0 auto;
    overflow: visible;
}

Best regards,
Ismael

Hi,

Please remove the previous css modification then add the following code.

@media only screen and (max-width: 1024px) {
    .responsive #top .container .av-content-small, .responsive #top #wrap_all .flex_column, .responsive #top #wrap_all .av-flex-cells .no_margin {
        margin: 0;
        margin-bottom: 20px;
        width: 100%;
    }
}

The css code above should increase the width of the columns on tablet view same as the phone view.

Best regards,
Ismael

Hi,

Great, glad you got it working :-)

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

Best regards,
Rikard

Hey foveaworks,

Thank you for using Enfold.

Please edit the js > avia.js file, look for the “avia_smoothscroll” function and find this code around line 792.

shrink	= $('.html_header_top.html_header_shrinking').length,  

Add the following code underneath.

 sticky  = $('.html_header_sticky').length,

And then look for this code.

if(frame.length){
	fixedMainPadding += frame.height();
}

Append this one.

if(sticky) {
	fixedMainPadding -= $header.height();
}

The modification should adjust the scrolling position if sticky header is enabled.

Best regards,
Ismael

Hi,

Glad we could help :-)

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

Best regards,
Rikard

Hi,

Great, glad you got it working and thanks for letting us know. Please let us know if you should need any further help on the topic or if we can close it.

Best regards,
Rikard