Hi,
Thank you for your patience and the link to your site, I cloned your last slider item and saw the font size error on the frontend, it looks like the css for the slide was not added to the style for some reason, if you add this css to your Enfold Theme Options ▸ General Styling ▸ Quick CSS field it will correct this if you want to add more slides:

#top #wrap_all .avia-slideshow .av-slideshow-caption .avia-caption-title {
    font-size: 36px;
}
#top .avia-slideshow .avia-caption-content p {
    font-size: 20px;
}

I didn’t add this and I removed the cloned slide I created.
I don’t know why this has occurred, I tried looking at your Enfold Theme Options ▸ Performance settings and your plugins, etc but didn’t find a cause.
I created a test page on my site with 10 slides and your layout and font sizes and they all worked correctly. So you could try using this css for now and if you find any other issues in the future perhaps they will also point to a cause for this.
Or you could try disabling all of your plugins. If that resolves the issue, reactivate each one individually until you find the cause.
Perhaps your server is also caching, so try clearing your server cache and if it is using object-oriented cache such as Memcached, Redis, Varnish, Litespeed, etc try disabling it to see if this helps. Otherwise if you don’t have any other issues I would try using the css for now.

Best regards,
Mike

Hello,

-upload for a long time (without send)
-contact form disappeared after long time

Please try deactivating all active plugins and check if that helps.

Again; the message when you enter wrong email is little, white background and not readable. Where can I change that?

Please add following code to bottom of Quick CSS field and adjust as needed:

.av-fields-with-error {
  font-size: 20px;
  color: orange;
  background-color: black;
}

Again; the border after clicking “send” become colored (yellow maybe..). Where can I change that color?

Please go to Enfold theme options > General Styling > Main Content and change the “Highlight Color”.

Best regards,
Yigit

Hi,

Thank you for the screenshot.

Looks like the caption title of the other slides have different configuration. Please edit the slider item, then look for the Styling > Font Sizes settings.

Best regards,
Ismael

Hi,
For your special heading subheadline, when you choose a special heading with a Subheading you will see a option in the font tab to set the font size, there is not a site wide font size for each specific element, but you could create a CET – Custom Element Templates and then use your element on your site. You can also do this for your buttons, or since your buttons are set to use the theme color you can change the color in your styling, but this will also effect other elements, so it would probably be better to create a “read more” CET button instead.
Hopefully this answers your two new questions, but please note that we ask that each thread stays on a specific topic, this helps other users find solutions based on the opening subject line quicker, and makes it easier for Mods to help. For further questions please open a new thread
Please let us know if your original question has been answered and we can close this thread, thanks for your understanding.

Best regards,
Mike

Hi,

Thank you for the update.

We can reproduce the issue but not yet sure what is causing it. It might be due to the hidden section on desktop and medium devices. Please try to add this css code and make sure to temporarily disable the Enfold > Performance > File Compression settings.

@media only screen and (min-width: 990px) {

  .responsive.av-no-preview #top #wrap_all .av-desktop-hide,
  .responsive.av-no-preview #top #wrap_all .av-desktop-font-size-hidden,
  .responsive.av-no-preview #top #wrap_all .av-desktop-font-size-title-hidden {
    display: none;
    height: 0;
  }
}

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

  .responsive.av-no-preview #top #wrap_all .av-medium-hide,
  .responsive.av-no-preview #top #wrap_all .av-medium-font-size-hidden,
  .responsive.av-no-preview #top #wrap_all .av-medium-font-size-title-hidden {
    display: none;
    height: 0;
  }
}

Best regards,
Ismael

Hi,

1. How can I re-sort the tabs in the tab section without having to create them again?

In the tab section element place your mouse over the double arrow in the tab and drag the tab to a new placement:

the tab number won’t change but the title and content will change.

2. I would like to have the symbol boxes without frames, but the symbols in the same size and view as symbol boxes with frames, or can I set the color of the text box to white or another color?

I assume this is your example:

I’m not sure that I understand your question, both elements are the same size, but the first one with no background color looks larger because it blends into the element padding.
If you change second one the background color to white it will look the same:

so I’m not sure what you want to achieve.It dose look like you are using a different font size for the first box:

Best regards,
Mike

Hi,

Please try this CSS as well:

#top label.input_checkbox_label {
    color: #919191;
    font-size: 15px;
}

Best regards,
Rikard

Hi,

1. https://www.w3schools.com/tags/tryit.asp?filename=tryhtml_link_phoneto

2 and 3:

header_meta {
    background: #969696;
}

.phone-info div {
    color: #fff;
    font-size: 14px;
}

Best regards,
Rikard

Hi!

Thank you for the info.

Please look for this css modification in the Quick CSS field..

#top label.input_checkbox_label {
    font-size: 11px;
    line-height: 11px;
    font-weight: normal;
}

.. then, replace it with:

#top label.input_checkbox_label {
    font-size: 11px;
    line-height: 11px;
    font-weight: normal;
    top: 5px;
    position: relative;
}

Regards,
Ismael

Hi,
For border color, radius, and icon size try this css:

#top #header.header_color .widget input[type=text] {
	border-color: red;
	border-radius: 10px;
}
#top #header.header_color .widget #searchsubmit {
    border-radius: 0 10px 10px 0;
}

#top #header.header_color .widget #searchform #searchsubmit {
 	font-size: 30px;
}

