.control-textfield {
    min-width: 200px;
    padding: 4px 16px 4px 16px;
    font-size: 16px;
    border-radius: 12px;
    border: solid 2px #4784c2;
    background-color: white;
    font-family: 'Manrope';
}

.control-textareafield {
    min-width: 200px;
    padding: 4px 16px 4px 16px;
    font-size: 16px;
    border-radius: 12px;
    border: solid 2px #4784c2;
    background-color: white;
    font-family: 'Manrope';
}

.control-select {
    min-width: 200px;
    padding: 4px 16px 4px 16px;
    font-size: 16px;
    border-radius: 12px;
    border: solid 2px #4784c2;
    background-color: white;
    font-family: 'Manrope';
}

.control-select option {
    font-family: 'Manrope', sans-serif;
    font-size: 16px;
}

.control-checkbox {
    appearance: none;
    width: 24px;
    height: 24px;
    border: 2px solid #b1b1b1;
    border-radius: 6px;
    background-color: #ffffff;
    cursor: pointer;
    box-sizing: border-box;
}

.control-checkbox:checked {
    background-color: #4784c2;
    box-shadow: inset 0 0 0 2px #ffffff;
}

.control-file {
    min-width: 200px;
    padding: 0px 16px 0px 0px;
    font-size: 16px;
    border-radius: 12px;
    border: solid 2px #4784c2;
    background-color: white;
    font-family: 'Manrope';
}

.control-file::file-selector-button {
    margin-right: 8px;
    padding: 4px 12px;
    border: 0px solid #168fd0;
    border-radius: 6px;
    background-color: #168fd0;
    color: #fff;
    font-family: inherit;
    font-size: inherit;
    cursor: pointer;
}

.control-submit {
    padding: 12px 24px;
    border: 0px solid #168fd0;
    border-radius: 12px;
    background-color: #168fd0;
    color: #fff;
    font-size: 16px;
    cursor: pointer;
    font-family: 'Manrope';
}

@media (max-width:500px) {
    .control-textareafield {
        max-width: 92%;
    }
}