
body > header menu menu span {
  display: block;
}

body > header menu menuitem > .heading {
  font-weight: bold;
}

body > header input[type="checkbox"],
body > header input[type="reset"] {
  display: none !important;
}

body > header > nav span { cursor: default; }

body > header nav,
body > header nav nav {
  font-size: 14px;
  height: 100vh;
  position: absolute;
  top: 12px;
  transition: transform .5s ease-in-out;
  width: 275px;
  z-index: 999;
}
a:hover::after {
  display: inline;
}
body > header nav.left-navigation,
body > header nav.left-navigation nav {
  background: #FFF;
  box-shadow: -2px 0 10px #c9c9c9;
  left: 0;
  transform: translateX(-275px);
}

body > header nav > main,
body > header nav nav > main {
  height: 100%;
  overflow-x: hidden;
  overflow-y: auto;
  padding: 0 15px;
  width: 100%;
}

body > header nav a {
  cursor: pointer;
  font-weight: normal;
  margin: 0;
}
body > header nav a:focus { outline: none; }

body > header nav a.menu-close,
body > header nav a.menu-toggle {
  display: block;
  height: 34px;
  line-height: 0;
  padding: 0;
  position: absolute;
  text-indent: -9999px;
  width: 35px;
}

body > header nav.left-navigation a.menu-close {
  background: #be1522;
  right: -35px;
}
body > header nav.left-navigation a.menu-toggle {
  background: #fff;
  right: -35px;
}

body > header nav a.menu-close>span:after,
body > header nav a.menu-close>span:before,
body > header nav a.menu-toggle>span,
body > header nav a.menu-toggle>span:after,
body > header nav a.menu-toggle>span:before {
  background: #000;
  display: block;
  height: 2px;
  pointer-events: none;
  transition: transform .4s ease-in-out, background-color .4s ease-in-out 0s;
  width: 20px;
}

body > header nav a.menu-close>span,
body > header nav a.menu-toggle>span {
  display: block;
  margin-left: 7px;
  margin-top: 16px;
  position: relative;
}

body > header nav a.menu-close>span:after,
body > header nav a.menu-close>span:before,
body > header nav a.menu-toggle>span:after,
body > header nav a.menu-toggle>span:before {
  content: "";
  position: absolute;
  transform: rotate(0) translateY(0);
}

body > header nav a.menu-close {
  margin-top: 5px;
  opacity: 0;
  transition: all .4s ease-in;
}

body > header nav a.menu-close>span:after {
  transform: rotate(45deg);
}
body > header nav a.menu-close>span:before {
  transform: rotate(-45deg);
}

body > header nav a.menu-toggle { margin-top: -30px; }

body > header nav a.menu-toggle>span:after {
  transform: translateY(6px);
}
body > header nav a.menu-toggle>span:before {
  transform: translateY(-6px);
}

body > header nav menu {
  margin: 0;
  padding: 0;
}
body > header nav menu menuitem {
  display: block;
  list-style: none;
}
body > header nav menu menuitem + menuitem {
  border-top: 1px solid #e9e9e9;
}
body > header nav menu menuitem > a,
body > header nav menu menuitem > span {
  display: block;
  line-height: 30px;
  padding: 10px 0;
  text-decoration: none;
  color: #444;
}
body > header nav menu menuitem > a:hover {
  color: #0e71b8;
}

body > header nav.left-navigation menu menuitem > a,
body > header nav.left-navigation menu menuitem > span {
  text-align: left;
}

body > header nav menu menuitem > a:after {
  display: block;
  font-size: 150%;
}
body > header nav.left-navigation menu menuitem > a[href*="javascript:document.getElementById"]:after{
  content: "\f178";
  font-family: "Font Awesome 5 Pro";
  float: right;
}

body > header nav nav a.menu-toggle,
body > header nav nav a.menu-toggle>span,
body > header nav nav a.menu-toggle>span:after,
body > header nav nav a.menu-toggle>span:before { background: none !important; }

body > header input[type="checkbox"]:checked ~ nav { transform: translateX(0); }

body > header input[type="checkbox"]:checked ~ nav a.menu-close {
  opacity: 1;
}

body > header input[type="checkbox"]:checked ~ nav a.menu-toggle > span:after,
body > header input[type="checkbox"]:checked ~ nav a.menu-toggle > span:before {
  width: 14px;
}
body > header input[type="checkbox"]:checked ~ nav.left-navigation a.menu-toggle > span:after {
  transform: rotate(-45deg) translateY(-4px) translateX(4px);
}
body > header input[type="checkbox"]:checked ~ nav.left-navigation a.menu-toggle > span:before {
  transform: rotate(45deg) translateY(4px) translateX(4px);
}