nav ul {
  /*width: 100%;*/
  padding:0; margin:0;
  line-height:100%;
  clear:both;
  background-color: #fff;
  /*font-size: 1em !important;*/
  display:flex;
  text-transform: lowercase;
   /*font-weight:700;*/
}

nav li.active,
nav a.active,
nav a:hover {
   color: #000;
}



nav li {
  list-style-type: none;  /*reset*/
  margin:0;
  padding: 0.25em 0.25em 0.25em 0.25em;
  color: #a83c10;
}
nav a {
  margin: 0;
  text-transform: lowercase;
  /*font-weight: 400;*/
  display: block;
  color: #a83c10;
  width: 100%;
  /*font-family: "opensanssemibold",sans-serif;*/
  font-weight: 400;

}
nav a:hover{ text-decoration: none; }
/*1st level*/
nav > ul > li {
    position: relative;
    flex:1;
    cursor: pointer;
    text-align:center;
    vertical-align: middle;
    border-bottom: solid 1px #a83c10;
}
nav > ul > li.small {
  flex: 0.25;
}


/* HIDDEN */
nav  li > ul {
    display: none;
    position: absolute;
    z-index:10;
    left: 0; top: 100%; width: 100%;
    padding:0; margin:0;
    background-color: #fff;
    border: solid 1px #a83c10;
    box-sizing:  border-box;
    border-top: none;
}

/* SHOW */
nav li:hover >  ul {
  display: block;
 }

nav.white {
  background-color: rgba(255,255,255,1);
  border: solid 1px #a83c10;
}
.fixed {
     position: fixed;
     top:0;
     max-width: 1120px; /* sama as wrapper! */
     background-color: #fff;
}

nav #trigram {
  display: none;
  margin-left: 0.5em;
  font-size: 2em;
  font-weight: 700;
}


/*mobile*/
@media screen and (max-width: 768px) {
  nav {
    width:100%;
    position: absolute;
    background: transparent;
    left: 0;
    top:0;
  }
  nav #trigram {
    display: block;
    
  }
  .shadow {
    box-shadow: none;
  }
  /*both*/
  nav ul {
    height: auto;
    /*min-width: 320px;*/
    box-sizing: border-box;
    display:block;
    border:none;
    /*background: rgba(255,255,255,1);*/
  }
  /*items*/
  nav ul > li {
  /*nav  li  {*/
    padding:0.25em 0;
    margin-left: 0.25em;
    flex:none;
    display:block;
    line-height: 1em;
    border:none;
    text-align:left;
  }
  /*level1*/
  nav > ul {
    display: none;
    padding: 1em;
    /*border-bottom: solid 1px #a83c10;*/
/*width:*/

  }
  /*level2*/
  nav ul > li > ul  {
    /*left: 50%;
    width:50%;
    top:0;*/
    margin: 0.5em 0;
    position: relative;
    display:block;
    border:none;
    border-left: solid 1px #a83c10;
    background: transparent;
  }



}