.wrapper.header-navbar{
  margin: 4em auto;
  height: 4em;
}

.header-navbar .logo{
  padding: 8px;
  margin-top:0;
  margin-right: 6em;
  display: inline-block;
  float:left;
}

.header-navbar .logo img {height: 20px;}

.header-navbar .menu-level-0{
  width:auto;
  display: inline-block;
}

.header-navbar .top-search{
  padding: 8px 0;
  position: absolute;
  top: 0;
  right: 1em;
  display: flex;
}
.header-navbar .top-search a{color:#88959E; font-size: 12px;}
.header-navbar ul.menu{margin: 0;}
.header-navbar ul.menu-level-1>li.menu-item {
  list-style-type: none;
  list-style-image: none;
}

.header-navbar .w3-dropdown-hover {margin-bottom:1em;}
.header-navbar .w3-dropdown-hover i{color: #00ADA4;}
.header-navbar .w3-dropdown-hover:first-child{background-color:transparent;}
.header-navbar .w3-dropdown-hover button{
  color: #1c1c1c;
  font-size: 18px;
  line-height: 23px;
  text-decoration: none;
}

.header-navbar .w3-button:hover,
.header-navbar .w3-dropdown-hover:hover > .w3-button:first-child{
  color: #00ADA4!important;
  background-color:transparent!important;
}
.header-navbar .w3-dropdown-content{
  padding:1em;
  z-index:100;
}
.header-navbar button:focus{outline:none;}

.header-navbar #top-menu-toggle,
.header-navbar #top-menu-close{
  border:none;
  background-color:inherit;
  display:none;
  padding: 0.5em 0;
}

.header-navbar #top-menu-close {position:absolute;right:0;}

.header-navbar #menu-close {
  display:none;
}

.header-navbar .wr-icon:hover{
  filter: invert(46%) sepia(13%) saturate(4371%) hue-rotate(137deg) brightness(102%) contrast(101%);
}

.header-navbar .wr-icon{
  height:20px;
}

