/*
    BASIC CSS
*/

/* raleway-300 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Raleway';
  font-style: normal;
  font-weight: 300;
  src: url('../fonts/raleway-v37-latin-300.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('../fonts/raleway-v37-latin-300.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}

/* raleway-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Raleway';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/raleway-v37-latin-regular.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('../fonts/raleway-v37-latin-regular.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}

/* raleway-600 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Raleway';
  font-style: normal;
  font-weight: 600;
  src: url('../fonts/raleway-v37-latin-600.woff2') format('woff2'), /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
       url('../fonts/raleway-v37-latin-600.ttf') format('truetype'); /* Chrome 4+, Firefox 3.5+, IE 9+, Safari 3.1+, iOS 4.2+, Android Browser 2.2+ */
}

/* resets */
html{font-size:100%;}
body{padding:0;margin:0;font-family: 'Raleway',Arial, Helvetica, sans-serif;font-size: 1.1rem;overflow-x: hidden;width:100%}
ul,ol,li,p,h1,h2,h3,h4,h5,h6{margin:0;padding:0;}
ul{list-style-type:none;}
figure{margin:0;}
p{line-height:1.4em;}
a, img{outline:none;}
a:link,
a:active,
a:visited,
a:focus,
a:hover{text-decoration:none;}

/* defaults */
.floatLeft{float:left;}
.floatRight{float:right;}
.clearer:after{content: "";display: table;clear: both;}
.stageFrame{width:94%;max-width:1300px;margin:0 auto;padding:0 3%;}
figcaption{text-align:center;font-size: 0.9rem;}

/*
    HEADER
*/

header{padding:35px 0;}
.headerWrapper{position: relative;}
.logo{line-height: 0;}
.logo img{width:250px;height:auto}

