form {
    width: 100%;
    margin: auto;
    max-width: 500px;
    border: 1px solid;
    background: var(--offset-color);
    padding: 20px;

    display: grid;
    gap: 20px;
}

label {
    display: grid;
    gap: 5px;
}

label div {
    font-family: 'Titillium Web';
    font-size: 0.9em;
    font-weight: bold;
    color: var(--label-color);
}

form input,
form textarea,
form select,
form button {
    width: 100%;
    font-size: 1.15em;
    padding: 5px;
}

form input,
form select {
    height: 35px;
}

form input[type='file'] {
    padding: 0;
}

form select:invalid,
form *::placeholder {
    color: var(--placeholder-color);
}

form textarea {
    height: 70px;
    padding: 5px;
    font-family: 'Rubik';
    resize: vertical;
}

form button {
    margin-top: 10px;
    height: 45px;
    background: var(--action-color);
    border: 0;
    font-weight: bold;
    color: white;
}

form button:disabled {
    opacity: 0.5;
}

.error {
    min-height: 1em;
    color: red;
}

.hidden {
    display: none;
}