.header-navbar a{
  padding-bottom: 3px;
  white-space: nowrap;
  color: #1C1C1C;
  text-decoration: none;
  font-family: roboto-mono, monospace;
  font-weight: 400;
  font-style: normal;
  font-size: 14px;
}
.header-navbar a:hover {color: #00ADA4;}
.header-navbar .menu-styled{
  color: #00ADA4;
  text-decoration: underline;
}
.header-navbar .menu-styled:hover{text-decoration: none;}
.header-navbar .menu-section-solutions .menu-level-1>.menu-item,
.header-navbar .menu-section-studio .menu-level-1>.menu-item{
  min-width:250px;
  float:left;
}
.header-navbar .menu-section-solutions .menu-level-1>.menu-item>a,
.header-navbar .menu-section-studio .menu-level-1>.menu-item>a:not(.menu-styled){
  pointer-events: none;
  color: #6C9694;
}
.header-navbar .menu-section-studio .menu-level-1 .menu-item--active-trail a {
  pointer-events: all;
}

.header-navbar .menu-section-studio .menu-level-2 .menu-item--expanded {
  list-style-type: none;
  list-style-image: none;
}
.header-navbar .menu-section-studio .menu-level-2 .menu-item--expanded .menu-dropdown-2 {
  display: none;
}
.header-navbar .menu-section-studio .menu-level-2 .menu-item--expanded:hover .menu-dropdown-2 {
  display: block;
  position: relative;
}
.header-navbar .menu-section-studio .menu-level-1 .menu-item:nth-child(2) .menu-level-2 .menu-item--expanded > a {display: none;}
.header-navbar .menu-section-studio .menu-level-1 .menu-item:nth-child(2) .menu-level-2 .menu-item--expanded > div {display: block;}

.header-navbar.japan #top-menu>.w3-dropdown-hover>.menu-item{ padding: 8px 12px; }

header .actions .abottom{
  display: flex;
  margin-top: 52px;
  flex-direction: row;
  align-items: stretch;
}
/*header .abottom-item.abi-contact{width: 80px;}*/
header .top-nav-search.is-open{display: block;}
header .top-nav-search {
  position: absolute;
  background: #fff;
  z-index: 9;
  padding: 20px;
  border: 1px solid transparent;
  right: 0;
  left: 0;
  top: 92px;
  -moz-box-shadow: 2px 8px 19px rgba(0, 0, 0, 0.08);
  -webkit-box-shadow: 2px 8px 19px rgba(0, 0, 0, 0.08);
  box-shadow: 2px 8px 19px rgba(0, 0, 0, 0.08);
  display: none;
}

a.abi-contact,
a.abi-search {display:flex; flex-direction:column; text-align: center; width: 80px;}

a.abi-contact svg,
a.abi-search svg {width: 18px !important; height: 18px; margin: 0 auto 5px; fill: #88959E;}

.top-nav-search form {
  position: relative;
  display: block;
  height: 40px;
}

#search-input {
  font-family: roboto-mono, monospace;
  border-radius: 0;
  color: #1c1c1c;
  border-color: #e8e8e8;
  background-color: #ffffff;
  -webkit-box-shadow: none;
  box-shadow: none;
  font-size: 14px;
  line-height: 16px;
  height: 40px;
  padding: 12px 16px 10px 16px;
  display: block;
  width: 87%;
  box-sizing: border-box;
  margin: 0;
  position: absolute;
  top: 0;
  left: 0;
}

.search-input-btn {
  display: block;
  width: 11%;
  box-sizing: border-box;
  margin: 0;
  font-weight: 700;
  font-size: 14px;
  line-height: 40px;
  height: 40px;
  border: 0 none;
  background: #00ADA4;
  color: #fff;
  text-transform: uppercase;
  text-align: center;
  padding: 0;
  -webkit-appearance: none;
  position: absolute;
  top: 0;
  right: 0;
  border-radius: 7px;
}

.search-input-btn:hover{background: #00877D;}

header .logo img.logo-black{display:none;}
@media (prefers-color-scheme: dark) {
  .header-navbar .w3-dropdown-hover button{color:white;}
  .header-navbar .w3-dropdown-content{ background-color: #1C1C1C;}
  .header-navbar a{color:white;}
  header .logo img.logo-black{display:block;}
  header .logo img.logo-white{display:none;}
}
@media screen and (max-width: 1199px) {
  .header-navbar .logo{margin-right: 1em;}
  .header-navbar .menu-level-0{max-width:23em;}
  .header-navbar .w3-button {padding: 0 0.5em;}
}
@media screen and (max-width: 767px) {
  .header-navbar #top-menu-toggle,
  .header-navbar #top-menu-close { display:inline-block; }

  .header-navbar .w3-button {padding: 0}

  .header-navbar .menu-level-0{
    background-color: white;
    clear:both;
    display:none;
    float:left;
    min-height: 40em;
    min-width: 100%;
    overflow: visible;
    margin-top: 2em;
    padding-top: 0;
    position: relative;
    z-index: 10;
  }
  .header-navbar .w3-dropdown-hover{
    clear: both;
    margin-bottom: 0.1em;
    width: 6em;
  }
  .header-navbar .w3-dropdown-hover:hover .w3-dropdown-content{
    position: absolute;
    left: 6em;
    top: -1em;
  }

  .header-navbar .menu-section-solutions .menu-level-1>.menu-item,
  .header-navbar .menu-section-studio .menu-level-1>.menu-item{
    min-width: unset;
    margin-bottom:2em;
    float:left;
    clear:both;
  }

  .header-navbar.japan #top-menu>.w3-dropdown-hover>.menu-item{ padding: 0; }
  .header-navbar.japan .w3-dropdown-hover{ width: 8em; }
  .header-navbar.japan .w3-dropdown-hover:hover .w3-dropdown-content{ left: 8em; }

  @media (prefers-color-scheme: dark) {
    .header-navbar #top-menu-toggle,
    .header-navbar #top-menu-close{color:white;}
    .header-navbar .menu-level-0 {background-color:#1c1c1c;}
    }
}
