/* Allgemeines Layout */
body {
	  margin: 0;
	    padding: 0;
	      font-family: 'Segoe UI', sans-serif;
	        background-color: #0d0d0d;
		  color: #e0e0e0;
	  }


html {
	  scroll-behavior: smooth;
  }


  .description {
	   width: 80%;
	      margin: 1rem auto;
	        padding: 0 1rem;
		  text-align: left;
		    font-size: 1.2rem;
		      line-height: 1.6;
		        color: #ccc;
		}
.main_nav {
	  position: sticky;
	    top: 0;
	      z-index: 1000;
	        background-color: #0d0d0d; /* oder was zu deinem Layout passt */
		  padding: 1rem;
		    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.5);
	    }
.main_nav a {
	  display: inline-block;
	    color: #fff;
	      padding: 0.5rem 1rem;
	        text-decoration: none;
		  border-radius: 50px;
		    box-shadow: 0 4px 8px rgba(255, 255, 255, 0.1); /* Heller Schatten unten */
		      transition: box-shadow 0.3s ease, transform 0.3s ease;
	      }

	      .main_nav a:hover {
		        box-shadow: 0 6px 12px rgba(255, 255, 255, 0.2); /* Stärkerer Schatten beim Hover */
			  transform: translateY(-2px); /* Leichter Anhebungs-Effekt */
		  }


	  /* --- TITEL mit Glanz, Verlauf, Glitzer --- */
	  h1 {
		    position: relative;
		      font-size: 2rem;
		        text-align: center;
			  margin: 2rem 1rem;
			    background: linear-gradient(90deg, #ffd700, #ffffff, #ffd700);
			      background-size: 200% auto;
			        -webkit-background-clip: text;
				  -webkit-text-fill-color: transparent;
				    animation: glitter 5s linear infinite;
				      text-shadow: 0 0 20px rgba(255, 255, 255, 0.2);
			      }

			      /* Glanz-Streifen */
			      h1::after {
				        content: "";
					  position: absolute;
					    top: 0;
					      left: -75%;
					        width: 50%;
						  height: 100%;
						    background: linear-gradient(120deg, rgba(255,255,255,0) 0%, rgba(255,255,255,0.6) 50%, rgba(255,255,255,0) 100%);
						      transform: skewX(-20deg);
						        animation: shine 3s infinite;
						}

						@keyframes glitter {
							  to {
								      background-position: 200% center;
								        }
								}


								    /* Sterneffekt */
								    h1 .star {
									      animation: twinkle 2s infinite alternate;
									        color: #fffacd;
										  font-size: 1.5rem;
										    margin: 0 0.2rem;
									    }

									    @keyframes twinkle {
										      from {
											          opacity: 0.5;
												      text-shadow: 0 0 5px #fffacd, 0 0 10px #fffacd;
												        }
													  to {
														      opacity: 1;
														          text-shadow: 0 0 15px #fffacd, 0 0 30px #ffd700;
															    }
														    }

														    /* Galerie-Layout */
														    .gallery {
															      display: grid;
															        grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
																  gap: 1.5rem;
																    padding: 2rem;
																      margin-top: 2rem;
																        max-width: 100%;
																}

																/* Bilder + Hover */
																.gallery img {
																	  width: 100%;
																	    height: auto;
																	      object-fit: cover;
																	        border-radius: 10px;
																		  box-shadow: 0 8px 30px rgba(0, 0, 0, 0.4);
																		    transition: transform 0.4s ease, box-shadow 0.4s ease;
																		      opacity: 1;
																	      }

																	      .gallery img:hover {
																		        transform: scale(2.08);
																			  box-shadow: 0 16px 60px rgba(255, 255, 255, 0.3);
																		  }

																		  /* Kontaktformular verschönern */
																		  form {
																			    max-width: 600px;
																			      margin: 3rem auto;
																			        padding: 2rem;
																				  background: #1a1a1a;
																				    border-radius: 10px;
																				      box-shadow: 0 0 20px rgba(255, 255, 255, 0.05);
																			      }

																			      form input,
																			      form textarea {
																				        width: 100%;
																					  padding: 1rem;
																					    margin: 1rem 0;
																					      border: none;
																					        border-radius: 5px;
																						  background-color: #2a2a2a;
																						    color: #fff;
																						      font-size: 1rem;
																					      }

																					      form button {
																						        width: 100%;
																							  padding: 1rem;
																							    background-color: #ffd700;
																							      border: none;
																							        border-radius: 5px;
																								  color: #0d0d0d;
																								    font-weight: bold;
																								      font-size: 1.1rem;
																								        cursor: pointer;
																									  transition: background 0.3s ease;
																								  }

																								  form button:hover {
																									    background-color: #e0c000;
																								    }

																								    /* Textzentrierung für Einleitung + Footer */
																								    .text-center {
																									      text-align: center;
																									        margin: 20px auto;
																										  max-width: 800px;
																										    font-size: 1.1rem;
																										      line-height: 1.6;
																									      }

																									      /* Footer */
																									      footer {
																										        text-align: center;
																											  padding: 2rem;
																											    font-size: 0.9rem;
																											      color: #888;
																											        border-top: 1px solid #222;
																												  margin-top: 2rem;
																											  }