/**
 * styles for form elements
 */

label{
    color:var(--color-label);
    display: block;
    margin-bottom: .5em;
}
input,
textarea{
    color:var(--color-input);
    padding: var(--padding-input);
    border:var(--border-input);
    border-radius: var(--border-radius-input);
    background-color: var(--bgcolor-input);
    transition: box-shadow, color, background-color, border;
    transition-duration :var(--transduration-body);
}
textarea{
    height: 80px;
}
input:focus,
textarea:focus{
    color:var(--color-input-focus);
    background-color: var(--bgcolor-input-focus);
    box-shadow: var(--bxshadow-input-focus);
}

input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder {
    color: var(--color-input-placeholder);
}
input::-moz-placeholder,
textarea::-moz-placeholder {
    color: var(--color-input-placeholder);
}
input:-ms-input-placeholder,
textarea::-ms-input-placeholder {
    color: var(--color-input-placeholder);
}
input:-moz-placeholder,
textarea::-moz-placeholder {
    color: var(--color-input-placeholder);
}