body {
        display: flex;
        justify-content: center;
        align-items: center;
        height: 100vh;
        margin: 0;
        background-color: #f5f5f5;
        font-family: Arial, sans-serif;
    }

    .slogan-container {
        position: relative;
        border: 0px solid blue;
        width: 350px;
        height: 350px;
        overflow: hidden;
    }

    .slogan {
        position: absolute;
        border: 0px solid blue;
        display: flex;
        color: #f8f8f8;
        width: 350px;
        height: 350px;
        justify-content: center;
        align-items: center;
        font-size: 2em;
        text-align: center;
        font-weight: 600;
        opacity: 0;
        transition: opacity 1s ease-in-out;
        text-shadow:
        -1px -1px 0 #000,
        1px -1px 0 #333,
        -1px 1px 0 #000,
        1px 1px 0 #333;
    }

    .pic {

        background-size: cover; /* Passt das Bild an, um das gesamte div zu bedecken */
        background-position: center; /* Zentriert das Bild innerhalb des div */
        background-repeat: no-repeat; /* Verhindert das Wiederholen des Bildes */
    }

    h3: {
       font-size: 1em;
    }