body {
  font-family: 'Courier New', monospace;
}

.content-container {
	max-width:55em;
	max-width: 60em; /* oder z. B. 1200px */
}
a.menulink {
	font-size:0.8rem;
	color:black;
	text-decoration:none;
}

a.menulink-active {
	font-size:0.8rem;
	color:red;
	text-decoration:none;
}

a.menulink:hover {
	color: LightCoral;
}

hr {
	width:100%;
	margin:auto;
}
.a_map{
	z-index:999;
	cursor: pointer;
}
.modal-almost-fullscreen {
	width: 90%;
	height: 90%;
	max-width: 90%;
	max-height: 90%;
	margin-left: auto;
	margin-right: auto;			
}
.modal-content {
	height:unset;
	border:unset;	
	border-radius:0;
}
.modal-body {
	padding:0;
}

a.lnk-prevnext, a.lnk-prevnext:hover, a.lnk-prevnext:visited {
	text-decoration:none;
}

.carousel-inner {
	background-color: Gainsboro;
}
.slider-img {
	border:6px solid Gainsboro;
}
		
.hfc {
	/*height: fit-content;*/
	height:auto;
}

#hos-heading {
	border: 1px solid red;
	text-transform: uppercase;
	text-align: center;
	padding: 0.3rem;
	margin-bottom: 1rem;
}

#hos-intro {
	border: 1px solid black;
	padding: 1rem;
	font-size:0.89rem;
}

.text-small {
	font-size:0.75rem;
	color:#666
}

.modal-button-close {
	color:white;
	position:absolute; 
	right:0; top:-2rem; 
	font-family:sans-serif;
	font-weight:bold;
	padding:0.55em; 
	padding-right:0;
	cursor:pointer; 
	line-height:1em;
}

/* for safari */
area {
	display:block;
	cursor: pointer;
}

/* floorplan landing page */
.floorplan-wrapper {
  width: 100%;
  max-width: 1000px; /* oder was du brauchst */
  margin: auto;
}

.floorplan-wrapper img {
  width: 100%;
  height: auto;
  display: block;
}

.floor-link {
  position: absolute;
  left: 3%;     /* angepasst auf den sichtbaren Gebäudeteil */
  width: 90.1%;      /* passt genau über die Hauswand */
  z-index: 10;
  display: block;
  border: 2px solid transparent;
  transition: border 0.2s ease-in-out;
  pointer-events: auto;
}

.floor-link:hover {
  border: 2px solid red;
  opacity:0.4;
}

.floor-link.scan-highlight {
  border: 2px solid red !important;
}
.floor-link.active-floor {
  border: 2px solid red;
  pointer-events: none;
}

.overlay-dot {
  position: absolute;
  transform: translate(-50%, -50%);
  background-color: red;
  color: white;
  font-family: 'Courier New', Courier, monospace;
  text-transform: uppercase;
  font-size: 0.9em;
  padding: 0.4em 0.8em;
  border-radius: 2em;
  white-space: nowrap;
  max-width: 12em;
  text-align: center;
  pointer-events: auto;
  cursor: pointer;
  transition: all 0.2s ease-in-out;
}
@media (max-width: 768px) {
  .overlay-dot {
    font-size: 0.6em;
    padding: 0.3em 0.6em;
  font-weight: bold;
  }
}
.overlay-dot:hover {
  transform: translate(-50%, -50%) scale(1.2);
  font-weight: bold;
}
.overlay-dot.hidden {
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.2s ease-in-out;
}

[data-floor] {
  transition: opacity 0.2s ease;
}

#prev-floor, #next-floor,  .enter-link {
	color:red;
	text-decoration:none;
}
.enter-link:hover {
	color:red;
}
#floor-label {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: nowrap;
  gap: 1em;
  padding-top: 1em;
}

#floor-label a {
  white-space: nowrap;
  text-decoration: none;
  color: red;
  font-size: 1.6em;
}

#floor-label-text {
  flex-grow: 1;
  text-align: center;
  min-width: 10em;
  font-size: 1.6em;
  text-transform: uppercase;
  color:red;

}
@media (max-width: 768px) {
	#floor-label-text {
    font-size: 1em;
  }
}

/* zoom problem a handy mit screen overlay */
#screen-overlay-full .modal-dialog {
  margin: 0;
  max-width: 100vw;
  width: 100vw;
}

#screen-overlay-full .modal-content {
  width: 100vw;
  height: 100vh;
  max-width: 100vw;
  max-height: 100vh;
  border-radius: 0;
}

#screen-overlay-body {
  width: 100vw;
  height: 100vh;
  box-sizing: border-box;
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: hidden;
}
.modal-button-close {
  position: absolute;
  top: 1rem;
  right: 1rem;
  z-index: 1051; /* höher als modal-content (1050) */
  font-size: 2rem;
  color: black;
  background: white;
  padding: 0.2em 0.5em;
  border-radius: 2em;
  cursor: pointer;
}
@media (max-width: 768px) {
	#cover-house{
		margin-top: 2em;
	}
}

#please-turn-your-device {
	color:red;
	font-weight:bold;
	margin-top:3em;
	display:none;
}
/* mobile quer */
@media only screen and (max-width: 768px) and (orientation: landscape) {
	.overlay-dot {
	    font-size: 1.2em;
	  }
}
@media only screen and (max-width: 768px) and (orientation: portrait) {
	#please-turn-your-device {
		display:block;
	}
}