/* demo page styles */ 
@import url('https://fonts.googleapis.com/css2?family=Press+Start+2P&display=swap');
	.container {
    display: flex;
    height: 100vh;
	}
    body {
		margin: 0;
		padding: 0;
		background: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.65)), 
                #0a0a0f url('/pics/1Nlzl.jpg') center/cover fixed;
		font-family: 'Press Start 2P', cursive;
		color: white;
		height: 100vh;
		overflow: hidden;
		
		/* Extra dunkles Overlay für mehr Retro-Feeling */
		//box-shadow: inset 0 0 200px rgba(0, 0, 0, 0.65);
		
	}

/* Linke Navigation */
        .sidebar {
			
			width: 270px;
            background: rgba(0, 0, 0, 0.88);
            border-right: 4px solid #00ff00;
            //padding: 20px 15px;
			padding: 5px 5px;
            overflow-y: auto;
            box-shadow: 4px 0 15px rgba(0, 255, 0, 0.4);
        }

        .sidebar h1 {
            color: #00ff00;
            text-shadow: 0 0 10px #00ff00;
            font-size: 18px;
            margin-bottom: 25px;
            text-align: center;
            border-bottom: 2px solid #00ff00;
            padding-bottom: 10px;
        }

        .section h2 {
            color: #ffff00;
            font-size: 14px;
            margin: 20px 0 12px 0;
            text-shadow: 0 0 8px #ffff00;
        }

        .nav-link {
            display: block;
            padding: 12px 15px;
            margin: 6px 0;
            background: #1a1a1a;
            color: white;
            text-decoration: none;
            border: 2px solid #555;
            font-size: 13px;
            transition: all 0.2s;
            //box-shadow: 3px 3px 0 #222;
        }

        .nav-link:hover {
            background: #00aa00;
            color: black;
            border-color: #00ff00;
            transform: translate(3px, 3px);
            box-shadow: 1px 1px 0 #222;
        }

		.nav-link-small {
            display: block;
            padding: 6px 7px;
            margin: 4px 0;
            background: #1a1a1a;
            color: white;
            text-decoration: none;
            border: 2px solid #555;
            font-size: 11px;
            transition: all 0.2s;
            //box-shadow: 3px 3px 0 #222;
        }

        .nav-link-small:hover {
            background: #00aa00;
            color: black;
            border-color: #00ff00;
            transform: translate(3px, 3px);
            box-shadow: 1px 1px 0 #222;
        }

		/*
		.content {
			flex: 1;
			padding: 30px;
			overflow-y: auto;
			background: rgba(0, 0, 0, 0.7);
		}
		*/
/* Rechter Inhaltsbereich */
        .content {
            flex: 1;
            padding: 40px 50px;
            overflow-y: auto;
            background: rgba(0, 0, 0, 0.65);
            line-height: 1.5;
        }

        .content h1 {
            color: #00ffff;
            text-shadow: 0 0 15px #00ffff;
            //margin-top: 0;
            font-size: 22px;
        }
		
		.content h2 {
            color: #ffff00;
            font-size: 14px;
            margin: 20px 0 12px 0;
            text-shadow: 0 0 8px #ffff00;
        }
		
        .content p {
            font-size: 14px;
            margin-bottom: 18px;
        }

		.content p-small{
			font-size: 10px;
            margin-bottom: 10px;
        }
			
        .bau {
            color: #ff8800;
            font-size: 12px;
            border: 2px dashed #ff8800;
            padding: 12px;
            margin: 25px 0;
            background: rgba(255, 100, 0, 0.1);
            text-align: center;
        }

       
		.content a.leucht-link {
			color: #ffff00;
			font-size: 14px;
			margin: 20px 0 12px 0;
			text-shadow: 0 0 8px #ffff00;
			text-decoration: none; /* Entfernt die Unterstreichung */
			display: inline-block; /* Aktiviert die Abstände (Margin) für den Link */
		}
	   
		.content a.leucht-link:hover {
			text-shadow: 0 0 15px #ffff00;
		}
	   
		#button{
			font-family: 'Press Start 2P', cursive;
		}

		/* 1. Tabelle als Ganzes formatieren */
		table.inhalt {
			border-collapse: collapse;
			width: 100%;
		}

		/* 2. Nur die Zellen der Tabelle formatieren */
		table.inhalt th{
			background: #0a5c8e; color: white;
			border: 1px solid #c0c0c0;
			padding: 2px;
		}			
		table.inhalt td {
			border: 1px solid #c0c0c0;
			padding: 2px;
		}
		
		/* 1. Tabelle als Ganzes formatieren */
		table.inhaltnoframe {
			border-collapse: collapse;
			width: 100%;
		}

		/* 2. Nur die Zellen der Tabelle formatieren */
		table.inhaltnoframe th{
			background: #0a5c8e; color: white;
			border: 0px solid #c0c0c0;
			padding: 2px;
		} 
		table.inhaltnoframe td {
			border: 0px solid #c0c0c0;
			padding: 2px;
		}

/*


.login{
margin: 10px 5px;
padding:0px;
height:25px; 	
}

.footer{
	margin: 0px 5px;
	padding: 0px 5px;
	border:0px black solid; 
	height: 50px;
	position: fixed; 
    bottom:0%;
    width:100%; 
    opacity: 1;
}