This should also work on your live site.

Best regards,
Mike

Hi,
When I check it doesn’t look like you have made a choice for your font size:

after you make a choice remember to make it for each language and save.

Best regards,
Mike

Hi,
On the page that you linked to I didn’t see your example, so here is a screenshot of the first item:

do you want the large 20,00 € + IVA to be small.
and the small 24,40 € to be large?
both can stay in their places, you just want the font size changed, correct?

Best regards,
Mike

Hey yas28,
Do you mean that the titles don’t fit on a single line like this:

you can adjust the font size for mobile at styling ▸ font size and click the icon for the phone and then set the size you wish

To see a better display of your site for mobile when you are editing, try opening your site in another tab and use the Dev Tools Responsive Design Mode

Best regards,
Mike

Hi,
You can change the font size in the Enfold Theme Options ▸ Advanced Styling for menu items, but the flag is a very small icon, so you can’t make it larger.

Best regards,
Mike

Hey ijnavas,
To add nine social media icons per team member you will need to make the social icons smaller like this:

.team-social a {
    text-decoration: none;
    position: relative;
    border-radius: 30px;
    padding: 0;
    background: #fff;
    margin: 3px;
    display: inline-block;
    height: 17px;
    line-height: 17px;
    width: 15px;
}
.avia-team-member .team-social {
	font-size: 10px;
}

the expected results

Best regards,
Mike

Hi,

Sorry we missed the video. Looks like you have created a copy of the same section for smaller device. Does it work when you temporarily disable or remove the section? If the issue persists, please try to add this css code.

@media only screen and (min-width: 480px) and (max-width: 767px) {
  .responsive.av-no-preview #top #wrap_all .av-small-hide,
  .responsive.av-no-preview #top #wrap_all .av-small-font-size-hidden,
  .responsive.av-no-preview #top #wrap_all .av-small-font-size-title-hidden {
    display: none;
    height: 0;
  }
}

Best regards,
Ismael

Hi,

Thank you for the clarification.

The logo is pushed a bit to the right because of this css code.

.responsive #top .logo .subtext {
    transform: translate(2%,-50%)!important;
    width: 235px!important;
}

Adjusting the transform/translate value should move the logo farther to the left.

.responsive #top .logo .subtext {
    transform: translate(-15%,-50%)!important;
    width: 235px!important;
}

And to adjust the size of the magnifying glass, please add this css code.

.responsive #top #wrap_all .menu-item-search-dropdown>a {
font-size: 42px;
}

Best regards,
Ismael

Hi,

Glad to hear this helped the map issue, I see the your mega menu items are still column titles, have you tried to change them to regular menu items? Doing this will make the fonts size smaller and the width smaller, like this mega menu example:

unless you specifically only want to use column titles?
If so then try this css and adjust the font to suit:

#top #header .mega_menu_title,
#top #header .mega_menu_title a {
    font-size: 12px;
}

To make the meag menu smaller tru this css and adjust to suit:

#header .avia_mega_div.twelve.units {
    width: 602px;
}

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

Best regards,
Mike

Hi,

Sorry for the confusion. I thought that you wanted the button element to look the same as the slider button, but it’s the other way around. Please use this css code to adjust the style of the slider button.

#top .avia-slideshow-button {
    text-transform: none;
    background: #FAC710 !important;
    padding: 12px 16px 10px;
    font-size: 16px;
    min-width: 90px;
    border-radius: 3px;
    text-decoration: none;
    display: inline-block;
    border-bottom-style: solid;
    border-bottom-width: 1px;
    margin: 3px 0;
    line-height: 1.2em;
    position: relative;
    font-weight: normal;
    text-align: center;
    max-width: 100%;
    color: #000;
    margin-top: 20px;
}

#top .avia-slideshow-button:hover {
    border-color: #CA9336;
    color: #fff;
    background: #D28C17 !important;
}

Best regards,
Ismael

Hey gatehealing,

Thank you for the inquiry.

1) Summary: Legible Font Sizes (THREE issues)

1) Font Size 11px – It seems to be referring to the base or default font size for all text elements. This css rule is overridden by the custom font sizes that can be set in the Enfold > General Styling > Typography panel.

2-3) Font Size 11px .pagination span, .pagination a – You can adjust the size of the pagination with this css code.

#top .pagination .current, #top .pagination a, #top .fullsize .template-blog .pagination a {
    height: 50px;
    width: 50px;
    line-height: 50px;
    border-radius: 100px;
    margin-right: 5px;
    font-size: 1em;
}

#top .pagination .pagination-meta {
    float: right;
    line-height: 35px;
    font-size: 1em;
}

2) Summary: Tap Target Sizing (FIVE issues)

1) Element Label Search – Looks like you’ve disabled the search bar in the header but if you want to adjust the size of the label, try to use this css code.

#top .av_minimal_header #s {
    font-size: 1.2em;
}

———————————————–
2-5) Element Label span.blog-categories > a – The other 4 refers to the post categories, which can be adjusted using this css code.

.html_elegant-blog #top .post-entry .minor-meta {
    font-size: 1em;
}

Best regards,
Ismael

Hi,

I created the lower button at the green arrow with the button element and some CSS.
Now I want the button at the top of the red arrow to look the same.

Have you tried editing the button styles within the element’s Styling panel? You’ll find options there to customize attributes like color, font size, borders, and more.

Best regards,
Ismael