Hi,
Try this CSS in your Enfold Theme Options ▸ General Styling ▸ Quick CSS field instead to have larger round social icons in the socket, it also adds a white background color before mouse-over and on mouse-over the icon colors show, I have not sure what color you wanted as typically there is no color until mouse-over, feel free to adjust the color to suit.

#socket .social_bookmarks li a {
width: 50px!important; 
line-height: 50px!important; 
min-height: 50px!important; 
font-size: 30px;
}

#socket .social_bookmarks li {
height: 50px!important; 
width: 50px!important; 
}

#top #wrap_all .av-social-link-instagram a {
    color: var(--enfold-socket-color-meta);
    background-color: #fff;
}
#top #wrap_all .av-social-link-linkedin a {
    color: var(--enfold-socket-color-meta);
    background-color: #fff;
}

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

Best regards,
Mike

Hey designguy2006,

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

.html_av-submenu-hidden .av-submenu-indicator {
  font-size: 20px;
  color: red;
}

Best regards,
Rikard

Hey Richard,

Thank you for the inquiry.

The social icons in the socket container were already white when we checked. To adjust the size, please add this css:

#top #socket .social_bookmarks li a {
  float: left;
  width: 50px;
  line-height: 50px;
  min-height: 50px;
  font-size: 30px;
}

#top #socket .social_bookmarks {
  height: 50px;
}

Best regards,
Ismael

Hi,
I added this css to your Quick CSS:

#top #header .avia_mega_div .sub-menu .avia_mega_text_block a {
    text-decoration: none;
    font-size: 12px; 
}
#top #header .avia_mega_div .avia_mega_text_block .avia-bullet {
    margin-top: 10px;
    left: -8px;
}

please clear your browser cache and check.

Best regards,
Mike

Hey ftt123,

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

@media only screen and (max-width: 767px) {
.avia-slideshow-slide .avia-caption-content p {
  font-size: 18px; 
}
}

Best regards,
Rikard

Hi,

This is what is currently appyling:

#main .avia_textblock.text-about {
  margin-top: 0px;
  padding-top: 5px;
  padding-bottom: 5px;
  font-size: 19px;
  font-family: zen-kaku-gothic-new;
  font-weight: 500;
  word-spacing: 18px;
}

Changing the top and bottom padding values work when I test it in the browser.

Best regards,
Rikard

Hi,

Please try this CSS instead:

#main .avia_textblock.text-about {
  margin-top: 0px;
  padding-top: 12px;
  padding-bottom: 8px;
  font-size: 18px;
  font-family: zen-kaku-gothic-new;
  font-weight: 500;
}

Best regards,
Rikard

Hey Jak73,

Thank you for the inquiry.

Yes, you may need to manually create this using html and a few css modifications. Please start with this html code in a text or code block element:

<div class="navigation">
    <button class="nav-button left-arrow">&larr;</button>
    <button class="nav-button close-button">×</button>
    <button class="nav-button right-arrow">&rarr;</button></div>

Then add this css code:

.navigation {
    display: flex;
    justify-content: center;
    align-items: center;
}

.nav-button {
    background-color: #fff;
    border: 1px solid #ccc;
    padding: 10px;
    margin: 0 5px;
    cursor: pointer;
    font-size: 16px;
}

.nav-button:hover {
    background-color: #f0f0f0;
}

.left-arrow, .right-arrow {
    font-size: 18px;
}

.close-button {
    font-size: 20px;
}

Best regards,
Ismael

Hi,

Thanks for that. Please try the following in Quick CSS under Enfold->General Styling:

.main_color.iconbox_top .iconbox_icon:before {
  color: blue;
  font-size: 20px;
}

Best regards,
Rikard

Hey reqonsult,

Thank you for the inquiry.

Are you using the Fullscreen Slider element? Try to edit one of the slides, go to the Styling > Font Sizes panel and adjust the Caption Content Font Size and the Caption Title Font Size settings. It’s possible to set a custom font size for different screen sizes.

Best regards,
Ismael

Hi,
Try this css instead

#top #header_meta .phone-info span {
    font-family: 'Raleway', sans-serif;
    font-size: 18px;
    font-weight: 900 !important;
    color: #000;
}

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

Best regards,
Mike

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

 #top .main_color input[type='email'] {
    border-color: #ffffff;
    background-color: #f6f7f9;
    color: #1e242f;
    font-weight: 300;
    font-size: 10px;
    text-transform: uppercase;
    letter-spacing: 1px;
}

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,
When I check now the font size is now 13px, try clearing your browser cache if you use Safari try following these steps for Safari and note step 4 where you will Clear the History.

Best regards,
Mike

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

#header_meta .phone-info span {
	font-size: 13px;
	font-weight: bold;
}

adjust the font size to suit and after applying the css, please clear your browser cache and check.

Best regards,
Mike

Hi,

Thank you for the info.

We edited the contact page and set the Styling > Font Sizes > Caption Title Font Size to 18px for mobile devices. The default custom size is 60px. You can also adjust the size for desktop and tablet in portrait/landscape modes. The font size should respond automatically if the Font Size default is set to the initial option, but since it’s set to a custom size (60px), you have to manually define the font size for all screen sizes. Please check the screenshot in the private field.

Best regards,
Ismael

Hi,
Your screenshot looks like the socket is full width, but your site is smaller, so I recommend making the area full width and making the font smaller so there is enough room.

.responsive #socket > .container {
    max-width: 100%;
    font-size: 18px;
}
#socket .copyright {
    float: right;
    padding-left: 20px;
    line-height: 24px;
}

and then move the “title” on the right side over some in the css for it, currently you have:

#footer-title {
    font-size: 38px;
    font-family: zen-kaku-gothic-new;
    color: #000;
    font-weight: bold;
    float: right;
    top: -38px;
    position: relative;
    left: -15%;
}

change to:

#footer-title {
    font-size: 38px;
    font-family: zen-kaku-gothic-new;
    color: #000;
    font-weight: bold;
    float: right;
    top: -38px;
    position: relative;
    left: -5%;
}

Best regards,
Mike

Hey reqonsult,
Thank you for the link to your site, this is because the first paragraph is in the “td” and the others are in a “p” which has more specialty.
Try this CSS in your Enfold Theme Options ▸ General Styling ▸ Quick CSS field:

#top .all_colors td p {
    font-size: 13px;
    font-weight: 400;
}

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

Best regards,
Mike