
html, body{overflow-x:hidden}
body{
    float:left;
    width:100%;
    font-family: 'PT Sans', sans-serif;
    letter-spacing:0;
    position:relative;
}
h1, h2, h3, h4, h5, h6{
    color: #141b20;
    font-family:Montserrat;
}
p{
    color:#3e3e3e;
    font-family: 'PT Sans', sans-serif;
    font-size:16px;
    letter-spacing:0;
    line-height:30px;
}

.footersmall {
    color:#3e3e3e;
    font-family: 'PT Sans', sans-serif;
    font-size:14px;
    letter-spacing:0;
    line-height:25px;
}

.footersmall a, a:hover,
a:focus{
	text-decoration: underline;
    outline:none;
}
	
ul li,
ol li{
    font-family: 'PT Sans', sans-serif;
    color:#3e3e3e;
}
a:hover,
a:focus{
    text-decoration:none;
    outline:none;
}
.theme-layout{
    float:left;
    overflow:hidden;
    position:relative;
    width:100%;
}
.theme-layout.boxed{
    background:none repeat scroll 0 0 #FFFFFF;
    float:none;
    margin:0 auto;
    overflow:hidden;
    position:relative;
    z-index:1;
    width:1230px;
    -webkit-box-shadow:0 0 6px #747474;
    -moz-box-shadow:0 0 6px #747474;
    -ms-box-shadow:0 0 6px #747474;
    -o-box-shadow:0 0 6px #747474;
    box-shadow:0 0 6px #747474;
}
section{
    float:left;
    position:relative;
    width:100%;
}
.block{
    float:left;
    width:100%;
    padding:120px 0;
    position:relative;
}
.container{
    width:1170px;
    margin:0 auto;
}
.container:before,
.container:after{
    display:table;
    content:"";
}
.container:after{clear:both;}
.container .row,
.row{
    margin-left:-15px;
    margin-right:-15px;
    margin-bottom:0;
}
.row .col{padding:0 15px}
.block.less-spacing{padding:60px 0}
.block .container{padding:0}
.container{padding:0}
.block.remove-gap{padding-top:0}
.block.no-padding{padding:0}
.block.remove-bottom{padding-bottom:0}
.block.gray,.gray{background-color:#f7f7f8}
.block.dark{background:#141b20}

.remove-ext{
    float:left;
    width:100%;
    margin-bottom:-30px;
}
iframe{
    width:100%;
    border:0;
}
.parallax-container{
    height:100%;
    z-index:-2;
    width:100%;
    position:absolute;
    left:0;
    top:0;
}
.blackish:before, .whitish:before, .grayish:before{
    background:#1b1b1a none repeat scroll 0 0;
    content:"";
    height:100%;
    opacity:0.8;
    z-index:-1;
    position:absolute;
    left:0;
    top:0;
    width:100%;
}
.coloured:before{opacity:0.9}
.whitish:before{
    background-color:#FFFFFF;
    opacity:0.95;
}
.grayish:before{
    background-color:#fafafa;
    opacity:0.95;
}
iframe{
    border:0;
    width:100%;
    float:left;
}
a:hover,
a:focus{color:unset}
img{vertical-align:middle;border:0}
.dark-pattern {
    background: url(../images/resource/parallax1.jpg) repeat scroll 0 0 transparent;
}
.blur:after {
    background: -moz-linear-gradient(top, rgba(26,26,28,0) 0%, rgba(26,26,28,0) 1%, rgba(26,26,28,0.29) 20%, rgba(26,26,28,0.53) 41%, rgba(26,26,28,0.71) 57%, rgba(26,26,28,0.82) 74%, rgba(26,26,28,0.98) 97%, rgba(26,26,28,1) 100%);
    background: -webkit-linear-gradient(top, rgba(26,26,28,0) 0%,rgba(26,26,28,0) 1%,rgba(26,26,28,0.29) 20%,rgba(26,26,28,0.53) 41%,rgba(26,26,28,0.71) 57%,rgba(26,26,28,0.82) 74%,rgba(26,26,28,0.98) 97%,rgba(26,26,28,1) 100%);
    background: linear-gradient(to bottom, rgba(26,26,28,0) 0%,rgba(26,26,28,0) 1%,rgba(26,26,28,0.29) 20%,rgba(26,26,28,0.53) 41%,rgba(26,26,28,0.71) 57%,rgba(26,26,28,0.82) 74%,rgba(26,26,28,0.98) 97%,rgba(26,26,28,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#001a1a1c', endColorstr='#1a1a1c',GradientType=0 );
    content: "";
    width: 100%;
    height: 120px;
    position: absolute;
    top: -120px;
    left: 0;
}

/*----------------------------------------------------------------*/
/* 2 - Cross Browser Compatibility
/*----------------------------------------------------------------*/
.zeus .selected .tp-tab-title,
.zeus .tp-tab-title:before,
.down-arrow a,
.work-hover > a,
.work-hover:before,
.work-hover h5,
.work-hover span,
.option-isotop .option-set li a:before,
.masonary,
.option-isotop .option-set li a,
.member-info,
.member,
.member-socials,
.member-socials a,
.owl-dots .owl-dot,
.testimonials-carousel .owl-nav > div,
.sponsors-carousel a,
.categories > a,
.all-post,
.blog-post h3 a,
.input-field button:before,
.coloured-btn,
.simple-socials a,
.sponsors-carousel a img,
.categories.style2 a:before,
.coloured-btn:before,
.tags > a,
.share > a,
.post-pagi > strong a,
.post-pagi > span,
.related-carousel .owl-nav > div:before,
.load-more-comments a,
.portfolio-img > a,
.sidemenu li a:before,
.c-hamburger{
    -webkit-transition:all 0.25s linear;
    -moz-transition:all 0.25s linear;
    -ms-transition:all 0.25s linear;
    -o-transition:all 0.25s linear;
    transition:all 0.25s linear;
}
.creative-slider a,
.service > span,
.work-hover > a,
.member-socials > a,
.testimonial-info > img,
.share > a,
.portfolio-img > a,
.c-hamburger{
    -webkit-border-radius:50%;
    -moz-border-radius:50%;
    -ms-border-radius:50%;
    -o-border-radius:50%;
    border-radius:50%;
}
/*----------------------------------------------------------------*/
/* 3 - Logo
/*----------------------------------------------------------------*/
.logo {
    left: 0;
    padding: 64px 0 0 50px;
    position: absolute;
    top: 0;
    z-index: 1000;
}
/*----------------------------------------------------------------*/
/* 4 - Sidemenu
/*----------------------------------------------------------------*/
.sidemenu{
    background:#141b20;
    padding: 90px 0;
    position: fixed;
	right:-320px;
    top:0;
    z-index:1000;
    display:table;
    height:100%;
    /*width:320px;*/
	width:250px;
    -webkit-transition: all 600ms cubic-bezier(0.895, 0.030, 0.685, 0.220);
    -moz-transition: all 600ms cubic-bezier(0.895, 0.030, 0.685, 0.220);
    -o-transition: all 600ms cubic-bezier(0.895, 0.030, 0.685, 0.220);
    transition: all 600ms cubic-bezier(0.895, 0.030, 0.685, 0.220); /* easeInQuart */
    -webkit-transition-timing-function: cubic-bezier(0.895, 0.030, 0.685, 0.220);
    -moz-transition-timing-function: cubic-bezier(0.895, 0.030, 0.685, 0.220);
    -o-transition-timing-function: cubic-bezier(0.895, 0.030, 0.685, 0.220);
    transition-timing-function: cubic-bezier(0.895, 0.030, 0.685, 0.220); /* easeInQuart */
}
.sidemenu.slidein{right:0}

body section .block{
    -webkit-transition:all 0.5s linear;
    -moz-transition:all 0.5s linear;
    -ms-transition:all 0.5s linear;
    -o-transition:all 0.5s linear;
    transition:all 0.5s linear;
}
body.menu-opened section .block {
    -webkit-filter: grayscale(1);
    filter: grayscale(1);
    pointer-events:none;

}

.sidemenu-inner {
    float: left;
    max-height: 500px!important;
    position: absolute;
    width: 100%;
    left: 0;
    top: 50%;
    -webkit-transform:translateY(-50%);
    -moz-transform:translateY(-50%);
    -ms-transform:translateY(-50%);
    -o-transform:translateY(-50%);
    transform:translateY(-50%);
}
.sidemenu ul {
    list-style: outside none none;
    margin: 0;
    text-align: right;
    width: 100%;
}
.sidemenu ul li {
    float: left;
    width: 100%;
}
.sidemenu li a{
    color: #fff;
    float: left;
    font-family: 'Montserrat', sans-serif;
    font-size: 16px;
    padding: 15px 50px 15px;
    opacity:0.8;
    width: 100%;
    position:relative;
}
.sidemenu li.selected > a{opacity:1}
.sidemenu li a:before{
    content:"";
    position:absolute;
    right:0;
    top:50%;
    margin-top:-1px;
    height:2px;
    background:black;
    width:0;
}
.sidemenu li.selected > a:before,
.sidemenu li:hover > a:before{width:20px}
.sidemenu .simple-socials a{float:right}
.sidemenu .simple-socials {
    width: 100%;
    padding: 0 50px;
    text-align: center;
    position: absolute;
    bottom: 30px;
    left: 0;
}
/*----------------------------------------------------------------*/
/* 5 - Slides
/*----------------------------------------------------------------*/
.creative-slider {
    float: left;
    position: relative;
    width: 100%;
}
.down-arrow{
    position: absolute;
    bottom: 30px;
    left:0;
    width:100%;
}
.down-arrow a {
    border: 2px solid #ffffff;
    color: #ffffff;
    font-size: 16px;
    height: 58px;
    float: left;
    line-height: 56px;
    text-align: center;
    width: 58px;
}
.down-arrow a:hover{
    background: #FFF;
}
.layer1{
    color:#FFF;
    font-family: 'Montserrat', sans-serif;
    font-weight:500;
}
.zeus .tp-tab-title {
    background: rgba(0, 0, 0, 0) none repeat scroll 0 0 !important;
    color: #000000 !important;
    font-family: 'Montserrat', sans-serif !important;
    font-weight: 600 !important;
    opacity: 0.5 !important;
    padding: 0 10px 20px 0 !important;
    text-align: left !important;
}
.zeus .selected .tp-tab-title{
    color: #ffffff;
    opacity:1!important;
}
.zeus .tp-tab-title:before{
    content:"";
    background:#FFF;
    position:absolute;
    left:0;
    bottom:0;
    width:0;
    height:2px;
}
.zeus .selected .tp-tab-title:before{width:30px}
.tp-tabs.inner.zeus {
    width: 1;
    width: 1170px!important;
    max-width: none!important;
    left:50%!important;
    top:auto!important;
    bottom:120px;
    -webkit-transform:translateX(-50%)!important;
    -moz-transform:translateX(-50%)!important;
    -ms-transform:translateX(-50%)!important;
    -o-transform:translateX(-50%)!important;
    transform:translateX(-50%)!important;
}
/*----------------------------------------------------------------*/
/* 6 - Big Title
/*----------------------------------------------------------------*/
.big-title {
    float: left;
    width: 100%;
    margin-bottom: 90px;
}
.big-title h2 {
    color: #141b20;
    float: left;
    font-size: 30px;
    margin:-5px 0 0 ;
    position: relative;
    width: 100%;
}
.big-title span {
    float: left;
    width: 100%;
    font-size: 18px;
    color: #141b20;
    font-weight: 500;
    margin-top:-8px;
    margin-bottom: 20px;
    border-left:2px solid #d1d5d8;
    padding-left:30px;
}
.big-title h2 span {border:none;padding-left:0;}
.big-title.style2 span {border: none;}
.big-title span strong{font-weight:700}
.big-title p {
    color: #3e3e3e;
    float: left;
    margin: 0;
    width: 100%;
}
.big-title p strong{font-weight:700}
/*----------------------------------------------------------------*/
/* 7 - About Section
/*----------------------------------------------------------------*/
.services {
    float: left;
    width: 100%;
    margin-bottom: -40px;
}
.service {
    float: left;
    padding: 0 10px;
    text-align: center;
    width: 100%;
    margin-bottom: 40px;
}
.service > span {
    border: 1px solid #d2d6d9;
    display: inline-block;
    height: 80px;
    line-height: 55px;
    margin-bottom: 40px;
    padding: 10px;
    position: relative;
    text-align: center;
    width: 80px;
}
.service > span img{max-width:100%}
.service h4 {
    float: left;
    font-size: 24px;
    margin: 0 0 20px;
    width: 100%;
}
.service > p {
    color: #3e3e3e;
    float: left;
    margin: 0;
    width: 100%;
}
.line {
    background:#ebebee;
    float: left;
    height: 2px;
    margin:0;
    width: 100%;
}
/*----------------------------------------------------------------*/
/* 8 - Service / weitere Angebote
/*----------------------------------------------------------------*/
.option-isotop{
    float: left;
    width: 100%;
    margin-bottom: 40px;
}
.option-isotop .option-set {
    list-style: outside none none;
    margin: 0;
    padding: 0;
}
.option-isotop .option-set li {
    color: #141b20;
    float: left;
    font-family: 'Montserrat', sans-serif;
    font-size: 11px;
    text-transform: uppercase;
}

.option-isotop .option-set li a {
    color: inherit;
    float: left;
    font-weight: 600;
    padding: 0 20px 15px;
    opacity:0.7;
    position: relative;
}
.option-isotop .option-set li a.selected{opacity:1}
.option-isotop .option-set li:first-child a{padding-left:0}
.option-isotop .option-set li:first-child a:before{left:0}
.option-isotop .option-set li a:before{
    content: "";
    height: 2px;
    width:0;
    position: absolute;
    left: 20px;
    bottom: 0;
}
.option-isotop .option-set li a.selected:before{width:20px}
.without-gap{margin:0}
.without-gap .masonary > div{padding:0}
.work{
    float: left;
    width: 100%;
    overflow:hidden;
    position: relative;
}
.work > img{width:100%}
.work-hover {
    height: 100%;
    padding:25px;
    width: 100%;
    z-index: 1;
    opacity:0;
    position: absolute;
    left: 0;
    top: 0;
    -webkit-transition:all 0.4s linear;
    -moz-transition:all 0.4s linear;
    -ms-transition:all 0.4s linear;
    -o-transition:all 0.4s linear;
    transition:all 0.4s linear;
}
.work-hover:before{
    content:"";
    height:100%;
    width:100%;
    opacity: 0.9;
    z-index:-1;
    position:absolute;
    left:0;
    top:0;
}
.work:hover .work-hover{opacity:1}

.work-hover h5 {
    color: #fff;
    float: left;
    font-size: 24px;
    margin: 0 0 5px;
    width: 100%;
}
.work-hover > span {
    color: #fff;
    float: left;
    font-family: 'Montserrat', sans-serif;
    font-size: 11px;
    text-transform: uppercase;
    width: 100%;
}
.work-hover > a {
    border: 2px solid #fff;
    bottom: 25px;
    color: #fff;
    height: 60px;
    left: 25px;
    line-height: 56px;
    position: absolute;
    text-align: center;
    width: 60px;
}
.work-hover > a:hover{background:#FFF}
/*----------------------------------------------------------------*/
/* 9 - Fotogalerie / Bilder
/*----------------------------------------------------------------*/
.work-flow{
    float:left;
    width:100%;
}
.steps {
    display: table;
    width: 100%;
}
.step-img {
    display: table-cell;
    vertical-align: middle;
}
.step-detail > span:before{
    content: "";
    position: absolute;
    left:20px;
    bottom: -2px;
    width: 20px;
    height: 2px;
    -webkit-transition: all 0.5s cubic-bezier(0.680, 0, 0.265, 1); /* older webkit */
    -webkit-transition: all 0.5s cubic-bezier(0.680, -0.550, 0.265, 1.550);
    -moz-transition: all 0.5s cubic-bezier(0.680, -0.550, 0.265, 1.550);
    -o-transition: all 0.5s cubic-bezier(0.680, -0.550, 0.265, 1.550);
    transition: all 0.5s cubic-bezier(0.680, -0.550, 0.265, 1.550); /* easeInOutBack */

    -webkit-transition-timing-function: cubic-bezier(0.680, 0, 0.265, 1); /* older webkit */
    -webkit-transition-timing-function: cubic-bezier(0.680, -0.550, 0.265, 1.550);
    -moz-transition-timing-function: cubic-bezier(0.680, -0.550, 0.265, 1.550);
    -o-transition-timing-function: cubic-bezier(0.680, -0.550, 0.265, 1.550);
    transition-timing-function: cubic-bezier(0.680, -0.550, 0.265, 1.550); /* easeInOutBack */
}
.steps:hover .step-detail > span:before{
    left:0;
    width:100%;
}
.step-detail > span {
    width: 100px;
    height: 100px;
    display: table-cell;
    border: 2px solid #d1d5d8;
    vertical-align: bottom;
    padding: 20px;
    font-family: 'Montserrat', sans-serif;
    font-size: 30px;
    font-weight: 900;
    line-height: 22px;
    position: relative;
}

.step-detail {
    display: table-cell;
    padding-right: 80px;
    vertical-align: middle;
    width: 100%;
    padding-left: 0;
}
.step-img ~ .step-detail {
    padding-left: 80px;
    padding-right: 0;
}
.step-detail > h4 {
    float: left;
    font-size: 30px;
    font-weight: 500;
    margin: 35px 0 5px;
    width: 100%;

}
.step-detail > p {
    float: left;
    margin: 16px 0 0;
    width: 100%;
}
.step-detail > p i {
    color: #141b20;
    font-weight: 600;
}
/*----------------------------------------------------------------*/
/* 10 - Servie, weitere Angebote
/*----------------------------------------------------------------*/
.column-title {
    float: left;
    position: relative;
    width: 100%;
}
.column-title:before {
    content: "";
    position: absolute;
    left: 0;
    bottom: 0;
    width: 30px;
    height: 2px;
    background: white;
}
.column-title > h2 {
    color: #000;
    font-size: 30px;
    margin: 0;
}
.innovative-services{
    float:left;
    margin-top:-55px;
    width:100%;
}
.innovative-service{
    float:left;
    margin-top:55px;
    width:100%;
}
.innovative-service i,.innovative-service img{
    color:#fff;
    display:table;
    font-size:50px;
    margin-bottom:35px;
}
.innovative-service > h4 {
    color: #000;
    float: left;
    font-size: 24px;
    margin:0 0 35px;
    width: 100%;
}
.innovative-service > p {
    color: #000;
    float: left;
    margin: 0;
    width: 100%;
}
.innovative-service > p strong{
    color:#FFFFFF;
}
/*----------------------------------------------------------------*/
/* 11 - Teambereiche
/*----------------------------------------------------------------*/
.team-carousel{
    float:left;
    width:100%;
}
.team-carousel1{
    float:left;
    width:100%;
}

.member-wrapper{
    float: left;
    width:100%;
    padding:10px;
    position:relative;
}
.member{
    float: left;
    text-align: center;
    width: 100%;
}
.member:hover {
    -webkit-box-shadow: 0 0 15px #b0b0b0;
    -moz-box-shadow: 0 0 15px #b0b0b0;
    -ms-box-shadow: 0 0 15px #b0b0b0;
    -o-box-shadow: 0 0 15px #b0b0b0;
    box-shadow: 0 0 15px #b0b0b0;
}
.member > img{width:100%}
.member-info {
    float: left;
    padding: 30px 30px 0;
    width: 100%;
    background:#FFF;
    position:relative;
    z-index:1;
}
.member:hover .member-info{
    padding-bottom:60px;
    margin-top:-60px;
}
.member-info h6 {
    color: #141b20;
    float: left;
    font-size: 22px;
    margin: 0 0 10px;
    width: 100%;
}
.member-info > span {
    color: #767c84;
    float: left;
    font-family: 'Montserrat', sans-serif;
    font-size: 11px;
    width: 100%;
}
.member-socials {
    width: 100%;
    visibility:hidden;
    opacity:0;
    position: absolute;
    bottom:0;
    left: 0;
}
.member:hover .member-socials{
    bottom:20px;
    visibility:visible;
    opacity:1;
}
.member-socials > a {
    border: 1px solid #a4a6a8;
    color: #a4a6a8;
    display: inline-block;
    height: 30px;
    line-height: 30px;
    margin: 0 3px;
    width: 30px;
}
.owl-dots {
    float: left;
    height: 2px;
    margin-top: 50px;
    text-align: center;
    width: 100%;
}
.owl-dots .owl-dot{
    background:#d1d5d8;
    display: inline-block;
    height: 2px;
    margin: 0 3px;
    width: 20px;
}
/*----------------------------------------------------------------*/
/* 12 - Brands
/*----------------------------------------------------------------*/
.testimonials-carousel {
    border-bottom: 2px solid rgba(255, 255, 255, 0.3);
    float: left;
    margin-bottom: 70px;
    padding-bottom: 60px;
    width: 100%;
}
.testimonial {
    float: left;
    width: 100%;
}
.testimonial blockquote {
    border: 0 none;
    color: #333;
    float: left;
    font-size: 16px;
    line-height: 34px;
    margin: 0 0 30px;
    padding: 0;
    width: 100%;
}
.testimonial > span {
    color: #fff;
    float: left;
    font-family: 'Montserrat', sans-serif;
    font-size: 12px;
    width: 100%;
}
.testimonial-info {
    float: left;
    margin-top: 50px;
    width: 100%;
}
.testimonial-info > strong {
    color: #fff;
    display: inline-block;
    font-family: 'Montserrat', sans-serif;
    font-size: 18px;
    padding-left: 20px;
    vertical-align: middle;
}
.testimonial-info > strong i {
    display: table;
    font-size: 11px;
    font-style: normal;
}
.testimonials-carousel .owl-nav {
    position: absolute;
    bottom: -70px;
    left: 0;
}
.testimonials-carousel .owl-nav > div {
    color: transparent;
    float: left;
    height: 14px;
    margin-right: 40px;
    opacity: 0.6;
    position: relative;
    background: none;
    background: url(../images/arrow.svg) no-repeat scroll 0 0 transparent;
    width: 10px;
}
.testimonials-carousel .owl-nav > div.owl-prev{
    top:2px;
    -webkit-transform:rotate(90deg);
    -moz-transform:rotate(90deg);
    -ms-transform:rotate(90deg);
    -o-transform:rotate(90deg);
    transform:rotate(90deg);
}
.testimonials-carousel .owl-nav > div.owl-next{
    -webkit-transform:rotate(-90deg);
    -moz-transform:rotate(-90deg);
    -ms-transform:rotate(-90deg);
    -o-transform:rotate(-90deg);
    transform:rotate(-90deg);
}
.testimonials-carousel .owl-nav > div:hover{opacity:1}
.testimonial-carousel-wrapper{
    float:left;
    width:100%;
    position:relative;
}
.counter {
    bottom: 0;
    color: #fff;
    font-family: 'Montserrat', sans-serif;
    font-size: 11px;
    position: absolute;
    right: 0;
}
.counter i{
    font-style:normal;
    padding:0 1px;
}
/*----------------------------------------------------------------*/
/* 13 - Kunden
/*----------------------------------------------------------------*/
.sponsors-carousel {
    float: left;
    width: 100%;
    margin:-20px 0;
}
.sponsors-carousel a{
    border: 2px solid #ebebee;
    float: left;
    padding:10px;
    margin:20px 0;
    text-align: center;
    width: 100%;
}
.sponsors-carousel a:hover{
    border:2px solid transparent;
    -webkit-box-shadow: 0 0 15px #cecccc;
    -moz-box-shadow: 0 0 15px #cecccc;
    -ms-box-shadow: 0 0 15px #cecccc;
    -o-box-shadow: 0 0 15px #cecccc;
    box-shadow: 0 0 15px #cecccc;
}
.sponsors-carousel a img{
    max-width:100%;
    -webkit-filter:grayscale(1);
    filter:grayscale(1);
}
.sponsors-carousel a:hover img{
    -webkit-filter:grayscale(0);
    filter:grayscale(0);
}
/*----------------------------------------------------------------*/
/* 14 - Blogteil
/*----------------------------------------------------------------*/
.blog-posts {
    float: left;
    width: 100%;
}
.simple-title {
    color: #141b20;
    float: left;
    font-size: 30px;
    margin: 0;
    width: 100%;
}
.categories {
    float: left;
    padding: 60px 0;
    width: 100%;
}
.categories > a {
    color: #767c84;
    float: left;
    font-family: 'Montserrat', sans-serif;
    font-size: 11px;
    font-weight:600;
    line-height: 40px;
    text-transform: uppercase;
    width: 100%;
}
.all-post{
    color: #141b20;
    float: left;
    font-family: 'Montserrat', sans-serif;
    font-size: 11px;
    font-weight: 600;
    padding-top: 40px;
    position: relative;
    text-transform: uppercase;
    width: 100%;
}
.all-post:before{
    background:#ebebee;
    content: "";
    height: 2px;
    left: 0;
    position: absolute;
    top: 0;
    width: 20px;
}
.blog-carousel{
    float:left;
    width:100%;
}
.blog-post {
    float: left;
    width: 100%;
    margin-bottom: 30px;
}
.blog-slide {
    float: left;
    width: 100%;
    margin-bottom: -30px;
}
.blog-img {
    float: left;
    margin-bottom: 15px;
    position: relative;
    width: 100%;
}
.blog-img > img{width:100%}
.blog-img > a {
    background: #fff none repeat scroll 0 0;
    font-family: 'Montserrat', sans-serif;
    font-size: 10px;
    font-weight: 700;
    z-index:1;
    left: 0;
    letter-spacing: 0.3px;
    padding: 4px 13px;
    position: absolute;
    top: 20px;
}
.blog-post > span {
    color: #767c84;
    float: left;
    font-family: 'Montserrat', sans-serif;
    font-size: 11px;
    font-weight: 700;
    width: 100%;
}
.blog-post h3 {
    color: #141b20;
    float: left;
    font-size: 18px;
    font-weight: 500;
    line-height: 32px;
    margin: 8px 0 0;
    width: 100%;
}
.blog-post h3 a{color:inherit}
/*----------------------------------------------------------------*/
/* 15 - Kontakt
/*----------------------------------------------------------------*/
.map {
    height: 100%;
    left: 0;
    position: absolute;
    top: 0;
    width: 50%;
}
.map > div{
    float:left;
    min-height:560px;
    width:100%;
}
.get-in-touch {
    background: #F0F0F0 none repeat scroll 0 0;
    float: left;
    padding: 60px 0 0 60px;
    position: relative;
    width: 100%;
}
.get-in-touch:before,
.get-in-touch:after{
    background:#F0F0F0;
    content: "";
    height: 100%;
    position: absolute;
    right: -1000px;
    top: 0;
    width: 1000px;
}
.get-in-touch:after{
    left: -15px;
    right: auto;
    width: 15px;
}
.big-title.light h2{color:#333}

.get-in-touch form{
    float: left;
    margin:0 0 100px;
    width: 100%;
}
.get-in-touch .big-title{margin-bottom:30px}
form .input-field {
    font-family: 'Montserrat', sans-serif;
    font-size: 13px;
    letter-spacing: 0;
    margin-top: 20px;
    position: relative;
}
.input-field label {
    font-size: 13px;
    font-weight: 200;
    left:15px;
}
.input-field input {
    border-color: #fff;
    color: #333333;
    font-weight: 300;
    margin: 0;
}
.input-field button,
.coloured-btn {
    border: 0 none;
    color: #fff;
    font-size: 11px;
    padding: 15px 45px;
    font-family:montserrat;
    position:relative;
    z-index:1;
    overflow:hidden;
    -webkit-border-radius:30px;
    -moz-border-radius:30px;
    -ms-border-radius:30px;
    -o-border-radius:30px;
    border-radius:30px;
}
.input-field button:before,
.coloured-btn:before{
    background: black none repeat scroll 0 0;
    content: "";
    height: 100%;
    opacity:0;
    width: 100%;
    z-index: -1;
    position: absolute;
    left: 0;
    top: 0;
    -webkit-border-radius:30px;
    -moz-border-radius:30px;
    -ms-border-radius:30px;
    -o-border-radius:30px;
    border-radius:30px;
}
.input-field button:hover:before,
.coloured-btn:hover:before {opacity:0.2}
.get-in-touch form .input-field input:focus,
.get-in-touch form .input-field textarea:focus,
.get-in-touch form .input-field label.active{
    border-color: #CCC;
    color: #fff;
    font-size: 13px;
}

.find-us {
    float: left;
    width: 100%;
}
.find-us > ul {
    float: left;
    list-style: outside none none;
    margin: 0;
    padding: 0;
    width: 100%;
}
.find-us > ul li {
    color: #333;
    float: left;
    font-family: 'Montserrat', sans-serif;
    font-size: 13px;
    font-weight: 500;
    line-height: 30px;
    margin-bottom: 20px;
    width: 100%;
}
.find-us > ul li span {
    color: #606c75;
    float: left;
    width: 25%;
}
.find-us > ul li strong{
    float:left;
    width:100%;
}
.find-us > ul li:last-child{margin:0}
.find-us > ul li i {
    float:left;
    width: 75%;
    font-style: normal;
    font-weight: 800;
    letter-spacing: 0;
}

.bottom-line{
    border-top:2px solid #fff;
    float:left;
    margin-top:70px;
    padding:20px 0;
    width: 100%;
}
.bottom-downline{
    
    float:left;
    margin-top:10px;
    padding:5px 0;
    width: 100%;
}
.bottom-line > a{float:left}
.simple-socials{float:right}
.simple-socials a {
    color: #606c75;
    float: left;
    width:49px;
    font-size: 13px;
    margin-left: 15px;
}
/*----------------------------------------------------------------*/
/* 16 - Seitentitel
/*----------------------------------------------------------------*/
.page-title {
	float: left;
	padding: 200px 0;
	text-align: center;
	width: 100%;
	background-color: #666;
}
.page-title h1 {
    color: #fff;
    float: left;
    font-size: 80px;
    font-weight: 500;
    margin: 0;
    width: 100%;
}

.page-title > a {
    color: #fff;
    font-family: 'Montserrat', sans-serif;
    font-size: 11px;
    font-weight: 600;
    letter-spacing: 0.5px;
    padding: 30px;
    position: absolute;
    right: 0;
    top: 0;
}
/*----------------------------------------------------------------*/
/* 17 - Blog Website
/*----------------------------------------------------------------*/
.categories.style2 {
    position: absolute;
    top: -80px;
    left: 0;
    padding: 0;
    text-align: center;
}
.categories.style2 a {
    color: #fff;
    display: inline-block;
    float: none;
    line-height: 20px;
    opacity: 0.5;
    padding: 0 15px 15px;
    position: relative;
    width: auto;
}
.categories.style2 a:before{
    background: white none repeat scroll 0 0;
    content: "";
    height: 2px;
    position: absolute;
    bottom: 0;
    left: 50%;
    width: 0;
}
.categories.style2 a.selected:before {
    margin-left: -10px;
    width: 20px;
}
.categories.style2 a.selected{
    opacity:1;
    color:#FFF;
}
.blog-slide .line{margin-bottom:30px}
.coloured-btn {
    display: table;
    margin: 0 auto 40px;
    position: relative;
}
.coloured-btn:hover{color:#FFF}
.bottom-line.style2 {
    background: #f7f7f8 none repeat scroll 0 0;
    border: 0 none;
    margin: 0;
    padding: 30px 0;
}
/*----------------------------------------------------------------*/
/* 18 - Blog, Einzelseite
/*----------------------------------------------------------------*/
.page-title.style2{
    padding: 0;
    position: relative;
}
.page-title.style2 > img{width:100%}
.page-title.style2:before{
    content: "";
    height: 100%;
    opacity: 0.6;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
}
.page-title.style2 .container {
    position: absolute;
    left: 50%;
    top: 50%;
    -webkit-transform: translateX(-50%) translateY(-50%);
    -moz-transform: translateX(-50%) translateY(-50%);
    -ms-transform: translateX(-50%) translateY(-50%);
    -o-transform: translateX(-50%) translateY(-50%);
    transform: translateX(-50%) translateY(-50%);
}
.page-title span {
    background: #fff none repeat scroll 0 0;
    display: inline-block;
    font-family: 'Montserrat', sans-serif;
    font-size: 10px;
    font-weight: 600;
    padding: 4px;
}
.page-title span a {
    float: left;
    font-size: 10px;
    font-weight: 800;
    padding: 0 3px;
}

.page-title.style2 h1 {
    font-size: 30px;
    line-height: 50px;
    margin: 20px 20% 0;
    width: 60%;
}
.page-title .container  i{
    color: #fff;
    float: left;
    font-family: 'Montserrat', sans-serif;
    font-size: 11px;
    font-style: normal;
    font-weight: 600;
    margin-top: 20px;
    width: 100%;
}
.post-detail {
    float: left;
    width: 100%;
}
.post-detail strong {
    color: #141b20;
    display: table;
    font-size: 18px;
    line-height: 36px;
    padding: 0 100px;
}
.post-detail strong i {
    display: inline-block;
    float: left;
    font-size: 48px;
    font-weight: 600;
    padding-right: 20px;
    padding-top: 20px;
    vertical-align: top;
}
.post-detail blockquote {
    border-bottom: 1px solid #ebebee;
    border-left: 0 none;
    border-top: 1px solid #ebebee;
    color: #141b20;
    display: table;
    font-size: 18px;
    font-style: italic;
    font-weight: 600;
    line-height: 30px;
    margin: 50px 100px;
    padding: 40px 70px 30px 90px;
    position: relative;
}
.post-detail blockquote:before {
    background: #d1d5d8;
    content: "";
    height: 50px;
    width: 2px;
    position: absolute;
    left: 60px;
    top: 47px;
}
.post-detail blockquote:after{
    color: #d1d5d8;
    content: "\f10d";
    font-family: FontAwesome;
    font-size: 30px;
    font-style: normal;
    height: 30px;
    left: 10px;
    position: absolute;
    text-align: center;
    top: 50px;
    width: 30px;
}
.post-detail blockquote span {
    color: #141b20;
    display:table;
    font-family: 'Montserrat', sans-serif;
    font-size: 11px;
    font-style: normal;
    line-height: 14px;
    margin-top: 30px;
    text-align: right;
    text-transform: uppercase;
    width: 100%;
}
.post-detail p {
    color: #3e3e3e;
    padding: 0 100px;
}
.post-detail p strong {
    display: unset;
    font-size: inherit;
    font-style: italic;
    font-weight: 900;
    padding: 0;
}
.post-detail > img {
    margin: 15px 0;
    max-width: 100%;
}
.alignleft, .post-detail .alignleft{
    float: left;
    margin-right: 30px;
    text-align: left;
}
.alignright, .post-detail .alignright{
    float:right;
    margin-left:30px;
    text-align:right;
}
.tags-share {
    float: left;
    margin: 40px 0;
    padding: 0 100px;
    width: 100%;
}
.tags-share-inner {
    border-bottom: 1px solid #ebebee;
    border-top: 1px solid #ebebee;
    float: left;
    padding: 40px 0;
    width: 100%;
}
.tags {
    float: left;
    width: 50%;
}
.share {
    float: left;
    text-align: right;
    width: 50%;
}
.tags > span {
    color: #767c84;
    float: left;
    font-family: 'Montserrat', sans-serif;
    font-size: 11px;
    font-weight: 700;
    padding: 9px 20px 9px 0;
}
.tags > a {
    border: 1px solid #ebebee;
    color: #141b20;
    float: left;
    font-family: 'Montserrat', sans-serif;
    font-size: 11px;
    font-weight: 700;
    margin-right: 10px;
    padding: 8px 20px;
    text-transform: uppercase;
}
.share > span {
    color: #767c84;
    display: inline-block;
    font-family: 'Montserrat', sans-serif;
    font-size: 11px;
    font-weight: 600;
    margin-right: 0;
    vertical-align: middle;
}
.share > a {
    border: 1px solid #ebebee;
    color: #141b20;
    display: inline-block;
    font-size: 14px;
    height: 40px;
    line-height: 40px;
    margin-left: 10px;
    text-align: center;
    vertical-align: middle;
    width: 40px;
}
.author {
    float: left;
    padding: 0 100px;
    text-align: center;
    width: 100%;
}
.author > img {
    border-radius: 50%;
}
.author > strong {
    color: #141b20;
    float: left;
    font-family: 'Montserrat', sans-serif;
    font-size: 18px;
    letter-spacing: 0;
    margin: 20px 0 10px;
    width: 100%;
}
.author > p {
    color: #3e3e3e;
    float: left;
    margin: 0 0 20px;
    width: 100%;
}
.author .simple-socials {
    float: left;
    text-align: center;
    width: 100%;
}
.author .simple-socials a {
    display: inline-block;
    float: none;
    margin: 0 5px;
}
.post-paginations {
    border-top: 2px solid #ebebee;
    float: left;
    overflow:hidden;
    margin-top: 40px;
    padding-top: 60px;
    position:relative;
    width: 100%;
}
.post-paginations:before {
    background:#ebebee;
    content: "";
    height: 50px;
    width: 1px;
    margin-left: -0.5px;
    position: absolute;
    left: 50%;
    top: 60px;
}
.post-pagi {
    float: left;
    padding-left: 40px;
    width: 50%;
}
.post-pagi > span {
    color: #141b20;
    display: table;
    font-family: 'Montserrat', sans-serif;
    font-size: 11px;
    font-weight: 700;
}
.post-pagi > strong {
    color: #767c84;
    float: left;
    font-family: 'Montserrat', sans-serif;
    font-size: 18px;
    letter-spacing: 0;
    margin-top: 5px;
    width: 100%;
}
.post-pagi > strong a {
    color: inherit;
    float: left;
    width: 100%;
}
.post-pagi.prev {
    padding-left: 0;
    padding-right: 40px;
    text-align: right;
}
.post-pagi.prev span {
    text-align: right;
    width: 100%;
}
.post-pagi > span i {
    margin: 0px 5px;
    font-size: 14px;
    display: inline-block;
    vertical-align: middle;
}
.post-pagi:hover > strong{color:#141b20}
.related-carousel{
    float:left;
    width:100%;
}
.sub-title{
    font-family: 'Montserrat', sans-serif;
    font-size: 30px;
    margin: 0;
}
.related-carousel .blog-post{margin:0}
.related-carousel .owl-nav {
    bottom: 0;
    left: -300px;
    position: absolute;
}
.related-carousel .owl-nav > div {
    color: transparent;
    float: left;
    height: 10px;
    margin-right: 20px;
    position: relative;
    width: 30px;
}
.related-carousel .owl-nav > div:before{
    color: #333;
    content: "\f177";
    font-size:18px;
    font-family: FontAwesome;
    height: 10px;
    line-height: 10px;
    text-align: center;
    width: 100%;
    position: absolute;
    left: 0;
    top: 0;
}
.related-carousel .owl-nav > div.owl-next:before{content:"\f178"}
.all-comments {
    float: left;
    width: 100%;
}
.all-comments ul {
    float: left;
    list-style: outside none none;
    margin: 0;
    padding: 0;
    width: 100%;
}
.all-comments ul ul{
    padding-left:30px;
    padding-top:40px;
    margin-top:40px;
    border-bottom: 1px solid #ebebee;
}
.all-comments ul li {
    border-bottom: 1px solid #ebebee;
    float: left;
    margin-bottom: 30px;
    padding-bottom: 30px;
    width: 100%;
}
.all-comments ul li:last-child{
    border:0;
    margin:0;
    padding:0;
}
.comment {
    float: left;
    position: relative;
    width: 100%;
}
h5.comment-name {
    float: left;
    font-size: 18px;
    margin: 0 0 10px;
    width: 100%;
}
.comment > span {
    color: #767c84;
    float: left;
    font-family: 'Montserrat', sans-serif;
    font-size: 11px;
    font-weight: 600;
    width: 100%;
}
.reply {
    color: #767c84;
    font-family: 'Montserrat', sans-serif;
    font-size: 11px;
    font-weight: 600;
    position: absolute;
    right: 0;
    top: 0;
}
.comment > p {
    color: #3e3e3e;
    float: left;
    font-size: 15px;
    margin: 20px 0 0;
    width: 100%;
}
.load-more-comments{
    border-top: 1px solid #ebebee;
    color: #767c84;
    float: left;
    font-size: 20px;
    margin-top: 30px;
    padding-top: 30px;
    text-align: center;
    width: 100%;
}
.load-more-comments a{color:inherit}
.comments-sec{
    float:left;
    width:100%;
}
.leave-reply{
    float:left;
    width:100%;
    margin-top:60px;
    padding-top:60px;
    border-top:2px solid #ebebee;
}
.leave-reply .input-field label {
    color: #767c84;
    font-weight: 700;
}
.leave-reply .input-field label.active{color:#000!important}

.leave-reply .input-field input,
.leave-reply .input-field textarea{border-color:#f1f2f3}
.leave-reply .input-field input:focus,
.leave-reply .input-field textarea:focus{
    border-color:#141b20;
    box-shadow:none;
}
/*----------------------------------------------------------------*/
/* 19 - Einzelbereich
/*----------------------------------------------------------------*/
.page-title.style3{
    padding: 0;
    position: relative;
}
.page-title.style3 > img{width:100%}
.page-title.style3:before{
    background:black;
    content: "";
    height: 100%;
    left: 0;
    opacity: 0.6;
    position: absolute;
    top: 0;
    width: 100%;
}
.page-title.style3 .container {
    text-align: center;
    width: 100%;
    max-width:none;
    position: absolute;
    top: 50%;
    left: 0;
    -webkit-transform:translateY(-50%);
    -moz-transform:translateY(-50%);
    -ms-transform:translateY(-50%);
    -o-transform:translateY(-50%);
    transform:translateY(-50%);
}
.big-title h2 span {
    float: left;
    font-family: 'Montserrat', sans-serif;
    font-size: 11px;
    font-weight: 700;
    margin-top: 10px;
    width: 100%;
}
.single-portfolio-grids{
    float:left;
    width:100%;
    margin-bottom:-30px;
}
.portfolio-img {
    float: left;
    position: relative;
    width: 100%;
    margin-bottom:30px;
}
.portfolio-img img{width:100%}
.portfolio-img:before{
    content: "";
    height: 100%;
    width:100%;
    opacity: 0;
    position: absolute;
    left:0;
    top: 0;
    z-index: 1;
    -webkit-transition:all 0.4s linear;
    -moz-transition:all 0.4s linear;
    -ms-transition:all 0.4s linear;
    -o-transition:all 0.4s linear;
    transition:all 0.4s linear;
}
.portfolio-img:hover:before{opacity:0.9}
.portfolio-img > a {
    border: 1px solid #fff;
    color: #fff;
    font-size: 24px;
    height: 60px;
    left: 50%;
    line-height: 60px;
    margin-left: -30px;
    margin-top: -30px;
    position: absolute;
    text-align: center;
    top: 50%;
    width: 60px;
    opacity:0;
    z-index: 2;
    -webkit-transition:all 0.4s linear;
    -moz-transition:all 0.4s linear;
    -ms-transition:all 0.4s linear;
    -o-transition:all 0.4s linear;
    transition:all 0.4s linear;
}
.portfolio-img:hover > a{opacity:1}
.portfolio-img > a:hover{background:#FFF}

/*----------------------------------------------------------------*/
/* 20 - Owl Carousel Stil
/*----------------------------------------------------------------*/
.owl-carousel .animated{-webkit-animation-duration:1000ms;animation-duration:1000ms;-webkit-animation-fill-mode:both;animation-fill-mode:both;}.owl-carousel .owl-animated-in{z-index:0;}.owl-carousel .owl-animated-out{z-index:1;}.owl-carousel .fadeOut{-webkit-animation-name:fadeOut;animation-name:fadeOut;}@-webkit-keyframes fadeOut{0%{opacity:1;}100%{opacity:0;}}@keyframes fadeOut{0%{opacity:1;}100%{opacity:0;}}/* *   Owl Carousel - Auto Height Plugin*/.owl-height{-webkit-transition:height 500ms ease-in-out;-moz-transition:height 500ms ease-in-out;-ms-transition:height 500ms ease-in-out;-o-transition:height 500ms ease-in-out;transition:height 500ms ease-in-out;}/* *  Core Owl Carousel CSS File*/.owl-carousel{display:none;-webkit-tap-highlight-color:transparent;/* position relative and z-index fix webkit rendering fonts issue */position:relative;z-index:1;}.owl-carousel .owl-stage{position:relative;-ms-touch-action:pan-Y;}.owl-carousel .owl-stage:after{content:".";display:block;clear:both;visibility:hidden;line-height:0;height:0;}.owl-carousel .owl-stage-outer{position:relative;overflow:hidden;/* fix for flashing background */-webkit-transform:translate3d(0px, 0px, 0px);}.owl-carousel .owl-controls .owl-nav .owl-prev,.owl-carousel .owl-controls .owl-nav .owl-next,.owl-carousel .owl-controls .owl-dot{cursor:pointer;cursor:hand;-webkit-user-select:none;-khtml-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;}.owl-carousel.owl-loaded{display:block;}.owl-carousel.owl-loading{opacity:0;display:block;}.owl-carousel.owl-hidden{opacity:0;}.owl-carousel .owl-refresh .owl-item{display:none;}.owl-carousel .owl-item{position:relative;min-height:1px;float:left;-webkit-backface-visibility:hidden;-webkit-tap-highlight-color:transparent;-webkit-touch-callout:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;}.owl-carousel .owl-item img{-webkit-transform-style:preserve-3d;}.owl-carousel.owl-text-select-on .owl-item{-webkit-user-select:auto;-moz-user-select:auto;-ms-user-select:auto;user-select:auto;}.owl-carousel .owl-grab{cursor:move;cursor:-webkit-grab;cursor:-o-grab;cursor:-ms-grab;cursor:grab;}.owl-carousel.owl-rtl{direction:rtl;}.owl-carousel.owl-rtl .owl-item{float:right;}/* No Js */.no-js .owl-carousel{display:block;}/* *    Owl Carousel - Lazy Load Plugin*/.owl-carousel .owl-item .owl-lazy{opacity:0;-webkit-transition:opacity 400ms ease;-moz-transition:opacity 400ms ease;-ms-transition:opacity 400ms ease;-o-transition:opacity 400ms ease;transition:opacity 400ms ease;}.owl-carousel .owl-item img{transform-style:preserve-3d;}/* *  Owl Carousel - Video Plugin*/.owl-carousel .owl-video-wrapper{position:relative;height:100%;background:#000;}.owl-carousel .owl-video-play-icon{position:absolute;height:80px;width:80px;left:50%;top:50%;margin-left:-40px;margin-top:-40px;background:url("owl.video.play.png") no-repeat;cursor:pointer;z-index:1;-webkit-backface-visibility:hidden;-webkit-transition:scale 100ms ease;-moz-transition:scale 100ms ease;-ms-transition:scale 100ms ease;-o-transition:scale 100ms ease;transition:scale 100ms ease;}.owl-carousel .owl-video-play-icon:hover{-webkit-transition:scale(1.3, 1.3);-moz-transition:scale(1.3, 1.3);-ms-transition:scale(1.3, 1.3);-o-transition:scale(1.3, 1.3);transition:scale(1.3, 1.3);}.owl-carousel .owl-video-playing .owl-video-tn,.owl-carousel .owl-video-playing .owl-video-play-icon{display:none;}.owl-carousel .owl-video-tn{opacity:0;height:100%;background-position:center center;background-repeat:no-repeat;-webkit-background-size:contain;-moz-background-size:contain;-o-background-size:contain;background-size:contain;-webkit-transition:opacity 400ms ease;-moz-transition:opacity 400ms ease;-ms-transition:opacity 400ms ease;-o-transition:opacity 400ms ease;transition:opacity 400ms ease;}.owl-carousel .owl-video-frame{position:relative;z-index:1;}

/*----------------------------------------------------------------*/
/* 21 - Hamburger Konzept Menü
/*----------------------------------------------------------------*/
.c-hamburger{
    border: 0;
    cursor: pointer;
    display: block;
    height: 50px;
    margin: 0;
    overflow: hidden;
    padding: 0;
    position:absolute; /*fixed*/
    text-indent: -9999px;
    width: 50px;
    right:50px;
    top:50px;
    z-index: 1001;
}
.c-hamburger:focus {
    outline: none;
    background:none;
}
.c-hamburger span {
    background: #ffffff;
    display: block;
    height: 2px;
    margin-left: -9px;
    width: 18px;
    position: absolute;
    left: 50%;
    top:50%;
    -webkit-transform:translateY(-50%);
    -moz-transform:translateY(-50%);
    -ms-transform:translateY(-50%);
    -o-transform:translateY(-50%);
    transform:translateY(-50%);
}
.c-hamburger span:before,
.c-hamburger span:after {
  position: absolute;
  display: block;
  left: 0;
  width: 100%;
  height: 2px;
  background-color:#FFF;
  content: "";
}
.c-hamburger span:before {top:-6px}
.c-hamburger span:after {bottom:-6px}

.c-hamburger--htx {
    background: rgba(0, 0, 0, 0.2) none repeat scroll 0 0 !important;
}
.c-hamburger--htx span {
  -webkit-transition: background 0s 0.3s;
          transition: background 0s 0.3s;
}
.c-hamburger--htx span::before,
.c-hamburger--htx span::after {
  -webkit-transition-duration: 0.3s, 0.3s;
          transition-duration: 0.3s, 0.3s;
  -webkit-transition-delay: 0.3s, 0s;
          transition-delay: 0.3s, 0s;
}
.c-hamburger--htx span::before {
  -webkit-transition-property: top, -webkit-transform;
          transition-property: top, transform;
}
.c-hamburger--htx span::after {
  -webkit-transition-property: bottom, -webkit-transform;
          transition-property: bottom, transform;
}
.c-hamburger--htx.is-active span {
  background: none;
}
.c-hamburger--htx.is-active span::before {
  top: 0;
  -webkit-transform: rotate(45deg);
      -ms-transform: rotate(45deg);
          transform: rotate(45deg);
}
.c-hamburger--htx.is-active span::after {
  bottom: 0;
  -webkit-transform: rotate(-45deg);
      -ms-transform: rotate(-45deg);
          transform: rotate(-45deg);
}
.c-hamburger--htx.is-active span::before,
.c-hamburger--htx.is-active span::after {
  -webkit-transition-delay: 0s, 0.3s;
          transition-delay: 0s, 0.3s;position: fixed;
}
.c-hamburger.dark span{background:#000;}

/*----------------------------------------------------------------*/
/* 22 - Animationen
/*----------------------------------------------------------------*/
@-webkit-keyframes fadeIn {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

@keyframes fadeIn {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

.fadeIn {
  -webkit-animation-name: fadeIn;
  animation-name: fadeIn;
}

@-webkit-keyframes fadeInDown {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-20px);
    transform: translateY(-20px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

@keyframes fadeInDown {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-20px);
    -ms-transform: translateY(-20px);
    transform: translateY(-20px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
}

.fadeInDown {
  -webkit-animation-name: fadeInDown;
  animation-name: fadeInDown;
}

@-webkit-keyframes fadeInDownBig {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-2000px);
    transform: translateY(-2000px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

@keyframes fadeInDownBig {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-2000px);
    -ms-transform: translateY(-2000px);
    transform: translateY(-2000px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
}

.fadeInDownBig {
  -webkit-animation-name: fadeInDownBig;
  animation-name: fadeInDownBig;
}

@-webkit-keyframes fadeInLeft {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-20px);
    transform: translateX(-20px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

@keyframes fadeInLeft {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-20px);
    -ms-transform: translateX(-20px);
    transform: translateX(-20px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
}

.fadeInLeft {
  -webkit-animation-name: fadeInLeft;
  animation-name: fadeInLeft;
}

@-webkit-keyframes fadeInLeftBig {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-2000px);
    transform: translateX(-2000px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

@keyframes fadeInLeftBig {
  0% {
    opacity: 0;
    -webkit-transform: translateX(-2000px);
    -ms-transform: translateX(-2000px);
    transform: translateX(-2000px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
}

.fadeInLeftBig {
  -webkit-animation-name: fadeInLeftBig;
  animation-name: fadeInLeftBig;
}

@-webkit-keyframes fadeInRight {
  0% {
    opacity: 0;
    -webkit-transform: translateX(20px);
    transform: translateX(20px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

@keyframes fadeInRight {
  0% {
    opacity: 0;
    -webkit-transform: translateX(20px);
    -ms-transform: translateX(20px);
    transform: translateX(20px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
}

.fadeInRight {
  -webkit-animation-name: fadeInRight;
  animation-name: fadeInRight;
}

@-webkit-keyframes fadeInRightBig {
  0% {
    opacity: 0;
    -webkit-transform: translateX(2000px);
    transform: translateX(2000px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}

@keyframes fadeInRightBig {
  0% {
    opacity: 0;
    -webkit-transform: translateX(2000px);
    -ms-transform: translateX(2000px);
    transform: translateX(2000px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }
}

.fadeInRightBig {
  -webkit-animation-name: fadeInRightBig;
  animation-name: fadeInRightBig;
}

@-webkit-keyframes fadeInUp {
  0% {
    opacity: 0;
    -webkit-transform: translateY(20px);
    transform: translateY(20px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

@keyframes fadeInUp {
  0% {
    opacity: 0;
    -webkit-transform: translateY(20px);
    -ms-transform: translateY(20px);
    transform: translateY(20px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
}

.fadeInUp {
  -webkit-animation-name: fadeInUp;
  animation-name: fadeInUp;
}

@-webkit-keyframes fadeInUpBig {
  0% {
    opacity: 0;
    -webkit-transform: translateY(2000px);
    transform: translateY(2000px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

@keyframes fadeInUpBig {
  0% {
    opacity: 0;
    -webkit-transform: translateY(2000px);
    -ms-transform: translateY(2000px);
    transform: translateY(2000px);
  }

  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
}

.fadeInUpBig {
  -webkit-animation-name: fadeInUpBig;
  animation-name: fadeInUpBig;
}

@-webkit-keyframes fadeOut {
  0% {
    opacity: 1;
  }

  100% {
    opacity: 0;
  }
}

@keyframes fadeOut {
  0% {
    opacity: 1;
  }

  100% {
    opacity: 0;
  }
}

.fadeOut {
  -webkit-animation-name: fadeOut;
  animation-name: fadeOut;
}

@-webkit-keyframes fadeOutDown {
  0% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateY(20px);
    transform: translateY(20px);
  }
}

@keyframes fadeOutDown {
  0% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateY(20px);
    -ms-transform: translateY(20px);
    transform: translateY(20px);
  }
}

.fadeOutDown {
  -webkit-animation-name: fadeOutDown;
  animation-name: fadeOutDown;
}

@-webkit-keyframes fadeOutDownBig {
  0% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateY(2000px);
    transform: translateY(2000px);
  }
}

@keyframes fadeOutDownBig {
  0% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateY(2000px);
    -ms-transform: translateY(2000px);
    transform: translateY(2000px);
  }
}

.fadeOutDownBig {
  -webkit-animation-name: fadeOutDownBig;
  animation-name: fadeOutDownBig;
}

@-webkit-keyframes fadeOutLeft {
  0% {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateX(-20px);
    transform: translateX(-20px);
  }
}

@keyframes fadeOutLeft {
  0% {
    opacity: 1;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateX(-20px);
    -ms-transform: translateX(-20px);
    transform: translateX(-20px);
  }
}

.fadeOutLeft {
  -webkit-animation-name: fadeOutLeft;
  animation-name: fadeOutLeft;
}

@-webkit-keyframes fadeOutLeftBig {
  0% {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateX(-2000px);
    transform: translateX(-2000px);
  }
}

@keyframes fadeOutLeftBig {
  0% {
    opacity: 1;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateX(-2000px);
    -ms-transform: translateX(-2000px);
    transform: translateX(-2000px);
  }
}

.fadeOutLeftBig {
  -webkit-animation-name: fadeOutLeftBig;
  animation-name: fadeOutLeftBig;
}

@-webkit-keyframes fadeOutRight {
  0% {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateX(20px);
    transform: translateX(20px);
  }
}

@keyframes fadeOutRight {
  0% {
    opacity: 1;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateX(20px);
    -ms-transform: translateX(20px);
    transform: translateX(20px);
  }
}

.fadeOutRight {
  -webkit-animation-name: fadeOutRight;
  animation-name: fadeOutRight;
}

@-webkit-keyframes fadeOutRightBig {
  0% {
    opacity: 1;
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateX(2000px);
    transform: translateX(2000px);
  }
}

@keyframes fadeOutRightBig {
  0% {
    opacity: 1;
    -webkit-transform: translateX(0);
    -ms-transform: translateX(0);
    transform: translateX(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateX(2000px);
    -ms-transform: translateX(2000px);
    transform: translateX(2000px);
  }
}

.fadeOutRightBig {
  -webkit-animation-name: fadeOutRightBig;
  animation-name: fadeOutRightBig;
}

@-webkit-keyframes fadeOutUp {
  0% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateY(-20px);
    transform: translateY(-20px);
  }
}

@keyframes fadeOutUp {
  0% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateY(-20px);
    -ms-transform: translateY(-20px);
    transform: translateY(-20px);
  }
}

.fadeOutUp {
  -webkit-animation-name: fadeOutUp;
  animation-name: fadeOutUp;
}

@-webkit-keyframes fadeOutUpBig {
  0% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateY(-2000px);
    transform: translateY(-2000px);
  }
}

@keyframes fadeOutUpBig {
  0% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateY(-2000px);
    -ms-transform: translateY(-2000px);
    transform: translateY(-2000px);
  }
}

.fadeOutUpBig {
  -webkit-animation-name: fadeOutUpBig;
  animation-name: fadeOutUpBig;
}
