#hermestopmenu {
  position:relative;
  display:block;
}

#hermestopmenu > input[type='checkbox'] {
  /* visibility:hidden; */
  background:transparent;
  position:absolute;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
  filter: alpha(opacity=0);
  -moz-opacity: 0;
  -khtml-opacity: 0;
  opacity: 0;
}

#hermestopmenu > a#hermestopmenu_anhor_check label {
  display:inline-block;
  padding:20px 20px;
  margin:0;
  color:white;
  font-weight:600;
  text-transform: uppercase;
  text-align:left;
  cursor:pointer;
  width:100%;
  background-color:#777777;
  box-sizing: border-box;
}

#hermestopmenu > a#hermestopmenu_anhor_check label:after {
  content: "\f107";
  font-family: "FontAwesome";
  font-size: 14px;
  position: absolute;
  top: 20px;
  right: 20px;
  color:white;
}

#hermestopmenu > a#hermestopmenu_anhor_check[data-check='on'] label:after {
  content: "\f106";
}

#hermestopmenu > a:hover,
#hermestopmenu > a:after:hover {
  color:#C12935;
}

#hermestopmenu > a#hermestopmenu_anhor_check ~ ul {
  display:block;
  width:100%;
  transform: scaleY(0);
  transform-origin: top;
  transition: transform 0.26s ease;
}

#hermestopmenu > a#hermestopmenu_anhor_check[data-check='on'] ~ ul {
  display:block;
  transform: scaleY(1);
}

#hermestopmenu > a + ul {
  position:absolute;
  z-index:1001;
  background:white;
  /* padding:12px; */
  box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.35);
}

#hermestopmenu > a + ul li {
  position:relative;
}

#hermestopmenu > a + ul li a {
  width:100%;
  display:inline-block;
  padding:10px 35px 10px 20px;
  font: 500 14px "Montserrat", sans-serif;
  color:#444;
  /* line-height: 23px; */
}

#hermestopmenu > a + ul.col li a {
  padding:10px 20px 10px 20px;
}

#hermestopmenu > a + ul li a:hover {
  color:#C12935;
}

#hermestopmenu > a + ul.std li a.parent:after,
#hermestopmenu > a + ul.col > li > a.parent:after {
  position: absolute;
  content: "\f105";
  font-family: "FontAwesome";
  color: #444;
  font-size: 14px;
  font-weight: normal;
  right: 20px;
  top: 12px;
  border: none;
}

#hermestopmenu > a + ul.std li,
#hermestopmenu > a + ul.col > li {
  border-bottom: 1px solid #f7f7f7;
}

#hermestopmenu > a + ul li a + ul {
  display:block;
  position:absolute;
  width:100%;
  top:0;
  right:auto;
  left:100%;
  /* margin-left:-5px; */
  background-color:white;
  box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.35);
  
}
#hermestopmenu > a + ul li a + ul {
  visibility: hidden;
  transform: scaleX(0);
  transform-origin: left;
  transition: transform 0.26s ease;
}

#hermestopmenu > a + ul li:hover > a + ul {
  visibility: visible;
  display:block;
  transform: scaleX(1);
}

/*
#hermestopmenu > a + ul li:nth-child(3) a + ul {
  transform: scaleX(1);
}
*/

#hermestopmenu > a + ul.col > li:hover > a + ul {
  display:flex;
  transform:scaleX(1);
}

#hermestopmenu > a + ul.col li:hover a + ul {
  transform:scaleX(1);
}

#hermestopmenu > a + ul.col > li > ul > li > a {
  font-weight: bold;
  display: inline-block;
}

#hermestopmenu > a + ul.col > li > ul {
  /* display:flex; */
  width:auto;
  background:white;
}

#hermestopmenu > a + ul.col > li > ul > li {
  display:block;
}

#hermestopmenu > a + ul.col > li > ul > li a {
  width:auto;
  min-width:260px;
}

#hermestopmenu > a + ul.col > li > ul ul {
  position:relative;
  display:inline-block;
  left:0;
  box-shadow: none;
}

@media screen and (max-width: 991px) {
  #hermestopmenu > a + ul.col > li:hover > a + ul,
  #hermestopmenu > a + ul.std > li:hover > a + ul {
    display:block;
    transform: scaleY(1);
    /* height:100%; */
  }

  #hermestopmenu > a + ul li a + ul {
    position:relative;
    left:0;
    /* height:0; */
    transform: scaleY(0);
    transform-origin: top;
    transition: transform 0.26s ease;
    box-shadow: none;
  }

  #hermestopmenu > a + ul.std li a + ul {
    padding-left:25px
  }

  #hermestopmenu > a + ul.std > li > ul,
  #hermestopmenu > a + ul.col > li > ul {
    display:none;
  }

  #hermestopmenu > a + ul.std > li:hover > ul ul,
  #hermestopmenu > a + ul.col > li:hover > ul ul {
    display:none;
  }

  #hermestopmenu > a + ul.col > li > ul > li {
    float:none;
    width:100%;
  }
}

