body#index section#wrapper {
  padding-top:0;
}

#hermessidemenu {
  position:relative;
  display: flex;
  align-items: stretch;
}

#hermessidemenu > ul {
  width:100%;
  height:100%;
  padding-top:20px;
}

#hermessidemenu > ul > li {
  width:100%;
}

#hermessidemenu > ul > li > a {
  position:relative;
  display:block;
  width:100%;
  padding:8px 24px 8px 20px;
  font-size:16px;
}

#hermessidemenu > ul > li > a:hover,
#hermessidemenu > ul > li > a.active {
  background-color:#F27D46;
  color:white;
}

#hermessidemenu > ul > li > a.parent span {
  position:absolute;
  displaY:block;
  top:50%;
  right:12px;
  margin-top:-15px;
  content:"›";
  width: 30px;
  height: 30px;
  line-height:30px;
  text-align: center;
}

#hermessidemenu > ul > li > a.parent span:hover {
  background-color: #F27D46;
  color:white;
}

#hermessidemenu > ul > li > a.parent:hover span {
  color:white;
}

#hermessidemenu > ul > li.last {
  display:flex;
  height:134px;
  flex:1;
}

#hermessidemenu div.sub {
  cursor:default;
  position:absolute;
  top:0;
  left:100%;
  width:1200px;
  height:100%;
  z-index:10;
  overflow:hidden;
  visibility:hidden;
  transition: visibility 0s linear .3s;
}

#hermessidemenu > ul > li > a + div.sub:hover, 
#hermessidemenu > ul > li > a:hover + div.sub {
  visibility: visible;
  transition: visibility 0s linear 0s;
  z-index:10;
}

#hermessidemenu > ul > li > a + div.sub > div.slide {
  position:relative;
  height:100%;
  transition: all .3s ease;
  transform: translate3d(-100%, 0, 0);
  background-color:#f5f5f5;
  z-index:10;
  border-left:1px solid #dedede;
  padding:24px 20px 22px 26px;
  /* border-right:1px solid #dedede; */
  /* box-shadow:2px 2px 2px black; */
}

#hermessidemenu > ul > li > a + div.sub > div.slide a span {
  display:none;
}

#hermessidemenu > ul > li > a + div.sub:hover > div.slide, 
#hermessidemenu > ul > li > a:hover + div.sub > div.slide {
  transform: translateZ(0);
}

@media screen and (min-width: 992px) {
  #hermessidemenu div.sub div.slide > ul > li {
    display: inline-block;
    vertical-align: top;
    margin-right:20px;
  }

  #hermessidemenu div.sub div.slide > ul > li > a {
    position:relative;
    top:0;
    display:block;
    font-size:16px;
    font-weight:600;
    padding:5px;
  }

  #hermessidemenu div.sub div.slide > ul > li > a:after {
    position:relative;
    top:0;
    content:"›";
    padding-left:5px;
  }

  #hermessidemenu div.sub div.slide > ul > li > a + ul {
    margin-bottom:12px;
  }

  #hermessidemenu div.sub div.slide > ul > li > a + ul li a {
    position:relative;
    display:block;
    font-size:16px;
    line-height: 2;
    padding:0 5px;
  }

  #hermessidemenu div.sub div.slide > a {
    display:block;
    position:absolute;
    bottom:2px;
    right:2px;
    /* border-bottom:1px solid #f5f5f5;
    border-right:1px solid #f5f5f5; */
  }
}

@media screen and (max-width:991px) {
  #hermessidemenu div.sub {
    position: relative;
    width: 100%;
    height: 0;
    left:0;
    visibility: visible;
  }

  #hermessidemenu > ul > li > a.parent:not(.active),
  #hermessidemenu > ul > li > a.parent:not(.active) > span{
    background:inherit;
    color:inherit;
  }

  #hermessidemenu > ul > li > a + div.sub > div.slide {
    height:0;
    transform: translate3d(0, -100%, 0);
    padding:0;
  }

  #hermessidemenu > ul > li > a.active + div.sub > div.slide {
    transform: translateZ(0);
    height:100%;
  }


  #hermessidemenu > ul > li > a.active + div.sub {
    height:auto;
  }

  #hermessidemenu > ul > li > a.active + div.sub > div.slide > a {
    display:none;
  }

  #hermessidemenu > ul > li > a.active > span {
    transform: rotate(90deg);
  }

  #hermessidemenu div.sub div.slide > ul > li > a {
    display:block;
    font-size:15px;
    padding: 8px 24px 8px 20px;
  }

  #hermessidemenu div.sub div.slide > ul > li > a + ul {
    display:none;
  }
  
  #hermessidemenu > ul > li.last {
    display:none;
  }
}