Hi David!

Try with this:

.image-overlay {
    display: none !important;
}
.grid-image:before {
    content: attr(title);
    background: red;
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 1000;
    text-align: center;
    line-height: 180px;
    opacity: 0;
    font-weight: bold;
    font-size: 24px;
}

.grid-image:hover:before {
    opacity: 1;
}

.grid-image:before{
    transition: all linear 0.2s;
}

Cheers!
Josue

Hi Marcus M.!

Try changing line 772 in /enfold/config-templatebuilder/avia-shortcodes/slideshow.php from this.

if(trim($title) != "")   $title 	= "<h2 {$title_styling} class='avia-caption-title' $markup_name>".trim(apply_filters('avf_slideshow_title', $title))."</h2>";

To this.

if(trim($title) != "")   $title 	= "<span {$title_styling} class='avia-caption-title' $markup_name>".trim(apply_filters('avf_slideshow_title', $title))."</span>";

And then add this to your custom CSS.

.avia-caption-title { font-size: 20px; }

Regards,
Elliott

Hi!

Try adding this to your custom CSS.

#header_meta .sub_menu {
    left: 80px !important;
}
.av-main-nav > li > a > .avia-menu-text {
    font-size: 1.1em !important;
}

Regards,
Elliott

Hi!

You have this somewhere in your custom CSS which is turning it red.

.current-menu-item .avia-menu-text {
    color: #d1202f !important;
}

I couldn’t tell where because you have all of the CSS minified.

As for the menu overlapping the logo are you wanting to reduce font size of the menu? If so then you can do that in Dashboard > Enfold > Advanced Styling.

Best regards,
Elliott

• This reply was modified 11 years, 4 months ago by Elliott.

Hey Felix!

It should be like this:

.responsive #top #wrap_all #header {
    position: fixed;
}

@media only screen and (max-width: 767px) { 
.responsive #top #main {
    padding-top: 88px !important;
}
}

@media only screen and (max-width: 989px) {
.responsive .main_menu ul:first-child > li > a{
    font-size: 12px;
    padding: 0 6px;
}
}

Best regards,
Josue

Hi Russ!

I guess you are referring to CSS code that makes the logo collapse, look for this code in the child theme style.css (enfold-child/style.css):

.logo img { display: none !important; }
.logo {
    width: 30%;
    top: 15px;
}

.logo, .logo a {
    overflow: visible;
    height: auto !important;

}
.subtext > div {
   line-height: 10px;
}

.subtext .second-line{
    font-size: 16px;
    padding-left: 30px ;
    font-family: 'Quattrocento', serif;
    color: green;
}

Best regards,
Josue

Hey!

@fraktale911, You can do this, http://kriesi.at/documentation/enfold/turn-on-custom-css-field-for-all-alb-elements/, to add a custom class to your elements and then use CSS to change it’s size.

.your_class, .your_class h3 { font-size: 30px !important; }

@Schuns, If you want to use HTML then make sure to add it to the “HTML / Video / Audio” tab instead of the text tab.

Best regards,
Elliott

Hi!

@media only screen and (max-width: 479px) {
.responsive #top .slideshow_caption h2 {
font-size: 25px !important;
}}
@media only screen and (max-width: 479px) {
.responsive #top .slideshow_caption .avia-caption-content {
font-size: 20px !important;
}}

Change the number in px for “font-size” to your needs.

Cheers!
Andy

Hi!

use this to reduce font size:

.entry-content-wrapper .post-title {
font-size: 26px;
}

Best regards,
Andy