@charset "UTF-8";


@media screen and (max-width: 960px) {
  .hamburger_singlepage {display: none;}
  .hamburger_container {display: block}
  .overlay .closebtn_dark {position: absolute; right: 22px; top: 29px;   width: 25px;  height: 25px;}
  .closebutton {display: none;}
  .closebutton_mob {display: block;}
  .overlay {/* height: 0; width: 100%; */ overflow-y: hidden; z-index: 5; background-color: #ececec}
  .overlay-content {display: none}
  .overlay-content-mobile {display: block}
  .startscreen {padding: 20vh 0 60px; width: 50%; margin: 0 auto;}
  a.logo-top {display: block;}
  a.logo-top-legal {display: block;}
  .logo_ohne_text {width: 100px;
	padding-top: 120px;
	margin: 0 auto;}
	.logo_foto {padding-top: 80px; width: 100%;}
}

@media screen and (max-width: 840px) {
.text_container {padding: 0 25px;}
.image_800 {padding: 0 25px;}
.image_1200 {padding: 0 25px;}
.startscreen {padding: 20vh 0 60px; width: 55%; margin: 0 auto;}
}

@media screen and (max-width: 770px) {
  body {color: var(--darkgrey);
    /* font-size: 1.2em;
    line-height: 2rem */}
  h1 {color: var(--darkgrey);
    /* font-size: 2.0rem;
    font-weight: 500;
    line-height: 2.0rem; */}
  h2 {color: var(--darkgrey);
    /* font-size: 1.3rem;
    font-weight: 500;
    line-height: 1.6rem; */} 
    a {color: var(--darkgrey)}
    footer a, footer p {color: var(--midgrey)}
  }

@media screen and (max-width: 700px) {
.startscreen {padding: 20vh 0 60px; width: 60%; margin: 0 auto;}
}

@media screen and (max-width: 600px) {
.break_mob {display: block}
.startscreen {padding: 20vh 0 60px; width: 65%; margin: 0 auto;}
}

@media screen and (max-width: 500px) {
.hamburger_container {height: 60px;}
.hamburger_singlepage_mob {top: 20px;}
.overlay .closebtn_dark {top: 19px; right: 22px;}
.cd-top {right: 15px;}
.overlay a {font-size: 1.8rem}
.spacer_top {padding-top: 100px;}
.copy {padding: 25px 0 25px;}
.text-copyright {color: var(--midgrey)}
.startscreen {padding: 20vh 0 60px; width: 70%; margin: 0 auto;}
.text-copyright {display: none}
.text-copyright-mobile {display: block}
footer p {padding-top: 15px;}
.logo-top {height: 40px;
  width: 40px;
  position: fixed;
  top: 10px;
  left: 50%;
  margin: 0 0 0 -20px;}
.logo-top-legal {height: 40px;
  width: 40px;
  position: fixed;
  top: 10px;
   left: 50%;
  margin: 0 0 0 -20px;}
.logo_ohne_text {width: 100px;
padding-top: 100px;}
.logo_foto {padding-top: 60px; width: 100%;}
}

@media screen and (max-width: 400px) {
h1.spacer_top.datenschutz {display: none}
h1.spacer_top.datenschutz_mob {display: block}	
}