/*
* Prefixed by https://autoprefixer.github.io
* PostCSS: v7.0.29,
* Autoprefixer: v9.7.6
* Browsers: last 4 version
*/

body, body.neopage {
    -ms-overflow-style: scrollbar;
    font-size: 16px;
    line-height: 20px;
    font-style: normal;
    position: relative;
    font-family: 'Montserrat', sans-serif;
    color: #ffffff;
    background-color: #000000 !important;
    background-image: url('../img/bg2.jpg');
    background-position: center bottom;
    background-repeat: no-repeat;
    background-size: contain;
    height:100%;
    min-height: 100%;
    max-height:100%;
    height: -webkit-fill-available;
    max-height: -webkit-fill-available;
    min-height: -webkit-fill-available;
}

html { 
    overflow-x: hidden; 
    -ms-touch-action: manipulation; 
    touch-action: manipulation; 
    -webkit-overflow-scrolling: touch; 
}


html.nav-opened,
html.mod-opened {
    position: fixed; 
    overflow-y: hidden;
    width: 100%;
}


html.landscape {
    transform: rotate(-90deg);
    transform-origin: left top;
    width: 100vh;
    overflow-x: hidden;
    position: absolute;
    top: 100%;
    left: 0;
}




.clearfix::before,
.clearfix::after {
  content: " ";
  display: table;
} 

.clearfix::after {
  clear: both;
}

.clearfix {
  *zoom: 1; /* Für den IE6 und IE7 */
}

::-moz-selection {
    background: #EB9772;
    color: #212121;
    text-shadow: none;
}

::selection {
    background: #EB9772;
    color: #212121;
    text-shadow: none;
}

::-moz-selection {
    background: #EB9772;
    color: #212121;
    text-shadow: none;
}

.noselect {
  -webkit-touch-callout: none; 
    -webkit-user-select: none; 
       -moz-user-select: none; 
        -ms-user-select: none; 
            user-select: none;                                
}

h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6 {
    display: block;
    font-weight: 400;
    margin: 0 0 12px;
    font-style: normal;
}



h1 {
    font-size: calc(22px + 10 * ((100vw - 300px) / 179)); 
    line-height: calc(24px + 12 * ((100vw - 300px) / 179)); 
    color: #ffffff;
    text-transform: uppercase;
}

h2 {
    font-size: 21px;
    line-height: 29px;
    color: #ffffff;
}

h2.text-hero {
    font-size: 24px;
    line-height: 31px;
    color: #ffffff;
    text-transform: uppercase;
}

h3 {
    font-size: 19px;
    line-height: 28px;
    color: #ffffff;
}

h4 {
    font-size: 18px;
    line-height: 27px;
}

h5 {
    font-size: 17px;
    line-height: 25px;
}

h6 {
    font-size: 16px;
    line-height: 24px;
}

p,
ul li,
ol li {   
    font-size: 16px;
    font-style: normal;
    line-height: 24px;
    font-weight: 400;    
    margin: 0 0 12px;
}

@media screen and (min-width: 768px) {

    h1 {
        font-size: 70px;
        line-height: 76px;
        margin: 0 0 32px;
    }

    h2 {
        font-size: 40px;
        line-height: 54px;
        margin: 0 0 32px;
    }

    h2.text-hero {
        font-size: 70px;
        line-height: 76px;
        margin: 0 0 32px;
    }

    h3 {
        font-size: 25px;
        line-height: 30px;
    }

    h4 {
        font-size: 23px;
        line-height: 28px;
    }

    h5 {
        font-size: 20px;
        line-height: 26px;  
    }

    h6 {
        font-size: 19px;
        line-height: 27px;
    }

    p,
    ul li,
    ol li {   
        font-size: 18px;
        font-style: normal;
        line-height: 26px;
        font-weight: 400;    
        margin: 0 0 15px;
    }

}

.svg img{
    min-width: 330px;
    
}


.neopage p.text-hero,
.neopage p > span.text-hero {
    font-size: 40px;
    color: #819682;   
    line-height: 54px;
    margin: 0 0 15px;  
    font-weight: 700;  
}

.neopage p.text-tiny,
.neopage p > span.text-tiny {
    font-size: 12px;
    line-height: 14px;    
}

.neopage p > span.text-xxl,
.neopage p.text-xxl { font-size: 70px; line-height: 76px; font-weight: 700; }

.neopage p > span.text-xl,
.neopage p.text-xl { font-size: 40px; line-height: 54px; font-weight: 700; }

.neopage p > span.text-l,
.neopage p.text-l { font-size: 25px; line-height: 30px; font-weight: 700; }



@media screen and (min-width: 768px) and (max-width: 1199px) {
    
    
    .text-shiftleft1 { margin-left: 1vw; }
    .text-shiftleft2 { margin-left: 2vw; }
    .text-shiftleft3 { margin-left: 3vw; }
    .text-shiftleft4 { margin-left: 4vw; }
    .text-shiftleft5 { margin-left: 5vw; }
    .text-shiftleft6 { margin-left: 6vw; }
    .text-shiftleft7 { margin-left: 7vw; }
    .text-shiftleft8 { margin-left: 8vw; }
    .text-shiftleft9 { margin-left: 9vw; }
    .text-shiftleft10 { margin-left: 10vw; }
    .text-shiftleft11 { margin-left: 11vw; }
    .text-shiftleft12 { margin-left: 12vw; }

}

@media screen and (min-width: 1200px) {
   
    .text-shiftleft1 { margin-left: 1vw; }
    .text-shiftleft2 { margin-left: 2vw; }
    .text-shiftleft3 { margin-left: 3vw; }
    .text-shiftleft4 { margin-left: 4vw; }
    .text-shiftleft5 { margin-left: 5vw; }
    .text-shiftleft6 { margin-left: 6vw; }
    .text-shiftleft7 { margin-left: 7vw; }
    .text-shiftleft8 { margin-left: 8vw; }
    .text-shiftleft9 { margin-left: 9vw; }
    .text-shiftleft10 { margin-left: 10vw; }
    .text-shiftleft11 { margin-left: 11vw; }
    .text-shiftleft12 { margin-left: 12vw; }

}


cite, em, var, address, dfn { font-style: italic; }
i { font-style: normal; }
p > i { font-style: italic; }
blockquote { border-left: 0px; }


iframe {
    border: none;
    width: 100%;
}

/* Avoid collapsing margins */
.container:before, .container:after,
.container-fluid:before, .container-fluid:after {
    content: ' ';
    display: table;
}

/* Links */
a {
    color: #ffffff !important;
    text-decoration: none !important;
    outline: none !important;
    cursor: pointer;
}

/* fixed header adjustment*/
.main-container {
    padding-top: 70px; 
    position: relative;
    height: 100vh;
    height: 100dvh;
    height: 100svh;
}

.main-container p > a {
    color: #ffffff;
    border-bottom: 1px solid #ffffff;
    line-height: 24px;
}

.main-container p > a:hover {
    color: #ffffff;
    border-color: #ffffff;
}

.main-content { height: 100%; position:relative; display:flex; flex-direction:row; }

/*#decorselector { */
/*    height:100%; */
/*    width:320px; */
/*    background: #1d1d1d; */
/*    position: absolute; */
/*    top:0; */
/*    right: 0;*/
/*}*/

#decorselector { 
    height:100%; 
    width:320px; 
    background: #1d1d1d; 
    position: relative; 
}


#decorselector > ul {
  display: flex;
  height: 100%;
  width: 100%;
  flex-direction: column;
  margin:0;
}

#decorselector li > h4 {
  width:100%;
  height:50px;
  display: block;
  position:relative;
  background: #313131;
  border-bottom: 1px solid rgba(255,255,255,0.1);
  margin-bottom:0;
  line-height: 50px;
  padding-left: 15px;
  font-size: 18px;
  cursor: pointer;
}
#decorselector li > h4:Hover {
    text-shadow:1px 1px 4px #000, 1px 1px 15px #444;
    background: #2b2e36;
}

#decorselector > ul > li {
  flex: 1;
  max-height:50px;
  transition: flex 500ms;
  position:relative;
  margin:0;
}
#decorselector > ul > li::after {
  content: "";
  height: 6px;
  width: 100%;
  left: 0;
  bottom: -6px;
  z-index: 97;
  background: none;
  background: -webkit-gradient(linear,left top, left bottom,from(rgba(0,0,0,0.3)),to(rgba(0,0,0,0)));
  background: -o-linear-gradient(top,rgba(0,0,0,0.3) 0%,rgba(0,0,0,0) 100%);
  background: linear-gradient(180deg,rgba(0,0,0,0.3) 0%,rgba(0,0,0,0) 100%);
  position: absolute;
}

#decorselector > ul > li.active {
  transition: flex 500ms;
  max-height:none;  
  background: rgb(59,60,63);
background: -moz-linear-gradient(0deg, rgba(59,60,63,1) 0%, rgba(59,60,63,1) 82%, rgba(46,48,51,1) 100%);
background: -webkit-linear-gradient(0deg, rgba(59,60,63,1) 0%, rgba(59,60,63,1) 82%, rgba(46,48,51,1) 100%);
background: linear-gradient(0deg, rgba(59,60,63,1) 0%, rgba(59,60,63,1) 82%, rgba(46,48,51,1) 100%);
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#3b3c3f",endColorstr="#2e3033",GradientType=1);
  text-shadow: 0 0 1px #ffffff, 0 0 4px #577388,  0 0 8px #3d4246;
}

#decorselector > ul > li ul {
  background: #1d1d1d;
  height: calc(100% - 50px);
  overflow-y: auto;
  text-shadow: none;
}
#decorselector > ul > li ul li {
  padding-left: 40px;
  font-size: 16px;
  height:40px;
  line-height:40px;
  display: block;
  cursor: pointer;
  position:relative;
}

#decorselector > ul > li ul li::before {
  content: "";
  width: 9px;
  border: 1px solid rgba(0,0,0,0.25);
  border-radius:9px;
  height: 9px;
  background: none;
  position: absolute;
  top: 50%;
  transform: translate(-24px, -50%);
  background: rgba(0,0,0,0.1);
  box-shadow: 0 0 1px #fff;
}

#decorselector > ul > li ul li:hover {
background: rgba(40, 40, 40, 0.8);
}

#decorselector > ul > li ul li.active {
background: rgba(40, 40, 40, 0.8);
/*background: rgb(59,60,63);*/
/*background: -moz-linear-gradient(0deg, rgba(59,60,63,1) 0%, rgba(59,60,63,1) 82%, rgba(46,48,51,1) 100%);*/
/*background: -webkit-linear-gradient(0deg, rgba(59,60,63,1) 0%, rgba(59,60,63,1) 82%, rgba(46,48,51,1) 100%);*/
/*background: linear-gradient(0deg, rgba(59,60,63,1) 0%, rgba(59,60,63,1) 82%, rgba(46,48,51,1) 100%);*/
/*filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#3b3c3f",endColorstr="#2e3033",GradientType=1);*/
  text-shadow: 0 0 1px #ffffff, 0 0 4px #577388,  0 0 8px #3d4246;
}

#decorselector > ul > li ul li.active::before {
  border: 1px solid rgba(0,0,0,0.5);
  background: rgba(255,255,255,1);
  box-shadow: 0 0 1px #fff, 0 0 4px #577388, 0 0 8px #3d4246;
}


#decorselector > ul > li ul li.wr:after {
  content: "\e91a";  
  font-family: 'icomoon' !important;
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  color:inherit;
  position:absolute;
  right:10px;
  display: inline-block;
  top: 50%;
  transform: translateY(-50%);
  opacity: 0.3;
}


#decorselector.wr > ul > li ul li:not(.wr) {
    display: none;
}


/*#decorcanvas {*/
/*    position: relative;*/
/*    height:100%;*/
/*    width: calc(100% - 320px);*/
/*    overflow-y:auto;*/
/*    background-color: #111111;*/
/*}*/

#decorcanvas {
  /*position: relative;*/
  height: 100%;
  min-width: calc(56.25vh);
  overflow-y: auto;
  background-color: #111111;
  flex-grow: 2;
}

#decorcanvas video {
    position: fixed;
    height: calc(100vh - 70px);
    top:70px;
    left:0%;
    z-index:1;
    background: #11250d;
}

/*#decorcanvas canvas {*/
/*    position: fixed;*/
/*    height: calc(100vh - 70px);*/
/*    top:70px;*/
/*    left: calc(50% - 160px);*/
/*    transform: translateX(-50%);*/
/*    z-index:1;*/
/*    background: #555555;*/
/*    pointer-events: none;*/
/*}*/

#decorcanvas canvas {
  position: absolute;
  height: 100%;
  z-index: 1;
  background: #555555;
  pointer-events: none;
  right: calc(50% - 320px);
  transform: translateX(-50%);
}  

/*#renderings {*/
/*    position: relative;*/
/*    height:100%;*/
/*    width: calc(100% - 320px);*/
/*    overflow-y:auto;*/
/*    background-color: #111111;*/
/*    display: none;*/
/*    z-index:3;*/
/*}*/

#renderings {
  position: relative;
  height: 100%;
  width: auto;
  overflow-y: auto;
  background-color: #111111;
  display: none;
  z-index: 3;
  flex-grow: 3;
}

#renderings .item {
  position: absolute;
  display: none;
  width: calc(100% - 30px);
  height: 100%;
  top: 0;
  left: 30px;
  overflow: hidden;
  transform-origin: left center;
  transform: perspective(400px) rotateY(10deg);
  transition: transform 0.5s ease-in-out;  
}

/*#renderings .item:hover {*/
/*  position: absolute;*/
/*  display: none;*/
/*  width: calc(100% - 30px);*/
/*  height: 100%;*/
/*  top: 0;*/
/*  left: 30px;*/
/*  overflow: hidden;*/
/*  transform-origin: left center;*/
/*  transform: perspective(400px) rotateY(0deg);*/
/*  transition: transform 0.5s ease-in-out;*/
/*}*/


#renderings .item.active {
    display: flex;
    flex-direction:column;
}

.main-content.wr #decorcanvas {
    display: block;
}
.main-content.wr #renderings {
    display: block;
}

.main-content.wr #decorcanvas canvas { 
  top: 0;
  right: 380px;
  transform: none;
}


.sticky-header .form-switch {
  position: absolute;
  left: 50%;
  transform: translate(-50%, -50%);
  top: 32px;
  display:none;
}
.sticky-header .form-switch label {
  float:left;
  margin-right: 3rem;
}

#spinner {
    position:absolute;
    top: 50%;
    left:50%;
    transform: translate(-50%,-50%);
    display: none;
    z-index:99;
}

#spinner.active {
    display: block;
}

button.showcase,
button.decorview {
    display: none;
    position:absolute;
    font-size: 17px;
    line-height:17px;
    padding: 6px 16px;
    color: #ffffff;
    border: 1px solid #ffffff;
    background-color: #454545;
    border-radius: 22px;
    bottom: 30px; 
    right: 370px;
    z-index:1 ;
    box-shadow: 1px 2px 8px 3px rgba(0,0,0,0.25);
}

button.showcase.active,
button.decorview.active {
    display: block;
}

button.showcase:hover,
button.decorview:hover {

}

.switchcontrol { display: none; }

.timecontrol {
   height: 300%;
}
.timecontrol.touch {
   height: 100% !important;
}


.range-slider {
    position: fixed;
    top: 120px;
    left: 400px;
    z-index: 3;
    height: calc(100vh - 170px);
    padding: 0;
}

.range-slider .rs-range {
  height: 100%;
  width: 1px;
  padding: 0px;
  -webkit-appearance: none;
  writing-mode: bt-lr; /* IE */
  -webkit-appearance: slider-vertical; /* Chromium */
}

.range-slider .rs-range:focus {
  outline: none;
}
.range-slider .rs-range::-webkit-slider-runnable-track {
  width: 1px;
  height: 100%;
  cursor: pointer;
  box-shadow: none;
  background: #ffffff;
  border-radius: 0px;
  border: 0px solid #010101;
}
.range-slider .rs-range::-moz-range-track {
  width: 1px;
  height: 100%;
  cursor: pointer;
  box-shadow: none;
  background: #ffffff;
  border-radius: 0px;
  border: 0px solid #010101;
}
.range-slider .rs-range::-webkit-slider-thumb {
  box-shadow: none;
  border: 0px solid #ffffff;
  box-shadow: 0px 10px 10px rgba(0, 0, 0, 0.25);
  height: 22px;
  width: 41px;
  border-radius: 22px;
  background: white;
  cursor: pointer;
  -webkit-appearance: none;
  margin-left: -20px;
}
.range-slider .rs-range::-moz-range-thumb {
  box-shadow: none;
  border: 0px solid #ffffff;
  box-shadow: 0px 10px 10px rgba(0, 0, 0, 0.25);
  height: 22px;
  width: 41px;
  border-radius: 22px;
  background: white;
  cursor: pointer;
  -webkit-appearance: none;
  margin-left: -20px;
}
.range-slider .rs-range::-moz-focus-outer {
  border: 0;
}

.requestPermission { 
    width: 50%;
    max-width: 240px;
    display: none;
    z-index: 99;
    position:absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
}
.requestPermission.show { display: block; }
.requestPermission h4 { color: #444444; }

.requestPermission button {
    
}
.requestPermission button img {
    width: 100%;
    height: auto; 
    margin:0;
}


#decorselector,
#decorcanvas {
  overflow: none;
  overscroll-behavior: contain;
}

body {
  /* Disables pull-to-refresh but allows overscroll glow effects. */
  overscroll-behavior-y: contain;
}




.rendering {
  width: auto;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-grow: 2;
  padding: 20px;
  height:33%;
}

.rendering img {
  border: 2px solid rgba(255,255,255,0.8);
  display: block;
  max-width:100%;
  max-height:100%;
  width: auto;
  height: auto;
  transition: border 0.5s ease-in-out;
}


