Oh no, I just saw that I made an incorrect entry in the last post when making the request: all menu items should show the height of the main navigation (and not as indicated by mistake in the submenu). For the main menu I have defined a line-height: 2.0em. However, he does not accept this setting for the submenu. How can I customize the submenu?
Thank you and best regards Diana

Hey Ismael,

the page is: https://www.osmosis.de/NEU/staedtebau/
Thanks for your help!
Diana

Good morning Mike,

Thank you for the further support.
The script with the definition of the button length works very well! Many Thanks

To the previous second point:
Unfortunately, adding the script “top: 50px! Important;” to the # menu-item-3422 – as suggested – unfortunately no effect. So now I have the supplement “margin-top: 50px;” inserted: .avia-menu.av-main-nav-wrap ul li ul li # menu-item-3584 {max-width: 130px! important; height: 22px! important; margin-top: 50px! important;}
That works now.

Basically, there is still a big problem with the submenu:
Even though I have already adjusted the height of the submenu items to 24px in the css, they still appear in a different, much larger height and, above all, overlap themselves: see screenshot: https://osmosis.de/support/screen4.pdf

Where does this overlap and the height of the submenu items come from?
Thanks and best regards
Diana

Dear Mike,

Thanks for the tip. I have implemented your proposal once and removed from the css all font-formatting scripts and instead formatted via the “Advanced setting” the navigation elements.
Unfortunately, the result is now again a new Drucheinander: https://www.osmosis.de/NEU/
I have not yet reset it and left it in this condition, first of all I wanted to ask you first whether you think that this is the way to go? Or if I should return to the old css again.
Here again a screenshot of the previous state (without css) – Change: https://www.osmosis.de/support/screen1.png

I do not work on the theme today, so you’re welcome to tweak the css.

Below I will send you a copy of my css – before I have deleted formatting concerning the navigation colors.

.header_color .header_bg {
background-color: transparent!important;
}
/* Header transparent */
.header_bg { background-color: rgba(255,255,255,0.5)!important; }
#main { margin-left: 0px !important; }

/* Abstand Logo Rand*/
.html_header_sidebar .logo {
padding-left: 41px;
width: 220px;
}

.header_color nav,.header_color div,.header_color nav ul,.header_color span {
border-color: transparent !important;
}

/* NAV Button kontakt Abstand*/
.html_header_sidebar #header .av-main-nav > li#menu-item-3889 > a {
margin-bottom: 60px;
}
/* NAV Buttons Abstand*/
.html_header_sidebar #header .av-main-nav > li > a {
line-height: 1.7em;
height: auto;
padding: 0px 3px;
border-bottom-style: solid;
border-bottom-width: 0px;
margin: 0 auto;
}

/* NAV Aktuell */
#top #header .av-main-nav > li#menu-item-3426.current_page_item > a .avia-menu-text {
color: #ffffff;
background-color: #000000;
width: 107px;
}
#menu-item-3426 .avia-menu-text:hover, #menu-item-3426 .avia-menu-text:active {
color: #ffffff;
background-color: #000000;
width: 107px;
}
#menu-item-3426 .avia-menu-text {
color: #000000;
background-color: #ffffff;
width: 107px;
}

/* NAV ÜberUns */
#top #header .av-main-nav > li#menu-item-3425.current_page_item > a .avia-menu-text {
color: #ffffff;
background-color: #000000;
width: 125px;
}
#menu-item-3425 .avia-menu-text:hover, #menu-item-3425 .avia-menu-text:active {
color: #ffffff;
background-color: #000000;
width: 125px;
}
#menu-item-3425 .avia-menu-text {
color: #000000;
background-color: #ffffff;
width: 125px;
}

/* NAV Kontakt */
#top #header .av-main-nav > li#menu-item-3889.current_page_item > a .avia-menu-text {
color: #ffffff;
background-color: #000000;
width: 121px;
}
#menu-item-3889 .avia-menu-text:hover, #menu-item-3889 .avia-menu-text:active {
color: #ffffff;
background-color: #000000;
width: 121px;
}
#menu-item-3889 .avia-menu-text {
color: #000000;
background-color: #ffffff;
width: 121px;
}

