*   {
        box-sizing: border-box;
        }
html,
body    {
        width: 100%;
        height: 100%;
        margin: 0;
        text-align: left;
        }
a       {
        color: #334488;
}
body        {
    background-color: #fff;
    overflow: hidden;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #333;
    font-family: Arial, Helvetica, Futura, sans-serif;
    font-size: 1.1em;
    text-align: center;
    background-image: url("bgwaves.png"), url("lernzentrum_uelzen_logo.png");
    background-repeat: no-repeat;
    background-position: fixed;
    background-size: contain, 50%;
    background-position: center 95%, 25px 16px;
            }
#lzue       {
            position: relative;
            width: 450px;
            height: 350px;
            margin: 6px 16px;
            background: radial-gradient(circle at 100% 100%, #ffffff 0, #ffffff 13px, transparent 13px) 0% 0%/16px 16px no-repeat,
            radial-gradient(circle at 0 100%, #ffffff 0, #ffffff 13px, transparent 13px) 100% 0%/16px 16px no-repeat,
            radial-gradient(circle at 100% 0, #ffffff 0, #ffffff 13px, transparent 13px) 0% 100%/16px 16px no-repeat,
            radial-gradient(circle at 0 0, #ffffff 0, #ffffff 13px, transparent 13px) 100% 100%/16px 16px no-repeat,
            linear-gradient(#ffffff, #ffffff) 50% 50%/calc(100% - 6px) calc(100% - 32px) no-repeat,
            linear-gradient(#ffffff, #ffffff) 50% 50%/calc(100% - 32px) calc(100% - 6px) no-repeat,
            linear-gradient(120deg, #fe4040 0%, #eca246 17%, #dbdb5f 33%, #78ca7c 50%, #00ffa6 66%, rgba(90,87,183,1) 83%, #9560c3 100%);
            border-radius: 16px;
            padding: 19px;
            box-sizing: content-box;
            transform: translate(50%, (50%-200px));
            overflow: hidden;
            }
h1          {
            width: 100%;
            font-size: 1.3em;
            color: #989898;
            text-align: center;
            margin: 0px auto 16px auto;
            }
#fotobox    {
            width: 50%;
            height: auto;
            float: left;
#foto       {
            height: 300px;
            border-radius: 12px;
            }
#textbox    {
            width: 50%;
            height: auto;
            text-align: inherit!;
            float: right;
            }
.clearfloat {
            float: none;
            }

@media only screen and (max-width: 600px)
            {
                #fotobox    {
                width: 100%;
                height: auto;
                float: left;
                #foto       {
                height: 180px;
                border-radius: 12px;
                }
                #textbox    {
                width: 100%;
                height: auto;
                text-align: inherit!;
                float: left;
                }
            }