Hi,

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

@media only screen and (min-width: 768px) and (max-width: 1024px) {
h2.avia-caption-title {
  font-size: 30px;
}
}

@media only screen and (max-width: 767px) {
h2.avia-caption-title {
  font-size: 20px;
}
}

Best regards,
Rikard

Hi,

Thanks for the update. You can set the font size for each screen size if you click into a slider element, then navigate to the Styling->Font Sizes tab.

You can post a feature request here if you like.

Best regards,
Rikard

Hi,
To replace the breadcrumb “Home” with a house icon and make it white, please try this css:

.breadcrumb-trail a.trail-begin:after {
	content: "\e821";
	font-family: entypo-fontello;
	font-size: 16px;
	color: #fff;
}
.breadcrumb-trail a.trail-begin {
	font-size: 0 !important; 
}

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

Best regards,
Mike

Hi,
Sorry for our delayed response, to remove the opacity from the masonry element on hover, on the page you linked to, please try this css:

#top .av-hover-overlay-fade_out .av-masonry-entry:hover .av-masonry-image-container {
    opacity: 1;
}

For the second issue please try this css:

@media only screen and (min-width: 768px) and (max-width: 989px){
.responsive.html_mobile_menu_tablet.html_header_top.html_header_sticky #top #wrap_all #main {
    padding-top: 88px !important;
}
}

To center the masonry title please change this css:

/* Title Position and Caption Box Size */
.av-masonry-entry .av-masonry-entry-title {
text-align: center !important;
position: absolute;
bottom: 5px;
padding: 5px;
}
/* Title */
#top .av-masonry-entry-title {
font-size: 120% !important;
color: #555555;
line-height: 1.6;
font-weight: 600;
letter-spacing: .08em;
text-align: left !important;
text-shadow: 2px 2px 0px rgba(133,133,133,.4)!important;
margin-left: 5%;
}

to this:

/* Title Position and Caption Box Size */
.av-masonry-entry .av-masonry-entry-title {
text-align: center !important;
bottom: 5px;
padding: 5px;
}
/* Title */
#top .av-masonry-entry-title {
font-size: 120% !important;
color: #555555;
line-height: 1.6;
font-weight: 600;
letter-spacing: .08em;
text-shadow: 2px 2px 0px rgba(133,133,133,.4)!important;
width: 100%;
}

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

Best regards,
Mike

Hi,

This CSS seems to be overriding the other buttons:

#top #wrap_all .single_button .button, #top #wrap_all .shop_columns_5 .avia_cart_buttons .button {
    color: #ffffff!important;
    border-color: #062857!important;
    border-radius: 160px!important;
    border-width: 1px!important;
    padding: 15px;
    font-size: 16px!important;
    font-weight: bold!important;
    background-color: #084a79!important;
}

I’m not sure exactly where that is added, but if you could try to remove the !important part, then the CSS I posted should likely apply after that.

Best regards,
Rikard

Hi,

Please try this CSS as well:

@media only screen and (max-width: 767px) {
.aviaccordion-title {
    font-size: 10px;
}
}

Best regards,
Rikard

Hi,
Thank you for the link to your site, our documentation offers some tips on styling the subtext here: Main menu sub-text
Since your menu items are a little slimmer I adjusted the css a little, please try this in your Quick CSS:

#top #header #avia-menu li.menu-item a > .avia-menu-subtext{
	display: flex;
	margin-top: -35px;
	color: #808080;
	font-size: 12px;
	font-weight: lighter;
}

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

Best regards,
Mike

Hi,
Thanks for the login to your site, on your /service-center/ page in your screenshot above I found that the wrong color showing (a bright blue) was the default browser user agent color, so no setting seemed to be applied from the Enfold Theme Options ▸ Advanced Styling
When I added the color and font size to your child theme stylesheet in your current .av-main-nav > li > a rule:

.av-main-nav > li > a {
    line-height: 35px!important;
    height: 35px!important;
	color: #00315c;
	font-size: 17px; 
  }

it worked correctly, so this points to your child theme stylesheet working but not the theme Enfold Theme Options ▸ Advanced Styling
I see in your WordPress ▸ Dashboard ▸ Tools ▸ Site Health ▸ Info ▸ Server both of your PHP memory limit & Max input time are negative values:

typically I would expect to see positive values:

So from your post above it sounds like everything was working fine until recently, so did you just update to PHP v8, if so it looks like the PHP setting are not the same for your previously PHP version, probably 7.4 and the new v8 on your server, try going back to v7.4 to test, and if that works try adjusting them to match.
If you didn’t change the PHP version since the error, then did you make any changes with the better search replace plugin and then noticed the error? This plugin is very powerful and can make serious unexpected changes, and has no fall back option.
If this is true, do you have a pre plugin server backup? You might need to use it to correct, I’m not sure.
If you don’t have a backup then you could add the css needed to correct your menu in your child theme stylesheet and not rely on the Enfold Theme Options ▸ Advanced Styling options.
I have not seen a case of the Advanced Styling not working and I don’t see any related errors?

Best regards,
Mike

Hey Elena,
Thanks for your question, the issue was that your css for category links was using “display:block”:

.custom-masonry-cat,
.avia-builder-el-0 .av-post-metadata-category-link a {
	 color: #719430;
	 font-family: 'caveat';
	 font-size: 16px;
	 text-align: center;
     display: block;
     font-weight: 700;
     text-transform: uppercase;
}

I changed to “display:inline”

.custom-masonry-cat,
.avia-builder-el-0 .av-post-metadata-category-link a {
	 color: #719430;
	 font-family: 'caveat';
	 font-size: 16px;
	 text-align: center;
     display: inline;
     font-weight: 700;
     text-transform: uppercase;
}

and now the categories are in one line:

please clear your browser cache and check.

Best regards,
Mike

Hi,

Thank you for the info.

The changes are not working because the advanced styling for the h3 element overrides the custom css. Try to use a more specific selector, or replace the previous css with the following code.

#top #wrap_all #main .avia-form-success {
    font-family: 'montserrat';
    font-size: 18px;
    background: transparent;
    color: red;
}

Please make sure to toggle or temporarily disable the Enfold > Performance > File Compression settings after adding the css.

Best regards,
Ismael

Hi,
Please try this css in your Enfold Theme Options ▸ General Styling ▸ Quick CSS field

.avia-form-success {
	font-family: 'montserrat';
	font-size: 14px;
	background: transparent;
}

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

Best regards,
Mike

Hi,
In the Special Heading element, under the Styling Tab, this is where you will find the font size option.
Please ensure to are using a current version of Enfold v5.0.1, and you are looking in the Special Heading element, some elements may not have this option. If you still can’t find it, please create a new thread and include a recap, and WordPress admin access in the Private Content area. Since this is not your thread posting your login here will not be private and you will not see anything we write in the Private Content area.

Best regards,
Mike

Hi,

Thanks for the update. If you want to adjust the colour, then please change the above CSS to this:

.pricing-table li {
  font-size: 14px;
  color: red; 
}

.pricing-table li.avia-heading-row {
  font-size: 24px;
  color: blue; 
}

Best regards,
Rikard