form {
    font-family: 'Alegreya Sans', sans-serif;
    font-weight: 400;
    font-size: 1.4em;
}

input,
select {
    font-family: 'Alegreya Sans', sans-serif;
    font-size: 13pt;
    height: 22px;
    margin-bottom: 11px;
    border: none;
    padding-left: 5px;
}

textarea {
    font-family: 'Alegreya Sans', sans-serif;
    font-size: 13pt;
    border: none;
    padding-left: 5px;

}

select {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    background: url('img/dropdown.png') no-repeat 97% 50% #ffffff;
    background-size: 11px 7px;
    border: solid 1px white;
    width: 100%;
    background-color: white;
    height: 24px;
}

select:invalid {
    color: gray;
}

.form-container {
    width: 100%;
    height: auto;
    min-height: 40vh;
    margin: 0 auto;
}

.field_container {
    width: 100%;
    height: auto;
    background-color: #40bfef;
    overflow: hidden;
}

.form-segment {
    width: 46.3%;
    height: auto;
    min-height: 5vh;
    float: left;
    margin: 4px 0 19px 30px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
}

.long {
    width: 100%;
    height: auto;
}

.short {
    width: 47.4%;
    height: auto;
}

.long input[type=checkbox] {
    width: 1em;
    vertical-align: -4px;

}

input,
textarea {
    width: calc(100% - 5px);
}

label {
    display: block;
    color: white;
    height: 26px;
    margin-top: 12px;
}


/*
#mailing input {
    width: auto;
}
*/

#mailing label {
    display: inline-block;
    margin-left: 0.1em;
    width: auto;
}

#mailing input[type="checkbox"] {
    width: auto;
    height: auto;
    display: inline-block;
}

#mailing input[type="checkbox"]:checked {
    width: auto;
    height: auto;
}

.freetext {
    height: 98px;
    margin-top: 2px;
}

.submit-button {
    width: 20%;
    margin: 0 auto;
}

.terms {
    width: 40%;
    margin: 0 auto;
    text-align: center;
}

.terms input[type=checkbox] {
    width: auto;
    vertical-align: -2px;
}

.terms label {
    display: inline-block;
    color: black;
}

input[type=submit] {
    width: 100%;
    margin: 1.1em auto;
    height: 2.2em;
    font-weight: 900;
    font-size: 1.4em;
    color: white;
    background-color: #93c01f;
    -webkit-appearance: none;
}

#mailemail {
    position: relative;
    width: 30%;
    margin: 0 auto 1% auto;
}

@media screen and (max-width: 768px) {
    .form-segment {
        margin: 4px 0 19px 2.4%;
    }
}

@media screen and (max-width: 670px) {

    input,
    textarea {
        width: calc(100% - 15px);
    }

    .form-segment {
        width: 95%;
    }

    .submit-button {
        width: 80%;
        margin: 0 auto;
    }

    #mailing .form-segment {
        width: 96vw;
        margin: 0 auto;
        float: none;
    }

    #mailing .short {
        width: 100%;
    }

    .terms {
        width: 100%;
        font-size: 0.7em;
    }

    #mailemail {
        width: 90%;
    }
}

.extended {
    width: 95%;
}

.half-width {
    width: 48.7%;
}
