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!

Hello,

more over I have got one more technical question: referring to the test page: neu.praxis-ganesha.de
the submenu for the menu items “weitere Leistungen” and “Praxis” is displayed in the Safari browser very bad: the font is barely legible and looks as if covered by a white area. It works perfectly in all other browsers. What can I do that it is still readable in Safari?

Thanks
Best regards
Diana

Hello,

I have set an “easy slider” in the top section, where images fade in and out. Each image is linked to a current site.
I don ´t like the look of the rollover-link-button (big black circle with the curved arrow) . Where and how can I change the look of this button?

Thank you
Best regards
Diana

Thanks a lot. This is working very well!
Best regards, Loola