/*.rendering:first-of-type img {*/
/*  transform-origin: left bottom;*/
/*  transform: perspective(400px) rotateY(10deg) skewY(4deg);*/
/*}*/
/*.rendering:last-of-type img {*/
/*  transform-origin: left top;*/
/*  transform: perspective(400px) rotateY(10deg) skewY(-4deg);*/
/*}*/


/* Tablet Portrait */
@media only screen and (min-device-width : 768px) and (max-device-width : 1380px) and (orientation : portrait) {

  #decorcanvas {
      position: relative !important;
      height: 100%;
      overflow-y: auto;
      background-color: #111111;
      flex-grow: 2;
  }
    #decorcanvas canvas {
        left: 0 !important;
        margin: 0 auto;
    }
    
  #renderings {
      width: 50%;
      max-width: 300px;
  }

}

/* Tablet Landscape */
@media only screen and (min-device-width : 768px) and (max-device-width : 1380px) and (orientation : landscape) {

  #decorcanvas {
      position: relative !important;
      height: 100%;
      overflow-y: auto;
      background-color: #111111;
      flex-grow: 2;
  }
    #decorcanvas canvas {
        left: 0 !important;
        margin: 0 auto;
    }
    
  #renderings {
      width: 50%;
      max-width: 50%;
  }

}


@media (max-width:991px) {

    #decorcanvas canvas {
        left: 50%;
    }

}


@media (min-width:768px) and (max-width:1199px) {

  #decorcanvas canvas {
    transform: none;
    right: 20px;
    position: absolute;
  }
  .main-content.wr #decorcanvas canvas {
    top: 0;
    right: 20px;
    transform: none;
  }

    #decorselector {
      height: 100%;
      width: 320px;
      background: #1d1d1d;
      position: absolute;
      top: 0;
      right: 0;
    }

    #decorselector  {
        z-index:2;
        transform: translateX(100%);
    }
    #decorselector.activated  {
        transform: translateX(0%);
    }

     #decorselector .handle.open {
         position: absolute;
         top: 50%;
         transform: translate(0,-50%);
         right:100%;
         height:200px;
         width:70px;
         z-index: 322;
         overflow: hidden;
     }
     
    #decorselector.activated .handle.open {
         display: none;
    }
     #decorselector .handle.close {
         position: absolute;
         top: 50%;
         transform: translate(0,-50%);
         right:0;
         height:200px;
         width:70px;
         z-index: 322;
         overflow: hidden;
     }
    #decorselector.activated .handle.close {
        display: block;
    }

     #decorselector .handle.open img,
     #decorselector .handle.open svg {
         display: block;
         width:100%;
         height:auto;
         transform: rotate(90deg);
     }
     #decorselector .handle.close img, 
     #decorselector .handle.close svg {
         display: block;
         float:left;
         height:100%;
         width:auto;
         transform: rotate(180deg);
     }
     
    .circle-open {
        display: block;
        height:100%;
        width:200px;
        padding-bottom:100%;
        border-radius:120px;
        border: 2px solid #ffffff;
        background: #000000;
        position:relative;
        background-image: -webkit-repeating-linear-gradient(120deg, hsla(0,0%,70%,0) 0%, hsla(0,0%,90%,0)   6%, hsla(0,0%,70%, .1) 7.5%),
            -webkit-repeating-linear-gradient(-20deg, hsla(0,0%,  0%,0) 0%, hsla(0,0%,  0%,0)   4%, hsla(0,0%,  0%,.03) 4.5%),
            -webkit-repeating-linear-gradient(120deg, hsla(0,0%,60%,0) 0%, hsla(0,0%,80%,0) 1.2%, hsla(0,0%,60%,.15) 2.2%),
            linear-gradient(-80deg, hsl(0,0%,25%)  0%, 
            hsl(0,0%,36%) 47%, 
            hsl(0,0%,22%) 53%,
            hsl(0,0%,5%)100%);
    }
    
    .handle.close span,
    .handle.open span {
      position: absolute;
      bottom: 15px;
      display: block;
      width: 100%;
      left: -12px;
      text-align: center;
      color: #fff;
      font-size: 15px;
      transform: rotate(90deg) translateX(-50%);
      transform-origin: center center;
      top:50%;
    }

}

@media (min-width: 768px) {


  #renderings .item:hover {
    position: absolute;

    width: calc(100% - 30px);
    height: 100%;
    top: 0;
    left: 30px;
    overflow: hidden;
    transform-origin: left center;
    transform: perspective(400px) rotateY(0deg);
    transition: transform 0.5s ease-in-out;
  }

  #renderings .item:hover .rendering img {
    border: 1px solid rgba(255,255,255,0.8);
    transition: border 0.5s ease-in-out;
  }
  
  
  #renderings .item:hover .rendering img {
    opacity: 0.5;
  }
  #renderings .item:hover .rendering:hover img {
    opacity: 1;
    cursor: pointer;
  }


}

@media (max-width:767px) {

    .main-content.wr #decorcanvas canvas {
      position: absolute;
      left: 50%;
      transform: translateX(-50%);
    }
    
    #renderings {
      position: absolute;
      left: 0;
      bottom: 20%;
      height:auto;
      width:33%;
      z-index:2;
      background:none;
      overflow:visible;
    }

    #renderings .item {
      position: relative;
      width: 100%;
      height: 0.001px;
      padding-bottom: 50%;
      top: auto;
      left: 0;
      transform: none;
      overflow:visible;
    }

    #renderings .item.active {
      display: block;
    }

    .rendering {
      position:absolute;
      top:0;
      left:5%;
      width: 90%;
      padding: 5px;
      height: 100%;
      transform-origin: center center;
      cursor:pointer;
    }
    .rendering:nth-last-of-type(3) {
      transform: translate3d(0,-35%, -400px) perspective(400px) rotatex(40deg)scale(0.8);
      z-index:1;
    }    
    .rendering:nth-last-of-type(2) {
      transform: translate3d(0, 0%, -200px) perspective(400px) rotatex(20deg) scale(0.9);
      z-index:2;
    }
    .rendering:nth-last-of-type(1) {
      transform: translate3d(0, 35%, 0)  perspective(400px) rotatex(0deg) scale(1.05);
      z-index:3;
    }    

    #decorcanvas {
        height:100%;
        width: 100%;
    }
    #decorselector  {
        display: block;
        position: absolute;
        top: 0;
        left: 0;
        z-index: 97;
        width: 100%;
        height: calc(100% - 70px);
        z-index:2;
        transform: translateY(-100%);
    }
    #decorselector.activated  {
        transform: translateY(0%);
    }
    /*#decorselector::after  {*/
    /*    display: block;*/
    /*    content:"\64";*/
    /*    position: absolute;*/
    /*    top: 50%;*/
    /*    left: 100%;*/
    /*    width: 50px;*/
    /*    height:500px;*/
    /*    z-index: 97;*/
    /*    transform: translateY(-50%);*/
    /*    transform-origin: center center;*/
    /*    background: #ffffff;*/
    /*    color: #000000;*/
    /*    line-height:500px;*/
    /*    text-align: center;*/
    /*    background: url('../img/nav.svg') left center no-repeat;*/
    /*    background-size: contain;*/
    /*    font-family: 'icomoon';*/
    /*    font-size: 28px;*/
    /*}    */
    
    /*#decorselector::before  {*/
    /*    display: block;*/
    /*    content:"\64";*/
    /*    position: absolute;*/
    /*    top: 50%;*/
    /*    left: calc(100% - 50px);*/
    /*    width: 50px;*/
    /*    height:500px;*/
    /*    z-index: 98;*/
    /*    transform: translateY(-50%) rotate(180deg);*/
    /*    transform-origin: center center;*/
    /*    background: #ffffff;*/
    /*    color: #000000;*/
    /*    line-height: 500px;*/
    /*    text-align: center;*/
    /*    background: url('../img/nav.svg') left center no-repeat;*/
    /*    background-size: contain;*/
    /*    font-family: 'icomoon';*/
    /*    font-size: 28px;*/
    /*}  */
    
    #decorselector {
      height: 100%;
    }
    
     #decorselector .handle.open {
         position: absolute;
         left: 50%;
         transform: translate(-50%,0);
         bottom:-60px;
         width:200px;
         z-index: 322;
         overflow: hidden;
     }
     
    #decorselector.activated .handle.open {
         display: none;
    }
    #decorselector .handle.close {
         display: none;
         position: absolute;
         top: 50%;
         transform: translate(0,-50%);
         right:0px;
         height:200px;
         width:60px;
         z-index: 322;
         overflow: hidden;
    }
    #decorselector.activated .handle.close {
        display: block;
    }

     #decorselector .handle.open img,
     #decorselector .handle.open svg {
         display: block;
         width:100%;
         height:auto;
     }
     #decorselector .handle.close img, 
     #decorselector .handle.close svg {
         display: block;
         float:left;
         height:100%;
         width:auto;
         transform: rotate(180deg);
     }
       
    
    #decorcanvas video {
        position: fixed;
        width: 100%;
        top:70px;
        height: auto;
        z-index:1;
    }
    
    .circle-open {
        display: block;
        height:0.001px;
        padding-bottom:100%;
        border-radius:120px;
        border: 2px solid #ffffff;
        background: #000000;
        position:relative;
        background-image: -webkit-repeating-linear-gradient(-20deg, hsla(0,0%,70%,0) 0%, hsla(0,0%,90%,0)   6%, hsla(0,0%,70%, .1) 7.5%),
            -webkit-repeating-linear-gradient(-20deg, hsla(0,0%,  0%,0) 0%, hsla(0,0%,  0%,0)   4%, hsla(0,0%,  0%,.03) 4.5%),
            -webkit-repeating-linear-gradient(-20deg, hsla(0,0%,60%,0) 0%, hsla(0,0%,80%,0) 1.2%, hsla(0,0%,60%,.15) 2.2%),
            linear-gradient(180deg, hsl(0,0%,25%)  0%, 
            hsl(0,0%,36%) 47%, 
            hsl(0,0%,22%) 53%,
            hsl(0,0%,5%)100%);
    }
    
    .handle.open span {
      position: absolute;
      bottom: 15px;
      display: block;
      width: 100%;
      left: 0;
      text-align: center;
      color: #fff;
      font-size: 15px;
    }
    
}


.height100 { height: 100vh; }



body.layout1 .main-content { margin-top:0vw; background: #f5f5f5; padding-top: 5vw; padding-bottom: 5vw; } 
body.layout5 .main-content { margin-top:0vw; } 

/* Buttons */

.main-container a.btn {
    border-radius: 0px;
    padding: 16px 42px;
    font-size: 20px;
    line-height:23px;
    font-weight: 700;
    background-color: #829682;
    color:#ffffff;
    border: none !important;
    text-align: left;
}
.main-container a.btn:hover {
    background-color: #EB9772;
    color:#ffffff;
}

a.link-arrow-left,
a.link-arrow-left-after,
a.link-arrow-right,
a.link-arrow-right-before {
    font-weight: 400;
    color: #EB9772;
    border: none !important;
}


a.link-arrow-right::after {
    content: "\72";
    margin-left: 10px;
    display: inline-block;
    height: 28px;
    width: 28px;
    font-size: 28px;
    font-family: 'icomoon' !important;
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    font-weight: 700;
    color: inherit !important;
    line-height: 30px;
    text-align: center;
    position: relative;
    top: 7px;
}
a.link-arrow-right-before::before {
    content: "\72";
    margin-right: 10px;
    display: inline-block;
    height: 28px;
    width: 28px;
    font-size: 28px;
    font-family: 'icomoon' !important;
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    font-weight: 700;
    color: inherit !important;
    line-height: 30px;
    text-align: center;
    position: relative;
    top: 7px;
}

a.link-arrow-left::before {
    content: "l";
    margin-right: 10px;
    display: inline-block;
    height: 28px;
    width: 28px;
    font-size: 28px;
    font-family: 'icomoon' !important;
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    font-weight: 700;
    color: inherit !important;
    line-height: 30px;
    text-align: center;
    position: relative;
    top: 7px;
}
a.link-arrow-left-after::after {
    content: "l";
    margin-left: 10px;
    display: inline-block;
    height: 28px;
    width: 28px;
    font-size: 28px;
    font-family: 'icomoon' !important;
    speak: none;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    font-weight: 700;
    color: inherit !important;
    line-height: 30px;
    text-align: center;
    position: relative;
    top: 7px;
}

a.link-arrow-left:hover,
a.link-arrow-right:hover {
    color: #c47451 !important;
}

/* Background Image */

.frame-grid-container.imguse { position: relative; }
.frame-grid-container.imguse > .container,
.frame-grid-container.imguse > .container-fluid { position: relative; z-index: 1; }


.frame-grid-container {
    padding: 0.01px 0;
}

.frame-grid-container.imguse-1,
.frame-grid-container.imguse-2,
.frame-grid-container.imguse-3,
.frame-grid-container.imguse-4,
.frame-grid-container.imguse-5,
.frame-grid-container.imguse-6,
.frame-grid-container.imguse-7 {
    position:relative;
}
.frame-grid-container .bgimage {
    position:absolute;
    top:0;
    left:0;
    bottom:0;
    width:100%;
    z-index: 0;
}
.frame-grid-container .bgimage img {
    width: 100%;
    height: 100%;
}
.frame-grid-container.imguse-1 .bgimage img { -o-object-fit: cover; object-fit: cover; -o-object-position: center center; object-position: center center; }
.frame-grid-container.imguse-2 .bgimage img { -o-object-fit: contain; object-fit: contain; -o-object-position: right top; object-position: right top; }
.frame-grid-container.imguse-3 .bgimage img { -o-object-fit: contain; object-fit: contain; -o-object-position: right center; object-position: right center; }
.frame-grid-container.imguse-4 .bgimage img { -o-object-fit: contain; object-fit: contain; -o-object-position: right bottom; object-position: right bottom; }
.frame-grid-container.imguse-5 .bgimage img { -o-object-fit: contain; object-fit: contain; -o-object-position: left top; object-position: left top; }
.frame-grid-container.imguse-6 .bgimage img { -o-object-fit: contain; object-fit: contain; -o-object-position: left center; object-position: left center; }
.frame-grid-container.imguse-7 .bgimage img { -o-object-fit: contain; object-fit: contain; -o-object-position: left bottom; object-position: left bottom; }



.nopadding { padding:0; }

.frame-grid-container.imguse { position: relative; }
.frame-grid-container.imguse > .container,
.frame-grid-container.imguse > .container-fluid { position: relative; z-index: 1; }

.frame-grid-container.imguse > .bgimage { 
	position: absolute;
	top:0;
	left:0; 
	width:100%;
	height:100%;
	z-index: 0;
}

.frame-grid-container.imguse.imguse-0 > .bgimage * {
	width:100%;
	height:100%;
	object-fit: contain;
	object-position: 50% 50%;
}

.frame-grid-container.imguse.imguse-1 > .bgimage * {
	width:100%;
	height:100%;
	object-fit: cover;
	object-position: 50% 50%;
}

.frame-grid-container.imguse.imguse-2 > .bgimage * {
	width:100%;
	height:100%;
	object-fit: scale-down;
	object-position: 100% 0;
}
.frame-grid-container.imguse.imguse-3 > .bgimage * {
	width:100%;
	height:100%;
	object-fit: scale-down;
	object-position: 100% 50%;
}
.frame-grid-container.imguse.imguse-4> .bgimage * {
	width:100%;
	height:100%;
	object-fit: scale-down;
	object-position: 100% 100%;
}

.frame-grid-container.imguse.imguse-5 > .bgimage * {
	width:100%;
	height:100%;
	object-fit: scale-down;
	object-position: 0 0;
}
.frame-grid-container.imguse.imguse-6 > .bgimage * {
	width:100%;
	height:100%;
	object-fit: scale-down;
	object-position: 0 50%;
}
.frame-grid-container.imguse.imguse-7> .bgimage * {
	width:100%;
	height:100%;
	object-fit: scale-down;
	object-position: 0 100%;
}

/* Content: Divider */
hr.ce-div {
    border:none;
    height:1px;
    background-color: #F5F5F5;
}


/* Content: image */
.ce-image { margin-bottom: 1.5rem; }
.ce-image img { max-width: 100%; height: auto !important; margin:0; }

body.IE .ce-image img {
    width: 100% !important;
    height: auto !important;
    margin: 0;
}


.ce-align-left {
    text-align: left;
}

.ce-align-center {
    text-align: center;
}

.ce-align-right {
    text-align: right;
}

.ce-table td,
.ce-table th {
    vertical-align: top;
}

.ce-textpic,
.ce-image,
.ce-nowrap .ce-bodytext,
.ce-gallery,
.ce-row,
.ce-uploads li,
.ce-uploads div {
    overflow: hidden;
}

.ce-left .ce-gallery,
.ce-column {
    float: left;
}

.ce-center .ce-outer {
    position: relative;
    float: right;
    right: 50%;
}

.ce-center .ce-inner {
    position: relative;
    float: right;
    right: -50%;
}

.ce-right .ce-gallery {
    float: right;
}

.ce-gallery figure {
    display: table;
    margin: 0;
}

.ce-gallery figcaption {
    display: table-caption;
    caption-side: bottom;
}

.ce-gallery img {
    display: block;
}

.ce-gallery iframe {
    border-width: 0;
}

.ce-border img,
.ce-border iframe {
    border: 2px solid #999;
    padding: 0px;
}

.ce-intext.ce-right .ce-gallery,
.ce-intext.ce-left .ce-gallery,
.ce-above .ce-gallery {
    margin-bottom: 10px;
}

.ce-intext.ce-right .ce-gallery {
    margin-left: 10px;
}

.ce-intext.ce-left .ce-gallery {
    margin-right: 10px;
}

.ce-below .ce-gallery {
    margin-top: 10px;
}

.ce-column {
    margin-right: 10px;
}

.ce-column:last-child {
    margin-right: 0;
}

.ce-row {
    margin-bottom: 10px;
}

.ce-row:last-child {
    margin-bottom: 0;
}

.ce-above .ce-bodytext {
    clear: both;
}

.ce-intext.ce-left ol,
.ce-intext.ce-left ul {
    padding-left: 40px;
    overflow: auto;
}

/*Headerimage*/
.frame-layout-201 > .ce-image,
.frame-layout-201 > .ce-image * { margin-bottom:0 !important; }
.frame-layout-201 > .ce-image img { width:100% !important; max-width: none; height: auto; margin:0; }
.frame-layout-201 > .ce-image .ce-outer,
.frame-layout-201 > .ce-image .ce-inner, 
.frame-layout-201 > .ce-image .ce-row, 
.frame-layout-201 > .ce-image .ce-column, 
.frame-layout-201 > .ce-image .ce-gallery { width:100%; float: none; right: auto; left: auto; }
.frame-layout-201 > .ce-image .ce-gallery figure  { display: block; }


/*content: video */
.responsive-max { width:100.2%; left:-0.1%; position: relative; }
.responsive-video { width:100%; padding-top: 0 0.01px; height:0.01px; padding-bottom: 42.81%; position:relative; z-index:9; }
.responsive-video iframe, .responsive-video object, .responsive-video embed { width:100%; height:100%; position:absolute; top:0; left:0; }
.responsive-video.a16-9 { padding-bottom:56.25%; outline: 1px solid rgba(255,255,255,0.25); box-shadow: 0 0 6vw 4px rgba(255,0,0,0.75); }
.responsive-video video { width:100%; height:100%; position:absolute; top:0; left:0; }

/*Buttons*/
.btn {
    border-radius:0;
}


/*Logo*/


.logo-wrapper {
    position: absolute;
    display: block;
    top:0;
    left:0;
    z-index:199;
    margin: 0;
}


body .sticky-header { 
    display: block !important;
    color: #ffffff;
    position: fixed;
    top: 0;
    left: 0;
    height: 70px;
    z-index: 98;
    width: 100%;
    padding: 0;
    background: #161616;
    -webkit-transition: 0.5s -webkit-transform ease-in-out;
    transition: 0.5s -webkit-transform ease-in-out;
    -o-transition: 0.5s transform ease-in-out;
    transition: 0.5s transform ease-in-out;
    transition: 0.5s transform ease-in-out, 0.5s -webkit-transform ease-in-out;
    border-bottom: 1px solid rgba(255,255,255,0.75);
    touch-action:none;
}

body .sticky-header:after {
    content:"";
    height:8px;
    width:100%;
    left:0;
    bottom:-8px;
    z-index:97;
    background: none;
    background: -webkit-gradient(linear,left top, left bottom,from(rgba(0,0,0,0.4)),to(rgba(0,0,0,0)));
    background: -o-linear-gradient(top,rgba(0,0,0,0.4) 0%,rgba(0,0,0,0) 100%);
    background: linear-gradient(180deg,rgba(0,0,0,0.4) 0%,rgba(0,0,0,0) 100%);
    position:absolute;
}
  

.sticky-header .logo-standard {
  margin-left: 4vw;
  height: 52px;
  margin-top: 8px;
  display: inline-block;
  position: relative;
}
.sticky-header .logo-standard img {
  width: auto;
  height: 100%;
}
    

.nav-opened header {
    width: auto;
    -webkit-transition: 100ms width ease-in-out;
    -o-transition: 100ms width ease-in-out;
    transition: 100ms width ease-in-out;
    -webkit-transition-delay: 650ms;
         -o-transition-delay: 650ms;
            transition-delay: 650ms; 
}

.nav-opened .toplevel > .container-header { 
    background-color: transparent;
    -webkit-transition: 100ms background-color ease-in-out;
    -o-transition: 100ms background-color ease-in-out;
    transition: 100ms background-color ease-in-out;
    /*transition-delay: 650ms;*/
}
.nav-opened .layout5 .logo-wrapper a:nth-child(2) { 
    visibility: visible;
    -webkit-transition: visibility 0s, opacity 500ms ease-in-out;
    -o-transition: visibility 0s, opacity 500ms ease-in-out;
    transition: visibility 0s, opacity 500ms ease-in-out;
    opacity: 1;
    -webkit-transition-delay: 500ms;
         -o-transition-delay: 500ms;
            transition-delay: 500ms;
}


.nav-wrapper {
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    -webkit-transform: translateX(100%);
        -ms-transform: translateX(100%);
            transform: translateX(100%);
    background: -o-linear-gradient(left, rgb(206, 221, 223) 0%, rgb(239, 228, 211) 100%);
    background: -webkit-gradient(linear, left top, right top, from(rgb(206, 221, 223)), to(rgb(239, 228, 211)));
    background: linear-gradient(90deg, rgb(206, 221, 223) 0%, rgb(239, 228, 211) 100%);
    z-index: 98;
    -webkit-box-sizing: content-box;
            box-sizing: content-box;
    -webkit-transition: 200ms -webkit-transform ease-in-out;
    transition: 200ms -webkit-transform ease-in-out;
    -o-transition: 200ms transform ease-in-out;
    transition: 200ms transform ease-in-out;
    transition: 200ms transform ease-in-out, 200ms -webkit-transform ease-in-out;
    -webkit-transition-delay: 300ms;
         -o-transition-delay: 300ms;
            transition-delay: 300ms;
}

.nav-sidebar { display: none; }

.nav-overlay {
    width: 100%;
    top: 100px;
    bottom:0;
    left:0;
    position:absolute;
}
.nav-header {
    margin:0 110px;
    height:100px;
    position:relative;
}
.nav-header > div {
   display: block;
   position:relative;
}


html.nav-opened .nav-wrapper {
  -webkit-transform: translateX(0);
      -ms-transform: translateX(0);
          transform: translateX(0);
  -webkit-transition: 500ms -webkit-transform ease-in-out;
  transition: 500ms -webkit-transform ease-in-out;
  -o-transition: 500ms transform ease-in-out;
  transition: 500ms transform ease-in-out;
  transition: 500ms transform ease-in-out, 500ms -webkit-transform ease-in-out;
}

html.nav-opened .nav-wrapper::before {
    opacity: 1;
    -webkit-transition: 500ms opacity ease-in-out;
    -o-transition: 500ms opacity ease-in-out;
    transition: 500ms opacity ease-in-out;
}

#nav-main {
    position: absolute;
    top: 0;
    bottom: 0;
    margin: 0;
    right: 0;
    left: 0;
}

