body {
            font-family: "Comic Neue", sans-serif;
            background-color: var(--pink);
            padding-left: 64px;
            padding-right: 64px;
        }
        :root {
            --rose:#fff4ff;
            --rose-dark:#cf9ccf;
            --pink:#e17aed;
            --blue:#311042;
            --grey:#858099;
            --grey-dark:#6d5d7d;
        }
        .logo {
            position: relative;
            margin-top: 36px;
            margin-left: 24px;
            width: 500px;
            filter: drop-shadow(5px 7px 10px var(--grey-dark));
        }
        h1 {
            color:var(--blue);
            font-size: 48px;
        }
        h2 {
            color:var(--rose);
            font-size: 36px;
            text-shadow: 2px 3px 5px var(--blue);
        }
        h3 {
            color:var(--rose);
            font-size: 24px;
            text-shadow: 2px 3px 5px var(--blue);
        }
        h4 {
            color: var(--rose);
            font-size: 20px;
            text-shadow: 2px 3px 5px var(--blue);
        }
        p {
            color:var(--blue);
            font-size: 20px;
            margin-top: 24px;
            margin-bottom: 24px;
        }
        #wave {
            position: absolute;
            object-fit: cover;
            left:0;
            top:0 ;
            z-index: -1;
        }
        a {
            text-decoration: none;
            font-size: 24px;
            color:var(--rose);
            margin-right: 32px;
        }
        a:hover { 
            color:var(--blue);
        }
        .nav {
            margin-top: 16px;
        }
        .nav-btn {
            filter: drop-shadow(2px 3px 5px var(--blue));
        }
        #contact {
            fill:var(--rose);
        }
        #contact:hover {
           fill:var(--blue);
        }   
        .button {
            font-size: 20px;
            font-weight: bold;
            color: var(--rose);
            padding: 8px 32px;
            background-color: var(--grey);
            border-radius: 24px;
            filter: drop-shadow(5px 10px 4px rgba(0, 0, 0, 0.226));
        }
        #submitbtn {
            color: var(--rose);
            border-width: 0;
            font-size: 20px;
            font-weight: bold;
            padding: 8px 32px;
            background-color: var(--grey);
            border-radius: 24px;
        }
        .button:hover {
            color: var(--rose-dark);
            background-color: var(--grey-dark);
        }
        .submitbtn:hover {
            color: var(--rose-dark);
            background-color: var(--grey-dark);
        }
        .small-screen {
            margin-right: 24px;
        }
        .btncon {
            text-align: center;
        }
        .dompteur {
            width: 350px;
            position: relative;
            margin-top: 24px;
            margin-right: 24px;
            box-shadow: 7px 5px 9px var(--blue);
            border-radius: 5px;
        }
        form {
            color: var(--rose);
            filter: drop-shadow(2px 3px 5px rgba(77, 37, 143, 0.279));
        }
        .eingabe {
            width: 500px;
        }
        @media (min-width: 870px) {
            .mid-screen {
                display: flex;
            }
            .small-screen {
                max-width: 360px;
            }
            .nav-btn {
                font-size: 32px;
                margin-right: 36px;
            }
            #contact {
                height: 36px;
            }
            .logo {
            position: relative;
            margin-top: 30px;
            margin-left: 30px;
            width: 800px;
            }   
        }
        @media (min-width: 1500px) {
            .big-screen {
                display:flex;
                justify-content:space-evenly;
            }
            .dompteur {
                height: 600px;
                width: auto;
            }
            .small-screen {
                max-width: 360px;
            }
            .nav-btn {
                font-size: 36px;
                margin-right: 40px;
            }
            #contact {
                height: 40px;
            }
            .logo {
            position: relative;
            margin-top: 24px;
            margin-left: 3px;
            width: 1300px;
            }
        }