.mobileMenue a {text-decoration: none;color: #FFF;opacity:1;font-size: 1.5em;transition: 200ms;font-weight: 300;font-family: "Roboto regular",Arial,sans-serif;}
.mobileMenue a:hover {color:#ffb700;}
.mobileMenue nav {height: auto;}
.mobileMenue #menuToggle {position: relative;top: 20px;right: 3%;z-index: 999999999;-webkit-user-select: none;user-select: none;position: absolute;font-size: 26px;}
.mobileMenue #menuToggle input{display: flex;width: 160px;height: 32px;position: absolute;cursor: pointer;opacity: 0;z-index: 2;}
.mobileMenue #menuToggle span {display: inline-block;width: 20px;height: 20px;margin-right: 4px;position: relative;border-radius: 15px;z-index: 1;transform-origin: 5px 0px;transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0), background 0.5s cubic-bezier(0.77,0.2,0.05,1.0), opacity 0.55s ease;}
.mobileMenue #menuToggle span:nth-child(2){background: #8f8f8f;}
.mobileMenue #menuToggle span:nth-child(3){background: #696969;}
.mobileMenue #menuToggle span:nth-child(4){background: #008899;}
.mobileMenue #menuToggle span:first-child{transform-origin: 0% 0%;}
.mobileMenue #menuToggle em{font-style:normal;}
.mobileMenue #menuToggle span:nth-last-child(2){transform-origin: 0% 100%;}
.mobileMenue #menuToggle input:checked ~ span{opacity: 1;transform: rotate(45deg) translate(0, -1px);background: #FFF;display: flex;width: 29px;height: 2px;margin-bottom: 5px;position: relative;background: #ffffff;border-radius: 3px;z-index: 1;transform-origin: 5px 0px;transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0),opacity 0.55s ease;}
.mobileMenue #menuToggle input:checked ~ em{display:none;}
.mobileMenue #menuToggle input:checked ~ span:nth-last-child(4){opacity: 0;transform: rotate(90deg) scale(0.2, 0.2);}
.mobileMenue #menuToggle input:checked ~ span:nth-last-child(3){transform: rotate(-45deg) translate(0, -1px);}
.mobileMenue #menu{position: absolute;width: 180px;height: 235px;border:7px solid #fff;margin: -45px 0 0 -195px;padding:25px 30px 60px 29px;background-color: rgba(0,136,153,0.95);-webkit-font-smoothing: antialiased;transform-origin: 0% 0%;transform: translate(1000%, 0);transition: transform 0.5s cubic-bezier(0.77,0.2,0.05,1.0);border-radius: 50px;}
.mobileMenue #menu li{padding: 7px 0;transition-delay: 2s;}
.mobileMenue #menu li a{font-size: 1.5rem;}
.mobileMenue #menuToggle input:checked ~ ul{transform: none;}

@media only screen and (max-width : 1250px) {

    .mobileMenue #menu li a {font-size: 1.2rem;}
    .mobileMenue #menu li {padding: 2px 0;}
    .mobileMenue #menu {padding: 25px 30px 6px 29px;right: 3%;}
    .mobileMenue #menuToggle input:checked ~ span {margin-right: 32px;}
  
}

@media only screen and (max-width : 970px) {

    .logo img {width: 200px;}
    .mobileMenue #menuToggle{top: 14px;font-size: 21px;}
    .mobileMenue #menuToggle span {width: 15px;height: 15px;}
    .mobileMenue #menu li {padding: 5px 0;}
  
}

@media only screen and (max-width : 970px) {

    .mobileMenue #menu {width: 140px;}

}

@media only screen and (max-width : 530px) {

    .logo img {width: 150px;}
    .mobileMenue #menuToggle {top: 9px;}
  
}

/*
    SHOWCASE AREA
*/

.showcaseArea{position: relative;}
.showcaseArea img{width:100%;height:auto;z-index: 5;}
.showcaseArea figure.image{line-height:0;}
.showcaseAreaText{position: absolute;left: 0;bottom:80px;z-index: 100;left: 50%;transform: translate(-50%, -50%);}
.showcaseAreaText header{padding:0;}
.showcaseAreaText h1{color:#fff;margin-bottom:5px;font-size: 3.8rem;}
.showcaseAreaText h2{color:#fff;margin-bottom:0;font-weight: normal;}

@media only screen and (max-width : 1260px) {

    .showcaseAreaText h1 {font-size: 2.8rem;}
  
}

@media only screen and (max-width : 1150px) {

    .showcaseAreaText {bottom: 40px;}
  
}

@media only screen and (max-width : 970px) {

    .showcaseAreaText h1 {font-size: 2rem;}
    .showcaseAreaText h2 {font-size: 1.3rem;}
  
}

@media only screen and (max-width : 660px) {

    .showcaseAreaText h1 {font-size: 1.5rem;}
    .showcaseAreaText h2 {font-size: 1rem;}
  
}

@media only screen and (max-width : 570px) {

    .showcaseAreaText {bottom: 25px;}
  
}

@media only screen and (max-width : 470px) {

    .showcaseAreaText {bottom: 5px;}
  
}

@media only screen and (max-width : 430px) {

    .showcaseAreaText {bottom: -5px;}
    .showcaseAreaText h1 {font-size: 1.2rem;}
    .showcaseAreaText h2 {font-size: 0.9rem;}
  
}

/*
    QUICKJUMP AREA
*/

.quickjumpArea {margin-bottom:30px;}
.quickjumpArea .ce-column{float: right;width: 17.5%;text-align: center;margin: -155px 15px 0 15px;z-index: 200;position: relative;font-weight: bold;}
body.uid-1 .quickjumpArea .ce-column,
body.uid-4 .quickjumpArea .ce-column,
body.uid-5 .quickjumpArea .ce-column,
body.uid-6 .quickjumpArea .ce-column,
body.uid-7 .quickjumpArea .ce-column{width: 10.5%;margin: -55px 15px 0 15px;}
.quickjumpArea .ce-column img{width:100%;height:auto;display: block;transition: transform 0.3s ease;}
.quickjumpArea .ce-column img:hover {transform: scale(1.05);}

@media only screen and (max-width : 1260px) {

    .quickjumpArea figcaption {font-size: 1rem;}
  
}

@media only screen and (max-width : 1150px) {

    .quickjumpArea .ce-column {width: 11.5%;}
  
}

@media only screen and (max-width : 1050px) {

    .quickjumpArea figcaption {font-size: 0.9rem;}
    .quickjumpArea .ce-column {margin: -35px 15px 0 15px;}
  
}

@media only screen and (max-width : 840px) {

     .quickjumpArea figcaption {font-size: 0.8rem;}
     .quickjumpArea .ce-column {width: 10.5%;}
  
}

@media only screen and (max-width : 790px) {

     .quickjumpArea .ce-column {width: calc(16.66% - 30px);}
  
}

@media only screen and (max-width : 710px) {

    .quickjumpArea figcaption {font-size: 0.6rem;}
  
}

@media only screen and (max-width : 570px) {

    .quickjumpArea .ce-column {width: calc(16.66% - 15px);}
    .quickjumpArea .ce-column {margin: -35px 7.5px 0 7.5px;}
  
}

@media only screen and (max-width : 470px) {

    .quickjumpArea .ce-column {width: calc(33.33% - 15px);margin: -0 7.5px 20px 7.5px;}
    .quickjumpArea figcaption {font-size: 0.7rem;}
    .quickjumpArea {margin-top: 30px;}
  
}

/*
    CTA-Element
*/

.ctaElement{background:#008899;color:#fff;margin:30px 0;}
.ctaElementWrapper{position:relative;padding: 20px 0;background: url(../images/bgr_footer.jpg) no-repeat;background-size: 155px auto;background-position: bottom left 70%;}
.ctaElement a,
.ctaElement a:link,
.ctaElement a:visited,
.ctaElement a:focus,
.ctaElement a:active{display:block;right:0;position: absolute;top:25px;border-radius: 10px;background:#ffb700 url(../images/rocket.png) no-repeat left center;color:#008899;font-weight:bold;padding: 5px 40px 5px 65px;background-size: 25px auto;background-position: center left 32px;transition: background 0.3s ease;}
.ctaElement a:hover{display:block;right:0;position: absolute;top:25px;border-radius: 10px;background:#fff url(../images/rocket.png) no-repeat left center;color:#008899;font-weight:bold;padding: 5px 40px 5px 65px;background-size: 25px auto;background-position: center left 32px;}
.ctaElement strong{text-transform: uppercase;font-size: 1.4rem;}

@media only screen and (max-width : 750px) {

    .ctaElement a, 
    .ctaElement a:link, 
    .ctaElement a:visited, 
    .ctaElement a:focus, 
    .ctaElement a:active,
    .ctaElement a:hover {right: 0;position: relative;top: 0;margin-top: 8px;width: 120px;}
  
}


/*
    CONTENT ENTRY BLOCK
*/

.contentEntryblock{padding:30px 0;background:#ebe8de url(../images/bgr_entry.png) no-repeat;background-size: 505px auto;background-position: bottom left -10%;}
.contentEntryblock .contentEntryblockLeft{width:47%;margin-right:3%;}
.contentEntryblock .contentEntryblockLeft h2{margin-bottom:20px;font-weight: normal;line-height:1.3em;}
.contentEntryblock .contentEntryblockLeft p{margin-bottom:20px;}
.contentEntryblock .contentEntryblockRight{width:47%;margin-left:3%;}
.contentEntryblock .contentEntryblockRight img{width:100%;height:auto;}
.contentEntryblock a:link,
.contentEntryblock a:visited,
.contentEntryblock a:focus,
.contentEntryblock a:active{color:#ffb700;}
.contentEntryblock a:hover{color:#000;}

@media only screen and (max-width : 900px) {

    .contentEntryblock .contentEntryblockLeft{width:100%;margin-right:0;background:#ebe8de url(../images/bgr_entry.png) no-repeat;background-size: 505px auto;background-position: bottom left -10%;}
    .contentEntryblock .contentEntryblockRight{width:100%;margin-left:0;}
    .contentEntryblock{padding:30px 0;background:#ebe8de}
  
}

/*
    TESTIMONIAL BLOCK
*/

.testimonialElement {background:#ebe8de;padding:30px 0;}
.testimonialElementWrapper .frame-type-textpic {float:left;width:27.33%;text-align: center;background:#fff;border-radius:15px;margin-right:3%;padding:2%;}
.testimonialElementWrapper .frame-type-textpic .ce-bodytext p:first-child{height:120px;}
.testimonialElementWrapper .frame-type-textpic strong{display:block;border-top:1px solid #008899;color:#008899;padding: 15px;margin: 15px auto 0 auto;width: 220px;}
.testimonialElementWrapper .frame-type-textpic:last-child {margin-right:0;}
.testimonialElementWrapper .frame-type-textpic img{width:auto;height:45px;margin:25px 15px 15px 15px;}

@media only screen and (max-width : 950px) {

    .testimonialElementWrapper .frame-type-textpic {float: none;width: 96%;margin-right: 0;padding: 2%;margin-bottom: 30px;}
    .testimonialElementWrapper .frame-type-textpic .ce-bodytext p:first-child {height: auto;}
  
}

/*
    GALLERY BLOCK
*/

.galleryElementWrapper .frame-layout-0:after{content: "";display: table;clear: both;}
.galleryElementWrapper .frame-layout-0 .ce-column{width:31.33%;margin-right:3%;text-align: center;float:left;}
.galleryElementWrapper .frame-layout-0 .ce-column img{width: 100%;height:auto}
.galleryElementWrapper .frame-layout-0 .ce-column:last-child{margin-right:0;}
.galleryElementWrapper .frame-layout-0 .ce-column figcaption {margin-bottom: 20px;}

.galleryElementWrapper{margin:60px 0;text-align: center;}
.galleryElementWrapper .frame-layout-1 .ce-column{display:inline-block}
.galleryElementWrapper .frame-layout-1 .ce-column img{height:30px;width:auto;margin:0 25px;}

@media only screen and (max-width : 800px) {

    .galleryElementWrapper .frame-layout-1 .ce-column img{height:20px;width:auto;margin:0 15px;}
  
}

@media only screen and (max-width : 660px) {

    .galleryElementWrapper .frame-layout-0 .ce-column{width:100%;margin-right:0;float:none;margin-bottom:30px;}
    .galleryElementWrapper .frame-layout-0 .ce-column:last-child{margin-bottom:0;}
      
}

@media only screen and (max-width : 490px) {

    .galleryElementWrapper .frame-layout-1 .ce-column{display:block;margin:15px 25px;}
      
}

/*
    BOTTOM CONTENT BLOCK
*/

.contentBottomblock{background:#ebe8de;padding:30px 0;}
.contentBottomblock h2{margin-bottom: 20px;font-weight: normal;line-height: 1.3em;}
.contentBottomblock .contentBottomblockLeft{width:47%;margin-right:3%;}
.contentBottomblock .contentBottomblockLeft p:hover{color:#ffb700;cursor:pointer}
.contentBottomblock .contentBottomblockRight{width:47%;margin-left:3%;}
.contentBottomblock .contentBottomblockRight p{margin-bottom:20px;}
.contentBottomblockLeft p.active {color: #ffb700;}
.contentBottomblockRight > .frame {display: none;}
.contentBottomblockRight > .frame:first-child {display: block;}

@media only screen and (max-width : 900px) {

    .contentBottomblock .contentBottomblockLeft{width:100%;margin:0 0 30px 0;}
    .contentBottomblock .contentBottomblockRight{width:100%;margin-left:0%;}
      
}

/*
    FOOTER COLUMNS
*/

footer{background:#008899;color:#fff;padding:30px 0 0 0;}
.footerWrapper{background:url(../images/bgr_footer.jpg) no-repeat;background-size: 205px auto;background-position: bottom left 30%;padding-bottom:15px;}
footer .footerInnerCol1,
footer .footerInnerCol3{width:33.33%;}
footer .footerInnerCol2{width:28.33%;padding:0 5% 0 0;}
footer h3{text-transform: uppercase;font-size:1.4rem;color:#ffb700;margin-bottom:15px;}
footer p{margin-bottom:15px;}
footer a:link,
footer a:active,
footer a:visited,
footer a:focus{color:#ffb700;}
footer a:hover{color:#fff;}

@media only screen and (max-width : 970px) {

    footer .footerInnerCol1,
    footer .footerInnerCol2,
    footer .footerInnerCol3{width:100%;padding:0 0 20px 0;}
    .footerWrapper {
        background: url(../images/bgr_footer.jpg) no-repeat;
        background-size: 60% auto;
        background-position: bottom right 20%;}

}

/*
    FOOTER BOTTOM LINE
*/

.footerBottomLine{background:#ebe8de;padding:20px 0;}
.footerBottomLineLeft{font-size:1.2rem;color:#696969;font-weight:bold;}
.footerBottomLineRight{text-align: right;}
.footerBottomLineRight ul li{display:inline-block;border-right:1px solid #696969;padding:0 10px;}
.footerBottomLineRight ul li:last-child{border-right:none;padding-right:0;}
.footerBottomLineRight a:link,
.footerBottomLineRight a:active,
.footerBottomLineRight a:visited,
.footerBottomLineRight a:focus{color:#696969;}
.footerBottomLineRight a:hover{color:#ffb700;}

@media only screen and (max-width : 970px) {

    .footerBottomLineLeft{line-height:1.3em;margin-bottom:10px;}
    .footerBottomLineLeft,
    .footerBottomLineRight{float:none;text-align: left;}
    .footerBottomLineRight ul li:first-child{padding-left:0;}

}

@media only screen and (max-width : 660px) {

    .footerBottomLineLeft {font-size: 1rem;}
    .footerBottomLineRight a{font-size: 0.9rem;}

}

@media only screen and (max-width : 430px) {

    .footerBottomLineLeft {font-size: 0.9rem;}

}

/*
    PAGE SPECIFIC CSS
*/

/* TEXTILIEN */
body.uid-13 .testimonialElement{display:none;}

/* STICKEREIEN */
body.uid-12 .testimonialElement{display:none;}

/* SIEBDRUCK */
body.uid-11 .testimonialElement{display:none;}

/* TRANSFERDRUCK */
body.uid-10 .testimonialElement{display:none;}

/* MOBILE STICKEREI */
body.uid-9 .testimonialElement{display:none;}
body.uid-9 .galleryElement{display:none;}

/* AIRBURSH */
body.uid-8 .testimonialElement{display:none;}
body.uid-8 .galleryElement{display:none;}
body.uid-8 .contentBottomblock{display:none;}