/* nawigacja */
nav { position:sticky; top:0; width:100%; z-index:5; }
.menu { background:var(--bg1); list-style:none; transition:.5s; }
.menu ul { list-style:none; }
.navIN .menu { background:#111140d1; }
.menu li { margin:0; }
.menu li { position:relative; margin:0; padding-left:0; }

.menu a { text-decoration:none; padding:.75em 1.5em; display:block; color:#eee; text-align:center; }
.navIN .menu a { transition:.5s; padding:.3em 1.5em;  }
.navIN .menu ul a { padding:.75em 1.5em;  }
.menu .current_page_item > a, .menu .current-page-parent > a { color:var(--nav-ah); }
.menu .current_page_item > a path { fill:var(--nav-ah); }
nav a.no-after:hover:after { width:0 }
.menu a:hover {color:var(--nav-ah) }
.menu a svg { width:23px; height:23px; }
.menu a path { fill:#eee; transition:fill .5s; }
.menu a:hover path { fill:var(--nav-ah); }
/* submenu */
.menu ul { display:block; box-shadow:1px 3px 4px #22334480; position:absolute; top:49px; left:-1999px; z-index:9999; background:#cdf;}
.menu ul li { border-bottom:1px solid #678; }
.menu ul li:last-child { border-bottom:0; }
.menu ul a { padding:9px; min-width:200px; background:#123; color:#eee; }
.menu ul a:hover:after { background:inherit }
.showUL { display:none; }

@media(min-width:900px){
  .menu { grid-column:2/span 2; display:flex; }
  .navIN .menu ul { top:40px; }
  .menu li:hover ul { left:15px; animation:toBot .3s both; }
  .menu a:after { content:''; display:block; height:3px; background:#fff; transition:all .3s; position:absolute; left:50%; right:50%; bottom:0 }
  .menu a:hover:after, .menu a.active:after, .menu .current_page_item > a:after { left:0; right:0; }
  .menu ul a:after { content:none; }
}

@media(max-width:899px){
.topNav { min-height:50px; position:relative; background:var(--bg1); border-bottom:1px solid #568; }
.topNav label { position:absolute; top:0; left:0; width:100%; height:100%; z-index:0; background-image:linear-gradient(#8df, #8df); background-size:40px 3px; background-position:left 10px top 23px; background-repeat:no-repeat; }
.topNav label:before { content:''; position:absolute; top:11px; left:10px; width:40px; height:3px; background:#8df; }
.topNav label:after { content:''; position:absolute; top:35px; left:10px; width:40px; height:3px; background:#8df; }
.menu { display:none; position:absolute; top:50px; left:0; width:100%; background:#16172bf7; }
.menu.show { display:block; animation:toBot .3s both; }
.menu li { border-bottom:1px solid #568}
nav .showUL { display:flex; position:absolute; z-index:2; width:50px; height:50px; right:0; top:0; z-index:2; border-left:1px solid #dddddd20; background:linear-gradient(#dddddd20, #ffffff00); justify-content:center; align-items:center; }
nav .showUL svg { width:34px; height:34px; }
nav .showUL path  { fill:#8df;stroke:#8df;stroke-width:16; }
.menu ul { position:static; display:none; width:100%; }
.menu .current-page-parent ul { display:block; }
.menu ul a { background:#070711e8; }
.navIN .menu ul a { background:#111140c1; }
}