#nav-main > ul {
    display: -ms-grid;
    display: grid;
    -ms-grid-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
    grid-template-columns: 1fr 1fr 1fr 1fr 1fr 1fr;
    height: 100%;
    position: relative;
    padding-top: 10vh;
}
#nav-main > ul > li {
    grid-column: auto;
    z-index:2;
    margin:0;
}

#nav-main > ul > li > span {
    position: absolute;
    display: block;
    background-size:cover;
    background-position: center center;
    top: 12vh;
    -webkit-transition: opacity 300ms ease-in-out;
    -o-transition: opacity 300ms ease-in-out;
    transition: opacity 300ms ease-in-out;
    -webkit-transition-delay: 300ms;
         -o-transition-delay: 300ms;
            transition-delay: 300ms;
    visibility: visible;
    opacity: 0;
    width: 100%;
    top: 0;
    margin-top: 22vh;
    left:0;
    bottom:0;
    z-index:2;  
}

#nav-main > ul > li:hover {
    z-index:3;
}

#nav-main > ul > li:hover > span {
    opacity: 1;  
    -webkit-transition: opacity 300ms ease-in-out;  
    -o-transition: opacity 300ms ease-in-out;  
    transition: opacity 300ms ease-in-out;     
}

#nav-main > ul > li > a {
    color: #ffffff;
    display: block;
    margin-right: 25%;
    height:12vh;
    padding: 0 0.5vw 0 2.5vw;    
}
#nav-main > ul > li.current > a, 
#nav-main > ul > li.active > a, 
#nav-main > ul:hover > li:hover > a {
    color: #ffffff;
}
#nav-main > ul > li a > i {
    font-style:normal;
    font-size: 16px;
    line-height:16px;
    display: block;
    margin-bottom: 14px;
    color: #2F1812 !important;
}
#nav-main > ul > li a > span {
    font-style:normal;
    font-weight: bold;
    font-size: calc(22px + 10 * ((100vw - 1200px) / 720));
    line-height: calc(22px + 10 * ((100vw - 1200px) / 720));
    display: block;
}

#nav-main > ul > li > div > ul {
    display: block; 
    margin: 0;
    padding: 1vw 0.5vw 0 2.5vw; 
    position:relative;
    z-index:1;
    width: 100%;
}
#nav-main > ul > li:hover  > div > ul {
    z-index: 3;
}

#nav-main > ul > li:hover > div::before {
    content: "";
    position: absolute;
    display: block;
    top: 0;
    bottom: 0;
    left: left;
    width:600%;
    background: -o-linear-gradient(left, rgba(206,221,223,1) 0%, rgba(239,228,211,1) 100%);
    background: -webkit-gradient(linear, left top, right top, from(rgba(206,221,223,1)), to(rgba(239,228,211,1)));
    background: linear-gradient(90deg, rgba(206,221,223,1) 0%, rgba(239,228,211,1) 100%);
    z-index: 2;
}
nav#nav-main > ul > li:nth-child(1) div::before { left:0; }
nav#nav-main > ul > li:nth-child(2) div::before { left:-100%; }
nav#nav-main > ul > li:nth-child(3) div::before { left:-200%; }
nav#nav-main > ul > li:nth-child(4) div::before { left:-300%; }
nav#nav-main > ul > li:nth-child(5) div::before { left:-400%; }
nav#nav-main > ul > li:nth-child(6) div::before { left:-500%; }

#nav-main > ul > li > div > ul  > li {
    display: block; 
    font-size: calc(17px + 3 * ((100vw - 1200px) / 720));
    line-height: calc(20px + 4 * ((100vw - 1200px) / 720));
    margin: 0;  
    list-style:none;
    padding:0;
}
#nav-main > ul > li > div > ul > li > a {
    color: #2F1812;  
    padding: 0.75vw 0 0.75vw 0;
    display: block;
}
#nav-main > ul > li > div > ul > li.current > a,
#nav-main > ul > li > div > ul > li.active > a,
#nav-main > ul > li > div > ul > li:hover > a {
    color: #B78338;  
}



/*small-navbar*/

.small-navbar .toplevel .burgericon { line-height: 70px; }
.small-navbar .toplevel .burgericon { height: 70px;   }
.small-navbar .toplevel .menu-entry { margin: 29px 10px 0 0; }

.small-navbar .toplevel > .container-header { height: 70px; background-color:#829682; -webkit-transition: none; -o-transition: none; transition: none; }

.small-navbar .logo-wrapper {
    margin: 5px 0 5px 60px;
}
.small-navbar .logo-wrapper a.logo-small {
    display: block;
} 
.small-navbar .logo-wrapper a.logo-small svg {
    height:60px;
    width:auto;
} 
.small-navbar .logo-wrapper a.logo-standard {
    display: none;
} 

html.small-navbar .page-header::after {
    display: block;
    position: absolute;
    content: "";
    bottom: -2px;
    height: 3px;
    left: 0;
    right: 0;
    z-index: -1;
    background: rgb(0,0,0);
    border-top: 1px solid rgba(0,0,0,0.25);
    background: rgb(47,24,18);
    background: -o-linear-gradient(bottom, rgba(0,0,0,0) 0%, rgba(0,0,0,0.1) 100%);
    background: -webkit-gradient(linear, left bottom, left top, from(rgba(0,0,0,0)), to(rgba(0,0,0,0.1)));
    background: linear-gradient(to top, rgba(0,0,0,0) 0%, rgba(0,0,0,0.1) 100%); 
}

@media (max-width:767px) {


    .toplevel .burgericon { line-height: 70px; }
    .toplevel .burgericon { height: 70px;   }
    .toplevel .menu-entry { margin: 29px 10px 0 0; }
    
    .toplevel > .container-header { height: 70px; background-color:#829682; -webkit-transition: none; -o-transition: none; transition: none; }
    
    .logo-wrapper {
        margin: 5px 0 5px 40px !important;
    }
    .logo-wrapper a.logo-small {
        display: block;
    } 
    .logo-wrapper a.logo-small svg {
        height:60px;
        width:auto;
    } 
    .logo-wrapper a.logo-standard {
        display: none;
    } 
    
    .page-header::after {
        display: block;
        position: absolute;
        content: "";
        bottom: -2px;
        height: 3px;
        left: 0;
        right: 0;
        z-index: -1;
        background: rgb(0,0,0);
        border-top: 1px solid rgba(0,0,0,0.25);
        background: rgb(47,24,18);
        background: -o-linear-gradient(bottom, rgba(0,0,0,0) 0%, rgba(0,0,0,0.1) 100%);
        background: -webkit-gradient(linear, left bottom, left top, from(rgba(0,0,0,0)), to(rgba(0,0,0,0.1)));
        background: linear-gradient(to top, rgba(0,0,0,0) 0%, rgba(0,0,0,0.1) 100%); 
    }
    


}

@media (min-width:1200px) {
    body.layout5 .burgericon {
        display: none !important;
    }
    
    body.layout5.sticky-header .sticky-header > ul.nav.languagemenu {
        right: calc(4vw);
    }
}

/* Hero-Image */

#hero-image {
    width: 100%; 
    height: auto;
    background: #000; 
    position:relative; 
    display: -webkit-box; 
    display: -ms-flexbox; 
    display: flex;
    -webkit-box-pack: center;
        -ms-flex-pack: center;
            justify-content: center;
    -webkit-box-align: center;
        -ms-flex-align: center;
            align-items: center; 
}

#hero-image img,
#hero-image picture,
#hero-image picture * { 
    display: block;
    width:100%;
    height:auto;
    position:relative;
}

#hero-image .img-cover {
    display: block;
    width:100%;
}

#hero-image .img-cover:after {
    content:""; 
    top:0;
    left:0;
    width:100%;
    height:100%;
    position:absolute;
}

#hero-image .overlay { 
  display: none;
}


@media (max-width: 767px ) {

    #hero-image img,
    #hero-image picture,
    #hero-image picture * { 
        height:auto;
    }
}

/* scrollup */

.scrollup {
    position: fixed;
    right: 1.5vw;
    bottom: 1.5vw;
    text-align: center;
    line-height: 66px;
    font-size: 44px;
    width: 60px;
    height: 60px;
    color: #ffffff !important;
    background-color: #829682;
    display: none;
    z-index:50;
}
.scrollup * {
    color: #ffffff !important;
}

.scrollup:hover {
    color: #ffffff !important;
    background-color: #EB9772;
}

@media (max-width:767px) {
    .scrollup {
        display: none !important;
    }
}


footer {
    
}

footer.mobile-docked { 
    position:fixed;
    bottom:0;
    left:0;
    width:100%;
    height:0px;
}
footer .footer-body {
    background-color: #ffffff;
    padding: 4vw 0 4vw;
}

footer .footer-body h4,
footer .footer-body h5,
footer .footer-body h6 {
    color: #000000;
    font-weight: 700;
    margin-bottom: 1.75rem;
    font-size: 22px;
    line-height: 26px;
}

footer .footer-body,
footer .footer-body p {
    color: #000000;
    font-size: 17px;
    line-height: 26px;
}


footer .footer-body a {
    color: inherit;
}

footer .footer-body a:hover {
    color: #0E71B8;
}

footer .footer-bottom {
    background-color: #1d1d1d;
    color: #ffffff;
    padding: 10px 0;
}

footer .footer-bottom,
footer .footer-bottom p {
    color: #ffffff;
    font-size: 15px;
    line-height: 19px;
}

footer .footer-bottom a {
    color: #ffffff;
}

footer .footer-bottom a:hover {
    color: #ffffff
}

footer .socialmedia {
    font-size: 18px;
    line-height: 18px;
    margin: 0.5rem 0 1.5rem;
}
footer .socialmedia a {
    margin-right: 1rem;
}

footer .copyright span {
    color: #ffffff;
}



/*
footer .logo {
    display: inline-block;
    position:relative;
    top: 1.5rem;
    max-width:80%;
    height:auto;
}
*/

footer .logo * {
    position:relative;
    fill: #819682 !important;
}

.footer-nav nav {
    display: inline-block;
    position: relative;
}

.footer-nav nav ul {
    padding: 0;
    margin: 0;
    font-size: 15px;
    line-height: 19px;
}

.footer-nav nav li {
    display: inline-block;
    margin-right: 0.75rem;
    font-size: 15px;
    line-height: 19px;    
}

.footer-nav nav li a {
    color: inherit;
}

.footer-nav nav li a:hover {
    color: #EB9772;
}
@media (max-width:767px) {

    footer {margin-top: 30px;}

    footer .footer-body h4,
    footer .footer-body h5,
    footer .footer-body h6 {
        margin-bottom: 12px;
        line-height:21px;
    }

    footer .footer-body p {
        margin: 0 0 12px 0;
        font-size: 16px;
        line-height: 18px;
    }

}


@media (min-width:768px) {
    .footer-nav {
        text-align: right;
    }

    .footer-nav nav li {
        margin-left: 2rem;
        margin-right: 0;
    }

}

@media (max-width: 991px) {

    footer { margin-top:30px; }
    footer .footer-body .row > div {
        margin-bottom: 5vw;
    }
}


/*Navigation*/

nav.main-nav ul {
    display: block;
    margin: 0;
    padding: 0;
    position: relative;
    width: auto;
    float: right;
}

nav.main-nav > ul > li {
    display: block;
    float: left;
    position: relative;
    margin: 0;
    z-index: 999;
    color: #525E76;
    margin-right: calc(30px + 30 * ((100vw - 900px) / 1020));
}

nav.main-nav > ul > li.dropdown {
    margin-right: calc(30px + 30 * ((100vw - 900px) / 1020));
}

nav.main-nav > ul > li.dropdown.last {
    margin: 0 1.25rem 0 0;
}

