/*
© 2023 Elemete® Studio
Toute reproduction interdite - Aucune copie ou modification autorisée - Tous droits réservés
No copy or modification allowed - All rights reserved
*/
.nav-sub
{
  position:absolute;
  width:300px;
  left:100px;
  top:calc(3vh);
  height:calc(100vh - 3vh);
  background:black;
}
.nav-sub-section
{
  position:absolute;
  top:105px;
  height:calc(100% - 210px);
  left:5px;
  width:290px;
}
.nav-sub .splide__slide>div
{
  height:80px;
  color:white;
  text-align:left;
  /* top right bottom left */
  padding:10px 10px 10px 100px;
  width:190px;
  background-size:80px auto;
  background-position-x:calc(50% - 100px);
  background-position-y:center;
  background-repeat:no-repeat;
  display:table-cell;
  vertical-align:middle;
  font-size:1.1em;
  /* filter:hue-rotate(100deg); Ok pour le background */
  filter: grayscale(100%);
}
.nav-sub .splide__list>.is-active>div
{
  filter: grayscale(0%);
}


.nav-sub-footer
{
  position:absolute;
  bottom:0px;
  height:80px;
  color:white;
  padding:10px 10px 10px 100px;
  width:190px;
  display:table;
  background:#18191a;
}
.nav-sub-footer>.icon
{
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
  background-size:70px auto;
  background-position-x:calc(50% - 100px);
  background-position-y:center;
  background-repeat:no-repeat;
  background-image:url("/.com/img.nav/Elemete Block.png");
  filter: grayscale(100%);
}
.nav-sub-footer>.txt
{
  display:table-cell;
  vertical-align:middle;
}


.My-Role
{
  width: 300px;
  margin-left:0px;
}
.My-Role > ul
{
  text-align: left;
  height: 100px;
}
.My-Role .sous-menu {
  margin-top: 100px;
}
.My-Role  > ul > li > a {
  left: 110px;
  transform: translate(0%, -50%);
}

.My-Role  > ul > li
{
  background-image:url("/.com/img.nav/blocks/Role Block.100px.png");
  background-size:40px auto;
  background-position-x:calc(50% - 100px);
  background-position-y:center;
  background-repeat:no-repeat;
  filter: grayscale(100%);
}
.My-Role  > ul > li:hover
{
  filter: grayscale(0%);
}