Hi,
Thank you I found that the login token is now working so I checked your site and disabled your Enfold Theme Options > Performance > JS & CSS file merging and compression and enabled your Enfold Theme Options > Performance > Delete old CSS and JS files, and this seems to have solved the issue, please clear your browser cache and check.

Best regards,
Mike

Hi,
Thank you for the feedback, I found the “over 40” section near the bottom on mobile, so the words “Modeling Shoots” are in a span together, so it would be hard to break the words, but we can change the “display” to “block” which will put this in a new line under “over 40” and centered.
Please see the screenshot in the Private Content area.
Please try this code in the General Styling > Quick CSS field or in the WordPress > Customize > Additional CSS field:

@media only screen and (max-width: 767px) { 
#av-layout-grid-2 > div.flex_cell.avia-builder-el-last > div > div > strong > span:nth-child(3) {
	display: block !important;
}
}

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

Best regards,
Mike

Hi,
Glad to hear this hepled.
In the theme styling, the “bold” tag and the “strong” tags are set to different colors, generally, the “bold” tag is the legacy of “strong” but apparently now it is also considered for seo
While the css solution above will adjust the color, perhaps you should manually correct the tags?

Best regards,
Mike

Hi,
Thank you for the feedback, I was able to test your page on a Mac with Safari v14.0.0.1 in developer mode as an iPad, I realize that the width in the css above is incorrect so I changed to 1024px, now the css is working, please check.

@media only screen and (max-width: 1024px) {
.avia-safari #top .avia-full-stretch{
background-attachment: scroll !important;
}
}

Best regards,
Mike

Hi,
Freut mich zu hören, dass Guenni helfen konnte, danke Guenni. 🙂
Sollen wir dies dann schließen, es sei denn, wir können Ihnen in dieser Angelegenheit weiterhelfen?

— Translated with Google —

Glad to hear that Guenni was able to help, thank you Guenni. 🙂
Unless there is anything else we can assist with on this issue, shall we close this then?

Best regards,
Mike

Hi,
Glad this helped, in your shortcode above I don’t see a custom ID or class for the whole color section, adding one could help you apply the style to it easier across your whole site.

Best regards,
Mike

Hi,
Thank you for the link to your page and explaining the situation, based on this I found that your H2 headings are not created the same. For example the H2 “WordPress Development” is a “strong” tag, where the “Shopify & E-Commerce” is a “bold” tag, these are styled differently.
Instead of correcting your tags you could use this css in the Quick CSS field:

#main .main_color h2 b {color: #000 !important;}

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

Best regards,
Mike

Hi,
Thank you for the login, I believe what you are describing is that on mobile the header is not transparent, this is the correct behavior.
So while the header is not transparent the layerslider is shown beneath the header, as in below, so it can be seen.
Would you like to have a mobile transparent header?
This css will do that, but note it would be applied to all pages, if you want it to only apply to some pages you can add page ID’s or other classes depending on needs.

@media only screen and (max-width: 766px) { 
  .responsive #top #main {margin-top: -80px!important;}
  #top #wrap_all .av_header_transparency {background-color: transparent!important;}
  div#header_main > .container {display: block !important;}
  }

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

Best regards,
Mike

Hey Lidia,
Sorry for the late reply, to add a login icon next to your social icons, I would recommend going to Enfold Theme Options > Social Profiles > Your social profiles and choose a profile you are not using such as Twitter and enable it with your login link. Then add this code in the General Styling > Quick CSS field or in the WordPress > Customize > Additional CSS field:

#top .social_bookmarks li.social_bookmarks_twitter a:before {
  background: url(https://img.icons8.com/offices/30/000000/hot-air-balloon.png) center center no-repeat;
  background-size: contain;
}

#top .social_bookmarks li.social_bookmarks_twitter a:before{
  content: "";
  display: block;
  width: 30px;
  height: 30px;

}

This will give you a hot air balloon icon like this:

Please give this a try.

Best regards,
Mike

Hi,
Sorry for the late reply, yes you would use the code you posted, but please note that the quotes the code Rikard posted need to be double quotes “ next to the [your shortcode] like this:

function colin_add_christmas_banner(){
  echo do_shortcode("[your shortcode]");
}
add_action('ava_after_main_container', 'colin_add_christmas_banner');

this is because the single quotes in the shortcode will break the function if it also is using single quotes to contain the shortcode. Hope that makes sense.

Best regards,
Mike

Hi,
Sorry for the late reply, and thanks for the login, I commented out the css above, this looks like a z-index issue. I see some theme settings are not showing on your site because you using 4.7.3, please try updating to 4.7.6.4

Best regards,
Mike

Hi,
Glad to hear, unless there is anything else we can help with on this issue, shall we close this then?

Best regards,
Mike

Hey jelle,
Sorry for the very late reply and thanks for the links, typically anchors are corrected with a offset, padding or margin, to match your header height. I see that you are using the “name” tag to create your anchors:
<a name="B020"></a>
please try using “ID” like this:
<a id="B020"></a>
Enfold should add the offset automatically when using ID like this. I tested on my localhost to confirm.
After making this adjustment please clear your browser cache and check.

PS, please note that ID’s can not begin with numbers.

Best regards,
Mike

Hi,
Sorry for the very late reply and thanks for the links, I found that your masonry element was set to show 12 items, but you only have 3 items to show, which should be fine, but from looking at the space it looks like you don’t intend to show more than 3, so I set this to 3.
I also noticed that your columns were set to auto, which should be fine, but changing this to 3 centered the items, correctly.
Please clear your browser cache and check.
I believe there is an issue with one of these settings when the number of items are only a few, if you had 6 or 8 items you may have not seen this issue. I will continue to investigate this and report my findings to the dev team, if you find my adjustments satisfactory please use them.

Best regards,
Mike

Hi,
Sorry for the very late reply and thanks for the links. Please try this code in the General Styling > Quick CSS field or in the WordPress > Customize > Additional CSS field:

@media only screen and (max-width: 767px) { 
#top.home #full_slider_1 .slideshow_align_caption {
    vertical-align: top;
    padding-top: 10%;
}
#top.home #full_slider_1 > div > ul > li.active-slide > div > div > div > div > div > div > a {
	margin-top: 25%;
}
}

Please clear your browser cache and check. Below you will find test screenshots, 320px is the smallest of mobiles, 425px is more common now.

Best regards,
Mike