nav.main-nav > ul > li > a {
    color: inherit;
    font-family: 'Ubuntu', sans-serif;
    font-size: 18px;
    font-weight: 400;
    line-height: 74px;
    -o-border-image: none;
       border-image: none;
    background: transparent;
    display: block;
    height: 62px;
    margin-bottom: 12px;
}

nav.main-nav > ul > li.last {
    margin-right: 0;
    float: left;
}


nav.main-nav ul.nav > li:hover a,
nav.main-nav ul.nav > li:focus a,
nav.main-nav ul.nav > li.current a {
    color: #F95151;
    text-decoration: none;
    background: none;
    border-bottom: 3px solid #F95151;
}

nav.main-nav ul li.item.dropdown:hover > a,
nav.main-nav ul li.item.dropdown:hover > a:hover,
nav.main-nav ul li.item.dropdown.active > a,
nav.main-nav ul li.item.dropdown.current > a {
    background: none;
    z-index: 299;
    color: #F95151;
}

nav.main-nav i {
    font-size: 22px;
    top: 3px;
    position: relative;
}

/* 2te Ebene */

nav.main-nav > ul.nav > li > ul.dropdown-menu {
    width: 450px;
    padding: 0;
    background: none;
}

nav.main-nav > ul.nav > li > ul.dropdown-menu span {
    display: inline-block;
    width: 65%;
    padding: 2rem 1.5rem;
    margin-left: 35%;
    border-radius: 0 0 5px 0;
    background-color: #ffffff;
    -webkit-box-shadow: 0px 0px 4px 1px rgba(0, 0, 0, 0.25);
            box-shadow: 0px 0px 4px 1px rgba(0, 0, 0, 0.25);
}

nav.main-nav > ul.nav > li > ul.dropdown-menu span:first-child {
    width: 35%;
    background-color: #525E76;
    position: absolute;
    top: 0;
    bottom: 0;
    margin: 0;
    color: #ffffff;
    font-weight: 700;
    border-radius: 0 0 0 5px;
    -webkit-box-shadow: 0px 0px 4px 1px rgba(0, 0, 0, 0.25);
            box-shadow: 0px 0px 4px 1px rgba(0, 0, 0, 0.25);
}

nav.main-nav > ul.nav > li > ul {
    -moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    background: #ffffff none repeat scroll 0 0;
    border: none;
    border-radius: 0;
    display: none;
    left: -1.5rem;
    padding: 0;
    position: absolute;
    top: 100%;
    width: 320px;
    margin-top: -1px;
    padding: 1rem 1.5rem;
    z-index: 199;
    font-size: 1rem;
}

nav.main-nav ul.nav li:hover > ul {
    display: block;
}

nav.main-nav > ul.nav > li > ul.dropdown-menu li {
    position: relative;
}

nav.main-nav > ul.nav > li > ul.dropdown-menu li a {
    color: #525E76;
    border-bottom: none;
}

nav.main-nav > ul.nav > li > ul.dropdown-menu li:hover a,
nav.main-nav > ul.nav > li > ul.dropdown-menu li:focus a,
nav.main-nav > ul.nav > li > ul.dropdown-menu li.current a,
nav.main-nav > ul.nav > li > ul.dropdown-menu li.active a,
nav.main-nav > ul.nav > li > ul.dropdown-menu li a:hover {
    display: block;
    position: relative;
    color: #F95151;
    border-bottom: none;
}

/* 3te Ebene */

nav.main-nav ul ul ul.submenu {
    display: none;
    margin: 0;
    padding: 2rem 1.5rem 2.1rem;
    position: absolute;
    width: 150px;
    right: -100px;
    float: right;
    top: 0px;
    background-color: #fff;
    border-radius: 0 5px 5px 0;
    z-index: 5;
}

nav.main-nav ul ul li:hover ul {
    display: block;
}

nav.main-nav ul li > ul li.sub > ul li {
    list-style: none;
}

nav.main-nav > ul.nav > li > ul.dropdown-menu li > ul.submenu li a {
    color: #525E76;
    border-bottom: none;
}

nav.main-nav > ul.nav > li > ul.dropdown-menu li > ul.submenu li:hover a,
nav.main-nav > ul.nav > li > ul.dropdown-menu li > ul.submenu li:focus a,
nav.main-nav > ul.nav > li > ul.dropdown-menu li > ul.submenu li.current a,
nav.main-nav > ul.nav > li > ul.dropdown-menu li > ul.submenu li.active a,
nav.main-nav > ul.nav > li > ul.dropdown-menu li > ul.submenu li a:hover {
    color: #F95151;
}

/* Mobile Menu */

@media (max-width: 991px) {

    .burgericon .icon-bars {
        color: #303F39;
    }

}

/* fullwidth-margins */

@media (min-width: 1200px) {
   
    .container-fluid.fullwidth-margin {
        margin-right: calc(15px + 108 * ((100vw - 1200px) / 240));
        margin-left: calc(15px + 108px);
        width: auto;
    }

    .container-fluid.fullwidth-margin-left {
        margin-left: calc(15px + 108px);
        width: auto;
    }


    .container-fluid.fullwidth-margin-right {
        margin-right: calc(15px + 108 * ((100vw - 1200px) / 240));
        width: auto;
    }
    
}

@media (min-width: 1440px) {
   
    .container-fluid.fullwidth-margin {
        margin-right: calc(5vw + 140 * ((100vw - 1200px) / 720));
        margin-left: calc(5vw + 140 * ((100vw - 1200px) / 720));
        width: auto;
    }

    .container-fluid.fullwidth-margin-left {
        margin-left: calc(5vw + 140 * ((100vw - 1200px) / 720));
        width: auto;
    }


    .container-fluid.fullwidth-margin-right {
        margin-right: calc(5vw + 140 * ((100vw - 1200px) / 720));
        width: auto;
    }
    
}

@media (min-width: 1920px) {
    nav.main-nav > ul > li {
        margin-right: 60px;
    }
}



/* Collapsible */
.collapsible {
    background-color: none;
    padding: 2rem;
    margin-bottom: 3rem;
    margin-top: 70px;
    border: 8px solid #126F80;
    border-radius: 5px;
}

.frame-layout-0 > .collapsible {
    color: inherit;
}

.collapsible .controls-top {
    display: none;
}

.collapsible .controls-bottom {
    height: 0.01px;
    position: relative;
    display: block;
    text-align: center;
}

.collapsible .controls-bottom .btn {
    border: 2px solid #F95151;
    border-radius: 5px;
    padding: 5px 55px 5px 25px;
    font-size: 20px;
    font-weight: 700;
    background-color: #ffffff;
    color: inherit;
}

.collapsible .controls-bottom .btn:hover {
    color: #F95151;
}

.collapsible .controls-bottom .btn-less {
    display: inline-block;
    position: relative;
}


.collapsible .controls-bottom .btn-more {
    display: none;
    position: relative;
}

.collapsible .controls-bottom .btn-less.collapsed {
    display: none;
}

.collapsible .controls-bottom .btn::after {
    content: "";
    font-family: 'ElegantIcons';
    font-weight: normal;
    display: block;
    position: absolute;
    border: 1px transparent;
    width: 40px;
    height: 40px;
    font-size: 29px;
    line-height: 40px;
    top: 0;
    right: 10px;
    color: #F95151;
    border-radius: 55px;
    text-indent: -1px;
}

.collapsible .controls-bottom .btn.btn-less::after {
    content: "\32";
}

.collapsible .controls-bottom .btn.btn-more::after {
    content: "\33";
}

.collapsible .controls-bottom .btn-more.collapsed {
    display: inline-block;
}

.btn.btn-toggle.icon-arrow-down::after {
    content: "\21";
    font-family: 'ElegantIcons';
    font-weight: normal;
    display: block;
    position: absolute;
    border: 1px transparent;
    width: 55px;
    height: 55px;
    font-size: 29px;
    line-height: 55px;
    top: 0;
    left: 0;
    color: #AEC336;
    border-radius: 55px;
    text-indent: -1px;
}

.btn.btn-toggle.icon-arrow-down.collapsed::after {
    content: "\22";
}

.frame-layout-0 > .collapsible h1,
.frame-layout-0 > .collapsible h2,
.frame-layout-0 > .collapsible h3,
.frame-layout-0 > .collapsible h4,
.frame-layout-0 > .collapsible h5,
.frame-layout-0 > .collapsible h6,
.frame-layout-0 > .collapsible p {
    color: inherit;
}

@media (min-width: 1200px) {
    .collapsible {
        padding: 52px 32px;
        margin-bottom: 48px;
    }
}


/*teaser*/

a.teaser-link {
    color: inherit;
}


/*iconteaser*/

.iconteaser {
    margin-bottom: 3rem;
    border: none;
}

.iconteaser .teaser-icon > img {
    height: auto;
    max-height: 60px;
    width: 100%;
    display: inline-block;
    margin-bottom: 1rem;
}

.iconteaser .teaser-body p:last-child {
    margin-bottom: 0;
}

@media (min-width: 1200px) {
    .iconteaser {
        margin-bottom: 48px;
    }

    .iconteaser .teaser-icon > img {
        margin-bottom: 16px;
    }
}


/*contactteaser*/

.contactteaser {
    position: relative;
    background: #ffffff;
}

.contactteaser .teaser-image {
    position: relative;
    bottom: -8vw;
    left: 17vw;
    width: 23vw;
}

.contactteaser .teaser-image > img {
    width: 100%;
    height: auto;
    display: block;
    margin-bottom: 0;
}

.contactteaser .teaser-body {
    padding: 6vw 0;
}

.contactteaser .teaser-body *:last-child {
    margin-bottom: 0;
}

.contactteaser .teaser-contact h1,
.contactteaser .teaser-contact h2,
.contactteaser .teaser-contact h3,
.contactteaser .teaser-contact h4,
.contactteaser .teaser-contact h5,
.contactteaser .teaser-contact h6,
.contactteaser .teaser-contact p {
    color: #ffffff;
    margin-bottom: 0;
}

.contactteaser .bg-blue {
    background-color: #1F3D57;
    height: 8vw;
}

@media (max-width: 766px) {
    .contactteaser .bg-blue {
        height: auto;
        padding: 1rem 0;
    }
}

@media (min-width: 767px) {
    .contactteaser .teaser-contact {
        position: relative;
        left: -12vw;
    }
}

@media (min-width: 1200px) {
    .contactteaser .teaser-body {
        padding: 96px 0;
    }

    .contactteaser .teaser-image {
        bottom: -128px;
    }

    .contactteaser .bg-blue {
        height: 128px;
    }
}

/* Headerimage */

.headerimage {
    position: relative;
}

.headerimage img {
    width: 100%;
    height: auto;
}

.headerimage .overlay-text > span {
    display: block;
    margin: 1rem 0;
}


body.blue .headerimage .overlay-text {
    background-color: #1F3D57;
}

body.green .headerimage .overlay-text {
    background-color: #AEC336;
}

body.yellow .headerimage .overlay-text {
    background-color: #FDC648;
}

.overlay-text h1 {
    color: #ffffff;
    font-weight: 700;
    text-transform: uppercase;
    font-style: italic;
    margin-left: 0.5rem;
}

.overlay-text h2,
.overlay-text h3 {
    color: #ffffff;
}

.overlay-text p {
    color: #ffffff;
    font-size: calc(20px + 8 * ((100vw - 320px) / 255));
    line-height: calc(20px + 8 * ((100vw - 320px) / 255));
    font-weight: 700;
    text-transform: uppercase;
    font-style: italic;
    margin-left: 0.5rem;
    margin-bottom: 0;
    margin-top: 2vw;
    margin-bottom: 2vw;
}

/*
.headerimage h1,
.headerimage h2,
.headerimage h3,
.headerimage h4,
.headerimage h5,
.headerimage h6,
.headerimage p { color: #ffffff; }
*/

@media (min-width:768px) {
    .headerimage .overlay {
        position: absolute;
        left: 0;
        top: 50%;
        width: 100%;
        z-index: 2;
        -webkit-transform: translate(0, -50%);
            -ms-transform: translate(0, -50%);
                transform: translate(0, -50%);
    }

    .headerimage .overlay-text > span {
        display: table-cell;
        vertical-align: middle;
        height: 14vw;
        margin: 0;
    }

}

@media (max-width: 767px) {
    .headerimage .container {
        max-width: none;
    }

    .headerimage .overlay {
        background-color: #126F80;
    }
}

@media (min-width: 576px) {

    .overlay-text h1 {
        font-size: 38px;
        line-height: 38px;
    }

    .overlay-text p {
        font-size: 25px;
        line-height: 25px;
    }
}

@media (min-width: 768px) {
    .overlay-text h1 {
        font-size: 44px;
        line-height: 44px;
    }

    .overlay-text p {
        font-size: 25px;
        line-height: 25px;
    }
}

@media (min-width: 992px) {
    .overlay-text h1 {
        font-size: 50px;
        line-height: 50px;
    }

    .overlay-text p {
        font-size: 28px;
        line-height: 28px;
    }
}

@media (min-width: 1200px) {
    .overlay-text h1 {
        font-size: 52px;
        line-height: 52px;
    }

    .overlay-text p {
        font-size: 32px;
        line-height: 32px;
    }

    .headerimage .overlay-text > span {
        margin: 16px 0;
    }

    .overlay-text p {
        margin-left: 8px;
    }


}

/* tabs */
.tabbable .nav.nav-tabs {
    border: none; 
    margin-bottom: 2vw;
}
/*
.tabbable .nav.nav-tabs > .prev,
.tabbable .nav.nav-tabs > .next {
    display: block;
    width:56px;
    height:56px;
    border: 2px solid #2F1812;
    margin-right: 1.5vw;
    text-align: center;
    border-radius: 30px;
    cursor: pointer;
} 
.tabbable .nav.nav-tabs > .next {
    margin-right: 0;
    margin-left: 1.5vw;
} 

.tabbable .nav.nav-tabs > .prev:hover,
.tabbable .nav.nav-tabs > .next:hover {
    border-color: #B78338;
    color: #B78338;
}


.tabbable .nav.nav-tabs > .prev i,
.tabbable .nav.nav-tabs > .next i {
    display: inline-block;
    line-height:54px;
    color:inherit;
    font-size:30px;
    text-indent: -2px;
} 
.tabbable .nav.nav-tabs > .next i {
    text-indent: 2px;
} 
*/
.tabbable .nav.nav-tabs > a {
    margin-right: 0.75vw;
    margin-left: 1vw;
    line-height:32px;
    font-size: 22px;
    font-weight: 600;
    color: #9A9EA0;
    position:relative;
    background:none;
    outline:none !important;
    border: none !important;
    padding:0;
} 
.tabbable .nav.nav-tabs > a:first-child { margin-left: 0; }

.tabbable .nav.nav-tabs > a.active {
    color: #EB9772;
} 
.tabbable .nav.nav-tabs > a.active::after {
    content:"";
    display: block;
    position:absolute;
    background-color: #EB9772;
    height:3px;
    bottom:-5px;
    left: 0;
    right: 0;
}

.tabbable .tab-content {
    padding: 1vw;
    background-color: #F5F5F5;
}
.tabbable.bgwhite .tab-content {
    background-color: #ffffff;
    padding:0;
}
.fsc-layout-201 .tabbable .tab-content { background: none; padding: 1vw 0 0;}

@media (max-width: 767px) {

    .tabbable .nav.nav-tabs > a {
        margin-bottom: 2vw;
        margin-right: 2vw;
    }

    .tabbable .tab-content {
        padding: 3vw;
    }

}

@media (min-width: 768px) and (max-width: 991px) {

    .tabbable .nav.nav-tabs > a {
        margin-right: 0.75vw;
        margin-left: 1vw;
        margin-bottom: 2vw;
        line-height: 26px;
        font-size: 18px;
        font-weight: 600;
    }

    .tabbable .tab-content {
        padding: 3vw;
    }

}



/* accordion */
.accordion {
    margin-bottom: 3rem;
}

.accordion > .card {
    color: inherit;
    margin-bottom: 0;
    border-radius: 0;
    border: 0;

}

.accordion > .card:first-child {
    border-radius: 5px 5px 0 0;
}

.accordion > .card:last-child {
    border-radius: 0 0 5px 5px;
}

.accordion .card-header {
    background-color: #126F80;
    border: none;
    border-radius: 0;
    color: #ffffff;
    padding: 0.25rem 1.25rem;
}

.accordion .card-header a {
    display: block;
    position: relative;
    padding: 0.5rem 0;
    padding-right: 64px;
}

.accordion .card-body {
    border: 1px solid #DBDEE7;
}

.accordion > .card:last-child .card-body {
    border-radius: 0 0 5px 5px;
}

.accordion span.toggle {
    display: block;
    bottom: 0;
    right: 0;
    width: 55px;
    height: 55px;
    color: #525E76;
    border-radius: 55px;
    position: absolute;
    top: 2px;
}

.accordion span.toggle::after {
    content: "\32";
    font-family: 'ElegantIcons';
    font-weight: normal;
    display: block;
    position: absolute;
    border: 1px transparent;
    width: 55px;
    height: 55px;
    font-size: 29px;
    line-height: 55px;
    top: 0;
    left: 0;
    color: #ffffff;
    border-radius: 55px;
    text-indent: -3px;
    text-align: center;
}

.accordion a.collapsed > span.toggle::after {
    content: "\33";
}

.frame-layout-0 > .accordion h1,
.frame-layout-0 > .accordion h2,
.frame-layout-0 > .accordion h3,
.frame-layout-0 > .accordion h4,
.frame-layout-0 > .accordion h5,
.frame-layout-0 > .accordion h6,
.frame-layout-0 > .accordion p {
    color: inherit;
    text-transform: none;
}

/*
.frame-31 > .accordion .card {
    background-color: #126F80;
}

.frame-31 > .accordion span.toggle {
    color: #126F80;
}

.frame-32 > .accordion .card {
    background-color: #FDC648;
}

.frame-32 > .accordion span.toggle {
    color: #FDC648;
}

.frame-33 > .accordion .card {
    background-color: #AEC336;
}

.frame-33 > .accordion span.toggle {
    color: #AEC336;
}
*/

