Hi,

I edited the CSS a bit, and it’s applying to your site now. Please review it.

h3.tribe-events-widget-events-list__event-title {
 font-size: 15px !important;
}

span.tribe-events-widget-events-list__event-cost-price {
 font-size: 28px !important;
}

Best regards,
Rikard

Hi Beth,

Please try this CSS instead:

h3.tribe-events-widget-events-list__event-title {
  font-size: 20px;
}

span.tribe-events-widget-events-list__event-cost-price {
  font-size: 14px;
}

Best regards,
Rikard

Hi,
Thank you for the links, as you know both the Final Total and the Extra Options / Product Add-Ons Subtotal are from plugins, neither are standard, the Subtotal is updated by javascript on click / selection from the Extra Options, but this plugin doesn’t update the Final Total because they are not related, that is Extra Options is not looking to update the Final Total. In the Extra Options documentation it doesn’t show the Final Total only a larger Subtotal above the “add to cart” button.
It seems redundant to show the price twice so I recommend using the following css to hide the Final Total and adjust the Subtotal into it’s place:

#top.single-product .single_variation_wrap #tc-final-price-total {
	display: none;
}
#top.single-product div.product-addon-totals .wc-pao-subtotal-line {
    justify-content: start;
}
#top.single-product div.product-addon-totals .wc-pao-subtotal-line .price,
#top.single-product div.product-addon-totals .wc-pao-subtotal-line .price .amount {
	font-size: 1.5em;
    font-weight: bold;
    color:#383838;
}

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

Best regards,
Mike

Hi Bernhard,

You can upload your screenshots on imgur.com and post the links here.

Could you please try adding !important rule and check if that makes a difference?

#top .woocommerce .data-privacy span {
  font-size: 16px !important;
}

Best regards,
Yigit

Hi,

Thanks for the update. Please try this CSS as well:

1.

.avia_sortable_active span.text-sep {
  font-size: 18px;
}

2.

.active_sort .inner_sort_button span {
  color: red;
}

Best regards,
Rikard

Hi,

Thanks for the update. Do you want to increase the font size? If so, then please try this in Quick CSS:

.phone-info div {
  font-size: 16px;
}

Best regards,
Rikard

Hey highland12,

You can’t set that individually in the theme options unfortunately, but if you add a class like this to Quick CSS:

.paragraph-18 {
  font-size: 18px;
}

Then you can add that class to your paragraph, like so:

<p class="paragraph-18">This text is 18 pixels</p>

Best regards,
Rikard

Hi,

Thank you for the update.

You can try this css code to adjust the font size of the sort buttons.

#top .sort_by_cat a .inner_sort_button span {
    font-size: 100px;
}

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

Best regards,
Ismael

Hi,

Social icons; please try this in Quick CSS:

#header .social_bookmarks a:before {
  font-size: 18px;
}

Overlapping; I’m not sure I understand your intentions, could you try to explain what you are looking to achieve a bit further please? If you have a screenshot highlighting what you would like to change, then please share that with us.

Settings; let us know which specific settings are not working, and we’ll look into it further.

Best regards,
Rikard

Hi,
To make it full width try this in your Quick CSS:

#top.page-id-600 .avia_codeblock_section.avia_code_block_0 {
  width: 100vw !important; 
  position: relative !important; 
  left: calc(-50vw + 50%) !important; 
}

to add another going the other direction add this to a new code block element

<style>
.marquee-two > .track-two > .content-two {
  margin: 0;
  padding: 0;
  color: #fff;
  font-size: 25px; 
  font-family: 'press-start-2p';
}

.marquee-two {
  position: relative;
  width: 100vw;
  max-width: 100%;
  height: 200px;
  overflow-x: hidden;
}

.track-two {
  position: absolute;
  white-space: nowrap;
  will-change: transform;
  animation: marquee-two 32s linear infinite;
}

@keyframes marquee-two {
  from { transform: translateX(-50%); }
  to { transform: translateX(0); }
}
</style>
<div class="marquee-two">
  <div class="track-two">
    <div class="content-two"> All of Joakims NFTs are one of a kind (1/1) artworks. Each artwork will be available either on Opensea or Rarible only!</div>
  </div>
</div>

and if you want the second code block full width add this Quick CSS for it

#top.page-id-600 .avia_codeblock_section.avia_code_block_1 {
  width: 100vw !important; 
  position: relative !important; 
  left: calc(-50vw + 50%) !important; 
}

Best regards,
Mike

Hi,
The code you are seeing needs to be inside a style tag, so try this in your code block element

<style>
.marquee > .track > .content {
  margin: 0;
  padding: 0;
  color: #fff;
  font-size: 25px; 
  font-family: 'press-start-2p';
}

.marquee {
  position: relative;
  width: 100vw;
  max-width: 100%;
  height: 200px;
  overflow-x: hidden;
}

.track {
  position: absolute;
  white-space: nowrap;
  will-change: transform;
  animation: marquee 32s linear infinite;
}

@keyframes marquee {
  from { transform: translateX(0); }
  to { transform: translateX(-50%); }
}
</style>
<div class="marquee">
  <div class="track">
    <div class="content"> All of Joakims NFTs are one of a kind (1/1) artworks. Each artwork will be available either on Opensea or Rarible only!</div>
  </div>
</div>

Best regards,
Mike