body {
  margin: 0;
  /*font-family: sans-serif;*/
}
ul {
  list-style: none;
  padding: 0;
  margin: 0;
}
.body {
  background-color: #42DEFF
}

.main-nav-box ul {
  /*list-style: none;*/
  /*padding: 0;*/
}
/*
.container {
  max-width: 1400px;
  margin: 0 auto;
}
*/
#header-main {
  position: fixed;
  top: 0;
  z-index: 5;
  width: 100%;
  /*height: 80px;*/
  max-height: 100vh;
  /*overflow-y: auto;*/
  /*background-color: #eee;*/
  /*background-color: #fff;*/
  /*background-color: inherit;*/
  font-family: 'Roboto Slab', serif;
  background-color: rgba(255,255,255,0.95);
  backdrop-filter: saturate(120%) blur(10px);
}
.header-wrapper {
  /*display: flex;*/
  height: 100%;
  /*padding: 0 1em;*/
  /*overflow-y: auto;*/
}
.header-wrapper-inner {
  display: flex;
  /*flex-wrap: wrap;*/
  width: 100%;
  height: 100%;
  justify-content: space-between;
  /*position: relative;*/
}
.header-wrapper-responsive {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  height: 100%;
}
.header-logo {
  /*margin: .2em .5em;*/
}
.logo {
  margin: 0;
  width: max-content;
  /*max-height: 120px;*/
  height: 100%;
}
.logo img {
  object-fit: contain;
  max-height: 80px;
  height: 100%;
}
.menu-icon {
  display: none;
}
.menu-icon > input {
  visibility: hidden;
}

.header-navigation {
  /*overflow-y: auto; /* menu scroll */
}
#nav-main {
  /*background-color: #f0f0f0;*/
  background-color: inherit;
  width: 100%;
  /*position: relative;*/
  font-family: 'Roboto Slab', sans-serif;
  /*overflow-y: auto;*/
}
.nav-level-1 {
  /*list-style: none;*/
  /* padding: 0 1em; */
  display: flex;
  justify-content: flex-end;
  /*align-items: center;*/
  /*flex-wrap: wrap;*/
  height: 100%;
  /*margin: 0;*/
}
.nav-item {
  /*width: 100%;*/
  /*position: relative;*/
  transition: .4s;
  z-index: 1;
}
.nav-item:hover {
  /*background-color: #e9e9e9;*/
  background-color: #f1f1f1;
  transition: .4s;
}
.nav-link {
  /*padding: 1em;*/
  /*display: inline-block;*/
  display: flex;
  height: 100%;
  justify-content: space-between;
  align-items: center;
  cursor: pointer;
}
.nav-link-search, .nav-link-regular {
  display: flex;
  height: 100%;
  /*margin: .5em;*/
  /*justify-content: space-between;*/
  align-items: center
}
.nav-link::after {

}

.nav-item-title {
  display: flex;
  align-items: center;
  height: 100%;
  width: max-content;
  /*padding: 0 1em;*/
  padding: 0 .6em;
}
.nav-submenu-wide {
  display: block;
  height: 0;
  overflow: hidden;
  position: absolute;
  /*background-color: #e9e9e9;*/
  background-color: #f1f1f1;
  left: 0;
  width: 100%;
  opacity: 0;
  /*filter: opacity(0);*/
  transition: all .4s;
  /*
  animation-name: opacity_animation;
  animation-duration: 0.5s;
  animation-iteration-count: 1;
  */
}
.nav-submenu-narrow {
  display: block;
  height: 0;
  overflow: hidden;
  position: absolute;
  /*background-color: #e9e9e9;*/
  background-color: #f1f1f1;
  /*left: 0;*/
  /*width: 100%;*/
  /*opacity: 0;*/
  /*visibility: hidden;*/
  /*filter: opacity(0);*/
  /*color: rgba(0,0,0,0);*/
  transition: all .4s;
}
.nav-item:hover .nav-submenu-wide {
  /*display: block;*/
  height: 300px;
  opacity: 1;
  /*filter: opacity(1);*/
  /*visibility: visible;*/
  /*transform: translate(0px, 20px);*/
  /*color: rgba(0,0,0,1);*/
  transition: all .4s;
/*
  animation-name: opacity_animation;
  animation-duration: 0.5s;
  animation-iteration-count: 1;
  */
}
/*
@keyframes opacity_animation {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1.0;
  }
}
*/
.nav-item:hover .nav-submenu-narrow {
  /*display: block;*/
  height: auto;
  opacity: 1;
  transition: opacity .4s;
}

