/*
* Headlines
* 20px, 28px, 54px, 72px
*/
.zp-menu {
  position: fixed;
  width: 100vw;
  height: 100vh;
  z-index: 1001; }
  .zp-menu.nav-inactive {
    top: -100%;
    left: -100%; }
  .zp-menu.nav-active {
    top: 0;
    left: 0; }
  .zp-menu > div:not(.zp-menu-image-segments) {
    opacity: 0;
    transition: opacity 0.2s; }
  .zp-menu.finished-animation-black-background > div:not(.zp-menu-image-segments) {
    opacity: 1; }
  .zp-menu .zp-menu-image-segments {
    position: absolute;
    width: 100%;
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap; }
    .zp-menu .zp-menu-image-segments .zp-menu-background-segment {
      position: absolute;
      width: 22%;
      height: 27%;
      background-color: #000;
      -webkit-transform: scale(0);
              transform: scale(0);
      transition: -webkit-transform .03s;
      transition: transform .03s;
      transition: transform .03s, -webkit-transform .03s; }
      .zp-menu .zp-menu-image-segments .zp-menu-background-segment.zp-menu-background-segment-animate {
        -webkit-transform: scale(1);
                transform: scale(1); }
      .zp-menu .zp-menu-image-segments .zp-menu-background-segment.zp-menu-background-segment-1-1 {
        top: 0;
        left: 0; }
      .zp-menu .zp-menu-image-segments .zp-menu-background-segment.zp-menu-background-segment-1-2 {
        top: 0;
        left: 21%; }
      .zp-menu .zp-menu-image-segments .zp-menu-background-segment.zp-menu-background-segment-1-3 {
        top: 0;
        left: 41%; }
      .zp-menu .zp-menu-image-segments .zp-menu-background-segment.zp-menu-background-segment-1-4 {
        top: 0;
        left: 61%; }
      .zp-menu .zp-menu-image-segments .zp-menu-background-segment.zp-menu-background-segment-1-5 {
        top: 0;
        left: 81%; }
      .zp-menu .zp-menu-image-segments .zp-menu-background-segment.zp-menu-background-segment-2-1 {
        top: 26%;
        left: 0; }
      .zp-menu .zp-menu-image-segments .zp-menu-background-segment.zp-menu-background-segment-2-2 {
        top: 26%;
        left: 21%; }
      .zp-menu .zp-menu-image-segments .zp-menu-background-segment.zp-menu-background-segment-2-3 {
        top: 26%;
        left: 41%; }
      .zp-menu .zp-menu-image-segments .zp-menu-background-segment.zp-menu-background-segment-2-4 {
        top: 26%;
        left: 61%; }
      .zp-menu .zp-menu-image-segments .zp-menu-background-segment.zp-menu-background-segment-2-5 {
        top: 26%;
        left: 81%; }
      .zp-menu .zp-menu-image-segments .zp-menu-background-segment.zp-menu-background-segment-3-1 {
        top: 51%;
        left: 0; }
      .zp-menu .zp-menu-image-segments .zp-menu-background-segment.zp-menu-background-segment-3-2 {
        top: 51%;
        left: 21%; }
      .zp-menu .zp-menu-image-segments .zp-menu-background-segment.zp-menu-background-segment-3-3 {
        top: 51%;
        left: 41%; }
      .zp-menu .zp-menu-image-segments .zp-menu-background-segment.zp-menu-background-segment-3-4 {
        top: 51%;
        left: 61%; }
      .zp-menu .zp-menu-image-segments .zp-menu-background-segment.zp-menu-background-segment-3-5 {
        top: 51%;
        left: 81%; }
      .zp-menu .zp-menu-image-segments .zp-menu-background-segment.zp-menu-background-segment-4-1 {
        top: 76%;
        left: 0; }
      .zp-menu .zp-menu-image-segments .zp-menu-background-segment.zp-menu-background-segment-4-2 {
        top: 76%;
        left: 21%; }
      .zp-menu .zp-menu-image-segments .zp-menu-background-segment.zp-menu-background-segment-4-3 {
        top: 76%;
        left: 41%; }
      .zp-menu .zp-menu-image-segments .zp-menu-background-segment.zp-menu-background-segment-4-4 {
        top: 76%;
        left: 61%; }
      .zp-menu .zp-menu-image-segments .zp-menu-background-segment.zp-menu-background-segment-4-5 {
        top: 76%;
        left: 81%; }
      .zp-menu .zp-menu-image-segments .zp-menu-background-segment .zp-menu-image-segment {
        width: 100%;
        height: 100%;
        background-repeat: no-repeat;
        background-size: cover;
        background-position: center;
        opacity: 0;
        transition: opacity .2s; }
        .zp-menu .zp-menu-image-segments .zp-menu-background-segment .zp-menu-image-segment.zp-menu-image-segment-animate {
          opacity: 1; }
  .zp-menu .menu-menue-container, .zp-menu .menu-main-container {
    display: table;
    position: relative;
    top: 27%;
    left: 14%;
    z-index: 4;
    margin-left: -3px; }
    .zp-menu .menu-menue-container:hover .close-menu-line, .zp-menu .menu-main-container:hover .close-menu-line {
      width: 4px; }
    .zp-menu .menu-menue-container:hover + .impressum + .zweipro-mail + .close-menu + .zp-menu-moving-close-button .moving-close-button-line, .zp-menu .menu-main-container:hover + .impressum + .zweipro-mail + .close-menu + .zp-menu-moving-close-button .moving-close-button-line {
      width: 0; }
    @media only screen and (max-width: 480px) {
      .zp-menu .menu-menue-container, .zp-menu .menu-main-container {
        top: 15%; } }
    @media only screen and (max-height: 525px) {
      .zp-menu .menu-menue-container, .zp-menu .menu-main-container {
        top: 15%; } }
    .zp-menu .menu-menue-container .menu, .zp-menu .menu-main-container .menu {
      display: inline-block; }
      .zp-menu .menu-menue-container .menu .menu-item, .zp-menu .menu-main-container .menu .menu-item {
        position: relative;
        padding: 0;
        width: calc(100% + 20px);
        list-style: none;
        line-height: 62px;
        font-size: 66px;
        letter-spacing: -2px;
        text-transform: uppercase;
        height: 49px; }
        .zp-menu .menu-menue-container .menu .menu-item.current-menu-item a, .zp-menu .menu-main-container .menu .menu-item.current-menu-item a {
          padding-left: 62px; }
          .zp-menu .menu-menue-container .menu .menu-item.current-menu-item a::before, .zp-menu .menu-main-container .menu .menu-item.current-menu-item a::before {
            left: 0;
            width: 50px; }
        .zp-menu .menu-menue-container .menu .menu-item::before, .zp-menu .menu-menue-container .menu .menu-item::after, .zp-menu .menu-main-container .menu .menu-item::before, .zp-menu .menu-main-container .menu .menu-item::after {
          display: none; }
        @media only screen and (max-width: 600px) {
          .zp-menu .menu-menue-container .menu .menu-item, .zp-menu .menu-main-container .menu .menu-item {
            line-height: 44px;
            font-size: 32px;
            letter-spacing: -1px; } }
        @media only screen and (max-height: 525px) {
          .zp-menu .menu-menue-container .menu .menu-item, .zp-menu .menu-main-container .menu .menu-item {
            line-height: 44px;
            font-size: 32px;
            letter-spacing: -1px; } }
        @media only screen and (max-height: 430px) {
          .zp-menu .menu-menue-container .menu .menu-item, .zp-menu .menu-main-container .menu .menu-item {
            height: 33px; } }
        @media only screen and (max-height: 325px) {
          .zp-menu .menu-menue-container .menu .menu-item, .zp-menu .menu-main-container .menu .menu-item {
            height: 30px; } }
        .zp-menu .menu-menue-container .menu .menu-item a, .zp-menu .menu-main-container .menu .menu-item a {
          display: block;
          color: #fff;
          padding-left: 0;
          max-height: 50px; }
          .zp-menu .menu-menue-container .menu .menu-item a .title, .zp-menu .menu-main-container .menu .menu-item a .title {
            pointer-events: none;
            font-family: "ClvText-Black", Arial, Gotham, sans-serif; }
      .zp-menu .menu-menue-container .menu > .menu-item > a, .zp-menu .menu-main-container .menu > .menu-item > a {
        position: relative;
        transition: padding-left .2s; }
        .zp-menu .menu-menue-container .menu > .menu-item > a::before, .zp-menu .menu-main-container .menu > .menu-item > a::before {
          content: "";
          position: absolute;
          top: 40%;
          left: 0;
          width: 0;
          height: 4px;
          background-color: #fff;
          -webkit-transform: translateY(-50%);
                  transform: translateY(-50%);
          transition: width .2s; }
      .zp-menu .menu-menue-container .menu > .menu-item > .sub-menu, .zp-menu .menu-main-container .menu > .menu-item > .sub-menu {
        position: relative;
        overflow: hidden;
        line-height: 0;
        transition: line-height .2s; }
        .zp-menu .menu-menue-container .menu > .menu-item > .sub-menu .menu-item a, .zp-menu .menu-main-container .menu > .menu-item > .sub-menu .menu-item a {
          padding-left: 30px;
          display: block; }
      .zp-menu .menu-menue-container .menu > .menu-item.menu-item-has-children:hover > .sub-menu, .zp-menu .menu-main-container .menu > .menu-item.menu-item-has-children:hover > .sub-menu {
        line-height: 1.2; }
      .zp-menu .menu-menue-container .menu > .menu-item:hover > a, .zp-menu .menu-main-container .menu > .menu-item:hover > a {
        padding-left: 62px; }
        .zp-menu .menu-menue-container .menu > .menu-item:hover > a::before, .zp-menu .menu-main-container .menu > .menu-item:hover > a::before {
          left: 0;
          width: 50px; }
  .zp-menu .impressum {
    position: relative;
    top: 27%;
    left: 14%;
    -webkit-transform: translateY(40px);
            transform: translateY(40px);
    font-family: "ClvText-Bold", Arial, Gotham, sans-serif;
    font-size: 20px;
    text-transform: uppercase;
    z-index: 3;
    display: table; }
    .zp-menu .impressum:hover + .zweipro-mail + .close-menu + .zp-menu-moving-close-button .moving-close-button-line {
      width: 0px; }
    @media only screen and (max-width: 480px) {
      .zp-menu .impressum {
        top: 13%; } }
    @media only screen and (max-height: 525px) {
      .zp-menu .impressum {
        top: 13%; } }
    .zp-menu .impressum a {
      color: white; }
  .zp-menu .zweipro-mail {
    position: absolute;
    bottom: 52px;
    left: 45px;
    -webkit-transform: rotate(-90deg);
            transform: rotate(-90deg);
    -webkit-transform-origin: 0 0;
            transform-origin: 0 0;
    font-size: 20px;
    text-transform: uppercase;
    z-index: 2; }
    .zp-menu .zweipro-mail:hover + .close-menu + .zp-menu-moving-close-button .moving-close-button-line {
      width: 0; }
    .zp-menu .zweipro-mail span {
      color: #fff;
      padding-top: 6px;
      display: inline-block;
      font-family: "ClvText-Medium", Arial, Gotham, sans-serif;
      cursor: pointer; }
    @media only screen and (max-width: 1024px) {
      .zp-menu .zweipro-mail {
        left: 25px; } }
    @media only screen and (max-width: 480px) {
      .zp-menu .zweipro-mail {
        left: 8px; } }
  .zp-menu .close-menu {
    position: absolute;
    top: 38px;
    left: 45px;
    width: 30px;
    height: 30px;
    cursor: pointer;
    z-index: 1; }
    @media only screen and (max-width: 1024px) {
      .zp-menu .close-menu {
        top: 26px;
        left: 25px; } }
    @media only screen and (max-width: 480px) {
      .zp-menu .close-menu {
        top: 15px;
        left: 15px; } }
    .zp-menu .close-menu:hover .close-menu-line {
      width: 4px;
      background-color: #fff; }
    .zp-menu .close-menu:hover + .zp-menu-moving-close-button {
      transition: opacity 0.2s, top 0.2s, left 0.2s !important;
      top: 38px !important;
      left: 45px !important; }
      @media only screen and (max-width: 1024px) {
        .zp-menu .close-menu:hover + .zp-menu-moving-close-button {
          top: 25px !important;
          left: 25px !important; } }
      @media only screen and (max-width: 480px) {
        .zp-menu .close-menu:hover + .zp-menu-moving-close-button {
          top: 15px !important;
          left: 15px !important; } }
      .zp-menu .close-menu:hover + .zp-menu-moving-close-button .moving-close-button-line {
        width: 4px; }
    .zp-menu .close-menu .close-menu-line {
      transition: width 0.2s,background-color 0.2s;
      position: absolute;
      width: 24px;
      height: 2px;
      background-color: #fff;
      top: 50%;
      left: 50%;
      -webkit-transform-origin: 0 0;
              transform-origin: 0 0;
      border-radius: 2px;
      z-index: 1; }
      .zp-menu .close-menu .close-menu-line.close-menu-line-left {
        -webkit-transform: rotate(45deg) translateX(-50%) translateY(-50%);
                transform: rotate(45deg) translateX(-50%) translateY(-50%); }
      .zp-menu .close-menu .close-menu-line.close-menu-line-right {
        -webkit-transform: rotate(-45deg) translateX(-50%) translateY(-50%);
                transform: rotate(-45deg) translateX(-50%) translateY(-50%); }

html.zp-touch .close-menu .close-menu-line {
  background-color: #fff; }
