@font-face{font-family:'geogrotesque';src:url('font/2C17C8_0_0.eot');src:url('font/2C17C8_0_0.eot') format('embedded-opentype'),
url('font/2C17C8_0_0.woff') format('woff'),
url('font/2C17C8_0_0.ttf') format('truetype'),
url('font/2C17C8_0_0.svg') format('svg');}
@font-face{font-family:'geogrotesque_bold';src:url('font/2C17C8_1_0.eot');src:url('font/2C17C8_1_0.eot') format('embedded-opentype'),
url('/font/2C17C8_1_0.woff') format('woff'),
url('font/2C17C8_1_0.ttf') format('truetype'),
url('font/2C17C8_1_0.svg') format('svg');}
body, table{font-family:'geogrotesque', Arial, Helvetica, sans-serif; background-color:#FFFFFF;}
.nav-item a:link {text-decoration:none;color:#000000; }
.nav-item a:visited {text-decoration:none;color:#000000; }
a:link{text-decoration:none;color:#00A3E0;}
a:visited{text-decoration:none;color:#00A3E0;}
a, img{border:none;}
p {font-size: 18px;}
.white_text {color:#FFFFFF;}
.blue_text {color:#00A3E0;}
.grey_text {color:#5E5E5E;}
.clickable {cursor:pointer;}
.image-container {
	position: relative;
	max-width: 100%; /* Responsive Bildgröße */
}

.image-container img {
	width: 100%; /* Passt die Breite des Bildes an das Container-Div an */
	height: auto;
}
.hover-element {
	position: absolute;
	background-color: rgba(255, 255, 255, 0.8); /* Halbtransparenter Hintergrund */
	border: 1px solid #000;
	border-radius: 4px;
	padding: 5px;
	display: none; /* Initial unsichtbar */
	z-index: 10;
}

.hover-area {
	position: absolute;
	cursor: pointer;
}
.hover-area.active + .hover-element {
	display: block; /* Sichtbar bei Klick oder Hover */
}
.hover-area:hover + .hover-element {
	display: block; /* Sichtbar, wenn der Hover-Bereich aktiviert ist */
}