.list-container {
  max-width: 1200px;
  margin: 0 auto;
  width: 100%;
  display: flex;
  justify-content: flex-end;
}
.list-container-1 {
  position: relative;
  width: 100%;
}
.nav-sub_item {
  /*display: flex;*/
  flex: 1;
  min-width: max-content;
  padding: 1em;
}
.nav-link {
  /*padding: 1em;*/
}
.nav-link-search, .nav-link-regular {
  /*display: flex;*/
  /*height: 100%;*/
  /*margin: .5em;*/
  justify-content: flex-start;
  align-items: center
}
.nav-sub_col {
  /*padding: 0 2em;*/
  /*margin: 1em 0;*/
}
.nav-sub_col > li > a {
  display: block;
  width: 100%;
  height: 100%;
  padding: 1em 0;
  /*margin: 1em 0;*/
}
.nav-sub_item-title {
  /*display: flex;*/
  /*align-items: center;*/
  /*width: max-content;*/
  /*padding: 0 2em;*/
  margin: .5em 0em;
  line-height: 1.5;
  border-bottom: 1px solid #0b8040;
}
.nav-item-search {}
.nav-item-search span {
  margin: .5rem;
}
.search {
  padding: 1em;
  /*height: 2em;*/
  height: 100%;
  /*flex: 1;*/
  width: 100%;
  box-sizing: border-box;
  line-height: 1.5;
  font-family: 'Roboto Slab';
  font-weight: bolder;
  background-color: transparent;
  border: none;
  border-bottom: 1px solid #0b8040;
}
.search_box {
  /*overflow: visible;*/
  /*overflow-y: auto;*/
  height: 0;
  flex-direction: column;
}
.nav-menu-footer {
  display: flex;
  flex-direction: column;
}
.list-container-search {
  width: 100%;
  /*margin: 0;*/
  /*padding: 2em;*/
}
.search_open {
  display: flex;
}
.nav-link-search.open {
  background-color: #f1f1f1;
}
#livesearch {
  /*position: absolute;*/
  /*left: 0;*/
  /*display: block;*/
  height: auto;
  /* width: max-content; */
  width: 100%;
  padding: 0 1em 0 1em;
  box-sizing: border-box;
}
.search_results {
  display: flex;
  flex-direction: column;
}
.search_results > a {
  /*padding: .4rem 0;*/
  margin-bottom: 1rem;
}
.menu-active {
  display: flex;
  height: auto;
  opacity: 1;
  /*transition: .4s;*/
}
.direction {
  direction: rtl;
}

/* Responsive Menu */
@media screen and (max-width: 1200px) {

/*@media screen and (max-width: 640px) {*/
  /*.header-wrapper-responsive.menu-icon>input:checked ~ .main-nav-box>.nav-level-1 {
    display: flex;
  }*/
  body {
    /*overflow-y: scroll;*/
  }
  i {
    display: none;
  }
  #header-main {
    /*overflow: scroll;*/
    overflow-y: auto;
  }
  .header-wrapper {
    /*overflow-y: scroll;*/  /* Menu Scroll */
  }
  .header-wrapper-inner {
    flex-direction: column;
  }
  .header-wrapper-responsive {
    /*overflow-y: auto;*/
  }
  .nav-responsive-menu-icons {
    display: flex;
    flex-direction: row;
    align-items: center;
  }
  .menu-icon {
    display: block;
    margin: 1rem 1rem 1rem .5rem;
    font-size: 2em;
  }
  .nav-level-1 {
    display: none;
    flex-direction: column;
    padding: 0;
  }
  .nav-item {
    /*margin: 1em 0;*/
    margin: 0;
    padding: 0;
  }
  .nav-link {
    /*margin: 1em 0;*/
    /*margin: .5em;*/
    /*padding: 0;*/
    height: auto;
    padding: .5em;
    box-sizing: border-box;
  }
  .nav-link-search, .nav-link-regular {
    /*display: flex;*/
    /*height: 100%;*/
    /*margin: .5em;*/
    justify-content: flex-start;
    align-items: center;
    padding: .5em;
    box-sizing: border-box;
  }
  /*.nav-link-1 {}*/
  .nav-link::after {
    /*padding: 1em;*/
    content: "+";
    /*position: absolute;*/
    display: block;
    /* margin: auto 0; */
    /* padding: .5em; */
    margin: auto .5em auto 0;
    font-size: 1.5em;
  }
  .nav-item-title {
    height: 1em;
    /*padding: 1em;*/
    padding: 0 1em;
    margin: 1em 0;
  }
  .nav-submenu-wide {
    display: none;
    position: relative;
    flex-direction: column;
    /*filter: opacity(1);*/
    /*opacity: 1;*/
  }
  .nav-item:hover .nav-submenu-wide {
    height: auto;
  }
  .list-container {
    margin: 0;
    padding: 1em;
    max-width: 100%;
    width: auto;
    justify-content: flex-start;
  }
  .nav-sub_item {
    /*display: flex;*/
    /*flex: 1;*/
    /*min-width: max-content;*/
    /*padding: 0;*/
  }
  .nav-submenu-wide > div {
    /*display: flex;*/
    flex-direction: column;
    justify-content: flex-start;
  }
  .nav-submenu-narrow {
    display: none;
    position: relative;
    /*background-color: #e9e9e9;*/
    left: 0;
    width: 100%;
    /*opacity: 0;*/
    /*transition: .4s;*/
  }
  .nav-item:hover .nav-submenu-narrow {
    /*display: none;*/
    height: auto;
  }
  .nav-link-search.open {
    background-color: inherit;
    /*height: auto;*/
  }
  .menu-active {
    display: flex;
    /*height: 100%;*/
    height: auto;
    /*transition: .4s;*/
  }
  .direction {
    direction: initial;
  }
}