/* styles.css */
/* work-sans-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: 'Work Sans';
  font-style: normal;
  font-weight: 400;
  src: url('../fonts/work-sans-v19-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* work-sans-300 - 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: 'Work Sans';
  font-style: normal;
  font-weight: 300;
  src: url('../fonts/work-sans-v19-latin-300.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}

body {
    background-color: #003C33;
    color: #D9D15F;
	text-align: center;
	position: relative;
	font-family: 'Work Sans';
}

.strauss {
	display: flex;
	width: 100%;
	margin: 0px auto;
}

/* WRAPPER statt .logo absolut positionieren */
.logo-wrapper {
  position: absolute;
  top: 300px;
  left: 50%;
  transform: translateX(-50%);   /* mittig über der Seite */
  width: 422px;                  /* frühere Logo-Breite */
  z-index: 30;                   /* über dem Strauss-Block */
  text-align: center;
}

/* Logo im Wrapper normal fließen lassen */
.logo-wrapper .logo {
  position: static;   /* überschreibt deine alte absolute Position */
  width: 100%;
  height: auto;
  margin: 0;
  display: block;
}

/* Blink-Overlay exakt mittig auf dem Logo */
.logo-wrapper .blink-overlay {
  position: absolute;
  top: 70%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 1.4rem;
  font-weight: bold;
  color: #FF0000;
  text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.8);
  pointer-events: none;          /* Klick geht aufs Logo/den Link */
  animation: blink 1.2s infinite;
  white-space: nowrap;
}

@keyframes blink {
  0%, 49% { opacity: 1; }
  50%,100% { opacity: 0; }
}

/* Mobile Anpassung – statt .logo hier den Wrapper versetzen */
@media screen and (max-width: 39.9375em) {
  .logo-wrapper {
    top: 217px;
    width: 300px;   /* ggf. anpassen */
  }
}


@keyframes blink {
  0%, 49% { opacity: 1; }
  50%, 100% { opacity: 0; }
}



p, a, li {
	color: #D9D15F!important;
	font-family: 'Work Sans';
	font-weight: 300;
}
p.list {
	font-size: 18px;
	letter-spacing: 2.52px;
	margin-top: 47px;
}
a.email {
	font-size: 24px;
	text-decoration: underline;
	display: block;
	margin-top: 20px;
	letter-spacing: 3.36px;
	color: #D9D15F!important;
}
a.nsl {
	font-size: 24px;
	text-decoration: underline;
	display: block;
	margin-bottom: 50px;
	letter-spacing: 3.36px;
	color: #D9D15F!important;
}
p.address {
	font-size: 24px;
	letter-spacing: 3.36px;
}
p.footer a {
	
	display: inline-block;
}
img.left {
  margin-right: -6px;
  transform: scaleX(-1);
}
.logo {
	position: absolute;
	top: 300px;
	z-index: 10;
	margin: 0px auto;
	left: calc(50% - 211px);
	width: 422px;
}
.footer {
	font-size: 18px;
	letter-spacing: 2.52px;
	margin-top: 50px;
	margin-bottom: 20px;
}
.datenschutz {
	max-width: 60%;
	margin: 0px auto;
}
#popup {
	position: absolute;
	width: 500px;
	min-height: 500px;
	left: calc(50% - 250px);
	top: 100px;
	z-index: 30;
}
#popup.hide {
	display: none;
}
#closeme {
	position: absolute;
	right: 10px;
	top: 0px;
	color: #003C33!important;
	font-size: 30px;
	text-decoration: none;
}
/* Weitere Stildefinitionen können hier hinzugefügt werden */


/* Small only */
@media screen and (max-width: 39.9375em) {
	img.left {
		width: 100%;
	}
	img.right {
	  display: none;
	}
	.logo { 
		height: 150px;
		top: 217px;
		left: calc(50% - 211px);
	}
	p.address {
		width: 70%;
		margin: 0px auto;
		font-size: 18px;
	}
	p.list { 
		font-size: 14px;
	}
	a.nsl {font-size: 18px;}
	.footer {
		margin-top: 120px;
	}
	p span {
		margin-right: 0px;
		font-size: 14px;
		width: 60%;
		margin: 0 auto;
		display: block;
	}
	p.footer a {
		display: block;
		margin-top: 20px;
		font-size: 14px;
	}
}
/* Medium and up */
@media screen and (min-width: 1280px) {
	/*p.footer a {
		display: inline-block;
		right: 0px;
		position: absolute;
	}*/
	.strauss {
		width: 1280px;
	}
	.footer .links {
		margin-left: 200px;
	}
	
}