#header {
  height: 44px;
  position: fixed;
  width: 100vw;
  background-color: var(--deepblue);
  color: #fff;
  z-index: 999;
  transition: 0.8s;
  opacity: 0;
}
#header .container {
  /* border-bottom: 1px solid #fff; */
}
#header .txt-logo {
  width: 25%;
  fill: #fff;
}
#header .leftside {
  /* flex-grow: 1; */
  flex-shrink: 0;
  padding-top: 1.5rem;
  /* margin-right: 3rem; */
  /* width: 25%; */
}
#header .center {
  /* flex-grow: 8; */
  width: 75%;
}
/* #header .rightside {
  flex-grow: 1;
  flex-shrink: 0;
  font-size: 1.2rem;
  padding-top: 1.5rem;
  margin-left: 3rem;
} */
#header .header-category-box {
  width: 25%;
}
#header .header-category-box a {
  width: 100%;
  z-index: 999;
}
#header .header-category-box .category {
  height: 39px;
  padding: 1.5rem 3rem 0;
  font-weight: lighter;
  font-size: 1.3rem;
}
#header .underbar {
  background-color: transparent;
  width: 100%;
  /* max-width: 120px; */
  height: 5px;
  transition: 0.4s;
}
#header .category.icon {
  display: none;
  width: 30px;
  height: 30px;
}
.login-icon {
  width: 13px;
  height: 15px;
  margin-left: 6px;
  fill: none;
  stroke: lightgray;
  stroke-miterlimit: 10;
  stroke-width: 2px;
}
@media (max-width: 450px) {
  #header { padding-right: 0; z-index: -1;}
  #header .txt-logo { width: auto;}
}