.toggle_menu,
[id^="drop"] {
  display: none;
}
nav#menu_vertical {
  margin: 0;
  padding: 0;
  background-color: #00368c;
}

.btn-dev {
    top: -2px;left: 7px;
}

nav#menu_vertical {
  width: 100%;
  position: fixed;
  top: 0;
  z-index: 100000;
  overflow: visible;
}

#logo {
  display: block;
  padding: 0;
  float: left;
}

nav#menu_vertical:after {
  content: "";
  display: table;
  clear: both;
}

nav#menu_vertical ul {
  float: left;
  padding: 0;
  margin: 0;
  list-style: none;
  width: 100%;
}
nav#menu_vertical ul {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: flex-start;
  align-content: center;
  align-items: center;
  overflow-x: scroll;
  width: 100%;
  list-style: none;
  padding: 0;
  margin: 0;
  overflow-y: visible;
  overflow-x: hidden;
  scrollbar-width: thin;          /* "auto" or "thin" */
  scrollbar-color: #cecece white;   /* scroll thumb and track */
}

nav#menu_vertical span#arraw_right {
    position: fixed;
    z-index: 100000;
    right: 0px;
    background: white;
    padding: 6px 4px;
    cursor: pointer;
}

nav#menu_vertical span#arraw_left {
    position: fixed;
    z-index: 100000;
    left: 0px;
    background: white;
    padding: 6px 4px;
    cursor: pointer;
}

nav#menu_vertical ul::-webkit-scrollbar {
  width: 10px;               /* width of the entire scrollbar */
  height: 10px;               /* width of the entire scrollbar */
}

nav#menu_vertical ul::-webkit-scrollbar-track {
  background: white;        /* color of the tracking area */
}

nav#menu_vertical ul::-webkit-scrollbar-thumb {
  background-color: #cecece;    /* color of the scroll thumb */
  border-radius: 0px;       /* roundness of the scroll thumb */
  border: 1px solid #cecece;  /* creates padding around scroll thumb */
}


nav#menu_vertical ul li {
  margin: 0px;
  background-color: #00368c;
  text-align: center;
  width: fit-content;
  word-break: keep-all;
  flex-shrink: 0;
  min-width: 100px;
  z-index: 1000;
  overflow-x: hidden;
}


/*nav#menu_vertical ul li {
  margin: 0px;
  background-color: #00368c;
  display: block;
  float: left;
  z-index: 1000;
}*/

nav#menu_vertical a {
  display: block;
  padding: 0 20px;
  color: #fff !important;
  font-size: 1rem;
  line-height: 2rem;
  text-decoration: none;
}

nav#menu_vertical ul li ul li:hover {
  background: #00368c;
  overflow-x: hidden;
}

nav#menu_vertical a:hover {
  background-color: #96c51d;
  color: #00368c !important;
  text-decoration: none;
}
nav#menu_vertical ul ul {
  display: none;
  position: absolute;
}

nav#menu_vertical ul li:hover > ul {
  display: inherit;
}
nav#menu_vertical label {
  margin-bottom: 0 !important;
}
nav#menu_vertical ul ul li {
  width: 280px;
  float: none;
  display: list-item;
  position: relative;
  text-align: left !important;
}

nav#menu_vertical ul ul {
  overflow-x: hidden;
}

nav#menu_vertical ul ul ul {
  overflow-x: hidden;
}

nav#menu_vertical ul ul ul li {
  position: relative;
  top: -2rem;
  left: 250px;
}

li > a:after {
  content: "";
}

li > label.toggle_menuhorizontal::after,
li > label.toggle_menu::after {
  content: "+";
  float: right;
}

/* Media Queries
--------------------------------------------- */

@media all and (max-width: 992px) {
  #logo {
    display: block;
    padding: 0;
    width: 100%;
    text-align: center;
    float: none;
  }
