#clx-mobile-navigation ul {
  position: relative;
  padding: 3rem 0;
  margin: 0px;
  font-weight: 200;
}

#clx-mobile-navigation .mobile__meta {
  position: relative;
  display: flex;
  height: 160px;
  padding: 1.5rem 0;
  font-size: 0.875rem;
  align-items: center;
}

#clx-mobile-navigation .mobile__meta ul {
  padding: 0;
  margin: 0;
  position: relative;
  bottom: 0;
  width: 100%;
}

#clx-mobile-navigation .c7n-navi__content {
  min-height: calc((var(--vh, 1vh) * 100) - 152px);
  display: block;
  flex-direction: column;
  justify-content: space-between;
}

#clx-mobile-navigation .c7n-navi__content {
  min-height: calc((var(--vh, 1vh) * 100) - 152px);
  display: block;
  flex-direction: column;
  justify-content: space-between;
}

#clx-mobile-navigation > div.c7n-navi__content > ul:nth-child(2) {
  position: absolute;
  bottom: 0;
}

a.nav-link {
  padding: 0 1rem;
  position: relative;
}

/* .mobile__meta ul { */
/*   padding: 0 !important; */
/*   position: relative; */
/*   margin: 0; */
/*   display: flex; */
/*   flex-direction: column; */
/*   font-size: 1rem; */
/*   line-height: normal; */
/* } */

#clx-mobile-navigation .mobile__meta ul li a {
  display: block;
  width: 100%;
  height: auto;
  padding: 0px 15px;
  font-size: 1.2em;
  font-weight: 200;
  line-height: 35px;
  color: var(--navi_main);
  cursor: pointer;
}

#clx-open-mobile-navigation:hover .c7n-svg-line,
#clx-close-mobile-navigation:hover .c7n-svg-line {
  stroke: var(--link_color_hover);
}

#clx-open-mobile-navigation.c7n-active {
  display: inline-block;
  right: 0;
}

#clx-open-mobile-navigation,
#clx-close-mobile-navigation {
  position: absolute;
  display: none;
  cursor: pointer;
  z-index: 990;
}

#clx-close-mobile-navigation.c7n-active {
  position: fixed;
  display: inline-block;
  right: 15px;
}

#clx-mobile-navigation li.clx-level-1 a.starter_active,
#clx-mobile-navigation li.clx-level-2 a.active,
#clx-mobile-navigation li.clx-level-3:hover a,
#clx-mobile-navigation li.clx-level-3 a.active,
#clx-dropdown-navigation ul li.clx-level-1:focus > a,
#clx-dropdown-navigation ul li.clx-level-1:active > a,
#clx-dropdown-navigation ul li.clx-level-1.active > a,
#clx-dropdown-navigation ul li.clx-level-1.starter_active > a {
  text-decoration: none;
  word-break: break-word;
  color: var(--navi_active);
}

.c7n-mobile-navigation {
  padding: 15px;
}

#clx-open-mobile-navigation.c7n-active {
  right: 15px;
}

#clx-close-mobile-navigation.c7n-active {
  z-index: 990;
}

.clx-toggle-submenu.c7n-open:hover {
  cursor: pointer;
}

.clx-toggle-submenu:hover {
  cursor: pointer;
}

/* #clx-mobile-navigation { */
/*   position: fixed; */
/*   display: flex; */
/*   width: 100%; */
/*   height: calc(100vh - 70px); */
/*   max-height: 100%; */
/*   top: 0; */
/*   right: -100vw; */
/*   flex-direction: column; */
/*   justify-content: space-between; */
/*   font-size: 18px; */
/*   background-color: #f7f5f5; */
/*   color: #333333; */
/*   overflow-x: hidden; */
/*   overflow-y: auto; */
/*   -webkit-transition: all 0.15s ease-in-out; */
/*   -moz-transition: all 0.15s ease-in-out; */
/*   -ms-transition: all 0.15s ease-in-out; */
/*   -o-transition: all 0.15s ease-in-out; */
/*   transition: all 0.15s ease-in-out; */
/* } */

#clx-mobile-navigation {
  position: absolute;
  display: flex;
  width: 100%;
  height: calc((var(--vh, 1vh) * 100) - 70px);
  max-height: calc((var(--vh, 1vh) * 100) - 70px);
  top: 70px;
  right: -100vw;
  flex-direction: column;
  font-size: 18px;
  background-color: #f7f5f5;
  color: #333333;
  overflow-x: hidden;
  overflow-y: auto;
  /* -webkit-transition: all 0.15s ease-in-out; */
  /* -moz-transition: all 0.15s ease-in-out; */
  /* -ms-transition: all 0.15s ease-in-out; */
  /* -o-transition: all 0.15s ease-in-out; */
  /* transition: all 0.15s ease-in-out; */
}

#clx-mobile-navigation.c7n-open {
  right: 0px;
}

nav#clx-mobile-navigation a {
  border: transparent;
  outline: none;
}

#clx-mobile-navigation ul li {
  display: flex;
  width: 100%;
  padding: 0;
  margin: 0;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: flex-start;
}

#clx-mobile-navigation li a {
  display: block;
  width: 100%;
  height: 50px;
  padding: 0px 15px;
  font-size: 1.5em;
  font-weight: 200;
  line-height: 50px;
  color: var(--navi_main);
  cursor: pointer;
}

#clx-mobile-navigation li.menu_node > a {
  width: calc(100% - 60px);
}

