html.nav-visible, html.nav-visible body { overflow:hidden; max-height:100%; }
html.nav-visible > .wrapper { max-height:100%; overflow:hidden; }
html,body,.wrapper { overflow-x:hidden; }

.navigation-menu { position:absolute; right:40px; top:40px; z-index:4000; }
.admin-bar .navigation-menu { top:90px; }

.navi-toggler .navi-button { display:block; position:relative; width:28px; height:25px; overflow:hidden; cursor:pointer; transition:height 0.3s ease-in; }
.navi-toggler .navi-button > .button-segment { position:absolute; width:50%; height:50%; transition: transform 0.3s linear, width 0.3s ease-in; }
.navi-toggler .navi-button > .button-segment.segment-topleft { left:0; top:0; transform-origin: top left; border-top:2px solid #ffffff; }
.navi-toggler .navi-button > .button-segment.segment-topright { right:0; top:0; transform-origin: top right; border-top:2px solid #ffffff; }
.navi-toggler .navi-button > .button-segment.segment-bottomright { bottom:0; right:0; transform-origin: bottom right; border-bottom:2px solid #ffffff; }
.navi-toggler .navi-button > .button-segment.segment-bottomleft { bottom:0; left:0; transform-origin: bottom left; border-bottom:2px solid #ffffff; }
.navi-toggler .navi-button > .button-segment.segment-centerleft { top:calc(50% - 1px); height:2px; right:50%; background-color:#ffffff; }
.navi-toggler .navi-button > .button-segment.segment-centerright { top:calc(50% - 1px); height:2px; left:50%; background-color:#ffffff; }
.nav-visible .navi-toggler .navi-button { height:29px; }
.nav-visible .navi-toggler .navi-button > .button-segment.segment-topleft,.nav-visible .navi-toggler .navi-button > .button-segment.segment-topright { width: 70.71%; }
.nav-visible .navi-toggler .navi-button > .button-segment.segment-bottomleft,.nav-visible .navi-toggler .navi-button > .button-segment.segment-bottomright { width: 70.71%; }
.nav-visible .navi-toggler .navi-button > .button-segment.segment-topleft { transform:rotate(45deg); }
.nav-visible .navi-toggler .navi-button > .button-segment.segment-topright { transform:rotate(-45deg); }
.nav-visible .navi-toggler .navi-button > .button-segment.segment-bottomleft { transform:rotate(-45deg); }
.nav-visible .navi-toggler .navi-button > .button-segment.segment-bottomright { transform:rotate(45deg); }
.nav-visible .navi-toggler .navi-button > .button-segment.segment-centerleft,.nav-visible .navi-toggler .navi-button > .button-segment.segment-centerright { width:0; }

.navigation-container { position: absolute; right:-400px; width:400px; top: 0; visibility:hidden; bottom: 0; min-height:100vh; overflow-y: auto; -webkit-overflow-scrolling: touch; z-index:3000; background-color:#414141; -webkit-transition: width 0.6s, right 0.6s, opacity 0.6s, visibility 0.6s; transition: width 0.6s, right 0.6s, opacity 0.6s, visibility 0.6s; }
.nav-visible .navigation-container { right:0; opacity:1; visibility:visible; }
.navigation-cover { position:fixed; top:0; left:0; width:100%; height:100%; visibility:hidden; z-index:3; opacity:0; background-color: #fff; -webkit-transition: opacity 0.6s; transition:opacity 0.6s, visibility 0.6s; }
.nav-visible .navigation-cover { z-index:2999; visibility:visible; opacity:0.4; transition:opacity 0.6s; }

.navigation-container .navigation { padding-top:90px; }
.admin-bar .navigation-container .navigation { padding-top:140px; }
.navigation-container ul { list-style:none; padding-left:30px; }
.navigation-container ul > li > .sub-menu { display:none; list-style:none; padding:0; margin:0 0 25px; }
.navigation-container ul > li.menu-item-has-children { position:relative; }
.navigation-container ul > li > a, .navigation-languages > a { margin-bottom: 15px; font-weight:bold; text-transform:uppercase; }
.navigation-container ul > li > ul > li > a {font-weight: normal; text-transform: none;}
.navigation-container ul > li > ul > li > a, .navigation-languages > ul > li > a { margin-bottom: 7px; }
.navigation-container li > a { color:#D6D6D6; font-size:16px; display:inline-block; }
.navigation-container li > a:hover, .navigation-container li > a:active, .navigation-container li > a:focus, .navigation-container li > a.active { color: #fff; text-decoration:none; }
.navigation-languages a { color:#fff; font-size:16px; display:inline-block; }
.navigation-languages a:hover, .navigation-languages a:active, .navigation-languages a:focus { color: #FFF; text-decoration:none; }
.navigation-languages { white-space:nowrap; position:relative; }
.navigation-languages > a { margin-bottom:0; padding-right:5px; }
.navigation-languages .language-toggler { display:inline-block; color:#fff; }
.navigation-languages > .sub-menu { display:none; position:absolute; top:100%; right:0; width: 100%; list-style:none; padding:0; margin:0 0 10px; }
.navigation-languages > .sub-menu > li > a { text-transform:uppercase; font-weight:bold; }

.navigation-menu-items { display:table-cell; white-space:nowrap; }
.navigation-menu-items > a.navigation-icon-link,
.navigation-menu-items > .navigation-languages { display:inline-block; vertical-align:middle; margin-right:20px; }
.navigation-menu-items > .navi-toggler { display:inline-block; vertical-align:middle; }