.slideshow {
            
            margin: 0 auto;
            border: 2px solid #617385;
            border-radius: 10px;
            padding: 5px;
            background: white;
            position: relative;
            overflow: hidden;
        }
		@media (max-width: 991px) {
			 .slideshow {
			flex: 0 0 90vw;
			 }
		}
		@media (min-width: 992px) {
			 .slideshow {
			width: 500px;
			 }
		}
        
        .slide-container {
            position: relative;
            height: 400px;
            border-radius: 8px;
            overflow: hidden;
        }
        
        .slide {
            position: absolute;
            width: 100%;
            height: 100%;
            opacity: 0;
            transition: opacity 0.5s;
        }
        
        .slide.active {
            opacity: 1;
        }
        
        .slide img {
            width: 100%;
            height: 100%;
            object-fit: contain;
            background: #f0f0f0;
        }
        
        .description {
            text-align: center;
            margin-top: 10px;
            font-weight: 200;
            font-size: 80%;
            color: #617385;
            padding: 0 10px;
            min-height: 40px;
            display: flex;
            align-items: center;
            justify-content: center;
        }
        
        /* Bedienelemente im Bild */
        .controls-overlay {
            position: absolute;
            bottom: 15px;
            left: 0;
            right: 0;
            display: flex;
            justify-content: center;
            align-items: center;
            gap: 10px;
            z-index: 10;
        }
        
        .nav-btn {
            background: rgba(97, 115, 133, 0.8);
            color: white;
            border: none;
            width: 36px;
            height: 36px;
            border-radius: 50%;
            cursor: pointer;
            font-size: 16px;
            display: flex;
            align-items: center;
            justify-content: center;
            transition: all 0.3s;
        }
        
        .nav-btn:hover {
            background: rgba(97, 115, 133, 1);
            transform: scale(1.1);
        }
        
        .counter {
            color: white;
            font-weight: bold;
            font-size: 14px;
            background: rgba(0, 0, 0, 0.6);
            padding: 4px 10px;
            border-radius: 15px;
            min-width: 60px;
            text-align: center;
        }
        
        .dots {
            position: absolute;
            bottom: 5px;
            left: 0;
            right: 0;
            display: flex;
            justify-content: center;
            gap: 8px;
            z-index: 10;
        }
        
        .dot {
            width: 10px;
            height: 10px;
            border-radius: 50%;
            background: rgba(255, 255, 255, 0.5);
            cursor: pointer;
            transition: all 0.3s;
            border: 1px solid rgba(97, 115, 133, 0.3);
        }
        
        .dot.active {
            background: #617385;
            transform: scale(1.2);
        }
        
        .dot:hover:not(.active) {
            background: rgba(97, 115, 133, 0.8);
        }
        
        /* Hover-Effekt für das gesamte Bild */
        .slide-container:hover .controls-overlay {
            opacity: 1;
        }
        
        .slide-container:hover .dots {
            opacity: 1;
        }
	@font-face {
			  font-family: 'Italianno';
			  font-style: normal;
			  font-weight: 400;
			  src: url(Italianno.woff2) format('woff2');
			  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
			}
		@font-face {
			  font-family: 'Open Sans';
			  font-style: normal;
			  font-weight: 400;
			  font-stretch: 100%;
			  src: url(opensans.woff2) format('woff2');
			  unicode-range: U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC, U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212, U+2215, U+FEFF, U+FFFD;
			}
        * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
			font-family: 'Open Sans', sans-serif;  
        }
		a {text-decoration: none; color: #617385;}

        body {
            background-color: #f5f7fa;
            color: #333;
            line-height: 1.6;
            min-height: 100vh;
            display: flex;
            flex-direction: column;
        }
		.wgr_header{
			font-family: Italianno; 
			font-size: 4em; 
			color: #626205;}
		 
          
        /* Startseite Grid PC */
		@media (min-width: 992px) {
		.parent01 {
			display: grid;
			height: 100vh; 
			width: 100vw;  
			grid-template-columns: repeat(5, 1fr);
			grid-template-rows: repeat(8, 1fr);
			grid-column-gap: 0px;
			grid-row-gap: 0px;
			}

		.container { grid-area: 1 / 1 / 8 / 2; position: fixed;}
		.footer01 { grid-area: 8 / 1 / 9 / 6; }
		.header01 { grid-area: 1 / 2 / 2 / 6; }
		.main01 { grid-area: 2 / 2 / 8 / 6;}
		.main_flexbox {  display: flex; flex-wrap: wrap; align-items: stretch; }
		
		.main02 { grid-area: 2 / 2 / 8 / 5; }
		.rightside { grid-area: 2 / 5 / 8 / 6; padding: 0px 20px 0px 20px; }
		.card {
			flex: 0 0 250px;
			padding: 5px; /* Innenabstand */
			margin: 5px;
			border-radius: 10px;
			border: 2px solid #617385; /* Rahmen */
			
		  } 
		.card img {
			width: 250px;
			border-radius: 10px;
		  }
		.card .text {
			padding: 0 20px 20px;
		  }
		.card .text > button {
			background: gray;
			border: 0;
			color: white;
			padding: 10px;
			width: 100%;
			}
		}
		
		 /* Startseite Grid Mobile */
		@media (max-width: 991px) {
		.hide-on-mobile {display: none;}
		.parent01 {
			display: grid;
			 
			width: 100vw;  
			grid-auto-rows: auto;
			grid-template-columns: repeat(5, 1fr);
			grid-template-rows: 0.2fr 1fr 1fr 1fr 1fr 1fr 1fr 0.2fr;
			grid-column-gap: 0px;
			grid-row-gap: 0px;
			}

		.container { grid-area: 1 / 1 / 2 / 2; }
		.footer01 { grid-area: 8 / 1 / 9 / 6; }
		.header01 { grid-area: 1 / 2 / 2 / 6; }
		.main01 { grid-area: 2 / 1 / 8 / 6; }
		.main_flexbox {  display: flex; flex-wrap: wrap; align-items: stretch; }
		
		.main02 { grid-area: 3 / 1 / 8 / 6; }
		.rightside { grid-area: 2 / 1 / 3 / 6;}
			  
			  
			  
		
		 .card {
			flex: 0 0 90vw;
			margin: 10px auto;
			border-radius: 10px;
			border: 2px solid #ccc;
		  } 
		.card img {
			max-width: 90vw;
			margin: 0 auto;
			height: auto;
			object-fit: contain;
			border-radius: 10px;
		  }
		.card .text {
			padding: 0 20px 20px;
		  }
		.card .text > button {
			background: gray;
			border: 0;
			color: white;
			padding: 10px;
			width: 100%;
			}
		}

 
   

        /* Hamburger menu button */
        .menu-toggle {
            position: fixed;
            top: 1rem;
            left: 1rem;
            z-index: 1001;
            background: #2c3e50;
            color: white;
            border: none;
            width: 50px;
            height: 50px;
            border-radius: 50%;
            cursor: pointer;
            display: flex;
            flex-direction: column;
            justify-content: center;
            align-items: center;
            box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
            transition: all 0.3s ease;
        }

        .menu-toggle:hover {
            background: #3498db;
            transform: scale(1.05);
        }

        .menu-toggle .bar {
            width: 24px;
            height: 3px;
            background: white;
            margin: 2.5px 0;
            transition: all 0.3s ease;
            border-radius: 2px;
        }

        .menu-toggle.active .bar:nth-child(1) {
            transform: translateY(8px) rotate(45deg);
        }

        .menu-toggle.active .bar:nth-child(2) {
            opacity: 0;
        }

        .menu-toggle.active .bar:nth-child(3) {
            transform: translateY(-8px) rotate(-45deg);
        }

        /* Sidebar menu */
        .sidebar {
            position: fixed;
            left: 0;
            top: 0;
            height: 100%;
            width: 280px;
            background: linear-gradient(to bottom, #2c3e50, #34495e);
            color: white;
            transform: translateX(-100%);
            transition: transform 0.4s ease;
            z-index: 1000;
            box-shadow: 5px 0 15px rgba(0, 0, 0, 0.2);
            overflow-y: auto;
            padding-top: 80px;
        }

        .sidebar.active {
            transform: translateX(0);
        }

        /* Menu list */
        .menu {
            list-style: none;
            padding: 0;
        }

        .menu-item {
            border-bottom: 1px solid rgba(255, 255, 255, 0.1);
        }

        .menu-item > a {
            display: flex;
            align-items: center;
            padding: 1rem 1.5rem;
            color: white;
            text-decoration: none;
            transition: background 0.3s ease;
            font-weight: 500;
        }

        .menu-item > a:hover {
            background: rgba(52, 152, 219, 0.3);
        }

        .menu-item > a .icon {
            margin-right: 12px;
            font-size: 1.2rem;
            width: 24px;
            text-align: center;
        }

        .menu-item > a .arrow {
            margin-left: auto;
            transition: transform 0.3s ease;
        }

        .menu-item.active > a .arrow {
            transform: rotate(90deg);
        }

        /* Submenu */
        .submenu {
            list-style: none;
            max-height: 0;
            overflow: hidden;
            transition: max-height 0.4s ease;
            background: rgba(0, 0, 0, 0.2);
        }

        .menu-item.active .submenu {
            max-height: 500px;
        }

        .submenu a {
            display: block;
            padding: 0.8rem 1.5rem 0.8rem 3rem;
            color: #ecf0f1;
            text-decoration: none;
            transition: all 0.3s ease;
            border-left: 3px solid transparent;
        }

        .submenu a:hover {
            background: rgba(52, 152, 219, 0.2);
            color: white;
            border-left: 3px solid #3498db;
            padding-left: 3.5rem;
        }

        .submenu a i {
            margin-right: 8px;
            font-size: 0.9rem;
        }
		


        /* Desktop styles - menu always visible */
        @media (min-width: 992px) {
            .menu-toggle {
                display: none;
            }

            .sidebar {
                transform: translateX(0);
                position: relative; 
            }
			.image-container {
			  width: 500px; /* Breite des Containers */
			  border: 2px solid #617385; /* Rahmen */
			  border-radius: 10px;
			  padding: 5px; /* Innenabstand */
			  margin: 5px;
			}

			.image-container img {
			  max-width: 100%; /* Bild passt sich an Container an */
			  height: auto; /* Seitenverhältnis beibehalten */
			  display: block; /* Bild wird als Blockelement behandelt */
			  margin: 0 auto; /* Bild zentriert */
			  border-radius: 10px;
			}

			.image-description {
			  text-align: center; /* Text zentriert */
			  margin-top: 10px; /* Abstand vom Bild */
			  font-weight: 200; 
			  font-size: 80%;
			  color: #617385;
			}
			.left-float {
			  float: left;
			}
			.right-float {
			  float: right;
			}
        }

        /* Mobile adjustments */
        @media (max-width: 991px) {
            .container {
                margin-left: 0;
                width: 100%;
            }
            
            .sidebar {
                transform: translateX(-100%);
            }
            
            .sidebar.active {
                transform: translateX(0);
            }
			.image-container {
			  width: 98vw; /* Breite des Containers */
			  border: 2px solid #617385; /* Rahmen */
			  border-radius: 10px;
			  padding: 5px; /* Innenabstand */
			  margin: 5px 0px 5px 0px;
			}

			.image-container img {
			  max-width: 100%; /* Bild passt sich an Container an */
			  height: auto; /* Seitenverhältnis beibehalten */
			  display: block; /* Bild wird als Blockelement behandelt */
			  margin: 0 auto; /* Bild zentriert */
			  border-radius: 10px;
			}

			.image-description {
			  text-align: center; /* Text zentriert */
			  margin-top: 10px; /* Abstand vom Bild */
			  font-weight: 200; 
			  font-size: 80%;
			  color: #617385;
			}
			.article01 {
			padding: 5px;
			}
        }
	.nav-icon{
		stroke: white;
		fill: white;
		stroke-opacity: 0;
		}
		
		
		
		 /* ===== Startseite Div-Boxen ===== */
		 /* Haupt Layout Container */
        .start-articles-container {
            display: flex;
            flex-wrap: wrap;
            gap: 20px;
            justify-content: center;
        }
        
        /* Artikel Karte - MOBILE (Standard) */
        .start-article-card {
            background: white;
            border-radius: 10px;
            overflow: hidden;
            box-shadow: 0 3px 10px rgba(0,0,0,0.08);
            transition: all 0.3s ease;
            flex: 1 1 100%;
            display: flex;
            flex-direction: column;
            max-width: 100%;
        }
        
        .start-article-card:hover {
            transform: translateY(-5px);
            box-shadow: 0 8px 20px rgba(0,0,0,0.12);
        }
        
        /* Bild Container mit 9:13 Verhältnis */
        .start-article-image {
            width: 100%;
            padding-top: 69.23%; /* 9/13 ≈ 69.23% */
            position: relative;
            overflow: hidden;
            background: #f5f5f5;
        }
        
        .start-article-image img {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            object-fit: cover;
            transition: transform 0.5s ease;
        }
        
        .start-article-card:hover .start-article-image img {
            transform: scale(1.05);
        }
        
        .start-category-badge {
            position: absolute;
            top: 15px;
            right: 15px;
            background: rgba(97, 115, 133, 0.9);
            color: white;
            padding: 6px 12px;
            border-radius: 4px;
            font-size: 0.8em;
            font-weight: 600;
            z-index: 2;
        }
        
        /* Artikel Inhalt */
        .start-article-content {
            padding: 20px;
            display: flex;
            flex-direction: column;
            flex-grow: 1;
        }
        
        .start-article-meta {
            display: flex;
            justify-content: space-between;
            margin-bottom: 15px;
            font-size: 0.85em;
            color: #666;
            padding-bottom: 12px;
            border-bottom: 1px solid #eee;
        }
        
        .start-article-date, 
        .start-article-author {
            display: flex;
            align-items: center;
            gap: 5px;
        }
        
        .start-article-title {
            color: #2c3e50;
            font-size: 1.3em;
            margin-bottom: 12px;
            line-height: 1.4;
            font-weight: 600;
        }
        
        .start-article-excerpt {
            color: #555;
            margin-bottom: 20px;
            font-size: 0.95em;
            line-height: 1.6;
            flex-grow: 1;
        }
        
        .start-read-more {
            display: inline-block;
            background: #617385;
            color: white;
            padding: 10px 15px;
            border-radius: 4px;
            text-decoration: none;
            font-weight: 600;
            text-align: center;
            transition: all 0.3s ease;
            border: none;
            cursor: pointer;
            font-size: 0.9em;
            align-self: flex-start;
            margin-top: auto;
        }
        
        .start-read-more:hover {
            background: #4a5a6b;
            transform: translateY(-2px);
        }
        
        /* ===== NUR EIN UMBRUCH BEI 991px ===== */
        
        @media (min-width: 991px) {
            .start-articles-container {
                gap: 25px;
                justify-content: flex-start;
            }
            
            .start-article-card {
                flex: 0 1 calc(50% - 12.5px);
                max-width: calc(50% - 12.5px);
                flex-direction: row;
                height: auto;
                min-height: 250px;
            }
            
            .start-article-image {
                width: 40%;
                padding-top: 0;
                height: 100%;
                flex-shrink: 0;
            }
            
            .start-article-image img {
                position: relative;
                height: 100%;
                object-position: center;
            }
            
            .start-article-content {
                width: 60%;
                padding: 25px 20px;
                display: flex;
                flex-direction: column;
            }
            
            .start-article-title {
                font-size: 1.2em;
                margin-bottom: 12px;
                line-height: 1.4;
            }
            
            .start-article-excerpt {
                font-size: 0.9em;
                line-height: 1.5;
                margin-bottom: 15px;
                flex-grow: 1;
            }
            
            .start-article-meta {
                font-size: 0.8em;
                margin-bottom: 12px;
                padding-bottom: 10px;
            }
            
            .start-read-more {
                font-size: 0.85em;
                padding: 8px 14px;
                margin-top: 10px;
            }
        }
        
        /* Optional: Für sehr große Screens (> 1400px) */
        @media (min-width: 1400px) {
            .start-article-card {
                flex: 0 1 calc(33.333% - 16.66px);
                max-width: calc(33.333% - 16.66px);
            }
            
            .start-article-content {
                padding: 20px 15px;
            }
        }