/*
Theme Name: 126er Gin
Theme URI: http://vorne-sein.at
Author: Clemens Trummer
Author URI: http://vorne-sein.at
Description: Theme für 126er Gin
Version: 1.0
Tags: 
*/


/* roboto-300 - latin */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 300;
  src: url('./fonts/roboto-v30-latin-300.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('./fonts/roboto-v30-latin-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('./fonts/roboto-v30-latin-300.woff2') format('woff2'), /* Super Modern Browsers */
       url('./fonts/roboto-v30-latin-300.woff') format('woff'), /* Modern Browsers */
       url('./fonts/roboto-v30-latin-300.ttf') format('truetype'), /* Safari, Android, iOS */
       url('./fonts/roboto-v30-latin-300.svg#Roboto') format('svg'); /* Legacy iOS */
}
/* roboto-700 - latin */
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 700;
  src: url('./fonts/roboto-v30-latin-700.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('./fonts/roboto-v30-latin-700.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('./fonts/roboto-v30-latin-700.woff2') format('woff2'), /* Super Modern Browsers */
       url('./fonts/roboto-v30-latin-700.woff') format('woff'), /* Modern Browsers */
       url('./fonts/roboto-v30-latin-700.ttf') format('truetype'), /* Safari, Android, iOS */
       url('./fonts/roboto-v30-latin-700.svg#Roboto') format('svg'); /* Legacy iOS */
}
/*
Copyright 2011 Google Inc. All Rights Reserved.

   Licensed under the Apache License, Version 2.0 (the "License");
   you may not use this file except in compliance with the License.
   You may obtain a copy of the License at

       http://www.apache.org/licenses/LICENSE-2.0

   Unless required by applicable law or agreed to in writing, software
   distributed under the License is distributed on an "AS IS" BASIS,
   WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
   See the License for the specific language governing permissions and
   limitations under the License.
*/

