/* cmsms stylesheet: menu_screen modified: 18/11/2021 23:06:29 */
li a:visited {color:#ccc}
li:hover>a {background-color:#05F}
li a:hover {color:#f00}
li a:focus {color:#f80}

nav {
 position:fixed;
 margin:0 auto;
 top:0;
 left:5rem;
 right:5rem;
}

nav ul a {
 transition-property:border-radius;
 transition-duration:0.6s;
}

nav ul ul {
 transition-property:transform;
 transition-duration:0.6s;
 position:absolute;
 background-color:rgba(0,0,0, 0.3);
 z-index: -1;
}
nav li {
 display:block;
 position:relative;
}

nav a {
 color:#888;
 background-color:#fff;
 display:block;
 border-width:0.2rem;
}

nav>ul>li {
 margin:0 1rem;
 float:left;
}

@supports (display: flex) {
 nav>ul {
  display:flex;
  justify-content:center;
 }
}

/*nav>ul>li.haschild {
 padding-bottom:1rem;
 background-repeat: no-repeat;
 background-position: center 60%;
 background-size: 2rem;
 background-origin: padding-box;
 background-image: url(/uploads/images/icons/fleche_v1.svg);
 transition-property:background-position;
 transition-duration:0.6s;
}*/

nav>ul>li>a {
 padding:0.5rem 1rem;
 border-radius: 0 0 0.5rem 0.5rem;
 border-style: none solid solid solid;
 border-color:#000;
}

nav>ul>li>ul {
 transform:translateY(-50%) scaleY(0);
 min-width: 100%;
}

/*nav>ul>li>ul li.haschild {
 margin:0;
}*/

nav>ul>li>ul li.haschild>a {
 padding-right:1rem;
}

nav>ul>li>ul li:last-child>a {margin-bottom:0}

nav>ul>li>ul li>a {
 padding:0.5rem 1rem;
 background-repeat: no-repeat;
 background-color:#222;
 border-style:solid;
 border-color:#000;
 margin:1em 0;
 border-radius: 0.5rem;
 white-space: nowrap;
}

nav>ul li.haschild:hover>a {
 border-radius: 0rem;
}

nav>ul>li:hover>ul {
 transform:translateY(0%) scaleY(1);
}

nav>ul li li ul {
 left:100%;
 top:-1rem;
 transform:translateX(-50%) scaleX(0);
}

nav>ul li li:hover>ul {
 transform:translateX(0%) scaleX(1);
}

nav>ul li.activeparent>a {border-color:#F80}
nav>ul li.currentpage>a {border-color:#F00}
nav>ul>li.haschild:hover::after {
  bottom: -1.6rem;
  background-size: 2rem;
  zz-index: 2;
}
nav>ul li li.haschild:hover>a::after {
 background-size: 1.5rem;
 background-position: 100% center;
}
nav li li li {
 margin-left: 0.5rem;
}
nav>ul>li>ul li.haschild>a::after {
 content: ' ';
 z-index: 2;
 position: absolute;
 right: -1rem;
 width: 2rem;
 margin: -1rem 0;
 padding: 1rem 0;
 background-repeat: no-repeat;
 background-position: 0% center;
 background-size: 1rem;
 background-origin: padding-box;
 background-image: url(/uploads/images/icons/fleche_h1.svg);
 transition-property:background-position,background-size;
 transition-duration:0.6s;
}
nav>ul>.haschild::after {
 content: " ";
 background-repeat: no-repeat;
 background-position: center;
 background-size: 1rem;
 background-origin: padding-box;
 background-image: url(/uploads/images/icons/fleche_v1.svg);
 transition-property:bottom,background-size;
 transition-duration:0.6s;
 position: absolute;
 z-index: -1;
 height: 2rem;
 bottom: -1rem;
 width: 100%;
}