#clx-mobile-navigation li .clx-toggle-submenu {
  position: relative;
  display: none;
  width: 60px;
  height: 50px;
  padding: 0px 15px;
  align-items: center;
  justify-content: center;
  font-size: 1.2em;
  line-height: 50px;
}

#clx-mobile-navigation li .clx-toggle-submenu:before {
  position: absolute;
  display: flex;
  width: 100%;
  height: 100%;
  top: 0;
  right: 0;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  font-family: "FontAwesome";
  font-size: 0.8em;
  color: var(--navi_main);
  content: "\f105";
}

#clx-mobile-navigation li .clx-toggle-submenu.c7n-open:before {
  content: "\f107";
}

#clx-mobile-navigation li.menu_node > .clx-toggle-submenu {
  display: flex;
}

#clx-mobile-navigation li.clx-level-1 {
  border-bottom: 1px solid rgba(255, 255, 255, 0.5);
}

#clx-mobile-navigation li:first-child {
  border-top: 1px solid rgba(255, 255, 255, 0.5);
}

#clx-mobile-navigation li.clx-level-1:hover > a {
  text-decoration: none;
}

#clx-mobile-navigation li.clx-level-1 a.starter_active {
}

#clx-mobile-navigation .menu {
  position: relative;
  display: none;
  width: 100%;
  height: 100%;
  padding: 0;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  opacity: 0;
  -webkit-transition: all 0.15s ease-in-out;
  -moz-transition: all 0.15s ease-in-out;
  -ms-transition: all 0.15s ease-in-out;
  -o-transition: all 0.15s ease-in-out;
  transition: all 0.15s ease-in-out;
  visibility: hidden;
}

#clx-mobile-navigation li .menu.c7n-open {
  display: flex;
  opacity: 1;
  visibility: visible;
}

#clx-mobile-navigation .clx-level-1 .menu {
  background-color: var(--navi_sub_bg);
}

#clx-mobile-navigation li.clx-level-2 {
  border-bottom: 1px solid rgba(255, 255, 255, 0.3);
}

#clx-mobile-navigation li.clx-level-2:last-child {
  border-bottom: none;
}

#clx-mobile-navigation li.clx-level-3 {
  border-bottom: 1px solid rgba(255, 255, 255, 0.2);
}

#clx-mobile-navigation li.clx-level-3:last-child {
  border-bottom: none;
}

#clx-mobile-navigation li.clx-level-2:hover > a {
  text-decoration: none;
}

#clx-mobile-navigation li.clx-level-2 a.active {
  background-color: rgb(255, 242, 233);
}

#clx-mobile-navigation .clx-level-2 .menu {
  background-color: rgba(200, 200, 200, 1);
}

#clx-mobile-navigation > ul > li.clx-level-1.starter_active.menu_node.c7n-open > div {
  color: rgb(255, 196, 82);
}

#clx-mobile-navigation > ul > li.clx-level-1.starter_active.menu_node > div {
  color: rgb(151, 196, 82);
}

#menubuilder0 > li.clx-level-2.active.menu_node.c7n-open > div {
  background-color: rgba(200, 200, 200, 1);
}

#menubuilder0 > li.clx-level-2.active.menu_node > a {
  background-color: rgba(200, 200, 200, 1);
}

#clx-mobile-navigation li.clx-level-3:hover a,
#clx-mobile-navigation li.clx-level-3 a.active {
  text-decoration: none;
  color: rgb(151, 196, 82);
}

@media (max-width: 575px) {
  #clx-open-mobile-navigation,
  #clx-close-mobile-navigation {
    line-height: 70px;
  }

  #clx-open-mobile-navigation svg,
  #clx-close-mobile-navigation svg {
    width: auto;
    height: 20px;
  }
}

@media (min-width: 576px) {
  #clx-open-mobile-navigation,
  #clx-close-mobile-navigation {
    line-height: 70px;
  }

  #clx-open-mobile-navigation svg,
  #clx-close-mobile-navigation svg {
    height: 21px;
  }

  #clx-mobile-navigation li.clx-level-1 > a,
  #clx-mobile-navigation li.clx-level-2 > a,
  #clx-mobile-navigation li.clx-level-3 > a {
    padding: 0px 30px;
  }
}

@media (min-width: 768px) {
  #clx-open-mobile-navigation,
  #clx-close-mobile-navigation {
    line-height: 80px;
  }

  #clx-open-mobile-navigation svg,
  #clx-close-mobile-navigation svg {
    height: 22px;
  }

  #clx-mobile-navigation {
    max-width: 40vw;
    right: -40vw;
  }

  #clx-mobile-navigation ul {
    padding: 80px 0 120px 0px;
    margin: 0px;
    font-weight: 200;
  }
}

@media (min-width: 992px) {
  #clx-open-mobile-navigation,
  #clx-close-mobile-navigation {
    line-height: 95px;
  }

  #clx-mobile-navigation ul {
    padding: 95px 0 120px 0px;
    margin: 0px;
    font-weight: 200;
  }
}

@media (min-width: 1200px) {
  #clx-open-mobile-navigation,
  #clx-close-mobile-navigation {
    line-height: 110px;
  }

  #clx-open-mobile-navigation svg,
  #clx-close-mobile-navigation svg {
    height: 24px;
  }
}

@media (min-width: 1600px) {
  #clx-open-mobile-navigation,
  #clx-close-mobile-navigation {
    line-height: 110px;
  }
}
