.sidebar-right{
  position: fixed;
  width: 20%;
  height: 100%;
  right: calc( -20% + 0.9rem);
  top: 0;
  transition: 0.3s right ease;
  #icone_list{
    z-index: 999;
    position: fixed;
    top: 0;
    right: 0;
    .hamburger{
      padding: 0.8rem;
      padding-right: 2rem;
      .hamburger-box{
        width: 30px;
        .hamburger-inner{
          height: 2px;
          width: 30px;
          &::before{
            width: 20px;
            height: inherit;
          }
          &::after{
            height: inherit;
            width: inherit;
          }
        }
      }
    }
  }
  .list-projets{
    height: 100%;
    overflow: auto;
    .container{
      margin: auto;
    ul{
      text-align: left;
      margin: 0;
      span.cat{
        display: block;
        line-height: 3rem;
        font-weight: bold;
        padding-left: 23px;
      }
      li{
        display: inline-flex;
        width: 100%;
        margin-top: -6px;
        &::before{
          content: " ";
          display: inline-block;
          min-width: 15px;
          height: auto;
        }
        &.culturelle{
          &::before{
            background: $color_culturelle;
          }
        }
        &.sociale{
          &::before{
            background: $color_sociale;
          }
        }
        &.publique{
          &::before{
            background: $color_publique;
          }
        }
      }
      a{
        color: black;
        display: block;
        padding-left: 0.5rem;
        &.active{
          color: black;
        }
        &:hover{
          background: white;
          transition: 0.3s background ease;
        }
      }
    }
    }
  }
  &.is-active{
      right: 0;
      transition: 0.3s right ease;
  }
}