/* sanchez-regular - latin */
@font-face {
  font-family: 'Sanchez';
  font-style: normal;
  font-weight: 400;
  src: url('./fonts/sanchez-v13-latin-regular.eot'); /* IE9 Compat Modes */
  src: local(''),
       url('./fonts/sanchez-v13-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('./fonts/sanchez-v13-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('./fonts/sanchez-v13-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('./fonts/sanchez-v13-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('./fonts/sanchez-v13-latin-regular.svg#Sanchez') format('svg'); /* Legacy iOS */
}
/* 
Copyright (c) 2012, LatinoType (luciano@latinotype.com), with Reserved Font Names 'Sanchez'

This Font Software is licensed under the SIL Open Font License, Version 1.1.
This license is copied below, and is also available with a FAQ at:
http://scripts.sil.org/OFL
 */

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video {
    font-size: 100%;
    font: inherit;
    padding: 0;
    border: 0;
    margin: 0;
    vertical-align: baseline;
}
body {
    line-height: 1;
}
blockquote, q {
    quotes: none;
}
blockquote:before, blockquote:after, q:before, q:after {
    content: '';
    content: none;
}
table {
    border-collapse: collapse;
    border-spacing: 0;
}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {
    display: block;
}
.clear {
    clear: both;
}
.cf:before, .cf:after {
    content: " ";
    display: table;
}
.cf:after {
    clear: both;
}
.sticky {
}
.bypostauthor {
}
.wp-caption {
}
.wp-caption-text {
}
.gallery-caption {
}
.alignright {
    float: right;
}
.alignleft {
    float: left;
}
.aligncenter {
}
body {
    background: #fff;
    font-family: 'Roboto', sans-serif;
    font-size: 20px;
    color: #2a2a2a;
}
a {
    color: #000;
    text-decoration: none;
}
a[href^="tel"] {
    color: inherit;
    text-decoration: none !important;
}
h1, h2, h3, h4 {
    font-family: 'Sanchez', serif;
    color: #000;
    font-size: 40px;
	line-height: 115%;
}
strong {
    font-family: 'Roboto', sans-serif;
	font-weight: 700;
}
@-webkit-keyframes zoom {0% { -webkit-transform: scale(1) }100% {-webkit-transform: scale(1.15);}}
@keyframes zoom {0% { -webkit-transform: scale(1);transform: scale(1);} 100% {-webkit-transform: scale(1.15);transform: scale(1.15);}}
.outer, .t-outer {
    width: 85%;
    margin: 0 auto;
    max-width: 1600px;
    position: relative;
}


/*-------------------------Slide UP---------------------------*/
#content .outer > div {
    transform: translateY(120px);
    -webkit-transform: translateY(120px);
}
@media screen and (orientation:portrait){
	.teaser + .outer > div:nth-child(1){
		transform: translateY(0) !important;
		-webkit-transform: translateY(0) !important;
	}
}
.move {
    animation: come-in 0.8s ease forwards;
}
.visible {
    transform: translateY(0) !important;
    -webkit-transform: translateY(0) !important;
    animation: none;
}
@keyframes come-in {
to {
transform: translateY(0);
}
}
@-webkit-keyframes come-in {
to {
-webkit-transform: translateY(0);
}
}
 @keyframes tabs-show {
from {
opacity: 0;
}
to {
opacity: 1;
}
}
@-webkit-keyframes tabs-show {
from {
opacity: 0;
}
to {
opacity: 1;
}
}

/*--------------------Preloader--------------------*/
.spinner-wrapper {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #000;
    z-index: 10000;
}
.spinner {
    width: 40px;
    height: 40px;
    position: absolute;
    top: 50%;
    left: 50%;
    margin-left: -20px;
    margin-top: -20px;
    background-color: #666666;
    border-radius: 100%;
    -webkit-animation: sk-scaleout 1.0s infinite ease-in-out;
    animation: sk-scaleout 1.0s infinite ease-in-out;
}
@-webkit-keyframes sk-scaleout {
0% {
-webkit-transform: scale(0)
}
100% {
-webkit-transform: scale(1.0);
opacity: 0;
}
}
@keyframes sk-scaleout {
0% {
-webkit-transform: scale(0);
transform: scale(0);
}
100% {
-webkit-transform: scale(1.0);
transform: scale(1.0);
opacity: 0;
}
}

/*----------------Header-----------------*/
header{background: rgba(255,255,255,0.9);position: fixed;top: 0;left: 0;width: 100%;z-index: 3;}
header > .menu{height: 70px;position: relative;width: 85%;z-index: 10;max-width: 1600px;margin: 0 auto;}
header .logo{position: absolute;left: 0;top: 70px;transform: translate(-50%, -50%);line-height: 0;}
header nav{text-align: center;position: relative;width: 90%;padding: 0 5%; box-sizing: border-box;margin: 0 auto;}
header nav > a{line-height: 70px;color: #999;position: absolute;top: 0;}
header nav > a.home{left: 0;}
header nav > a.login{right: 0;}
header nav ul{margin: 0;padding: 0;}
header nav ul > li{display: inline-block;padding: 0 25px;line-height: 70px;}
header nav ul > li > a{font-size: 24px;color: #000;font-family: 'Sanchez', serif;text-transform: uppercase;letter-spacing: 1px;}
header nav ul > li > a:hover, header nav ul > li.current-menu-item > a{/*color: #666666;*/}
header nav ul > li.current-menu-item.menu-item-	home > a{color: #fff;}
header nav ul > li.current-menu-item.menu-item-home > a:hover{color: #666666;}
header a:hover{color: #666666;}
.button{display: none;}
.mobile-menu{display: none;}
.mobile-kontakt{display: none;}

@media screen and (max-width:1800px){
}

@media screen and (max-width:1600px){
	header .logo{width: 95%;}
	header > .cf{height: 160px;}
}

@media screen and (max-width:1400px){
	header .logo{width: 90%;}
	header nav ul > li{padding: 0 15px;}
}
@media screen and (max-width:1200px){
	header nav ul > li {padding: 0 7px;}
}
@media screen and (max-width:767px){
	header nav{display: none;}
	header .menu{height: 56px;position: fixed;top: 0;left: 0;width: 100%;z-index: 3;border-bottom: 2px solid #666666;background: #000;}
	header .logo{width: 80%;}
	.mobile-kontakt{width: 45%; display: block;line-height: 56px;text-align: right;right: 5%;position: absolute;}
	.mobile-kontakt a{color: #fff;padding: 0;}
	.button{display: block;padding: 0;width: 45%;left: 5%;position: absolute;}
	.button > span{display: inline-block;position: absolute;top: 50%;transform: translateY(-50%);}
	.button > span > a{color: #fff;margin-left: 10px;}
	.x {display: inline-block;overflow: hidden;margin: 0;padding: 0;width: 35px;height: 56px;left: 0;font-size: 0;text-indent: -9999px;margin-top: 0;appearance: none;box-shadow: none;border-radius: none;border: none;cursor: pointer;background: transparent;z-index: 5;}
	.x span {display: block;position: relative;top:0;left: 0;right: 0;height: 4px;background: #666666;}
	.x span::before,.x span::after {position: absolute;display: block;left: 0;width: 100%;height: 4px;background-color: #666666;content: "";}
	.x span::before {top: -10px;}
	.x span::after {bottom: -10px;}
	.lines span {transition: background 0.3s 0s;}
	.lines span::before,
	.lines span::after {transition-duration: 0.3s, 0.3s;}
	.lines span::before {transition-property: top, transform;}
	.lines span::after {transition-property: bottom, transform;}
	.lines.is-active span { background: none;}
	.lines.is-active span::before {top: 0;transform: rotate(45deg);}
	.lines.is-active span::after {bottom: 0;transform: rotate(-45deg);}
	.lines.is-active span::before,
	.lines.is-active span::after {}
	header > .cf{height: 130px;padding-top: 58px;}
	header > .cf > div:nth-child(2){display: block;width: 100%;}
	header > .cf > div {display: none;}
	.mobile-menu{display: block;position: fixed;height: calc(100% - 55px);top: 55px;width: 100%;left: 0;z-index: 3;transition: opacity 0.8s; background: #000; background: rgba(0, 0, 0, 0.97);visibility: hidden;opacity: 0}
	.mobile-menu .menu{padding: 0;margin: 15px 0;}
	.mobile-menu > nav{position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);}
	.mobile-menu .menu > li{text-align: center;list-style-type: none;letter-spacing: 0px;}
	.mobile-menu .menu > li > a{padding-top: 10px;padding-bottom: 10px;width: 100%;font-size: 36px;color: #fff;line-height: 75px;white-space: nowrap;}
	.mobile-menu .menu > li > a:hover, .mobile-menu .menu > li.current-menu-item:not(.menu-item-home) > a{color: #666666;}
	header.is-active + .mobile-menu{visibility: visible;opacity: 1;}
}

/*----------------Content------------------*/
#content{
    position: relative
}
.teaser {
    width: 100%;
    margin: 0 auto;
    position: relative;
    max-width: 100%;
    font-size: 0;
	margin-bottom: 100px;
}
.teaser ul.slides > li{
	position: relative;
	overflow: hidden;
}
.teaser ul.slides > li img{
	width: 100%;
}
.teaser .overlay{
	position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    z-index: 2;
	width: 80%;
	text-align: center;
}
.teaser .icon{
	position: absolute;
    bottom: 0;
    transform: translate(-50%,50%);
    left: 50%;
    max-width: 450px;
	z-index: 1;
}
#content .outer > div {
	margin-bottom: 100px;
    position: relative;
    display: table;
    width: 100%;
    padding: 0 5%;
    box-sizing: border-box;
    table-layout: fixed;
}
#content .outer > div:nth-child(2n-1){
	direction: rtl;
}
#content .outer > div > .bild {
	width: 50%;
    max-width: 720px;
    position: relative;
    top: 0;
    left: 0%;
    font-size: 0;
    display: table-cell;
    vertical-align: top;
    direction: ltr;
}
#content .outer > div > .bild ul.slides > li img {
    width: 100%;
}
#content .outer > div > .bild ul.slides > li{
	position: relative;
}
#content .outer > div > .bild ul.slides span {
    position: absolute;
    bottom: 0px;
    text-align: left;
    left: 0;
    font-size: 18px;
	line-height: 175%;
    color: #fff;
    padding: 30px;
}
#content .outer > div > .text {
	width: auto;
    max-width: 720px;
    position: relative;
    left: inherit;
    top: 0;
    height: 100%;
    display: table-cell;
    vertical-align: middle;
    direction: ltr;
}
#content .outer > div > .text > div {
    padding-left: 75px;
    padding-right: 0;
}
#content .outer > div > .text > div > h4, .t-text h4 {
    margin-bottom: 40px;
}
#content .outer > div > .text > div > span, .t-text span {
    line-height: 150%;
}
#content .outer > div > .text > div > span p {
    margin-top: 40px;
}
.home #content .outer > div > .text > div > span p{
	font-size: 100%;
}
#content .outer > div:nth-child(2n-1) > .text > div {
    padding-left: 0;
    padding-right: 75px;
}
#content .text a {
    color: #000;
}
#content .text a:hover{
	color: #666666;
}
#content .text ul {
	margin: 0;
    margin-top: 40px;
    padding-left: 20px;
}
#content .outer > .referenzen-liste{
	text-align: center;
	padding-bottom: 0;
	margin-bottom: -50px;
}
#content .referenzen-liste > div{
	width: 25%;
	float: left;
	padding: 25px;
	padding-top: 0;
	box-sizing: border-box;
	margin-bottom: 25px;
}
#content .referenzen-liste > div > div{
	background: #f0f0f0;
	height: 240px;
}
#content .referenzen-liste > div > span{
	display: block;
	margin-top: 15px;
	text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}
