Hi,

You’re welcome! Please don’t hesitate to open another thread if you have more questions.

Have a nice day.

Best regards,
Ismael

Hey ti2media,

Thank you for the inquiry.

The color of the email field is different due to this css code:

#top .kontaktformular input[type='text'] {
    background-color: #ffffff !important;
    border: none !important;
    color: #0d3c63 !important;
}

To correct it, please replace it with the following css:

#top .kontaktformular input[type='text'], #top .kontaktformular input[type='email'] {
    background-color: #ffffff !important;
    border: none !important;
    color: #0d3c63 !important;
}

Then add this css code to adjust the width of the form fields:

#top fieldset {
    margin-bottom: 20px;
    overflow: hidden;
}

Best regards,
Ismael

Hey John,

Thank you for the inquiry.

The theme has its own Contact Form element, but if you need more options, we recommend Contact Form 7 for simplicity or WPForms for more advanced features. Please check the links below:

— https://wordpress.org/plugins/contact-form-7/
— https://wordpress.org/plugins/wpforms-lite/

If you find any styling issues, you can always correct them with custom css. Let us know if you need any additional assistance.

Best regards,
Ismael

Hey dnewkirk,

Thank you for the inquiry.

You may need to temporarily disable the cache plugin, as well as the Enfold > Performance > File Compression settings, while editing the site. You can enable them again once you’re done. Let us know if the issue persists.

Best regards,
Ismael

Hey tariqyacoub82,

Thank you for the inquiry.

Unfortunately, it’s not possible to set a different font for each language from the theme options. You will need to modify this with custom css. If you can create a test page and share the site URL, we’ll check it out.

Best regards,
Ismael

Hey jimmiemoreland,

Thank you for the inquiry.

You can add this css code to make the header sticky on mobile. Make sure to adjust the top padding based on the header’s height.

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

  /* Add your Mobile Styles here */
  .responsive.html_mobile_menu_tablet #top #wrap_all #header {
    position: fixed;
  }

  .responsive.html_header_top #top #main {
    padding-top: 120px !important;
    margin: 0;
  }
}

Let us know the result.

Best regards,
Ismael

Hi,

Thank you for the update.

If you want to create it manually using html, try to add this code in a text or code block element:

<div class="av-logo-row">
<div class="av-logo-item">
    <img src="logo1.png" alt="Logo 1">
    <span>Text 1</span></div>
<div class="av-logo-item">
    <img src="logo2.png" alt="Logo 2">
    <span>Text 2</span></div>
<div class="av-logo-item">
    <img src="logo3.png" alt="Logo 3">
    <span>Text 3</span></div>
<div class="av-logo-item">
    <img src="logo4.png" alt="Logo 4">
    <span>Text 4</span></div>
<div class="av-logo-item">
    <img src="logo5.png" alt="Logo 5">
    <span>Text 5</span></div>
<div class="av-logo-item">
    <img src="logo6.png" alt="Logo 6">
    <span>Text 6</span></div>
<div class="av-logo-item">
    <img src="logo7.png" alt="Logo 7">
    <span>Text 7</span></div>
<div class="av-logo-item">
    <img src="logo8.png" alt="Logo 8">
    <span>Text 8</span></div>
<div class="av-logo-item">
    <img src="logo9.png" alt="Logo 9">
    <span>Text 9</span></div>
</div>

Then use this css:

.av-logo-row {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 20px;
}

.av-logo-item {
  flex: 1 1 calc(100% / 9 - 20px);
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  margin-bottom: 20px;
}

.av-logo-item img {
  width: 40px;
  height: 40px;
  margin-bottom: 8px;
}

.av-logo-item span {
  font-size: 14px;
  color: #333;
}

@media (max-width: 1024px) {
  .av-logo-item {
    flex: 1 1 calc(33.333% - 20px);
  }
}

@media (max-width: 600px) {
  .av-logo-item {
    flex: 1 1 100%;
  }
}

Best regards,
Ismael

Hey maryenvato,

Thank you for the inquiry.

Did you modify the styles for the <select> and <option> elements? Please try to add this css to adjust the color of the option fields.

option {
  padding: 8px;
  background: #FFFFFF;
  color: #333333;
}

option:hover {
  background: #EEEEEE;
}

Let us know the result.

Best regards,
Ismael

Hey Eleina,

Thank you for the inquiry.

Please add this code in the Quick CSS field to adjust the layout of the top bar on mobile view:

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

  /* Add your Mobile Styles here */
  #top #header_meta .phone-info>div>div {
    display: flex !important;
    align-items: center !important;
    justify-content: start !important;
    flex-direction: column;
    gap: 4px !important;
  }
}

Result:

Best regards,
Ismael

Hi,

Glad to know that the issue is resolved. Please feel free to open another thread if the issue occurs again.

Have a nice day.

Best regards,
Ismael

Hey limedrop,

Thank you for the inquiry.

You can try the fixed or parallax background effect in a Color Section element or Slider, but it wouldn’t be exactly the same as the scroll effect found on the site above. This is possible with the Layer Slider, but it would require a standalone license because the scroll effects are not available in the native Layer Slider plugin included in the theme. Hope this helps.

Best regards,
Ismael

Hi,

Glad to know that you’ve found the issue. To override the current filter, you can use the remove_filter function so you can define your own.

— https://developer.wordpress.org/reference/functions/remove_filter/

Please feel free to open another thread if you have more questions.

Have a nice day.

Best regards,
Ismael

Hey coredesignsupport,

Thank you for the inquiry.

Would you mind providing a screenshot of the issue? The logo image cannot be translated by default, but you can use the avf_logo filter to assign a different logo image based on different conditions, like different language.

Example:

function avf_logo_mod($logo){
    $currentlang = get_bloginfo('language');
    if($currentlang == "fr_FR"){
        $logo = 123;  // <-- replace with the FR logo image
    }
    return $logo; 
}
add_filter('avf_logo','avf_logo_mod');

Best regards,
Ismael

Hi,

Thank you for the inquiry.

Have you tried selecting standard screen sizes instead of manually adjusting the screen width or height? We made some adjustments to the css code and re-added it in the Quick CSS field.

@media only screen and (max-width: 989px) {
    .responsive.html_mobile_menu_tablet #top #header_main > .container .main_menu .av-main-nav > li > a,
    .responsive.html_mobile_menu_tablet #top #wrap_all .av-logo-container {
        height: 50px;
        line-height: 50px;
    }

    .responsive.html_mobile_menu_tablet.html_header_top.html_header_sticky #top #wrap_all #main {
        padding-top: 50px;
        margin-top: 50px !important;
    }

    .responsive #header_main .container {
         height: 50px !important;
    }

    .responsive #top .logo {
         height: 48px !important;
    }

    #top #menu-item-search {
        top: 4px;
    }
}

(Tablet):

(Phone)

Best regards,
Ismael

Hi,

Let us know in a different thread if you have more questions. Thank you for your patience.

Best regards,
Ismael