Great. Can you tell me where to add that code?

Here is the code for the buttons…

[av_button label='Sign Up for our Newsletter' link='manually,http://http://explorenayarit.com/blog/newsletter-archives/' link_target='' size='medium' position='center' color='theme-color' custom_bg='#444444' custom_font='#ffffff' custom_class=''] [av_button label='Read our Blog' link='manually,http://http://explorenayarit.com/blog/blog/' link_target='' size='medium' color='theme-color' custom_bg='#444444' custom_font='#ffffff' custom_class=''] [av_button label='Ask Questions on our Forum' link='manually,http://jaltemba-bay-mexico.com' link_target='' size='medium' color='theme-color' custom_bg='#444444' custom_font='#ffffff' custom_class='']

Thank you for the very fast reply!

But, the changes shall apply to all Magazine elements at all pages. How can I do this?

Also I would like to have the same Font/Fontsize as defined in “General Styling”/Body Text + Default Font Size:
Lato, 18 px.

Thanks
Ferdinand

Hm, this didn’t change anything.

Here’s all the code added into the Quick CSS. Do you think any of the following is messing it up?

#footer .social_bookmarks li a {
  border-radius: 100px!important;
}

#footer .social_bookmarks li {
clear: none!important;
}

#footer .social_bookmarks li {
  clear: none;
  border-color: #222222;
}

.main_menu ul:first-child > li > a {
font-size: 16px;
}

.main_menu ul:first-child > li > a { font-family: "Lucida Grande","Lucida Sans Unicode",Helvetica,Arial,Verdana,sans-serif; }

/* changes menu font*/
#top .main_menu .menu li ul a { font-size: 14px; }

#top .av-main-nav > li > a { font-family: "Lucida Grande","Lucida Sans Unicode",Helvetica,Arial,Verdana,sans-serif }

#footer .widgettitle {
font-size: 16px;
}

.widget {
font-size: 14px;
}

.header-scrolled .logo img {
padding-top: 5px;
}

.logo img {
padding-top: 5px;
}

.logo img {
padding-bottom: 5px;
}

/* This takes out the green hover icon over pictures */
.image-overlay { display: none!important; }

#top #wrap_all .header_color .av-menu-button-colored > a .avia-menu-text {
    background-color: transparent;
    color: black;
    border-color: transparent;
}

#top #wrap_all .header_color .av-menu-button-colored:hover > a .avia-menu-text, #top #wrap_all .header_color .current-menu-item > a .avia-menu-text {
    background-color: #016852;
    color: #ffffff;
    border-color: #004630;
}

• This reply was modified 10 years, 7 months ago by erusko.

I am very close the mobile media makes a switch at 780pxls that makes the social media icons disappear is there a way to set this to a lower number as the code you provided does not work below 780 pxls. Can you review the current coding that I have provided and let me know if the header looks good in addition to providing the code to make the social media icons appear past a number below 780pxls? Thanks for your help!

.ui-datepicker-title select { padding-right: 17%; }

@font-face {
  font-family: 'PT Sans';
  font-style: normal;
  font-weight: 400;
  src: local('PT Sans'), local('PTSans-Regular'), url(https://fonts.gstatic.com/s/ptsans/v8/LKf8nhXsWg5ybwEGXk8UBQ.woff) format('woff');
}

p { font-family: 'PT Sans' !important; }

.grid-entry-title.entry-title {
font-size: 20px;
font-weight: bold;
text-align: center;
}

.content, .sidebar {
padding-top: 10px;
padding-bottom: 10px;}

body {
  font-size: 16px;
}

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

.main_menu .menu ul { width: 235px; }

#top div .avia-gallery img { border-style: none; padding: 0; }

@media only screen and (min-width: 584px) and (max-width: 1200px) {
.container #advanced_menu_toggle, #advanced_menu_hide {
display: block;
}
.main_menu .avia-menu, #header_main_alternate, .fallback_menu {
display: none;
}}

@media only screen
  and (min-width: 584px)
  and (max-width: 1200px) {
ul.noLightbox.social_bookmarks.icon_count_4 {
left: -60px;
}}

Hi, thank you very much for your anwser. I didn’t realize about the queue. Thanks for the info.
I have implemented the code as you wrote but it does not work. I have put in like this. This is how my custom.css file looks like now. What have I done wrong? Please advise.

/* Have fun adding your style here :) - PS: At all times this file should contain a comment or a rule, otherwise opera might act buggy :( */

/* General Custom CSS */

.main_menu { right: auto !important; left: 310px !important; }
.main_menu > div > ul > li > a > .avia-menu-text {
color: #f8f8f8;
font-weight: normal;
font-size: 16px;
text-shadow: 0 2px 2px #000000;
    
     !important; 
}

#menu-item-755 > .avia_mega_div {
    right: -850px !important;
}

#header .mega_menu_title {
font-weight: normal;
color: #f9f9f9;
font-size: 18px; !important;
}

.main_menu .sub-menu > li > a > .avia-menu-text {
font-weight: normal;
color: #d0d0d0;
font-size: 14px; !important;
}

@media only screen and (min-width: 480px) and (max-width: 767px) {
#menu-item-755 > .avia_mega_div {
    right: 0px !important !important;
}
}

/*
Desktop Styles
================================================== */
/* Note: Add new css to the media query below that you want to only effect the desktop view of your site */

@media only screen and (min-width: 768px) {
  /* Add your Desktop Styles here */

}

/*
Mobile Styles
================================================== */
/* Note: Add new css to the media query below that you want to only effect the Mobile and Tablet Portrait view */

@media only screen and (max-width: 767px) {
  /* Add your Mobile Styles here */

}

Looking forward to your reply.

I can see what’s causing it. I added some custom CSS to increase the height of the phone info part of the header

.phone-info {
font-family: ‘Architects Daughter’, ‘HelveticaNeue’, ‘Helvetica Neue’, Helvetica, Arial, sans-serif;
float: left;
font-weight: bold;
font-size: 22px;
padding: 20px 0 20px 0;
}

Nay help you can give me to resolve this would be great. I want to keep the phone info formatting but need the rest of the theme to behave as it should.

Thanks

Hi Ismael,

thank you. But neither does work for the body text, I increased the font size per Avia page builder before. Only for the parts, where the body font size is set to default.

Do you know what I mean?

Jan

Thanks for the quick response. I can’t give you a link to the page, because the website is not yet live.

Here are the icons (code) I am trying to use…

[av_font_icon icon='ue8f5' font='entypo-fontello' style='' caption='' link='' linktarget='' size='40px' position='left' color='' custom_class=''][/av_font_icon] [av_font_icon icon='ue8f1' font='entypo-fontello' style='' caption='' link='' linktarget='' size='40px' position='left' color='' custom_class=''][/av_font_icon] [av_font_icon icon='ue8f6' font='entypo-fontello' style='' caption='' link='' linktarget='' size='40px' position='left' color='' custom_class=''][/av_font_icon] [av_font_icon icon='ue805' font='entypo-fontello' style='' caption='' link='' linktarget='' size='40px' position='left' color='' custom_class=''][/av_font_icon]

Strangley enough I added an advanced layer slider section to the bottom of that page and it made the font size in that page correct if I remove the layer slider it goes back to fat font.
Please look at it again as I have now removed the layer slider from the bottom of the page. It’s also still wrong on the other pages see links in my question.
They all work fine when logged into WordPress though. Chrome is the main issue safari seems ok. If I am logged into WordPress chrome shows the headings corectly, when not logged in the links in my post are fatter special headings. I can supply login details if you would like?