Hi,

Thank you for the update.

Have you tried adjusting the font size settings in the Enfold > General Styling > Typography tab? You can set different font sizes for various screen sizes. For mobile view, try adjusting the font size in the Very Small dropdown.

Best regards,
Ismael

Hi,
Try this CSS in your Enfold Theme Options ▸ General Styling ▸ Quick CSS field:

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

Best regards,
Mike

Hi,

Try this CSS in your Enfold Theme Options ▸ General Styling ▸ Quick CSS field instead:

@media only screen and (max-width: 479px) { 
#top #wrap_all #main h4.av-special-heading-tag,#top #wrap_all #main h6.av-special-heading-tag {
    font-size: 8px;
}
}

adjust the font size to suit

Best regards,
Mike

Hi,
Try this CSS in your Enfold Theme Options ▸ General Styling ▸ Quick CSS field:

@media only screen and (max-width: 767px) {
.html_av-overlay-side-classic #top .av-burger-overlay .avia-menu-text {
    font-size: 17px;
}
}

Please ensure to copy the code from the forum and not an email notification so the symbols are not converted.
After applying the css, please clear your browser cache and check.

Best regards,
Mike

Hi,
Did you remove the css above:

.av-special-heading-tag h4,h6 {
    font-size: 55px!important;
}

I don’t see a link to your site, please provide and tell us which title you are looking at that is an H4.

Best regards,
Mike

Hi,
Please see Enfold Theme Options ▸ General Styling ▸ Typography ▸ Advanced Options: Customize Typography Settings and set the font size for “small” & “very small”

Best regards,
Mike

Hey findweat,

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

@media only screen and (max-width: 767px) {
#top .widget_nav_menu li {
  font-size: 17px;
}
}

Best regards,
Rikard

Hi,

Thank you for the update.

how to change the page titles (only on mobile view)

Are you referring to the Special Heading element? Please edit the element and adjust the settings under Styling > Font Sizes > Heading Font Sizes. You can toggle the device icons to change the font size for different screen sizes.

Best regards,
Ismael

Hey JoStudioDeRijp,

Thank you for the inquiry.

You can use this css code to adjust the font size of the hotspot content:

#top .avia-tooltip.av-tt-hotspot {
    font-size: 20px;
}

Best regards,
Ismael

Hey Qgrafica_7,

Thank you for the inquiry.

You can add this css code to adjust the font size of the category sort, but it may become a little too small.

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

  /* Add your Mobile Styles here */
  .avia-fullwidth-portfolio #js_sort_items a,
  .avia-fullwidth-portfolio #js_sort_items .text-sep {
    font-size: 8px;
  }
}

Best regards,
Ismael

Hi,
Thanks for the link to your page, when I check I see this:

I recommend this css:

@media only screen and (max-width: 479px) { 
	#top.home #wrap_all #full_slider_1 .av-slideshow-caption .avia-caption-content p {
		font-size: 12px;
	}
	#top.home #wrap_all #full_slider_1 .avia-caption-title {
		font-size: 15px;
	}
}

or this result for small screens (320px):

and this for normal screens (425px)

Please adjust to suit

Best regards,
Mike

Hi,

Did you place the code inside this css media query?

@media only screen and (max-width: 767px) {
 // place the code here
}

You can also adjust the font size by editing the slide. Go to Styling > Font Sizes, then adjust the Caption Content Font Size > Font Size for small screens (480px to 767px, e.g., Tablet Portrait) settings. Click the device icon to adjust the font size for different screen sizes.

Best regards,
Ismael

Hi,

Thank you for the inquiry.

Please try @Guenni007’s solution above or use this css code:

ul {
    font-size: 18px; /* Adjust the size as needed */
}

ol {
    font-size: 18px; /* Adjust the size as needed */
}

Best regards,
Ismael

Hi,

Thank you for the update.

Please include this css rule inside the css media query (max-width: 767px) to adjust the font size of the caption content:

#top .avia-slideshow .av-slideshow-caption.av-m1g8o6g7-f7efce2774fcf0ca4bccdacd45c3be64__0 .avia-caption-content p {
    font-size: 18px;
}

Best regards,
Ismael

Hey bemodesign,

Thank you for the inquiry.

Did you add this css code?

#top #wrap_all .av-inherit-size .av-special-heading-tag {
    font-size: 1em;
}

Please try to temporarily disable the Enfold > Performance > File Compression settings to make sure that the changes to the theme options take effect. Let us know the result.

Best regards,
Ismael