Hi,
For the promo box, please try:

#top.single.no_sidebar_border .container_wrap.fullsize .avia-promocontent p { 
font-size: 17px !important;
}

Which paragraph that sits right after “[av_hr class..” ? Is that a heading? Please include the first line of text so I can search for it.

Best regards,
Mike

Hi,
It looks like your “su-row” font sizes are hardcoded in the shortcode at 20px, but this css seems to be working:

#top.single.no_sidebar_border .container_wrap.fullsize .su-row div { font-size: 17px !important;}

Please clear your browser cache and site cache and then check.

Best regards,
Mike

Hi,

Thanks for the update.

Did you set the Enfold > Main Menu > “Menu Items for mobile” settings to the second option? That is going to force the mobile menu to display on tablet screens. We can also decrease the space between the menu items or adjust their font size in order to create more space between the menu container and the logo.

@media only screen and (max-width: 1024px) {
.av-main-nav > li > a {
    padding: 0 8px;
    font-size: 12px;
}

.logo img {
    height: 66px;
    top: 10px;
}
}

Best regards,
Ismael

Hi,
I added a custom class to your red book icons “red-book” so that it will be easier to control. I then added this css for mobile devices:

@media only screen and (max-width: 767px) { 
.red-book {
margin-top: 20% !important;
}
}

But I have a question about these two icons, so there are two of them but the right one is off the screen until 1130px, so it is not showing for mobile or tablet. Did you want it to show? For desktop when they both show they seem a little off, that is not quite on the sides of the heading but also not quite under the heading. Please see the screenshot in Private Content area. Is this how it looks to you?

For the heading font size to be smaller on mobile I have added this css:

@media only screen and (max-width: 767px) {
#top #wrap_all .av-layout-grid-container .av-inherit-size .av-special-heading-tag {
    font-size: 0.6em !important; 
}
}

The size was “0.8em” and the code above sets it to “0.6em” please feel free to adjust if you wish.
I didn’t see a red margin or a overlap, so I’m not sure what your last question was, please explain.

Best regards,
Mike

Hi,
Thank you for the login, I added this css to your WordPress > Customize > Additional CSS:

#top.single.no_sidebar_border .container_wrap.fullsize p {
font-size: 17px !important;
}

I found that added the css to your Enfold Theme Options > General Styling > Quick CSS field it didn’t seem to work correctly and I believe this is because you have this function in your Quick CSS field:

add_filter('avia_masonry_entries_query','avia_masonry_entries_query_mod', 10, 2);
function avia_masonry_entries_query_mod($query, $params)
{
    if(is_singular('post')) {
        $query['post__not_in'] = array(avia_get_the_ID());
    }
    return $query;
}

This function will not work correctly there, it belongs in your functions.php file in Appearance > Editor
For it to work you may wish to move it.
Please clear your browser cache and check the font size issue.

Best regards,
Mike

Hi,
Ok I tested on a Mac and adjusted the css to this:

@media only screen and (min-width: 767px) and (max-width: 1400px) { 
span.avia-menu-text {
font-size: 50% !important;
}
}

Please clear your browser cache and check.

Best regards,
Mike

Hey artemtik,
Sorry for the late reply, I was not able to reproduce this on my install, were these advanced layout builder posts or Classic Editor posts? Was this for the paragraph font size? Can you link to an example post, we could write some css to force a certain size but we should take a look to see what could be causing this.

Best regards,
Mike

Hi,
Sorry for the late reply, there is a possibly to un-mute the sound for your background video in your color section, but it will most likely have to be a “click” action. This is because of the limitations on auto playing videos in the browsers.
Please try following the instructions on this post

Another option is the test page I built for you, please see the link in the Private Content area. I used the “fullscreen slider” and added your video with a title “click to watch” and I added the countdown timer in the caption with this shortcode:

[av_countdown date='03 / 30 / 2019' hour='10' minute='0' min='1' max='4' align='av-align-center' size='' style='av-trans-light-style' av-medium-font-size-title='' av-small-font-size-title='' av-mini-font-size-title='' av-medium-font-size='' av-small-font-size='' av-mini-font-size='' av_uid='' admin_preview_bg='']

On click it will play the video with sound. You could have the video auto play, but it won’t play the sound on click because of the browser limitations.

Best regards,
Mike

Hey Sam,
One option is to increase the screen size that the mobile menu shows at, such as having it show until 1274px.
Another option is to decrease the font-size for the menu items until 1274px.
Please try this code in the General Styling > Quick CSS field or in the WordPress > Customize > Additional CSS field to try the second option:

@media only screen and (min-width: 767px) and (max-width: 1274px) { 
span.avia-menu-text {
font-size: 70% !important;
}
}

Please feel free to adjust the font size to suit, and then clear your browser cache and any cache plugin, and check.

Best regards,
Mike

Hi,

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

.home .slide-meta-del, .home .slide-meta-time, .home .blog-categories {
  display:none;
}

.home .slide-entry-title a {
  font-size:28px;
  padding-top:40px;
}

Best regards,
Rikard

Hi,
I removed your text block element for manufaktur and placed the word in a code block wrapped in a span with the class “manufaktur”
this allowed me to move it without affecting the icons, and kept everything center in your section.
I also gave the font-size a “visual width” instead of a “px” this way as the screen size changes the word will remain “full width”
The only problem is that the z-index is not working well, so I’m having trouble putting the word behind the icons, I used opacity as a work around.
Please clear your browser cache and check.
This is the css I added to the code block:

span.manufaktur {
    display: flex;
    justify-content: center;
    font-size: 16vw;
}

span.manufaktur strong {
color: #d3d3d3 !important; 
margin-top: -63vh;
opacity: .30;
}

We will need to write some more css to adjust the position of the word for other screen sizes. What do you want to do when the icons brake into 2 columns, and then into 1 column? At some point do you want to just hide the word?

Best regards,
Mike

Hi,
Thank you for sharing your solution, I’m sure others will find this helpful.
Another way would be to adjust the font size on certain screen widths, like this:

@media only screen and (max-width: 767px) { 
#av_section_1 .post-entry-3031 h2 span {
font-size: 14px !important;
}
}

Your desktop font size is 28px, so this splits it in half.

Best regards,
Mike