#content .referenzen-liste > div > div > img{
	mix-blend-mode: multiply;
	position: relative;
    top: 50%;
    transform: translateY(-50%);
}
.flex-control-paging li a{
	background: #fff !important;
	border: 1px solid #fff !important;
}
.flex-control-paging li a.flex-active{
	background: #666666 !important;
	border: 1px solid #666666 !important;
}
.dreieck{
    width: 100%;
    height: 250px;
    margin: 0 auto;
    margin-top: -250px;
    z-index: 1;
    position: absolute;
    top:1px;
    overflow: hidden;
}
.dreieck > div.overlay{
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 20px;
    border-bottom: 4px dotted #fff;
    z-index: 2;
}
.dreieck > div.overlay2{
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 20px;
    border-top: 15px solid #fff;
    z-index: 0;
}
.dreieck > div.rahmen{
	position: absolute;
    top: 105px;
    left: calc(50% - 150px);
    width: 250px;
    height: 250px;
    transform: rotate(45deg);
    border: 25px solid;
    margin: 0 auto;
    z-index: 1;
}
.dreieck > div.rahmen2{
	position: absolute;
    top: 95px;
    left: calc(50% - 160px);
    width: 270px;
    height: 270px;
    transform: rotate(45deg);
    border: 25px solid;
    margin: 0 auto;
    z-index: 0;
	border-color: #fff;
}
.dreieck > div.linie{
    position: absolute;
    top: 125px;
    left: calc(50% - 129px);
    width: 250px;
    height: 250px;
    transform: rotate(45deg);
    border: 4px dotted #fff;
    margin: 0 auto;
    z-index: 3;
}
.dreieck.schwarz > div.overlay, .dreieck.schwarz > div.linie{
	background: #000;
}
.dreieck.schwarz > div.rahmen{
	background: #000;
	border-color: #000;
}
.dreieck.grau > div.overlay, .dreieck.grau > div.linie{
	background: #d3d3d3;
}
.dreieck.grau > div.rahmen{
	background: #d3d3d3;
	border-color: #d3d3d3;
}

