#custom-contact-form {
    margin: 5vh 0 10vh 0;
    display: flex;
    flex-direction: column;
    gap: 2vh;
}

.form-question-wrapper {
    border: var(--line);
    padding: 1vh 2vh;
    display: flex;
    flex-direction: column;
    gap: 1vh;
}

#first-name,
#last-name {
    display: flex;
    flex-direction: column;
    gap: 1vh;

}

.form-question-wrapper label {
    text-transform: uppercase;
}

#custom-contact-form input,
#custom-contact-form textarea {
    border: none;
}

#custom-contact-form textarea {
    min-height: 30vh;
}

.form-question-wrapper.name input,
.form-question-wrapper.email input,
.form-question-wrapper.subject input,
#custom-contact-form textarea {
    width: 100%;
    padding: 1vh;
}



#custom-contact-form button {
    padding: 1vh;
    background-color: var(--bkgColour);
    border: var(--line);
    text-transform: uppercase;
    width: 30vw;
}

#custom-contact-form button:hover {
    color: var(--bkgColour);
    background-color: var(--textColour);
    font-weight: bold;
}

.option {
    padding-bottom: 1vh;
}

.option label {
    padding-left: 2vh;
}

@media only screen and (min-device-width: 768px) {
    .form-question-wrapper {
        /* padding: 1vh; */
    }

    .form-question-wrapper.name,
    .form-question-wrapper.email,
    .form-question-wrapper.subject,
    .form-question-wrapper.upload {
        flex-direction: row;
        gap: 2vh;

    }

    #first-name,
    #last-name {
        flex-direction: row;
        gap: 2vh;
        width: 50%;
    }

    #first-name input,
    #last-name input {
        width: 30%;
        flex-grow: 1;
    }

    #custom-contact-form textarea {
        min-height: 20vh;
    }


    #custom-contact-form button {

        width: 20vw;
    }

    #first-name,
    #last-name {

        align-items: center;
    }


    .form-question-wrapper.email,
    .form-question-wrapper.subject {
        align-items: center;
    }
}

@media only screen and (min-device-width: 1200px) {
    .multiple-choice-option-container {
        display: flex;
        gap: 10vw;
    }

    .form-question-wrapper.upload {
        padding: 2vh 1vh;
    }

    #custom-contact-form button {

        width: 10vw;
    }
}