.contactSlide {
    background: url('../img/backgrounds/10202993-2.jpg');
    display: flex;
    flex-direction: column;
}

.contactBox textarea {
    min-height: 100px;
    resize: vertical;
}

.contactTextBox {
    color: white;
    display: inline-block;
    padding: 10px 20px;

    @media (min-width: 1000px) {
        margin: 150px 200px 50px auto;
        font-size: 128px !important;
    }
    @media (max-width: 999px) {
        margin: 150px 10px 50px auto;
        font-size: 64px !important;
    }
}

.contactBox {
    display: inline-block;
    margin-left: auto;
    margin-right: 70px;
    margin-bottom: 150px;

    width: 800px;

    @media (min-width: 600px) and (max-width: 999px) { /* todo use the --desktopMinWidth env variable when they'll be available */
        width: 500px;
    }
    @media (max-width: 599px) { /* todo use the --desktopMinWidth env variable when they'll be available */
        width: 300px;
    }

}

.contactBox form {
    width: 100%;
}

.contactBox label {
    display: block;
    margin-bottom: 5px;
    padding: 0 10px;
}

.contactBox input, .contactBox input:focus, .contactBox textarea, .contactBox button {
    background: transparent;
    border: none;
    border-bottom: 1px solid darkgray;
    box-sizing: border-box;
    color: black;
    font-size: 16px;
    padding: 10px;
    width: 100%;
}

.contactBox input[type=submit], .contactBox button, .contactBox input[type=button] {
    width: 100%;
    background: transparent;
    cursor: pointer;
    border: none;
    text-align: left;
}

.contactForm {
    width: 100%;
}

.temporaryContactForm {
    margin-left: auto;
}

.temporaryContactFormLink {
    margin: 50px;
    -webkit-backdrop-filter: blur(var(--blurRadius));
    backdrop-filter: blur(var(--blurRadius));
    background: white;
    word-wrap: break-word;
    color: black;
    width: fit-content;
    padding: 10px 20px;

    @media (min-width: 1000px) {
        margin: 50px;
        font-size: 48px;
    }
    @media (max-width: 999px) {
        margin: 10px;
        font-size: 24px;
    }
}

.temporaryContactForm a {
    color: darkgrey;
    text-decoration: none;

    @media (min-width: 501px) {
        font-size: 48px;
    }
    @media (max-width: 500px) {
        font-size: 24px;
    }
}

.contactSlideUpwork {
    margin-right: 10em;
}

.grecaptcha-badge {
    bottom: 500px !important;
    left: -5000px !important;
}