/* NAV Projekte */
#top #header .av-main-nav > li#menu-item-3424.current_page_item > a .avia-menu-text {
color: #ffffff;
background-color: #000000;
width: 117px;
}
#menu-item-3424 .avia-menu-text:hover, #menu-item-3424 .avia-menu-text:active {
color: #ffffff;
background-color: #000000;
width: 117px;
}
#menu-item-3424 .avia-menu-text {
color: #000000;
background-color: #ffffff;
width: 117px;
}

/* NAV Wettbewerbe */
#top #header .av-main-nav > li#menu-item-3423.current_page_item > a .avia-menu-text {
color: #ffffff;
background-color: #000000;
width: 170px;
}
#menu-item-3423 .avia-menu-text:hover, #menu-item-3423 .avia-menu-text:active {
color: #ffffff;
background-color: #000000;
width: 170px;
}
#menu-item-3423 .avia-menu-text {
color: #000000;
background-color: #ffffff;
width: 170px;
}

/* NAV Kategorie */
#menu-item-3422 .avia-menu-text {
color: #000000;
background-color: #ffffff;
width: 128px;
}

#menu-item-3422 .avia-menu-text:hover, #menu-item-3422 .avia-menu-text:active {
background-color: #000000;
color: #ffffff;
width: 128px;
}

/* Submenü ohne Feld*/
.html_header_sidebar #top .av-main-nav ul a {
padding: 0px 0px;
}

/* Submenü weisses Hintergrundfeld */
.header_color .main_menu ul ul, .header_color .main_menu .menu ul li a, .header_color .pointer_arrow_wrap .pointer_arrow, .header_color .avia_mega_div, .header_color .av-subnav-menu > li ul, .header_color .av-subnav-menu a {
background-color: transparent!important;
border: none;
}

.html_header_sidebar #header .av-main-nav > li:hover > a .avia-menu-text {
background-color: #000 !important;
}
.av-main-nav li#menu-item-3422 ul.sub-menu {
left: 4px !important;
position: relative !important;
}

/* Textgröße Submenü (und alle Menüs)*/
.avia-menu-text {
font-size: 16px;
font-weight: normal;
letter-spacing: 1px;
}

/* SUBNAV Buttons Kategorie Abstand*/
.html_header_sidebar #header .av-main-nav > li#menu-item-3422 > a {
padding-bottom: 60px;
}

/* SUBNAV Stadträume */
#menu-item-3584 {
color: #000000;
background-color: #ffffff;
width: 151px;
}
#menu-item-3584:hover {
color: #ffffff;
background-color: #000000;
}

/* SUBNAV Parks */

/* SUBNAV Bildung */
#menu-item-3845 {
color: #000000;
background-color: #ffffff;
width: 121px;
}
#menu-item-3845:hover {
color: #ffffff;
background-color: #000000;
}

/* SUBNAV Unternehmen */
#menu-item-3851 {
color: #000000;
background-color: #ffffff;
width: 167px;
}
#menu-item-3851:hover {
color: #ffffff;
background-color: #000000;
}

/* SUBNAV Gutachten */
#menu-item-3858 {
color: #000000;
background-color: #ffffff;
width: 140px;
}
#menu-item-3858:hover {
color: #ffffff;
background-color: #000000;
}

/* Beitrag Gallery */
#av_section_1 .container {
margin: 0;
padding: 0;
width: 100%;
max-width: 100%;
}

.home #av_section_5 .container .flex_column.av_one_full {
padding-left: 0 !important;
padding-right: 0 !important;
border: 0 !important;
}

#top #main .avia-section .template-page {
width: 100%;
border: none;
margin-left: auto;
padding-left: 0;
padding-top: 0;
margin-right: auto;
margin-top: 0;
padding-bottom: 0;
}

/* Footer Socket NAV */
.socket_color span {
color: #000000;
background-color: #ffffff;
font-size: 11px;
font-family: ‘Lato’
}
#socket .container {
padding-top: 20px;
padding-bottom: 20px;
}

/* Masonry Gallery Titel Overlay */
#top .av-caption-style-overlay .av-masonry-item-with-image .av-inner-masonry-content-pos {
display: table-cell;
vertical-align: bottom;
text-align: right;
}
#top .avia-post-nav {
visibility: hidden;
}
.avia_desktop .av-masonry-entry:hover .av-masonry-image-container {
-webkit-transform: none;
transform: none;
}

