Hey Malene,
Thanks for the login. You can set the size of the menu items under Enfold->Advanced Styling. For the h6 you can use this CSS in Quick CSS:
h6 span {
font-size:20px !important;
}
Best regards,
Rikard
so for Johann Müller you gave the class smalldot to ul try this
(but this you have to do now manually – if you gave the class to text-block alb element you can do that via Input field – described above
you can see here that i can simulate the results by clicking the screen-film: https://webers-testseite.de/listpoints/
(the code comes to quick css – but for the simulation i alway use in developer tools a nearly empty css file)
ul.normaldot {
list-style: none outside;
}
.avia_textblock ul.normaldot {
line-height: 1.2em;
}
ul.normaldot li::before {
content: "\2022";
padding-right: 5px;
color: red;
font-size: 18px !important;
}
.entry-content-wrapper .normaldot li {
margin-left: 0;
display: flex
}
the “list-point” size goes than via font-size – the different color you can delete
Hi,
Please try:
@media only screen and (max-width: 460px) {
#av-tab-section-1 .av-inner-tab-title,#av-tab-section-1 .av-tab-section-icon,#av-tab-section-1 .av-tab-arrow-container,#av-tab-section-1 .av-tab-section-image {
width: 80px !important;
}
#av-tab-section-1 .av-tab-section-tab-title-container {
padding-left: 25px !important;
padding-right: 0px !important;
}
#av-tab-section-1 .av-section-tab-title {
font-size: 10px !important;
}
}
Best regards,
Mike
Hi,
Please try:
.avia-table-2.avia-builder-el-17 td,.avia-table-2.avia-builder-el-17 th {
font-size: 12px !important;
padding: 6px !important;
}
Best regards,
Mike
Hello Victoria,
Sure, I would like for someone to address and help me resolve my original question.
“Hi there,
I’ve been researching your forum and playing with this all day, and I got a code that’s working but need your help to make it perfect.
1. When I touch gallery image on my ipad it shows black image highlight that’s bigger than just image.
I need black overlay shape to be the same size as image alone.
2. Title is transparent and same opacity as black overlay.
I need title to be at 100% opacity.
3. Also, is it possible to display on rollover any other text besides a title alone. Like subtitle or any other text as a description that I would like to include below existing title.
This is a code that I have in my Quick CSS:
.av-masonry-entry:before {
content: attr(title);
background: black;
position: absolute;
width: 100%;
height: 100%;
z-index: 1000;
text-align: center;
line-height: 180px;
opacity: 0;
font-weight: bold;
font-size: 24px;
transition: all linear 0.2s;
}
.av-masonry-entry:hover:before {
opacity: 0.5;
}
Also in Masonry Gallery Content I have Overlay deactivated and not displaying element captions.
Thank you for your help.
Cheers, Alan”
If too difficult no need to resolve 3rd point about showing extra (excerpt) text.
Thank you, Alan
That helps but it is still getting cut off a bit on the right (price column). It seems on Corcoran’s mobile version the whole chart is smaller? Is there anyways to make the columns shorter in width and maybe make the font size smaller?
Hi Munford,
Does it have some font-size specified in the element options on that page?
Here is the code you can put in Enfold > General Styling > Quick Css, if it does not work, put into themes/enfold/css/custom.css
@media only screen and (max-width: 479px) {
.responsive #top #wrap_all #full_slider_8 .av-mini-font-size-40,
.responsive #top #wrap_all #full_slider_4 .av-mini-font-size-40
{
font-size: 28px !important;
}
}
If you need further assistance please let us know.
Best regards,
Victoria
Hey Kamakshi,
Please try adding this code to the Quick CSS section under Enfold > General Styling or to your child theme’s style.css file:
/* Content slider heading */
.avia-content-slider-element-container .new-special-heading h3{
color:#9f9fa3;
font-family: 'Dancing Script', cursive;
font-size: 42px;
}
If you need further info to customize this element please check content slider documentation.
Best regards,
Vinay
Hi there
I’ve installed a google font on my site and things have worked fine previously. But now, for some reason, the main menu links and the quote on the home page (H6) is rather small. I’ve tried to change the size in css as well as in advanced styling, but no luck, so I probably did it wrong :-) Could you please have a look and maybe provide me with the proper css code?
Thanks in advance!
Hi there,
I want to change the caption size of my masonry gallery to make it bigger. This thread here was already very helpful: https://kriesi.at/support/topic/masonry-gallery-font-size/?login_error
But my desired caption size in the desktop version is way to big for mobile screens. How can I adjust it so that the caption size doesn’t change in the mobile version?
Thanks for your help!
Isabel
Hi
I have some conflict that I can’t figure out – trying to control the size of the slideshow titles on the mobile on the page below. the 1st and 3rd slides reflect this css:
@media only screen and (max-width: 767px) {
.responsive #top .slideshow_caption h2 {
font-size: 28px !important;
}}
but the 2nd and 4th slides are displaying this:
@media only screen and (max-width: 479px)
.responsive #top #wrap_all .av-mini-font-size-40 {
font-size: 40px !important;
}}
and I don’t know where to fix that code. I want the font size 28px on all.
thanks for your help
Nancy
this is not possible in this way – but you can erase the list-style on that case and insert with pseudo class dots.
Great advantage of that method : you can have a different color and size than the font settings:
give a custom class to your text-block where you have placed the list
f.e.: smaller-dots
see here: https://webers-testseite.de/listpoints/
.smaller-dots ul {
list-style: none outside;
}
.avia_textblock.smaller-dots ul {
line-height: 1.4em;
}
.smaller-dots ul li::before {
content: "\2022";
padding-right: 10px;
color: red;
}
by the way: if you like to have different “signs” in front of your list : http://unicode.e-workers.de/entities.php
the hexadezimal code is good for that
for bullet the code is : • with ; content than is content: "\2022";
for » choose : content:"\00BB" etc
Hi,
I made a dropbox link of a screenshot that i want, see private
Is it possible that the site is not scrolling and the footer always is on the bottom ?
And is the layout in the footer possible ? above the social icons and below the text ?
How to remove search from menu ?
What is best way to increase the size for menu font ?
Hi
Hopefully I can explain what I need here.
On my home page I have a fullscreen slider with caption text.
Is there a way of changing the colour of the Caption text for small screens. I can see I can change the size of the font but it’s the colour that I need changing and only on this page.
Many thanks
Pete
Hello
I’ve looked at many posts and still can’t get the horizontal padding between my tab titles to be smaller. I think it’s connected to the min-width 540px element but I can’t get it to work. I’d like to have a very horizontal small padding from one to the next since I’m only using ’01’ ’02’ etc for titles, and at the moment there is a large horizontal space between 01 and 02 etc. Here’s my code so far, below. Thank you in advance :)
/************************ TAB SECTIONS ************************/
/* title band */
.av-tab-section-tab-title-container {
background-color: #ff5057;
}
.avia-tab-title-padding-default .av-outer-tab-title {
padding: 0px !important;
}
.av-tab-no-icon.av-tab-no-image .av-inner-tab-title {
font-size: 12px;
font-weight: 700;
letter-spacing: 1px;
margin: 5px 0px;
}
.av-inner-tab-title {
}
#top .av-section-tab-title {
color: #fff;
padding-left: 0px !important;
padding-right: 0px !important;
}
#top a.av-active-tab-title {
color: #000;
}
Hi Vinay,
2. I’m as well using on my desktop Chrome and on ipad/iphone FireFox but black 50% opacity background on fade in/out is not showing. Cleared history and website data as well.
Again this original code from the beginning of this thread shows black background perfectly when hovering over, so if there is a way of combining it with your current code that displays just title very nicely:
.av-masonry-entry:before {
content: attr(title);
background: black;
position: absolute;
width: 100%;
height: 100%;
z-index: 1000;
text-align: center;
line-height: 180px;
opacity: 0;
font-weight: bold;
font-size: 24px;
transition: all linear 0.2s;
}
.av-masonry-entry:hover:before {
opacity: 0.5;
}
3-4. I understand there could be issues if you’re customizing Masonry gallery and then all other Masonry galleries would work to that customized way. But can’t only this gallery be customized with custom ID Attribute?
If you can’t help me any more that’s fine, you can close this thread.
Thank you for all your help I really appreciate all your hard work.
Best regards, Alan
Hello – my query is for styling with CSS on similar topic to above – using contact form 7.
So far I have added this Quick CSS as below and it mostly looks fine. I used a combination of your ideas above and some from this Tutorial video:- https://www.youtube.com/watch?v=bKarC0QO5og
/* Submit Button CSS Styles */
.wpcf7 input[type=submit] {
padding:15px 45px;
background:#FCE228;
color:#232323;
font-size:16px;
font-weight:bold;
border:0 none;
cursor:pointer;
-webkit-border-radius: 3px;
border-radius: 3px;
}
/* Submit Button CSS Hover Styles */
.main_color input[type=’submit’]:hover {
background-color: #232323;
color: #FCE228;
}
/* Label Text Styles */
.wpcf7 label {
padding: 0 0 10px 0;
font-size: 20px;
color:#232323;
}
I want to style further as follows:- Numbered to help your reference :).
1. Make the NAME and EMAIL input fields on same line when the browser width permits. This is how the old Enfold Contact form worked by default. Here’s a screen shot showing ENFOLD default above and CF7 below. I assume it will need to default to stacked on top of each other for mobile view as it does now.

