#header_main .container, .main_menu ul:first-child > li a {
line-height: 240px
}
div.custom_text {
position: absolute;
font-size: 24px;
font-weight: bold;
right: 0;
top: -75px;
}
Adjust the top/line-height values.
Try adding this code to the Quick CSS:
div.custom_text {
position: absolute;
font-size: 24px;
font-weight: bold;
right: 0;
top: -30px;
}
Cheers!
Josue
Hey!
Open css/layout.css, comment/remove from line 1139 to line 1183:
.fullsize .content{
margin:0;
border:none;
}
.fullsize .content .entry-content-wrapper{
padding-right:0;
}
#top .fullsize .template-blog .post-title{text-align: center; font-size: 30px; padding:15px 0; max-width: 800px; margin: 0 auto;}
#top.single-post .fullsize .template-blog .post_delimiter{visibility: hidden;}
#top .fullsize .template-blog .post-meta-infos{text-align: center;}
#top .fullsize .template-blog .post .entry-content-wrapper{text-align: justify; font-size:15px; line-height: 25px; max-width: 800px; margin:0 auto; overflow: visible; }
#top .fullsize .template-blog .post .entry-content-wrapper > *{ max-width: 600px; margin-left:auto; margin-right:auto; }
#top .fullsize .template-blog .post_delimiter{border-bottom-width:1px; border-bottom-style: solid; width:3000px; left:-1500px; position: relative; max-width: 3000px;}
#top .fullsize .template-blog .post_author_timeline{display:none;}
#top .fullsize .template-blog .blog-meta {
float: none;
margin: 0 auto;
display: block;
position: relative;
width: 81px;
overflow: hidden;
text-align: center;
z-index: 1000;
}
#top .fullsize .related_entries_container img{ margin: 0 auto;}
#top .fullsize .related_title{text-align: center; }
#top .fullsize .related_posts{ padding: 23px 0 33px 0; }
#top .fullsize .template-blog .big-preview a ,#top .fullsize .template-blog .small-preview img{float:none; display: inline-block; width:100%; max-width: 100%;}
#top .fullsize .template-blog .first-quote{margin-top:15px;}
#top .fullsize .template-blog .big-preview.multi-big{margin-bottom:-48px; padding: 0; width:100%;}
#top .fullsize .template-blog .big-preview.multi-big a, .fullsize div .template-blog .big-preview.multi-big a img{width:100%;}
#top .fullsize .template-blog .big-preview img{width:100%}
.fullsize .big-preview .avia-gallery {
width: 600px;
max-width: 100%;
margin: 0 auto;
}
.fullsize .comment_content {padding-right:0;}
.fullsize .blog-tags{display: block;}
Regards,
Josue
Hello All!
I’m trying to get different font sizing for desktop and mobile for the ‘text block’ content element.
I’ve found the custom.css with the @media query for mobile and desktop. I’ve try a few different things such as custom classes to generate different font-family/font-size/etc, but that doesn’t seem to work. Also, I’ve tried to use a .mobile-only and .desktop-only class to hide content for the respective text blocks.
Here is the snippet from my mobile portion:
@media only screen and (max-width: 767px) {
/* Add your Mobile Styles here */
.mobile-only {
display:block !important;
}
.p1customMobile {
font-family: georgia;
font-size: 20px;
line-height: 40px;
}
}
Any advice/help would be most appreciated!
Hi!
This will do it:
.entry-content {
font-size: 14px;
}
Cheers!
Josue
Hey!
The code Josue posted should work fine. You have following code in Quick CSS
body p, body {
font-size: 13px !important;
}
Please remove !important rule from it
Cheers!
Yigit
Hey pt360!
When slider caption has so much content, sometimes it does not fit. However you can add following code to Quick CSS in Enfold theme options under General Styling tab to decrease font size and padding around it as a workaround
@media only screen and (max-width: 479px) {
.responsive #top .slideshow_caption h2 {
font-size: 14px;
}
.caption_framed .slideshow_caption .avia-caption-content p, .caption_framed .slideshow_caption .avia-caption-title, .avia-caption .avia-caption-content p, .avia-caption .avia-caption-title {
padding: 5px 10px;
}}
Regards,
Yigit
Can I possibly make the font size less large – it looks larger than “normal” text on my site?
Hi,
I just updateed, and now I have a empty frame over the blog post where I insert them as widgets.
I have the follwing in quick CSS to get rid of icon – worked nice before the update.
.image_size_widget .news-thumb { display: none; }
.rounded-container .iconfont, .small-preview .iconfont { display: none; }
.template-blog .blog-meta, .multi-big .post_author_timeline, .single-small .post_author_timeline { display: none; }
.news-thumb {display: none;}
span.fallback-post-type-icon {display: none!important;}
Can you advice me to some ekstra css?
Hey!
You can increase the width of container on mobile devices with following code
@media only screen and (max-width: 480px) {
.responsive .container { width: 93% }}
or decrease the font size with following code
h2.av-special-heading-tag { font-size: 34px !important; }
Regards,
Yigit
Hi kevinjsutton!
Use this code to center the phone number and to increase the font size – you can add it to the child theme style.css file or quick css field:
.av_phone_active_left .phone-info {
padding-left: 45px;
font-size: 12px;
}
You can also use different values if 45px and 12px don’t give you the best results.
If you want to add a phone icon to the phone number insert
<span class="avia_button_icon" aria-hidden="true" data-av_icon="" data-av_iconfont="entypo-fontello"></span>787866455
into the “Phone Number or small info text” option field (Enfold > Theme Options > Header Layout) and replace 787866455 with your phone number.
Regards,
Peter
I would like some help to center the phone number above my logo and increase the size of the font for the phone number on web browsers and the iPad.
Can I also add a phone icon in the same color in front of the phone number?
Hello Josue,
Thanks I added the line of code under helper-main-menu.php
echo “<div class=’site-description’>”.get_bloginfo ( ‘description’ ).”</div>”;
On the Quick CSS I added the code:
.site-description {
bottom: -30px;
position: absolute;
font-size: 11px;
}
The thing is we need add an image instead of text and it needs to be centered below the navigation on the header.
The Image that we went to add is: http://shelli.bydecosta.com/wp-content/uploads/tag-DrawOutsideTheLines.png
Please let me know if you need me to give you wp-admin access to the site as well.
Thank you,
Marcelo
Hey!
Try adding this code to the Quick CSS:
div.avia-caption-content p {
font-size: 18px !important;
}
Cheers!
Josue
Hi,
How do I Change Caption Text Font Size in the Easy Slider. Can’t seem to find the code on the message boards. I want to make “Protect Your Baby from Wireless Radiation” 18px
Thanks,
Jordan
Hi jmarkula!
Please add following code to Quick CSS in Enfold theme options under General Styling tab
@media only screen and (max-width: 990px) {
.avia_transform .av_slideshow_full .avia-caption-title {
font-size: 40px;
}}
Regards,
Yigit
Hey MC!
Yes there is, if you are not going to use another form in the website you can edit css/base.css, remove/comment from line 182 to line 256:
/* #Forms
================================================== */
#top form {
margin-bottom: 20px; }
#top fieldset {
margin-bottom: 20px; }
#top .input-text,
#top input[type="text"],
#top input[type="input"],
#top input[type="password"],
#top input[type="email"],
#top input[type="number"],
#top input[type="url"],
#top input[type="tel"],
#top input[type="search"],
#top textarea,
#top select {
-webkit-appearance: none;
border: 1px solid #e1e1e1;
padding: 8px 6px;
outline: none;
font: 13px "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;
color: #777;
margin: 0;
width: 210px;
max-width: 100%;
display: block;
margin-bottom: 20px;
background: #fff;
border-radius: 0px;
}
#top input[type="text"]:focus,
#top input[type="password"]:focus,
#top input[type="email"]:focus,
#top input[type="number"]:focus,
#top input[type="url"]:focus,
#top input[type="tel"]:focus,
#top input[type="search"]:focus,
#top textarea:focus {
box-shadow: 0px 0px 2px 0px rgba(0,0,0,0.2);
color: #555;
}
#top textarea {
min-height: 60px; line-height:1.5em;}
#top label{
display: block;
font-weight: bold;
font-size: 12px; }
#top legend {
display: block;
font-weight: normal;
font-size: 15px; }
#top select {
width: 220px; }
#top input[type="checkbox"] {
display: inline; }
#top label span,
#top legend span {
font-weight: normal;
font-size: 13px;
color: #444; }
#top textarea{width:100%;}
#top #wrap_all .valid .text_input, #top #wrap_all .valid .text_area, #top #wrap_all .valid .select{border:1px solid #9AA600;} /*#70A41B*/
#top #wrap_all .error .text_input, #top #wrap_all .error .text_area, #top #wrap_all .error .select{border:1px solid #DF653E;}
#top #wrap_all .ajax_alert .text_input, #top #wrap_all .ajax_alert .text_area, #top #wrap_all .ajax_alert .select{border:1px solid #ffb628;}
#top #wrap_all .valid .input_checkbox_label{color:#9AA600;}
#top #wrap_all .error .input_checkbox_label{color:#DF653E;}
Best regards,
Josue
Hey!
Please add line height to your code as following
<span style="font-size: 60px; font-weight: bold; color: #ff6600; line-height: 120%; line-height: 60px;">PERSONAL</span>
<span style="font-size: 60px; font-weight: bold; color: #ffffff; line-height: 120%; line-height: 60px;">PROTECTION SUITE</span>
Cheers!
Yigit
Hey!
Please add following code to Quick CSS instead
top .avia-smallarrow-slider-heading h3 {
color: red;
font-size: 15px;
}
Cheers!
Yigit
Hey!
Code Ismael posted works fine on my end. Please try adding !important rule as following
.avia-content-slider .slide-entry-title {
font-size: 11px !important;
color: red !important; }
Flush browser cache and refresh your page a few times after applying the code. If that still does not work, please post the link to your website
Regards,
Yigit
Hey!
Sure, please add following code to Quick CSS as well and adjust as needed
.phone-info span { font-size: 18px; }
Best regards,
Yigit
Thanks, where would I add the actual phone number, size, font, and colour within this code you sent?
-
This reply was modified 11 years, 10 months ago by
aasaes.
Thank for the info on changing the font color.
I want to change all images including ones in sidebar widgets to be round.
Here is the homepage with the main images I want to be round. If it’s a size issue, what is the correct size? I can’t figure out how to add a screenshot here so I’m providing a link to the page.
Also, can you tell me how to change the paragraph font to something a little larger?
Thanks so much!
Thanks, Ismael.
That worked for the Slide Titles (which I’m not using), but it’s the Content Slider Heading I’m trying to modify.
I was able to center the heading using “.home .avia-smallarrow-slider-heading> div { text-align: center; }”, but not make any font size or color changes.
Best regards,
Paul
Sweet! Thanks for the very quick response! I actually removed the margin-top style – I had increased the phone number font size, so the margin-top value caused the phone number to disappear.
The menu items are unfortunately still broken into two lines
My Quick CSS:
@media only screen and (max-width: 1024px) {
.av-main-nav > li > a {
padding: 0 10px;
font-size: 11px;
}
}
@media only screen and (max-width: 480px) {
.responsive .logo a, .responsive .logo img {
max-width: 85%;
height: auto !important; }}
Can I combine the .av-main-nav ul with .responsive . logo?
Thanks
Hi Paul!
Thank you for visiting the support forum.
You can change the content slider title with this on Quick CSS or custom.css:
.avia-content-slider .slide-entry-title {
font-size: 11px;
color: red;
}
Best regards,
Ismael
Hey!
Thank you for the info.
Please go to Enfold > Header Layout > Mobile Menu > Header Mobile Menu activation. Select the second option to force the theme to activate the mobile menu earlier. Add this on Quick CSS or custom.css:
@media only screen and (max-width: 1024px) {
.av-main-nav > li > a {
padding: 0 10px;
font-size: 11px;
}
}
Best regards,
Ismael
Hi alexander-_-!
Thank you for visiting the support forum!
Actually, the table rows are the same with the button shortcodes. You can set the columns as Default Columns then add a button shortcode like this:
[av_button label='Click me' link='manually,http://' link_target='' color='theme-color' custom_bg='#444444' custom_font='#ffffff' size='small' position='center' icon_select='yes' icon='ue800' font='entypo-fontello']
Regards,
Ismael
Hey!
1. Change the code to:
.page-id-3599 .avia_ajax_form input[type='submit']{
color: white !important;
}
2. Add this:
.social_bookmarks, .phone-info {
font-size: 18px;
}
Cheers!
Josue