@media screen and (max-width:1600px) {
	.teaser{margin-bottom: 80px;}
	.teaser-text{padding: 80px 0 95px 0;}
	#content .outer > div {margin-bottom: 80px;}
	#content .outer > div > .text > div > h4 {margin-bottom: 20px;}
}

@media screen and (max-width:1400px){
	.teaser-text > span {width: 68%;line-height: 150%;}
	.flexslider-teasertext{width: 50%;}
	#content .outer > div > .text > div {padding-right: 0;padding-left: 50px;}
	#content .outer > div:nth-child(2n-1) > .text > div {padding-left: 0;padding-right: 50px;}
	#content .outer > div > .bild ul.slides span{font-size: 16px;}
}

@media screen and (max-width:1200px) {
	.teaser{margin-bottom: 50px;}
	.teaser-text{padding: 70px 0 80px 0;}
	.flexslider-teasertext{width: 60%;}
	#content .outer > div{margin-bottom: 50px;}
	#content .outer > div > .text > div > span p {margin-top: 20px;}
	#content .text ul {margin: 0;margin-top: 20px;}
	#content .outer > div > .bild ul.slides span{font-size: 14px;}
	.teaser .icon{max-width: 220px;}
	.dreieck{height: 150px;margin-top: -150px;}
}

@media screen and (max-width:1200px) and (orientation:portrait) {
	#content .outer > div > .text > div > span p {margin-top: 20px;}
	#content .text ul {margin: 0;margin-top: 20px;}
}


