body {
            font-family: 'Times new roman';
            margin: 0;
            padding: 0;
            background-color: #fff;
            color: #333;
}

        /* Flex-Container-Stil */
        .container {
            width: 100%;
            display: flex;
            flex-direction: column; /* Spaltenorientierung */
            gap: 0px; /* Abstand zwischen den Zeilen */
            align-items: center; /* Zentriere die Spalteninhalte */
        }

           .header-2 {
    max-width: 100%;
    background: linear-gradient(rgba(255, 255, 255, 0.7), rgba(255, 255, 255, 0.8)), url('back-1.png');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    color: #333;
    text-align: center;
    padding: 1em;
    height: auto;
  border: 2px transparent;
  border-radius: 8px;
  padding: 5px; 
}

           .header {
    max-width: 100%;
    background: linear-gradient(rgba(255, 255, 255, 0.7), rgba(255, 255, 255, 0.8)), url('back-1.png');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    color: #333;
    align-items: center; /* Zentriere die Spalteninhalte */
    text-align: center;
    padding: 1em;
    height: auto;
  border: 2px transparent;
  border-radius: 8px;
  padding: 5px; 
}



        /* Flex-Container-Stil */
        .page {
            max-width: 100%;
            display: flex;
            flex-direction: column; /* Spaltenorientierung */
            gap: 0px; /* Abstand zwischen den Zeilen */
            align-items: center; /* Zentriere die Spalteninhalte */
            padding: 0px 0px 0px 0px;
  border: 2px transparent;
  border-radius: 8px;
  padding: 5px; 
        }

        .page-c1 {
            max-width: 100%;
            display: flex;
            flex-direction: column; /* Spaltenorientierung */
            gap: 0px; /* Abstand zwischen den Zeilen */
            align-items: center; /* Zentriere die Spalteninhalte */
            padding: 0px 0px 0px 0px;
            background: linear-gradient(rgba(255, 255, 255, 0.8), rgba(255, 255, 255, 0.7)), url('back-1.png');
            background-size: cover;
            background-position: center;
            background-repeat: no-repeat;
  border: 2px transparent;
  border-radius: 8px;
  padding: 5px; 
        }

     /*Counter für Kontaktformular*/
        .counter {
            color: #555;
            font-size: 18px;
            margin-top: 5px;
        }

        /* Zeile - 1 Spalten mit 100% Breite */
        .row1 {
            width: 100%;
            display: flex;
            align: center;
            gap: 0px; /* Abstand zwischen den Spalten */
            padding: 0px 5px 5px 0px;
        }


        /* Zeile - 2 Spalten mit 50% Breite */
        .row2 {
            width: 100%;
            display: flex;
            gap: 0px; /* Abstand zwischen den Spalten */
            padding: 0px 5px 5px 0px;
        }

        /* Zeile - 3 Spalten mit 33.33% Breite */
        .row3 {
            display: flex;
            gap: 0px; /* Abstand zwischen den Spalten */
            padding: 0px 15px 10px 5px;
        }

        .row3-workshop {
            display: flex;
            gap: 0px; /* Abstand zwischen den Spalten */
            padding: 0px 15px 10px 5px;
        }

        /* Erste Zeile - 4 Spalten mit 20% Breite */
        .row4 {
            display: flex;
            gap: 0px; /* Abstand zwischen den Spalten */
            padding: 0px 15px 10px 5px;
        }




        /* Allgemeiner Stil für die Spalten */
        .column0 {
            flex: 1; /* Alle Spalten sollen gleich viel Platz einnehmen */
            background-color: #fff;
            width: 95%;
            padding: 0px 0px 0px 5px;
            text-align: center; /* Zentriere den Text innerhalb der Spalten */
        }
        /* Allgemeiner Stil für die Spalten */
        .column1 {
            flex: 1; /* Alle Spalten sollen gleich viel Platz einnehmen */
            background-color: #fff;
            width: 95%;
            padding: 0px 10px 0px 10px;
            text-align: center; /* Zentriere den Text innerhalb der Spalten */
        }
        .column1-podcast {
            flex: 1; /* Alle Spalten sollen gleich viel Platz einnehmen */
            background-color: #fff;
            width: 95%;
            padding: 0px 10px 0px 10px;
            text-align: center; /* Zentriere den Text innerhalb der Spalten */
        }
        .column1workshop {
            flex: 1; /* Alle Spalten sollen gleich viel Platz einnehmen */
            background-color: transparent;
            width: 95%;
            padding: 0px 10px 0px 10px;
            text-align: center; /* Zentriere den Text innerhalb der Spalten */
        }
        .column2 {
            flex: 2; /* Alle Spalten sollen gleich viel Platz einnehmen */
            background-color: #fff;
            width: 90%;
            padding: 0px 10px 0px 10px;
            text-align: justify; /* Zentriere den Text innerhalb der Spalten */
        }

        .column3 {
            flex: 2; /* Alle Spalten sollen gleich viel Platz einnehmen */
            background-color: #fff;
            width: 50%;
            padding: 0px 10px 0px 10px;
            text-align: justify; /* Zentriere den Text innerhalb der Spalten */
        }

        .columnpodcast-1 {
            flex: 1; /* Alle Spalten sollen gleich viel Platz einnehmen */
            background-color: #fff;
            text-align: center;
            width: 95%;
            padding: 0px 10px 0px 10px;
            text-align: center; /* Zentriere den Text innerhalb der Spalten */
        }

        .columnpodcast-2 {
            flex: 1; /* Alle Spalten sollen gleich viel Platz einnehmen */
            background-color: #fff;
            text-align; center;
            width: 95%;
            padding: 0px 10px 0px 10px;
            text-align: center; /* Zentriere den Text innerhalb der Spalten */
        }

        /* Media Query für Handyansicht */
        @media screen and (max-width: 600px) {
            .container {
                gap: 0px; /* Verringere den Abstand für die Handyansicht */
            }

            .row1, .row2, .row3, .row4 {
                flex-direction: column; /* Spalten untereinander für Handyansicht */
                gap: 0px; /* Abstand zwischen den Spalten in der Handyansicht */
            }

            .column {
                width: 100%; /* Spalten nutzen die gesamte Bildschirmbreite aus */
            }



        footer {
            text-align: center;
            padding: 1em;
            background-color: #1e409f;
            color: #fff;
        }


/* Schlagschatten für Bilder */
.shadow{
	box-shadow: 8px 5px 10px rgba(0, 0, 0, 0.3);
}

img {
  box-shadow: 8px 5px 10px rgba(0, 0, 0, 0.3);
}

.logo-without-shadow {
  box-shadow: none; /* Setzt den Schlagschatten auf "none" für Elemente mit dieser Klasse */
}



/*AUDIO BACKGROUND FÜR PODCASTS*/
        .audio-container {
            position: relative;
            width: 90%;
            margin: 20px auto;
            box-shadow: 8px 5px 10px rgba(0, 0, 0, 0.3);
            background: url('podcast-back.png') no-repeat center center;
            background-size: cover;
            padding: 20px;
            border-radius: 10px;
        }
        .audio-container audio {
            width: 100%;
            height: 230px;
            background: transparent;
            border-radius: 5px;
        }




footer {
            text-align: center;
            padding: 1em;
            background-color: #CCCCCC;
            color: #fff;
        }

}





/* Border für div Elemente
  border: 2px solid red;
  border-radius: 8px;
  padding: 5px;  */