@media (min-width: 1200px) {
    .accordion {
        margin-bottom: 48px;
    }

    .accordion > .card {
        margin-bottom: 2px;
    }

    .accordion .card-header a {
        padding: 8px 0;
    }
}



/* Downloads */

/*
.downloads .download:first-child {
    border-radius: 0 0 5px 5px;
}

.downloads .download:nth-child(2) {
    border-radius: 5px 5px 0 0;
}

.downloads .download:last-child {
    border-radius: 0 0 5px 5px;
}
*/
.download {
    border: none;
    background: none;
    border-radius: 0;
    background: #CD1626;
    color: #ffffff;
    /*max-width: 480px;*/
    margin-bottom: 2px;
}

.download a {
    display: block;
    position: relative;
    padding: .75rem 1.25rem;
    padding-right: 64px;
    color: #ffffff;
}

.download a h5 {
    color: #ffffff !important;
    margin: 0 0 0.25px 0;
}

.download a span.meta-fileinfo {
    font-size: 14px;
    line-height: 14px;
    color: #f5f5f5;
    display: block;
}

.download a::after {
    display: none;
  content: "\e912";
    font-family: 'icomoon';
    font-weight: normal;
    display: block;
    position: absolute;
    width: 40px;
    height: 40px;
    font-size: 32px;
    line-height: 34px;
    top: 0.75rem;
    right: 1.25rem;
    color: #ffffff;
    border-radius: 0;
    text-align: center;
    border-radius: 5px;
}

/*
.download a:hover::after {
    background-color: #ffffff;
    border: 3px solid #F95151;
    color: #F95151;
}

.frame-31.frame-000-container .download a:hover::after {
    background-color: #ffffff;
    border: 3px solid #D91D37;
    color: #D91D37;
}
*/

@media (max-width:767px) {
    .cta-download {
        margin-top: 3rem;
        margin-bottom: 3rem;
    }
}


/* scrollvideo */

#scrollvideo { width:100%; height:auto; }

@media (max-width: 991px) {
   #scrollvideo { width:50%; -webkit-transform: translateX(50%); -ms-transform: translateX(50%); transform: translateX(50%); height:auto; } 
}


/* svghiglights */