nav#menu_vertical span#arraw_right, nav#menu_vertical span#arraw_left {
    display: none;
}

  nav#menu_vertical {
    margin: 0;
  }

  .toggle_menu + a {
    display: none !important;
  }

  nav#menu_vertical ul {
      overflow-x: hidden;
      overflow-y: hidden;
      display: none;
  }

  nav#menu_vertical ul ul {
    display: none;
    position: absolute;
  }

  nav#menu_vertical ul li:hover > ul {
    display: none;
  }

  .toggle_menu {
    display: block;
    background-color: #00368c;
    padding: 0 20px;
    color: #fff;
    line-height: 3rem;
    text-decoration: none;
    border: none;
  }

  nav#menu_vertical ul li:hover > ul {
    display: none;
  }

  nav#menu_vertical a {
    display: list-item;
    line-height: 3rem;
  }

  .toggle_menuhorizontal {
    background-color: #97bf07;
  }

  .menu {
    display: none;
  }
  [id^="drop"]:checked + ul {
    display: block !important;

  }

  nav#menu_vertical ul li {
    display: block;
    width: 100%;
    text-align: left;
  }

  nav#menu_vertical ul ul .toggle_menu,
  nav#menu_vertical ul ul a {
    padding: 0 40px;
    line-height: 3rem;
  }

  nav#menu_vertical ul ul ul a {
    padding: 0 80px;
  }

  nav#menu_vertical a:hover,
  nav#menu_vertical ul ul ul a {
    background-color: #97bf07;
    text-decoration: none !important;
  }

  nav#menu_vertical ul li ul li .toggle_menu,
  nav#menu_vertical ul ul a {
    background-color: #5e88b3;
    color: #00126f;
    border-top: 1px solid;
  }

  nav#menu_vertical ul ul {
    float: none;
    position: static;
    color: #ffffff;
  }

  nav#menu_vertical ul ul li {
    display: block;
    width: 100%;
  }

  nav#menu_vertical ul ul ul li {
    position: static;
  }
}

@media all and (max-width: 330px) {
  nav#menu_vertical ul {
      overflow-x: hidden;
      overflow-y: hidden;
      display: none;
  }
nav#menu_vertical span#arraw_right, nav#menu_vertical span#arraw_left {
    display: none;
}
  nav#menu_vertical ul li {
    display: block;
    width: 94%;
  }
}

nav#menu_horizontal ul li:last-child {
  padding: 2px 0;
  margin: 0;
  list-style: none;
  width: 100%;
}

nav#menu_horizontal a.active {
  color: #000;
  background-color: #cce5ff !important;
  font-weight: bolder;
}

nav#menu_horizontal a:hover,
nav#menu_horizontal ul li label:hover {
  color: #000;
  background-color: #f4f5f2 !important;
}

nav#menu_horizontal > ul {
  padding-left: 0px !important;
  margin: 0;
}

nav#menu_horizontal ul ul li {
  width: 100%;
  float: none;
  display: block;
  position: none;
}

nav#menu_horizontal {
  margin: 0;
  border: 1px solid #000 !important;
}

.toggle_menuhorizontal + a,
.menu_horizontal {
  display: none;
}

.toggle_menuhorizontal {
  display: block;
  background-color: #00368c;
  padding: 0 20px;
  color: #fff;
  font-size: 1rem;
  line-height: 2.5rem;
  text-decoration: none;
  border: none;
}

nav#menu_horizontal a {
  line-height: 3rem;
}

.toggle_menuhorizontal:hover {
  background-color: #97bf07;
}

[id^="horizontaldrop"] {
  display: none;
}

input[id^="horizontaldrop"]:checked + ul {
  display: none;
}

input[id^="horizontaldrop"]:checked ~ label {
  content: "-";
}

nav#menu_horizontal ul li {
  display: block;
  width: 100%;
  margin: 0 !important;
  padding: 0 !important;
}

nav#menu_horizontal ul ul .toggle_menuhorizontal,
nav#menu_horizontal ul ul a {
  padding: 0 20px 0 40px;
  line-height: 3rem;
}

nav#menu_horizontal ul ul ul a {
  padding: 0 0 0 80px !important;
}

nav#menu_horizontal a:hover,
nav#menu_horizontal ul ul ul a {
  text-decoration: none !important;
}
nav#menu_horizontal ul {
  padding: 0;
}
nav#menu_horizontal ul li ul li .toggle_menuhorizontal,
nav#menu_horizontal ul ul a {
  color: #00126f;
  font-size: 0.85rem;
  border-top: 1px solid;
  display: block;
  padding-left: 40px !important;
  background-color: transparent !important;
}

nav#menu_horizontal ul li ul li .toggle_menuhorizontal:hover,
nav#menu_horizontal ul ul a:hover {
  color: #000;
  font-size: 0.85rem;
  border-top: 1px solid;
  display: block;
  background-color: #97bf07 !important;
}

nav#menu_horizontal ul ul {
  float: none;
  position: static;
  color: #ffffff;
}

nav#menu_horizontal ul ul li {
  display: block;
  width: 100%;
}

nav#menu_horizontal ul ul ul li {
  position: static;
}