2. My CSS above wasn’t able to add more padding below the label. I tried 20, 40 etc – but it looked just the same. Assuming 20px is the bottom padding?
3. How to add the styling to make the input boxes like my enfold screenshot – with borders coloured #232323 – and with the same rounding as enfold – assume 3px radius?
4. [EDIT- FOUND SOLUTION TO THIS NOW! ] How to add a thin coloured ( #232323) border to the Send button – as I had on the old Enfold contact form? There was also a border colour on the button Hover CSS above but I found it didn’t seem to do anything.
Hope you can help with the above. Much appreciated.
Pete
my website contact form page is here:-
-
This reply was modified 8 years ago by
premedia.
Hi ! I am trying to change the font weight, size and family that displays in my main menu at the top but I cant/ I have researched other solutions in this forum and have tried them all but nothing seems to work!
Please let me know how I can do that . Thanks !!
Hi there,
Thanks for your theme. It’s amazing. I’m trying to apply some hooks in my child theme, and I was wondering how to modified the maximun value of H1 to more than 80px.
Here is an image what I want to change. I need that instead of 80 px (it’s the maximun) is 90px.

Dear Kriesi.at-Support,
I would like to integrate a chart for precious metals which I generated here:
https://www.tradingview.com/widget/symbol-overview/
Unfortunately I can not get it displayed properly on my page.
Taken from TradingView’s FAQ: “The widget is not adapting to different screen sizes. What should I do?
Use the Autosize setting. When autosize is on, the widget uses 100% of available width and height of the enclosing element.
It’s very important to set a specific height of parent element for the widget to work properly.”
Is there any way to set a specific height of the used ‘code-block’ as parent element?
Your support is most appreciated.
Kind regards
Alex
Code to be integrated as follows:
<!– TradingView Widget BEGIN –>
<div class=”tradingview-widget-container”>
<div id=”tv-medium-widget”></div>
<div class=”tradingview-widget-copyright”><span class=”blue-text”><span class=”blue-text”>Gold (USD)</span>, <span class=”blue-text”>Gold (EUR)</span></span> <span class=”blue-text”>Kurse</span> von TradingView</div>
<script type=”text/javascript” src=”https://s3.tradingview.com/tv.js”></script>
<script type=”text/javascript”>
new TradingView.MediumWidget(
{
“container_id”: “tv-medium-widget”,
“symbols”: [
[
“Gold (USD)”,
“XAUUSD|1d”
],
[
“Gold (EUR)”,
“XAUEUR|1d”
]
],
“greyText”: “Kurse von”,
“gridLineColor”: “#e9e9ea”,
“fontColor”: “#83888D”,
“underLineColor”: “#dbeffb”,
“trendLineColor”: “rgba(73, 133, 231, 1)”,
“width”: “100%”,
“height”: “100%”,
“locale”: “de_DE”
}
);
</script>
</div>
<!– TradingView Widget END –>
-
This topic was modified 8 years ago by
CHASSALLA.
Hi,
To remove the styling from the shopping cart, Try to add this code in the General Styling > Quick CSS field:
#top div ul.product_list_widget li a {
display: block;
font-weight: bold;
font-size: 12px!important;
color: #000 !important;
}
Please adjust to suit.
Best regards,
Mike
Hi Basilis,
Thanks for your reply. I use this code as navigation label in my menu:
[av_font_icon icon='ue821' font='entypo-fontello' style='' caption='' link='' linktarget='' size='25px' position=" color=''][/av_font_icon]
Maybe the problem is located and can be fixed there?
If you need more access I will make login to to the backend for you.
Thanks!
Hi Blanche,
Thank you.
Here is the code you can put in Enfold > General Styling > Quick Css, if it does not work, put into themes/enfold/css/custom.css
@media only screen and (min-width: 768px) and (max-width: 990px) {
.html_header_transparency #top .avia-builder-el-0 .slideshow_caption {
padding-top: 50px;
}
}
@media only screen and (max-width: 479px) {
.avia-slideshow-inner {
height: 290px;
}
.av_slideshow_full li img {
height: 290px;
width: 175%;
max-width: inherit;
}
#top .avia-slideshow-button.avia-color-light {
padding: 7px 10px;
margin-top: 15px;
}
.avia-multi-slideshow-button.avia-slideshow-button {
margin-right: 10px;
}
#top .avia-slideshow-button.avia-color-light.avia-button {
font-size: 18px !important;
}
.responsive #top .slideshow_caption h2 {
font-size: 26px !important;
}
}
If you need further assistance please let us know.
Best regards,
Victoria
Hey jleclair87,
Please try the following in Quick CSS under Enfold->General Styling:
#footer .menu-footer-container ul li a {
font-size:16px !important;
}
Best regards,
Rikard
Hey Gene,
Please try the following in Quick CSS under Enfold->General Styling:
.home .av_icon_caption {
font-size: 20px;
font-weight: 600;
}
Best regards,
Rikard
I am using a logo that is 1200×200 I would like the header to be 100% the width of the logo space so no white padding. What am I missing?
@media only screen and (min-width: 1200px) {
.html_header_top.html_logo_center .logo{
left: 0!important;
-webkit-transform:none!important;
-ms-transform: none!important;
transform: none!important;
}
}
@media only screen and (max-width: 1200px) and (min-width: 996px) {
.html_header_top.html_logo_center .logo{
left: 0%!important;
-webkit-transform:none!important;
-ms-transform: none!important;
transform: none!important;
}
.logo img{
width:800px!important;
}
}
@media only screen and (max-width: 996px) and (min-width: 767px) {
.html_header_top.html_logo_center .logo{
left: 0%!important;
-webkit-transform:none!important;
-ms-transform: none!important;
transform: none!important;
}
.logo img{
width:620px!important;
}
}
#top label span, #top legend span {
font-weight: normal;
font-size: 14px;
color: #ffffff;
}
.template-blog .small-preview {display:none !important;}
.slide-meta-comments, .slide-meta-del {
display:none !important;
}
.slide-meta-time, .slide-meta-del {
display:none !important;
}
how do I adjust the font size of the menu widget link text in the footer?
Hi,
Add this to quick css:
.pricing-table .avia_iconbox_title {
font-size:20px!important;
}
Best regards,
Jordan Shannon
the only code I see pertaining to this is:
.avia_ajax_form .button {
font-size: 26px;
font-family: roboto!important;
}
#top label {
font-size: 15px;
}
.avia_ajax_form .required { display: none !important; }
Hi,
Add this to quick css my friend:
.pricing-table.avia-center-col .first-table-item{
font-size:20px!important;
}
.pricing-table.avia-center-col .avia-pricing-row{
font-size:20px!important;
}
Adjust the numbers as you need.
Best regards,
Jordan Shannon