body {
	background-color: #000;
	background-image: 
		radial-gradient(rgb(0, 134, 157), rgba(0,134,157,.2) 2px, transparent 40px),
		radial-gradient(rgb(255, 140, 0), rgba(255,140,0,.15) 1px, transparent 30px),
		radial-gradient(white, rgba(255,255,255,.1) 2px, transparent 40px);
	background-size: 550px 550px, 350px 350px, 250px 250px;
	animation: space 20s ease-in-out infinite;
	color: #00ddff;
	font-family: 'Orbitron', sans-serif;
}
.navbar {
	background-color: #1a1a1a !important;
	border-bottom: 2px solid #00ddff;
}
.nav-link {
	color: #00ddff !important;
}
.card {
	background-color: #1a1a1a;
	border: 1px solid #00ddff;
	box-shadow: 0 0 10px #00ddff;
}
.btn-cyber {
	background-color: transparent;
	color: #00ddff;
	border: 2px solid #00ddff;
	transition: all 0.3s;
}
.btn-cyber:hover {
	background-color: #00ddff;
	color: #0a0a0a;
	box-shadow: 0 0 15px #00ddff;
}
.btn-cyber-alert {
	background-color: transparent;
	color: #ff8c00;
	border: 2px solid #00ddff;
	transition: all 0.3s;
}
.btn-cyber-alert:hover {
	background-color: #ff8c00;
	color: #0a0a0a;
	box-shadow: 0 0 15px #ff8c00;
}
.neon-text {
	text-shadow: 0 0 5px #00ddff, 0 0 10px #00ddff, 0 0 15px #00ddff, 0 0 20px #00ddff;
}
@keyframes space {
	40% {background-position: 0 80px, 0 50px, 0 -40px;}
}
.traveling {
	animation: warp-speed 1s forwards;
}

@keyframes warp-speed {
	0% { transform: scale(1); }
	100% { transform: scale(50); opacity: 0; }
}

.modal-content {
    background-color: rgba(255, 255, 255, 0.8); /* Halbtransparenter Hintergrund */
    backdrop-filter: blur(10px); /* Hintergrund unscharf machen */
}

#card-body {
    height: 50vh; /* Beispiel: Maximale Höhe setzen */
    overflow-y: auto; /* Beispiel: Vertikales Scrollen aktivieren */
}