/* fallback */ 
@font-face {
	font-family: 'Material Icons';
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url(https://fonts.gstatic.com/s/materialicons/v140/flUhRq6tzZclQEJ-Vdg-IuiaDsNc.woff2) format('woff2');
  	font-display: swap;
}
  


/* roboto-regular - latin */
@font-face {
	font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
	font-family: 'Roboto';
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url('https://gerlach.media/fonts/roboto-v32-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
  }
  /* roboto-500 - latin */
  @font-face {
	font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
	font-family: 'Roboto';
	font-style: normal;
	font-weight: 500;
	font-display: swap;
	src: url('https://gerlach.media/fonts/roboto-v32-latin-500.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
  }
/* roboto-600 - latin */
@font-face {
	font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
	font-family: 'Roboto';
	font-style: normal;
	font-weight: 600;
	font-display: swap;
	src: url('https://gerlach.media/fonts/roboto-v47-latin-600.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
  }
    /* roboto-700 - latin */
  @font-face {
	font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
	font-family: 'Roboto';
	font-style: normal;
	font-weight: 700;
	font-display: swap;
	src: url('https://gerlach.media/fonts/roboto-v32-latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
  }


/* inter-regular - latin */
@font-face {
	font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
	font-family: 'Inter';
	font-style: normal;
	font-weight: 400;
	font-display: swap;
	src: url('https://gerlach.media/fonts/inter-v18-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
  }
  /* inter-500 - latin */
  @font-face {
	font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
	font-family: 'Inter';
	font-style: normal;
	font-weight: 500;
	font-display: swap;
	src: url('https://gerlach.media/fonts/inter-v18-latin-500.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
  }
  /* inter-600 - latin */
  @font-face {
	font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
	font-family: 'Inter';
	font-style: normal;
	font-weight: 600;
	font-display: swap;
	src: url('https://gerlach.media/fonts/inter-v18-latin-600.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
  }
  /* inter-700 - latin */
@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700; /* ← korrektes Gewicht zur Datei */
  font-display: swap;
  src: url('/fonts/inter-v18-latin-700.woff2') format('woff2');
}

  /* inter-800 - latin */
  @font-face {
	font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
	font-family: 'Inter';
	font-style: normal;
	font-weight: 800;
	font-display: swap;
	src: url('https://gerlach.media/fonts/inter-v18-latin-800.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
  }
	
 
* {
    box-sizing: border-box;
}


*,ul,li,p,h1,h2,h3,div,html,body{ 
		margin: 0; 
		padding: 0;
	position: relative;
}

.strong{
	font-weight: 500;
}


.startextra{
	position: fixed;
	bottom: 0;
	background-color: #000;
	left: 0;
	padding: 12px 25px;
	font-size: 85%;
}


ul{list-style-type:none;}

.noSelect {
    -webkit-touch-callout: none!important;
    -webkit-user-select: none!important;
    -khtml-user-select: none!important;
    -moz-user-select: none!important;
    -ms-user-select: none!important;
    user-select: none!important;
	-webkit-tap-highlight-color: rgba(255, 255, 255, 0);
}


  
::selection {
    background: #0d0d0d;
	color: #fff;
}

::-moz-selection {
    background: #0d0d0d;
	color: #fff;
}

.nav-warenkorb-icon {
	z-index: 99999;
  position: absolute;
  display: inline-block;
  right: 100px;
  top: 26px;
  overflow: visible;
  height: 32px;
  width: auto;
}

.nav-warenkorb-icon img {
  height: 32px;
  width: 32px;
}
.cart-badge {
  position: absolute;
  top: -6px;
  right: -6px;
  background-color: #e2001a;
  color: #fff;
  font-size: 10px;
  padding: 4px 5px 2px 5px;
  border-radius: 50%;
  font-weight: bold;
  line-height: 1;
  min-width: 16px;
  text-align: center;
  box-sizing: border-box;
  width: 16px;
  height: 16px;
}



.informationsbox{
	background-color: #F6F9FC;
	padding: 20px;
}

blockquote {
	color: #777;
	padding: 0px 30px;
    margin: 8px 0 20px 0;
	line-height: 1.3;
    font-style: italic;
	border-left: 4px solid #aaa;
	margin-left: 30px;
}

.quote{
    font-size: 100%;
	line-height: 1.5;
}


html{ 
	font-size: 18px;
		line-height: 1.8;
		font-weight: 400;
		margin: 0;
}

body { 
	overflow-x:hidden;
	cursor: default;
	    text-rendering: optimizeLegibility;
		margin: 0;	
	font-family: 'Roboto', sans-serif;
    line-height: 1.2;
    color: #212121;
    background-color: #fff;
    -webkit-font-smoothing: antialiased;
}
img {
    display: block;
    height: auto;
    max-width: 100%;
    width: auto;
}
strong{
		font-weight: 500!important;
		letter-spacing: 0.1px;
}


.marqueeover{
	width: 100%;
	overflow: hidden;
}

  .marquee {
    animation: marquee 40s linear infinite;
    display: inline-block;
    white-space: nowrap;

    &:hover {
      animation-play-state: paused;
    }
  }
  
  @keyframes marquee {
	0% {
	  margin-left: 0%;
	  transform: translateX(0%);
	}
	100% {
	  margin-left: 100%;
	  transform: translateX(-100%);
	}
  }

.teambox{
	width: 100%;
	display: inline-block;
	margin-right: 3%;
	height: auto;
	position: relative;
	overflow: hidden;   
	transition: all 0.1s ease;
	color: #fff;
	font-size: 85%;
	letter-spacing: 1px;
	border-radius: 4px;
	margin-bottom: 12px;
	line-height: 1.6;
	background-color: #0c0c0c;
}

.teambox img{
	width: 100%;
	height: auto;
	overflow: hidden;
}

.teambox span{
	color: #fff;
	font-size: 20px;
	display: block;
	font-weight: 800;
	letter-spacing: 0.1px;
	line-height: 1.2;
	margin-bottom: 6px;
	padding-right: 30px;
}

.teamboxover{
	z-index: 2;
	transition: all 0.1s ease;
	position: absolute;
	width: 100%;
	height: 60%;
	bottom: 0;
	text-align: center;
	background-color: #0c0c0c;
	background: linear-gradient(180deg, #0c0c0c00 15%, #0c0c0c80 45%, #0c0c0c 100%);
}

.teamboxoverbox2{
	z-index: 1;
	transition: all 0.1s ease;
	position: absolute;
	width: 102%;
	margin-left: -1%;
	height: 0%;
	transform: rotate(-4deg);
	bottom: 0;
	background-color: #0c0c0c;
}

.teambox:hover .teamboxoverbox2{
	transition: all 0.2s ease;
	height: 100%;
	opacity: 0.97;
	transform: rotate(0deg);
}

.teambox:hover .teamboxover{
	transition: all 0.2s ease;
	height: 60%;
}

.teamboxoverin{
	transition: all 0.2s ease;
	z-index: 3;
	position: absolute;
	left: 15%;
	bottom: -58%;
	width: 70%;
	text-align: left;
	height: 100%;
}

.teambox:hover .teamboxoverin {
	transition: all 0.6s ease;
	bottom: -10%;
}

.teambox img {
	transition: all 0.6s ease;
	scale: 1;
}

.teambox:hover img {
	transition: all 0.6s ease;
	scale: 1.04;
}

.teambox a{
	color: #fff!important;
}


.innernavout {
	width: 100%;
	overflow-x: auto;
	text-align: left!important;
	position: absolute;
	bottom: 0;
}

.innernav {
	width: 860px;
}

.innernav li{
	display: inline-block;
	margin: 0; 
	padding: 0!important;
	margin-right: -3px;
}

.innernav li:last-child {
	border-right: 0;
}

a.innernavlink, a.innernavlink:visited {
    position: relative;
		color: #212121;
		text-decoration: none;
transition: all 0.4s ease;
	display: block;
	padding: 12px 24px;
	background-color: rgba(255,255,255,0.36);
	border-radius: 4px 4px 0 0;
}

a.innernavlink:hover, a.innernavlink:active {
    color: #212121;
		text-decoration: underline;
transition: all 0.4s ease;
}


.innernavaktiv{
  box-shadow: 6px 0 5px -2px rgba(0,0,0,0.07);
     color: #131313!important;
   background-color: #f3f5f99d!important;
}




.preisliste {
	clear: both;
	display: block;	
	max-width: 1490px;
	margin: auto;
	margin-bottom: 100px!important;
}
.preisliste h2{
	padding-left: 20px;
	margin-top: 40px;
}
.preislistenblock{
	background-color: #fff;
    transition: all 0.5s ease-in-out;
	padding: 20px;
	clear: both;
	display: block;
	overflow: hidden;
	border-bottom: 1px solid #ddd;
}

.preislistenblock:focus{
	outline: 1px solid #B6EAE8;
	z-index: 99;
    box-shadow: 8px 8px 16.25px 4px rgba(0,0,0,0.11);
}

.preislistenblock:nth-child(odd) {
	background-color: #fff;
    transition: all 0.5s ease-in-out;
	padding: 20px;
	clear: both;
	display: block;
}

.preislistenblockaktiv {
	background-color: #E2F9F8!important;
	border: 1px solid #B8EFED;
    box-shadow: 8px 8px 16.25px 4px rgba(0,0,0,0.11);
	z-index: 92;
}

.preislistenblock:hover{
	background-color: #F5F2EC;
    transition: all 0.5s ease-in-out;
}

.preislistetitel{
	display: block;
	font-weight: 400;
	font-size: 120%;
	vertical-align: top;
	color: #212121;
}

.preislistebeschreibung{
	display: inline-block;
	vertical-align: top;
	width: 43%;
}
.preislistepreis{
	float:right;
	display: inline-block;
	vertical-align: top;
	width: 20%;
	text-align: right;
	color: #212121;
}

.preislistepreis span{
	font-weight: 400;
	font-size: 130%;
}


.websitein{
	position: relative;
	width: 100%;
	max-width: 1490px;
	margin: auto;
}



.headline{
	margin:0px;
	margin-bottom:25px;
	line-height: 32px;
	display:block;
	color: #515151;
	font-size: 125%;
	font-weight: 300;
}

span.zusatztext{
	color: #aaa;
}
.dunkelbg .headline{
}


.zaehlung{
clear:left;
display: inline-block;
text-align: center;
margin-bottom: 10px;
margin-right: 10px;
width: 18px;
height: 18px;
padding: 1px;
line-height: 20px;
border-radius: 40px;
border: 2px solid #0CA5D9;
transition: all 0.6s ease 0s;
background-color: #fff;
font-weight: bold;
color: #0CA5D9;
float:left;
font-size: 75%;
}

.zaehlung-description{
display: inline-block;
float:left;
line-height: 24px;
}

.featurebox{
transition: 0.5s ease-in-out;
text-decoration: none; 
display:block;
float:left;
width: 430px;
margin-right: 50px;
line-height: 160%;
}

.miniklein{
	font-weight: 400;
	font-size: 14.4px;
	display:inline-block;
	padding: 6px;
    line-height: 150%;
}

.miniklein .miniin{
	font-size: 16px;
	display: block;
	font-weight: 800;
}

.stars{
	color: #ecbe18;
	font-size: 16px;
}

.kleintext{
	font-size: 80%;
	color: #999;
}

.wkimobile{
	top: 14px;
	position: absolute;
	right: 80px;
}

.wki{
	background-image: url(https://gerlach.media/bilder/shopping-cart.svg);
	background-position: 0 45%;
	background-repeat: no-repeat;
	background-size: 24px auto;
	width: 48px;
	height: 48px;
	display: inline-block;
}



.wktitel{
	margin-top: 10px;
	vertical-align: top;
	font-weight: 800;
	display: inline-block;
}

.wkkate{
	vertical-align: top;
	font-weight: 300;
	display: inline-block;
	letter-spacing: -0.1px;
}

.warenkorbzeile{
	background-color: #fff;
	padding: 25px;
	padding-bottom: 0px;
 transition: all 0.4s ease 0s;
}

.warenkorbzeile:hover{
	z-index: 4;
	background-color: #f3f5f99d;
}

.wktransparent{
	background-color: transparent;
	padding: 5px 0;
 transition: all 0.4s ease 0s;
	margin-bottom: 8px;
	border-bottom: 1px solid #eee;
}

.wktransparent:hover{
	box-shadow: 0 0 0 0 rgba(0,0,0,.18);
}

.border{
	height: 1px;
	margin-bottom: 25px;
	border-bottom: 1px solid #eee;
}

.delete{
	position: absolute;
	right: 30px;
	bottom: 10px;
	width: 30px;
 transition: all 0.4s ease 0s;
	opacity: 0.7;
}

.warenkorbzeile:hover .delete{
	opacity: 0.7;
}

.delete img{
	width: 100%;
}

.warenkorbzeile .kosten{
	font-weight: 800;
	color: #242424;
}

.warenkorbzeile img{
	float: left;
	display: inline-block;
	width: 70%;
	margin-right: 25px;
	margin-bottom: 25px;
	max-width: 184px;
}

.wkbild{
	width: 120px!important;
}
	
.abstandtext{
	display: inline-block;
	margin: 0 35px;
}
		
.abstandtextkorb{
	width: 45%;
	display: inline-block;
}

		
.abstandtextkorb2{
	width: 45%;
	display: inline-block;
}

.summebox{
	background-color: #fff;
	padding: 25px;			
	box-shadow: 0px 2px 14px 2px rgb(0 0 0 / 6%);
	border-radius: 4px;
}


#aenderungok{
	transition: all 0.4s ease-in-out;
	background-color: #e5f8e8;
	padding: 12px 0;
	border-radius: 6px;
	font-size: 90%;
	margin: 0 0 35px 0;
	text-align: center;
}

.aenderungweg{
	transition: all 0.4s ease-in-out;
	overflow: hidden;
	opacity: 0;
	height: 0;
	padding: 0;
	margin: 0 0 0 0;
}

#warenkorbdiv{
	position: absolute;
    box-shadow: 0 2px 3.25rem 0 rgba(0,0,0,.18);
	background-color: #fff;
	padding: 25px 45px;
	z-index: 99999;
	width: 200px;
	left: 50%;
	top: 100px;
	border-radius: 3px;
	font-size: 85%;
}

.warenkorbkreis{
	z-index: 9;
	position: absolute;
	width: 24px;
	height: 23px;
	border-radius: 50%;
	vertical-align: middle;
	text-align: center;
	margin-right: -10px;
	right: 0;
	font-size: 85%!important;
	padding-top: 2px;
 transition: all 0.4s ease 0s;
 background-color: #0c0c0c;
 color: #fff!important;
}

.wkkmobile{
	margin-right: 6px;
	margin-left: -6px;
}

.dropdownbox {
    transition: all 0.4s ease-in-out;
    margin-bottom: 8px;
}

.dropdownbox .titeltext{
	display: block;
    font-size: 105%;
    font-weight: 400;
	margin-left: 0;
	color: #212121;
}



.dropdownboxinnen{
	transition: all 0.4s ease-in-out;
	color: #444;
	font-size: 100%;
}


.infobox{
	clear: both;
	transition: all 0.4s ease-in-out;
	background-color: #fff;
	border-radius: 4px;
	padding: 25px;
	margin-bottom: 8px;
	height: auto;
	text-align: left;
	position: relative;
	color: #111!important;
}

.infoboxschatten{
	transition: all 0.1s ease-in-out;
}

.infoboxschatten:hover{
    box-shadow: 0 5px 4.25rem 0 #32323216;
	transition: all 0.1s ease-in-out;
	scale: 1.01;
}


.infoboxafter{
	position: absolute;
	border-right: 1px dashed #11111182;
	height: 100px;
	width: 2px;
	left: 50%;
	margin-left: -1px;
}

.infoboxlast:after{
	display: none;
}

.infobox:focus{
	height: auto;
}
.infobox:hover{
	transition: all 0.4s ease-in-out;
	z-index: 7;
}

.textbonbon{
	border-radius: 26px;
	background-color: #F6F9FC;
	padding: 6px 30px;
	color: #212121;
	margin-bottom: 35px;
	clear: both;
	display: inline-block;
	font-weight: 800;
	letter-spacing: 0;
}


.graubg .textbonbon, .hellgraubg .textbonbon, .hellgrau .textbonbon, .hellblaubg .textbonbon{
	background-color: #ffffff;
}

.punkttext{
	padding: 6px 30px;
	color: #212121;
	margin-bottom: 35px;
	clear: both;
	display: inline-block;
	font-weight: 800;
	letter-spacing: 0;
	font-size: 155%;
}

.infobox h3{
	font-size: 20px;
    margin-bottom: 0;
}

.roundbox{
	border-radius: 10px;
	margin-bottom: 30px;
	position: relative;
}

.kleineroundbox{
	border-radius: 8px;
display:inline-block;
}

.roundboxround{
	border-radius: .7rem;
}

.mrgbtmin{
	margin-bottom: -20px;
}

.roundboxin{
	padding: 30px;
}
.roundboxklein{
	padding: 10px 15px;
	padding-left: 15px;
}


.profilbild{
	position: absolute;
	left: 50%;
	transform: translate(-50%);
	top: 0;
	margin-top: -80px;
	border-radius: 12px;
	border: 6px solid #fff;
	z-index: 1;
	width: 112px;
}



.linksbuendig{
text-align:left;
padding: 85px 0;
line-height: 150%;
border-top: 1px solid #e4e4e4;
}

.linksbund{
	text-align:left;
	line-height: 150%;
	}

h1{
	font-family: 'Inter', sans-serif;
	font-weight: 800;
	font-size: 26px;
	line-height: 1.4;
	margin: 6px 0 26px 0;
	color: #111;
}
.seitentitel{
	font-family: 'Inter', sans-serif;
	font-weight: 400;
    font-size: 26px;
	line-height: 36px;
	margin-bottom: 6px;
	color: #fff;
	letter-spacing: -0.5px;
		}
h2{
	letter-spacing: -0.5px;
	font-family: 'Inter', sans-serif;
	font-weight: 800;
	font-size: 23px;
	line-height: 30px;
	margin-bottom: 6px;
	color: #212121;
}
h3{
	letter-spacing: -0.5px;
	font-family: 'Inter', sans-serif;
	font-weight: 800;
	font-size: 20px;
	line-height: 26px;
	margin-bottom: 6px;
	color: #212121;
}

.titlebox{
	display: block;
	font-family: 'Inter', sans-serif;
	font-weight: 800;
	font-size: 22px;
	line-height: 26px;
}

.titleboxunder{
	display: block;
	font-family: 'Inter', sans-serif;
	font-weight: 300;
		font-size: 14px;
	margin-bottom: 6px;
	color: #aaa;
}


h4, .titeltext{
	font-family: 'Inter', sans-serif;
	font-weight: 800;
	font-size: 20px;
	line-height: 1.3;
	margin-bottom: 6px;
	color: #212121;
	display: block;
}


.h2small{
	font-weight: 300;
	font-size: 18px;
	line-height: 30px;
	margin-bottom: 6px;
	color: #212121;
}



.header{
	box-shadow: 0 0.1rem 0.2rem 0 rgba(0,0,0,.04), 0 0.2rem 2.4rem 0 rgba(0,0,0,.05);
	background-color: #fff;
	position: fixed;
	z-index: 999;
    transition: all 0.1s ease;
	width: 90%;
	left: 50%;
	transform: translate(-50%);
	top: 20px;
	max-width: 1490px;
	border-radius: 999px;
}



.topheader{
	display:none;
}

.headerfixed{
	top: 20px;
	box-shadow: 0 0.1rem 0.2rem 0 rgba(0,0,0,.04), 0 0.2rem 2.4rem 0 rgba(0,0,0,.05);
    transition: all 0.1s ease;
	position: fixed;
}

.headerin{
	position: relative;
	padding: 4px 2.5% 2px 2.5%;
	width: 95%;
	margin: auto;
}

.inkbox{
	display: block;
	transition: all 0.2s ease-in-out;
	background: #15252F;
	width: 100%;
	color:#fff;
	text-align: center;
	padding: 10px 0;
	font-size: 90%;
}
	

.button{
	display: none;
}

	
.weissbg{
	color: #111!important;
	background-color: #fff!important;
}		
.weisstext{
	color: #fff;
}	

.weissbg2{
	background-color: rgba(255,255,255,0.20)!important;
}




.prozessboxoverlayzwei {
    z-index: 1;
    background-image: linear-gradient(#ffffff00, #ffffff);
    background-position: 0 0, 0 0;
    background-size: auto, cover;
    position: absolute;
    inset: 0%;
	overflow: hidden;
}

.prozessboxoverlay {
    z-index: 1;
    background-image: linear-gradient(#16161681, #000000f8);
    background-position: 0 0, 0 0;
    background-size: auto, cover;
    position: absolute;
    inset: 0%;
	overflow: hidden;
}



.messebgzwei {
    z-index: 1;
    background-image: linear-gradient(#16161681, #000000f8), url(https://gerlach.media/bilder/gerlach-media-messe.jpg);
    background-position: 0 0, 0 0;
    background-size: auto, cover;
    position: absolute;
    inset: 0%;
}

.messebg {
    z-index: 1;
    background-image: linear-gradient(#16161681, #000000f8), url(https://gerlach.media/bilder/messauftritt-gerlach-media-beratung.jpg);
    background-position: 0 0, 0 0;
    background-size: auto, cover;
    position: absolute;
    inset: 0%;
}

.image-overlay-layer-clean {
    z-index: 1;
	background-image: linear-gradient(#16161681, #000000f8);
	background-position: 50%;
	background-size: auto, cover;
    position: absolute;
    inset: 0%;
}


.image-overlay {
    z-index: -1;
    background-image: linear-gradient(#000000ea, #000000f8);
    position: absolute;
    inset: 0%;
}

.image-overlay-nav {
    z-index: -1;
    background-image: linear-gradient(#000000f8, #22222200);
    position: fixed;
    inset: 0%;
}


.image-overlay-layer {
    z-index: 1;
    background-image: linear-gradient(#16161681, #000000f8), url(https://gerlach.media/bilder/gerlach-media-seminarraum.webp);
    background-position: 0 0, 0 0;
    background-size: auto, cover;
    position: absolute;
    inset: 0%;
}

.ergebnissebg {
    z-index: 1;
    background-image: linear-gradient(#16161681, #000000f8), url(https://gerlach.media/bilder/stefan-gerlach-industrie-seo.webp)!important;
    background-position: 70%;
    background-size: auto, cover;
    position: absolute;
    inset: 0%;
}

.industrieb2bbg {
    z-index: 1;
    background-image: linear-gradient(#16161681, #000000f8), url(https://gerlach.media/bilder/industrieunternehmen-b2b-sichtbarkeit-partner.webp)!important;
    background-position: 70%;
    background-size: auto, cover;
    position: absolute;
    inset: 0%;
}

.b2bseobg {
    z-index: 1;
    background-image: linear-gradient(#16161681, #000000f8), url(https://gerlach.media/bilder/industrie-lager-gm.webp);
    background-position: 0 0, 0 0;
    background-size: auto, cover;
    position: absolute;
    inset: 0%;
}

.startbg2025 {
    z-index: 1;
    background-image: linear-gradient(#16161681, #000000f8), url(https://gerlach.media/bilder/startbg2025.webp);
    background-position: 0 0, 0 0;
    background-size: auto, cover;
    position: absolute;
    inset: 0%;
    will-change: transform;
}

.toolbg {
    z-index: 1;
    background-image: linear-gradient(#16161681, #000000f8), url(https://gerlach.media/bilder/seo-ergebnisse-gm-ahrefs.webp);
    background-position: 50%;
    background-size: auto, cover;
    position: absolute;
    inset: 0%;
	-webkit-backdrop-filter: blur(5px);
	backdrop-filter: blur(5px);
}


.sgkongress {
    z-index: 1;
    background-image: linear-gradient(#f3f5f9d8, #F6F9FC), url(https://gerlach.media/bilder/IMG_8909.jpg);
    background-position: 0 0, 0 0;
    background-size: auto, cover;
    position: absolute;
    inset: 0%;
}

.logo{
  z-index: 7;
  display: inline-flex;
  align-items: center;
  width: 170px;  
  height: 52px;
  margin-top: 0;
}

.logo-svg{
  overflow: visible;
  width: 100%;
  height: auto;
  display: block;
}

.logo.is-icon-only .logo-text{
  transform: translateX(0);
  opacity: 1;
  pointer-events: auto;
}




.logoakademie{
	background-image: url(https://gerlach.media/bilder/gerlach-logo-akademie.svg);
}
.headeralt .logoakademie{
	background-image: url(https://gerlach.media/bilder/gerlach-logo-akademie-weiss.svg);
}

.headerfixed .logoakademie{
	background-image: url(https://gerlach.media/bilder/gerlach-logo-akademie.svg);
}


.logoactive{
	background-image: url(https://gerlach.media/bilder/logo-gerlach-media-weiss.svg);
    width: 120px;
	height: 90px;
	background-size: 80% auto;
	background-color: #212121;
	margin-top: -20px;
}		

.footerblock{
	display: flex;
	flex-direction: row;
	flex-basis: auto;
}

.footerlogo{
 	display: flex;
    width: 120px;
	opacity: 0.7;
	margin-right: 15px;
	align-items: center;
	justify-content: center;
}


.footerblock span{
 	display: flex;
	 width: auto;
	 align-items: center;
	 justify-content: center;
 }


.logo img{
	width: 100%;
}	


		.schnellnavi{
			background-color: #f3f5f99d;
			color: #212121;
			z-index: 99;
		}	
		
		.schnellnavi div{
			padding: 26px;
		}
		
		.schnellnavi img{
			width: 100%;
		}


.innen, .bloginhalt{
	position: relative;
	padding: 65px 5%;
	line-height: 150%;
}


.bigpadd{
	padding: 90px 5%;
	}

.innenpaddoben{
	padding: 100px 5% 70px 5%;
	}
	.extrapadd{
		padding-top: 150px;
	}
	.innenpaddobenstart{
		padding: 140px 5% 50px 5%;
	}

	.innenpaddobenstartvideo{
		padding: 100px 5% 50px 5%;
	}
.modulescroll{
    position: relative;
	transition: all 0.4s ease-in-out;
    width: 100%;
    overflow-x: scroll;
    white-space: nowrap;
    -webkit-overflow-scrolling: touch;
	padding: 0 0;
}

.modulescroll::-webkit-scrollbar {
}

.triangel:before {
	z-index: 9;
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    width: 100%;
    height: 1.875rem;
    background: #fff;    
bottom: -.0225rem;
    -webkit-clip-path: polygon(0 0,0 100%,100% 100%,100% 0,50% 100%);
    clip-path: polygon(0 0,0 100%,100% 100%,100% 0,50% 100%);
}

.vorteil{
	text-align: center;
	background-color: #fff;	
	border: 1px solid #eee;
	display: inline-block;
	margin-bottom: 20px;
	padding: 25px;
	line-height: 140%;
	width: 28%;
	margin-right: 1%;
}
.vorteil img{
	width: 24px;
}

.vorteil span{	
	display: block;
	text-align: center;
	font-size: 26px;
	font-weight: 400;
	margin-bottom: 10px;
}

.vorteildiv{
	font-size: 18px;
	padding: 15px;
	height: 30px;
}

.angebotbox{
	position: relative;
	display: inline-block;
	width: 100%;
	height: 235px;
	background-image:url('https://gerlach.media/bilder/markisen-box.jpg');
	background-repeat: no-repeat;
	background-size: 100% auto;
	background-position: 50%;
	margin-bottom: 20px;
	transition: all 0.4s ease-in-out;
}

.navbox, .overlay{display: none;}

.angebotbox:hover{
	background-size: 104%;
}

.box2{
	background-image:url('https://gerlach.media/bilder/garagentore-box.jpg');
}

.box3{
	background-image:url('https://gerlach.media/bilder/haussicherheit-box.jpg');
}

.box4{
	background-image:url('https://gerlach.media/bilder/rolladen-box.jpg');
}

.box5{
	background-image:url('https://gerlach.media/bilder/fenster-tueren-box.jpg');
}

.nachrichtenbox{
	background-image:url('https://gerlach.media/bilder/auto-neuigkeiten.jpg');
}



.angebotboxinfo{
	transition: all 0.4s ease-in-out;
	padding: 18px 30px;
	background-color: #212121;
    color: #fff;
	font-size: 130%;
	display: inline-block;
}

.angebotslink{
	position: absolute;
	bottom: 15px;
	right: 15px;
	transition: all 0.4s ease-in-out;
	margin-left: 30px;
	color: #fff;
	font-size: 110%;
	border: 1px solid #fff;
	opacity: 0;
	padding: 12px;
	display: inline-block;
}

.angebotslink:hover{
	padding: 12px 26px;
}

.website{
	padding: 0;
	margin: 0;
}


.angebotbox:hover .angebotboxinfo{
	transition: all 0.4s ease-in-out;
}



.willkommen{
	background-color: #F6F9FC;
		position: relative;
	height: auto;
	background-repeat: no-repeat;
	padding-top: 0;
}


.dreierstart{
	display: block;
	margin-bottom: 45px;
}

.willunter{
	height: 35vH;
}

.willkommen li{
}

.nachhaltigkeitbg{
	background-position: 100%;
	background-image:url("https://gerlach.media/bilder/nachhaltigkeit-background.png");
	background-size: auto 100%;
	background-repeat: no-repeat;
}


.servicebg{
	position: relative;
	background-repeat: no-repeat;
    background: #fff;
	background-position: 60% 30%;
	background-size: cover;
}


.servicebgin{
	position: absolute;
	top: 300px;
	left: 50%;
	transform: translateX(-50%);
	width: 90%;
	max-width: 320px;
	text-align: center;
}
.gesichertgegenblicke {
	z-index: 99;
    transition: all 0.5s ease-in-out;
    outline: none;
	background-color: #212121;
	opacity: 0.97;
	width: 100%;
	height: 100%;
	position: fixed;
}

.gesichertweg {
	display: none;
}

.gegenblickebox {
	z-index: 999;
    transition: all 0.5s ease-in-out;
    outline: none;
	width: 100%;
	height: 100%;
	max-width: 560px;
	margin: auto;
	top: 40%;
	position: relative;
}


.kderg{
	color: #999;
	font-size: 85%;
	display: block;
	text-transform: uppercase;
	letter-spacing: 0.4px;
}

.hallo{
	margin: auto;
	max-width: 1490px;
	color: #fff;
	width: 80%;
	margin-top: 170px;
	text-align: center;
	padding: 0 10%;
}



.coachingbg{
	background-image: url('https://gerlach.media/bilder/seo-agentur-gerlach-media2-klein.jpg');
	min-height: 70vH;
	background-position: 30%;
	background-size: cover;
}

.coachingbg h2, .coachingbg{
	color: #fff;
}

.blogwrap{
}

.leistungen{
	position: relative;
	height: 35vH;
	background-repeat: no-repeat;
	overflow: hidden;
	background-color: #212121;
}


.vorbg{
	background-color: #dde6eea9;
}

.rotbg{
	background-color: #c61449;
	color: #fff;
}


.gelbbg{
	background-color: #e49a0f;
	color: #fff;
}

.hellgelbbg{
	background-color: #f9edd6;
}


.blauzweibg{
	background-color: #2d5479;
	color: #fff;
}


.gruenbg{
	background-color: #0c0c0c ;
	color: #fff;
}


.hellgruenbg{
	background-color: #f0f7f6;
}


.hellgraubg{
	background-color: #F6F9FC;
}

.hellorangebg{
	background-color: #F8F9FB;
}



.graubg{
	background-color: #F6F9FC;
}

.blaubg{
	background-color: #0c0c0c ;
}

.hellblaubg{
	background-color: #18181810;
}

.hellblaustart{
	background-color: #F6F9FC;
}


.dunkelblau{
	background-color: #0c0c0c;
	color: #fff!important;
}

.dunkelblau h3 {
    font-size: 30px;
    line-height: 140%;
    font-weight: 800;
    margin: 0 0 32px;
    color: #ebeff6;
}

.dunkelblau .buttonlink, .wirsindihrpartner .buttonlink{
   background: linear-gradient(90deg, #0c0c0c 0%, #0c0c0c 100%);
}


.mittelgraubg{
	background-color: #ececec;
}

.wavebg{
	background-size: cover;
    background-image: url("https://gerlach.media/bilder/wave-bg-einheiten.png");
	background-repeat: no-repeat;
}

.bgemotion{
	background-size: 100% auto;
    background-image: url("https://gerlach.media/bilder/gerlach-media-team-gespraech.jpg");
	background-repeat: no-repeat;
	background-position: 50%;
	min-height: 420px;
}

.hellgrau{
	background-color: #F6F9FC!important;
}

.dunkelgrau{
	background-color: #c5ccd6!important;
}

.nurnocheinen{
	background-color: #cfe7f1;
}

.dunkelgraubg{
	background-color: #e8e9eb!important;
}

.middlecid{
	background-color: #E0EFF7!important;
}

.middledarkbg{
	background-color: #cdd1d8;
}

.darkbg{
	background: #143d5a;
background: linear-gradient(135deg, #1d1d1d 5%, #161616 30%, #000000 100%);
}


.darkbggm{
	background-color: #051C2C;
}

.darkbgdarkfont{
	background-color: #051C2C;
background: linear-gradient(135deg, #1d1d1d 5%, #161616 30%, #000000 100%);
}

.dunkelbg{
	background: #101010;
}

.gmbg, .gmbg a, .gmbg h1, .gmbg h2, .gmbg h3, .gmbg h4, .gmbg li, .gmbg .titlebox, 
.darkbg, .darkbg .titlebox, .blaubg, .darkbgzwei, .darkbgzwei .titlebox, .darkbggm, 
.dunkelbg, .dunkelbg a, .dunkelbg h1, .dunkelbg h2, .dunkelbg h3, .dunkelbg h4, .dunkelbg li, .dunkelbg .titlebox
{
	color: #ffffff!important;
}


.ergebnisseback, .ergebnisseback h1, .ergebnisseback h2{
	color: #ffffff!important;
}

.darkbg h1,.darkbg h2,.darkbg h3,.darkbg h4, .hellschrift, .hellschrift h1, .hellschrift h2, .hellschrift h3, .darkbgzwei h1,.darkbgzwei h2,.darkbgzwei h3,.darkbgzwei h4, .darkbgzwei .boxh3{
	color: #ffffff!important;
}

.boxh3{
	font-weight: 500;
	font-size: 40px;
	line-height: 1.1;
}

.darkbg a{
	color: #ffffff!important;
	text-decoration: underline!important;
}


.videobg{

}

.schritte{
	font-size: 85%;
	letter-spacing: 1px;
	color: #999;
	display: block;
	padding: 3px 0;
}

.referenzdetail{
	position: relative;
	height: 45vH;
	background-repeat: no-repeat;
	overflow: hidden;
	background-position: 50%;
      background-color: #212121;       
	-moz-box-shadow: inset 0 0 50em #000;  
 -webkit-box-shadow: inset 0 0 50em #000;   
 box-shadow: inset 0 0 50em #000;
	background-size: cover;
}


.artikelboxsmall{
transition: 0.5s ease-in-out;
color: #333;
text-decoration: none; 
display:block;
float:left;
text-align:center;
padding: 20px;
font-weight: 300;
width: 196px;
}

.artikelboxsmall:hover{
background-color: #f2f2f2;
}

.artikelboxsmall img{
box-shadow: 0px 0px 3px #aaa;
margin-bottom: 15px;
}

.blogartikeleins{
	position: relative;
	height: 25vH;
	background-repeat: no-repeat;
	overflow: hidden;
	background-position: 50%;
      background-color: #212121;       
	-moz-box-shadow: inset 0 0 350em #000;  
 -webkit-box-shadow: inset 0 0 350em #000;   
 box-shadow: inset 0 0 350em #000;
	background-size: cover;
}

span.durchgestrichen {
    text-decoration: line-through;
    color: #C03;
}

.blogartikeleins img{
		transition: all 0.4s ease-in-out;
	width: 100%;
	margin-top: -50px;
      background-color: #212121;       
	-moz-box-shadow: inset 0 0 350em #000;  
 -webkit-box-shadow: inset 0 0 350em #000;   
 box-shadow: inset 0 0 350em #000;
	opacity: 0.4;
}

.blogartikeleins:hover  img{
      background-color: #636363;       
	opacity: 0.1;
}
.blogartikeleins:hover {
      background-color: #636363;       
}
		
.shophinweis{
	/*background-color: #c5ecff31;*/
	padding: 10px 0;
	margin: 15px 0;
	font-size: 90%;
}

.probeschr{
	white-space: pre-wrap;
	line-height: 155%;
	max-width: 850px;
}

.paketbox{
	position: relative;
	display: block;
	width: 90%;
	padding: 25px 5% 55px 5%;
	vertical-align: top;
	margin-bottom: 20px;
	font-size: 100%;
	transition: all 0.4s ease-in-out;
	background-color: #fff;
} 

.paketbox:hover{
	z-index: 9;
	box-shadow: 1px 2px 56px rgba(0,0,0,0.2);
} 

.paketbox span{
	display: block;
	margin-bottom: 20px;
	font-size: 100%;
	transition: all 0.4s ease-in-out;
	    color: #999;
} 

.paketbox h3{
	color: #212121;
	font-weight: 400;
	font-size: 22px;
	line-height: 26px;
} 

.paketbox .preis{
	position: absolute;
	right: 12px;
	bottom: 12px;
	display: block;
	font-size: 100%;
	transition: all 0.4s ease-in-out;
	padding: 4px 8px;
	color: #fff;
	background-color: #212121;
} 

.partnerpreis{
	color:#d10564;
	font-weight: 800;
}

.partnerpreisalt{
	font-weight: 800;
	text-decoration: line-through;
}


.prozentbox{
	height: 72px;
	width: 100%;
	display: block;
    box-shadow: 0 2px 0.25rem 0 rgba(9,42,93,.04);
	border-radius: 4px;
}

.prozentboxin{
	display: inline-block;
	height: 72px;
	color: #fff;
	vertical-align: middle;
	text-align: center;
	line-height: 72px;
	margin-right: -5px;
}
		.zehner span{
			display: block;
			font-weight: 400;
		}
		

		.fahrzeugcatch{
			height: auto;
		}

		.opa{
			background-color: #F6F9FC;
		}
		
		.opa1{
			opacity: 0.5;
		}		
		.opa2{
			opacity: 0.3;
		}

		.fahrzeugincbg {
			font-size: 85%;
		}		

		.kontaktformbg {
			position: fixed;
			box-shadow: 0px 6px 44px 2px rgb(0 0 0 / 54%);
			border-radius: 4px;
			background-color: #fff;
			z-index: 11;
			left: 50%;
			top: 50%;
			transform: translate(-50%,-50%);
			height: 0;
			opacity: 0;
			overflow: hidden;
			visibility: hidden;
		}	

		.formactive {
			visibility: visible;
			padding: 5%;
			opacity: 1;
			width: 70%;
			height: auto;
			overflow: auto;
		}		

		.infoboxabso{
			z-index: 9;
			position: absolute;
			bottom: -100px;
			left: 5%;
   			 padding: 25px 0;
			font-size: 85%;
				opacity: 1.0!important;
			width: 90%;
			color: #484848;
	}

	.anfragehide{
		padding: 0!important;
		height: 0!important;
		overflow: hidden!important;
		transition: all 0.4s ease-in-out;
	}
	.anfrageshow{
		height: auto!important;
		transition: all 0.4s ease-in-out;
	}


			


.dreier, .zweier, .vierer, .zehner, .fzlinks, .fzrechts, .stickylinks{
	display: block;
	width: 100%;
	padding: 15px 0;
	vertical-align: top;
	margin-bottom: 0;
	font-size: 100%;
	transition: all 0.4s ease-in-out;
} 

.subnavin .dreier{
	padding: 0!important;
	}



	
.bigline{
	font-size: 32px;
	line-height: 36px;
}

.filterlink {
		transition:all 0.4s ease 0s; /*W3C Standard*/
		line-height: 150%;
		text-align: center;
		width: 45%;
		padding: 10px 1.5%;
		display: inline-block;
		margin-bottom: 20px;
		background-color: #fff;
		vertical-align: top;
}

.filterlinkaktiv{
	background-color: #f9f9f9;
}

.filterlink:hover{
	background-color: #f9f9f9;
}

.filterlink img{
	display: block;
	width: 35%;
	margin: auto;
	margin-bottom: 25px;
}

.filterlinkneu {
		transition:all 0.4s ease 0s; /*W3C Standard*/
		line-height: 150%;
		text-align: center;
		width: 45%;
		padding: 10px 1.5%;
		display: inline-block;
		margin-bottom: 20px;
		background-color: #f9f9f9;
		vertical-align: top;
	min-height: 120px;
	font-weight: 400;
}

.filterlinkneu img{
	display: block;
	width: 35%;
	margin: auto;
	margin-top: 15px;
	margin-bottom: 25px;
}


.filterlinkneu:hover{
		box-shadow: 1px 2px 24px rgba(0,0,0,0.2);
}


.leistungsbox{
		transition:all 0.4s ease 0s; /*W3C Standard*/
		line-height: 150%;
		text-align: center;
		width: 90%;
		padding: 40px 5%;
		min-height: 320px;
		display: inline-block;
		margin-bottom: 20px;
	background-color: #fff;
	vertical-align: top;
	box-shadow: 1px 2px 36px rgba(0,0,0,0.1);
}

.leistungsbox:hover{
	box-shadow: 1px 2px 16px rgba(0,0,0,0.3);
}

.leistungsbox img{
	width: 35%;
	margin: auto;
	margin-bottom: 25px;
}

.leistungsbox h3{
	color: #262626!important;
}


.icon{
	width: 16px;
	display: inline-block;
}

.iconbox{
	margin: auto!important;
	width: 48px!important;
	display: block!important;
}

.icontop{
	margin-bottom: -4px;
	color: #f3bf04!important;
	opacity: 1!important;
}

.iconrechts{
	margin-left: 10px;
}

.icons{
	width: 35%;
	margin: auto;
}

.leistungsbox:last-child{
	margin-right: 0;
}

.fuenfer{
	display: block;
	width: 90%;
	padding: 15px 5%;
	vertical-align: top;
	margin-bottom: 20px;
	transition: all 0.4s ease-in-out;
} 

.fuenfer:hover{
	transition: all 0.4s ease-in-out;
} 

.nummer{
	display: inline-block;
	height: 48px;
	width: 48px;
	line-height: 48px;
	font-size: 20px;
	font-weight: 400;
	background-color: #15252F;
	color: #fff;
	margin: auto;
	border-radius: 50%;
	margin-bottom: 15px;
	text-align: center;
}
	
.headlineboxmini{
	display:block;
	font-size: 135%;
	font-weight: 400;
	margin-bottom: 6px;
    color: #515151;
}
	
.modelle{
	display:block;
	font-size: 90%;
	padding: 0 3%;
}
	
.gold{
 	transition: all 0.2s ease-in-out;
   color: #d4af37;
	font-weight: 200;
}


.ohnepadd{
	padding: 0!important;
}

.newsbox{
		transition: all 0.4s ease 0s;
		position: relative;
		width: 100%;
		display:block;
		vertical-align:text-top;
		margin: 0;
		background-color: #fff;
		margin-bottom: 35px;	
		margin-right: 0;
		line-height: 24px;
	z-index: 3;
	overflow: hidden;
}

.newsbox::after{
		transition: all 0.4s ease 0s;
	position: absolute;
	bottom: 20px;
	right: 20px;
	content: '';
	width: 32px;
	height: 32px;
	background-image:url(https://gerlach.media/bilder/arrow-right.png);
	background-size: cover;
	background-repeat: no-repeat;
	z-index: 9;
}
.newsbox:hover::after{
	bottom: 18px;
	right: 14px;
	width: 36px;
	height: 36px;
}

.newsbox:hover{
	transition: all 0.4s ease 0s;    
	box-shadow: 0 2px 3.25rem 0 rgba(9,42,93,.18);

}


.newsbox img {
		transition: all 0.4s ease 0s;
	width: 100%;
	margin-bottom: 25px;
}

.newsbox:hover img{
	width: 102%;
	margin-left: -1%;
	margin-top: -1%;
}
		
.newsbox .newstext {
		padding: 0 25% 0 5%;
}

.wertbox{
	display: inline-block;
	width: 27.5%;
	padding: 8px 2% 8px 2%;
	font-size: 100%;
	transition: all 0.1s ease-in-out;
	background-color: #fff;
	border: 1px solid #ddd;
	text-align: center;
	margin-bottom: 12px;
	border-radius: 2px;
}
.wertbox:active, .wertbox:visited, .wertbox:hover{
}

.wertbox span{
	font-size: 80%!important;
	display: block;
	padding: 0!important;
	color: #aaa;
	margin-top: -6px;
}

.activeshoot{
	background-color: #053144;
	border: 1px solid #053144;
	color: #fff!important;
} 


.startboxmini:hover .gold{
		color: #fff;
	padding: 2px 6px;
    background: linear-gradient(280deg, #d4af37, #D1C6A0)!important;
		}
		

.startboxmini{
		transition: all 0.4s ease 0s;
		position: relative;
		width: 250px;
		display:inline-block;
		padding: 1%;
		vertical-align:text-top;
		margin: 0;
		background-color: #fff;
		margin-bottom: 35px;		
		padding-bottom: 65px;
		margin-right: 15px;
		line-height: 24px;
		border-radius: 4px;
	z-index: 3;
}

.schatten{
    box-shadow: 0 5px 4.25rem 0 #32323216;
}

.schattenbig{
    box-shadow: 0 5px 2.25rem 0 #0909092b;
}

.schattenbigmega{
    box-shadow: 0 5px 4.25rem 0 #09090977;
}

.schattenklein{
    box-shadow: 0 2px 1.25rem 0 #32323216;
}

.schattennormal{
    box-shadow: 0 3px .25rem 0 #0909092b;
}

.paddiv{
	padding: 25px;
}

.startblockbox{
	width: 100%;
	background-color: #fff;
    box-shadow: 0 2px 3.25rem 0 rgba(0,0,0,.08);
}
.startblockbox div{
	padding: 20px;
}

.startboxmini:focus{
	z-index: 9;
	outline: none;
		}

.startboxmini:last-child{
		margin-right: 0;
}

.startboxmini:hover{
	transition: all 0.4s ease-in-out;
	z-index: 7;
}

.startboxmini img {
		width: 90%;
		height: auto;
	margin:auto;
		margin-bottom: 15px;
}

.startboxmini p {
		color: #888;
		font-size: 90%;
	padding: 3%;
}

.carinfo{
	padding: 20px;
	background-color:#f1f6f8;
	display: block;
	font-size: 14px;
	margin-bottom: 25px;
}

.topangebot{
	background-color: #212121;
	position: absolute;
	top: 0;
	left:0;
	padding: 8px 0;
	display: block;
	color: #fff;
	text-align: center;
	font-weight: 400;
	width: 100%;
	margin-top: -20px;
}

.preisbox{
	display: inline-block;
	margin-bottom: 20px;
	padding: 12px 0;
	margin-right: 20px;
}

.preisboxklein .carpreis{
	font-size: 90%;
	color: #747a7c;
}

.carpreis{
	color: #212121;
	display: block;
	font-size: 28px;
	font-weight: 400;	
	}

	.kleinpadd{
	padding: 15px 0 ;
	}

	.breadcrumb{
		display:block;
		padding: 0;
		transition: all 0.4s ease-in-out;
		width: 100%;
		margin-bottom: 40px;
		margin: auto;
		max-width: 1490px;
		font-size: 85%;
		line-height: 1.4;
	}	
	
	.breadcrumbactive{
		transition: all 0.2s ease-in-out;
		opacity: 1;
		height: auto;
	}
	
	
	.breadcrumbin{
		font-size: 90%;
		position: relative;
		width: 100%;
		margin: auto;
		max-width: 1490px;
	}
	
	.breadcrumbin img{
		width: 16px;
	}
	
	.breadcrumbin a, .breadcrumbin a:visited{
		transition: all 0.4s ease-in-out;
		display:inline-block;
		padding: 4px 0;
		letter-spacing: 0.5px;
		text-decoration: none;
	}	
	
	.breadcrumbin a:hover, .breadcrumbin a:active{
		text-decoration: underline;
	}

	.breadcrumbin a::after{
		margin-left: 4px;
		margin-right: 4px;
		display:inline-block;
		padding: 4px;
		content: '/\00a0';
	}

	.breadcrumbin span{
		letter-spacing: 0.5px;
	}


	.breadbreak{
		display: inline-block;
		padding: 2px 2px;
	}


	
.preis {
		transition: all 0.4s ease 0s;
		font-size: 100%;
		font-weight: 300;
		background-color: #212121;
		padding: 16px 10px;
		color: #fff;
		display: block;
		border-radius: 4px;
	opacity: 0.97;
	margin: 30px 15px 15px 15px;
}

.startboxactive{
		}		

.privatebox{
	position: absolute;
	text-align: center;
	opacity: 0.0;
	font-size: 80%;
	color: #999;
	padding: 0 20px;
	display: block;
	background-color: #f3f5f99d;
	top: 0;
	left: 0;
	margin-top: -130px;
    height: 0px;
	transition: all 0.2s ease-in-out;
	overflow: hidden;
}	

.private{
	opacity: 0.77;
	transition: all 0.4s ease-in-out;
	display: block;
	background-size: cover;
    background-image: url("https://gerlach.media/bilder/okicon.svg");
    width: 64px;
    height: 64px;
	margin: auto;
}

.privatebox span{
	font-weight: 400;
	display: block;
}	

.startboxmini:hover .privatebox {
		transition: all 0.4s ease 0s;
	opacity: 1;
	margin-top: -160px;
    height: auto;
	padding: 20px;
}

.hilfe{
	border-bottom: 2px dotted #515151;
	overflow: hidden;
	position: relative;
}	

.help {
    border-bottom: 1px dotted #666;
	z-index: 1;
}

.hilfetext{
  transition: visibility 0s, opacity 0.9s linear;
	overflow: hidden;
	position: absolute;
	opacity: 0.0;
	visibility: hidden;
    background-color: #fff;
	color: #555;
	width: 200px;
	height: auto;
	border-radius: 3px;
	padding: 25px 15px;
}

.hilfe:hover .hilfetext{
	overflow: visible;
  transition: visibility 0s, opacity 0.9s linear;
	visibility: visible;
	opacity: 0.94;
	font-size: 85%;
	line-height: 24px;
	z-index: 4;
    box-shadow: 0 2px 0.25rem 0 rgba(9,42,93,.34);
	top: -50px;
	left: 140%;
}

.hilfetext:before{
  content:"";
  width: 0px;
  height: 0px;
  border-style: solid;
  border-width: 15px 15px 8px 0;
  border-color: transparent #fff transparent transparent; 
  position: absolute;
  margin-left: -128px;
	top: 35%;
}

.hilfetextbig{
 display: block;
	font-size: 140%;
	font-weight: 200;
	color: #d4af37;
	margin-bottom: 6px;
}


.fotografbild{
	display: inline-block;
	float:right;
	width: 40%;
	 margin-left: 35px;
	 height: 180px;
	vertical-align: top;
	font-size: 90%;
	 background-image: url(https://gerlach.media/bilder/galerie/portrait-stefan-gerlach.jpg);
	 background-position: 50% 5%;
	 background-size: cover;
	 background-repeat: no-repeat;
	 margin-bottom: 15px;
}


.portrait{
	width: 112px;
    border-radius: 12px;
	float:right;
	border: 6px solid #fff;
}

.passbild{
	margin: auto;
	display: block;
	width: 30%;
	 height: 145px;
	vertical-align: top;
	font-size: 90%;
	 background-image: url(https://gerlach.media/bilder/portrait-stefan-gerlach.jpg);
	 background-position: 50% 5%;
	 background-size: cover;
	 background-repeat: no-repeat;
	 margin-top: -25px;
	box-shadow: 1px 2px 26px rgba(0,0,0,0.2);
}

.passzwei{
	 background-image: url(https://gerlach.media/bilder/portrait-stefan-gerlach-zwei.jpg)!important;
}

 .galeriebild{
	display: block;
	width: 90%;
	 margin-left: 5%;
	 height: 320px;
	 vertical-align: top;
	 font-size: 90%;
	 background-image: url(https://gerlach.media/bilder/galerie/portrait-stefan-gerlach.jpg);
	 background-position: 50% 5%;
	 background-size: cover;
	 background-repeat: no-repeat;
	 margin-bottom: 15px;
}

 .maxhoch{
	 height: 190px;
}

 .studiobox{
	 height: 160px;
	width: 84%;	 
	 margin-left: 8%;
}
		
.galeriebild:hover {
}

.dreier img {
	width: auto;
	max-width: 100%;
}

.kleinschrift{
	font-size: 80%;
}

.kleinschriftmittel{
	font-size: 92%;
}

.kleinschriftgrau{
	font-size: 80%;
	color: #aaa;
	display: inline-block;
	margin-left: 6px;
}
.starticon {
	width: auto;
	max-width: 20%!important;
    text-align: center;
    margin: auto;
    transition: all 0.4s ease 0s;
}

.slidimage{
	width: 100%;
	display: block;
	margin: auto;
	margin-right: -4px;
}

.referenzbildbox{
		position: relative;
		transition: all 0.4s ease-in-out;
		float: none;
		width: 100%;
		margin: 0;
		padding: 0;
		margin-right: 6px;
		margin-bottom: -6px;
		overflow: hidden;
}

.referenzbildbox:hover{
      background-color: #21282E;       
}

.referenzbildbox img{
	transition: all 0.4s ease-in-out;
	width: 100%;
	height: auto;
}

.referenzbildbox:hover img{
	width: 100%;
	height: auto;
	opacity: 0.04;
}

.referenboxtext{
	transition: all 0.4s ease-in-out;
	position: absolute;
	left: 20px; 
	bottom: 20px; 
	margin-bottom: -30px;
	opacity: 0.0;
	font-size: 14px;
	line-height: 24px;
	color: #999;
}

.referenzbildbox:hover .referenboxtext{
	transition: all 0.4s ease-in-out;
	position: absolute;
	margin-bottom: 5px;
	opacity: 0.99;
}

.referenzbildbox span{
	color: #fff;
	display: block;
	text-transform: uppercase;
	font-weight: 400;
	font-size: 22px;
}


.inputfeld{
	padding: 10px 0 10px 0;
	position: relative;
}

.inputfeld span{
	display: block;
	font-size: 100%;
	color: #aaa;
}


.feats {
}	

.feat{
	display: inline-block;
	margin-right: 15px;
}

.featimg{
	display: inline-block;
	height: 18px;
	margin-right: 6px;
}
.feat span{
	display: inline-block;
	vertical-align: top;
	font-size: 85%;
}

















label { 
font-family: 'Arial', sans-serif;
font-weight: 500;
font-size: 90%;
padding: 6px 2px;
display: inline-block;
}


form{
	position: relative;
	padding: 2px;
}

input, form, textarea {
    margin: 0px;
    padding: 0px;
	font-family: 'Arial', sans-serif;
	font-weight: 400;
    font-size: 100%;
	width: 100%;
}

textarea{
	font-family: 'Arial', sans-serif;
	font-weight: 400;
	min-height: 300px;
	padding: 25px 5%;
	width: 90%;
}

.textareastil{
	min-height: 120px;
	margin: auto;
	margin-bottom: 25px;
	width: 90%;
	z-index: 6;
	border: 2px solid #aeacac;
}


input:required + label::after, textarea:required + label::after {
  content: "*";
  color: gray;
  margin-left: 3px;
}

textarea:required + label::after {
	top: 0!important;
}


input[type="checkbox"] {
	width: auto!important;
	text-align: left;
	display: inline-block;
}


textarea.textbox {
    display: block;
    border: 1px solid #d9d9d9;
    border-radius: 1px;
    border-top: 1px solid #c0c0c0;
    padding: 2% 4%;
    width: 90%;
    font-size: 110%;
    margin-bottom: 20px;
	min-height: 110px;
}


.submit {
	cursor: poInter;
 transition: all 0.4s ease 0s;
    background-color: #181818;
    border: 0;
    line-height: 120%;
    color: #fff;
    display: block;
	text-align:center;
    margin-bottom: 20px;
    padding: 12px 0;
	width: 100%;
    font-size: 17px;
    border-radius: 6px;
	font-family: 'Arial', sans-serif;
	font-weight: 400;
}

.submitno{
    background-color: #838383;
	cursor: not-allowed;
}

.submit:hover{
	opacity: 0.89;
}

.submitlinks{
    padding: 12px 26px;
	width: auto;
	display: inline-block!important;
}

.hiddman{
 transition: all 0.4s ease 0s;
	opacity: 0!important;
}

.scroller {
    transition: all 0.8s ease 0s;
    position: absolute;
    left: 50%;
    margin-left: -23px;
    bottom: 60px;
    width: 46px;
    height: 46px;
    display: block;
    opacity: 0.47;
    border-radius: 50%;
    z-index: 9;
}

input::placeholder, textarea::placeholder{
    color: #999;	
	font-size: 70%;
}
select {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border:none;
  border-radius: 0;
  font-size: 1em;
  width: 100%
}

select {
    padding: 1.5% 4% 1.5% 4%;
    width: 95%;
  border: 1px solid #d9d9d9;
  background-color:white;
  background-image:url(https://gerlach.media/bilder/dropdown.svg);
    font-size: 85%;
	background-repeat: no-repeat;
	background-size: 3%;
	background-position: 98% 50%;
	font-family: 'Arial', sans-serif;
	font-weight: 400;
}

select:hover {
  box-shadow: 0 1px 1px 0 rgba(0,0,0,0.1);
}


input.ipnut {
	display:block;
	border: 1px solid #d9d9d9;
	border-radius: 4px;
	border-top: 1px solid #c0c0c0;
	padding: 12px 2%;
	width: 96%;
	font-size: 85%;
	margin-bottom: 24px;
	font-weight: 400;
	position: relative;
	font-family: 'Arial', sans-serif;
	font-weight: 400;
}

input.ipnutkurz {
	width: 46%!important;
margin-bottom: 0;
	padding: 12px 1.4%;
}

textarea.ipnutarea {
	font-family: 'Inter', sans-serif;
	font-weight: 300;
	display:block;
	border: 1px solid #d9d9d9;
	border-radius: 4px;
	border-top: 1px solid #c0c0c0;
	padding: 7px 2%;
	width: 96%!important;
	font-size: 85%;
	margin-bottom: 4px;
	height: 150px;
	font-weight: 400;
}


.inputtext{
	display: block;
	padding: 10px 2px;
	font-weight: 800;
}

input::placeholder, textarea::placeholder{
color: #999;
font-size: 90%;
}	

input:active, input:focus, textarea:active, textarea:focus{
outline: none;
	border-radius: 4px;
}

.terms{
	height: 0.01px;
overflow: hidden;
}

.clear{
	clear: both;
}



.formin {
    display: block;
    border-radius: 1px;
    border: 1px solid #ccc;
    padding: 10px;
	margin: auto;
    font-weight: 400;
	background-color: #fff;
	outline: none;
	padding: 12px 2%;
	width: 96%;
	margin-bottom: 20px;
}

.forminklein{
	min-height: 100px;

}

.hinweis{
	background-color: #E0EFF7;
	padding: 6px 20px;
	font-size: 85%;
	color: #2d2d2d;
	margin: 12px 0;
	display: inline-block;
	border-radius: 32px;
}

.hinweisgelb{
	background-color: #fafbec;
	padding: 15px;
	color: #2d2d2d;
	margin: 25px 0;
	display: block;
	border-radius: 6px;
}










.letterhinweis{
transition: all 0.4s ease 0s;
height: 0px;
opacity: 0;
overflow:hidden;
background-color: #fff;
box-shadow: 1px 2px 1px rgba(0,0,0,0.4);
font-size: 90%;
position: absolute;
padding: 25px;
}

.letterhinweisactive{
transition: all 0.4s ease 0s;
height: 450px;
opacity: 1.0;
}

.webhidden, .fotohidden, .designhidden{
position: relative;
transition: all 0.4s ease 0s;
height: 0px;
opacity: 0;
overflow:hidden;
}

.openleistung{
position: relative;
transition: all 0.4s ease 0s;
height: 1060px;
opacity: 1.0;
}

video{
  display:block;
  width:100%;
  height:auto;
  background:transparent;
  outline: 1px solid transparent;
}

video {
  width: calc(100% + 1px);
  height: calc(100% + 3px);
}


.videobox{
	top: 0;
	position: relative;
  aspect-ratio: 16 / 9;
	margin-bottom: 30px;
	cursor: pointer;
	overflow: hidden;
}

.videobox iframe,  
.videobox object,  
.videobox embed,
.videobox video {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

video::-webkit-media-controls-fullscreen-button {
    display: none;
}


.player {
     contain: paint;
   height: 100%;
    width: 100%;
    max-height: 1000px;
    overflow: hidden;
}


.player video {
    position: absolute;
    inset: -1px;        /* wichtig */
    width: calc(100% + 2px);
    height: calc(100% + 2px);
    object-fit: cover;
    transform: none; 
    clip-path: inset(0 0 2px 0); /* unten 2px abschneiden */
}


*::-webkit-media-controls-panel {
	display: none!important;
	-webkit-appearance: none;
  }
  
  *::--webkit-media-controls-play-button {
	display: none!important;
	-webkit-appearance: none;
  }
  
  *::-webkit-media-controls-start-playback-button {
	display: none!important;
	-webkit-appearance: none;
  }

  .videoshowctrls *::-webkit-media-controls-panel {
	display: block!important;
}
  
.videoshowctrls *::--webkit-media-controls-play-button {
	display: block!important;
  }
  
  .videoshowctrls  *::-webkit-media-controls-start-playback-button {
	display: block!important;
  }


  .videotrailer{
	position: absolute;
	width: 100%;
	height: 100%;
	z-index: 1;
}

.trailerhide{
	display: none!important;
}
  
.playerbutton {
    width: 84px;
    height: 84px;
    background-color: #0c0c0c;
    border-radius: 50%;
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%,-50%);
    -o-object-fit: cover;
    object-fit: cover;
    transition: .3s ease-in-out;
	border: 0;
    opacity: 0.77;
	cursor: pointer;
	z-index: 5;
}

.pulse {
	animation: pulse-animation 2s infinite;
  }
  
  @keyframes pulse-animation {
	0% {
	  box-shadow: 0 0 0 0px #141414ad;
	}
	100% {
	  box-shadow: 0 0 0 30px #13131300;
	}
  }
  
  

.videobox:hover .playerbutton{
	opacity: 0.9;
    width: 90px;
    height: 90px;
}

.playerbuttonhide, .videobox:hover .playerbuttonhide {
    opacity: 0;
    width: 0;
    height: 0;
}

/* .hidden soll sich wie dein altes .playerbuttonhide verhalten */
.playerbuttonhide, .videobox:hover .playerbuttonhide {
    opacity: 0;
    width: 0;
    height: 0;
}


.clickme{
	cursor: pointer;
	z-index: 5;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.clickmehide{
    opacity: 0;
    width: 0;
    height: 0;
	overflow: hidden;
}


#back-to-top, .touch-device #back-to-top:hover {
    height: 0;
    width: 0;
    bottom: 0;
    opacity: 0.0;
}



.beschhead{
	font-weight: 300;
	font-size: 20px;
	color: #999;
	margin-bottom: 25px!important;
}


.teamboxbild{
	margin-right: -4px;
	transition: all 0.4s ease-in-out;
	width: 100%;
	height: auto;
	min-height: 430px;
	display: block;
	background-image:url(https://gerlach.media/bilder/stefan_hover.jpg);
	background-size: auto 120%;
	background-repeat: no-repeat;
	background-position: 65% 50%;
	margin: 0!important;
}

.teamboxstefan:hover{
	background-image:url(https://gerlach.media/bilder/stefan_hover.jpg);
}

.teamboxjessica{
	background-image:url(https://gerlach.media/bilder/jessica_hover.jpg);
	background-size: auto 110%;
	background-position: 50% 50%;
}

.teamboxjessica:hover{
	background-image:url(https://gerlach.media/bilder/jessica_hover.jpg);
}

.teamboxdu{
	background-image:url(https://gerlach.media/bilder/du.jpg);
	background-size: auto 100%;
	background-position: 50%;
}

.seitenbildrechts{
	transition: all 0.4s ease-in-out;
	width: auto;
	max-width: 100%;
	height: auto;
	display: block;
}		

.seitenbild{
	position: relative;
	transition: all 0.4s ease-in-out;
	width: 100%;
	height: auto;
	display: block;
	margin-bottom: 30px!important;
	border-radius: 4px;
	margin: auto;
}

.seitenbildmini{
	position: relative;
	transition: all 0.4s ease-in-out;
	width: auto;
	max-width: 90%!important;
	height: auto;
	display: block;
	margin-bottom: 40px!important;
	border-radius: 4px;
	margin: auto;
}

.bildbox{
	width: 100%;
	height: auto;
	display: block;
	margin-bottom: 30px!important;
	color: #999;
}

.bildbox img{
	width: auto;
	max-width: 100%;
	margin-bottom: 10px;
}

.scrolldiv{
	width: 100%;
	overflow-x: scroll;
    white-space: nowrap;
    -webkit-overflow-scrolling: touch;
}

.galeriebox{
	width: 320px;
	height: auto;
	display: inline-block;
	color: #999;
	margin-right: 12px;
}

.galeriebox img{
	width: auto;
	max-width: 100%;
	margin-bottom: 10px;
}

.sbborder{
	border: 1px solid #ddd;
}

.seitenbildsubnav{
	position: relative;
	transition: all 0.4s ease-in-out;
	width: 90%;
	height: auto;
	display: block;
	border-radius: 4px;
	margin-left: 10%
}


.seitenbildmarg{
}
.doppelbild{
	display: inline-block;
	margin-left: 15px;
	transition: all 0.4s ease-in-out;
	max-width: 45%;
	height: auto;
	width: auto;
}		

.doppelbild span{
	display: block;
	text-align: center;
	margin-bottom: 30px;
}
.fahrzeugbild{
	transition: all 0.4s ease-in-out;
	width: auto;
	max-width: 100%;
	height: auto;
	display: block;
}

.portraitbild{
	transition: all 0.4s ease-in-out;
	width: auto;
	max-width: 300px;
	height: auto;
	display: block;
	margin-bottom: 35px;
}	

.boxlist{
		transition:all 1s ease 0s;
		position: relative;
		width: 90%;
		padding: 5%;
		margin-bottom: 40px;
		text-align:left;
		line-height: 140%;
		background-color: #fff;
		overflow: hidden;
		box-shadow: 1px 2px 13px rgba(0,0,0,0.1);
}

.abstandtext{
	display: none;
}

.tabelleover{
	white-space: pre-line!important;
	position: relative;
	width:100%;
	overflow: auto!important;
}

table.tabelle {
	position: relative;
	font-size: 90%;
	border-collapse: collapse;
    border-spacing: 0;
	width: 100%; 
	border: 0; 
	margin-bottom: 10px; 
	margin-top: 8px; 
	white-space: normal;
	letter-spacing: 0.2px;

}
table.tabelle tr td {transition: all 0.4s ease; background: #fff; border:0; padding: 10px 6px; line-height: 1.4;}
table.tabelle tbody tr:nth-child(even) td { background: #F6F9FC; }
	.tabelle th {
		font-weight: 500;
		padding: 10px 6px;
		text-align: left;
		background: #e6e8e8;
	}




table {
	display: block; 
  width: 100%;
  table-layout: fixed;
      max-width: 100%;
    box-sizing: border-box;
	overflow-x: auto;
	white-space: normal;
	word-break: break-word;
		border: 1px solid #ccc; /* etwas dunklerer Rahmen */
	border-radius: 6px;
	border-collapse: separate;
	border-spacing: 0;
	margin-bottom: 2rem;
	-webkit-overflow-scrolling: touch;
	margin: 30px 0 50px 0;
	font-size: 90%;
  }
  
  table th,
  table td {
	padding: 0.9rem 1.2rem;
	border-bottom: 1px solid #e0e0e0;
	text-align: left;
	vertical-align: top;
	  white-space: normal;
  overflow-wrap: break-word;
width: 1%;
}
  
  /* Letzte Zeile ohne Border */
  table tr:last-child td {
	border-bottom: none;
  }

  tr{
    transition: background-color 0.2s;
  }  
  tr:hover{
	background-color: #e2eaf07c;
  }

  table thead {
	background-color: #e2eaf0;
  }
  
  /* letzte Zeile ohne Border */
  tr:last-child td {
	border-bottom: none;
  }

  td + td,
  th + th {
	border-left: 1px solid #e0e0e0;
  }




	.darkbg .tabelle th {
		background-color: #000;
		padding: 15px 10px;
		text-align: left;
	}	
	.darkbg .tabelle {
		font-size: 125%;
		border: 1px solid #eee;
	}	

	.darkbg .tabelle td{
		background: transparent;
		border-bottom: 1px solid #eee;
		padding: 15px 10px;
	}	
	
	.darkbg .tabelle tr:nth-child(even) td{
		background: transparent;
	}

	.tabelleoverzwei .tabelle th {
		background-color: #000;
		color: #fff;
	}	

	.tabelleoverzwei td, .tabelleoverzwei th{
		padding: 15px 15px!important;
	}
	
	.tabelleoverzwei td:nth-child(even), .tabelleoverzwei th:nth-child(even)  {
		text-align: right;
	}

/* ----------------- TERMINE ---------------------------------------------------------------|
----------------------------------------------------------------------------------------------*/
	
										
.termininfos{
		line-height: 140%;
		margin: 20px 0 10px 0;
	font-size: 90%;
	color: #888;	
}
											
.termininfos span{
		font-weight: 400;
}
					
.terminbox{
		transition:all 1s ease 0s;
		position: relative;
		width: 96%;
		padding: 2%;
		margin-top: 20px;
		text-align:left;
		line-height: 140%;
		background-color: #fff;
		overflow: hidden;
		box-shadow: 1px 2px 23px rgba(0,0,0,0.1);
}

.minitermin{
		width: 96%;
		padding: 2%;
		margin-top: 20px;
}

.terminbox a, .terminbox a:hover,.terminbox a:visited,.terminbox a:active{
	color: #333;	
}

.belegtbox{
	color: #888!important;
	background-color: #F4F3F1;
}

.belegtboxin{
    filter: blur(7px);
	opacity: 0.7;
}
.belegtbox h3{
	color: #888!important;
}

.terminboxhinweis{
	position: absolute;
	transform: rotate(24deg);
	color: #fff!important;
	background-color: #981359;
	padding: 3px;
	display: block;
	width: 120px;
	text-align: center;
	right: 0;
	top:4px;
	margin-right: -30px;
	font-size: 90%;
	
}

.belegthinweis{
	z-index: 3;
	color: #981359;
	position: absolute;
	background-color: #fff!important;
	padding: 15px 33px;
	display: block;
	width: 150px;
	text-align: center;
	left: 50%;
	top:50%;
	margin-top: -25px;
	margin-left: -100px;
	font-size: 135%;
	box-shadow: 1px 1px 6px rgba(0,0,0,0.4);
	opacity: 0.87;
}



.terminbox:hover{
		background-color: #fff;
		box-shadow: 1px 2px 23px rgba(0,0,0,0.2);
}
								
.termininhalt{
		float:left;
		width: 75%;
		margin-top: 2%;
}

									
.kostenbox{
		transition:all 1s ease 0s;
		background-color: #F4F3F1;
		position: absolute;
		right: 2%;
		bottom: 7.7%;
		padding: 4px 10px;
		opacity: 0.7;
}
							
.terminzettel{
		background-color: transparent;
		color: #303e48;
		border-right: 1px solid #ddd;
		float:left;
		transition:all 1s ease 0s;
		padding: 2%;
		text-align:center;
		line-height: 90%;
		font-weight: 400;
		font-size: 200%;
		margin-right: 3%;
		width: 15%;
}
								
								
.terminbox:hover .kostenbox{
		background-color: #78BF46;
		color: #fff;
		opacity: 1.0;
}
								
.terminbox:hover .terminzettel{
	color: #981359;
}
								
.terminzettel span{
		display:block;
		font-size: 50%;
		font-weight: normal;
}

.terminbox:hover .terminzettel span{
	color: #303e48!important;
}
	
								
.terminkachel{
		background-color: #FBFBFB;
		color: #303e48;
		float:left;
		transition:all 1s ease 0s;
		padding: 2% 5%;
		text-align:center;
		line-height: 90%;
		font-weight: 400;
		font-size: 140%;
		margin-right: 2%;
		margin-bottom: 2%;
		width: 20%;
}
								
.terminkachel span{
		display:block;
		font-size: 50%;
		font-weight: normal;
}

							
.terminkachel:hover{
		background-color: #ECE9E5;
		color: #303e48;
}


/* Zoom in Keyframes */
@-webkit-keyframes zoomin {
  0% {transform: scale(1);}
  50% {transform: scale(1.5);}
  100% {transform: scale(1);}
}
@keyframes zoomin {
  0% {transform: scale(1);}
  50% {transform: scale(1.5);}
  100% {transform: scale(1);}
} /*End of Zoom in Keyframes */

/* Zoom out Keyframes */
@-webkit-keyframes zoomout {
  0% {transform: scale(1);}
  50% {transform: scale(0.67);}
  100% {transform: scale(1);}
}
@keyframes zoomout {
    0% {transform: scale(1);}
  50% {transform: scale(0.67);}
  100% {transform: scale(1);}
}/*End of Zoom out Keyframes */



.wirbox {
    position: relative;
	transition: all 0.2s ease-in-out;
    padding: 45px 5% 125px 5%;
    margin-bottom: 1px;
    display: block;
    width: 90%;
    line-height: 160%;
    overflow: hidden;
	vertical-align: top;
	min-height: auto;
}

.wirbox:hover {
	opacity: 0.97;
}

.wave-bottom {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
	z-index: 0;
	height: 30px;
	background-image: url(https://gerlach.media/bilder/wave-bottom.svg);
	background-size: cover;
	background-repeat: no-repeat;
}



.mittelblaubg {
      background-color: #5B6772;       
	color: #eee;
}

.dunkelblaubg {
    background-color: #060A0D;    
	color: #eee;
}

.orange {
    color: #E25B13;
}

.orangebg {
    background-color: #E25B13;
}
.tuerkiesbg {
    background-color: #616D7C;    
	color: #eee;
}

.pinkbg {
    background-color: #616D7C;    
	color: #eee;
}


.kundenbox, .jobbox {
    position: relative;
    transition: all 0.2s ease-in-out;
    background-color: #fff;
    padding: 0;
    margin-bottom: 20px;
    display: inline-block;
    width: 320px;
    line-height: 160%;
    overflow: hidden;
	box-shadow: 0px 1px 3px 0px rgba(0,0,0,0.2);
	border-radius: 1px;
	min-height: 220px;
	margin-left: 25px;
}


.kundenbox .referenzbeschreibung,  .jobbox .referenzbeschreibung{
	transition: all 0.4s ease-in-out;
	position: relative;
	padding: 20px 35px 20px 35px;
	font-size: 90%;
	line-height: 145%;
}

.kundeseit{
	font-size: 90%;
	color: #aaa;
	display: block;
	padding-top: 25px;
}

.abstand{
	display: inline-block;
	padding: 4px 4px;
	width: 120px;
	font-weight: 400;
}

.abstandzwei{
	display: inline-block;
	padding: 4px 4px;
	width: 260px;
	font-weight: 400;
}




.karte{width:100%;height:320px;}




.mobileinlinehide{
	display:none;
}
	


.markenlogos{
    position: relative;
    padding: 10px 2.5% 10px 2.5%;
	transition: all 0.4s ease-in-out;
    width: 95%;
    overflow-x: scroll;
    overflow-y: hidden;
    white-space: nowrap;
    -webkit-overflow-scrolling: touch;
    vertical-align: middle;
    text-align: center;
}

.markenlogos::-webkit-scrollbar {
    display: none;
}

.markenlogos:hover{
}

.markenlogo{
    -webkit-filter: grayscale(1);
    filter: grayscale(1);
    opacity: 0.9;
    width: auto;
	height: 45px;
    display: inline-block;
	transition: all 0.4s ease-in-out;
    margin-right: 40px;
}


.gmlogos{
    -webkit-filter: grayscale(0);
    filter: grayscale(0);
    opacity: 1;
    width: auto;
	height: 45px;
    display: inline-block;
	transition: all 0.4s ease-in-out;
    margin-right: 40px;
	vertical-align: middle;
}

.gmlogosklein{
	height: 30px;
}
.gmlogosganzklein{
	height: 25px;
}

.markenbig{
    width: auto;
	height: 45px;
    margin-bottom: 10px;
}

.markenlogo:hover{
    opacity: 0.97;
}

.markenlogoblock{
    -webkit-filter: grayscale(1);
    filter: grayscale(1);
    opacity: 0.2;
    height: 60px;
	text-align: center;
    display: block;
	transition: all 0.4s ease-in-out;
	margin: auto;
    margin-bottom: 40px;
}

.markenlogoblock:hover{
    opacity: 0.7;
}


.lens{
    display: block;
    position: absolute;
    top: 50%;
    left: 50%;
    padding: 14px;
    background: #21282E url(https://gerlach.media/bilder/lens.svg) no-repeat 54% 50%;
    background-size: 54%;
    border-radius: 50%;
    text-align: center;
    vertical-align: middle;
    z-index: 9;
    transform: translateX(-50%) translateY(-50%);
    transition: background-color .25s,background-size .25s,border-radius .25s,opacity .25s,transform .25s,top .25s;
	opacity: 0.8;	
    width: 45px;
    height: 45px;	
}


.referenzbildbox .play, .referenzbildbox .lens{
	top: 50%;
		width: 42px;
		height: 42px;
		transition: all 0.2s ease 0s;
		opacity: 0.1!important;	
}

.referenzbildbox:hover .play, .referenzbildbox:hover .lens{
		opacity: 0.7!important;		
}


.schnuppern{
	background-image: url(https://gerlach.media/bilder/diffbg.jpg);
	background-size: cover;
	background-position: 50% 10%;
	padding: 15px 0;
}

.absatz{
	margin-bottom: 35px;
}

.boxtext{
	font-size: 90%;
}

.absatzgross{
	margin-top: 25px;
	margin-bottom: 25px;
}

.maxwid{
    max-width: 500px;
	padding: 0 5%;
}

.maxweite {
    max-width: 90%!important;
	padding: 0 5%;
}

.maxbreiteeins{
    max-width: 950px!important;
}

.maxbreitezwei{
    max-width: 800px!important;
}

.maxbreite{
    max-width: 850px!important;
	margin: auto auto!important;
}
.maxbreitekurz{
    max-width: 650px!important;
	margin: auto auto!important;
}

.thatsitbox{
    max-width: 650px!important;
	padding: 20px 0;
	margin: auto auto!important;
}

.maxbreitelang{
    max-width: 960px!important;
	margin: auto auto!important;
}

.maxbreitelangmitte{
    max-width: 1060px!important;
	margin: auto auto!important;
}

.maxbreitelangzwei{
    max-width: 1260px!important;
	margin: auto auto!important;
}
.maxbreitelangdrei{
    max-width: 1160px!important;
	margin: auto auto!important;
}
.maxbreitelanglp{
    max-width: 1060px!important;
	margin: auto auto!important;
}

.mittig{
	text-align: center!important;
	margin: auto auto!important;
}

.mrgauto{
	margin: auto auto!important;
}

.textmittig{
	text-align: center!important;
}
.textlinks{
	text-align: left!important;
}
.bloginhalt{
	margin: auto auto!important;
}

.mobilehide{
	transition: all 0.4s ease 0s;
	height: 0;
	overflow: hidden;
	display: none;
}

.show{
	height: 1060px!important;
}

.hide{
	height: 0;
	overflow: hidden;
}

a.servicelink, a.servicelink:visited {
		transition: all 0.4s ease 0s;
		display:block;
		text-decoration: none;
		padding: 8px 18px;
		text-align:center;
		background-color: #fff;
		margin: 0px;
		opacity: 0.7;
}

a.servicelink:hover, a.servicelink:active {
		z-index: 5;
		text-decoration: none;
		opacity: 0.9;
		color: #636363;
	box-shadow: 0px 3px 63px 0px rgba(0,0,0,0.5);
}

a.leistungslink, a.leistungslink:visited {
    transition: all 0.8s ease;
    display: inline-block;
    background-color: #fff;border: 1px solid #212121;
    color: #212121;
    border-radius: 3px;
    padding: 18px 25px 18px 25px;
    opacity: 1.0;
	font-weight: 400;
	margin-right: 6px;
	margin-bottom: 6px;
}

a.leistungslink:hover, a.leistungslink:active {
		text-decoration: none;
		color: #fff;
	background-color: #212121;
}

.leistungslinkaktiv {
    background-color: #212121!important;
	border: 1px solid #212121;
    color: #fff!important;
}


.buttonlink span{
	font-weight: 300;
	font-size: 70%;
	letter-spacing: 0.2px;
	display: block;
	margin-top: -4px;
	opacity: 0.7;
}

.diffbuton{
	background-color: #15252F;
    transition: all 0.2s ease!important;
}

.diffbuton{
	background-color: #15252F!important;
}
.diffbuton:hover{
	background-color: #263842!important;
}


.absolutelink{
	position: absolute;
	right: 25px;
	bottom: 40px;
	background-color: #636363!important;
	padding-left: 46px!important;
	background: url(https://gerlach.media/bilder/arrow.svg) no-repeat 10% center;
	background-size: 14%;
}

.absolutelinkzurueck{
	z-index: 9;
	position: absolute;
	left: 15px;
	bottom: 10px;
	background-color: #636363!important;
	padding: 4px 8px!important;
	padding-left: 26px!important;
	background: url(https://gerlach.media/bilder/arrow-left.svg) no-repeat 5% center;
	background-size: 8%;
	font-size: 16px;
}

a.beispiellink, a.beispiellink:visited {
		transition: all 0.4s ease 0s;
		display:inline-block;
		text-decoration: none;
		padding: 6px 18px;
		color: #fff;
		text-align:center;
		background-color: #666;
		border-radius: 2px;
    	box-shadow: 1px 2px 1px rgba(0,0,0,0.3);
		font-size: 90%;
}

a.beispiellink:hover, a.beispiellink:active {
		text-decoration: none;
		opacity: 0.9;
		color: #fff;
		background-color: #636363;
}
.slim {
    font-weight: 300!important;
	color: #999;
}

.borderblau{
	height: 1px;
	border-bottom: 6px solid #636363;
}

.border{
	display: block;
	height: 0px;
	border-bottom: 1px solid #eee;
	margin: 5px 0 10px 0;
}

.borderbottom{
	left: 50%;
	height: 40px;
	border-left: 1px dashed #aaa;
	width: 1px;
	margin: 0 0 25px 0;
}

.borderfoto{
	display: block;
	height: 60px;
	margin: auto;
	margin-top: 45px;
	background: url(https://gerlach.media/bilder/border-icon.png) no-repeat center center;
background-size: auto;
background-position: 50% 50%;
}

.anfragelink {
    background-color: #eee;
}

.anfragelink:hover {
    background-color: #636363;
	color: #fff!important;
}

.farbe {
    color: #fff;
    background-color: #636363;
	padding: 6px 18px;
	line-height: 180%;
	display: inline-block;
}

.wirbox .farbe {
     background-color: #fff;       
    background: linear-gradient(360deg, #fff, #fff)!important;
	color: #5B6772;
	position: absolute;
	bottom: 35px;
	font-size: 22px;
}

.linkfarbe {
    background-color: #636363;
    background: linear-gradient(360deg, #27435C, #232f3a)!important;
}

.linkbig {
    font-size: 18px;
    display: block;
    padding: 13px 36px!important;
}


a.kleinbutton, a.kleinbutton:visited {
    transition: all 0.4s ease;
    display: inline-block;
    border: 0px;
    border-radius: 1px;
    padding: 3px 8px 3px 8px;
    opacity: 1.0;
	font-size: 75%;	
	position: relative;
	background-color: #eeeded;
	color: #222;
	z-index: 2;
}

a.kleinbutton:hover, a.kleinbutton:active {
		text-decoration: none;
		opacity: 0.97;
		color: #222;
}
figcaption{
	display: block;
	padding: 6px;
	font-size: 85%;
}

figure.seitenbild figcaption {
	margin: auto;
	text-align: center;
  margin-top: 12px;
  color: #666;
  line-height: 1.4;
  max-width: 320px;
}

.brkmg{
	clear:both;
	margin-bottom: 15px;
}


.gmtext {
    color: #636363;
	padding: 2px 0;

	display: block;
	font-weight: 400;
}

#menuelink{
	z-index: 99999;
	display:inline-block;
	transition: all 0.4s ease 0s;
	position: absolute;
	height: 60px; 
	width: 60px;
	right:1.5%;
	top: 2px;
	cursor: pointer;
	outline:none;
	border-radius: 50%;
	text-align: center;
}





#menue{
		display:block;
		width: 100%;
		margin-bottom: 0!important;
		}

.open #menue li{
		margin-left: 0px;
		display: block;
}

#menue li:hover{
		color: #13181C;
}



.closerlinks{
	position: absolute;
	transition: all 0.4s ease 0s;
	background-color: #212121;
	height: 2px;
	width: 36px;
	top: 15px;
	left: 10px;
}

#menuelink:hover .closermittel{
	width: 36px;
}

#menuelink:hover .closerrechts{
	width: 36px;
}

.closermittel{
	position: absolute;
	transition: all 0.4s ease 0s;
	background-color: #212121;
	height: 2px;
	width: 36px;
	top: 26px;
	left: 10px;
}

.closerrechts{
	position: absolute;
	transition: all 0.4s ease 0s;
	background-color: #212121;
	height: 2px;
	width: 36px;
	top: 36px;
	left: 10px;
}

.menuelinksloseactive .closerlinks{
	-moz-transform: rotate(-45deg);
	-ms-transform: rotate(-45deg);
	-o-transform: rotate(-45deg);
	-webkit-transform: rotate(-45deg);
	top: 25px;
	background-color: #212121;
}

.menuelinksloseactive .closerrechts{
	-moz-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	-o-transform: rotate(45deg);
	-webkit-transform: rotate(45deg);
	top: 25px;
	background-color: #212121;
}

.menuelinksloseactive .closermittel{
	opacity: 0.0!important;
}

.menuelinksloseactive:hover .closermittel{
	width: 36px;
}

.menuelinksloseactive:hover .closerrechts{
	width: 36px;
}

.stoererover{
	transition: all 0.4s ease 0s;
	z-index: 10;
	opacity: 0;
	visibility: hidden;
}

.stoererovershow{
	visibility: visible;
	opacity: 1;
}

.stoerer{
	position: fixed;
		z-index: 11;
		display:block;
		transition: all 0.1s ease 0s;
		width: 100%;
		top: 50%;
		left: 50%;
		transform:translate(-50%,-50%);
		padding: 5%;
		background-color: #fff;
		text-align:center;
		overflow: hidden;
		width: 90%;
		max-width: 660px;
		border-radius: 12px;
		line-height: 1.6;
}

.stoerertitel{
	font-weight: 800;
	font-size: 210%;
	display: block;
	margin-bottom: 35px;
	letter-spacing: -0.4px;
}

.stoererclose {
    z-index: 100;
    background-color: #0c0c0c;
    border-radius: 100px;
    justify-content: center;
    align-items: center;
    width: 40px;
    height: 40px;
    display: flex;
    position: absolute;
    inset: 2% 2% auto auto;
	color: #fff;
	margin: 20px;
}

.stoererhide{
	visibility: hidden!important;
	opacity: 0;
}

.nav{
	font-size: 130%;
	position: fixed;
		z-index: 99999;
		display:block;
		transition: all 0.1s ease 0s;
		width: 100%;
		height: 0;
		top: 0;
		padding: 0 5% 0 5%;
		background-color: #fff;
		text-align:left;
		left: 0;
		overflow: hidden;
}

.open{
		margin-top: 0;
		transition: all 0.1s ease 0s;
		overflow:scroll;
		border-radius: 4px;
		height: 100vH;
		top: 72px;
		left: 0;
		padding: 20px 5% 20px 5%;
		box-shadow: rgba(255, 255, 255, 0.1) 0px 1px 1px 0px inset, rgba(50, 50, 93, 0.25) 0px 50px 100px -20px, rgba(0, 0, 0, 0.3) 0px 30px 60px -30px;
		padding-bottom: 250px;
	}



.rotschrift{
	color: #b00e3c;
}

.gruenschrift{
	color: #0489cc;
}

a.menuenavueber, a.menuenavueber:visited{
		text-align:left;
		transition: all .7s ease-in-out;
		color: #212121;
		text-decoration: none; 
		display:inline-block;
		padding: 8px 10px;
		font-weight:500;
		margin: auto;
		margin-top: 20px;
		font-size: 130%;
		letter-spacing: 0.6px;
}


a.menuenavueber:hover, a.menuenavueber:active{
		color: #212121;
		text-decoration: none; 
}

a.miniheadlink, a.miniheadlink:visited{
		transition: all .7s ease-in-out;
		color: #212121;
		text-decoration: none; 
		display:inline-block;
		padding: 2px 0px 2px 20px;
		font-size: 16px;
		font-weight:400;
		margin: auto;
}


a.miniheadlink:hover, a.miniheadlink:active{
		color: #212121;
		text-decoration: none; 
}



	
	a.menuenavueber:hover, a.menuenavueber:active{
			color: #444;
			text-decoration: none; 
	}
	
	.subnav{
		position: relative;
		left: 0;
		top: 0px;
		height: 0;
		visibility: hidden;
		overflow: hidden;
		z-index: 99;
		background-color: #fff;
	}
	
	#menue li:focus .subnav, #menue li:active .subnav, #menue li:hover .subnav  {
		transition: all 0.1s ease 0s;
		height: auto;
		padding: 0;
		visibility: visible;
		overflow: show;
}


	
	.subnavopen {
		visibility: visible;
		transition: all 0.1s ease 0s;
		width: 100%;
		height: auto;
		padding: 20px;
		overflow: scroll;
	}
	
	
	

.nav .graubg{
	background-color: #fff;
}

.menuenavueberactive{
		border-bottom: 0;
	font-weight: 600!important;
		padding: 10px 10px 10px 20px!important;
	background-image: url(https://gerlach.media/bilder/arrow-right.svg);
	background-position: 0 45%;
	background-repeat: no-repeat;
	background-size: 6%;
}

.externlink img{
	width: 10px;
	padding-left: 6px!important;
}


.serviceicon{
	width: 150px!important;
	display: block;
	margin: 35px 0 35px 0;
	opacity: 0.7;
}

.leisticon{
	transition: all .4s ease-in-out;
	width: 90px!important;
	height: 90px!important;
	padding: 25px;
	display: block;
	opacity: 0.7;
	border-radius: 3px;
	text-align: center;
	margin: auto;
	margin-right: 12px;	
	margin-bottom: 12px;
	overflow: hidden;
}

.leisticon img{
	width: 85%!important;
	margin: auto;
	transition: all .4s ease-in-out;
}

.map{
	width: 100%;
	height: 300px;
}

.gmcolor{
	color: #0c0c0c;
}

.gmfarbe{
	color: #0c0c0c ;
}
.werbediv{
	background-color: #e9eed7;
	padding: 30px;
}

.buntbg {
    background-image: linear-gradient(120deg, #e5e6ca 0%, #a9c5ce 100%);
}

a.imtext, a.imtext:visited {
	transition: all .4s ease-in-out;
		color: #515151;
		text-decoration: underline;
}

a.imtext:hover, a.imtext:active {
		color: #515151;
		text-decoration: none;
}


a, a:visited{
		color:#212121; 
		text-decoration: none;
}
a:hover, a:active{
		color:#212121; 
		text-decoration: none;
}

a.text, a.text:visited {
	text-decoration: none;
	transition: all .4s ease-in-out;
		color: #0c0c0c; 
		display: inline;
		overflow: hidden;
		padding: 0px 1px;
		text-decoration: none;
		padding: 2px 0;
		text-decoration: underline;
    text-underline-offset: 4px;
    text-decoration-thickness: 1px;
	}

a.text:hover, a.text:active {
	text-decoration: none;
	background-color: #F6F9FC;
	border-bottom: 0px solid #0c0c0c;
}

a.bloglink, a.bloglink:visited {
	text-decoration: none;
	transition: all .4s ease-in-out;
		color: #222; 
	}

a.bloglink:hover, a.bloglink:active {
	text-decoration: none;
	color: #111;
	background-color: #0B6DFF16;
}


a.textlinkblock, a.textlinkblock:visited {
	text-decoration: none;
	transition: all .4s ease-in-out;
		color: #000000; 
		display: inline;
		text-decoration: none;
	}

a.textlinkblock:hover, a.textlinkblock:active {
	text-decoration: none;
	color: #0c0c0c ;
	background-color: #0B6DFF14;
}


/*
a.text::before{
	position: absolute;
	right: 0;
	bottom: 0;
	transition: all .4s ease-in-out;
	content: '';
	width: 100%;
	height: 1px;
	background-color: #181818;
	margin-bottom: 1px;
	z-index: 1;
}

a.text::after{
	position: absolute;
	left: 0;
	bottom: 0;
	transition: all .9s ease-in-out;
	content: '';
	width: 0;
	height: 1px;
	background-color: #181818;
	margin-bottom: 1px;
	z-index: 1;
}

a.text:hover::before{
	width: 0;
}
a.text:hover::after{
	width: 100%;
}
*/

.txtmargleft{
	margin-left: 6px;
}


a.weisslink, a.weisslink:visited {
	display: inline-block;
	transition: all .4s ease-in-out;
		color: #fff!important;
		text-decoration: underline;
}

a.weisslink:hover, a.weisslink:active {
		color: #fff;
		text-decoration: none;
}

a.blocklinkbox, a.blocklinkbox:visited {
	display: inline-block;
	transition: all .4s ease-in-out;
		color: #515151;
		padding: 4px 12px;
		border-radius: 4px;
		margin-bottom: 7px;
		text-decoration: none;
}

a.blocklinkbox:hover, a.blocklinkbox:active {
		color: #515151;
		text-decoration: none;
		font-weight: 400;
		background-color: #fff;
}

a.blocklink, a.blocklink:visited {
	display: inline-block;
	transition: all .4s ease-in-out;
		color: #515151;
		text-decoration: none;
		padding: 2px 8px;
}

a.blocklink:hover, a.blocklink:active {
		color: #515151;
		text-decoration: underline;
}
a.textblocklink, a.textblocklink:visited {
	display: block;
	padding: 12px 10px;
	transition: all .4s ease-in-out;
		color: #181818;
		text-decoration: none;
		border-bottom: 1px solid #eee;
}

a.textblocklink:hover, a.textblocklink:active {
		color: #181818;
		text-decoration: underline;
}

a.staedtelink, a.staedtelink:visited {
	display: inline-block;
	transition: all .4s ease-in-out;
		color: #515151;
		padding: 12px 5%;
		margin-bottom:1px;
		margin-right: -4px;
		text-decoration: none;
		width: 39.5%;
		text-align: center;
		background-color: #fff;
}

a.staedtelink:hover, a.staedtelink:active {
		background-color: #212121;
		color: #fff;
		text-decoration: none;
		font-weight: 400;
		box-shadow: 0 2px 3.25rem 0 rgba(0,0,0,.28);
		z-index: 9;
}

.stratelink{
	display: inline-block;
	transition: all .4s ease-in-out;
		color: #212121;
		padding: 6px 18px;
		margin-bottom:1px;
		text-decoration: none;
		text-align: center;
		background-color: #dde6eea9;
		border-radius: 4px;
		font-size: 90%;
		margin-bottom: 20px;
		cursor: default;
}

.stratelink:hover {
		background-color: #fff;
		color: #212121;
		text-decoration: none;
		box-shadow: 0 2px 3.25rem 0 rgba(0,0,0,.08);
		z-index: 9;
}


ul{
	margin: 0px; 
	padding: 0px; 
	list-style-type:none; 
}

li{
	margin: 0px; 
	padding: 0px;
}

ul.list{
	list-style-type:none;
	padding-left: 6px;
	list-style-position: inside;
	white-space: normal!important;
}

ul.listzwei{
	list-style-type:none;
}

ul.listzwei li {
	margin-left: 34px;
	padding: 3px 0;
	margin-bottom: 20px!important;
}

ul.listpdtop span {
	padding-top: 10px;
}
ul.listzwei span, ul.listzwei p {
	display: block;
	font-weight: 600;
	margin-bottom: 5px;
}

.minlinehei{
	line-height: 1.4;
}

.minlinehei li {
	margin-bottom:10px;
}

ul.list li {
	margin-left: 34px;
	padding: 3px 0;
}

ul.listweiss {
	margin-left: 32px;
	padding: 6px 0;
	color: #fff;
}

ul.listweiss li {
	margin-left: 32px;
	padding: 6px 0;
}


ul.list li::before {
  content: "";
  position: absolute;
  left: -32px;
  top: 50%;
  width: 6px;
  height: 6px;
  border-right: 1.5px solid #111;
  border-top: 1.5px solid #111;
  transform: translateY(-50%) rotate(45deg);
}

ul.listzwei li::before {
  content: "";
  position: absolute;
  left: -36px;
  top: 50%;
  width: 9px;
  height: 9px;
  border-right: 2.5px solid #111;
  border-top: 2.5px solid #111;
  transform: translateY(-50%) rotate(45deg);
}



ul.listnein li:before {
	background-color: #d1c0c4;
	position: absolute;
    content: '';
	background-size: 18px;
    background-image: url("https://gerlach.media/bilder/listnein.svg");
	background-position: 50%;
	background-repeat: no-repeat;
    width: 30px;
    height: 30px;
	margin-left: -45px;
	border-radius: 50%;
	top: 25px;
}

ul.listiconzwei li:before {
	position: absolute;
    content: '';
	background-size: cover;
    background-image: url("https://gerlach.media/bilder/okiconzwei.svg");
    width: 18px;
    height: 18px;
	margin-left: -30px;
	margin-top:2px;
}





ul.listno li:before{
    background-image: url("https://gerlach.media/bilder/noicon.svg")!important;
}
	
ul.listyes li:before{
    background-image: url("https://gerlach.media/bilder/yesicon.svg")!important;
}
ul.listiconzwei li {
	margin-bottom: 14px;
}

ul.listiconzwei {
	margin-left: -8px;
	margin-top: 10px;
}

a.subnavilink, a.subnavilink:visited {
	display: block;
    padding:6px 14px;
    line-height: 135%;
    transition: all 0.4s ease 0s;
	color: #111;
	font-size: 18px;
	font-weight: 400;
}			
        
a.subnavilink:active, a.subnavilink:hover {
     transition: all 0.4s ease 0s;
    text-decoration: none; 

}


.kontaktbox{
	display: none;
}

.fzwahlbox{
	position: absolute;
	width: 0;
	overflow: hidden;
	padding: 15px 0;
	z-index: 99;
	top: 150px;
	left:8px;
	color: #999;
	height: 22px;
    transition: all 0.2s ease 0s;
	opacity: 0;
	border-radius:6px;
}

.fzwahlbox_open{
	width: 90%;
	overflow: hidden;
	box-shadow: 0px 2px 14px 2px rgb(0 0 0 / 4%);
	background-color: #fff;
	padding: 15px;
	opacity: 1;
}




.fzboxclose{
display: none;
}


.gstar{
	width: 20px;
	margin-bottom: -2px;
}

.paddingbox4{
	padding: 50px;
}

.paddingbox2{
	padding: 50px!important;
}

.paddingbox3{
	padding: 20px;
}



.scrollbox{
	position: relative;
	transition: all 0.4s ease-in-out;
	width: 100%;
	overflow-x: scroll;
	overflow-y: hidden;
	white-space: nowrap;
	-webkit-overflow-scrolling: touch;
}



.kundenlogobox {
    transition: all 0.4s ease-in-out;
    vertical-align: middle;
    width: 140px;
    display: inline-block;
	margin: 0 15px 15px 0;
	min-height: 70px;
	padding: 15px;
}


.kundenlogo {
	vertical-align: middle;
	display: block;
    transition: all 0.4s ease-in-out;
    margin: auto;
    -webkit-filter: grayscale(1);
    filter: grayscale(1);
	filter: gray saturate(0%) brightness(70%) contrast(1000%);
}

.kundenlogomin {
	max-height: 70px;
}

.desktophide{
    transition: all 0.2s ease;
	position: fixed;
	bottom: 20px;
	margin: auto;
	text-align: center;
	display: block;
	z-index: 5;
	left: 5%;
	width: 90%;
	opacity: 1;
}

.desktophidefixed{
	margin-left: 0;
	bottom: 20px;
	opacity: 1;
	z-index: 5;
}

.buttonlinkklon {
    transition: all 0.8s ease;
    display: inline-block;
    background-color: #0c0c0c;
    color: #fff;
    border-radius: 32px;
    padding: 12px 25px 12px 25px;
	font-weight: 500;
	letter-spacing: 0.4px;
	text-align: center;
	line-height: 130%;
	font-size:100%;
	position: relative;
}

a.buttonlink, a.buttonlink:visited {
    transition: all 0.8s ease;
    display: block;
    background-color: #0c0c0c;
    color: #fff;
    border-radius: 6px;
    padding: 16px 25px 16px 25px;
	font-weight: 500;
	letter-spacing: 0.4px;
	text-align: center;
	line-height: 130%;
	font-size:100%;
	position: relative;
}



a.buttonlinkalt, a.buttonlinkalt:visited {
    transition: all 0.2s ease;
    display: inline-block;
    background-color: #fff;
    color: #262525;
    border-radius: 6px;
    padding: 12px 25px 12px 25px;
    opacity: 1.0;
	font-weight: 400;
	z-index: 1;
	border: 1px solid #333!important;
}

a.buttonlinkalt:hover, a.buttonlinkalt:active {
		text-decoration: none;
		opacity: 1;
    color: #fff;
    background-color: #262525;
		scale: 1.04;
		z-index: 9;
}


.buttonlinkmobfix{
background: #0c0c0c;
overflow: hidden;
border-radius: 999px!important;
display: inline-block!important;
}
		
.buttonlinkmobfix::before{
  content: '';
  position: absolute;
  top: 0;
  left: -75%;
  width: 50%;
  height: 100%;
  transform: skewX(-25deg);
  animation: shine 3s infinite ease-in-out;
}

@keyframes shine {
  0% {
    left: -75%;
  }
  50% {
    left: 125%;
  }
  100% {
    left: 125%;
  }
}


.buttonlinkunter {
  font-size: 85%;
  line-height: 1.4;
  display: block;
  color: #111;
  letter-spacing: -0.1px;
}
.buttonlinkunter strong {
  color: #e2001a;
}

.buttonlinkunter strong{
font-weight: 700;
}

	a.buttonlinkmini, a.buttonlinkmini:visited {
		transition: all 0.8s ease;
		display: block;
		background-color: #0c0c0c;
		color: #fff;
		border-radius: 8px;
		padding: 4px 10px 4px 10px;
		font-weight: 500;
		letter-spacing: 0.2px;
		text-align: center;
		font-size:100%;
		position: relative;
	}
	
	a.buttonlinkmini:hover, a.buttonlinkmini:active {
			text-decoration: none;
			color: #fff;
			scale: 1.1;
		}


	.infobox .buttonlink {
		padding: 10px 20px 10px 20px!important;
		font-size: 85%!important;
		background: #121212;
		color: #fff;
		border-radius: 6px;
		margin-left: 30px;
	}
	
	.buttonlinkzwei{
		color: #0c0c0c ;
		background-color: transparent;
		border: 2px solid #0c0c0c ;
		margin-left: 20px;
	}

	.buttonlinkdrei{
		color: #fff;
		background-color: transparent;
		border: 1px solid #fff;
	}

	.buttonlinkvier{
		margin-top: -100px;
	color: #fff!important;
		background-color: #0c0c0c !important;
		border: 1px solid #0c0c0c !important;
	}
	

		a.buttinlinkkleinblau, a.buttinlinkkleinblau:visited {
			font-size:100%;
			transition: all 0.2s ease;
			display: inline-block;
			color: #fff;
			text-decoration: none!important;
			border: 0px;
			border-radius: 6px;
			padding: 10px 20px;
			text-align: center;
			line-height: 130%;
			background-color: #0c0c0c ;
	
		}
		
		a.buttinlinkkleinblau:hover, a.buttinlinkkleinblau:active {
				text-decoration: none;
				background-color: #fff;
				color: #0c0c0c ;
			}



.overlay {
    z-index: 9;
    overflow: hidden;
    background-color: #00122662;
    opacity: 0.0;
    height: 0;
    display: block;
    position: fixed;
    width: 0;
	left: 50%;
	top: 50%;
	transform: translate(-50%,-50%);
	visibility: hidden;
}

.overlayactive{
	visibility: visible;
	width: 100%;
	opacity: 0.8;
    height: 130%!important;
}

.texthinweis{
	font-size: 85%;
	width: 70%;
	margin:auto;
}


.trafficbg {
    background-image: url(https://gerlach.media/bilder/traffic-bg.svg);
    background-repeat: no-repeat;
    background-size: 100% auto;
    background-position: 100%;
}

.gmbg {
    background-image: url(https://gerlach.media/bilder/gmbg.webp);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: 50%;
}

.ratebox{
	border-radius: 4px;
	padding: 4px 10px;
	margin-bottom: -10px;
}

.grauverlaufbg {
    background: linear-gradient(151deg, rgba(187, 187, 187, 0.0901961) 0%, rgba(18, 105, 211, 0.160784) 100%);
}

.rateboxabsolute{
	display: inline-block;
	z-index: 9;
	position: absolute;
	bottom: 40px;
	left: 20px;
	min-width: 250px;
}


.googleratebox{
	padding: 30px;
	background-color: #fff;
	font-size: 14px;
	width: 90%;
	max-width: 120px;
	line-height: 14px;
	font-weight: 500;
	text-align: left;
	color: #666;
	display: inline-block;
	vertical-align: middle;
	border-radius: 4px;
	border: 1px solid #444;
	margin-right: 20px;
}
	
.googleratebox .rateimg{
	display: inline-block;
	width: 34px;
	float: left;
	margin-right: 12px;
	padding: 4px;
}	

.googleratebox .bewerten{
	display: inline!important;
	float: none!important;
	width: 60px!important;
	padding: 0!important;
}	

.rate{
	font-size: 115%;
	font-weight: 800;
	margin-top: -6px;
}

.bewertet{
	vertical-align: middle;
	display: inline-block;
	padding: 5px;
	width: 85px;
	margin-right: 15px;
	font-size: 70%;
	color: #999;
	line-height: 1.2;
}

.bewertet img{
	display: block;
	width: auto;
	max-width: 100%;
	margin-bottom: 5px;
}

.seocertie{
	padding: 5px;
	width: 44px;
	margin-right: 5px;
	margin-bottom: 15px;
	float: left;
}

.seocertie img{
	width: auto;
	max-width: 100%;
}

.provenexpert{
	float: left;
	padding: 5px;
	width: 84px;
	margin-right: 15px;
	margin-bottom: 15px;
}		

.provenexpert img{
	width: auto;
	max-width: 100%;
}

.googlepartnerklein{
	float: left;
	padding: 5px;
	width: 115px;
	margin-right: 15px;
	margin-bottom: 15px;
}	

.googlepartnerklein img{
	width: auto;
	max-width: 100%;
}



.trustwrapper {
  display: flex;
  align-items: center;
  gap: 30px;
  flex-wrap: wrap;
  margin: 20px 0 10px;
}

.trustitem {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 60px;
  font-size: 11px;
  color: #666;
  text-align: center;
  line-height: 1.3;
  filter: grayscale(100%) brightness(0.9);
  transition: filter 0.3s ease;
  opacity: 0.7;
}

.trustitem img {
  height: 48px;
  width: auto;
  object-fit: contain;
  margin-bottom: 5px;
}




/*
.gunderline {
    display: inline-block;
    margin-bottom: -14px;
    padding-bottom: 8px;
    background-image: url(https://gerlach.media/bilder/underline.svg);
    background-position: 50% 100%;
    background-size: contain;
    background-repeat: no-repeat;
}
*/

.footerborder{
	border-top: 1px solid #e2e2e2;
	height: 1px;
	clear: both;
	margin: 75px 0 35px 0;
}

.footerbigbox{
	display: block;
	color: #fff;
	font-size: 135%;
	letter-spacing: -0.6px;
	line-height: 140%;
	font-weight: 400;
	margin-bottom: 20px;
}

.footerbigbox .fbbtitel{
	display: block;
	font-weight: 800;
}

.footerinfos{
	padding: 60px 0;
	text-align: center;
	font-size: 90%;
}

.footerinfos span{
	font-weight: 500;
	display: block;
}


#footer{
	background-color: #fff;
	border-top: 1px solid #e2e2e2;
	padding: 70px 0 0 0;
	z-index: 5;
	margin-bottom: 0;
}

.darkfooter{
	background-color: #010b17fb!important;
	color: #eee!important;
}

#footer .innen{
		position: relative;
		margin: auto;
		padding: 90px 2% 90px 2%!important;
		width: 96%;
		max-width: 1490px;
		line-height: 150%;
}


.bloginnentop{
	padding: 100px 5% 75px 5%;
	}

	.bloginnen{
		padding: 20px 5% 75px 5%;
		}

		.shopinnen{
			padding: 130px 5%  75px 5%;
			}	

.footerlinks{
	text-align: center;
}

.footerrechts{
	padding-top: 15px;
	text-align: center;
}

.footerlogos{
	height: 74px;
	width: auto;
	opacity: 0.64;
	display: inline-block;
	margin: auto;
	text-align: center;
}

.socialicon{
	height: 32px;
}

.footheader{
	display: block;
	font-weight: 500;
    padding: 8px 0;
	font-size: 125%;
	color: #212121;
	margin-bottom: 10px;
}

.fhop{
    padding: 8px 20px 8px 0;
}

a.footerlink, a.footerlink:visited {
	display: block;
	color: #212121;
	text-decoration: none;
	text-underline-offset: 5px;
	transition: all 0.4s ease;
	padding: 4px 0;
	letter-spacing: 0.4px;
	font-weight: 400;
	font-size: 100%;
	margin-bottom: 2px;
}

a.footerlink:hover, a.footerlink:active {
	color: #212121;
	text-decoration: underline;
}

a.footerlinkzwei, a.footerlinkzwei:visited {
	color: #fff;
	text-decoration: none;
	transition: all 0.4s ease;
	letter-spacing: 0.4px;
	font-size: 100%;
}

a.footerlinkzwei:hover, a.footerlinkzwei:active {
	color: #fff;
	text-decoration: underline;
}

.linkneu{
	padding-right: 50px;
}

.linkneu:after{
	content: 'NEU';
	position: absolute;
	right: 0;
	background-color: #181818;
	color: #fff;
	padding: 0 10px;
	margin-left: 20px;
	font-size: 85%;
	font-weight: 500;
	border-radius: 4px;
	top: 50%;
	transform: translateY(-50%);
}
  	
.submenue .linkneu:after{
	margin-left: 0;
	right: 10%;
}
  	  	
#footer .linkneu:after{
	margin-left: 0;
	right: 0%;
}

.linkpdf:after{
	content: 'PDF';
	background-color: #e81a5f;
}
  	
.linkjob:after{
	content: 'JOBS';
	background-color: #0abd0a;
}

a.speziallink, a.speziallink:visited{
	transition: all 0.4s ease;
	background-color: #0c0c0c ;
	color: #fff;
	display: inline-block;
	padding: 12px 0;
	text-align: center;
	border-radius: 4px;
}

a.speziallink:hover, a.speziallink:active{
	background-color: #0c0c0c ;
	color: #fff;
	opacity: 0.7;
}


#footer .fuenfer{
	padding: 0px;
	padding-bottom: 40px;
}

.topinfos{
	display: none;
}

.systembild{
		display: block;
		width: auto;
		max-width: 95%;
		height: auto;
		margin-top: -60px;
	}



	.subnavin h3{
		margin-top: 20px;
		margin-left: 14px;
	}
		

	.subeins{
		margin-bottom: 40px;
		}


.hilith{
	display: none;
}


.timelinesticky{
	top: 10%;
	left: 0;
	margin-left: -20px;
	position: sticky;
	width: 40px;
	height: 40px;
	background-color: #181818;
	z-index: 4;
	border-radius: 50%;
	background-image:url(https://gerlach.media/bilder/flag.svg);
	background-repeat: no-repeat;
	background-size: 40%;
	background-position: 50%;
}

.timeline{
	border-left: 2px solid #e1eaee;
	padding: 50px 0;
	margin: auto;
	text-align: left;
	position: relative;
	width: 100%;
	max-width: 600px;
	font-size: 92%;
	line-height: 150%;
}


  
.timeline p{
	max-width: 550px;
}



.timeline .gmarker{
		clear: both!important;
		width: 60px;
		height: 60px;
		margin-left: -30px;
		margin-top: -10px;
		position: absolute;
		border-radius: 50%;
		background-color: #212121;
}


.timelinejahr {
	color: #fff;
	z-index:1;
	display:inline-block;
	left: 50%;
	top: 50%;
	transform: translate(-50%,-50%);
    position: absolute;
	font-weight: 400;
	letter-spacing: -0.4px;
}

.tljce{
	font-weight: 800;
	font-size: 135%;
	text-align: center;
}



.timeline .hightlight{
		width: 85%;
		padding: 10px 7.5%;
		margin-top: 30px;
}

.timeline .hightlight_klein{
		width: 85%;
		padding: 10px 7.5%;
		font-size: 90%;
		line-height: 150%;
		color: #aaa;
}

.timeline .headline  {
		transition: all 0.4s ease;
		display:block;
		margin:0px;
		margin-bottom:2px;
		font-size: 130%;
		font-weight:500;
		line-height: 135%;
		color: #212121;
}



.geschichtebox {
		clear: both!important;
		position: relative;
		border-radius: 3px;
		transition: all 0.4s ease-in-out;
		margin-bottom: 40px;
		margin-left: 46px;
		line-height: 160%;
		background-color: #fff;
		border-radius: 10px;
		color: #212121;
	}
	.jubilaeumbox .headline  {
				color: #cead1a!important;
			}
			
	.geschichtebox:hover{
		box-shadow: 0 8px 34px 0 rgba(37, 37, 37, 0.14);
	}

	.geschichtebox div{
		padding: 40px;
	}

.geschichtebox:before {
    position: absolute;
    top: 10px;
    right: 100%;
    width: 0;
    height: 0;
    content: '';
    border-style: solid;
    border-width: 14px;
    border-color: transparent #fff transparent transparent;
}

.geschichtebox:nth-of-type(odd) .geschichtebox:before {
    left: 100%;
    right: 0;
    border-color: transparent transparent transparent #f5f5f5;
}

.geschichtebox img{
		width: 100%;
		margin-bottom: 0px!important;
}


.geschichtebox .bildtime{
		display: block;
	margin-bottom: 20px;
}

.meinungin{
	display: -webkit-box;
	-webkit-line-clamp: 10;
	-webkit-box-orient: vertical;  
	overflow: hidden;
	color: #777;
	font-size: 95%;
	line-height: 1.4;
	letter-spacing: 0.1px;
}


.meinungportrait {
    max-width: 42px;
    height: auto;
    float: left;
    border-radius: 50%;
}

.kreisportrait {
    max-width: 140px;
    height: auto;
    border-radius: 50%;
}

.meinungname {
    font-size: 84%;
    font-weight: 800;
    display: block;
    margin-top: 6px;
    margin-bottom:4px;
}

.meinungtitel{
	font-weight: 500;
	font-size: 125%;
	display: block;
	margin-bottom: 15px;
}

.meinungposition {
    font-size: 75%;
    display: block;
}

.divbild{
	width: auto;
	max-width: 100%;
	margin-bottom: 45px;
	padding: 15px;
}

.divbild img{
	width: auto;
	max-width: 100%;
}

.divbild .bildbeschreibung, .bildbeschreibung{
	padding: 2px;
	font-size: 80%;
	color: #666;
}

.bloginfobox{
	line-height: 1.5;
	padding: 45px!important;
    background-color: #F6F9FC!important;
	margin: 25px 0 45px 0;
	border-radius: 12px;
	font-size: 17px;
	letter-spacing: 0px;
}

.blogtrainingbox {
	line-height: 1.5;
	padding: 45px;
	margin: 25px 0 45px 0;
	border: 2px solid #e2e2e2;
	border-radius: 12px;
	font-size: 17px;
	letter-spacing: 0px;
}

.bloginfoboxhinweis{
	border-radius: 6px;
	background-color: #fbf0b5!important;
}

.magin .blogtrainingbox h2, .magin .blogtrainingbox h3, .magin .blogtrainingbox h4, .magin .bloginfobox h2, .magin .bloginfobox h3, .magin .bloginfobox h4 {
}

		
.bildbeschreibungtext{
	font-size: 14px;
	color: #777;
	margin: -25px 0 65px 0;
	letter-spacing: 0.5px;
		}

.magin .bildbeschreibung{
	padding: 2px;
	font-size: 85%;
	color: #666;
	margin-top: -40px;
}

.zoombild{
	z-index: 1;
	margin-bottom: 6px!important;
}

.zoombild:hover, .zoombild:active{
scale: 1.8;
box-shadow: 0 2px 3.25rem 0 rgba(0,0,0,.18);
}

	


.seopaketbox{
	color: #212121!important;
	transition: all 0.2s ease-in-out;
	width: 100%;
    display: block;
    box-shadow: 0 5px 4.25rem 0 #32323216;
	border-radius: 8px;
	overflow: hidden;
	margin-bottom: 25px;
	text-align: left;
	background-color: #fff;
}

.seopaketboxbald{
	background-color: #F6F9FC;
	opacity: 0.6;
}

.paketboxlink{
	text-decoration: none!important;
}
.seopaketbox img {
    display: block;
    height: auto;
    max-width: 100%;
    width: auto;
}

.paketlastbox{
    margin-right: 0;
}

.seopaketbox:hover{
	box-shadow: 0px 12px 20px #18181816;
}

.seopaketbox div{
	padding: 50px;
}

.cleanseo div{
	padding: 25px 50px;
}

.seopaketbox h3{
	color: #212121!important;
	font-weight: 500;
	font-size: 115%;
	letter-spacing: -0.1px;
}


.paketpreis{
	color: #181818;
	font-weight: 400;
}

.paketextklein{
	font-size: 85%;
	display: block;
}

.paketpreisdetail{
	font-size: 170%;
	color: #181818;
	font-weight: 800;
	padding: 12px 0;
}

.seopakethinweis{
	z-index: 9;
	transition: all 0.4s ease;
	display: inline-block;
	background-color: #0c0c0c ;
	padding: 0.5px 12px;
	position: absolute;
	color: #fff;
	text-transform: uppercase;
	font-size: 75%;
	margin-top: 0px;
	letter-spacing: 0.6px;
	left: 50px;
	font-weight: 800;
}

.seopakethinweisred{
	background-color: #d30054;
}

.seopakethinweisblau{
	background-color: #1C73E6;
}

.seopakethinweisgray{
	background-color: #aaaaaa1d;
	color: #777777;
}

.merke{
	transition: all 0.4s ease;
	background-color: #f6e9d0;
	padding: 25px;
	margin: 25px 0;
	letter-spacing: 0.3px;
	font-weight: 500;
}


.seopaketbox:hover .seopakethinweis{
}


.starticonbox{
	transition: all 0.4s ease 0s;
	line-height: 140%;
	text-align: center;
}

.starticonbox:hover{
}

.starticonbox span{
	font-weight: 800;
	font-size: 140%;
	display: block;
	margin-bottom: 4px;
}

a.textblock, a.textblock:visited {
	position: relative;
	color: #333;
	text-decoration: none;
	text-underline-offset: 5px;
transition: all 0.7s ease;
display: block;
padding: 15px 25px;
background-color: #f4f7f7;
line-height: 135%;
margin-bottom: 2px;
}

a.textblock:hover, a.textblock:active {
	color: #0c0c0c ;
	text-decoration: none;
}

.textblock span{
color: #333!important;
font-weight: 500;
display: block;
}

.startrankbg {
    background-image: url(https://gerlach.media/bilder/startrankbg.webp);
    background-size: cover;
    background-position: 50% 100%;
    background-repeat: no-repeat;
}

.seobg {
    background-image: url(https://gerlach.media/bilder/koehlbrandbruecke-hamburg.jpg);
    background-size: cover;
    background-position: 50%;
    background-repeat: no-repeat;
    background-color: #111;
	min-height: 240px;
}


.ueberbg {
    background-image: url(https://gerlach.media/bilder/ueberbg.jpg);
    background-size: cover;
    background-position: 50% 12%;
    background-repeat: no-repeat;
    background-color: #111;
}

.ueberbgstart {
    background-image: url(https://gerlach.media/bilder/ueberbgstart.webp);
    background-size: 100% auto;
    background-position: 100% 0;
    background-repeat: no-repeat;
	padding-top: 320px;
}

.ueberbgneu {
    background-image: url(https://gerlach.media/bilder/ueberbgneu.webp);
    background-size: 100% auto;
    background-position: 100% 0;
    background-repeat: no-repeat;
	padding-top: 320px;
}

.ueberbg2025 {
    background-image: url(https://gerlach.media/bilder/seo-agentur-gerlach-media-team.jpg);
    background-size: 100% auto;
    background-position: 100% 0;
    background-repeat: no-repeat;
	padding-top: 250px;
}

.kiheadercool {
    background-image: url(https://gerlach.media/bilder/webp.svg);
    background-size: 60% auto;
    background-position: 0;
    background-repeat: no-repeat;
}


.kibgsmall {
   background: url("https://gerlach.media/bilder/kibg.webp") no-repeat;
  background-size: 56% auto;
  background-position: 100% 14%;
 position: relative;
  overflow: hidden;
}


.googlepartner {
    display: block;
    position: relative;
    width: 120px;
	margin: auto;
    height: auto;
	margin-top: -130px;
}
.absolutebox{
	position: absolute;
	display: block;
	top: 0;
	z-index: 3!important;
	margin-top: -25px;
	width: 85%;
	max-width: 640px;
	left: 50%;
	transform: translate(-50%);
	}

	.absolutebox a{
	display: block;
	/*animation: blinker 2s step-start infinite;*/
}

.blinker{
	animation: blinker 2s step-start infinite;
}

	@keyframes fadein{
		0% { opacity:0; }
		66% { opacity:0; }
		100% { opacity:1; }
	}
	
	@-webkit-keyframes fadein{
		0% { opacity:0; }
		66% { opacity:0; }
		100% { opacity:1; }
	}
	@keyframes blinker {
		50% {
		  opacity: 0;
		}
	  }


.arowwabsolute{
	display: none;
}


.shortsbox{
	border-radius: 8px;
	overflow: hidden;
	width: 400px;
	height: 720px;
	float:left;
	margin-right: 10px;
	margin-bottom: 10px;
}

.shortvideo{
	width: 100%;
	height: 100%;
}




.subsuche{
    transition: all 0.4s ease 0s;
	display: none;
	position: absolute;
	font-size: 90%;
	z-index: 99;
	top: 305px;
	width: 89.60%;
	box-shadow: 0 1.5rem 4rem rgb(0 0 0 / 15%);
	border-radius: 0 0 4px 4px;
	overflow: hidden;
}

.livesuche span{
	font-size: 170%;
	font-weight: 800;
	color: #fff;
}
input.suchinput{
	padding: 20px 25px!important;
	width: 100%;
	box-shadow: 0 2px 3.25rem 0 rgba(0,0,0,.11);
	border: 0;
	border-radius: 4px;
	font-size: 100%!important;
}

input.suchinput:focus{
	border: 0!important;
	outline: 0!important;
	border-radius: 4px;
}
a.suchlink, a.suchlink:visited{
	display: block;
	padding: 16px 20px;
	background-color: #fff;
	color: #212121;
    transition: all 0.4s ease 0s;
	font-weight: 400;
}
a.suchlink:active, a.suchlink:hover{
	background-color: #F6F9FC;
	color: #212121;
    transition: all 0.4s ease 0s;
}
.slaktiv{
	background-color: #019FE3!important;
	color: #fff!important;
}

.showsearch{
	display: block;
}

.hidesearchGO{
	display: none;
}



/* Progress bar */
#progress-bar {
	--scrollAmount: 0%;
	
	background: repeating-linear-gradient(to top right, #373c40 0%, #0c0c0c 100%)!important;
	width: var(--scrollAmount);

	/* 	background: linear-gradient(to right, #F24E1E var(--scrollAmount), transparent 0);
	width: 100%; */
	
	height: 8px;
	position: fixed;
	top: 0;
	z-index: 99999;
}

.gobox {
	height: 0;
	overflow: hidden;
}

a.menuezwei, a.menuezwei:active, a.menuezwei:visited{
	visibility: hidden;
}

a.subnavilink span{
	display: none;
}
    

.verschwommen {
    left: 0;
    width: 100%;
    position: fixed;
    z-index: 4;
    top: 0;
    height: 90px;
    transition: all .2s ease-in-out;
    background-color: transparent;
    background-image: linear-gradient(to bottom, #ffffff, #ffffff00);
	backdrop-filter: blur(2px);
}

.textmrg{
	margin-left: 12px;
}


.investwert{
	padding: 0 6px;
}

.trafficwert{
	font-weight: 700;
	font-size: 170%;
	padding: 6px;
	padding-top: 30px;
}

.casesnipp .trafficwert{
	padding-top: 0;
	padding-bottom: 20px;
	letter-spacing: -0.2px;
}

.trafficwert div{
	display: inline-block;
}


.trafficwert span{
	margin-left: 20px;
	color: #0abd0a;
}

.erklaerungbox{
	margin-top: 60px;
	padding: 0 6px;
	font-size: 80%;
	color: #999;
	line-height: 1.3;
}

.casesnipp .erklaerungbox{
	margin-top: 10px;
}






[data-balloon] {
	position: relative; }
	[data-balloon]::before {
	  opacity: 0;
	  pointer-events: none;
	  transition: all .18s ease-out;
	  background: rgba(17, 17, 17, 0.9);
	  border-radius: 4px;
	  color: #fff;
	  content: attr(data-balloon);
	  font-size: 12px;
	  padding: .5em 1em;
	  position: absolute;
	  font-weight: 400;
	  line-height: 17px;
	  width: 200px;
	  max-width: 360px;
	  z-index: 10; }
	[data-balloon]::after {
	  background: no-repeat url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="36px" height="12px"><path fill="rgba(17, 17, 17, 0.9)" transform="rotate(0)" d="M2.658,0.000 C-13.615,0.000 50.938,0.000 34.662,0.000 C28.662,0.000 23.035,12.002 18.660,12.002 C14.285,12.002 8.594,0.000 2.658,0.000 Z"/></svg>');
	  background-size: 100% auto;
	  width: 18px;
	  height: 6px;
	  opacity: 0;
	  pointer-events: none;
	  transition: all .18s ease-out;
	  content: '';
	  position: absolute;
	  z-index: 10; }
	[data-balloon]:hover::before, [data-balloon]:hover::after {
	  opacity: 1;
	  pointer-events: auto; }
	[data-balloon][data-balloon-pos="up"]::before {
	  bottom: 100%;
	  left: 50%;
	  margin-bottom: 11px;
	  transform: translate3d(-50%, 10px, 0);
	  transform-origin: top; }
	[data-balloon][data-balloon-pos="up"]::after {
	  bottom: 100%;
	  left: 50%;
	  margin-bottom: 5px;
	  transform: translate3d(-50%, 10px, 0);
	  transform-origin: top; }
	[data-balloon][data-balloon-pos="up"]:hover::before {
	  transform: translate3d(-50%, 0, 0); }
	[data-balloon][data-balloon-pos="up"]:hover::after {
	  transform: translate3d(-50%, 0, 0); }
	[data-balloon][data-balloon-pos='down']::before {
	  left: 50%;
	  margin-top: 11px;
	  top: 100%;
	  transform: translate3d(-50%, -10px, 0); }
	[data-balloon][data-balloon-pos='down']::after {
	  background: no-repeat url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="36px" height="12px"><path fill="rgba(17, 17, 17, 0.9)" transform="rotate(180 18 6)" d="M2.658,0.000 C-13.615,0.000 50.938,0.000 34.662,0.000 C28.662,0.000 23.035,12.002 18.660,12.002 C14.285,12.002 8.594,0.000 2.658,0.000 Z"/></svg>');
	  background-size: 100% auto;
	  width: 18px;
	  height: 6px;
	  left: 50%;
	  margin-top: 5px;
	  top: 100%;
	  transform: translate3d(-50%, -10px, 0); }
	[data-balloon][data-balloon-pos='down']:hover::before {
	  transform: translate3d(-50%, 0, 0); }
	[data-balloon][data-balloon-pos='down']:hover::after {
	  transform: translate3d(-50%, 0, 0); }
	[data-balloon][data-balloon-pos='left']::before {
	  margin-right: 11px;
	  right: 100%;
	  top: 50%;
	  transform: translate3d(10px, -50%, 0); }
	[data-balloon][data-balloon-pos='left']::after {
	  background: no-repeat url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="12px" height="36px"><path fill="rgba(17, 17, 17, 0.9)" transform="rotate(-90 18 18)" d="M2.658,0.000 C-13.615,0.000 50.938,0.000 34.662,0.000 C28.662,0.000 23.035,12.002 18.660,12.002 C14.285,12.002 8.594,0.000 2.658,0.000 Z"/></svg>');
	  background-size: 100% auto;
	  width: 6px;
	  height: 18px;
	  margin-right: 5px;
	  right: 100%;
	  top: 50%;
	  transform: translate3d(10px, -50%, 0); }
	[data-balloon][data-balloon-pos='left']:hover::before {
	  transform: translate3d(0, -50%, 0); }
	[data-balloon][data-balloon-pos='left']:hover::after {
	  transform: translate3d(0, -50%, 0); }
	[data-balloon][data-balloon-pos='right']::before {
	  left: 100%;
	  margin-left: 11px;
	  top: 50%;
	  transform: translate3d(-10px, -50%, 0); }
	[data-balloon][data-balloon-pos='right']::after {
	  background: no-repeat url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="12px" height="36px"><path fill="rgba(17, 17, 17, 0.9)" transform="rotate(90 6 6)" d="M2.658,0.000 C-13.615,0.000 50.938,0.000 34.662,0.000 C28.662,0.000 23.035,12.002 18.660,12.002 C14.285,12.002 8.594,0.000 2.658,0.000 Z"/></svg>');
	  background-size: 100% auto;
	  width: 6px;
	  height: 18px;
	  left: 100%;
	  margin-left: 5px;
	  top: 50%;
	  transform: translate3d(-10px, -50%, 0); }
	[data-balloon][data-balloon-pos='right']:hover::before {
	  transform: translate3d(0, -50%, 0); }
	[data-balloon][data-balloon-pos='right']:hover::after {
	  transform: translate3d(0, -50%, 0); }
	[data-balloon][data-balloon-length='small']::before {
	  white-space: normal;
	  width: 80px; }
	[data-balloon][data-balloon-length='medium']::before {
	  white-space: normal;
	  width: 150px; }
	[data-balloon][data-balloon-length='large']::before {
	  white-space: normal;
	  width: 260px; }
	[data-balloon][data-balloon-length='xlarge']::before {
	  white-space: normal;
	  width: 380px; }
	  @media screen and (max-width: 768px) {
		[data-balloon][data-balloon-length='xlarge']::before {
		  white-space: normal;
		  width: 90vw; } }
	[data-balloon][data-balloon-length='fit']::before {
	  white-space: normal;
	  width: 100%; }
  


	  .subnav .zweier{
		padding: 0;
		margin-bottom: 0;
	  }

	  .subnav img{
		display: none;
	  }

	  .zlzpadd{
		padding-bottom: 0px!important;
	}



	.userstart{
		width: auto;
	margin-top: 20px;
	}
	
	.userstartbild{
		transition: all 0.1s ease-in-out;
		display: inline-block;
	}
	
	.userstartbild img{
		transition: all 0.1s ease-in-out;
		width: 44px!important;
		height: 44px!important;
		border-radius: 50%;
		margin-right: -26px;
		border: 2px solid #fff;
		z-index: 0;
		position: relative;
	}
	
	.usertext{
		display: inline-block;
		width: 100%;
		text-align: center;
		height: 44px;
		font-weight: 500;
		font-size: 85%;
		line-height: 1.2;
		vertical-align: middle;
	}
	

	.bottomtextweiter{
		display: none;
	}


	.blocktext{
	display: block;
	font-weight: 800;
    font-size: 160%;
    padding: 6px;
	}
	
	.blocktext span{
		font-weight: 400;
		font-size: 14.4px;
		padding: 6px;
		line-height: 150%;
		color: #999;
	}
	
	.seokreis{
display: none;
	}


	.googleicon{
		width: 40px;
		height: 40px;
		display: inline-block;
		margin-right: 5px;
		margin-bottom: -5px;
	}



	.zweierabsoluterechts{
		margin-top: 85px;
	}
	
.vorteileboxover{
	font-size: 85%;
	display: flex;
	padding: 25px;
	border-bottom: 1px solid #d2d2d2;
}	

.vorteilein{
	display: flex;
	width: 25%;
	flex-flow: column wrap;
	align-content: flex-start;
	justify-content: center;
	align-items: center;
    justify-content: center;
}

.vorteilein h3{
	width: 100%;
	font-size: 14px;
}


.vorteileineins{
	width: 50%;
}

.vorteileinbox{
	display: flex;
	padding: 10px 5px;
    flex-wrap: wrap;
	text-align: center;
}

.vorteileinboxeins{
	text-align: left;
}

.nookicon{
	width: 34px;
}
.okicon{
	width: 40px;
}

.leistungvierer{
	margin-bottom: 20px;
}

.headbox{
	padding: 15px;
	font-size: 120%;
	font-weight: 800;
}

.headbox span{
	font-size: 80%;
	font-weight: 400;
	display: block;
}

.leistbox{
	font-size: 90%;
	padding: 15px;
}


.userprofilbox{
	display: none;
}


.telefonbox{
	display: block;
	position: fixed;
	width: 34px;
	height: 34px;
	border-radius: 50%;
	background-color: #fff;
	font-size: 130%;
	color: #212121;
	font-weight: 800;
	z-index: 999;
	transition: all 0.4s ease-in-out;
	right: 120px;
	top: 36px;
	margin-top: -4px;
	transform: translateY(-50%);
}

.telefonbox:hover .material-icons{
	color: #fff;
}
.telefonbox:hover{
	background-color: #0c0c0c;
}


  
.arrow_forward::before{
    content: 'arrow_forward';
}
  
.person::before{
    content: 'person';
}
  
.telmobile::before{
    content: 'call';
}

.material-icons{
	position: absolute;
	left: 25px;
	top: 45%;
	transform: translateY(-50%);
	color: #888;
	transition: all .2s ease-in-out;
}

.material-icons::before{
	font-size: 28px;
    font-family: "Material Icons";
}

li .material-icons{
	display: none;
	color: #969696;
}

li:hover .material-icons{
	color: #fff;
	scale: 1.1;
}


.userprofilbox span, .telefonbox span{
	vertical-align: middle;
	position: relative;
	display: block;
	text-align: center;
	left: 0;
	top: 0;
	margin-top: 15px;
}


.portraitbildklein{
	width: 65px!important;
	border-radius: 50%;
	border: 4px solid #fff;
	display: inline-block;
	float: left;
	margin-right: 20px;
	margin-top: -10px;
}


.abstandbox{ 
    display: inline-block;
    padding: 4px 4px;
    width: 120px;
    font-weight: 500;
}











.serps{
	padding: 6px 12px;
}

.googleserptext{
    color: #3C4043;
    font-family: sans-serif;
    font-size: 14px;
    line-height: 20px;
}

.googltitle{
	font-family: Roboto, HelveticaNeue, Arial, sans-serif;
    color: #1a0dab;
    word-break: break-word;
    font-size: 22px;
    line-height: 26px;
    display: block;
    padding-top: 1px;
    margin-bottom: 6px;
    letter-spacing: -0.4px;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;  
	overflow: hidden;
}

.googltitledesk{
	-webkit-line-clamp: 1;
}

.googllink{
	color: #999;
	font-size: 85%;
	display: block;
}

.margbtm{
	margin-bottom: 25px;
}
.schattenbox{
	background-color: #fff;
    box-shadow: 0 4px 12px 0 rgba(33, 33, 33, 0.02), 0 4px 14px 0 rgba(37, 37, 37, 0.04);
	margin-bottom: 20px;
	width: 90%;
}
.roundbox{
	border-radius: 14px;
	margin-bottom: 15px;
}
.paddingbigbox{
	padding: 20px;
}

.serpdesk{
	display: block;
    width: 670px;
    font-family: arial, sans-serif;
}

.words{
	display: block;
    padding-top: 12px;
    padding-bottom: 12px;
    padding-left: 24px;
    padding-right: 24px;
}



.serpdesk .googleserptext{
		display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;  
	overflow: hidden;
}

.serpmobile{
	display: block;
    width: 384px;
    font-family: arial, sans-serif;
}

.serpmobile .googleserptext{
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;  
	overflow: hidden;
}

.fortschritttext{
	color: #aaa;
	font-size: 80%;
	padding: 15px 15px 5px 15px;
	text-align: center;
}

.fortschritt{
	display: block;
	margin: 25px auto;
	border-radius: 12px;
}
.fortschrittin{
	margin: auto auto;
	width: 85%;
	height: 6px;
	overflow: hidden;
	background-color: #f2f2f2;
}

.fortschritt::before{
	color: #aaa;
	font-size: 80%;
	content: '0%';
	position: absolute;
	left: 0;
	top: 0;
	z-index: 1;
	margin-left: -10px;
	margin-top: -10px;
}
.fortschritt::after{
	z-index: 1;
	color: #aaa;
	font-size: 80%;
	content: '100%';
	position: absolute;
	right: 0;
	top: 0;
	text-align: right;
	margin-right: -10px;
	margin-top: -10px;
}

.fortschrittbox{
	height: 6px;
	background-color: #0c0c0c ;
	width: 32%;
}

.navtitel{
	display: block;
	padding: 10px 0 10px 10px;
	font-size: 19px;
	margin-bottom: -5px;
	max-width: 85%;
	margin-top: 30px;
}

		
.mobilescroll {
	width: 100%;
	max-width: 100%;
	overflow-x: scroll;
}

.mobilescrollin, .mobilescrollinlang{
}

.minipaddbox{
	padding: 20px;
}	

.micropaddbox{
	padding: 6px 15px;
}	

.foot1, .foot2, .foot3, .foot4, .foot5{
	margin-bottom: 25px;
}


.seosprintpic{
	position: absolute;
	left: 50%;
	transform: translate(-50%);
	z-index: -1;
	width: 500px;
	margin-top: -240px;
}

.seosprint{
	transition: all .6s ease-in-out;
	height: auto;
	overflow: hidden;
	background-position: 50%;
	background-size: cover;
	background-attachment: fixed;
	padding: 100px 15%;
}




.titelbig{
	font-family: 'Inter', sans-serif;
	display: block;
	font-weight: 800;
	font-size: 200%;
	margin-bottom: 25px;
	line-height: 1.1;
}
.titelbigzwei{
	font-family: 'Inter', sans-serif;
	line-height: 1.1;
	margin-top: 10px;
	font-size: 200%;
	margin-bottom: 40px;
}
.titelbigdrei{
	font-family: 'Inter', sans-serif;
	line-height: 1.1;
	margin-top: 60px;
	font-size: 200%;
	margin-bottom: 10px;
}

.seoprint span{
	font-size: 140%;
	letter-spacing: 2px;
}


.videoback{
	z-index: -1;
}



.casesnippmobile{
	visibility: visible;
	position: fixed;
	left: 50%;
	transform: translate(-50%);
	top: 22px;
	transition: all 0.4s ease-in-out;
	font-size: 90%;
	z-index: 999;
	display: inline-block;
	margin-left: 40px;
}

.casesnipp{
	visibility: hidden;
	opacity: 0;
}

.zindex{
	z-index: 8;
}

.showsnipp{
	opacity: 0;
}

.modul{
	position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: auto;
    z-index: 99999;
    overflow:scroll;
    display: none;
    transform: translateY(-100%);
    opacity: 0;
    transition: .4s ease;
    pointer-events: none;
}

.modulin {
    position: relative;
    width: 100%;
    margin-left: auto;
    margin-right: auto;
    padding: 10px;
	box-sizing: border-box;
}

.modulintext{
	border-radius: 10px;
	background-color: #fff;
    box-shadow: 0 5px 30px rgba(0, 0, 0, .2);
	margin: auto;
	max-width: 1000px;
	box-sizing: border-box;
	padding: 20px;
	font-size: 15px;
}

.modulopen {
	display: block;
    overflow-y: scroll;
    transform: translateY(0);
    opacity: 1;
    pointer-events: auto;
}



.modulbg {
    background: rgba(217, 221, 221, .7);
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    z-index: 9999;
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    display: none;
}

.modulbgshow {
	opacity: 1;
	display: block;
}

.whatsapp{
	z-index: 4;
	position: fixed;
	bottom: 85px;
	left: 50%;
	transform: translate(-50%);
	padding: 10px;
	width: 90%;
	max-width: 90%;
	text-align: center;
}


.whatsapplink, .whatsapplink:active, .whatsapplink:visited, .whatsapplink:hover{
	transition: all 0.4s ease 0s;
	display: inline-block;
	margin: auto auto;
	padding: 6px 25px;
	font-weight: 500;
	font-size: 90%;
	letter-spacing: -0.4px;
	background-color: #25D366;
	color: #fff;
	animation: shake 0.75s cubic-bezier(.35,.08,.15,.95) both;
  backface-visibility: hidden;
  perspective: 1000px;
	border-radius: 4px;
} 

.whatsapplink:hover{
	scale: 1.2;
} 



@keyframes shake {
	10%, 90% {
	  transform: translate3d(-1px, 0, 0);
	}
	
	20%, 80% {
	  transform: translate3d(2px, 0, 0);
	}
  
	30%, 50%, 70% {
	  transform: translate3d(-4px, 0, 0);
	}
  
	40%, 60% {
	  transform: translate3d(4px, 0, 0);
	}
  }


  .wai{
	width: 18px;
	display: inline-block;
	margin-right: 6px;
	margin-bottom: -2px;
  }



.caseheader{
	overflow: hidden;
	background-repeat: no-repeat;
	background-position: 50%;
	background-size: cover;
	height: 320px;
}

.minheizweierbox{
	min-height: 350px;
	position: relative;
	margin-bottom: 65px;
	width: 100%;
}

.messeboxin{
	font-size: 90%;
	padding: 40px 40px 40px 40px;
	position: absolute;
	z-index: 5;
	color: #fff;
	width: 100%;
	box-sizing: border-box;
	bottom: 0;
	line-height: 1.34;
	letter-spacing: 0.6px;
}

.messeintitel{
	margin-bottom: 5px;
	font-weight: 500;
	font-size: 150%;
}

.messeboxin p{
	margin-bottom: 15px;
}
.subheading {
    color: #aaa;
    font-size: 1.1rem;
    font-weight: 400;
	letter-spacing: 0.2px;
}




.prozesssection{
    position: relative;
    width: 100%;
	box-sizing: border-box;
	padding: 20px;
}

.prozesssectioninnen{
    position: relative;
    width: 100%;
    overflow-x: scroll;
    overflow-y: hidden;
    white-space: nowrap;
    transition: all 0.2s;
    user-select: none;
    cursor: grabbing;
}

.prozesssectioninnen::-webkit-scrollbar {
    display: none;
}


.prozessactive {
    cursor: grabbing;
    cursor: -webkit-grabbing;
  }

.prozessbox{
	background: #0c0c0c;
	white-space: normal;
	display: inline-block;
	width: 310px;
	overflow: hidden;
	border-radius: .5rem;
	margin-right: 16px;
	min-height: 250px;
	position: relative;
}




.prozessboxin{
	z-index: 3;
	overflow: hidden;
	position: absolute;
	bottom: 0;
	padding: 30px;
}

.prozessboxtextbox{
	font-size: 90%;
	line-height: 1.4;
	color: #fff;
}

.pbheading{
	display: block;
	font-size: 140%;
	font-weight: 500;
}

.pbheadingzwei{
	display: block;
	font-size: 160%;
	font-weight: 500;
	margin-bottom: 6px;
}

.helltext{
	opacity: 0.7;
}

.zertiabsolut{
	z-index: 9;
	position: absolute;
	bottom: 25px;
	right: 20px;
}

.zertiabsolut img{
	width: 60px;
}

.kdbox{
	padding: 20px;
	margin-bottom: 40px;
	box-sizing: border-box;
}

.kdboxtext{
	padding: 30px;
}

.subnavbox{
	visibility: hidden;
	opacity: 0;
	height: 0;
	overflow: hidden;
}

.activboxv{
	visibility: visible;
	opacity: 1;
	height: auto;
}

.closerx{
	display: none;
}


.navtitelbig{
    transition: all 0.2s;
	display:block;
	cursor: pointer;
	font-size: 140%;
	font-weight: 500;
	padding: 12px 0;
	color: #353535;
}

		

.navtitelbig:hover{
	color: #111;
}

.navtitelbigactive{
	color: #111;
	font-size: 145%;
	font-weight: 800;
}
		
.navtitelbigactive:before{
	transition: all 0.2s ease;
	content: '';
	width: 26px;
	height: 26px;
	background-image: url('https://gerlach.media/bilder/arrownav.svg');
	background-size: 26px;
	background-repeat: no-repeat;
	color: #111;
	position: absolute;
	right: 45%;
	opacity: 1;
}

.subnaveins, .subnavzwei{
	padding: 0 5%;
}

.subnaveinshide{
	height: 0;
	overflow: hidden;
	visibility: hidden;
}

.subnavback::before{
	transition: all 0.2s ease;
	z-index: 999;
	content: '';
	color: #111;
	position: absolute;
	left: 5px;
	opacity: 1;
	visibility: hidden;
	font-size: 170%;
	font-weight: 800;
	width: 40px;
	height: 40px;
	background-image: url('https://gerlach.media/bilder/arrownav.svg');
	background-size: 40px;
	background-repeat: no-repeat;
	transform: rotate(180deg);
}

.subnavbackshow::before{
	visibility: visible;
}

.subnavback{
	margin-bottom: 25px;
}
	

.drpnav{
	padding-right: 10px!important;
}

.drpnav::after{
	content: '›';
	font-size: 160%;
	transform: rotate(90deg);
	position: absolute;
	right: 7%;
	top: 0;
	margin-top: 25px;
}

.headeralt .drpnav::after{
	color: #fff;
}

.drpnav::after, .headerfixed .drpnav::after{
	color: #666;
}


	.submenue li{
	  position: static; /* wichtig, damit <li> nicht als Bezugspunkt verwendet wird */
	display:block;
		transition: all 0.3s ease 0s;
		font-size: 90%;
	}


	#loading{
		z-index: 1;
		position: fixed;
		height: 100vH;
		width: 100%;
		left: 0;
		top: 0;
	}


	.bgblack{
		position: absolute;
		height: 100vH;
		width: 100%;
	background-color: #0b223a9f;
	}

	.ladenindermitte{
		box-sizing: border-box;
		padding: 50px;
		position: absolute;
		left: 50%;
		top:50%;
		transform: translate(-50%,-50%);
		z-index: 5;
	}
		

	input[type="radio"] {
		width:auto;
		float:left;
		margin-right: .75em;
		background:transparent;
		border:none;
		}
		

		.verifi{
			position: absolute;
			display: inline-block;
			background-color: #F6F9FC;
			padding: 6px 12px 4px 40px;
			left: 0;
			top: 20px;
			font-size: 80%;
		}

		.verifi:before {
			content: "";
			position: absolute;
			background-image: url(https://gerlach.media/bilder/okgruen.svg);
			height: 100%;
			width: 14px;
			top: 0;
			left: 12px;
			background-position: 50%;
			background-repeat: no-repeat;
			background-size: 14px;
		}

		.logobild{
			transition: all .2s ease-in-out;
			width: auto;
			max-width: 40%;
			text-align: left;
		}

		.shopnav{
			transition: all 0.4s ease-in-out;
			position: absolute;
			z-index: 7;
			top: 20px;
			right: 60px;
		}

		.zertistop{
			position: absolute;
			top: 22px;
			left: 180px;
		}
		
		.zertistop img{
			display: inline-block;
			height: 26px!important;
		}

		.submenueabsolute{
			display: none;
		}

		.submenueimg{
			display: none;
		}







/* Dropdown-Container */
.custom-dropdown {
    position: relative;
    display: block;
    width: 90%;
    max-width: 420px;
    margin: 60px auto;
}

/* Button für das Dropdown */
.dropdown-btn {
    width: 100%;
    padding: 14px;
    font-size: 16px;
    font-weight: bold;
    text-align: left;
    background-color: #fff;
    border: 0;
    border-radius: 5px;
    cursor: pointer;
    transition: background 0.3s ease-in-out;
    box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.15);
    z-index: 3;
}

.dropdown-btn:hover, .dropdown-btn:active {
    background: #192230;
    color: white;
}

/* Wenn das Dropdown aktiv ist */
.custom-dropdown.active .dropdown-btn {
    background: #192230;
    color: white;
}

/* Dropdown-Inhalt (ausgeblendet) */
.dropdown-content {
    z-index: 1;
    display: none;
    position: absolute;
    width: 100%;
    background: white;
    box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.15);
    border-radius: 0 0 5px 5px;
    overflow: hidden;
    z-index: 1000;
}

/* Links im Dropdown */
.dropdown-content a {
    display: block;
    padding: 15px 16px;
    font-size: 18px;
    text-decoration: none;
    color: black;
    transition: background 0.3s ease-in-out, color 0.3s ease-in-out;
}

.dropdown-content a:hover {
    background-color: #F6F9FC;
}

/* Dropdown aktiv machen */
.custom-dropdown.active .dropdown-content {
    display: block;
    animation: fadeIn 0.3s ease-in-out;
}



/* CSS-Pfeil */
.arrow {
    position: absolute;
    border: solid black;
    border-width: 0 2px 2px 0;
    display: inline-block;
    padding: 6px;
    transition: transform 0.3s ease-in-out;
    right: 15px;
    top:14px;
}

/* Pfeil nach unten */
.down {
    transform: rotate(45deg);
}

/* Pfeil nach oben (wenn aktiv) */
.custom-dropdown.active .arrow {
    top:20px;
    transform: rotate(-135deg);
    border-color: white; /* Ändert die Pfeilfarbe, wenn aktiv */
}

.custom-dropdown:hover .arrow {
    border-color: white;
}


/* Sanfte Einblendung */
@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(-5px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}


.editcircle{
    transition: all 0.1s ease;
	background: url(https://gerlach.media/bilder/editcontent.svg) no-repeat center center;
	background-size: 45%;
	box-shadow: 1px 2px 23px rgba(0,0,0,0.1);
    border-radius: 50%;
   z-index: 999;
	background-color: #ffffff;
	color: #080808;
	 height: 56px;
    width: 56px;
    position: fixed;
    right: 15px;
    bottom: 170px;
}

.editcircle:hover, .touch-device .editcircle:active { 
	opacity: 0.87;
	scale: 1.1;
}


.kachelnbereich {
	position: relative;
	min-height: 550px;
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
  }
  

.zielkacheln {
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 20px;
	padding: 10px;
  }
  
  .zielkachel {
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 20px;
	background: #f8f8f8;
	border: 1px solid #e0e0e0;
	text-align: center;
	font-weight: 600;
	text-decoration: none;
	color: #333;
	transition: background 0.3s, transform 0.3s;
	border-radius: 8px;
  }
  
  .zielkachel:hover {
	background: #eaeaea;
	transform: translateY(-3px);
  }
  


.divborder{
	position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 8px;
    background: linear-gradient(90deg, #fab000, #ff7600 6.25%, #ff5996 12.5%, #635bff 18.75%, #02bcf5 25%, #635bff 31.25%, #ff5996 37.5%, #ff7600 43.75%, #fab000 50%, #ff7600 56.25%, #ff5996 62.5%, #635bff 68.75%, #02bcf5 75%, #635bff 81.25%, #ff5996 87.5%, #ff7600 93.75%, #fab000);
    animation: bordergradient 5s linear infinite;
	background-size: 300% 100%;
}

.divbordermin{
    bottom: auto;
    top: 0;
    height: 5px;
	margin-top: -1px;
}

@keyframes bordergradient{
  0% { background-position: 0% 50%; }
  100% { background-position: 100% 50%; }
}


.kundenlogos {
  text-align: center;
  margin-top: -50px;
}

.kundenlogos-headline {
  font-size: 22px;
  font-weight: 600;
  margin-bottom: 30px;
  color: #333;
}

.logo-grid {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 30px 40px; /* vertikal / horizontal Abstand */
}

.logo-grid img {
  height: 40px;            /* statt max-height */
  width: auto;                  /* Breite automatisch skalieren */
  object-fit: contain;
  display: block;
  filter: grayscale(100%);
  transition: filter 0.3s ease;
  opacity: 1;
}

.gridcolor {
  gap: 30px 80px; 
}

.gridcolor img {
  height: 60px;            /* statt max-height */
  filter: none!important;
  opacity: 1;
}



.logo-grid img:hover {
  opacity: 1;
}

.kleineschriftlp{
	font-size: 85%;
	line-height: 1.4;
    color: #999;	
}


.toolslogos {
  text-align: center;
  margin-top: 40px;
}

.toolslogos-headline {
  font-size: 22px;
  font-weight: 600;
  margin-bottom: 30px;
  color: #333;
}

.tools-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));
  gap: 30px;
  justify-items: center;
  align-items: center;
  max-width: 1000px;
  margin: 0 auto;
}

.tools-grid div {
  width: 160px;               /* Feste Breite */
  height: 100px;              /* Feste Höhe */
  background: #F6F9FC;
  border-radius: 8px;
  padding: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.tools-grid img {
  max-height: 40px;
  max-width: 100%;
  object-fit: contain;
  display: block;
  filter: grayscale(100%) brightness(0.9);
  transition: filter 0.3s ease, opacity 0.3s ease;
  opacity: 0.7;
}

.tools-grid img:hover {
  opacity: 1;
  filter: none;
}




a.buttonlinkweiss, a.buttonlinkweiss:visited, a.buttonlinkweiss:hover, a.buttonlinkweiss:active {
    color: #111!important;
   background: #fff!important;
}

a.buttonlink:hover, a.buttonlink:active {
		text-decoration: none;
		color: #fff;
		scale: 1.1;
		z-index: 9;
	}


	.kihinweis{
		background-color: #F6F9FC;
		color: #6a7887;
		padding: 6px 20px;
		display: inline-block;
		font-size: 75%;
		margin: 15px 0;
		border-radius: 24px;
		letter-spacing: -0.2px;
	}

	.kihinweis span{
		display: inline-block;
		margin-right: 5px;
	}

a.kihbut, a.kihbut:visited, a.kihbut:hover, a.kihbut:active {
    color: #6a7887!important;
}


/* Standardzustand – immer sichtbar */
.loadani {
  opacity: 1;
  transform: none;
  transition: none;
}

/* Wenn JS aktiv ist, wird `.js-ani` am Body gesetzt und damit Animation möglich */
.js-ani .loadani {
  opacity: 0;
  transform: translateY(40px);
  transition: opacity 0.6s ease-out, transform 0.6s ease-out;
}

/* Sichtbar durch JS-Klasse */
.js-ani .loadani.visible {
  opacity: 1;
  transform: translateY(0);
}

.loader {
    width: 100%;
    text-align: center;
    padding: 40px 0;
}

.loader-icon svg {
    width: 55px;
    height: 55px;
    animation: scaleLoader 0.6s ease-in-out infinite;
    transform-origin: center center;
}

@keyframes scaleLoader {
    0%   { transform: scale(1); }
    50%  { transform: scale(1.28); }
    100% { transform: scale(1); }
}



.nomore {
    text-align: center;
    padding: 20px 0;
    color: #555;
    font-size: 16px;
}



.infobox h3, .infobox h2, .weissbg h1, .weissbg h2, .weissbg h3{
	color: #111!important;
}


.faq-item { border-bottom:1px solid #e0e0e0; overflow:hidden; padding:15px; text-align:left; }
.faq-item summary { cursor:pointer; font-weight:600; padding:16px 0; list-style:none; position:relative; }
.faq-item summary::-webkit-details-marker { display:none; }
.faq-item summary::after { content:"＋"; position:absolute; right:0; font-weight:bold; transition:transform .3s ease; }
.faq-item[open] summary::after { content:"−"; }
.faq-item p { padding:0 0 16px 0; margin:0; transition:all .3s ease; }




/* GEO Framework Visual */
.geo-steps {
  display: flex;
  flex-direction: column;
  gap: 40px;
  margin-top: 60px;
}

.geo-step {
  padding: 30px 40px;
  position: relative;
}

.step-number {
  font-size: 52px;
  font-weight: 800;
  color: #0a0a0a;
  opacity: 0.08;
  position: absolute;
  right: 20px;
  top: 10px;
  line-height: 1;
}

.geo-step h3 {
  margin-bottom: 8px;
  font-size: 22px;
  font-weight: 700;
}

.geo-step p {
  margin: 0;
  color: #333;
}




/* Zweizeilige Labels im Mega-Menü */

.subnavilink .navsub {
    display: block;
    font-size: 13px;
    color: #666;
    font-weight: 400;
    margin-top: 0px;
}

/* Hover Effekte – dezent & professionell */
.subnavilink:hover strong {
    color: #000; /* bleibt satt schwarz */
    text-decoration: underline;
}

.subnavilink:hover .navsub {
    color: #333;
	border-bottom: 0px!important;
	text-decoration: none!important;
}

.subnavin .dreier .subnavilink:hover {
	border-bottom: 0px!important;
	text-decoration: none!important;
	background-color: #F6F9FC;
	border-radius: 6px;
}

/* Linke Spalte mit dezenter Linie */
.subnavin .dreier:first-child {
    border-right: 1px solid #eee;
    padding-right: 22px;
}

/* Nur SPALTE 1 optisch hervorheben */
.subnavin .dreier:first-child .subnavilink strong {
    font-size: 115%;      /* leicht größer */
}

.subnavin .dreier:nth-child(2) {
    margin-left: 20px;
}





.kundenlogos{
	z-index: 2;
position: relative;
padding: 10px 2.5% 0px 2.5%;
transition: all 0.4s ease-in-out;
width: 95%;
overflow-x: scroll;
overflow-y: hidden;
white-space: nowrap;
-webkit-overflow-scrolling: touch;
vertical-align: middle;
text-align: center;
}

.kundenlogos::-webkit-scrollbar {
display: none;
}

.kundenlogos:hover{
}


.kundenlogo{
	height: 50px;
    display: inline-block;
	transition: all 0.4s ease-in-out;
	margin: auto;
    -webkit-filter: grayscale(1);
    filter: grayscale(1);
    opacity: 0.34;
    margin-right: 40px;
}

.kundenlogobox:hover{
	scale:1.1!important;
}

.kundenlogoklein{
	height: 20px;
}



.kundenlogoblock{
    -webkit-filter: grayscale(1);
    filter: grayscale(1);
    opacity: 0.2;
    height: 40px;
	text-align: center;
    display: block;
	transition: all 0.4s ease-in-out;
	margin: auto;
    margin-bottom: 40px;
}

.kundenlogoblock:hover{
    opacity: 0.7;
}




.rainbow-ring {
    position: relative;
}

.tracker {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    pointer-events: none;
    overflow: visible;
}

.path {
    fill: none;
    stroke: url(#rainbow);
    stroke-width: 1;
    stroke-linecap: round;
    stroke-linejoin: round;

    stroke-dasharray: 70 30;
    stroke-dashoffset: 0;

filter:
  drop-shadow(0 0 5px rgba(255,255,255,0.9))
  drop-shadow(0 0 12px rgba(255,255,255,0.5));


    animation: chase 5s linear infinite;
}

@keyframes chase {
    0%   { stroke-dashoffset: 0; }
    100% { stroke-dashoffset: -100; }
}




img.emoji {
	float: right;
    display: inline !important;
    border: none !important;
    box-shadow: none !important;
    height: 42px!important;
    width: 42px!important;
    margin: 0 .07em !important;
    vertical-align: -.1em !important;
    background: none !important;
    padding: 0 !important;
}



.nav img.emoji {
	float: right;
    display: inline !important;
    border: none !important;
    box-shadow: none !important;
    height: 1em !important;
    width: 1em !important;
    margin: 0 .07em !important;
    vertical-align: -.1em !important;
    background: none !important;
    padding: 0 !important;
}





.zitatbox {
  position: relative;
  font-size: 160%;
  color: #ccc;
  line-height: 1.2;
  padding: 1.5em 2em 0.5em 2em;
}

.zitatbox::before,
.zitatbox::after {
  position: absolute;
  font-size: 300%;
  color: #ccc;
  font-family: serif;
  line-height: 1;
}

.zitatbox::before {
  content: "„";
  top: 0;
  left: 0;
}

.zitatbox::after {
  content: "“";
  bottom: -0.2em;
  right: 0;
}

.kirankings{
	padding: 35px 0;
	margin-bottom: 25px;
}

.kirankings img{
	display: inline-block;
	width: 36px;
	margin-bottom: 0;
}

.kirankings span{
	color: #aaa;
	display: block;
}


.page-overlay {
  position: fixed;
  inset: 0;

  /* Verlauf von oben nach unten */
  background: linear-gradient(
    to bottom,
    rgba(255,255,255,1) 0%,
    rgba(255,255,255,0.95) 30%,
    rgba(255,255,255,0.55) 55%,
    rgba(255,255,255,0.25) 100%
  );

  opacity: 0;
  pointer-events: none;
  transition: opacity .2s ease;
  z-index: 5;
}

body:has(.has-sub:hover) .page-overlay {
  opacity: 1;
  pointer-events: auto;
}

.section-index {
	display: none;
}
































































































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

.section-index {
	display: block;
  position: absolute;
  left: 50%;
  top: 110px;
  transform: translate(-50%);
  font-size: 150px;
  font-weight: 600;
  color: rgba(0,0,0,0.04);
  pointer-events: none;
  user-select: none;
}

.nav-warenkorb-icon {
	z-index: 99999;
    top: 20px;
right: 340px;
}
		.wkimobile{
			display: none;
		}

		/*
		a.menuenavueber::after{
			content: '';
			display: block;
			position: absolute;
			transition: all 0.6s ease 0s;
			height: 1px;
			width: 0;
			background-color: #212121;
			left: 0;
			bottom: 0;
			left: 50%;
			transform: translate(-50%);
			}
		
			
		li:hover a.menuenavueber::after{
		transition: all 0.6s ease 0s;
		width: 85%;
		background-color: #212121;
		}	

		.headeralt a.menuenavueber::after{
			background-color: #fff!important;
			}
		
			
		.headeralt li:hover a.menuenavueber::after{
		background-color: #fff;
		}	
	
		.headerfixed a.menuenavueber::after{
			background-color: #212121!important;
			}
		
			
		.headerfixed li:hover a.menuenavueber::after{
		background-color: #212121;
		}	

		*/


.closerx{
	cursor: pointer;
	display: block;
	float: right;
	width: 28px;
}

.stoerer{
		padding: 2.5%;
}

.closerx img{
	width: 100%;
}

.wki{
	background-position: 0 45%;
	background-repeat: no-repeat;
	background-size: 24px auto;
	width: 30px;
	height: 18px;
	margin: 0;
	margin-top: 7px;
	margin-left: 20px;
}
.headeralt .wki{
	background-image: url(https://gerlach.media/bilder/shopping-cart-white.svg);
}
.headerfixed .wki{
	background-image: url(https://gerlach.media/bilder/shopping-cart.svg);
}

.drpnav::after{
	right: 4%;
	top: 0px;
	margin-top: 1px;
	}

.shopnav{
	top: 18px;
	right: 20px;
}

		html{ 
			font-size: 17.4px;
			line-height: 1.6;
			letter-spacing: 0.4px;
			word-spacing: 0.4px;
			height: 100%;
			min-height: 100%;
			color: #212121;
			}

			.whatsapp{
				bottom: 20px;
				left: auto;
				text-align: right;
				right: 0;
				transform: translate(none);
				width:320px;
				max-width: 320px;
				}


				.prozesssection{
					padding: 0;
					left: 50%;
					margin-left: -700px;
					box-sizing: content-box;
				}

				.prozessbox{
					width: 370px;
					margin-right: 25px;
				}

				.prozessboxklein{
					width: 260px;
					margin-right: 25px;
				}

				.prozessboxklein img{
					width: 260px;
					max-height: 425px;
					overflow: hidden;
				}
				
				.pzblastchild{
					margin-right: 350px;
				}

				.messeboxin{
					padding: 40px 120px 40px 40px;
				}



				.zertiabsolut{
					z-index: 9;
					position: absolute;
					bottom: 50px;
					right: 60px;
				}
				
				.zertiabsolut img{
					width: 80px;
				}
				



			.modul{
				position: fixed;
				left: 0;
				top: 0;
				width: 100%;
				height: auto;
				z-index: 99999;
				overflow: hidden;
				display: none;
				transform: translateY(-100%);
				opacity: 0;
				transition: .4s ease;
				pointer-events: none;
			}
			
			.modulin {
				position: relative;
				width: 100%;
				margin-left: auto;
				margin-right: auto;
				padding: 60px;
				box-sizing: border-box;
			}
			
			.modulintext{
				border-radius: 10px;
				background-color: #fff;
				box-shadow: 0 5px 30px rgba(0, 0, 0, .2);
				margin: auto;
				max-width: 1000px;
				box-sizing: border-box;
				padding: 60px;
				font-size: 15px;
			}
			
			.modulopen {
				display: block;
				overflow-y: auto;
				transform: translateY(0);
				opacity: 1;
				pointer-events: auto;
			}
			
			
			
			.modulbg {
				background: rgba(217, 221, 221, .7);
				-webkit-backdrop-filter: blur(10px);
				backdrop-filter: blur(10px);
				z-index: 9999;
				position: fixed;
				left: 0;
				top: 0;
				width: 100%;
				height: 100%;
				display: none;
			}
			
			.modulbgshow {
				opacity: 1;
				display: block;
			}
			
			
			.paddingbox4{
				padding: 100px!important;
			}
	
.galeriebox{
	width: 520px;
}


.seocheckbg{
	background-image:url('https://gerlach.media/bilder/seocheckbg.webp'); 
	background-repeat:no-repeat;
}

.casesnipp{
	visibility: hidden;
	position: fixed;
	left: auto;
	right: 0;
	top: 15%;
	opacity: 0;
	color: #212121;
    box-shadow: 0 5px 1.25rem 0 #32323216;
	transition: all 0.4s ease-in-out;
	line-height: 1.43;
	cursor: pointer;
	font-size: 90%;
	margin-right: -1000px;
}

.casesnippmobile{
	visibility: hidden;
}

.casesnipp:hover{
    box-shadow: 0 5px 7.25rem 0 #32323216;
}

.casesnippin{
	padding: 25px 40px;
}

.showsnipp{
	visibility: visible;
	margin-right: -15px;
	opacity: 1;
}


.navtitel{
	padding: 10px 0 15px 0;
	margin-top: 0;
	margin-left: 20px;
	font-size: 140%;
	letter-spacing: 0.6px;
	text-transform: uppercase;
	color: #111;
	font-weight: 700;
	line-height: 1.4;
}


.bewertet{
	font-size: 80%;
	width: 100px;
}

.seocertie{
	margin-right: 15px;
	width: 54px;
}

		#menue{
			display:flex;
			width: auto;
				}
		#menuelink{
			display: none;
		}
	
		.subnav img{
			display: block;
		  }

		  
		.portraitbildklein{
			width: 80px!important;
		}

		  
.telefonbox{
	display: none;
}

.userprofilbox{
	display: block;
	position: absolute;
	width: 34px;
	height: 34px;
	border-radius: 50%;
	background-color: #fff;
	font-size: 130%;
	color: #212121;
	font-weight: 800;
	z-index: 999;
	transition: all 0.4s ease-in-out;
	right: 220px;
	top: 50%;
	margin-top: -4px;
	transform: translateY(-50%);
}

.userprofilbox:hover .material-icons{
	color: #fff;
}
.userprofilbox:hover{
	background-color: #0c0c0c;
}
		
.mobilescroll {
	width: 100%;
	max-width: 100%;
	overflow-x: hidden;
}
.ueberbgstart {
    background-image: url(https://gerlach.media/bilder/ueberbgstart.webp);
    background-size: 45%;
    background-position: 100% 12%;
    background-repeat: no-repeat;
	padding-top: 0;
}




.ueberbg2025 {
	background-size: auto 70%;
	background-position: 110% 12%;
	background-repeat: no-repeat;
	padding-top: 0;
}


.leistungvierer{
	width: 25%;
	display: inline-block;
	margin-right: -5px;
	vertical-align: top;
	min-height: 340px;
}

		  .seokreis{
			display: block;
			transition: all 0.4s ease 0s;
			position: absolute;
			bottom: 140px;
			left: 50%;
			z-index: 7;
			width: 84px;
			height: 84px;
			margin-left: 550px;
			transform: rotate(4deg);
		}
		.vorteileboxover{
			font-size: 100%;
		}
		.vorteilein h3{
			font-size: 24px;
		}

		.vorteileinbox{
			padding: 10px 20px;
		}
			

		.seokreis:hover{
			overflow: visible;
			transform: rotate(366deg);
			scale: 1.4;
		}
		
		
		.seokreis img{
			width: 100%;
		}
		


		.teamseoagentur{
			background-image: url('https://gerlach.media/bilder/screenshot-gerlach-media-seo-management-system.webp');
			background-size: 48%;
			background-position: 102%;
			background-repeat: no-repeat;
		}

		  .bottomtextweiter{
			z-index: 5;
			display: block;
			transition: all 0.4s ease 0s;
			font-size: 110%;
			font-weight: 800;
			text-transform: uppercase;
			position: absolute;
			top: auto;
			bottom: 0;
			margin-bottom: -80px;
			left: 50%;
			transform: translateX(-50%);
		}
		
		.bottomtextweiter::before{
			animation: pulse 3s;
			animation-iteration-count: 40;
			font-size: 180%;
			content: '↓';
			position: absolute;
			margin-top: -50px;
		}
		.bottomtextweiterwech{
			opacity: 0;
			transition-delay: 0.1s;
			z-index: -1;
		}
		
		
		  @keyframes pulse {
			0% {
			  transform: scale(1);
			  opacity: 1;
			}  
			70% {
			  transform: scale(1.45);
			  opacity: 1;
			}
			100% {
			  transform: scale(1);
			  opacity: 1;	
			}
		  }
		
		
				

.subsuche{
	width: 89.32%;
	top:  325px;
}

.frigt{
	display: flex;
	float: right;
}


.roundboxstart{
	transition-delay: 1s;
	position: absolute;
	z-index: 2;
	top: -5px;
	right: -30px;
	width: 550px;
}

.roundboxstartzwei{
	transition-delay: 1s;
	width: 550px;
	position: absolute;
	z-index: 1;
	top: 60px;
	right: -80px;
	opacity: 0.6;
}

.roundboxstartzwei:focus, .roundboxstartzwei:hover{
	opacity: 1;
}

.nav .graubg{
	background-color: #F6F9FC;
}


		.gobox {
			overflow: auto;
	display: none;
			position: fixed;
			z-index: 1;
			width: 100%;
			height: 100%;
			top: 0;
			left: 0;
			background-color: rgba(0, 0, 0, 0.5);
		}
		
		.goboxin {
			position: absolute;
			padding: 50px;
			top: 50%;
			left: 50%;
			transform: translate(-50%, -50%);
			background-color: #fff;
			box-shadow: 0 2px 3.25rem 0 rgba(0,0,0,.42);
			color: #171717;
			border-radius: 4px;
			width: 600px;
			max-width: 80%;
		}
		
		.goboxtitel {
			display: block;
		  	margin-bottom: 20px;
			font-size: 36px;
			font-weight: 800;
		}

		.goboxcloser{
			z-index: 4;
			position: absolute;
			right: 0;
			top: 0;
			border-radius: 50%;
			width: 16px;
			height: 16px;
			padding: 12px;
			margin-right: -12px;
			margin-top: -12px;
			background-color: #212121;
			color: #fff;
			font-weight: 800;
			text-align: center;
			cursor: pointer;
		}
		



		.goboxclose {
			display: none!important;
			height: 0!important;
		}


.blockr{
	display:block; margin-right: 125px;
}

.zoombildaktiv{
	width: auto;
	position: absolute;
	z-index: 1;
	scale: 0.66;
	box-shadow: 0 2px 3.25rem 0 rgba(0,0,0,.11);
	bottom: -230px!important;
	right: -350px;
	}

.zoombildaktivzwei{
	width: auto;
	position: absolute;
	z-index: 2;
	scale: 0.66;
	box-shadow: 0 2px 3.25rem 0 rgba(0,0,0,.11);
	bottom: -270px!important;
	right: 250px;
	border-radius: 50%;
	}
	

.topinfos{
	z-index: 3;
	display: block;
	position: absolute;
	width: auto;
	left: 50%;
	transform: translate(-50%);
	margin-top: -24px;
	letter-spacing: -0.1px;
}

.toptext{
	display: inline-block;
	vertical-align: middle;
	padding: 4px 14px;
	font-weight: 400;
	color: #212121;
}

.toptextzwei{
	padding: 12px 50px;
	margin-top: -4px;
	border-radius: 4px;
}

.toptext a{
	color: #111;
}
.toptextactiv a{
	font-size: 115%;
}

.menuelinkactive:hover{
	opacity: 0.76;
	background-color: #F6F9FC!important;
}
		
.desktophide{
	display: none;
}

.wave-bottom {
	height: 90px;
}

.dasteam{
	max-width: 1000px;
	margin: auto;
}

.teambox{
	height: auto;
	width: 310px;
	display: inline-block;
	margin-right: 20px;
}

.teamboxlast{
	margin-right: 0;
}

.kdbox{
    transition: all .2s ease-in-out;
	min-height: 800px;
	padding: 20px;
	font-size: 90%;
	color: #222;
	max-width: 95%;
	overflow: visible;
	margin-bottom: 100px;
	box-sizing: border-box;
}

.kdbox h3{
	font-size: 180%!important;
	font-weight: 600!important;
	line-height: 1.35;
}

.kdbox .roundboxin{
	box-sizing: border-box;
	max-width: 60%;
	padding: 60px;
}

.roundboxinbig{
	padding: 60px;
	font-size: 90%;
}

.kdboxeven{
	margin-left: 5%;
}

.kdboxeven .roundboxin{
	margin-left: 40%;
}

.kdboxtext{
	box-sizing: border-box;
	position: absolute;
	right: 0;
	margin-right: -6%;
	top: 50px;
	background-color: #F1F3F7;
	width: 45%;
	padding: 0;
}

.kdboxeven .kdboxtext{
	box-sizing: border-box;
	margin-left: 5%;
	right: auto;
	left: 0;
	margin-left: -6%;
	margin-right: 0;
}


.kdboxin{
	padding: 60px;
	padding-top: 30px;
}


.kdseit{
	margin: 30px 0px 0px 60px;
	background-color: #fff;
	border-radius: 24px;
	padding: 6px 30px 6px 30px;
	display: inline-block;
}

.kdaktiv{
	margin: 30px 0px 0px -20px;
	background-color: #12B982;
	border-radius: 24px;
	padding: 6px 20px;
	display: inline-block;
	color: #fff;
	font-weight: bold;
}

.kdaktivno{
	background-color: #e7e7e7;
	color: #666;
}

.kdbox2{
    transition: all .2s ease-in-out;
	min-height: 300px;
	padding: 20px;
	font-size: 90%;
	cursor: pointer;
}

.kdbox2:hover{
	z-index: 3;
    box-shadow: 0 5px 6.25rem 0 #32323216;
	scale: 1.02;
}
.kdbox2:focus{
	z-index: 4;
    box-shadow: 0 5px 6.25rem 0 #32323229;
	outline: 4px solid #18181858;
	scale: 1.08;
}

.hilith{
	font-weight: 800;
	font-size: 260%;
	padding-bottom: 20px;
	display: block;
	margin: auto;
	text-align: center;
}


	
.stickylinks{
	display: inline-block;
	position: sticky;
	top: 100px;
	max-width: 45%;
	padding: 0 5%;
}	

.stickykurz{
	padding: 100px 5%;
	top: 100px;
	max-width: 25%;
}


.paddingdesk{
	padding-top: 160px;
}
body{ 
	background-color:#ffffff;
		}

		.footerbigbox{
			font-size: 260%;
		}

		#footer .innen{
			padding: 95px 0;
	}
	a.footerlink, a.footerlink:visited {
		font-size: 90%;
	}
  	
	#footer .fuenfer{
		padding: 0px!important;
	}
	
.footerlinks{
	float:left;
	width: 49%;
	text-align: left;
}

.footerrechts{
	padding-top: 25px;
	float:left;
	width: 50%;
	text-align: right;
}
		
		.zweierbig{
			width: 50%;
			float:left;
			margin-right: -5px;
		}

		.bigvideo{
		position: fixed;
		right: 0;
		bottom: 0;
		width: auto;
		min-width: 100%;
		height: auto;
		min-height: 100%;
		z-index: -100;    
		background-size: cover;
		}

		.margtop{
			margin-top: 150px;
		}
		
		.seitenbild{
			width: auto;
			max-width: 100%;
		}

		.seitenbildmin{
			transition: all .2s ease-in-out;
			width: auto;
			max-width: 65%;
			scale: 1;
			text-align: center;
		}

		.absopic1{
			position: absolute;
			max-width: 45%;
			left: 50%;
			transform: translate(-50%);
			margin-left: -400px;
			z-index: 1;
			bottom: 0;
			margin-bottom: -200px;
		}

		.absopic2{
			z-index: 1;
			position: absolute;
			max-width: 65%;
			left: 50%;
			transform: translate(-50%);
			margin-left: 500px;
			bottom: 0;
			margin-bottom: -200px;
		}		


		.seitenbildkurz{
			transition: all .2s ease-in-out;
			width: auto;
			max-width: 80%;
			margin: 0;
			text-align: left;
		}

		.referenzgooglebild{
			transition: all .2s ease-in-out;
			width: auto;
			max-width: 400px!important;
			text-align: left;
			margin-bottom: 25px;
			margin-top: -50px;
		}
.zertirechts{
	float:right;
}

		.seitenbildklein{
			transition: all .2s ease-in-out;
			width: auto;
			max-width: 80%;
			scale: 1.2;
			margin: 0;
			text-align: left;
		}

		.seitenbildklein:hover{
			scale: 1.4;
		}

		.seitenbildzoom{
			position: relative;
			-webkit-transform: scale(1);-moz-transform: scale(1);-ms-transform: scale(1);-o-transform: scale(1);transform: scale(1);
		}
		
		.seitenbildzoom:hover{
			transition: all 0.4s ease-in-out;
			-webkit-transform: scale(1.14);-moz-transform: scale(1.14);-ms-transform: scale(1.14);-o-transform: scale(1.14);transform: scale(1.14);
		}


		.seitenbildbigzoom:hover{
			transition: all 0.4s ease-in-out;
			-webkit-transform: scale(1.9);-moz-transform: scale(1.9);-ms-transform: scale(1.9);-o-transform: scale(1.9);transform: scale(1.9);
			box-shadow: 0 5px 6.25rem 0 #32323229;
			z-index: 5;    
		}
		a.buttonlink, a.buttonlink:visited {
			font-size:100%;
			transition: all 0.2s ease;
			display: inline-block;
			color: #fff;
			border: 0px;
			padding: 14px 26px;
			text-align: center;
			line-height: 130%;

		}
		
		a.buttonlink:hover, a.buttonlink:active {
				text-decoration: none;
				color: #fff;
			}
			
			a.buttonlinkzwei, a.buttonlinkzwei:visited, a.buttonlinkzwei:active{
				color: #212121;
				background-color: transparent;
				border: 2px solid #0c0c0c ;
				margin-left: 6px;
			}
			a.buttonlinkzwei:hover{
				color: #fff;
				background-color: #0c0c0c ;
				border: 2px solid #0c0c0c ;
			}


		.servicebg{
			background-position: 60% 30%;
		}
		

		.desktophidefixed{
			display: none;
		}



.podcastlogo{
    opacity: 0.78;
    height: 100px;
    display: inline-block;
	transition: all 0.4s ease-in-out;
    margin-right: 40px;
}


.fahrzeugcatch{
	height: 60%;
}

a.staedtelink, a.staedtelink:visited {
	display: inline-block;
	transition: all .4s ease-in-out;
		color: #515151;
		padding: 12px 20px;
		margin-bottom:1px;
		margin-right: -4px;
		text-decoration: none;
		width: 180px;
		text-align: center;
		background-color: #fff;
}

a.staedtelink:hover, a.staedtelink:active {
		background-color: #212121;
		color: #fff;
		text-decoration: none;
		font-weight: 400;
		box-shadow: 0 2px 3.25rem 0 rgba(0,0,0,.28);
		z-index: 9;
}

.submenue li{
	display:block;
	clear: both;
	transition: all 0.3s ease 0s;
	font-size: 90%;
}

	.submenue li {
	margin-right: 0;
	}


	

	#menue li:focus > .subnav  {
		transition: all 0.1s ease 0s;
		height: 0!important;
		padding: 0;
	}

#menue li:hover > .subnav  {
	visibility: visible;
	transition: all 0.1s ease 0s;
	height: auto!important;
	padding: 11px;
	padding-bottom: 80px;		
	overflow:visible;
}

#menue li:hover .subnavin  {
	opacity: 1;
	transition: all 0.1s ease 0s;
}	

.bodyblur{
}

.angebotbox{
	width: 674px;
	height: 385px;
	overflow: hidden;
	margin-right: 10px;
	margin-bottom: 10px;
}

.angebotbox:hover .angebotboxinfo{
	font-size: 135%;
}

.angebotbox:hover .angebotslink{
	opacity: 1;
}


.shop0{
	width: 15%;
	display: inline-block;
	margin-right: -4px;
	vertical-align: top;	
}	
.shop1{
	width: 50%;
	display: inline-block;
	margin-right: -4px;
	vertical-align: top;	
}
.shop1 div {
	padding: 0;
}
.warenkorbzeile{
	padding: 10px 30px 0px 30px!important;
}
.shopbild{
	width: auto;
	height: auto;
}
.shopbild img{
	z-index: 12;
	width: 100%;
	height: auto;	/* SCALE */	-webkit-transform: scale(1);	-moz-transform: scale(1);	-ms-transform: scale(1);	-o-transform: scale(1);	transform: scale(1);	/* VERZÖGERUNG */	-webkit-transition: all 0.3s linear;	-moz-transition: all 0.3s linear;	-ms-transition: all 0.3s linear;	-o-transition: all 0.3s linear;	transition: all 0.3s linear;
}
.shopbild img:hover{
	cursor: zoom-in;
	-webkit-transform: scale(1.02);	-moz-transform: scale(1.02);	-ms-transform: scale(1.02);	-o-transform: scale(1.02);	transform: scale(1.02);
}
.shopbild img:focus{
	/*
	position: absolute;
	left: 50%;
	*/
	transform: translateX(-50px);
	cursor: default;
	z-index: 12;
	-webkit-transform: scale(1.4);	-moz-transform: scale(1.4);	-ms-transform: scale(1.4);	-o-transform: scale(1.4);	transform: scale(1.4);
    box-shadow: 0 2px 17px 0 rgb(0 0 0 / 36%);
}

.shop2{
	width: 47%;
	display: inline-block;
	margin-right: -4px;
	vertical-align: top;
}

.box2 {
	width: 600px;
	margin-right: 0;
  }

  .box3,  .box4,  .box5 {
	width: 420px;
	height: 285px;
  }

  .box5 {
	margin-right: 0;
  }

.branchenbox{
	width: 450px;
	height: 260px;
}

  .navbox{
	display: block;
	width: 300px;
	height: 190px;
}


.fzwahlbox{
	position: absolute;
	width: 0;
	overflow: hidden;
	padding: 15px 0;
	z-index: 99;
	top: 96px;
	left:50%;
	color: #999;
	font-size: 90%;
	height: 24px;
    transition: all 0.2s ease 0s;
	opacity: 0;
	border-radius: 4px;
	transform: translateX(-50%);
}

.fzwahlbox_open{
	width: 395px;
	overflow: hidden;
	box-shadow: 0px 2px 14px 2px rgb(0 0 0 / 4%);
	background-color: #fff;
	padding: 15px;
	opacity: 1;
}

.fzboxclose{
	display: block;
	position: absolute;
	right: 10px;
	top: 0;
	z-index:999;
	width: 30px;
	height: 40px;
	color: #999;
	text-align: center;
	vertical-align: middle;
	font-size: 14px;
	padding-top: 17px;
	cursor: pointer;
}

.fzboxclose::before{
	content: 'x';
	font-size: 24px;
	font-weight: 500;
}


.kontaktbox{
	display: block;
	position: fixed;
	z-index: 99;
	bottom: 110px;
	right: 50px;
	box-shadow: 0px 2px 14px 2px rgb(0 0 0 / 4%);
	border-radius: 4px;
	background-color: #fff;
	padding: 15px;
	font-size: 85%;
}

.kontaktbox span{
	display: block;
}




.markenlogo{
    -webkit-filter: grayscale(1);
    filter: grayscale(1);
    opacity: 0.8;
}

	
.langselect {
    padding-left: 40px!important;
    background-image: url(https://gerlach.media/bilder/lang-icon.png);
    background-repeat: no-repeat;
    background-position: 14px 53%;
    background-size: 15%;
}
	

.preislistetitel{
display: inline-block;
font-weight: 400;
font-size: 120%;
vertical-align: top;
width: 35%;
color: #212121;
}

.preislistebeschreibung{
	display: inline-block;
	vertical-align: top;
	width: 43%;
}
.preislistepreis{
	display: inline-block;
	vertical-align: top;
	width: 20%;
	text-align: right;
	color: #212121;
	float: none;
}
		
.maxwid{
	padding: 0!important;  
}			
.maxwidth {
	max-width: 720px!important;    
	padding: 0!important;  
}		
		
.maxweite {
	max-width: 600px!important;    
	padding: 0!important;  
}
		
.border{
	margin: 10px 0 25px 0;
}	


.roundbox .border{
	margin: 10px 0 10px 0;
}
		
.systemtext{
	display:inline-block;
	float:left;
	width: 600px;
	height: auto;
	padding: 40px;
}	
		
.systemtextrechts{
	float:right;
}	
		
.system{
	display:block;
	width: 1000px;
	height: 495px;
}	

		
.system1{
	display:inline-block;
	float:left!important;
	background-image: url('https://gerlach.media/bilder/system2.png'); 
	margin-right: -400px;
}	
		
.system2{
	display:inline-block;
	float:left!important;
	background-image: url('https://gerlach.media/bilder/system2.png'); 
	margin-right: 0;
	margin-left: -400px;
}
		
.systemmitte{
	float:none!important;
	text-align: center;
}


.bgemotion{
	min-height: 720px;
}

		
.nav{
		height: auto;
		padding: 0;
		position: relative;
		transition: all 0.0s ease 0s;
		border: 0px;
		display:flex;
		flex-wrap: wrap;
		justify-content: center;
		width: auto;
		background-color: transparent;
		top: auto!important;
		right: auto!important;
		opacity: 1.0!important;
		z-index: 9;
		overflow: visible;
		font-size: 100%;
		margin-left: 0;
		}

.navin{
	width: auto;
	max-width: 1360px;
	margin: auto;
}
		
.nav li{
			position: relative;	
			display: flex;		
		}	
.navend{
justify-self: end;
}

.nomargright{
		margin-right: 0px!important;
}	

a.menuenavueber, a.menuenavueber:visited, .menuenavueberklon{
	z-index: 100;
			transition: all 0.6s ease 0s;
		padding: 8px 16px 6px 16px;
		display: flex;
		font-weight: 400;
		font-size: 95%;
		border-radius: 32px;
		color: #686868;
		margin-top: 0;
		z-index: 1;
		cursor: pointer;
}


a.menuenavueber:hover, a.menuenavueber:active, .menuenavueberklon:hover{
	transition: all 0.6s ease 0s;
    color: #686868;
		text-decoration: none; 
		background-color: #F6F9FC;
	}







	.headeralt a.menuenavueber, .headeralt a.menuenavueber:visited, .headeralt .menuenavueberklon, .headeralt .menuenavueberklon:visited{
		z-index: 100;
				transition: all 0.6s ease 0s;
			display: flex;
			font-weight: 400;
			font-size: 95%;
			color: #eee;
			margin-top: 0;
			z-index: 1;
	}
	
	.headeralt a.menuenavueber:hover, .headeralt a.menuenavueber:active, .headeralt .menuenavueberklon:hover, .headeralt .menuenavueberklon:active{
		transition: all 0.6s ease 0s;
		color: #fff;
		text-decoration: none; 
		background-color: transparent;
		}

		.headerfixed a.menuenavueber, .headerfixed a.menuenavueber:visited, .headerfixed .menuenavueberklon, .headerfixed .menuenavueberklon:visited{
			z-index: 100;
					transition: all 0.6s ease 0s;
				display: flex;
				font-weight: 400;
				font-size: 95%;
				color: #222;
				margin-top: 0;
				z-index: 1;
		}
		
		.headerfixed a.menuenavueber:hover, .headerfixed a.menuenavueber:active, .headerfixed .menuenavueberklon:hover, .headerfixed .menuenavueberklon:active{
			transition: all 0.6s ease 0s;
			color: #686868;
				text-decoration: none; 
			}


	a.menuezwei, a.menuezwei:active, a.menuezwei:hover, a.menuezwei:visited{
		border-radius: 8px;
		visibility: visible;
		transition: all 0.1s ease 0s;
		background: #0c0c0c;
		color: #fff;
		font-size: 95%;
		animation: btn-secondary-pulse 2s infinite;
		margin-left: 20px;
		padding: 8px 20px 10px 20px;
	}

	.headerfixed a.menuezwei, .headerfixed a.menuezwei:active, .headerfixed .menuezwei:hover, .headerfixed .menuezwei:visited{
		background: #0c0c0c!important;
		color: #fff!important;
	}





	.orange{
		background-color: #0c0c0c!important;
	}

	
@-webkit-keyframes btn-secondary-pulse {
	0% {
	  -webkit-box-shadow: 0 0 0 0 rgba(0, 0, 0, 0.4);
	}
	70% {
		-webkit-box-shadow: 0 0 0 10px rgba(0, 0, 0, 0);
	}
	100% {
		-webkit-box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);
	}
  }
  @keyframes pulse {
	0% {
	  -moz-box-shadow: 0 0 0 0 rgba(0, 0, 0, 0.4);
	  box-shadow: 0 0 0 0 rgba(0, 0, 0, 0.4);
	}
	70% {
		-moz-box-shadow: 0 0 0 10px rgba(0, 0, 0, 0);
		box-shadow: 0 0 0 10px rgba(0, 0, 0, 0);
	}
	100% {
		-moz-box-shadow: 0 0 0 0 rgba(23, 93, 175, 0);
		box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);
	}
  }




	.seocheck{
		background-color: #0c0c0c !important;
	}


	a.menuezwei::after{
		content: '';
		display: block;
		position: absolute;
		transition: all 0.6s ease 0s;
		height: 1px;
		width: 0;
		background-color: #fff;
		left: 10%;
		bottom: 5.5px;
	}
			


	
.dropdown{
		padding: 0 25px 0 0;
		background-image: url('https://gerlach.media/bilder/dropdown.svg');
		background-repeat:no-repeat;
		background-position: 100% 42%;
		background-size: 16px;
}



	.menuetel{
		display: block;
		border-radius: 4px;
		padding: 6px 10px 6px 30px!important;
		transition: all 0.6s ease 0s;
		font-size: 115%;
}

.menuetel:hover{
	background-color: #ddf0ff;
}
.menuetel:before{
	transition: all 0.6s ease 0s;
	position: absolute;
	left: 0;
	content: '';
	background-image: url(https://gerlach.media/bilder/phone.svg);
	background-position: 5px 35%;
	background-repeat: no-repeat;
	background-size: 90%;
	width: 20px;
	height: 20px;
	opacity: 0.4;
}

.menuetel:hover:before{
	-webkit-transform: rotate(20deg);
	-moz-transform: rotate(20deg);
	-ms-transform: rotate(20deg);
	-o-transform: rotate(20deg);
	transform: rotate(20deg);
	-webkit-transform: rotate(20deg);
	background-position: 5px 0%;
}

	
.coachingbg{
	background-image: url(https://gerlach.media/bilder/seo-agentur-gerlach-media2.jpg);
}

.navzwei a.menuenavueber, .navzwei a.menuenavueber:visited{
	color: #212121;
		}



.navzwei a.menuenavueber:hover, .navzwei a.menuenavueber:active{
	transition: all 0.6s ease 0s;
		text-decoration: none; 
		}
		
		.bordermenue{
			border: 1px solid #fff;
		padding: 6px 6px 6px 6px!important;
		}		
		
.ani{
	display: block;
	position: absolute;
	transition: all 0.6s ease 0s;
	height: 2px;
	width: 0;
	background-color: #212121;
	left: 0;
	bottom: 0;
	margin-bottom: -4px;
}
		
.nav li:hover .ani{
	transition: all 0.6s ease 0s;
	width: 100%;
	background-color: #212121;
}	

.submenueabsolute{
	background-color: #F6F9FC;
	display: block;
	position: absolute;
	right: 25px;
	bottom: 25px;
	padding: 40px;
	border-radius: 0.51em;
}

.submenueabsolute h3{
	margin-top: 0;
	margin-left: 0;
	color: #0c0c0c ;
}

		
a.subnavilink, a.subnavilink:visited {
	display: inline-block;
    padding: 8px 20px;
    transition: all 0.4s ease 0s;
	font-size: 16px;
	font-weight: 300;
	letter-spacing: 0.1px;
	word-spacing: 1.2px;
}			

        
a.subnavilink:active, a.subnavilink:hover {
	opacity: 1;
    transition: all 0.4s ease 0s;
    color: #111;
    text-decoration: underline;
	text-underline-offset: 5px;
}

a.subnavilinkbig, a.subnavilinkbig:visited{
	display: block;
    transition: all 0.1s ease 0s;
	font-size: 110%;
	font-weight: 800;
	border-radius: 0.51rem;
    padding: 14px 20px;
	letter-spacing: 0.6px;
	line-height: 1.4;
}

.submenueimg{
    transition: all 0.4s ease 0s;
	display: block;
	float:left;
	height: 30px;
	width: 30px;
	margin-top: 6px;
	margin-right: 20px;
	margin-left: -5px;
	opacity: 0.4;
}

a.subnavilinkbig:active, a.subnavilinkbig:hover{
	margin-left: 2px;
    color: #0c0c0c ;
	background-color: #F6F9FC;
    text-decoration: none; 
}

a.subnavilink span{
	font-weight: 400;
	font-size: 75%;
	display: block;
	color: #666;
	letter-spacing: 0.3px;
}


.subnavilinkbigactive{
    color: #0c0c0c !important;
	background-color: #F6F9FC;
    text-decoration: none; 
}

.dreiermgtop{
	margin-top: 60px;
}

a.subnavilinkzwei, a.subnavilinkzwei:visited{
	font-size: 16.5px;
	padding: px 20px;
}
a.subnavilinkzwei:hover, a.subnavilinkzwei:active{
    text-decoration: underline;
	background-color: transparent; 
}

.sbnlact{
	color: #181818;
	background-color: #F6F9FC;
}
  		
ul.linkinline li{
	display: inline-block!important;
}  		
a.subnavilinkmini {
	display: inline-block!important;
}			
    
 .subnavtitel{
	font-size: 80%;
  display: block;
   padding: 10px!important;
   font-weight: 400;
	color: #888;
	margin-bottom: 0;
   border-radius: 3px 3px 0 0;	
   text-transform: uppercase;
	  }    

.subnav{
    position: absolute;
    top: 100%;
    left: 0;
    visibility: hidden;
    opacity: 0;
    transition: opacity .15s ease;
    padding: 20px 25px!important;
    z-index: 9999;

    /* NEU – Breite erhöhen */
    width: 360px;

    /* Für optisch mittige Ausrichtung */
    transform: translateX(-20%);

	background: transparent;
}

.subnavlang{
    width: 740px;
}

.subnavmax{
    width: 1024px;
}

.drpnav:hover .subnav{
    visibility: visible;
    opacity: 1;
}

.subnavin{
    background: #fff;
box-shadow: 0 10px 25px rgba(0,0,0,0.1);
border-radius: 6px;
   padding: 25px!important;
}

.submenue{
	margin-bottom: 0!important;
}

.logotext {
  color: #222;
  font-size: 17px;
  font-weight: 500;
  letter-spacing: 0.01em;
  opacity: 0.85;
  line-height: 1;
  height: 100%;
  vertical-align: middle;
}




		/*

.subnavin::before {
    transition: all 0.1s ease-in-out;
    position: absolute!important;
    content: "";
    width: 0;
    height: 0;
    border-right: 14px solid transparent;
    border-left: 14px solid transparent;
    border-bottom: 14px solid #fff;
    top: 0;
    left: 0;
    margin-top: -10px;
    margin-left: 275px;
	 transform: rotate(-12deg);
}	
		
.subnavklein .subnavin::before {
    transition: all 0.1s ease-in-out;
    position: absolute!important;
    content: "";
    width: 0;
    height: 0;
    border-right: 14px solid transparent;
    border-left: 14px solid transparent;
    border-bottom: 14px solid #fff;
    top: 0;
    left: 0;
    margin-top: -10px;
    margin-left: 55px;
	 transform: rotate(-12deg);
}	*/


.subeins{
width: 300px;
display: inline-block;
vertical-align: top;
margin-bottom: 0;
}

nav ul#menue li {
  }

.subnav li{
		position: relative;
		display:block!important;
		transition: all 0.3s ease 0s;
		font-size: 90%;
}

#menue li:hover .subnav{
	transition: all 0.4s ease 0s;
	opacity: 1;
	visibility: visible;
	height: auto;
	transition-delay:0.4s;
}


		.subnav li {
		margin-right: 0;
		}
	


#menue li:hover .subnavin  {
		opacity: 1;
		transition: all 0.1s ease 0s;
}	
		
		
.menuenavueberactive{
		padding: 8px 12px 8px 12px!important;
		border-bottom: 1px solid #212121!important;
		text-decoration: none; 
		background-image: none;

}	

.bigmenue{
	font-weight: 600!important;
	font-size: 115%!important;
	margin-right: 15px!important;
	letter-spacing: -0.5px!important;
	color: #212121!important;
	margin-top: -3px!important;
}

a.button, a.button:visited {
	float:right;
    transition: all 0.4s ease;
    display: inline-block;
    background-color: #fff;
    border: 0px;
    border-radius: 3px;
    box-shadow: 1px 2px 20px rgba(0,0,0,.26);
    padding: 4px 12px 4px 12px;
    opacity: 0.2;
	margin-top: 6px;
	font-size: 16px;
}

a.button:hover, a.button:active {
		text-decoration: none;
		opacity: 0.9;
		color: #fff;
}		
		
.button span {
     color: #fff;
   opacity: 1.0!important;
}		
		
.rechtsbund{
	float:right;
}	

.paketbox{
		transition:all 0.1s ease 0s; /*W3C Standard*/
		line-height: 150%;
		text-align: left;
		float:left;
		width: 22%;
		font-weight: 400;
		padding: 25px 1.5% 55px 1.5%;
		min-height: 260px;
		display: inline-block;
		margin-bottom: 20px;
		box-shadow: 1px 2px 2px rgba(0,0,0,0.4);
} 		
		
.zweier{
	display: inline-block;
	flex-direction: column;
	vertical-align: top;
	width: 48%;
	padding: 0 1%;
	margin-bottom: 20px;
	text-align: left;
	position: relative;
	transition: all 0.1s ease 0s;
	box-sizing: border-box;
}


.zweierohnepadd{
	padding: 1.5% 0;
}

.zweierohnepaddzwei{
	padding: 0 0 1.5% 0;
}

.zweierohnepaddnull{
	padding: 0;
}

.zweierpaddtop{
	padding: 100px 0 1.5% 0;
}


.zweiermrgbtm{
	margin-top: -125px!important;
	margin-bottom: 45px!important;
}

.zweierpaddrechts{
	padding: 0 5% 0 0;
	width: 50%;
}

.achtzigprozent{
	max-width: 85%;
	position: relative;
}




.zweierkurz{
	width: 40%!important;
}	

.zweierkurzrechts{
	width: 43%!important;
	float:right;
	margin-top: 60px;
}

.zweiermittel{
	width: 42%!important;
}		
.zweierlang{
	width: 50%!important;
}
		
.zweierlangstart{
	width: 65%!important;
}
.zweierpaddtop{
	padding-top: 60px;
}
.zweierlangzwei{
	width: 56%!important;
}

.zweierlangdrei{
	width: 60%!important;
}

.zlzpadd{
	padding-right: 40px;
}
.startboxen{
	margin-top: -180px;
	margin-bottom: 60px;
}


.fzlinks{
	float:left;
	width: 57%;
	padding: 1.5%;
	padding-top: 0px;
	display: inline-block;
	margin-bottom: 20px;
}
.fzrechts{
	float:left;
	width: 37%;
	padding: 1.5%;
	padding-top: 20px;
	display: inline-block;
	margin-bottom: 20px;
}


.zweier:last-child{
		margin-right: 0!important;
}

.willkommen{
	padding-bottom: 20px;
	padding-top: 60px;
	}
		
	.willunter{
	height: 45vH;
}


.urlaubswelt{
	height: 68vH;
	padding-top: 120px;

}

.kontaktformbg {
	height: 0;
}


.formactive {
    padding: 60px;
	width: 460px;
	max-width: 90%;
	height: auto;
}		


.kontaktformabsolute{
	position: absolute;
	width: 90%;
}
		
		
.hallo{
	margin: auto;
	margin-top: 490px;
	text-align: center;
	max-width: 620px;
	line-height: 150%;
		}
		
	
		
.blog{
	margin-top: 0;
	height: auto;
	padding-top: 0px;
}	

.logobox{
	float:left;
	display: inline-block;
	width: 15%;
}
		

 .logo{
    width: 140px;
    height: 45px;
    margin-top: 0;
  }

  .logo-text{
    transform: translateX(0);
    opacity: 1;
    transition:
      transform .35s cubic-bezier(.4,0,.2,1),
      opacity .25s ease;
  }

  /* Reduzierter Zustand NUR Desktop */
  .logo.is-icon-only .logo-text{
    transform: translateX(-12px);
    opacity: 0;
    pointer-events: none;
  }

  /* Hover: Text wieder rein */
  .logo:hover .logo-text{
    transform: translateX(0);
    opacity: 1;
    pointer-events: auto;
  }

  .header.headerfixed .logo-text{
    transition-delay: .05s;
  }

  .logo.is-icon-only .logo-text{
    transition-delay: 0s;
  }

.logo-icon{
  transform-box: fill-box;
  transform-origin: center;
  transition: transform .15s ease;
}

.logo:hover .logo-icon{
  animation: iconPulse 0.9s ease-in-out infinite;
}

@keyframes iconPulse{
  0%{
    transform: scale(1);
  }
  50%{
    transform: scale(1.12);
  }
  100%{
    transform: scale(1);
  }
}



	.headeralt .logo{
		background-image: url(https://gerlach.media/bilder/gerlach-logo-weiss.svg);
	}


	.logoakademie{
		background-image: url(https://gerlach.media/bilder/gerlach-logo-akademie.svg);
	}
	.headeralt .logoakademie{
		background-image: url(https://gerlach.media/bilder/gerlach-logo-akademie-weiss.svg);
	}

	.headerfixed .logoakademie{
		background-image: url(https://gerlach.media/bilder/gerlach-logo-akademie.svg);
	}
	
	.logoactive{
		width: 150px;	
		height: 120px;
		margin-top: -20px;
	}	
	.logomobile{
	display: none;
	}	


.logo span{
	margin-left: 0px;
	font-weight: 800;
}	
		
.open{
		overflow:auto;
		width: 100%!important;
		padding: 7.5% 5% 10% 5%;
}

.website{
	padding: 10px 0;
	margin-top: 15px;
}
		
.header{
	position: absolute;
	top: 40px;
	background-color: #fff;
	box-shadow: 0 0.1rem 0.4rem 0 rgba(0,0,0,.04), 0 0.2rem 4.4rem 0 rgba(0,0,0,.05);
	z-index: 999;
	padding: 4px 0 4px 0;
}

.noshadow{
	box-shadow: none;
}


.headeralt{
	background-color: transparent;
	box-shadow: none;
}

.headertopzero{
	top: 0px;
}

.headerin{
	padding: 4px 1% 2px 1%;
	width: 98%;
}

.topheader{
	display: block;
	background-color: #0c0c0c;
	position: fixed;
	z-index: 999;
    transition: all 0.1s ease;
	left: 50%;
	transform: translate(-50%);
	top: 0px;
	width: 100%;
	font-size: 90%;
	line-height: 1.4;
	height: 40px;
}

.headeralt{
	background-color: transparent;
}


.topheaderfixed{
	margin-top: -250px;
}

.headerfixed{
	box-shadow: 0 0.1rem 0.4rem 0 rgba(0,0,0,.04), 0 0.2rem 4.4rem 0 rgba(0,0,0,.05);
	background-color: rgba(255,255,255,1);
	top: 40px;
    transition: all 0.1s ease;
	position: fixed;
}

.headeralt .headerfixed{
	background-color: rgba(255,255,255,0.97);
}

.topheader .headerintop{
	padding: 10px 2% 10px 2%;
	width: 96%;
	max-width: 1490px;
	display: flex;
	flex-direction: row;
	justify-content: center;
	align-items: stretch;
	left: 50%;
	transform: translate(-50%);
}



.thbox{
    flex: 1;
	color: #fff;
	font-size: 85%;
	letter-spacing: 0.5px;
	justify-self: center;
	opacity: 0.9;
}



.topperlinks{
	display: inline-block;
	width: 33.3%;
	margin-right: -5px;
}
.toppermittig{
	display: inline-block;
	width: 33.3%;
	text-align: right;
	margin-right: -5px;
}

.topperrechts{
	display: inline-block;
	float: inline-end;
	width: 30%;
	margin-right: -5px;
}

.topperrechts div{
	display: inline-block;
	width: 45%;
}
.topperklein{
	display: block;
	font-size: 85%;
	letter-spacing: 0.3px;
	color: #999;
}


.innen{
display: block;
vertical-align: top;
padding: 30px 0 120px 0;
line-height: 1.6;			
max-width: 1490px;
margin: auto;	
}	

.bloginnen{
	padding: 20px 0 120px 0;
	}	

	.shopinnen{
		padding: 150px 0 120px 0;
		}	

		.shopinnenueber{
			padding: 70px 0 30px 0;
			}	
			
.bloginnentop{
	padding: 200px 0 75px 0;
	}

.innenpaddoben{
	padding: 150px 0 150px 0;
	}
	.innenpaddobenstart{
		padding: 200px 0 135px 0;
		}
		.seosprint .innenpaddobenstart{
			padding: 180px 0 180px 0;
			}
			.bigpadd{
				padding: 120px 0;
				}
				
				.bigpaddtop{
					padding: 200px 0 40px 0;
				}

		.extrapadd{
			padding-top: 350px;
		}
		.extramegapadd{
			padding-top: 220px;
		}

.ohnepadd{
	padding: 25px 0!important;
}
		

.minipadd{
	padding: 70px 0!important;
}

.links{
display: inline-block;
vertical-align: top;
	width: 45%;
	margin-right: 20%;
}
		
.rechts{
display: inline-block;
vertical-align: top;
}
		
		.schnellnavi{
			background-color: #f3f5f99d;
			color: #212121;
			margin-top: -440px;
			z-index: 99;
		}	
		
		.schnellnavi div{
			padding: 26px;
		}
		
		.schnellnavi img{
			width: 100%;
		}
		
		.minpad{
padding: 30px 75px;
		}

		
.bloginhalt{
width: 43%;
display: block;
vertical-align: top;
padding: 60px 10% 60px 10%;
margin: auto;
}	
		
.innenlangzwei{
width: 87%;
display: block;
padding: 60px 10% 60px 10%;
}
			
.vorher{
width: 17%;
display: inline-block;
vertical-align: top;
}

.innenlang{
width: 80%;
display: block;
padding: 30px 10% 60px 10%;
}
		
.grosserabstand{
	padding: 140px 3%;
}

		

.headtext{
	font-weight: 400;
	font-size: 38px;
	line-height: 46px;
	display: block;
}

.scroller {
    transition: all 0.8s ease 0s;
    position: absolute;
    left: 50%;
    margin-left: -30px;
    bottom: 40px;
    width: 60px;
    height: 60px;
    display: block;
    opacity: 0.47;
    border-radius: 50%;
    z-index: 9;
}

		.scroller:hover{
    transition: all 0.8s ease 0s;
    bottom: 36px;
		}
		
		

.linkbig {
    font-size: 18px!important;
    display: block;
    padding: 23px 56px!important;
}
		

.menuelinksloseactive .closermittel{
	opacity: 0.0!important;
}

.referenzbildbox{
		position: relative;
		transition: all 0.4s ease-in-out;
		float:none;
		display: inline-block!important;
		width: 25%!important;
		margin-bottom: -15px!important;
		overflow: hidden;
		margin-right: -5px!important;
		object-fit: cover;
}
	.referenzbildbox img{
		width: 100%;
		}
	
.jobbox {
    position: relative;
    transition: all 0.2s ease-in-out;
    background-color: #fff;
    padding: 0;
    margin-bottom: 10px;
    display: inline-block;
    width: 48%;
    margin-right: 1.7%;
    line-height: 160%;
    height: auto;
    min-height: 400px;
    overflow: hidden;
	box-shadow: 0px 1px 3px 0px rgba(0,0,0,0.2);
	vertical-align: top;
	margin-left: 0;
}
		
.kundenbox {
    position: relative;
    transition: all 0.2s ease-in-out;
    background-color: #fff;
    padding: 0;
    margin-bottom: 10px;
    display: inline-block;
    width: 19%;
    margin-right: 0.7%;
    line-height: 160%;
    height: auto;
    min-height: 400px;
    overflow: hidden;
	box-shadow: 0px 1px 3px 0px rgba(0,0,0,0.2);
	vertical-align: top;
	margin-left: 0;
}
		
.kundenbox .referenzbeschreibung{
	font-size: 80%;
}
		
		

.dropdownbox{
    background-size: 20px;
}
	

.bb {
    position: absolute;
    bottom: 0;
    left: 0;
    height: 8px;
    background-color: transparent;
    transition: all 1s ease 0s;
    width: 1%;
	z-index: 5;
}
		
		.karte{width:100%;height:620px;}


		
.referenzbildbox:hover .bb{
		background-color: #636363!important;
		width: 100%!important;
}	

a.telefon, a.telefon:visited{
	position: absolute;
	bottom: auto;
	top: 0;
	z-index: 99;
	transition: all 0.2s ease-in-out;
	width: 100%;
	padding: 40px 0;
	background-color: transparent;
	text-align: center;
	color: #fff;
	letter-spacing: 1.5px;
	font-size: 130%;
opacity: 0.6;
}
		
a.telefon:hover, a.telefon:active{
	color: #fff;	
	background-color: transparent;
}


.telefonicon{
width: 24px;
height: 24px;
line-height: 24px;
margin-right: 8px;
margin-bottom: -4px;
}	
	

		
.wirbox {
    position: relative;
    transition: all 0.2s ease-in-out;
    padding: 45px 2%;
    margin-bottom: 0px;
    display: inline-block;
    width: 29.33%;
    line-height: 150%;
    overflow: hidden;
	margin-right: -4px;
	vertical-align: top;
	min-height: 200px;
}	
		

a.servicelink, a.servicelink:visited {
		transition: all 0.4s ease 0s;
		display:inline-block;
		text-decoration: none;
		padding: 6px 18px;
		text-align:center;
		background-color: #fff;
		border-radius: 2px;
		margin: 4px;
		opacity: 0.4;
}

a.servicelink:hover, a.servicelink:active {
		z-index: 5;
		text-decoration: none;
		opacity: 0.9;
		color: #636363;
		margin: -15px 4px;
		padding: 25px 18px;
	box-shadow: 0px 3px 63px 0px rgba(0,0,0,0.5);
}


		
.letterhinweisactive{
height: 300px;
}
.play{		
    width: 84px;	
    height: 84px;	
		}
		
.referenzbildbox .play, .referenzbildbox .lens{
	position: absolute;
		transition: all 0.4s ease 0s;
		opacity: 0.4;	
	top: 50%;
		width: 72px;
		height: 72px;
		}
		

		.zeigemehr{
			display:none;
		}
		

.openleistung{
height: 320px;
}

		
	.absolutelink{
	bottom: 120px;
}	
		
		.slidimage{
	width: 50%;
	display: inline-block;
	margin: auto;
	margin-right: -4px;
}
	
.absolutelinkzurueck{
	left: 25px;
	bottom: 40px;
	background-color: #636363!important;
	padding: 8px 20px!important;
	padding-left: 46px!important;
	background: url(https://gerlach.media/bilder/arrow-left.svg) no-repeat 5% center;
	background-size: 10%;
}

.leisticon{
	width: 100px!important;
	height: 100px!important;
	margin: auto;
}
	
.leisticon img{
	width: 75%!important;
	margin: auto;
}			


.fahrzeugbild{
	width: 500px;
	margin-top: 100px;
}

.mitboxanf{
	padding: 35px;
	max-width: 500px;
}

.seitenbildrechts{
	float:right!important;
	margin-left: 35px;
	transition: all 0.4s ease-in-out;
	max-width: 45%;
	height: auto;
	width: auto;
}		

.systembild{
	display: block;
	float:right;
	width: auto;
	max-width: 55%;
	margin-top: 130px;
	height: auto;
}
	
.portraitbild{
	float:right!important;
	margin-left: 35px;}
		

	.teamboxbild{
		margin-right: -4px;
		transition: all 0.4s ease-in-out;
		width: 55%;
		height: auto;
		display: inline-block;
	}
	
#cookieChoiceInfo{
	z-index: 4!important;
	position: fixed!important;
	left: 0!important;
	background-color:#f9f9f9!important;
	padding:10px 2.5%!important;
	top:auto!important;
	bottom: 0!important;
	font-size:90%;
	box-shadow:1px 2px 13px rgba(0,0,0,0.4);
	width:95%!important;

	line-height: 150%;
	border-radius: 0;
}
		
h1{
	font-weight: 800;
	font-size: 46px;
	line-height: 1.1;
	margin: 25px 0 15px 0;
	color: #212121;
	letter-spacing: -0.2px;
}

.h1big{
	font-weight: 800;
	font-size: 62px;
	letter-spacing: -0.4px;
	line-height: 1.2;
	color: #212121;
	margin-bottom: 15px;
}	
	
.seitentitel{
	display: block;
	font-weight: 400;
    font-size: 36px;
	line-height: 40px;
	margin-bottom: 0px;
	color: #fff;
	letter-spacing: -0.5px;
		}

h2{
	font-size: 34px;
	letter-spacing: -0.2px;
	line-height: 42px;
	color: #212121;
	margin-bottom: 15px;
	font-weight: ;
}

.h2new{
	font-size: 46px;
	letter-spacing: -0.4px;
	line-height: 1.2;
	color: #212121;
	margin-bottom: 15px;
}
		
h3{
	font-weight: 500;
	font-size: 23px;
	line-height: 29px;
	color: #212121;
	margin-bottom: 10px;
	letter-spacing: -0.3px;
}	
		
.boxh3{
	font-weight: 800;
	font-size: 87px;
	line-height: 1.1;
	color: #111;
}	
		
.boxh3zwo{
	font-weight: 800;
	font-size: 26px;
	line-height: 1.1;
	color: #111;
}	


.titlebox{
	display: block;
	font-weight: 800;
		font-size: 24px;
	line-height: 30px;
}



h4, span.titeltext{
	font-weight: 500;
		font-size: 17px;
	line-height: 1.3;
	color: #212121;
	display: block;
	letter-spacing: -0.2px;
}


.roundbox h4{
	font-weight: 600;
		font-size: 18px;
}

	
.h2small{
	font-weight: 400;
	font-size: 22px;
	line-height: 32px;
	color: #212121;
	margin-bottom: 5px;
}	

	
.dreier{
	line-height: 150%;
	display: inline-block;
	width: 33.1%;
	vertical-align: top;
	padding: 20px 1.5%;
	margin-right: -5px;
}




.dreierstart{
	display: inline-block;
	width: 29%;
	vertical-align: top;
	margin-right: 5%;
	margin-bottom: 0;
}

.dreierboxen div:last-child {
	margin-right: 0;
}

.dreiermrgtop{
	margin-top: -25px;
}


.subnavin .dreier, .subnavin .zweier{
	display: inline-block;
}


.subnavin .zweier{
	width: 48%;
	padding-left: 0;
	padding-right: 0;
}

.subnavin .dreier{
	width: 31.3%;
	padding-left: 0;
	padding-right: 0;
	margin-right: -5px;
}


.zweierabsoluterechts{
	position: absolute;
	right: 0;
	width: 45%;
	z-index: 2;
	top: 220px;
	margin-top: 0;
}

.zweierabsoluterechtszwei{
	top: 200px;
}


.vierer{
	display: inline-block;
	width: 25%;
	vertical-align: top;
	padding: 20px 1.5%;
	margin-right: -5px;
	line-height: 1.4;
}			

.vierer p{
	line-height: 1.4;
}		

.viererkurz{
	width: 15%;

}
.viererlang{
	width: 35%;
}

.zehner{
	position: relative;
	display: inline-block;
	width: 9%;
	vertical-align: top;
	padding: 20px 1.5%;
	border-radius: 4px;
}

		
.zehner:hover{
	transition: all 0.4s ease-in-out;
	margin-top: -3px;	
	margin-bottom: 3px;
}
		
.fuenfer{
	display: inline-block;
	width: 18.5%;
	vertical-align: top;
	padding: 20px 1%;
	height: auto;
	min-height: 190px;
	margin-right: 1%;
}	

.foot1{
	vertical-align: top;
	display: inline-block;
	width: 20%;
}
.foot2{
	vertical-align: top;
	display: inline-block;
	width: 18%;
}
.foot3{
	vertical-align: top;
	display: inline-block;
	width: 20%;
}
.foot4{
	vertical-align: top;
	display: inline-block;
	width: 20%;
}
.foot5{
	vertical-align: top;
	display: inline-block;
	width: 20%;
}


#footer .fuenfer{
	width: 17%;
}

#footer .fuenferlast{
	width: 24%;
}

.newsliste{
transition: 0.5s ease-in-out;
color: #333;
text-decoration: none; 
display:block;
padding: 20px 0 0 0;
font-weight: 300;
margin: 10px;
}

		
		
.newsbox{
		width: 31.5%;
		display:inline-block;
		margin-right: 2%;
		min-height: 516px;
}
	
.newsbereich .newsbox:first-child img{
		margin-bottom: -220px;
}	
.newsbereich .newsbox:first-child h3, .newsbereich .newsbox:first-child .newstext{
		color: #fff;
}	
.newsbereich .newsbox:first-child{
		width: 65.5%;
		display:inline-block;
		margin-right: 2%;
		min-height: 516px;
}	
	
.newsbereich .newsbox:nth-child(3), .newsbereich .newsbox:nth-child(9){
		margin-right: 0;
}	

.modulescroll{
    position: relative;
	transition: all 0.4s ease-in-out;
    width: 100%;
    overflow-x: auto;
    white-space: normal;
    -webkit-overflow-scrolling: touch;
	padding: 0 0;
}

.modulescroll::-webkit-scrollbar {
    display: none;
}

.startboxmini{
		transition: all 0.4s ease 0s;
		position: relative;
		width: 30.9%;
		display:inline-block;
		padding: 25px 1%;
		vertical-align:text-top;
		margin: 0;
		background: rgba(255,255,255,0.0);
		margin-bottom: 5px;
		margin-right: 0;
		z-index: 1;
}

	
.startboxmini p {
		transition: all 0.4s ease 0s;
	padding: 0;
		height: 0;
	overflow: hidden;
}
		
	


.startboxmini:focus{
		padding: 45px 1%!important;
		margin-top: -12px!important;
	z-index: 9;
	outline: none;
	margin-bottom: 10px!important;
		}
	
.startblockbox{
	padding: 0!important;
	font-size: 100%;
	margin-right: 1%;
	background: #fff;
    box-shadow: 0 2px 3.25rem 0 rgba(0,0,0,.08);
	min-height: 540px;
}
	
.kleinbox{
	min-height: 240px;
}

.paddingbox{
	padding: 50px 0;
}

.minipaddbox{
	padding: 20px;
}


.startblockbox div{
	padding: 25px 40px;
}

.startblockbox:hover{		
	background: #fff;
    box-shadow: 0 2px 3.25rem 0 rgba(0,0,0,.08);
}

			
.startblockbox img {
	width: 100%!important;
		transition: all 0.4s ease 0s;
		margin-bottom: 20px;
		opacity: 1;
}		
.startblockbox:hover img {
		transition: all 0.4s ease 0s;
		opacity: 0.58;
}	

		
.startblockbox:focus{
	padding: 25px 0.5%!important;
	margin-top: 0!important;
box-shadow: 0!important;
z-index: 9;
	background: transparent!important;
outline: none;
margin-bottom: 0!important;
}
	
.startboxmini img {
	width: 90%;
		transition: all 0.4s ease 0s;
		opacity: 0.78;
}		

.startboxmini:focus img{
	opacity: 1;
	}	
	.startboxmini:hover img{
			opacity: 1;
			}		
		
.startboxmini:focus p {
	padding: 0;
	overflow: hidden;
}
		

		
.seopaketbox{
	width: 31.5%;
	display: inline-block;
	float:left;
	margin-right: 1.5%;
}

.seoboxcontainer {
    display: flex;
    flex-wrap: wrap;
    gap: 2%;
    justify-content: space-between;
}

.seoboxcontainer .seopaketbox {
    margin: 0;
	padding: 0;
    flex: 0 1 32%;
    box-sizing: border-box;
    margin-bottom: 30px;
}


.seopaketbox.h50 {
  flex: 0 0 calc(50% - 15px); /* bei gap: 30px */
}



.seopaketbox h3{

}

.seopaketbox h3::after{
	transition: all 0.2s ease-in-out;
	content: '';
	position: absolute;
	right: 0;
	top: 3px;
	height: 20px;
	width: 20px;
	background-image:url('https://gerlach.media/bilder/arrow-right.svg');
	background-repeat: no-repeat;
	background-size: 20px;
}

.seobg{
	background-image: url('https://gerlach.media/bilder/koehlbrandbruecke-hamburg.jpg');
    background-size: cover;
	background-position: 50%;
    background-repeat: no-repeat;
	background-color: #111;
	height: auto;
	min-height: 35vH;
}

.seopaketbox:hover h3::after{
	margin-right: -12px;
}
		
		
.paketboxlink{
	text-decoration: none!important;
}
		
.galeriebild{
	display: inline-block;
	width: 25.06%;
	height: 280px;
	vertical-align: middle;
	padding: 0;
	position: relative;
	font-size: 75%;
	line-height: 140%;
	overflow: hidden;
	transition: all 0.2s ease-in-out;
	margin-right: -5px;
	margin-bottom: 0;
	 margin-left: 0;
}	
		
.breitzoom{
	background-position: 10% 30%;
}
		
.zoom{
	width: 335px;
	height: 503px;
}

 .maxhoch{
	 height: 220px;
}		
 .studiobox{
	width: 33%;
	 height: 210px;
	 margin-left: 0.33%;
}
		
	

.rechts{
	display: inline-block;
	float:right;
	margin-left: 35px;
}				
		
		
	
.websitein{
			width: 100%;
			padding-top: 0;
			max-width: 100%;
			margin: auto;
			position: relative;
		}
		
		.kleinerabstand{
			padding: 20px 2.5%;
		}		
		
		
		
dl.accordion dt {
	font-size: 20px;
	padding: 15px 2.5% 15px 2.5%;
	cursor: poRoboto;
	font-weight: 400;
	transition: all 0.4s ease 0s;
}


dl.accordion dd p {
	width: 95%;
	padding: 45px 2.5% 45px 2.5%;
	border-bottom: 1px solid #eee;
}
		
dl.accordion dt:focus {
	padding: 30px 2.5% 30px 2.5%;
}
	


.bigline{
	font-size: 38px;
	line-height: 42px;
}

	.leistungsbox{
		width: 28%;
		padding: 40px 1.5%;
		min-height: 320px;
	margin-right: 2%;
}
		
.audiobox {
	width: 100%;
	max-width: 680px;
	position: relative;
	height: 180px;
	box-shadow: 1px 1px 2px rgba(0,0,0,0.2);
	background-color: #fff;
}
		
.abstandtext{
	display: inline-block;
	margin: 0 35px;
}
		
.audiobox img{
	float:left!important;
	width: 180px!important;
	max-width: 180px;
}



.audiobox audio {
	position: absolute;
	width: 500px;
	bottom: 0;
	left: 180px;
}

.mp3title{
	position: absolute;
	display: inline-block;
	background-color: #fff;
	padding: 12px 30px;
	font-size: 14px;
	line-height: 20px;
	text-align: left;
	left: 180px;
}
		
.passbild{
	margin: auto;
	display: block;
	width: 11%;
	 height: 180px;
	vertical-align: top;
	font-size: 90%;
	 background-image: url(https://gerlach.media/bilder/portrait-stefan-gerlach.jpg);
	 background-position: 50% 5%;
	 background-size: cover;
	 background-repeat: no-repeat;
	 margin-top: -25px;
	box-shadow: 1px 2px 26px rgba(0,0,0,0.2);
}

		

.fotografbild{
	display: inline-block;
	float:right;
	width: 20%;
	 margin-left: 55px;
	 height: 260px;
	vertical-align: top;
	font-size: 90%;
	 background-image: url(https://gerlach.media/bilder/galerie/portrait-stefan-gerlach.jpg);
	 background-position: 50% 5%;
	 background-size: cover;
	 background-repeat: no-repeat;
	 margin-bottom: 15px;
}
		
.map{
	width: 100%;
	height: 720px;
}

	
.absatzgross{
	margin-top: 25px;
	margin-bottom: 45px;
}
		


	
.mobileinlinehide{
	display:inline-block;
}
	
		
.headerfeld{
	display:inline-block;
	color: #fff;
	opacity: 0.97;
	margin-top: -2px;
	vertical-align: middle;
	margin-left: 20px;
	position: relative;
	bottom: auto;	
	left: auto;
	padding: 0 0; 
    background-color: transparent;
	margin-bottom: 0;
}
		

.headerfeldshow{
	margin-bottom: 0!important;
}
	

.anker {
		padding: 40px 0;
}
		
.filterlink {
	width: 20%;
	padding: 10px 1.5%;
}
		
.filterlinkneu {
	width: 20%;
	padding: 10px 1.5%;
}
		
.kontakticon{
	transition: all 0.4s ease 0s;
	display: inline-block;
	width: 38px;
	height: 38px;
	background-image:url('https://gerlach.media/bilder/whatsapp.svg');
	background-repeat: no-repeat;
	background-position: 50%;
	background-size: 50%;
	border-radius: 50%;
	margin-top: -10px;
	margin-right: 12px;
	overflow: visible;
	opacity: 0.96;
	background-color: rgba(67,212121,123,0.30);
		}
		
.headerfeld .kontakticon{
	background-color: rgba(166,194,216,0.30);
}
		
.kontakticon:hover{
	opacity: 0.97;
	background-color: rgba(255,255,255,0.1);
}
		
		
.mail{
	background-image:url('https://gerlach.media/bilder/mail.svg')!important;
}

.tel{
	background-image:url('https://gerlach.media/bilder/tel.svg')!important;
}
.minitermin{
		float:left;
		width: 27.3%;
	margin-right: 2%;
	padding-bottom: 55px;
}

.partnerlogo{
background-position: 50%;
background-size: 80%;
width: 20%;
height: 80px;
display: inline-block;
margin-right: 8px;
}
		
.seofox{
width: 14%;
background-size: 50%;
		}	
	
		

#back-to-top, .touch-device #back-to-top:hover {
	background: url(https://gerlach.media/bilder/up-scroll-arrow.svg) no-repeat center center;
	background-size: 40%;
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.3s ease;
    height: 56px;
    width: 56px;
    position: fixed;
    right: 15px;
    bottom: 90px;
    top: auto;
    text-indent: -9999px;
    transition: all 0.4s ease;
    z-index: 99;
    border-radius: 50%;
    box-shadow: 1px 2px 23px rgba(0,0,0,0.1);
	background-color: #ffffffbf;
}

#back-to-top.visible {
  opacity: 1;
  pointer-events: auto;
}

		

.dreiminhi{
	min-height: 560px;
}

.minheistart{
	min-height: 100% !important;
    height: 100% !important;
}
	
		
.minhei{
	min-height: 100% !important;
    height: 100% !important;
	margin-left: 15px;
}
		
.minheight{
	height: 100% !important;
    height: 100% !important;
	margin-bottom: 0!important;
	overflow: hidden;
}


.minhoehe{
	min-height: 600px;
}

.linksborder{
	border-left: 1px solid #eee;
}

.navboxpadd{
	padding: 50px;
}



.buttonlinkdrei{
	color: #fff;
	background-color: transparent;
	border: 1px solid #fff;
}

.buttonlinkvier{
	position: absolute!important;
	left: 50%;
	top: 0;
	transform: translate(-50%);
	margin-top: -55px;
}


.titelbig{
	font-size: 260%;
	margin-bottom: 40px;
	letter-spacing: -0.4px;
}
.titelbigzwei{
	margin-top: 10px;
	font-size: 260%;
	margin-bottom: 40px;
}
.titelbigdrei{
	margin-top: 110px;
	font-size: 260%;
	margin-bottom: 10px;
}


.grauborder{
	border: 1px solid #ddd;
	border-radius: 8px;
}



.subnavopen{
	opacity: 1;
	transition: all 0.1s ease 0s;
	height: 100vH;
	visibility: visible;
}

.subnaveins{
	display: inline-block;
	width: 30%;
	vertical-align: top;
	padding: 0;
}

.subnaveins .logobox{
	position: relative;
}

.subnaveins .logo{
	display: block;
	margin-bottom: 25px;
}

.subnavzwei{
	display: inline-block;
	width: 65%;
	vertical-align: top;
	padding: 0;
}

.subnaveins .menuezwei{
	margin-left: -15px!important;
}

.subnavback {
	height: 0;
	overflow: hidden;
	margin-bottom: 0;
}

.subnaveinshide{
	height: auto;
	overflow: visible;
	visibility: visible;
}

.subnavback::before, .subnavbackshow::before{
	visibility: hidden;
}

.subheadliner{
	margin-bottom: 60px;
}

.minh500{
	min-height: 500px;
}



a.buttonlinkblau, a.buttonlinkblau:visited {
	padding: 12px 22px 12px 22px;
	font-weight: 400;
	transition: all 0.8s ease;
	display: inline-block;
   background: linear-gradient(90deg, #0c0c0c 0%, #0c0c0c 100%);
    color: #fff;
	border-radius: 4px!important;
	letter-spacing: 0.4px;
	text-align: center;
	position: relative;
	overflow: hidden;
}

a.buttonlinkblau:hover, a.buttonlinkblau:active {
		text-decoration: none;
		color: #fff;
		scale: 1.1;
	}

.navblock .buttonlinkblau{
	font-size: 90%;
	margin-left: 30px;
	margin-right: -12px;
	padding: 9px 14px 9px 14px;
   background: #0c0c0c;
    color: #fff;
	border-radius: 999px!important;
}

.navblock .buttonlinkpow{
   background: #F5F8FB;
	margin-top: -2px;
	font-size: 90%;
	margin-left: 30px;
	padding: 9px 14px 9px 14px;
    color: #0c0c0c!important;
}

@keyframes shine {
  0% {
    left: -75%;
  }
  50% {
    left: 125%;
  }
  100% {
    left: 125%;
  }
}


.zweierhundert{
	position: relative;
	min-height: 480px;
}
.zertisunten{
	position: absolute;
	bottom: 0;
}

.zertistop{
	top: 17px;
	position: absolute;
	left: 240px;
}

.zertistop img{
	height: 26px!important;
	display: inline-block;
	margin-right: 6px;
}


.dreierlang{
	width: 45%!important;
	margin-right: 3%!important;
}

.dreierkurz{
	width: 25%!important;
}


.navwrap {
  margin: 0 auto;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0;
}

.navblock {
  flex-shrink: 0;
}

.nav-left {
  width: auto;
}

.nav-center {
  flex: 1;
  text-align: center;
}

.nav nav {
  display: inline-block;
}

.nav-right a {
  white-space: nowrap;
}


.nav-center:after {
  content: "";
  position: absolute;
  right: 0;
  top: 0;
  width: 60px;
  height: 100%;
  pointer-events: none;
  background: linear-gradient(to left, rgba(255,255,255,1), rgba(255,255,255,0));
}



a.buttonlinkweiss, a.buttonlinkweiss:visited, a.buttonlinkweiss:hover, a.buttonlinkweiss:active {
    color: #111!important;
   background: #fff!important;
}

}
	































































@media screen and (min-width: 1320px) {
		.mobilehide{
		display: inline-block;
		height: auto;
		overflow: visible;
	}		
}








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

	.arowwabsolute{
		display: block;
		width: auto;
		position: absolute;
		z-index: 0;
		scale: 0.43;
		top: -440px;
		right: -380px;
		opacity: 0.3;
		}
		.ueberbg2025 {
			background-size: auto 100%;
			background-position: 110% 12%;
			background-repeat: no-repeat;
			padding-top: 0;
		}

	}



	
	@media screen and (max-width: 300px) {
		.casesnippmobile{
			visibility: hidden;
		}
		}