@media screen and (max-width:767px) {
	#content{
		padding-top: 55px;
	}
	.dreieck {
		width: 100%;
		height: 150px;
		margin: 0 auto;
		margin-top: -150px;
		z-index: 1;
		position: absolute;
		top: 1px;
		overflow: hidden;
	}
	.dreieck > div.overlay {
		position: absolute;
		bottom: 0;
		left: 0;
		width: 100%;
		height: 20px;
		border-bottom: 4px dotted #fff;
		z-index: 2;
	}
	.dreieck > div.rahmen {
		position: absolute;
		top: 80px;
		left: calc(50% - 100px);
		width: 150px;
		height: 150px;
		transform: rotate(45deg);
		border: 25px solid;
		margin: 0 auto;
		z-index: 1;
	}
	.dreieck > div.rahmen2 {
		position: absolute;
		top: 65px;
		left: calc(50% - 110px);
		width: 170px;
		height: 170px;
		transform: rotate(45deg);
		border: 25px solid;
		margin: 0 auto;
		z-index: 0;
		border-color: #fff;
	}
	.dreieck > div.linie {
		position: absolute;
		top: 100px;
		left: calc(50% - 80px);
		width: 150px;
		height: 150px;
		transform: rotate(45deg);
		border: 4px dotted #fff;
		margin: 0 auto;
		z-index: 3;
	}
	#shop {
		margin-top: 125px !important;
		padding-top: 0px;
		display: block;
		margin-bottom: 0;
	}
	#shop > .outer > h4{
		padding-top: 50px;
	}
	#shop > .outer > h4 + span{
		margin-bottom: 50px;
	}
	#content #shop .artikel-1{
		width: 50%;
	}
	#content #shop .artikel-2{
		width: 100%;
	}
	.flexslider .slides img, #content .outer > div > .bild ul.slides > li img {
		max-width: 100%;
		margin-left: 0;
		height: auto;
		width: 100%;
	}
	.teaser {
		margin-bottom: 60px;
		margin-top: 0;
	}
	.teaser ul.slides > li:nth-child(2) img{
		object-position: 65% 50%;
	}
	.teaser ul.slides > li:nth-child(3) img{
		object-position: 72% 50%;
	}
	.teaser ul.slides > li:nth-child(4) img{
		object-position: 65% 50%;
	}
	.teaser ul.slides > li img{
		width: 200%;
		margin-left: -50%;
		max-width: 200%;
	}

	.textslider .flex-viewport {
		left: 9%;
	}
	.textslider .slides {
		font-size: 20px;
		line-height: 24px;
	}
	.teaser-text {
		display: block;
		width: 100%;
		margin: 0 auto;
		line-height: 150%;
		margin-bottom: 0;
		padding: 10% 0;
	}
	.teaser-text > span {
		width: 82%;
		font-size: 24px;
		line-height: 135%;
		text-align: left;
	}
	.teaser-text > span strong{
		display: block;
		margin-bottom: 25px;
	}
	.teaser-text > span br{display: none;}
	.flexslider-teasertext{
		width: 90%;
		font-size: 16px;
	}
	.flexslider-teasertext .flex-control-nav{
		display: block;
	}
	.flexslider-teasertext .flex-direction-nav{
		display: none;
	}
	#content .outer > div {
		padding-bottom: 0;
		margin-bottom: 60px;
	}
	#content #shop .artikel-1:nth-child(2n+1) {
		clear: left;
	}
	#content .outer > div:nth-child(1){
		transform: none !important;
	}
	#content .outer > div:nth-child(2n-1){
		direction: ltr;
	}
	#content .outer > div:nth-child(2n-1) > .text > div{
		padding-right: 0;
	}
	#content .outer > div > .bild {
		width: 100%;
		position: relative;
		left: 0;
		margin-bottom: 10%;
		overflow: hidden;
		display: block;
	}
	#content .outer > div > .text{
		display: block;
	}
	#content .outer > div > .bild ul.slides span {
		padding: 9%;
	}
	#content .outer > div > .text > div {
		padding-right: 0;
		position: relative;
		top: 0;
		transform: translateY(0);
		padding-left: 0;
	}
	#content .outer > div:nth-child(2n) > .text > div {
		padding-left: 0;
		padding-right: 0;
	}
	#content .outer > div > .text > div > h4 {
		margin-bottom: 25px;
	}
	#content .outer > div > .text > div > h4 > p > br {
		display: none;
	}
	#content .outer > div > .text > div > span, .t-text span{
		line-height: 150%;
	}
	#content .text a{
		display: inline-block;
	}
	#content .outer > .referenzen-liste{
		width: 82%;
		margin: 0 auto;
	}
	#content .referenzen-liste > div{
		margin-bottom: 10px;
		width: 50%;
		padding: 10px;
	}
	#content .referenzen-liste > div:nth-child(2n-1){
		padding-left: 0;
	}
	#content .referenzen-liste > div:nth-child(2n){
		padding-right: 0;
	}
	#content #shop > div > .container{
		margin: 0;
	}
	#content #shop .artikel > div{
		padding: 0;
	}
	#content #shop .artikel-1:nth-child(2n+1) > div{
		padding-right: 10px;
	}
	#content #shop .artikel-1:nth-child(2n+2) > div{
		padding-left: 10px;
	}
}


