/* Menu for gestaltungen.ch */

#menu ul { margin: 0px; padding: 0px; font-size: 17px; }
#menu li { margin: 0px; padding: 0px; list-style: none; text-transform: uppercase; font-weight: 800; letter-spacing: 0.05em; text-align: center; }
#menu li a { color: #999999; padding: 13px 20px 15px 20px; display: block; border-top: 3px solid #2a2a2a; transition: .3s ease-out; border-bottom: 1px solid #353535; }

#menu li:hover a { color: #ffffff; border-top: 3px solid var(--tuerkies); }
#menu li.active a { color: #ffffff; border-top: 3px solid var(--tuerkies); }




#impress ul { margin: 0px; padding: 0px; display: flex; flex-wrap: wrap; }
#impress li { margin: 0px; padding: 0px; list-style: none; }
#impress li::after { content: "|"; padding: 0px 8px; }
#impress li:last-child::after { display: none; }

#impress li a { color: #ffffff; font-weight: 700; }




#menu-small { cursor: pointer; position: relative; width: 30px; height: 30px; margin: 0px auto; }
.menu-global { -webkit-backface-visibility: hidden; backface-visibility: hidden; position: absolute; left: 0; border-top: 1px solid #ffffff; width: 100%; transition: 0.55s; }
.menu-top { top: 0; }
.menu-middle { top: 8px; }
.menu-bottom { top: 16px; }
.menu-top-click { -webkit-backface-visibility: hidden; backface-visibility: hidden; top: 8px; transform: rotate(43deg); transition: 0.55s 0.5s; }
.menu-middle-click { opacity: 0; }
.menu-bottom-click { -webkit-backface-visibility: hidden; backface-visibility: hidden; top: 8px; transform: rotate(-403deg); transition: 0.55s 0.5s; }





@media(min-width:800px)
{
    #menu ul { margin: 0px; padding: 0px; display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 0px; font-size: 15px; }
    #menu li { margin: -3px 0px 0px -1px; }
    #menu li a { display: inline-block; border-bottom: 0px; }

    #menu li::before { content: ""; color: #ffffff; border-left: 1px solid #353535; padding: 8px 0px 8px 0px; }

}