

.search-icon-pc { background-image: url('../images/search_button_white.png'); }
body.content-reached .search-icon-pc { background-image: url('../images/search_button_green.png'); }



#page-wrap {
	padding: 0;
}

.fullscreen-height { height: 100vh; }

video#bgvid { 
	position: fixed;
	top: 50%;
	left: 50%;
	min-width: 100%;
	min-height: 100%;
	width: auto;
	height: auto;
	z-index: -100;
	-ms-transform: translateX(-50%) translateY(-50%);
	-moz-transform: translateX(-50%) translateY(-50%);
	-webkit-transform: translateX(-50%) translateY(-50%);
	transform: translateX(-50%) translateY(-50%);
	background-size: cover; 
}

h2 { font-size: 2.4em; font-weight: 200; }
h3 { font-size: 1.8em; font-weight: 200; }



ul.top-nav li a { color: #fff; }
ul.top-nav li a:hover { color: #ddd; }


.scroll-button {
	display: block;
	width: 80px;
	height: 80px;
	background: transparent url('../images/scroll_down.png') no-repeat center center;
	position: absolute;
	bottom: 20px;
	left: 50%;
	margin-left: -40px;
	z-index: 40;
	cursor: pointer;

	-moz-transition: all 0.3s;
	-webkit-transition: all 0.3s;
	transition: all 0.3s;	
}

a.enquiry-button {
	top: 50%;
	-webkit-transform: translate(0,-50%);
	-ms-transform: translate(0,-50%);
	transform: translate(0,-50%);
	z-index: 60;
	
	background: #88aa66;
	color: #FFF;
	border: none;
}

#welcome-home {
	display: block;
	position: relative;
	/*
	background-color: #b1c91f;
	background-image: url('../images/home_bg.jpg');
    background-attachment: scroll;
    background-position: center center;
    background-repeat: no-repeat;
    background-size: cover;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	*/
	background: transparent;
}

.header-semitrans {
	display: block;
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0; right: 0; bottom: 0; left: 0;
	
	/*
	background: #b1c91f;
	opacity: 0.80;
	*/
	
	background: #000;
	opacity: 0.70;
	
	-webkit-transition: 1s ease;
	-moz-transition: 1s ease;
	-o-transition: 1s ease;
	-ms-transition: 1s ease;
	transition: 1s ease;
}
body.nav-fixed .header-semitrans { background: #b1c91f; opacity: 1; }

.header-overlay {
	display: block;
	width: 400px;
	position: absolute;
	max-width: 60%;
	top: 50%;
	left: 50%;
	-webkit-transform: translate(-50%,-50%);
	-ms-transform: translate(-50%,-50%);
	transform: translate(-50%,-50%);
	z-index: 60;
}

.header-overlay img {
	display: block;
	width: 100%;
	height: auto;
}


.bounce {
  -moz-animation: bounce 20s infinite;
  -webkit-animation: bounce 20s infinite;
  animation: bounce 20s infinite;
}

@keyframes bounce {
  0%, 2%, 5%, 8%, 10% {
    transform: translateY(0);
  }
  4% {
    transform: translateY(-30px);
  }
  6% {
    transform: translateY(-15px);
  }
}

.content-col-0 { width: 100%; max-width: 800px; text-align: center; float: none; margin: 0 auto; } 

.content-home { width: 100%; max-width: 1140px; float: none; margin: 0 auto; padding: 100px 0; clear: both; }

.content-home img { max-width: 100%; height: auto; }

.content-home.space { padding: 160px 0; }
.content-home.narrow { max-width: 800px; }
.content-home.intro { padding: 160px 0; }
.intro h1 { padding: 0 0 60px 0; }


/* --- Masonry --- */

.teaser-home {
	display: block;
	width: 100%;
	padding: 0;
	margin: 0 auto;
}

.cascading-grid {
	display: block;
	width: 1110px;
	max-width: 100%;
	float: left;
	margin: 0 auto;
}

.tile { width: 25%; float: left; }
.tile a { display: block; color: #000; text-decoration: none; }
.tile.w2 { width: 50%; }
.tile, .tile.w2 { max-width: 100%; }

.tile-relative { display: block; position: relative; }
.tile-image, .tile-text-image {
	display: block;
	width: 100%;
	position: absolute;
	left: 0;
	top: 0;
	opacity: 1;
	-webkit-transition: opacity 0.3s ease;
	-moz-transition: opacity 0.3s ease;
	-o-transition: opacity 0.3s ease;
	-ms-transition: opacity 0.3s ease;
	transition: opacity 0.3s ease;
}
.tile img { display: block; width: 100%; height: auto; }

.tile .tile-text { display: block; width: 100%; background: #f5f5f5; position: relative; text-align: left; overflow: hidden; }

.tile-text:after { display: block; content: ' '; }
.tile.w1.h1 .tile-text:after, .tile.w2.h2 .tile-text:after { padding-top: 100%; }
.tile.w1.h2 .tile-text:after { padding-top: 200%; }
.tile.w2.h1 .tile-text:after { padding-top: 50%; }

.tile-text .text-center {
	display: block;
	width: 70%;
	position: absolute;
	left: 15%;
	top: 50%;
	-webkit-transform: translate(0,-50%);
	-ms-transform: translate(0,-50%);
	transform: translate(0,-50%);
	text-align: left;
}

.tile:hover .tile-text-image { opacity: 0; }

.tile-button {
	display: inline-block;
	padding: 10px 0 0 0;
	border-top: 1px solid #ccc;
	color: #000;
}

.tile .tile-image-header {
	display: block;
	padding: 0;
	font-size: 2em;
	line-height: 1.2em;
	font-weight: 200;
	text-shadow: 0 0 5px rgba(0,0,0,0.3);
	color: #FFF;
	font-family: 'bgl_sans', 'Times New Roman', Georgia, Serif;
	position: absolute;
	bottom: 0;
	left: 0;
	padding: 20px;
}

.tile .tile-text-header {
	display: block;
	padding: 0;
	font-size: 1.4em;
	line-height: 1.2em;
	color: #000;
	font-family: 'bgl_sans', 'Times New Roman', Georgia, Serif;
	font-weight: 200;
}
.tile p {
	display: block;
	padding: 15px 0;
}

/* Bild neben Text START */
.tile.image-left:hover .tile-text-image, .tile.image-right:hover .tile-text-image { opacity: 0.8; }
.tile.image-left img, .tile.image-right img { width: 50%; }
.tile.image-left .tile-text .text-center {
	width: 35%;
	left: 57.5%;
}
.tile.image-right .tile-text .text-center {
	width: 35%;
	left: 7.5%;
}
.tile.image-left .tile-image-header, .tile.image-right .tile-image-header { max-width: 50%; }
/* Bild neben Text ENDE */

.tile.dark-bg .tile-text  { background: #b1c91f; }
.tile.dark-bg a, .tile.dark-bg .tile-text-header, .tile.dark-bg .tile-button { color: #fff; }
.tile.dark-bg .tile-button { border-top: 1px solid rgba(255,255,255,0.7); }

.tile.dark-bg.darker .tile-text  { background: #57834a; }


.client-logo {
	display: block;
	width: 20%;
	position: relative;
	float: left;
	border-right: 1px solid #eee;
}
.client-logo.col-5 { border-right: none; }
.client-logo:after {
	display: block;
	content: ' ';
	padding-top: 70%;
}
.client-logo.clear-5:before {
	display: block;
	content: ' ';
	float: none;
	clear: both;
	height: 0;
	overflow: hidden;
}
.client-logo img {
	display: block;
	width: auto;
	height: auto;
	position: absolute;
	left: 50%;
	top: 50%;
	-webkit-transform: translate(-50%,-50%);
	-ms-transform: translate(-50%,-50%);
	transform: translate(-50%,-50%);
	text-align: left;
	
    filter: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='grayscale'><feColorMatrix type='matrix' values='0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0'/></filter></svg>#grayscale");
    filter: gray;
    -webkit-filter: grayscale(100%);
	opacity: 0.7;
	
    -webkit-transition: 0.3s ease-in-out;
    -moz-transition: 0.3s ease-in-out;
    -o-transition: 0.3s ease-in-out;
	-ms-transition: 0.3s ease-in-out;
    transition: 0.3s ease-in-out;
}
.client-logo:hover img {
    filter: none;
    -webkit-filter: none;
    opacity:1;
}
.clear-div-2, .clear-div-3, .clear-div-4, .clear-div-6, .clear-div-7, .clear-div-8 { display: none; }
.clear-div-5 { display: block; clear: both; float: none; height: 0; border-top: 1px solid #eee; }




.mosaic-part {
	display: block;
	width: 16.66%;
	float: left;
	overflow: hidden;
	position: relative;
}
.mosaic-part:after {
	display: block;
	content: ' ';
	padding-top: 100%;
}
.mosaic-part img {
	display: block;
	width: auto;
	max-width: 102%;
	height: auto;
	position: absolute;
	left: 50%;
	top: 50%;
	-webkit-transform: translate(-50%,-50%);
	-ms-transform: translate(-50%,-50%);
	transform: translate(-50%,-50%);

    filter: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='grayscale'><feColorMatrix type='matrix' values='0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0'/></filter></svg>#grayscale");
    filter: grayscale(80%);
    -webkit-filter: grayscale(80%);
	opacity: 0.8;
	
	-webkit-transition: 0.5s;
	-moz-transition: 0.5s;
	-o-transition: 0.5s;
	-ms-transition: 0.5s;
	transition: 0.5s;
}
.mosaic-part:hover img {
    filter: none;
    -webkit-filter: none;
    opacity: 1;
}



.map-wrap {
	display: block;
	width: 100%;
	height: 500px;
	height: 70vh;
	overflow: hidden;
}
#map {
	height: 100%;
}

#footer-wrap { background: #f1f1f1; }


@media only screen and (max-width: 1280px) { 
	.tile { width: 50%; }
	.tile.w2 { width: 100%; }
	
	.mosaic-part { width: 25%; }
	.mosaic-part img {
		filter: none;
		-webkit-filter: none;
		opacity: 1;
	}
}

@media only screen and (max-width: 959px) {
	
	h1.slogan { font-size: 3em; }

	video#bgvid { display: none; }
	.header-semitrans { background: #b1c91f; opacity: 1; }
	
	.client-logo { width: 25%; }
	.clear-div-5 { display: none; }
	.clear-div-4 { display: block; clear: both; float: none; height: 0; border-top: 1px solid #eee; }
	.client-logo.col-4 { border-right: none; }
	.client-logo.col-5 { border-right: 1px solid #eee; }
	
}


@media only screen and (min-width: 720px) {
	.content-home.cols-2-text .frame {
		-webkit-column-count: 2;
		-moz-column-count: 2;
		column-count: 2;
		-webkit-column-gap: 40px;
		-moz-column-gap: 40px;
		column-gap: 40px;
		-webkit-column-rule: 1px solid #DDD;
		-moz-column-rule: 1px solid #DDD;
		column-rule: 1px solid #DDD;
	}
	
}


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

	.content-col-0 .ce-bodytext {
		-webkit-column-count: auto;
		-moz-column-count: auto;
		column-count: auto;
	}
	
	.tile, .tile.w1, .tile.w2 { width: 100%; margin-top: 15px; }
	.tile .tile-height, .tile.w2 .tile-height { display: none; }
	.tile-image, .tile-text-image, .tile-text .text-center { position: relative; top: auto; right: auto; bottom: auto; left: auto; }
	.tile-text:after, .tile.w1.h1 .tile-text:after, .tile.w2.h2 .tile-text:after, .tile.w1.h2 .tile-text:after, .tile.w2.h1 .tile-text:after { display: none; }
	.tile-text .text-center {
		width: 100%;
		padding: 20px;
		-webkit-transform: translate(0,0);
		-ms-transform: translate(0,0);
		transform: translate(0,0);
	}
	.tile:hover .tile-text-image { opacity: 1; }
	.tile-image, .tile-text-image { overflow: hidden; }
	.tile-image img, .tile-text-image img {
		position: absolute;
		left: 0;
		top: 50%;
		-webkit-transform: translate(0,-50%);
		-ms-transform: translate(0,-50%);
		transform: translate(0,-50%);		
	}
	.tile-image:after, .tile-text-image:after {
	  padding-top: 50%;
	  display: block;
	  content: '';		
	}
	
	/* Bild neben Text */
	.tile.image-left img, .tile.image-right img { width: 100%; }
	.tile.image-left .tile-text .text-center, .tile.image-right .tile-text .text-center {
		position: relative; top: auto; right: auto; bottom: auto; left: auto;
		width: 100%;
		padding: 20px;
		-webkit-transform: translate(0,0);
		-ms-transform: translate(0,0);
		transform: translate(0,0);
	}
	
	.tile-text.no-text { display: none; }
	
	.client-logo { width: 50%; }
	.clear-div-2 { display: block; clear: both; float: none; height: 0; border-top: 1px solid #eee; }
	.client-logo.col-2, .client-logo.col-4 { border-right: none; }
	
	.mosaic-part { width: 50%; }

}

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