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

Hey Jak73,
Try this in a code block element
<marquee>This text will scroll from right to left</marquee>
you will want to add some style for the font size and color, etc

Best regards,
Mike

Hey terishka1,

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

.sort_width_container .inner_sort_button span {
  font-size: 18px;
  color: red; 
}

.sort_width_container .inner_sort_button span:hover {
  color: blue; 
}

div.sort_by_cat {
  background: #262626;
}

Best regards,
Rikard

Hey onedesignprint,

Thank you for the inquiry.

The base css is overriding the advanced styling. We will forward the issue to our channel. For the meantime, please add this css code.

.html_header_sidebar #header .av-main-nav > li > a .avia-menu-text {
    font-size: inherit;
}

Best regards,
Ismael

Hi,

Thanks for the update.

The font size of the h2 element is already set to 22px when we checked. The footer looks fine as well. We provided screenshots in the private field. Please make sure to purge the cache on your end or try to check it on a different browser.

Best regards,
Ismael

Hi,

You can use following code to set H2 font size to 22px

#top #wrap_all .all_colors h2 {
  font-size: 22px;
}

I still see it in correct size but if you do not see it after adding the code, you could try adding !important rule as following

#top #wrap_all .all_colors h2 {
  font-size: 22px !important;
}

Best regards,
Yigit

Hey,

Could you please try adding !important rule and check if that helps?

@media only screen and (max-width: 990px) { 
#top #wrap_all .main_color h1, #top #wrap_all .alternate_color h1 { font-size: 26px !important; }
}
@media only screen and (max-width: 767px) { 
#top #wrap_all .main_color h1, #top #wrap_all .alternate_color h1 { font-size: 22px !important; }
}
@media only screen and (max-width: 480px) { 
#top #wrap_all .main_color h1, #top #wrap_all .alternate_color h1 { font-size: 18px !important; } 
}

Cheers!
Yigit

Hey andrea,

Thank you for the inquiry.

You can define a minimum font size for the text layer in one of its style settings. Please edit the text layer, go to the Styles panel and look for the Min. Font Size and the Min. Mobile Font Size fields. You can also toggle the visibility of the layers on certain screen sizes.

Best regards,
Ismael

Hi,

1- Please use following code instead

@media only screen and (max-width: 990px) { 
#top #wrap_all .main_color h1, #top #wrap_all .alternate_color h1 { font-size: 26px; }
}
@media only screen and (max-width: 767px) { 
#top #wrap_all .main_color h1, #top #wrap_all .alternate_color h1 { font-size: 22px; }
}
@media only screen and (max-width: 480px) { 
#top #wrap_all .main_color h1, #top #wrap_all .alternate_color h1 { font-size: 18px; } 
}

2- Please click on the icons to set font size for different screen sizes – https://imgur.com/a/mZoQ9Z4

Regards,
Yigit

Hi,

1- Could you please post a link of your page so we can make sure we are providing accurate CSS code?

2- You can edit your element and click on the slide and go to Styling > Font Sizes to adjust responsive font size – https://imgur.com/a/ojH7j1N

Best regards,
Yigit

Hey,

Thanks for contacting us!

You can adjust responsive font sizes for Fullwidth Easy Slider in Enfold theme options > General Styling > Typography.
Typography settings do not override post titles so please use following custom CSS code

#top .fullsize .template-blog .post-title { font-size: 30px; } 
@media only screen and (max-width: 990px) { 
#top .fullsize .template-blog .post-title { font-size: 26px; }
}
@media only screen and (max-width: 767px) { 
#top .fullsize .template-blog .post-title { font-size: 22px; }
}
@media only screen and (max-width: 480px) { 
#top .fullsize .template-blog .post-title { font-size: 18px; } 
}

Best regards,
Yigit