Hi there

For our client, we are recreating the following website http://www.lichtsteiner-stiftung.ch/ in wordpress.
Of course in enfold ;)

The “big problem” ist the open and close function that the boxes have (the plus and minus sign in the top right corner and the [MEHR] and [WENIGER] that stands for more and less in german below the teaser texts.)
Does somebody know if it’s possible to use the accordion element for the hidden content and have a second trigger to activate it? Then we could place it below the text and just add the trigger as a plus and minus sign.
Unfortunately im only good in html and css, so jquery and javascript things are a problem for me.

Maybe someone could help, or knows a workaround with a plugin or something.

Thanks!

hello,

i’m having some element issues on the Arabic side of my site again, first of all here is the codes you gave me so far to fix most issues:

.rtl .post-title, .rtl .slide-entry-title {
    letter-spacing: 0.01em!important;
}
ul.avia_wpml_language_switch_extra {
display:none !important;
}
.responsive #top .avia-team-member .team-social {
    max-width: 300px;  
    margin: 0 auto;
}
@media only screen and (max-width: 767px) {
.responsive.html_mobile_menu_tablet.html_logo_right #advanced_menu_toggle {
    left: 5px !important;
}
}
.iconbox_left .iconbox_icon {
    left: 5px;
}
@media only screen and (max-width: 767px) {
	.responsive #header_meta .social_bookmarks li {
	    border: 0 !important;
	}

    #header_meta .container{
        text-align: center;
    }

    #header_meta .container > * {
        display: inline-block;
        width: auto !important;
        padding: 0;
    }

    #header_meta .phone-info.with_nav {
        position: absolute;
        right: 0;
        top: 5px;
    }

    #header_meta .responsive #header .social_bookmarks {
        position: absolute;
        left: 0;
    }
.sub_menu {
    position: absolute !important;
    left: 0;
    right :0;
    top: 0px;
    margin: 0 auto;
}
}
.rtl #header .social_bookmarks li:last-child {
    border-right: 1px solid #e2e2e2!important;
}
.rtl .av_secondary_left .sub_menu>ul>li:last-child, .rtl .av_secondary_left .sub_menu>div>ul>li:last-child {
    padding-right: 10px;
}
.rtl .sub_menu {
    padding-right: 0;
    padding-left: 10px;
}
.rtl #header .social_bookmarks li:first-child {
    border-right: none!important;
}
.avia-tooltip.avia-tt {
    width: 200px;
}
.av_header_transparency a .avia-menu-text{
    color:#fff!important;
}
.av_header_transparency .phone-info a {
    color: #ffffff;
}
@media only screen and (max-width: 767px) {
#header_meta .phone-info a {
    color: black;
}}
#top #wrap_all .av_header_transparency .sub_menu > ul > li > a {
    color: #ffffff;
}
#top.rtl #header .social_bookmarks li:last-child {
    border-color: rgba(255,255,255,0.25) !important;
}

#top.rtl #header.header-scrolled .social_bookmarks li:last-child {
    border-right: 1px solid #e1e1e1 !important;
}
@media only screen and (min-width: 767px) {
  a#advanced_menu_toggle {
    color: white!important;
  }

  .header-scrolled a#advanced_menu_toggle {
    color: #000 !important;
  }
}
@media only screen and (max-width:960px) {
	#header_main .container.av-logo-container {
	  padding: 9;
	  max-width: 100%;
	}

	#advanced_menu_toggle {
	  left: 10px !important;
	}
}

1) first of look at this picture of the home page, this is when it is first loaded (no scroll), its perfect, no issues
https://www.dropbox.com/s/se5uhawt671qxcv/Home%20page%20when%20first%20loaded.png?dl=0
2) look at the home page when i scroll down a little and the header turns to sticky, it perfect as well
https://www.dropbox.com/s/wzznf2908ehy62i/Home%20page%20after%20scroll.png?dl=0
3) heres a look at another page, you can see the lines are missing on the social media
https://www.dropbox.com/s/cj4e9n3rekgzh5n/Page%20when%20first%20loaded.png?dl=0
4) after i scroll down it works normally
https://www.dropbox.com/s/yuqcibnon5lmfo2/Page%20after%20scroll.png?dl=0
5) i don’t know if this is part of the issue, but look at the share icons under the comments and you will see there is a line missing there as well
https://www.dropbox.com/s/6n17a5ir8pqglys/Share%20icons%20on%20blog%20page.png?dl=0

The issue with these lines is non stop, if i set lines between the menus in the main header there will be lines missing and such. please let me know what to remove and add in the code above to fix all these issues.

I also hope you guys can fix these issues as i love this theme and i’m getting many jobs coming up in Arabic, and i don’t want to try another theme for those jobs, but i will have to if i cant fix these issues.

I put the following code (provided by you) in the custom.css file and in Theme General Styling. It worked for one of my sites. I have two, using the same theme for both. Can you take a look why the changes are not working on this particular site? The goal is to reverse the sizes of the text in the testimonial carousel. Where the name is larger and the quote is smaller. I’ll put login info in private section.

strong.avia-testimonial-name {
font-size: 7px !important;
}
.avia-testimonial-content {
font-size: 10px !important;
}
#top .av-large-testimonial-slider .avia-testimonial-meta {
margin-top: 7px;
}

Im trying to change the icon boxes to text, I enabled classes on all elements, gave the Icon box the class of iconBox1 and added this css code into
quick css. Can’t get anything to show. Any ideas? Website login info below

.iconBox1 [data-av_icon]:before {
   content: "car 1225 "!important;
}

referencing this post