@charset "UTF-8";






/* lato-300 - latin */
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 300;
  src: local(''),
       url('../fonts/lato-v23-latin-300.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('../fonts/lato-v23-latin-300.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* lato-regular - latin */
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 400;
  src: local(''),
       url('../fonts/lato-v23-latin-regular.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('../fonts/lato-v23-latin-regular.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}
/* lato-700 - latin */
@font-face {
  font-family: 'Lato';
  font-style: normal;
  font-weight: 700;
  src: local(''),
       url('../fonts/lato-v23-latin-700.woff2') format('woff2'), /* Chrome 26+, Opera 23+, Firefox 39+ */
       url('../fonts/lato-v23-latin-700.woff') format('woff'); /* Chrome 6+, Firefox 3.6+, IE 9+, Safari 5.1+ */
}



/* GLOBAL */

:root {
  --midgrey: #7b7b7b;
  --darkgrey: #5b5b5b;
}


/* LAYOUT */


html,
body {height: 100%; width: 100%; /* background-image: url("../images/eh_foto_kachel.jpg"); */}
	
.main_container {
	min-height: 100vh;
	overflow: hidden;
	display: block;
	position: relative; /* background-image: url("../images/eh_foto_kachel.jpg"); */
	}

.content {max-width: 1200px; margin: 0 auto; padding-bottom: 60px; }

.transparency {background-color: rgba(204, 204, 204, 0.9)}

footer {height: 90px;
	width: 100%; 
	background: rgba(72, 72, 72, 1);
	z-index: 2;}
	
	
.fixed {position: fixed;
	bottom: 0;
	left: 0;
}



body {
	-webkit-text-size-adjust: none;
	font-family: 'lato', sans-serif;
	font-weight: 300;
	font-style: normal;
	font-size: 1.2em;
	line-height: 2rem;
	color: var(--midgrey);	
	background-color: #cbcacb;}
	
.logo {width: 150px;
	padding-top: 60px;
	margin: 0 auto;}
	
.logo_ohne_text {width: 100px;
	padding-top: 80px;
	margin: 0 auto;}	
	
.startscreen {padding-top: 18vh; width: 40%; margin: 0 auto;}

.logo_foto {padding-top: 0; width: 850px; margin: 0 auto; box-shadow: 1px 1px 10px #787878;}



/* TEXT */

a {text-decoration: none; color: var(--midgrey)}

footer p {padding-top: 30px; margin: 0 auto;}

.text-center {text-align: center;}
.text-copyright {text-align: center; display: block}
.text-copyright a {transition: 0.5s;}
.text-copyright a:hover, .text-copyright a:focus {color: #f1f1f1;}

.text-copyright-mobile {text-align: center; display: none; color: var(--midgrey)}
.active {font-weight: 300; color: #f1f1f1;}

.text_container {max-width: 800px; height: auto; margin: 0 auto;}

.link_bold {color: #d8d8d8}
.overlay-content .link_bold {color: #d8d8d8}

.copy {padding: 50px 0 50px;}
.legal {padding: 10px 0 30px;}

.text_container .legal a {background-color: #c3c3c3;}
.text_container .legal a:hover {background-color: #afafaf; transition: 0.5s;}

.text_container .copy a {background-color: #c3c3c3;}
.text_container .copy a:hover {background-color: #afafaf; transition: 0.5s;}

.spacer_top {padding-top: 115px;}
.spacer_bottom {padding-bottom: 50px;}

h1 {font-size: 2.1rem;
	color: var(--midgrey);
	font-weight: 700;
	line-height: 2.2rem;
	margin: 0;}
	
h2 {font-size: 1.4rem;
	color: var(--midgrey);
	font-weight: 700;
	line-height: 1.8rem;
	margin: 0;}

h1.spacer_top.datenschutz_mob {display: none}

.centered {text-align: center;}

/* BILD */

img {width: 100%; height: auto;}

.image_1200 {position: relative; max-width: 1200px; height: auto; margin: 0 auto;}	
.image_800 {position: relative; max-width: 800px; height: auto; margin: 0 auto;}
.image_100 {position: relative; width: 80px; height: auto; left: 0px; padding-bottom: 10px;}		



/* LOGO AT TOP */

a.logo-top {display: none}

.logo-top {
  display: inline-block;
  height: 50px;
  width: 50px;
  position: fixed;
  top: 15px;
  left: 50%;
  margin: 0 0 0 -25px;
  /* box-shadow: 0 0 10px rgba(0, 0, 0, 0.05); */
  /* image replacement properties */
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  background: url(../images/logo_ohne_text.svg) no-repeat center 50%;
  visibility: hidden;
  opacity: 0;
  -webkit-transition: opacity .3s 0s, visibility 0s .3s;
  -moz-transition: opacity .3s 0s, visibility 0s .3s;
  transition: opacity .3s 0s, visibility 0s .3s;
  z-index: 10;
}
.logo-top.logo-is-visible, .logo-top.logo-fade-out, .no-touch .logo-top:hover {
  -webkit-transition: opacity .3s 0s, visibility 0s 0s;
  -moz-transition: opacity .3s 0s, visibility 0s 0s;
  transition: opacity .3s 0s, visibility 0s 0s;
}
.logo-top.logo-is-visible {
  /* the button becomes visible */
  	visibility: visible;
	opacity: 0.8;}
	
.logo-top.logo-fade-out {
  /* if the user keeps scrolling down, the button is out of focus and becomes less visible */
  opacity: 1;}
  
.no-touch .logo-top:hover {
  opacity: 1;}


/* LOGO AT TOP LEGAL / IMPRESSUM DATENSCHUTZ*/

a.logo-top-legal {display: none}

.logo-top-legal {
  display: inline-block;
  height: 50px;
  width: 50px;
  position: fixed;
  top: 15px;
  left: 50%;
  margin: 0 0 0 -25px;
  /* box-shadow: 0 0 10px rgba(0, 0, 0, 0.05); */
  /* image replacement properties */
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  background: url(../images/logo_ohne_text.svg) no-repeat center 50%;
  visibility: hidden;
  opacity: 0;
  -webkit-transition: opacity .3s 0s, visibility 0s .3s;
  -moz-transition: opacity .3s 0s, visibility 0s .3s;
  transition: opacity .3s 0s, visibility 0s .3s;
  z-index: 10;
}
.logo-top-legal.logo-is-visible, .logo-top-legal.logo-fade-out, .no-touch .logo-top-legal:hover {
  -webkit-transition: opacity .3s 0s, visibility 0s 0s;
  -moz-transition: opacity .3s 0s, visibility 0s 0s;
  transition: opacity .3s 0s, visibility 0s 0s;
}
.logo-top-legal.logo-is-visible {
  /* the button becomes visible */
  	visibility: visible;
	opacity: 0.8;}
	
.logo-top-legal.logo-fade-out {
  /* if the user keeps scrolling down, the button is out of focus and becomes less visible */
  opacity: 1;}
  
.no-touch .logo-top:hover {
  opacity: 1;}


  


/* BACK TO TOP */

.cd-top {
  display: inline-block;
  height: 40px;
  width: 40px;
  position: fixed;
  bottom: 50px;
  right: 40px;
  /* box-shadow: 0 0 10px rgba(0, 0, 0, 0.05); */
  /* image replacement properties */
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
  background: rgba(84, 84, 84, 0.8) url(../images/arrow_up.svg) no-repeat center 50%;
  visibility: hidden;
  opacity: 0;
  -webkit-transition: opacity .3s 0s, visibility 0s .3s;
  -moz-transition: opacity .3s 0s, visibility 0s .3s;
  transition: opacity .3s 0s, visibility 0s .3s;
  z-index: 4;
}
.cd-top.cd-is-visible, .cd-top.cd-fade-out, .no-touch .cd-top:hover {
  -webkit-transition: opacity .3s 0s, visibility 0s 0s;
  -moz-transition: opacity .3s 0s, visibility 0s 0s;
  transition: opacity .3s 0s, visibility 0s 0s;
}
.cd-top.cd-is-visible {
  /* the button becomes visible */
  	visibility: visible;
	opacity: 0.8;}
	
.cd-top.cd-fade-out {
  /* if the user keeps scrolling down, the button is out of focus and becomes less visible */
  opacity: 1;}
  
.no-touch .cd-top:hover {
  background-color: #535353;
  opacity: 1;}