/*----------------Footer------------------*/

@media screen and (max-width:1600px){
	.referenzen > div{width: 90%;width: calc(90% + 20px);}
	.referenzen{margin-bottom: 80px;margin-top: 80px;}
	.referenzen > span{line-height: 160px}
	.referenzen > div > a{margin-bottom: 55px;}
	.flexslider-referenzen{padding-bottom: 50px;}
}
@media screen and (max-width: 1200px){
	.referenzen{margin-bottom: 50px;margin-top: 50px;}
	.referenzen > div > a{margin-bottom: 30px;}
	.referenzen > span{line-height: 100px}
}
@media screen and (max-width:767px){
	.flexslider-referenzen .flex-viewport{width: 100%;}
	.flexslider-referenzen .flex-direction-nav{display: none;}
	.referenzen{margin-bottom: 65px;margin-top: 65px;}
	.referenzen > div {width: 82%;width: calc(82% + 20px);}
	.referenzen > div > span:nth-child(2){right: 0;}
	.referenzen > div > div{width: 50%;}
}

#footer{
	background: #000;
	padding: 100px 0;
	color: #fff;
	position: relative;
	line-height: 135%;
}
#footer a{
	color: #fff;
	text-decoration: underline;
}
#footer a:hover{
	color: #999;
}
#footer > .cf > div {
	padding: 0 5%;
	margin: 0 -20px;
}
#footer > .cf > div > div{
	width: 25%;
	float: left;
	padding: 0 20px;
	box-sizing: border-box;
}
#footer iframe{
	width: 100%;
	padding-top: 10px;
	box-sizing: border-box;
}
#footer h4{
	margin-bottom: 25px;
	display: block;
	color: #fff;
}
.impagb#content .move{
	animation: none;
}
.impagb#content {
	padding: 0px 0 200px;
}
.impagb#content .outer > div > .text {
    width: 100%;
    left: 0;
    max-width: 100%;
    position: relative;
    line-height: 150%;
}
.impagb#content .outer > div > .text p {
    margin-bottom: 25px;
}
.impagb#content .outer > div {
    padding-bottom: 0;
}
.impagb#content .outer > div > .text > div {
    position: relative;
    top: 0;
    transform: none;
    padding-left: 0;
}