span.av-masonry-date { display: none; }

/* Masonry Gallery Image zoomIn*/
.flex_column av_two_fifth flex_column_div first avia-builder-el-2 el_after_av_hr el_before_av_one_fifth {
margin-left: 40px;
}

#top #wrap_all .all_colors h3 {
text-align: right;
}

/* Tabelle */
.avia-data-table.avia_pricing_minimal td {
text-align: left;
padding-left: 0px;
padding-top: 5px;
padding-bottom: 5px;
font-weight: 300;
}

/* Tabelle Spaltenbreite */
.avia-table-1 td:first-child {width: 27%}
.avia-table-1 td:nth-child(2) {width: 73%}

/* Tabelle Smartphone */
#top .main_color .avia-data-table.avia_pricing_minimal td {
color: #282b2e;
text-align: left;
}

.main_color td
{
border-color: #ffffff;
}
td {
font-size: 14px;
padding-top: 9px;
padding-right: 12px;
padding-bottom: 9px;
padding-left: 0px;
}

/* Subtitel Überschrift */
.av-subheading p:last-child {
margin-top: 20px;
}
#top #header .av-main-nav > li:hover > a .avia-menu-text {
color: #fff !important;
}

Dear Support Team,

Thanks for the support, so I could now progress and already create a submenu: it now appears exemplary for the menu item “KATEGORIE” (last menu item)

However, there are still 2 problems that are unsolvable for me:

1. I would like that the submenu does not appear to the right of the main menu item but below. (see template pdf https://osmosis.de/support/website_vorlage2.pdf). How do I have to change the script to put the submenu down?

2. As soon as you touch one of the submenu items with the mouse, the font of the main menu item changes, it turns white without the background turns black and is no longer legible. Actually, I wanted it so that the selected menu item always has a black background and the font is white.

Many thanks for your help!
Greetings DIana

Hello Mike,

thanks a lot for the css-script. It works perfectly! https://www.osmosis.de/NEU/

1. For my second question: sorry that I expressed myself unclear. I meant the white line between the logo and the navigation and the second white line below the navigation. I would like to have removed these lines. Can you help me?

2. For the further development of navigation, I have one more question:
if you click on one of the bottom 3 menu items (PROJEKTE, WETTBEWERBE, KATEGORIE) onClick should open a submenu in the vertical menu bar, as shown in the template https://osmosis.de/support/website_vorlage2.pdf.
Even if I have already created the submenu, it is not shown to me and I find no way to integrate it into the navigation. Could you show me a way here too?

Best regards
Diana

Thanks this documentation worked very well at first!
Best regards Diana

Hello Victoria,

could you perhaps tell me what kind of plugin I need for the feature and if it is compatible with ENFOLD?
Best regards Diana

Thank you !

I have one more question concerning the page http://neu.elianafe.com:
we would like to create this page bilingual. At the moment there is only a German version, but the whole content should be translated in English and at the top of the page (top right, as already created as text) should be able to switch between the German and the English content.
Since I do not have any experience with creating an English version, I wanted to ask how I manage this in the ENFOLD theme the most? Do I need a plugin for this? is this chargeable? And as a web designer can I buy this or does the customer need to buy it?

Thanks for your support!
Best regards Diana

Hello,

In a page for a customer I adapted the lightbox colors: we wanted a white background and the colors for writing in black. Everything is displayed correctly only the arrows for the forward and back navigation in the lightbox are not visible.
Could you please give me additional help:

I’ve changed the lightbox colors for a page as follows: http://stefanhunstein.de/Neu/salamis/

My Entries in the QUICK CSS:

/* Lightbox titel */
div .mfp-title {
font-size: 11px;
padding-top: 10px;
color: #000000;
}

.mfp-counter {
color: #000000;
font-size: 11px;
padding-top: 10px;
}

/* Lightbox Hintergrundfarbe */
.mfp-bg {
background-color:#ffffff!important;
}
/* Lightbox Transparenz */
.mfp-zoom-in.mfp-ready.mfp-bg, .mfp-zoom-in.mfp-ready .mfp-preloader {
opacity: 1;
}

/* Lightbox Schrift Farbe */
.mfp-wrap * {
color: #000000!important;
}

BEST REGARDS!!!! Thanks you!