body.overflow { overflow: hidden; }
.burger {
  width: 80px;
  height: 80px;
  position: fixed;
  top: 0;
  right: 0;
  z-index: 230;
}
.burger:hover {
  background:#8cdc1e;
}
.burger.clicked  {
  background:#8cdc1e;
}
.burger span {
  position: relative;
  margin-top: 9px;
  margin-bottom: 9px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  position: absolute;
  top: 50%;
  left: 50%;
  margin-left: -25px;
  margin-top: -1.5px;
}
.burger span, .burger span::before, .burger span::after {
  display: block;
  width: 50px;
  height: 1px;
  background-color: #252525;
  outline: 1px solid transparent;
  -webkit-transition-property: background-color, -webkit-transform;
  -moz-transition-property: background-color, -moz-transform;
  -o-transition-property: background-color, -o-transform;
  transition-property: background-color, transform;
  -webkit-transition-duration: 0.3s;
  -moz-transition-duration: 0.3s;
  -o-transition-duration: 0.3s;
  transition-duration: 0.3s;
}
.burger span::before, .burger span::after {
  position: absolute;
  content: "";
}
.burger span::before { top: -15px; }
.burger span::after { top: 15px; }
.burger.clicked span { background-color: transparent; }
.burger.clicked span::before {
  -webkit-transform: translateY(15px) rotate(45deg);
  -moz-transform: translateY(15px) rotate(45deg);
  -ms-transform: translateY(15px) rotate(45deg);
  -o-transform: translateY(15px) rotate(45deg);
  transform: translateY(15px) rotate(45deg);
}
.burger.clicked span::after {
  -webkit-transform: translateY(-15px) rotate(-45deg);
  -moz-transform: translateY(-15px) rotate(-45deg);
  -ms-transform: translateY(-15px) rotate(-45deg);
  -o-transform: translateY(-15px) rotate(-45deg);
  transform: translateY(-15px) rotate(-45deg);
}
.burger.clicked span:before, .burger.clicked span:after { background-color: #000000; }
.burger:hover { cursor: pointer; }
.overlay {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 200;
  width: 100%;
  height: 100%;
  -webkit-transition: all 0.3s ease-in-out;
  -moz-transition: all 0.3s ease-in-out;
  -o-transition: all 0.3s ease-in-out;
  transition: all 0.3s ease-in-out;
  background-color: #383838;
  opacity: 0;
  visibility: hidden;
}
.overlay.show {
  opacity: 0.8;
  visibility: visible;
}
.navi {
  background-color: #ffffffe6;
  position: fixed;
  z-index: 210;
  top: 0;
  right: 0;
  height: 100%;
  max-width: 500px;
  width: 90%;
  padding-top: 20px;
  overflow-y: auto;
  overflow-x: hidden;
  -webkit-transform: translateX(100%);
  -moz-transform: translateX(100%);
  -ms-transform: translateX(100%);
  -o-transform: translateX(100%);
  transform: translateX(100%);
  -webkit-transition: transform 0.55s cubic-bezier(0.785, 0.135, 0.15, 0.86);
  -moz-transition: transform 0.55s cubic-bezier(0.785, 0.135, 0.15, 0.86);
  -o-transition: transform 0.55s cubic-bezier(0.785, 0.135, 0.15, 0.86);
  transition: transform 0.55s cubic-bezier(0.785, 0.135, 0.15, 0.86);
}
.navi ul, .navi li {
  list-style: none;
  margin: 0;
  padding: 0;
}
.navi a {
    padding: 6px 15px;
    display:block;
}
.navi div a {
    padding: 3px 15px 3px 25px;
  display:block;
  font-size:90%;
  color:#252525;
}
.navi a:hover {
  background: #f1f1f1;
  text-decoration:none;
}
.navi li.selected > a {
background:#cee8ff;
}
.navi.show {
  -webkit-transform: translateX(0px);
  -moz-transform: translateX(0px);
  -ms-transform: translateX(0px);
  -o-transform: translateX(0px);
  transform: translateX(0px);
}
.navi.show ul.main li {
  -webkit-transform: translateX(0px);
  -moz-transform: translateX(0px);
  -ms-transform: translateX(0px);
  -o-transform: translateX(0px);
  transform: translateX(0px);
  opacity: 1;
}
.navi ul.main { list-style-type: none; }
.navi ul.main li {
  -webkit-transform: translateX(40px);
  -moz-transform: translateX(40px);
  -ms-transform: translateX(40px);
  -o-transform: translateX(40px);
  transform: translateX(40px);
  opacity: 0;
  -webkit-transition: all 0.3s ease;
  -moz-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease;
}

.insidepagemenu > div {
  padding: 20px 20px;
  line-height: 140%;
}


@media (min-width: 1200px) {
  .burger {
    margin: 14px 14px 0 0;
  }
  .burger.clicked {
    margin: 14px 28px 0 0;
  }
}
@media (min-width: 992px) {
  .insidepage .burger {
    margin: 14px 14px 0 0;
  }
  .insidepage .burger.clicked {
    margin: 14px 28px 0 0;
  }
}
@media (max-width: 1450px) {
  .startpage .burger {
    margin: 2px 2px 0 0;
  }
}
@media (max-width: 1200px) {
  .startpage .burger {
    width: 65px;
    height: 65px;
  }
}

@media (max-width: 992px) {
  .burger {
    top: 0;
    right: 0;
    width: 80px;
    height: 80px;
    margin: 0;
  }
  .burger span, .burger span::before, .burger span::after {
    background-color: #c85000;
  }
  .insidepagemenu > div {
    padding: 20px 20px;
    line-height: 140%;
  }
  .insidepage .burger {
    width: 65px;
    height: 65px;
  }
  .insidepage .burger {
    margin: 2px 2px 0 0;
  }
}