@media screen and (max-width:1600px){
	#footer > .outer > div.flexslider-vorteile > div{padding-bottom: 90px;}
	#footer .bottomline{line-height: 100px;}
}
@media screen and (max-width:1400px) {
	.impagb#content .outer > div > .text {width: 90%;margin: 0 auto;}
	#footer > .outer > div > #kontakt > div {padding: 7.5%;line-height: 150%;}

}
@media screen and (max-width:1200px) {
	.referenzen > div > span {padding: 45px 0;}
	.flexslider-referenzen{padding-bottom: 60px;}
	.referenzen .flex-control-nav{padding-top:60px;}
}
@media screen and (max-width:767px) {
	#footer{padding-bottom: 0;margin-top: 125px;}
	#footer > .cf > div{margin: 0;}
	.woocommerce-cart #footer, .woocommerce-checkout #footer{margin-top: 0;}
	#footer > .cf > div > div{width: 100%;float: none;margin-bottom: 25px;padding: 0;}
	#content .referenzen.outer > div {padding: 25px;}
	.referenzen .flex-control-nav{display: none;}
	#footer > .outer > div > img:nth-child(1), #footer > .outer > div > img:nth-child(2){width: 100%;}
	#footer #kontakt,#footer iframe{position: relative;width: 100%;}
	#footer #kontakt > div{transform: none;top: 0;}
	#footer > .outer > div > #kontakt > div{padding: 9%;line-height: 175%;}
	.impagb#content {padding: 0px;}
	.impagb#content .outer > div > .text > div{padding-top: 60px;}
	.impagb#content .outer > div > .text {width: 82%;left: 0;position: relative;}
	.impagb#content .text a {word-wrap: break-word;}
	#footer > .logozeile > .outer > div img{max-width: 70%;}
}


/*----------------Responsive-------------------*/
@media screen and (max-width:1600px) {
	body, #footer > .outer, #footer #kontakt > div, .referenzen a > span {font-size: 18px;}
	h1, h2, h3, h4, .referenzen > span, .referenzen > p {font-size: 36px;}
	.teaser ul.slides > li > div > div{font-size: 46px;}
	.menu > li > a {font-size: 22px;}
	header nav > a{font-size: 20px;}
	.outer {width: 90%;}
}

@media screen and (max-width:1400px) {
	h1, h2, h3, h4, .referenzen > span, .referenzen > p  {font-size: 32px;}
	.teaser ul.slides > li > div > div{font-size: 38px;}
	.menu > li > a {font-size: 20px;}
	.logo-zeile, #footer > .outer {font-size: 18px;}
}

@media screen and (orientation:portrait){
	.teaser ul.slides > li > div > div{font-size: 46px;}
}
@media screen and (max-width:1200px) {
	body, #footer > .outer, .referenzen a > span   {font-size: 16px;}
	h1, h2, h3, h4 {font-size: 30px;}
	.menu > li > a {font-size: 14px;}
	.flexslider-teasertext{font-size: 18px;}
}

@media screen and (max-width:1000px) {
	h1, h2, h3, h4 {font-size: 28px;}
}

@media screen and (max-width:1200px) and (orientation:portrait) {
	body, #footer > .outer, .referenzen a > span   {font-size: 15px;}
	#footer #kontakt > div{font-size: 14px;}
	.teaser ul.slides > li > div > div{font-size: 38px;}
	h1, h2, h3, h4, .referenzen > span, .referenzen > p {font-size: 24px;}
	.logo-zeile {font-size: 18px;}
}

@media screen and (max-width:767px) {
	body, #footer > .outer, #footer #kontakt > div, .referenzen a > span, .referenzen > div > div > a > span  {font-size: 18px;}
	.menu a{font-size: 22px;padding: 0;}
	h1, h2, h3, h4, .teaser-text > span strong, .referenzen > span, .referenzen > p {font-size: 26px;}
	.outer-wrapper {width: 100%;}
	.outer {width: 100%;}
	.teaser ul.slides > li > div > div {font-size: 30px;right: 35%;left: 2.5%;}
	.teaser ul.slides > li > div > div br{display: none;}
}