            /* STYLE POUR LE NAVABAR ET FIL ARIANE */
.navbar-container{display:flex;justify-content:center;align-items:center;margin:10px}.logo{display:flex;justify-content:center;align-items:center;width:20%}
.menu-item a:hover {color: #ff0000;font-weight: bold;}

 .navbar{background-color:#000;padding:20px;box-sizing:border-box;margin-bottom:10px;margin-left:0px;margin-right:0px;font-size: 20px;}.menu{list-style-type:none;padding:0;margin:0;display:flex;flex-direction:row}.menu-item{margin-right:10px;position:relative}.menu-item a{color:#fff;text-decoration:none;padding:5px;display:block}.submenu{display:none;position:absolute;background-color:#444;min-width:150px;z-index:1;list-style-type:none}.submenu li{margin:0}.submenu li a{color:#fff;padding:10px;display:block}.active-menu{background-color:red}

@media (max-width:575.98px) {
    .navbar {
        width: 100%;
    }
  .menu {
    flex-direction: column;
    display: none;
    margin-top: 30px
  }

  .menu-item {
    margin-right: 0
  }

  .navbar svg {
    display: block;
    cursor: pointer
  }

  .submenu {
    position: relative
  }

  .menu.open {
    display: flex
  }

  svg {
    display: block
  }
}

@media (min-width:576px) and (max-width:767.98px) {
      .navbar {
        width: 100%;
    }
  .menu {
    flex-direction: column;
    display: none;
    margin-top: 30px
  }

  .menu-item {
    margin-right: 0
  }

  .navbar svg {
    display: block;
    cursor: pointer
  }

  .submenu {
    position: relative
  }

  .menu.open {
    display: flex
  }

  svg {
    display: block
  }
}

@media (min-width:768px) and (max-width:991.98px) {
  .menu {
    flex-direction: row
  }

  .menu-item {
    margin-right: 0px
  }

  .submenu {
    position: absolute;
    width: 325px
  }

  svg {
    display: none
  }
}

@media (min-width:992px) and (max-width:1199.98px) {
  .menu {
    flex-direction: row
  }

  .menu-item {
    margin-right: 0px
  }

  .submenu {
    position: absolute;
    width: 325px
  }

  svg {
    display: none
  }
}

@media (min-width:1200px) {
  .menu {
    flex-direction: row
  }

  .menu-item {
    margin-right: 0px
  }

  .submenu {
    position: absolute;
    width: 325px
  }

  svg {
    display: none
  }
}


