/*=======================================================
  colors
=======================================================*/
/* primär */
/* sekundär */
/* KA - Color CI */
/* Gray */
/* Light Colors */
/* Blue */
/* Orange */
/* Yellow */
/* Green */
/* path variables */
/* box shadow */
/* shadow inset */
.boxShadowInset {
  -webkit-box-shadow: 1px 1px 2px 0 rgba(0, 0, 0, 0.2) inset;
  box-shadow: 1px 1px 2px 0 rgba(0, 0, 0, 0.2) inset;
}
/* transition */
.transition {
  -webkit-transition: all 500ms ease-in-out;
  /* Firefox */
  -moz-transition: all 500ms ease-in-out;
  /* WebKit */
  -o-transition: all 500ms ease-in-out;
  /* Opera */
  transition: all 500ms ease-in-out;
  /* Standard */
}
.transitionNone {
  -webkit-transition: none;
  /* Firefox */
  -moz-transition: none;
  /* WebKit */
  -o-transition: none;
  /* Opera */
  transition: none;
  /* Standard */
}
.transform {
  -webkit-transform: rotate(90deg);
  -moz-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  -o-transform: rotate(90deg);
  transform: rotate(90deg);
}
.transformTwo {
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  transform: rotate(180deg);
}
.transformThree {
  -webkit-transform: rotate(4deg);
  -moz-transform: rotate(4deg);
  -ms-transform: rotate(4deg);
  -o-transform: rotate(4deg);
  transform: rotate(4deg);
}
.transformFour {
  -webkit-transform: rotate(255deg);
  -moz-transform: rotate(255deg);
  -ms-transform: rotate(255deg);
  -o-transform: rotate(255deg);
  transform: rotate(255deg);
}
.slideDown {
  -webkit-transition: height 500ms linear;
  -moz-transition: height 500ms linear;
  -ms-transition: height 500ms linear;
  -o-transition: height 500ms linear;
  transition: height 500ms linear;
}
.bgCover {
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}
.transitionColor {
  -webkit-transition: color 500ms ease-in-out;
  /* Firefox */
  -moz-transition: color 500ms ease-in-out;
  /* WebKit */
  -o-transition: color 500ms ease-in-out;
  /* Opera */
  transition: color 500ms ease-in-out;
  /* Standard */
}
.cssArrow {
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 7px 5px 0;
  border-color: #000000 transparent transparent transparent;
}
/*=======================================================
  short class
=======================================================*/
.clear {
  clear: both;
}
.clearfix {
  clear: both;
  content: "";
  display: block;
  height: 0;
  line-height: 0;
  visibility: hidden;
}
.visuallyhidden {
  border: 0 none;
  clip: rect(0px, 0px, 0px, 0px);
  height: 1px;
  margin: -1px;
  overflow: hidden;
  padding: 0;
  position: absolute;
  width: 1px;
}
/*=======================================================
  navigation
=======================================================*/
@media only screen and (min-width: 1920px) {
  .navigationHolder nav ul li.hasChildren .subMenu ul {
    right: auto;
    left: 0;
    width: 350px;
  }
  .navigationHolder nav ul li.hasChildren .subMenu ul li a {
    font-size: 16px;
  }
  .navigationHolder nav ul li.hasChildren .subMenu ul li > span ul {
    /* third level */
    width: 350px;
  }
}
@media only screen and (max-width: 1219px) {
  /* burger */
  .burger {
    display: block;
  }
  /* header */
  header {
    z-index: 2;
    top: 0;
    right: 0;
    left: 0;
    /* starting point */
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
  }
  .navigationHolder {
    float: right;
    height: 100%;
    position: fixed;
    right: 0;
    top: 0;
    width: 100%;
    max-width: 260px;
    overflow-y: auto;
  }
  nav .open {
    opacity: 1;
    -webkit-transform: translate3d(0, 0, 0) scale(1);
    -webkit-animation: slideIn 0.35s ease-in-out;
    -moz-transform: translate3d(0, 0, 0) scale(1);
    -moz-animation: slideIn 0.35s ease-in-out;
    transform: translate3d(0, 0, 0) scale(1);
    animation: slideIn 0.35s ease-in-out;
  }
  @-webkit-keyframes slideIn {
    0% {
      opacity: 0.3;
      -webkit-transform: translate3d(5%, 0, 0) scale(0.97);
    }
    100% {
      opacity: 1;
      -webkit-transform: translate3d(0, 0, 0) scale(1);
    }
  }
  @-moz-keyframes slideIn {
    0% {
      opacity: 0.3;
      -moz-transform: translate3d(5%, 0, 0) scale(0.97);
    }
    100% {
      opacity: 1;
      -moz-transform: translate3d(0, 0, 0) scale(1);
    }
  }
  @keyframes slideIn {
    0% {
      opacity: 0.3;
      transform: translate3d(5%, 0, 0) scale(0.97);
    }
    100% {
      opacity: 1;
      transform: translate3d(0, 0, 0) scale(1);
    }
  }
  nav .close {
    opacity: 0.3;
    -webkit-transform: translate3d(5%, 0, 0) scale(0.97);
    -webkit-animation: slideOut 0.3s ease-in-out;
    -moz-transform: translate3d(5%, 0, 0) scale(0.97);
    -moz-animation: slideOut 0.3s ease-in-out;
    transform: translate3d(5%, 0, 0) scale(0.97);
    animation: slideOut 0.3s ease-in-out;
  }
  @-webkit-keyframes slideOut {
    0% {
      opacity: 1;
      -webkit-transform: translate3d(0, 0, 0) scale(1);
    }
    100% {
      opacity: 0.3;
      -webkit-transform: translate3d(5%, 0, 0) scale(0.97);
    }
  }
  @-moz-keyframes slideOut {
    0% {
      opacity: 1;
      -moz-transform: translate3d(0, 0, 0) scale(1);
    }
    100% {
      opacity: 0.3;
      -moz-transform: translate3d(5%, 0, 0) scale(0.97);
    }
  }
  @keyframes slideOut {
    0% {
      opacity: 1;
      transform: translate3d(0, 0, 0) scale(1);
    }
    100% {
      opacity: 0.3;
      transform: translate3d(5%, 0, 0) scale(0.97);
    }
  }
  header.open,
  .content.open {
    -webkit-transform: translate3d(-240px, 0, 0);
    -webkit-animation: open 0.5s ease-in-out;
    -moz-transform: translate3d(-240px, 0, 0);
    -moz-animation: open 0.5s ease-in-out;
    transform: translate3d(-240px, 0, 0);
    animation: open 0.5s ease-in-out;
  }
  @-webkit-keyframes open {
    0% {
      -webkit-transform: translate3d(0, 0, 0);
    }
    70% {
      -webkit-transform: translate3d(-260px, 0, 0);
    }
    100% {
      -webkit-transform: translate3d(-240px, 0, 0);
    }
  }
  @-moz-keyframes open {
    0% {
      -moz-transform: translate3d(0, 0, 0);
    }
    70% {
      -moz-transform: translate3d(-260px, 0, 0);
    }
    100% {
      -moz-transform: translate3d(-240px, 0, 0);
    }
  }
  @keyframes open {
    0% {
      transform: translate3d(0, 0, 0);
    }
    70% {
      transform: translate3d(-260px, 0, 0);
    }
    100% {
      transform: translate3d(-240px, 0, 0);
    }
  }
  header.close,
  .content.close {
    -webkit-transform: translate3d(0, 0, 0);
    -webkit-animation: close 0.3s ease-in-out;
    -moz-transform: translate3d(0, 0, 0);
    -moz-animation: close 0.3s ease-in-out;
    transform: translate3d(0, 0, 0);
    animation: close 0.3s ease-in-out;
  }
  @-webkit-keyframes close {
    0% {
      -webkit-transform: translate3d(-240px, 0, 0);
    }
    100% {
      -webkit-transform: translate3d(0, 0, 0);
    }
  }
  @-moz-keyframes close {
    0% {
      -moz-transform: translate3d(-240px, 0, 0);
    }
    100% {
      -moz-transform: translate3d(0, 0, 0);
    }
  }
  @keyframes close {
    0% {
      transform: translate3d(-240px, 0, 0);
    }
    100% {
      transform: translate3d(0, 0, 0);
    }
  }
  .content {
    /* starting point */
    -webkit-transform: translate3d(0, 0, 0);
    -moz-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    z-index: 1;
  }
  /* end of media */
}
@media only screen and (min-width: 480px) and (max-width: 1219px) {
  .navigationHolder {
    max-width: 420px;
  }
  .navigationHolder nav {
    padding: 20px 0 20px 4%;
  }
  .navigationHolder nav ul li a {
    padding: 15px 20px;
  }
  .navigationHolder nav ul li.hasChildren .subMenu ul li {
    padding: 0;
  }
  .navigationHolder nav ul li.hasChildren .subMenu ul li a {
    padding: 12px 0px 12px 20px;
  }
  .navigationHolder nav ul li.hasChildren .subMenu ul li ul li a {
    padding: 10px 0 10px 20px;
  }
  header.open,
  .content.open {
    -webkit-transform: translate3d(-400px, 0, 0);
    -webkit-animation: open 0.5s ease-in-out;
    -moz-transform: translate3d(-400px, 0, 0);
    -moz-animation: open 0.5s ease-in-out;
    transform: translate3d(-400px, 0, 0);
    animation: open 0.5s ease-in-out;
  }
  @-webkit-keyframes open {
    0% {
      -webkit-transform: translate3d(0, 0, 0);
    }
    70% {
      -webkit-transform: translate3d(-420px, 0, 0);
    }
    100% {
      -webkit-transform: translate3d(-400px, 0, 0);
    }
  }
  @-moz-keyframes open {
    0% {
      -moz-transform: translate3d(0, 0, 0);
    }
    70% {
      -moz-transform: translate3d(-420px, 0, 0);
    }
    100% {
      -moz-transform: translate3d(-400px, 0, 0);
    }
  }
  @keyframes open {
    0% {
      transform: translate3d(0, 0, 0);
    }
    70% {
      transform: translate3d(-420px, 0, 0);
    }
    100% {
      transform: translate3d(-400px, 0, 0);
    }
  }
  @-webkit-keyframes close {
    0% {
      -webkit-transform: translate3d(-400px, 0, 0);
    }
    100% {
      -webkit-transform: translate3d(0, 0, 0);
    }
  }
  @-moz-keyframes close {
    0% {
      -moz-transform: translate3d(-400px, 0, 0);
    }
    100% {
      -moz-transform: translate3d(0, 0, 0);
    }
  }
  @keyframes close {
    0% {
      transform: translate3d(-400px, 0, 0);
    }
    100% {
      transform: translate3d(0, 0, 0);
    }
  }
}
@media only screen and (max-width: 767px) {
  .slider .sliderNavigation {
    display: none;
  }
  .slider .sliderContent h1 {
    font-size: 36px;
    line-height: 44px;
  }
}
@media only screen and (min-width: 640px) and (max-width: 767px) {
  /*=======================================================
  Content / hotspotImage
=======================================================*/
  .hotspotImage .hotspotItemContainer .item .textContainer {
    left: -235px;
    width: 490px;
  }
}
@media only screen and (max-width: 1219px) {
  /*=======================================================
	  Content / wertschöpfungskette
	=======================================================*/
  #chainTab {
    position: relative;
  }
  ul.tabs li:before,
  h2.resp-accordion:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 51%;
    background: #eceae7;
    -webkit-transform: skew(0deg, 6deg);
    -moz-transform: skew(0deg, 6deg);
    -ms-transform: skew(0deg, 6deg);
    -o-transform: skew(0deg, 6deg);
    transform: skew(0deg, 6deg);
    z-index: -1;
  }
  ul.tabs li:after,
  h2.resp-accordion:after {
    content: '';
    position: absolute;
    top: 0;
    right: 0;
    height: 100%;
    width: 50%;
    background: #eceae7;
    -webkit-transform: skew(0deg, -6deg);
    -moz-transform: skew(0deg, -6deg);
    -ms-transform: skew(0deg, -6deg);
    -o-transform: skew(0deg, -6deg);
    transform: skew(0deg, -6deg);
    z-index: -1;
  }
  ​ ul.tabs li.resp-tab-inactive:before,
  h2.resp-accordion.resp-tab-inactive:before {
    border-left: solid 1px #eceae7;
    border-top: solid 1px #eceae7;
    border-bottom: solid 1px #eceae7;
  }
  ul.tabs li.resp-tab-inactive:after,
  h2.resp-accordion.resp-tab-inactive:after {
    border-right: solid 1px #eceae7;
    border-top: solid 1px #eceae7;
    border-bottom: solid 1px #eceae7;
  }
  ul.tabs li.resp-tab-inactive:before,
  ul.tabs li.resp-tab-inactive:after,
  h2.resp-accordion.resp-tab-inactive:before,
  h2.resp-accordion.resp-tab-inactive:after {
    background: #ffffff;
  }
  h2.resp-accordion.resp-tab-active:before,
  h2.resp-accordion.resp-tab-active:after {
    border-bottom: solid 4px #fa6200;
  }
  ul.tabs li:first-child {
    padding: 0 0 40px;
  }
  ul.tabs li:first-child:before,
  ul.tabs li:first-child:after {
    height: 68%;
    top: auto;
    bottom: 0;
  }
  ul.tabs li:first-child .text {
    background: #eceae7;
    display: block;
    padding: 40px 10px 0;
  }
  ul.tabs li:last-child {
    padding: 40px 0 0;
  }
  ul.tabs li:last-child:before,
  ul.tabs li:last-child:after {
    height: 71%;
  }
  ul.tabs li:last-child .text {
    background: #eceae7;
    display: block;
    padding: 0 10px 40px;
  }
  .resp-tabs-container:before,
  .resp-tabs-container:after {
    background: #eceae7;
    content: "";
    display: block;
    height: 100px;
    position: absolute;
    width: 100%;
    z-index: -10;
  }
  .resp-tabs-container:before {
    top: -20px;
  }
  .resp-tabs-container:after {
    bottom: -20px;
  }
  .resp-tab-content {
    margin: 30px 0;
    position: relative;
  }
  .resp-tab-content:before {
    content: '';
    position: absolute;
    top: -20px;
    left: 0;
    height: 50px;
    width: 51%;
    background: #eceae7;
    -webkit-transform: skew(0deg, 6deg);
    -moz-transform: skew(0deg, 6deg);
    -ms-transform: skew(0deg, 6deg);
    -o-transform: skew(0deg, 6deg);
    transform: skew(0deg, 6deg);
    z-index: -1;
  }
  .resp-tab-content:after {
    content: '';
    position: absolute;
    top: -20px;
    right: 0;
    height: 50px;
    width: 50%;
    background: #eceae7;
    -webkit-transform: skew(0deg, -6deg);
    -moz-transform: skew(0deg, -6deg);
    -ms-transform: skew(0deg, -6deg);
    -o-transform: skew(0deg, -6deg);
    transform: skew(0deg, -6deg);
    z-index: -1;
  }
  .tabContent:before {
    content: '';
    position: absolute;
    bottom: -20px;
    left: 0;
    height: 50px;
    width: 51%;
    background: #eceae7;
    -webkit-transform: skew(0deg, 6deg);
    -moz-transform: skew(0deg, 6deg);
    -ms-transform: skew(0deg, 6deg);
    -o-transform: skew(0deg, 6deg);
    transform: skew(0deg, 6deg);
    z-index: -1;
  }
  .tabContent:after {
    content: '';
    position: absolute;
    bottom: -20px;
    right: 0;
    height: 50px;
    width: 50%;
    background: #eceae7;
    -webkit-transform: skew(0deg, -6deg);
    -moz-transform: skew(0deg, -6deg);
    -ms-transform: skew(0deg, -6deg);
    -o-transform: skew(0deg, -6deg);
    transform: skew(0deg, -6deg);
    z-index: -1;
  }
  .resp-tab-content:last-child .tabContent:before,
  .resp-tab-content:last-child .tabContent:after {
    display: none;
  }
  .topHead {
    display: block;
  }
  .topHead .linkRow .kesearch.search {
    display: none;
  }
  .topHead .linkRow .langSwitcher {
    display: none;
  }
  .topHead .linkRow > ul {
    display: flex;
    flex-flow: row;
    justify-content: flex-end;
  }
  .topHead .linkRow > ul li {
    margin: 10px 0 10px 20px;
    width: auto;
  }
  .topHead .linkRow > ul li:first-child {
    margin: 10px 0 10px 0;
  }
  .topHead .linkRow > ul li:last-child {
    margin: 10px 20px 10px 20px;
  }
  .topHead .linkRow > ul:after {
    clear: both;
    content: "";
    display: block;
    height: 0;
    line-height: 0;
    visibility: hidden;
  }
}
@media only screen and (min-width: 768px) and (max-width: 959px) {
  /*=======================================================
 	 Content / wertschöpfungskette
	=======================================================*/
  ul.tabs li,
  h2.resp-accordion {
    padding: 50px 10px 30px;
  }
  ul.tabs li:first-child {
    padding: 0 0 30px;
  }
  ul.tabs li:first-child:before,
  ul.tabs li:first-child:after {
    height: 75%;
  }
  ul.tabs li:first-child span {
    padding: 50px 10px 0;
  }
  ul.tabs li:last-child {
    padding: 50px 0 0;
  }
  ul.tabs li:last-child:before,
  ul.tabs li:last-child:after {
    height: 75%;
  }
  ul.tabs li:last-child span {
    padding: 0 10px 30px;
  }
}