@font-face {
            font-family: 'MyFont';
            src: url('../fonts/source-serif-pro/SourceSerif4Variable-Roman.ttf.woff2') 	format('woff2'),
                 url('../fonts/source-serif-pro/SourceSerif4Variable-Roman.ttf.woff2')  	format('truetype');
            
        }
		
@font-face {
            font-family: 'MyFontItalic';
            src: url('../fonts/source-serif-pro/SourceSerif4Variable-Italic.ttf.woff2') 	format('woff2'),
                 url('../fonts/source-serif-pro/SourceSerif4Variable-Italic.ttf.woff2')  	format('truetype');
            
        }

		*{
			font-family: 'MyFont', sans-serif;
			font-weight: 200;
			font-size: 20px;
			text-rendering: optimizeLegibility;
			-webkit-font-smoothing: antialiased; /* Für feinere Schrift in WebKit-basierten Browsern */
			-moz-osx-font-smoothing: grayscale; /* Für feinere Schrift in Firefox auf macOS */
		}
		
		
        body {
            display: flex;
			font-family: tahoma;
            flex-direction: column;
            align-items: center;
            margin: 0;
            padding: 0;
			color: white;
			background-color: black;
			
        }
		
		a{
			margin:0px;
			color:white;
			text-decoration: none;
		}

        h1 {
            font-size: 4em;
            text-align: center;
			margin: 0px;
			margin-bottom: 0.5em;
			line-height: 90%;
        }
        h2 {
            font-size: 2.5em;
            text-align: center;
			margin: 0px;
			margin-bottom: 2em;
        }

        h3 {
            font-size: 2.5em;
            text-align: center;
			margin: 0px;
			margin-top: 2em;
        }
		
		td{
			text-align:left;
		}
		
		.container{
			max-width: 1200px;
			width: 100%;
			text-align: center;
			padding:80px;
			box-sizing: border-box;
		}
		
        .main-image {
            width: 80%;
            max-width: 800px;
            margin: 20px 0;
        }

        .gallery {
            display: grid;
            gap: 10px;
            width: 100%;
        }

        /* Layout für größere Bildschirme */
        @media(min-width: 768px) {
            .gallery {
                grid-template-columns: repeat(3, 1fr);
            }
        }

        /* Layout für Tablets */
        @media(min-width: 480px) and (max-width: 767px) {
            .gallery {
                grid-template-columns: repeat(2, 1fr);
            }
        }

        /* Layout für Smartphones */
        @media(max-width: 479px) {
            .gallery {
                grid-template-columns: 1fr;
            }
        }

        .gallery-item {
            position: relative;
            width: 100%;
            overflow: hidden;
        }

        .gallery-item img {
            width: 100%;
            height: auto;
            display: block;
        }

		.right{
			text-align: right; 
		}
		
		.left{
			text-align: left; 
		}

		.black{
			color: black;
		}

		.white{
			color: white;
		}

        .gallery-item .text-overlay {
			font-family: 'MyFontItalic';
            position: absolute;
            bottom: 0;
            left: 0;
            /*background-color: #80ffff60;*/
            width: 100%;
            padding: 10px;
			padding-bottom:0px;
            box-sizing: border-box;
            font-size: 2.5em;
			
        }
		
		.contact-info, .disclaimer, .copyright {
            margin-bottom: 150px;
        }
		
		
		/* Homebutton */
        .home-button {
            position: fixed;
            top: 20px;
            left: 20px;
            background-color: #404040;
            color: white;
            padding: 10px 15px;
            border-radius: 5px;
            text-decoration: none;
            font-size: 1.2em;
            display: flex;
            align-items: center;
            box-shadow: 0px 4px 6px rgba(0, 0, 0, 0.1);
        }

        .home-button:hover {
            background-color: #606060;
        }

        .home-button svg {
            margin-right: 5px;
        }