.svghighlights { position:relative; }
.svghighlights h2 { margin-top: 5vw; }
.svghighlights .spacing  { margin-bottom: 5vw; }

    .svghighlights ul.buttons li { padding:0; position:relative; list-style: none; padding:0; margin-bottom: 8px; display: block; margin-right: 40px; background: #dfdfdf; padding: 10px  0 10px 16px; font-weight: 700; font-size: 16px; line-height:16px; }
    .svghighlights ul.buttons li::after { z-index: -1; position:absolute; background: inherit; display: block; content:""; height:100%; width:40px; -webkit-transform:skewX(20deg); -ms-transform:skewX(20deg); transform:skewX(20deg); top:0; right:-30px; }
    .svghighlights ul.buttons li.active,.svghighlights ul.buttons li:hover { background: #cd1626; color: #ffffff; -webkit-animation: pulse-red 150ms ease-in-out; animation: pulse-red 150ms ease-in-out; }

    .svghighlights.office1 .button[data-class=office1] { background: #cd1626; color: #ffffff; -webkit-animation: pulse-red 150ms ease-in-out; animation: pulse-red 150ms ease-in-out; }
    .svghighlights.office2 .button[data-class=office2] { background: #cd1626; color: #ffffff; -webkit-animation: pulse-red 150ms ease-in-out; animation: pulse-red 150ms ease-in-out; }
    .svghighlights.office3 .button[data-class=office3] { background: #cd1626; color: #ffffff; -webkit-animation: pulse-red 150ms ease-in-out; animation: pulse-red 150ms ease-in-out; }
    .svghighlights.office4 .button[data-class=office4] { background: #cd1626; color: #ffffff; -webkit-animation: pulse-red 150ms ease-in-out; animation: pulse-red 150ms ease-in-out; }
    .svghighlights.office5 .button[data-class=office5] { background: #cd1626; color: #ffffff; -webkit-animation: pulse-red 150ms ease-in-out; animation: pulse-red 150ms ease-in-out; }
    .svghighlights.office6 .button[data-class=office6] { background: #cd1626; color: #ffffff; -webkit-animation: pulse-red 150ms ease-in-out; animation: pulse-red 150ms ease-in-out; }
    .svghighlights.office7 .button[data-class=office7] { background: #cd1626; color: #ffffff; -webkit-animation: pulse-red 150ms ease-in-out; animation: pulse-red 150ms ease-in-out; }
    .svghighlights.office8 .button[data-class=office8] { background: #cd1626; color: #ffffff; -webkit-animation: pulse-red 150ms ease-in-out; animation: pulse-red 150ms ease-in-out; }
    .svghighlights.office9 .button[data-class=office9] { background: #cd1626; color: #ffffff; -webkit-animation: pulse-red 150ms ease-in-out; animation: pulse-red 150ms ease-in-out; }
    .svghighlights.office10 .button[data-class=office10] { background: #cd1626; color: #ffffff; -webkit-animation: pulse-red 150ms ease-in-out; animation: pulse-red 150ms ease-in-out; }

    .svghighlights.conference1 .button[data-class=conference1] { background: #cd1626; color: #ffffff; -webkit-animation: pulse-red 150ms ease-in-out; animation: pulse-red 150ms ease-in-out; }
    .svghighlights.conference2 .button[data-class=conference2] { background: #cd1626; color: #ffffff; -webkit-animation: pulse-red 150ms ease-in-out; animation: pulse-red 150ms ease-in-out; }
    .svghighlights.conference3 .button[data-class=conference3] { background: #cd1626; color: #ffffff; -webkit-animation: pulse-red 150ms ease-in-out; animation: pulse-red 150ms ease-in-out; }
    


    .svghighlights.office1 .office1,
    .svghighlights.office2 .office2,
    .svghighlights.office3 .office3,
    .svghighlights.office4 .office4,
    .svghighlights.office5 .office5,
    .svghighlights.office6 .office6,
    .svghighlights.office7 .office7,
    .svghighlights.office8 .office8,
    .svghighlights.office9 .office9,
    .svghighlights.office10 .office10,
    .svghighlights.conference1 .conference1,
    .svghighlights.conference2 .conference2,
    .svghighlights.conference3 .conference3 {    
      
    }

    /* Office-Chair */

    .svghighlights .office .cls-1{fill:#fff;}
    .svghighlights .office .cls-5{fill:none;}

    .svghighlights .office .cls-2,
    .svghighlights .office .cls-3,
    .svghighlights .office .cls-4,
    .svghighlights .office .cls-6,
    .svghighlights .office .cls-7,
    .svghighlights .office .cls-8,
    .svghighlights .office .cls-9,
    .svghighlights .office .cls-10,
    .svghighlights .office .cls-11,
    .svghighlights .office .cls-12 { fill:#333; }

    .svghighlights.office1 .office .cls-2,
    .svghighlights.office2 .office .cls-3,
    .svghighlights.office3 .office .cls-4,
    .svghighlights.office4 .office .cls-6,
    .svghighlights.office5 .office .cls-7,
    .svghighlights.office6 .office .cls-8,
    .svghighlights.office7 .office .cls-9,
    .svghighlights.office8 .office .cls-10,
    .svghighlights.office10 .office .cls-11,
    .svghighlights.office10 .office .cls-12 { fill:#cd1626; stroke: #cd1626; -webkit-animation: pulse-red 150ms ease-in-out; animation: pulse-red 150ms ease-in-out; -webkit-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; }

    .svghighlights.intropulse .office .cls-8 { -webkit-animation: intro-pulse-svg 150ms ease-in-out; animation: intro-pulse-svg 150ms ease-in-out; -webkit-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; -webkit-animation-fill-mode:both; animation-fill-mode:both; }
    .svghighlights.intropulse .buttons li:first-child{ -webkit-animation: intro-pulse-button 150ms ease-in-out; animation: intro-pulse-button 150ms ease-in-out; -webkit-animation-fill-mode:both; animation-fill-mode:both; }


    /* Conference-Chair */

    .svghighlights .conference .cls-1 { fill:none; }
    .svghighlights .conference .cls-2 { fill:#333; }

    .svghighlights .conference .cls-3,
    .svghighlights .conference .cls-4,
    .svghighlights .conference .cls-5 { fill:#333; }

    .svghighlights.conference1 .conference .cls-3,
    .svghighlights.conference2 .conference .cls-4,
    .svghighlights.conference3 .conference .cls-5 { fill:#cd1626; stroke: #cd1626; -webkit-animation: pulse-red 150ms ease-in-out; animation: pulse-red 150ms ease-in-out; -webkit-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; }

    @-webkit-keyframes pulse-red {
      0% {
        -webkit-transform: scale(1);
                transform: scale(1);

      }

      50% {
        -webkit-transform: scale(1.025);
                transform: scale(1.025);
      }

      100% {
        -webkit-transform: scale(1);
                transform: scale(1);
      }
    }

    @keyframes pulse-red {
      0% {
        -webkit-transform: scale(1);
                transform: scale(1);

      }

      50% {
        -webkit-transform: scale(1.025);
                transform: scale(1.025);
      }

      100% {
        -webkit-transform: scale(1);
                transform: scale(1);
      }
    }
    @-webkit-keyframes intro-pulse-svg {
      0% {
        -webkit-transform: scale(1);
                transform: scale(1);
        fill:#cd1626; 
        stroke: #cd1626; 
      }

      50% {
        -webkit-transform: scale(1.025);
                transform: scale(1.025);
        fill:#cd1626; 
        stroke: #cd1626; 
      }

      100% {
        -webkit-transform: scale(1);
                transform: scale(1);
        fill:#cd1626; 
        stroke: #cd1626; 
      }
    }
    @keyframes intro-pulse-svg {
      0% {
        -webkit-transform: scale(1);
                transform: scale(1);
        fill:#cd1626; 
        stroke: #cd1626; 
      }

      50% {
        -webkit-transform: scale(1.025);
                transform: scale(1.025);
        fill:#cd1626; 
        stroke: #cd1626; 
      }

      100% {
        -webkit-transform: scale(1);
                transform: scale(1);
        fill:#cd1626; 
        stroke: #cd1626; 
      }
    }
    @-webkit-keyframes intro-pulse-button {
      0% {
        -webkit-transform: scale(1);
                transform: scale(1);
        background: #cd1626;
        color:#ffffff;
      }

      50% {
        -webkit-transform: scale(1.025);
                transform: scale(1.025);
        background: #cd1626;
        color:#ffffff;
      }

      100% {
        -webkit-transform: scale(1);
                transform: scale(1);
        background: #cd1626;
        color:#ffffff;
      }
    }
    @keyframes intro-pulse-button {
      0% {
        -webkit-transform: scale(1);
                transform: scale(1);
        background: #cd1626;
        color:#ffffff;
      }

      50% {
        -webkit-transform: scale(1.025);
                transform: scale(1.025);
        background: #cd1626;
        color:#ffffff;
      }

      100% {
        -webkit-transform: scale(1);
                transform: scale(1);
        background: #cd1626;
        color:#ffffff;
      }
    }
    
@media (min-width: 768px) {
    
     .svghighlights .buttons { padding:0; position:relative; float:left; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-flow: column; flex-flow: column; z-index:2;}
     .svghighlights .visuals { position:relative; height: 80vh; }
     .svghighlights ul.buttons li {  font-size: 14px; }
     .svghighlights h2 { margin-top: 12vw; }
     
    .svghighlights .office { 
        display: block;
        height: auto;
        width: 22%;
        position: absolute;
        top: 5%;
        right: 36%;
    }
    
    .svghighlights .conference { 
        display: block;
        height: auto;
        width: 36%;
        position: absolute;
        top: 14%;
        right: 0;
    }
}

@media (min-width: 1025px) {
    
     .svghighlights .buttons { padding:0; position:relative; float:left; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; -ms-flex-flow: column; flex-flow: column; z-index:2;}
     .svghighlights .visuals { position:relative; height: 80vh; }
     .svghighlights ul.buttons li { font-size: 16px;}
     .svghighlights h2 {  margin-top: 5vw; }
         
         
    .svghighlights .office { 
        display: block;
        height: auto;
        width: 25%;
        position: absolute;
        top: 0;
        right: 41%;
    }
    
    .svghighlights .conference { 
        display: block;
        height: auto;
        width: 39%;
        position: absolute;
        top: 8%;
        right: 0;
    }
}

@media (max-width: 767px) {
    
    .svghighlights h2 { margin-top: 100px; }
    .svghighlights ul.buttons li { display:none; padding-right:15px; }
    .svghighlights .buttons { padding:0; position:relative; z-index:2; display: -webkit-box; display: -ms-flexbox; display: flex;}
    
    .svghighlights.office1 .button[data-class=office1] { display:block; -webkit-transition: 150ms opacity ease-in-out; -o-transition: 150ms opacity ease-in-out; transition: 150ms opacity ease-in-out; }
    .svghighlights.office2 .button[data-class=office2] { display:block; -webkit-transition: 150ms opacity ease-in-out; -o-transition: 150ms opacity ease-in-out; transition: 150ms opacity ease-in-out; }
    .svghighlights.office3 .button[data-class=office3] { display:block; -webkit-transition: 150ms opacity ease-in-out; -o-transition: 150ms opacity ease-in-out; transition: 150ms opacity ease-in-out; }
    .svghighlights.office4 .button[data-class=office4] { display:block; -webkit-transition: 150ms opacity ease-in-out; -o-transition: 150ms opacity ease-in-out; transition: 150ms opacity ease-in-out; }
    .svghighlights.office5 .button[data-class=office5] { display:block; -webkit-transition: 150ms opacity ease-in-out; -o-transition: 150ms opacity ease-in-out; transition: 150ms opacity ease-in-out; }
    .svghighlights.office6 .button[data-class=office6] { display:block; -webkit-transition: 150ms opacity ease-in-out; -o-transition: 150ms opacity ease-in-out; transition: 150ms opacity ease-in-out; }
    .svghighlights.office7 .button[data-class=office7] { display:block; -webkit-transition: 150ms opacity ease-in-out; -o-transition: 150ms opacity ease-in-out; transition: 150ms opacity ease-in-out; }
    .svghighlights.office8 .button[data-class=office8] { display:block; -webkit-transition: 150ms opacity ease-in-out; -o-transition: 150ms opacity ease-in-out; transition: 150ms opacity ease-in-out; }
    .svghighlights.office9 .button[data-class=office9] { display:block; -webkit-transition: 150ms opacity ease-in-out; -o-transition: 150ms opacity ease-in-out; transition: 150ms opacity ease-in-out; }
    .svghighlights.office10 .button[data-class=office10] { display:block; -webkit-transition: 150ms opacity ease-in-out; -o-transition: 150ms opacity ease-in-out; transition: 150ms opacity ease-in-out;}

    .svghighlights.conference1 .button[data-class=conference1] { display:block; -webkit-transition: 150ms opacity ease-in-out; -o-transition: 150ms opacity ease-in-out; transition: 150ms opacity ease-in-out; }
    .svghighlights.conference2 .button[data-class=conference2] { display:block; -webkit-transition: 150ms opacity ease-in-out; -o-transition: 150ms opacity ease-in-out; transition: 150ms opacity ease-in-out; }
    .svghighlights.conference3 .button[data-class=conference3] { display:block; -webkit-transition: 150ms opacity ease-in-out; -o-transition: 150ms opacity ease-in-out; transition: 150ms opacity ease-in-out; }
    
    .svghighlights .visuals { position:relative; }
        
    
    .svghighlights .office { 
        display: inline-block;
        height: auto;
        width: 30%;
        position: relative;
        margin-left: 10%;
    }
    
    .svghighlights .conference { 
        display: inline-block;
        height: auto;
        width:48%;
        position: relative;
        margin: 10% 0 0 10%;
    }
    
    
}

@media (max-width: 478px) {
    

    .svghighlights .office { 
        display: block;
        height: auto;
        width: 40%;
        position: relative;
        margin: 0 0 0 20%;
    }
    
    .svghighlights .conference { 
        display: block;
        height: auto;
        width:50%;
        position: relative;
        margin: 10% 0 0 40%;
    }
    
}
    
    
    
/*post-consumer*/

.postconsumer  { position:relative; }
.postconsumer .visuals { position:relative; }
.postconsumer .buttons { display: none; }

    /* Office-Chair */
    .postconsumer .office {
       display:block;
       width:40%;
       height:auto;
       position:relative;
       float:left;
    }

    .postconsumer .office .cls-1{fill:#fff;}
    .postconsumer .office .cls-5{fill:none;}

    .postconsumer .office .cls-2,
    .postconsumer .office .cls-3,
    .postconsumer .office .cls-4,
    .postconsumer .office .cls-6,
    .postconsumer .office .cls-7,
    .postconsumer .office .cls-8,
    .postconsumer .office .cls-9,
    .postconsumer .office .cls-10,
    .postconsumer .office .cls-11,
    .postconsumer .office .cls-12 { fill:#333; }

    .postconsumer.office1 .office .cls-2,
    .postconsumer.office2 .office .cls-3,
    .postconsumer.office3 .office .cls-4,
    .postconsumer.office4 .office .cls-6,
    .postconsumer.office5 .office .cls-7,
    .postconsumer.office6 .office .cls-8,
    .postconsumer.office7 .office .cls-9,
    .postconsumer.office8 .office .cls-10,
    .postconsumer.office9 .office .cls-11,
    .postconsumer.office10 .office .cls-12 { fill:#87DB0D; stroke: #87DB0D; -webkit-animation: pulse-green 150ms ease-in-out; animation: pulse-green 150ms ease-in-out; -webkit-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; }

    /* Conference-Chair */
    .postconsumer .conference {
       display:block;
       width:50%;
       height:auto;
       position:relative;
       top:5vw;
       float: right;
    }

    .postconsumer .conference .cls-1 { fill:none; }
    .postconsumer .conference .cls-2 { fill:#333; }

    .postconsumer .conference .cls-3,
    .postconsumer .conference .cls-4,
    .postconsumer .conference .cls-5 { fill:#333; }

    .postconsumer.conference1 .conference .cls-3,
    .postconsumer.conference2 .conference .cls-4,
    .postconsumer.conference3 .conference .cls-5 { fill:#87DB0D; stroke: #87DB0D; -webkit-animation: pulse-green 150ms ease-in-out; animation: pulse-green 150ms ease-in-out; -webkit-transform-origin: 50% 50%; -ms-transform-origin: 50% 50%; transform-origin: 50% 50%; }

    @-webkit-keyframes pulse-green {
      0% {
        -webkit-transform: scale(1);
                transform: scale(1);

      }

      50% {
        -webkit-transform: scale(1.025);
                transform: scale(1.025);
      }

      100% {
        -webkit-transform: scale(1);
                transform: scale(1);
      }
    }

    @keyframes pulse-green {
      0% {
        -webkit-transform: scale(1);
                transform: scale(1);

      }

      50% {
        -webkit-transform: scale(1.025);
                transform: scale(1.025);
      }

      100% {
        -webkit-transform: scale(1);
                transform: scale(1);
      }
    }
   
@media (max-width: 1199px) {
    
   .postconsumer .visuals {
        position: relative;
        width: 75%;
        margin: 75px auto 0;
    }
}      
   
   
/* SVG-Map */

.svgmap { width: 100%; height:auto; }
/*
.svgmap .cls-1 {fill:#e5e5e5;}
.svgmap .cls-1,.cls-2 {stroke:#fff;stroke-width:1px;fill-rule:evenodd;}
.svgmap .cls-2 {fill:#e5e5e5;}
.svgmap.highlight .cls-2 {fill:#CD1626; transition: 1.5s fill linear; }
*/

  /* All */
  .svgmap .cls-1{stroke:#fff;stroke-width:0.5px;fill-rule:evenodd;fill:#ccc;}
  /* Highlight Fläche */
  .svgmap .cls-2{stroke:#fff;stroke-width:0.5px;fill-rule:evenodd;fill:#ccc;}
  /* Linien */
  .svgmap .cls-10, .svgmap .cls-11, .svgmap .cls-3, .svgmap .cls-8{fill:none;stroke:#707070; opacity:0; }
  /* Rechteck */
  .svgmap .cls-4{fill:#CD1626; opacity:0; }
  /* Text */
  .svgmap .cls-5{isolation:isolate;font-size:25px;fill:#CD1626;font-family:Montserrat-Bold, Montserrat;font-weight:700; opacity:0; }


.svgmap.highlight #belgien-niederlande .cls-2 { fill:#CD1626; -webkit-transition: 1.5s fill ease-in-out; -o-transition: 1.5s fill ease-in-out; transition: 1.5s fill ease-in-out; -webkit-transition-delay: 0.5s; -o-transition-delay: 0.5s; transition-delay: 0.5s; }
.svgmap.highlight #belgien-niederlande .cls-10,
.svgmap.highlight #belgien-niederlande .cls-11,
.svgmap.highlight #belgien-niederlande .cls-3,
.svgmap.highlight #belgien-niederlande .cls-8,
.svgmap.highlight #belgien-niederlande .cls-4,
.svgmap.highlight #belgien-niederlande .cls-5 { opacity:1; -webkit-transition: 1.25s opacity ease-in-out; -o-transition: 1.25s opacity ease-in-out; transition: 1.25s opacity ease-in-out; -webkit-transition-delay: 1s; -o-transition-delay: 1s; transition-delay: 1s; }

.svgmap.highlight #deutschland .cls-2 { fill:#CD1626; -webkit-transition: 1.5s fill ease-in-out; -o-transition: 1.5s fill ease-in-out; transition: 1.5s fill ease-in-out; -webkit-transition-delay: 1s; -o-transition-delay: 1s; transition-delay: 1s; }
.svgmap.highlight #deutschland .cls-10,
.svgmap.highlight #deutschland .cls-11,
.svgmap.highlight #deutschland .cls-3,
.svgmap.highlight #deutschland .cls-8,
.svgmap.highlight #deutschland .cls-4,
.svgmap.highlight #deutschland .cls-5 { opacity:1; -webkit-transition: 1.25s opacity ease-in-out; -o-transition: 1.25s opacity ease-in-out; transition: 1.25s opacity ease-in-out; -webkit-transition-delay: 1.5s; -o-transition-delay: 1.5s; transition-delay: 1.5s; }

.svgmap.highlight #tschechien .cls-2 { fill:#CD1626; -webkit-transition: 1.5s fill ease-in-out; -o-transition: 1.5s fill ease-in-out; transition: 1.5s fill ease-in-out; -webkit-transition-delay: 1.5s; -o-transition-delay: 1.5s; transition-delay: 1.5s; }
.svgmap.highlight #tschechien .cls-10,
.svgmap.highlight #tschechien .cls-11,
.svgmap.highlight #tschechien .cls-3,
.svgmap.highlight #tschechien .cls-8,
.svgmap.highlight #tschechien .cls-4,
.svgmap.highlight #tschechien .cls-5 { opacity:1; -webkit-transition: 1.25s opacity ease-in-out; -o-transition: 1.25s opacity ease-in-out; transition: 1.25s opacity ease-in-out; -webkit-transition-delay: 2s; -o-transition-delay: 2s; transition-delay: 2s; }

.svgmap.highlight #polen .cls-2 { fill:#CD1626; -webkit-transition: 1.5s fill ease-in-out; -o-transition: 1.5s fill ease-in-out; transition: 1.5s fill ease-in-out; -webkit-transition-delay: 2s; -o-transition-delay: 2s; transition-delay: 2s; }
.svgmap.highlight #polen .cls-10,
.svgmap.highlight #polen .cls-11,
.svgmap.highlight #polen .cls-3,
.svgmap.highlight #polen .cls-8,
.svgmap.highlight #polen .cls-4,
.svgmap.highlight #polen .cls-5 { opacity:1; -webkit-transition: 1.25s opacity ease-in-out; -o-transition: 1.25s opacity ease-in-out; transition: 1.25s opacity ease-in-out; -webkit-transition-delay: 2.5s; -o-transition-delay: 2.5s; transition-delay: 2.5s; }

.svgmap.highlight #portugal .cls-2 { fill:#CD1626; -webkit-transition: 1.5s fill ease-in-out; -o-transition: 1.5s fill ease-in-out; transition: 1.5s fill ease-in-out; -webkit-transition-delay: 2.5s; -o-transition-delay: 2.5s; transition-delay: 2.5s; }
.svgmap.highlight #portugal .cls-10,
.svgmap.highlight #portugal .cls-11,
.svgmap.highlight #portugal .cls-3,
.svgmap.highlight #portugal .cls-8,
.svgmap.highlight #portugal .cls-4,
.svgmap.highlight #portugal .cls-5 { opacity:1; -webkit-transition: 1.25s opacity ease-in-out; -o-transition: 1.25s opacity ease-in-out; transition: 1.25s opacity ease-in-out; -webkit-transition-delay: 3s; -o-transition-delay: 3s; transition-delay: 3s; }

.svgmap.highlight #italien .cls-2 { fill:#CD1626; -webkit-transition: 1.5s fill ease-in-out; -o-transition: 1.5s fill ease-in-out; transition: 1.5s fill ease-in-out; -webkit-transition-delay: 3s; -o-transition-delay: 3s; transition-delay: 3s; }
.svgmap.highlight #italien .cls-10,
.svgmap.highlight #italien .cls-11,
.svgmap.highlight #italien .cls-3,
.svgmap.highlight #italien .cls-8,
.svgmap.highlight #italien .cls-4,
.svgmap.highlight #italien .cls-5 { opacity:1; -webkit-transition: 1.25s opacity ease-in-out; -o-transition: 1.25s opacity ease-in-out; transition: 1.25s opacity ease-in-out; -webkit-transition-delay: 3.5s; -o-transition-delay: 3.5s; transition-delay: 3.5s; }

.svgmap.highlight #kroatien .cls-2 { fill:#CD1626; -webkit-transition: 1.5s fill ease-in-out; -o-transition: 1.5s fill ease-in-out; transition: 1.5s fill ease-in-out; -webkit-transition-delay: 3.5s; -o-transition-delay: 3.5s; transition-delay: 3.5s; }
.svgmap.highlight #kroatien .cls-10,
.svgmap.highlight #kroatien .cls-11,
.svgmap.highlight #kroatien .cls-3,
.svgmap.highlight #kroatien .cls-8,
.svgmap.highlight #kroatien .cls-4,
.svgmap.highlight #kroatien .cls-5 { opacity:1; -webkit-transition: 1.25s opacity ease-in-out; -o-transition: 1.25s opacity ease-in-out; transition: 1.25s opacity ease-in-out; -webkit-transition-delay: 4s; -o-transition-delay: 4s; transition-delay: 4s;  }

.svgmap.highlight #ungarn .cls-2 { fill:#CD1626; -webkit-transition: 1.5s fill ease-in-out; -o-transition: 1.5s fill ease-in-out; transition: 1.5s fill ease-in-out; -webkit-transition-delay: 4s; -o-transition-delay: 4s; transition-delay: 4s;  }
.svgmap.highlight #ungarn .cls-10,
.svgmap.highlight #ungarn .cls-11,
.svgmap.highlight #ungarn .cls-3,
.svgmap.highlight #ungarn .cls-8,
.svgmap.highlight #ungarn .cls-4,
.svgmap.highlight #ungarn .cls-5 { opacity:1; -webkit-transition: 1.25s opacity ease-in-out; -o-transition: 1.25s opacity ease-in-out; transition: 1.25s opacity ease-in-out; -webkit-transition-delay: 4.5s; -o-transition-delay: 4.5s; transition-delay: 4.5s;  }

.svgmap.highlight #china .cls-2 { fill:#CD1626; -webkit-transition: 1.5s fill ease-in-out; -o-transition: 1.5s fill ease-in-out; transition: 1.5s fill ease-in-out; -webkit-transition-delay: 4.5s; -o-transition-delay: 4.5s; transition-delay: 4.5s;  }
.svgmap.highlight #china .cls-10,
.svgmap.highlight #china .cls-11,
.svgmap.highlight #china .cls-3,
.svgmap.highlight #china .cls-8,
.svgmap.highlight #china .cls-4,
.svgmap.highlight #china .cls-5 { opacity:1; -webkit-transition: 1.25s opacity ease-in-out; -o-transition: 1.25s opacity ease-in-out; transition: 1.25s opacity ease-in-out; -webkit-transition-delay: 5s; -o-transition-delay: 5s; transition-delay: 5s;  }

@media (max-width: 767px) {
    .svgmap {
        width: 100%;
        height: auto;
        margin-bottom: 20vh;
    }
}

/*

.svgmap .cls-1 { fill:#e5e5e5; }
.svgmap .cls-1, .svgmap .cls-2 { stroke:#fff; stroke-width:1px; fill-rule:evenodd; }

.svgmap .cls-10, .svgmap .cls-2, .svgmap .cls-4{ fill:#e5e5e5; }

.svgmap.highlight .cls-2,
.svgmap.highlight .cls-4,
.svgmap.highlight .cls-10 { fill:#CD1626; transition: 0.75s fill ease-in-out; transition-delay: 1s; }

.svgmap .cls-3, .svgmap .cls-5, .svgmap .cls-6, .svgmap .cls-7, .svgmap .cls-8 { fill:none; }
.svgmap .cls-3, .svgmap .cls-6, .svgmap .cls-7, .svgmap .cls-8 { stroke:#707070; opacity:0; }

.svgmap.highlight .cls-3,
.svgmap.highlight .cls-6,
.svgmap.highlight .cls-7,
.svgmap.highlight .cls-8 { opacity:1; transition: 1s opacity ease-in-out; transition-delay: 1.5s; }


.svgmap .cls-5 { stroke:#cd1626; opacity:0; }
.svgmap.highlight .cls-5 { opacity:1; transition: 1s opacity ease-in-out; transition-delay: 1.5s;  }

.svgmap .cls-10, .svgmap .cls-0 { isolation:isolate; }

.svgmap .cls-10 { font-size:25px;font-family:Montserrat-Bold, Montserrat;font-weight:700; opacity:0; }
.svgmap.highlight .cls-10 {opacity:1; transition: 1s opacity ease-in-out; transition-delay: 1.5s; }

*/


/* Fade-in */

.animate-children > * { position:relative; -webkit-transform: translateY(3vw); -ms-transform: translateY(3vw); transform: translateY(3vw); opacity:0; }
.animate-children > *.fade-in { -webkit-transform: translateY(0px); -ms-transform: translateY(0px); transform: translateY(0px); -webkit-transition: 1s all ease-in-out; -o-transition: 1s all ease-in-out; transition: 1s all ease-in-out; opacity: 1; -webkit-transition-delay: 0ms; -o-transition-delay: 0ms; transition-delay: 0ms; }
.animate-children > *.fade-in:nth-child(2) {-webkit-transition-delay: 50ms;-o-transition-delay: 50ms;transition-delay: 50ms; }

.frame-901 > * { position:relative; -webkit-transform: translateY(3vw); -ms-transform: translateY(3vw); transform: translateY(3vw); opacity:0; }
.frame-901 > *.fade-in { -webkit-transform: translateY(0px); -ms-transform: translateY(0px); transform: translateY(0px); -webkit-transition: 1s all ease-in-out; -o-transition: 1s all ease-in-out; transition: 1s all ease-in-out; opacity: 1; -webkit-transition-delay: 0ms; -o-transition-delay: 0ms; transition-delay: 0ms;  }
.frame-901 > *.fade-in:nth-child(2) {-webkit-transition-delay: 50ms;-o-transition-delay: 50ms;transition-delay: 50ms; }
.frame-901 > *.fade-in:nth-child(3) {-webkit-transition-delay: 100ms;-o-transition-delay: 100ms;transition-delay: 100ms; }
.frame-901 > *.fade-in:nth-child(4) {-webkit-transition-delay: 150ms;-o-transition-delay: 150ms;transition-delay: 150ms; }
.frame-901 > *.fade-in:nth-child(5) {-webkit-transition-delay: 200ms;-o-transition-delay: 200ms;transition-delay: 200ms; }
.frame-901 > *.fade-in:nth-child(6) {-webkit-transition-delay: 250ms;-o-transition-delay: 250ms;transition-delay: 250ms; }
.frame-901 > *.fade-in:nth-child(7) {-webkit-transition-delay: 300ms;-o-transition-delay: 300ms;transition-delay: 300ms; }
.frame-901 > *.fade-in:nth-child(8) {-webkit-transition-delay: 350ms;-o-transition-delay: 350ms;transition-delay: 350ms; }


/* Parallax */


.parallax-container { 
    position: relative;
    min-height: 80vh; 
    background: none;
    background-repeat: no-repeat;
    background-position: 70% 50%;
    background-attachment: scroll;
    background-size: cover;       
}

.parallax-container.layout-201 { 
    min-height: 50vh; 
}

.parallax-overlay {
    width: 100%;
    position: absolute;
    overflow: hidden;
    text-align: left;
    display: flex;
    height: 100%;
    left: 0;
    top: 0;
    flex-direction: row;
    align-items: center;
}

    .parallax-overlay.style1 {
        background: rgba(205,22,38,0.75);
        color: #ffffff;    

    } 
    .parallax-overlay.style2 {
        background: none;
        color: #ffffff;      
    } 

    .parallax-overlay.style1 h1,
    .parallax-overlay.style1 h2,
    .parallax-overlay.style1 h3 {
        color: #ffffff;  
        font-family: "maven pro";
    } 
    
    .parallax-overlay.style1 h2,
    .parallax-overlay.style1 h3 {
        font-size: calc( 100px + 100 * ((100vw - 1200px) / 720));
        line-height: calc( 110px + 110 * ((100vw - 1200px) / 720));
    } 
    
    .parallax-overlay.style1 p,
    .parallax-overlay.style2 p {
        color: inherit;      
    } 

/*
.parallax-overlay > .container-fluid { margin-top: 5vw;margin-bottom: 5vw; } 
*/
.parallax-container.layout-201 .parallax-overlay > .container-fluid  { 
    margin-top: 2.5vw;margin-bottom: 1vw; 
}

.parallax-container {
    border-top: 1px solid #ffffff; 
}
    
.parallax-overlay .scrolldown {
    width:100%;  
    height:1vw;
    min-height: 75px;
    position: relative;
    text-align: center;
    display: none;
}

.parallax-overlay .scrolldown a {
    display: block;
    width:76px;  
    height:44px;
    position: absolute;
    bottom: 0;
    left: 50%;
    -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
            transform: translateX(-50%);
    color: #000000;
    background: #ffffff;
    font-size: 32px;
    padding: 10px;
}
.parallax-container.layout-201 .parallax-overlay .scrolldown { display: none; }

.parallax-overlay .scrolldown a:hover {
    color: #CD1626;
}


@media ( max-width:767px )  {

    .parallax-container .row{
        justify-content: center !important;
    }
    .parallax-container:last-of-type {
        border-bottom: 1px solid #ffffff; 
    }
    
    .parallax-container h2 {
       font-size: 34px;
       line-height: 47px; 
    }
    
    
}

@media ( max-width: 479px )  {

    .parallax-container { 
        background-position: 60% 50%;
    }
    
    .parallax-container h2 {
       font-size: 28px;
       line-height: 38px; 
       text-shadow: 0px 0px 10px rgb(0, 0, 0);
    }
    
    .parallax-container .column p {
       text-shadow: 0px 0px 10px rgb(0, 0, 0);
    }
        
    .parallax-container {
        border-top: none; 
    }    
        
}


@media ( min-width:768px )  {
    
    
    .parallax-container {
        border-top: 1px solid #ffffff; 
    }

    .parallax-container { 
        background-position: 50% 50%;
        min-height: 1400px;
        background-attachment: fixed; 
    }
    
    .parallax-container.layout-201 .parallax-container { 
        min-height: 800px;
    }  
  
}

/* Modals */

.modals {
    height:0.01px;
    width:0.01px;
}
.mod {
    width:100%;
    position:fixed;
    left:0;
    top:0;
    height:100vh;
    z-index:599; 
    display: none;
    background: -o-linear-gradient(left, rgb(206, 221, 223) 0%, rgb(239, 228, 211) 100%);
    background: -webkit-gradient(linear, left top, right top, from(rgb(206, 221, 223)), to(rgb(239, 228, 211)));
    background: linear-gradient(90deg, rgb(206, 221, 223) 0%, rgb(239, 228, 211) 100%);
    overflow-x:hidden;
    overflow-y:auto;
}
.mod-header,
.mod-footer{
    width:100%;
    height:100px;
}
.mod-body {
    min-height: calc(100vh - 200px);
    padding: 0 15px;
}
span.mod-close {
    display: block;
    height:60px;
    width:60px;
    background-color: #ffffff;
    border-radius: 42px;
    color: #2F1812;
    position:fixed;
    font-size:32px;
    right:2.5vh;
    top: 20px;
}
span.mod-close::after {
    content:"\e90e";
    display: block;
    height:60px;
    width:60px;
    font-family: 'icomoon';
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    /*line-height: 1;*/
    color: inherit;
    position:absolute;
    text-align:center;
    line-height:60px;
    -webkit-transform:rotate(-45deg);
        -ms-transform:rotate(-45deg);
            transform:rotate(-45deg);
    cursor: pointer;
}
span.mod-close:hover {
    background-color: #B78338;
    color: #ffffff;
}



/* Margins */

.frame-space-before-extra-small { margin-top: 20px; }
.frame-space-before-small { margin-top: 30px; }
.frame-space-before-medium { margin-top: 50px; }
.frame-space-before-large { margin-top: 75px; }
.frame-space-before-extra-large { margin-top: 100px; }

.frame-space-before-1vw,
.frame-space-before-2vw,
.frame-space-before-3vw,
.frame-space-before-5vw {
    margin-top: 100px;
}
.frame-space-before-7_5vw,
.frame-space-before-10vw,
.frame-space-before-15vw,
.frame-space-before-20vw {
    margin-top: 200px;
}
.frame-space-before-25vw,
.frame-space-before-30vw,
.frame-space-before-40vw,
.frame-space-before-50vw,
.frame-space-before-60vw,
.frame-space-before-75vw {
    margin-top: 250px;
}

.frame-space-after-extra-small { margin-bottom: 20px; }
.frame-space-after-small { margin-bottom: 30px; }
.frame-space-after-medium { margin-bottom: 50px; }
.frame-space-after-large { margin-bottom: 75px; }
.frame-space-after-extra-large { margin-bottom: 100px; }

.frame-space-after-1vw,
.frame-space-after-2vw,
.frame-space-after-3vw,
.frame-space-after-5vw {
    margin-bottom: 100px;
}
.frame-space-after-7_5vw,
.frame-space-after-10vw,
.frame-space-after-15vw,
.frame-space-after-20vw {
    margin-bottom: 200px;
}
.frame-space-after-25vw,
.frame-space-after-30vw,
.frame-space-after-40vw,
.frame-space-after-50vw,
.frame-space-after-60vw,
.frame-space-after-75vw {
    margin-bottom: 250px;
}

@media (min-width:768px) and  (max-width:1199px)  {


    .frame-space-before-1vw,
    .frame-space-before-2vw,
    .frame-space-before-3vw,
    .frame-space-before-5vw {
        margin-top: 12vw;
    }
    .frame-space-before-7_5vw,
    .frame-space-before-10vw,
    .frame-space-before-15vw,
    .frame-space-before-20vw {
        margin-top: 24vw;
    }
    .frame-space-before-25vw,
    .frame-space-before-30vw,
    .frame-space-before-40vw,
    .frame-space-before-50vw,
    .frame-space-before-60vw,
    .frame-space-before-75vw {
        margin-top: 36vw;
    }
    
    .frame-space-after-1vw,
    .frame-space-after-2vw,
    .frame-space-after-3vw,
    .frame-space-after-5vw {
        margin-bottom: 12vw;
    }
    .frame-space-after-7_5vw,
    .frame-space-after-10vw,
    .frame-space-after-15vw,
    .frame-space-after-20vw {
        margin-bottom: 24vw;
    }
    .frame-space-after-25vw,
    .frame-space-after-30vw,
    .frame-space-after-40vw,
    .frame-space-after-50vw,
    .frame-space-after-60vw,
    .frame-space-after-75vw {
        margin-bottom: 36vw;
    }

}
@media (min-width:1200px) {

    .frame-space-before-extra-small { margin-top: 20px; }
    .frame-space-before-small { margin-top: 30px; }
    .frame-space-before-medium { margin-top: 50px; }
    .frame-space-before-large { margin-top: 75px; }
    .frame-space-before-extra-large { margin-top: 100px; }


    .frame-space-before--1vw {
        margin-top: -1vw;
    }
    .frame-space-before--2vw {
        margin-top: -2vw;
    }
    .frame-space-before--3vw {
        margin-top: -3vw;
    }
    .frame-space-before--5vw {
        margin-top: -5vw;
    }
    .frame-space-before--7_5vw {
        margin-top: -7.5vw;
    }
    .frame-space-before--10vw {
        margin-top: -10vw;
    }

    .frame-space-before-1vw {
        margin-top: 1vw;
    }
    .frame-space-before-2vw {
        margin-top: 2vw;
    }
    .frame-space-before-3vw {
        margin-top: 3vw;
    }
    .frame-space-before-5vw {
        margin-top: 5vw;
    }
    .frame-space-before-7_5vw {
        margin-top: 7.5vw;
    }
    .frame-space-before-10vw {
        margin-top: 10vw;
    }
    .frame-space-before-15vw {
        margin-top: 15vw;
    }
    .frame-space-before-20vw {
        margin-top: 20vw;
    }
    .frame-space-before-25vw {
        margin-top: 25vw;
    }
    .frame-space-before-30vw {
        margin-top: 30vw;
    }
    .frame-space-before-40vw {
        margin-top: 40vw;
    }
    .frame-space-before-50vw {
        margin-top: 50vw;
    }
    .frame-space-before-60vw {
        margin-top: 60vw;
    }
    .frame-space-before-75vw {
        margin-top: 75vw;
    }
    .frame-space-before-50vh {
        margin-top: 50vh;
    }

    .frame-space-after-extra-small { margin-bottom: 20px; }
    .frame-space-after-small { margin-bottom: 30px; }
    .frame-space-after-medium { margin-bottom: 50px; }
    .frame-space-after-large { margin-bottom: 75px; }
    .frame-space-after-extra-large { margin-bottom: 100px; }


    .frame-space-after--1vw {
        margin-bottom: -1vw;
    }
    .frame-space-after--2vw {
        margin-bottom: -2vw;
    }
    .frame-space-after--3vw {
        margin-bottom: -3vw;
    }
    .frame-space-after--5vw {
        margin-bottom: -5vw;
    }
    .frame-space-after--7_5vw {
        margin-bottom: -7.5vw;
    }
    .frame-space-after--10vw {
        margin-bottom: -10vw;
    }

    .frame-space-after-1vw {
        margin-bottom: 1vw;
    }
    .frame-space-after-2vw {
        margin-bottom: 2vw;
    }
    .frame-space-after-3vw {
        margin-bottom: 3vw;
    }
    .frame-space-after-5vw {
        margin-bottom: 5vw;
    }
    .frame-space-after-7_5vw {
        margin-bottom: 7.5vw;
    }
    .frame-space-after-10vw {
        margin-bottom: 10vw;
    }
    .frame-space-after-15vw {
        margin-bottom: 15vw;
    }
    .frame-space-after-20vw {
        margin-bottom: 20vw;
    }
    .frame-space-after-25vw {
        margin-bottom: 25vw;
    }
    .frame-space-after-30vw {
        margin-bottom: 30vw;
    }
    .frame-space-after-40vw {
        margin-bottom: 40vw;
    }
    .frame-space-after-50vw {
        margin-bottom: 50vw;
    }
    .frame-space-after-60vw {
        margin-bottom: 60vw;
    }
    .frame-space-after-75vw {
        margin-bottom: 75vw;
    }
    .frame-space-after-50vh {
        margin-bottom: 50vh;
    }

}

/* video */

#triggervideo { position:relative; top: -25vh; height:1px; }

/* Jobs */
.job-list-view { margin-top: 50px; }
.job-list-teaser { 
    position: relative;
    opacity: 0;
    margin-bottom: 30px;
        -webkit-transform: translate( 0, 50% ) scale(0.8);
        -ms-transform: translate( 0, 50% ) scale(0.8);
            transform: translate( 0, 50% ) scale(0.8);
}
.job-list-teaser.animTriggered { 
    opacity: 1;
    -webkit-transform:translate(0, 0) scale(1);
        -ms-transform:translate(0, 0) scale(1);
            transform:translate(0, 0) scale(1);
    -webkit-transition: 250ms -webkit-transform ease-out;
    transition: 250ms -webkit-transform ease-out;
    -o-transition: 250ms transform ease-out;
    transition: 250ms transform ease-out;
    transition: 250ms transform ease-out, 250ms -webkit-transform ease-out;    
}

.job-list-teaser a, .job-list-teaser a:hover { color: #0E71B8; }

/*anchor*/

.anchor { position:relative; display: block; }

/* Backgrounds */

#g87 {
  position: relative;
}

#g87:before {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  height: 100%;
  width: 100%;
  background: #0E71B8;
  -webkit-transform: skewX(20deg) translateX(-100%);
      -ms-transform: skewX(20deg) translateX(-100%);
          transform: skewX(20deg) translateX(-100%);
  margin-left: calc( 1.5vw + 70 * ((100vw - 1200px) / 720));
}

#g90 {
  position: relative;
}

#g90:after {
  content: "";
  display: block;
  position: absolute;
  top: 0;
  height: 100%;
  width: 100%;
  background: #ffffff;
  -webkit-transform: skewX(20deg) translateX(100%);
      -ms-transform: skewX(20deg) translateX(100%);
          transform: skewX(20deg) translateX(100%);
  margin-left: calc( -1 * (1.5vw + 70 * ((100vw - 1200px) / 720)));
  z-index:2;
}


@media ( max-width: 767px )  { 
 
 
  #g87 {
  
    background: #ffffff; /* Old browsers */ /* FF3.6-15 */ /* Chrome10-25,Safari5.1-6 */
    background: -o-linear-gradient(20deg,  #0E71B8 -30%,#0E71B8 5.999%,#ffffff 6%,#ffffff 100%);
    background: linear-gradient(70deg,  #0E71B8 -30%,#0E71B8 5.999%,#ffffff 6%,#ffffff 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0E71B8', endColorstr='#ffffff',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */

  }
  #g87:before {
      display:none;
  } 
 
  #g90 {
  
    background: #ffffff; /* Old browsers */ /* FF3.6-15 */ /* Chrome10-25,Safari5.1-6 */
    background: -o-linear-gradient(20deg,  #fbfbfb 0%,#fbfbfb 70.999%,#ffffff 71%,#ffffff 100%);
    background: linear-gradient(70deg,  #fbfbfb 0%,#fbfbfb 70.999%,#ffffff 71%,#ffffff 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fbfbfb', endColorstr='#ffffff',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */

  }
  #g90:after {
      display:none;
  }
  
  #g92 { margin-top: 50px !important; margin-bottom: 50px !important } 

}

/*Black*/
.bg1 { background-color: #000000; }
.bg1 * { color: #ffffff; }

/*White*/
.bg2 { background-color: #ffffff; }
.bg2 * { color: #000000; }
.bg2 h1, .bg2 h2, bg2 h3 { color: #CD1626; }

/*Hellgrau*/
.bg3 > div { 
    background-color: #35383c;
    /*background: url("../img/hexagon_pattern_1.svg") no-repeat -20px -20px, #35383c;*/
    background: url("../img/hexagon_pattern_1.svg") no-repeat -20px -20px, linear-gradient(255deg, rgb(29, 29, 38) 0%, rgb(35, 38, 43) 28%, rgb(47, 62, 83) 62%, rgb(35, 38, 43) 95%, rgb(31, 33, 32) 97%, rgb(27, 24, 20) 100%);
    background-size: 160px, cover; 
    background-repeat: repeat;
    padding: 30px;
    box-shadow: 0 0 30px 12px rgba(0,0,0,0.75);
}

.bg3 > div:last-child {
    position: relative;
}
.bg3 * { color: #ffffff; }
.bg3 h1, .bg3 h2, bg3 h3 { color: #ffffff; }

/*Rot*/
.bg4 { background-color: #CD1626; }
.bg4 * { color: #ffffff; }

.secondlevel.bg4 * { background: transparent; }

.bg4 h1, .bg4 h2, bg4 h3 { color: inherit !important; }
.bg4 h1, .bg4 h2, bg4 h3 { color: inherit !important; }
.bg4 a, .bg4 a:hover { color: #ffffff !important;}


/*animatedcounter*/
.animatedcounter { text-align: left; position: relative; font-size: 32px; line-height:32px; margin-bottom: 2vw;}
.animatedcounter img { 
    display: inline-block;
    max-width: 160px;
    height:auto; 
    width:100%;
    margin-bottom: 1vw;
}
.animatedcounter span { 
    font-weight: 700;
}
#timestamp { font-size: 80%; }

@media ( max-width: 767px )  {
    .animatedcounter img { max-width: 90px; }
    .animatedcounter { margin-bottom: 15vw;}
}


/*Canvas*/


 div.canvas3d {
  margin-top:0;
  width:100%;
  position:absolute;
  display:block;
  left:0;
  top:0;
  bottom:0;
  padding-bottom:0;
 }
 div.canvas3d canvas {
  position:relative;
  width:100%;
  height:100%;
  z-index:2;
 }


/* Sticky-Menu */

#stickymenu { display: none; }

@media ( min-width: 1200px )  { 
    
    #stickymenu {
        display: none;
        position: fixed;
        top: 50%;
        /*width: 180px;*/
        left: 0;
        -webkit-transform: translate(-100%, -50%);
            -ms-transform: translate(-100%, -50%);
                transform: translate(-100%, -50%);
        -webkit-transition: 1s -webkit-transform ease-in-out;
        transition: 1s -webkit-transform ease-in-out;
        -o-transition: 1s transform ease-in-out;
        transition: 1s transform ease-in-out;
        transition: 1s transform ease-in-out, 1s -webkit-transform ease-in-out;
        z-index: 91;
    }
    
    body.sticky-menu #stickymenu {
        -webkit-transform: translate(0, -50%);
            -ms-transform: translate(0, -50%);
                transform: translate(0, -50%);
        -webkit-transition: 1s -webkit-transform ease-in-out;
        transition: 1s -webkit-transform ease-in-out;
        -o-transition: 1s transform ease-in-out;
        transition: 1s transform ease-in-out;
        transition: 1s transform ease-in-out, 1s -webkit-transform ease-in-out;
    }
    
      #stickymenu ul {
          padding:0;
          margin:0;
          display: -webkit-box;
          display: -ms-flexbox;
          display: flex;
          -webkit-box-flex: 1;
              -ms-flex-positive: 1;
                  flex-grow: 1;
          -webkit-box-orient:vertical;
          -webkit-box-direction:normal;
              -ms-flex-flow:column;
                  flex-flow:column; 
      }
      #stickymenu ul li {
          list-style: none;
          font-size: 12px;
          color: #000000;
          padding: 8px 16px 8px 16px;
          line-height:12px;
          margin:0;
          display: inline-block;
          position:relative;
          clear:both;
          float:left;
        background: rgba(255,255,255,0.5);
      }
      #stickymenu ul li.active {
          list-style: none;
          font-size: 12px;
          color: #CD1626;
          padding: 8px 16px 8px 32px;
          background: #ffffff;
      }
        #stickymenu ul li.active:before {
            content:"";
            background-color: #CD1626;
            display: block;
            height: 8px;
            width:8px;
            left:16px;
            margin:2px 0;
            position: absolute;
        }
    
      #stickymenu ul li a {
         color: #000000;
      }
      #stickymenu ul li.active a {
         color: #CD1626;
      }
      
}

/* Countdown */


.frame-countdown {
    position:relative; 
    padding: 0.1px 0;
}    



.frame-countdown .bg {
    display: block;
    position:absolute;
    height: 100%;
    width:100%;
    top:0;
    left: 0;
    z-index:-1;
}
.frame-countdown .bg  .layer{
    display: block;
    position:absolute;
    height: 100%;
    width:100%;
    top:0;
    left:0;
}

.frame-countdown .bg  .layer0{
    z-index: auto;
    background-image: url('../img/hexa2.svg');
    background-position: center center;
    background-repeat: no-repeat ;
    background-size: cover;
}

.layer.layer0::before {
    content: "";
    top: 0;
    left: 0;
    width: 100%;
    height: 40vh;
    display: block;
    background: rgb(0,0,0);
    background: -moz-linear-gradient(180deg, rgba(0,0,0,1) 0%, rgba(0,0,0,0) 100%);
    background: -webkit-linear-gradient(180deg, rgba(0,0,0,1) 0%, rgba(0,0,0,0) 100%);
    background: linear-gradient(180deg, rgba(0,0,0,1) 0%, rgba(0,0,0,0) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#000000",endColorstr="#000000",GradientType=1);
    position: absolute;
}
.layer.layer0::after {
    content: "";
    bottom: 0;
    left: 0;
    width: 100%;
    height: 40vh;
    display: block;
    background: rgb(0,0,0);
    background: -moz-linear-gradient(0deg, rgba(0,0,0,1) 0%, rgba(0,0,0,0) 100%);
    background: -webkit-linear-gradient(0deg, rgba(0,0,0,1) 0%, rgba(0,0,0,0) 100%);
    background: linear-gradient(0deg, rgba(0,0,0,1) 0%, rgba(0,0,0,0) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#000000",endColorstr="#000000",GradientType=1);
    position: absolute;
}

@media(max-width: 479px) {
    
    .frame-countdown {
        transform: translateY(-50vh);
        margin-bottom: -50vh;
    }

    .layer.layer0::before, .layer.layer0::after { display: none; }
    
}



.frame-countdown .bg  .layer1{
    z-index: 1;
    background-image: url('../img/hexa3.svg');
    background-position: center center;
    background-repeat: no-repeat ;
    background-size: cover;
}


.frame-countdown .bg  .layer2{
    z-index: 2;
}
.frame-countdown .bg  .layer2 svg {
    position: absolute;
    top: 50%;
    width: 120%;
    left: calc(50% - 15vw);
    height: auto;
    transform: translate(-50%,-52%);
}
.frame-countdown .bg  .layer3{
    z-index: 3;
}
.frame-countdown .bg  .layer3 svg {
    position: absolute;
    top: 50%;
    width: 120%;
    left: calc(50% - 15vw);
    height: auto;
    transform: translate(-50%,-52%);
}


.countdown { margin-top: 50vh; margin-bottom: 50vh; position:relative; transform: translateX(-15vw); height:1px; padding: 40% 0;  }
.countheadline { margin-top: 50vh; width:60%; right:0; position:absolute; padding-top: 10%; }

.countdown * {
  cursor: default;
}

.countdown::after {
  position: absolute;
  display: block;
  content: attr(data-label);
  width: 50px;
  height: 50px;
  right: 100px;
  top: 50%;
  font-size: 22px;
  font-weight: bold;
  transform: translateY(-50%);
  text-transform: uppercase;
}

@media(max-width: 991px){
    .countdown::after {
        right: 10px;
    }
}

.countdown .days {
  width: 60%;
  position: relative;
  overflow: hidden;
  height:0.1px;
  padding-bottom:36%;
  margin:0 auto;
}

.countdown .days .canvas {
  width: 100%;
  height:100%;
  position: absolute;
  overflow: hidden;
  top:0;
  left:0;
  display: flex;
  flex-direction: row;
}

.countdown .number-grp {
  width: 50%;
  position: relative;
}


.countdown .number-grp-wrp {
  width: 100%;
  position: relative;
}

.countdown .x10 > .number-grp-wrp {
  width: 100%;
  position: relative;
  height: 600%;
  top:-600%;
}
.countdown .x10 > .number-grp-wrp .num {
  height: calc(100% / 6);
}

.countdown .x1 > .number-grp-wrp {
  width: 100%;
  position: relative;
  height: 6700%;
  top:-6700%;
}
.countdown .x1 > .number-grp-wrp .num {
  height: calc(100% / 67);
}

.countdown .num {
  width: 100%;
  position: relative;
  display: table;
}
.countdown .num p {
    width: 100%;
    display: table-cell;
    font-size: 90px;
    line-height: 1px;
    font-weight: bold;
    height: 100%;
    vertical-align: middle;
    text-align: center;
}

.countdown .top {
  text-align: center;
  margin-bottom: 10px;
}

.countdown .top div:last-child {
  font-size: 45px;
  line-height: 50px;
}

.countdown .bottom {
  text-align: center;
  margin-top: 30px;
}

.countdown .bottom div:first-child {
  font-size: 40px;
  line-height: 45px;
}

.countdown .bottom div:last-child {
  line-height: 26px;
  padding-top: 10px;
}


.countdown .bottom {
  padding-bottom: 10px;
}

@media ( min-width: 992px) and (max-width: 1199px) {

    .countheadline {
        margin-top: 38vh;
        width: 60%;
        left: 0;
        position: absolute;
        padding-top: 0;
    }
    
}

@media ( min-width: 768px) and (max-width: 991px) {

    .countheadline {
        margin-top: 38vh;
        width: 90%;
        left: 0;
        position: absolute;
        padding-top: 0;
        transform: translateX(-15%);
    }
    
}

@media ( min-width: 479px) and (max-width: 768px) {

    .countheadline {
        margin-top: 45vh;
        width: 100%;
        left: 0;
        position: absolute;
        padding-top: 0;
    }
    
    .countheadline h2 {
        font-size: calc(32px + 20 * ((100vw - 289px) / 479)); 
        line-height: calc(34px + 22 * ((100vw - 289px) / 479)); 
    }
    
    
}

@media ( min-width: 300px) and (max-width: 478px) {

    .countheadline {
        margin-top: 35vh;
        width: 100%;
        left: 0;
        position: absolute;
        padding-top: 0;
    }
    
    .countheadline h2 {
        font-size: calc(20px + 8 * ((100vw - 178px) / 300)); 
        line-height: calc(22px + 10 * ((100vw - 178px) / 300)); 
    }
    
    
}


@media ( min-width: 300px) and (max-width: 399px) {

    .frame-countdown .bg  .layer2 svg {
        width: 350%;
        left: 50%;
        transform: translate(-50%,-52%);
    }
    
    .frame-countdown .bg  .layer3 svg {
        width: 350%;
        left: 50%;
        transform: translate(-50%,-52%);
    }
    
    .countdown {
        transform: none;
    }
        
    .countdown .top div:last-child {
      font-size: 35px;
      line-height: 39px;
    }
    
    .countdown .bottom div:first-child {
      font-size: 31px;
      line-height: 36px;
    }    

}


@media ( min-width: 400px) and (max-width: 479px) {

    .frame-countdown .bg  .layer2 svg {
        width: 300%;
        left: 50%;
        transform: translate(-50%,-52%);
    }
    
    .frame-countdown .bg  .layer3 svg {
        width: 300%;
        left: 50%;
        transform: translate(-50%,-52%);
    }
    
    .countdown {
        transform: none;
    }
    
    .countdown .top div:last-child {
      font-size: 35px;
      line-height: 39px;
    }
    
    .countdown .bottom div:first-child {
      font-size: 31px;
      line-height: 36px;
    }    
    
}


@media ( min-width: 480px) and (max-width: 569px) {

    .frame-countdown .bg  .layer2 svg {
        width: 300%;
        left: calc(50% - 15vw);
        transform: translate(-50%,-52%);
    }
    
    .frame-countdown .bg  .layer3 svg {
        width: 300%;
        left: calc(50% - 15vw);
        transform: translate(-50%,-52%);
    }
    
    .countdown .top div:last-child {
      font-size: 35px;
      line-height: 39px;
    }
    
    .countdown .bottom div:first-child {
      font-size: 31px;
      line-height: 36px;
    }    

}


@media ( min-width: 570px) and (max-width: 659px) {

    .frame-countdown .bg  .layer2 svg {
        width: 270%;
        left: calc(50% - 15vw);
        transform: translate(-50%,-52%);
    }
    
    .frame-countdown .bg  .layer3 svg {
        width: 270%;
        left: calc(50% - 15vw);
        transform: translate(-50%,-52%);
    }

}


@media ( min-width: 660px) and (max-width: 767px) {

    .frame-countdown .bg  .layer2 svg {
        width: 240%;
        left: calc(50% - 15vw);
        transform: translate(-50%,-52%);
    }
    
    .frame-countdown .bg  .layer3 svg {
        width: 240%;
        left: calc(50% - 15vw);
        transform: translate(-50%,-52%);
    }

}


@media ( min-width: 768px) and (max-width: 839px) {

    .frame-countdown .bg  .layer2 svg {
        width: 240%;
        left: calc(50% - 15vw);
        transform: translate(-50%,-52%);
    }
    
    .frame-countdown .bg  .layer3 svg {
        width: 240%;
        left: calc(50% - 15vw);
        transform: translate(-50%,-52%);
    }

}


@media ( min-width: 840px) and (max-width: 991px) {

    .frame-countdown .bg  .layer2 svg {
        width: 210%;
        left: calc(50% - 15vw);
        transform: translate(-50%,-52%);
    }
    
    .frame-countdown .bg  .layer3 svg {
        width: 210%;
        left: calc(50% - 15vw);
        transform: translate(-50%,-52%);
    }

}


@media ( min-width: 992px) and (max-width: 1399px) {

    .frame-countdown .bg  .layer2 svg {
        width: 160%;
        left: calc(50% - 15vw);
        transform: translate(-50%,-52%);
    }
    
    .frame-countdown .bg  .layer3 svg {
        width: 160%;
        left: calc(50% - 15vw);
        transform: translate(-50%,-52%);
    }

}

@media ( min-width: 1400px) and (max-width: 1720px) {

    .frame-countdown .bg  .layer2 svg {
        width: 140%;
        left: calc(50% - 15vw);
        transform: translate(-50%,-52%);
    }
    
    .frame-countdown .bg  .layer3 svg {
        width: 140%;
        left: calc(50% - 15vw);
        transform: translate(-50%,-52%);
    }

}


@media ( max-width: 1199px )  {
    .countdown .num p { font-size:280px; }
}
@media ( max-width: 991px )  {
    .countdown .num p { font-size:210px; }
}
@media ( max-width: 767px )  {
    .countdown .num p { font-size:174px; }
}
@media ( max-width: 479px )  {
    .countdown .num p { font-size: calc(100px + 74 * ((100vw - 300px) / 179)); }
}

@media ( min-width: 1200px )  {
    .countdown .num p { font-size:311px; }
}


/* Powermail */

@media(max-width: 767px){
    .tx-powermail .container-fluid {
      padding: 0;
    }
    
    .tx-powermail .powermail_fieldwrap {
      padding: 0;
    }
}



@media(max-width: 767px){
    .contactheight{
        padding: 0;
        margin-bottom: 60px;
    }
}


.row.perspective {
    perspective: 5000px;
}

.contactheight.prepMoveIn {
    position:relative;
    transform: translate3d(0px, 50%, 0px) rotateX(-45deg) rotateY(30deg);
    transform-origin: center center;
}
.contactheight.invert.prepMoveIn {
    transform: translate3d(0px, 50%, 0px) rotateX(-45deg) rotateY(-30deg);
}

.contactheight.prepMoveIn.MoveIn { 
    transform: translate3d(0px, 0px, 0px) rotateX(0deg) rotateY(0deg);
    transition:1s transform ease-in-out;
}


header.page-header .bgimage video {
    position: relative;
    top: 70px;
    left: 0;
    display: block;
    width: 100vw;
    height: auto;
    /*transform: scale(1.5);*/
    transform-origin: top center;
}

@media( min-width: 768px){
    
    header.page-header .bgimage video {
      position: absolute;
      top: 0;
      left: 0;
      display: block;
      width: 100%;
      height: 100%;
      -o-object-fit: cover;
         object-fit: cover;
      transform: none;
    }
}

.mm-wrapper {
 overflow: hidden;
}

.fadeTopIn { position: relative; }

.fadeTopIn::before {
    content: "";
    width: 100%;
    top: 0;
    left: 0;
    position: absolute;
    height: 15vh;
    background: rgb(0,0,0);
    background: -webkit-gradient(linear, 0 0, 100% 180, from(rgba(0,0,0,1)), to(rgba(0,0,0,0)));
    background: -webkit-linear-gradient(rgba(0,0,0,1) 0%, rgba(0,0,0,0) 100%);
    background: -moz-linear-gradient(rgba(0,0,0,1) 0%, rgba(0,0,0,0) 100%);
    background: -o-linear-gradient(rgba(0,0,0,1) 0%, rgba(0,0,0,0) 100%);
    background: linear-gradient(rgba(0,0,0,1) 0%, rgba(0,0,0,0) 100%);
}


/* IE10+ specific styles go here */  

/* except IE */
body:not(.IE) picture > img:not(:first-of-type) { display: none !important;}
/* IE */
@media ( max-width: 479px )  {
    
    body.IE picture > img:not(:first-of-type) { display: none !important;}
    body.IE .mm-slideout { overflow: hidden; }

}
@media ( min-width: 480px ) and ( max-width: 991px )  {
    body.IE picture > img:not(:last-of-type) { display: none !important;}
}
@media ( min-width: 992px )  {
    body.IE picture > img:first-of-type { display: none !important;}
    body.IE picture > img:last-of-type { display: none !important;}
}



@media screen and (orientation: landscape) and (max-height: 479px)   {
    
  /*html {*/
  /*  transform: rotate(-90deg);*/
  /*  transform-origin: left top;*/
  /*  width: 100vh;*/
  /*  overflow-x: hidden;*/
  /*  position: absolute;*/
  /*  top: 100%;*/
  /*  left: 0;*/
  /*  min-height: 100vw;*/
  /*}*/
  
  /*  body, body.neopage {*/
  /*    min-height: 100vw;*/
  /*    max-height: 100vw;*/
  /*  }*/
  /*  .mm-page, .page, .main-container {*/
  /*    min-height: 100vw !important;*/
  /*  }*/
  /*  #decorcanvas canvas {*/
  /*      height: calc(100vw - 70px) !important;*/
  /*  }*/
    
  /*  body .sticky-header {*/
  /*      position:absolute;*/
  /*      top:100px;*/
  /*  }*/
    
        #decorselector {
          height: 100%;
          width: 320px;
          background: #1d1d1d;
          position: absolute;
          top: 0;
          right: 0;
        }
        #decorcanvas {
          /*position: relative;*/
          height: 100%;
          width: calc(100% - 320px);
          overflow-y: auto;
          background-color: #333333;
        }

}

/*.image-accordion {*/
/*  font-size: 0;*/
/*  height: 100%;*/
/*  width:100%;*/
/*  position: relative;*/
/*}*/

/*.ia-slide {*/
/*  font-size: 1rem;*/
/*  display: inline-block;*/
/*  vertical-align: top;*/
/*  height: 100%;*/
/*  box-sizing: border-box;*/
/*  position: relative;*/
/*  outline: none;*/
/*  background-size: cover;*/
/*  background-position: center;*/
/*  background-repeat: no-repeat;*/
/*}*/




#darkbox {
  border: 24px solid #000 !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  background-color: #000000 !important;
}

#darkbox #darkbox_stats {
  font: 18px/1.4 "Montserrat", sans-serif;
}

#darkbox_close::after {
  font-size: 70px;
  line-height: 40px;
}


#darkbox_description {
  position: absolute;
  bottom: 24px;
  right: 50%;
  transform: translateX(50%);
  text-align: left;
  text-shadow: 0 1px 1px #000;
  background: rgba(0,0,0,0.75);
  padding: 15px;
  border: 1px solid rgba(255,255,255,0.5);
}


/* Smartphone Landscape */
@media only screen and (min-device-width: 300px) and (max-device-width: 991px) and (orientation: landscape) {

  #darkbox_description {
    bottom: 12px;
    left: 5%;
    transform: none;
    right: auto;
    font-size: 12px;
  }

}


.btn-anfrage {
  float:right;
  margin-right:30px;
  border-radius: 16px;
  background-color: #ffc400;
  color: #000000;
  font-size:14px;
  font-weight:500;
  text-transform: uppercase;
  position:relative;
  margin-top:15px;
  transition: 0.25s color ease-in-out;
}

.powermail_fieldwrap_type_submit .btn-primary {
  float:right;
  border-radius: 16px;
  background-color: #ffc400;
  color: #000000 !important;
  font-size:14px;
  font-weight:500;
  text-transform: uppercase;
  transition: 0.25s color ease-in-out; 
  margin-top: 30px;
  margin-bottom:15px;
  border:0 !important;
}
.powermail_fieldwrap_type_submit .btn-primary:hover,
.btn-anfrage:hover {
  background-color: #ffa000;
  color: #000000;
  transition: 0.25s color ease-in-out;
}

.powermail_fieldwrap_type_submit .btn-primary:focus,
.btn-anfrage:focus {
  outline: 0;
  box-shadow:none !important;
}



#frmModal .modal-content {
  background-color: #212121;
  border: none;
  border-radius: 0;
  outline: 0;
  box-shadow: 0 0 1px 1px rgba(255,255,255,0.5)
}

#frmModal .modal-header {
  border: none;
  padding: 1rem 2rem
}

#frmModal .modal-header h5 {
  text-transform: uppercase;
}
#frmModal .btn-close {
  background: transparent url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23fff'%3e%3cpath d='M.293.293a1 1 0 011.414 0L8 6.586 14.293.293a1 1 0 111.414 1.414L9.414 8l6.293 6.293a1 1 0 01-1.414 1.414L8 9.414l-6.293 6.293a1 1 0 01-1.414-1.414L6.586 8 .293 1.707a1 1 0 010-1.414z'/%3e%3c/svg%3e") center/1em auto no-repeat;
}

#frmModal .modal-content * {
  color: #ffffff;
}

#frmModal .powermail_fieldwrap label { 
   font-size: 13px;
   color: #aaaaaa;
   text-transform: uppercase;
}

#frmModal p.datenschutz {
   font-size: 13px;
   color: #aaaaaa;

}

#frmModal .form-control,
#frmModal .form-control:focus {
  border-radius: 0 !important;
  margin-bottom:15px;
  color: #212121 !important;
  box-shadow: none;
}

#frmModal tx-powermail .powermail_fieldset .powermail_field_error,
#frmModal .tx-powermail .powermail_fieldset .parsley-error,
#frmModal .tx-powermail .powermail_fieldset .powermail_form .parsley-error:focus,
#frmModal .tx-powermail .powermail_fieldset div.error {
  background-color: #ffffff;
  color: #212121 !important;
  border-color: #ff0000;
}

#frmModal .parsley-errors-list { 
  background: transparent;
  border: 0 !important;
  margin: -15px 0 0;
}

#frmModal .parsley-errors-list li { 
  margin-bottom:2px; 
  color: #ff0000;
  font-size: 13px;
  line-height: 15px;
  padding: 2px 0;
}

#frmModal .powermail_create {
 padding: 0 15px;
}